[DE] Support for form tips
This commit is contained in:
Julia Radzhabova
parent
9b6f9afe22
commit
d93a3740e5
|
|
@ -687,6 +687,7 @@
|
|||
font-weight: bold;
|
||||
font-size: 11px;
|
||||
box-shadow: 0 6px 12px rgba(0,0,0,0.175);
|
||||
max-width: 350px;
|
||||
|
||||
padding: 5px 12px;
|
||||
white-space: pre-wrap;
|
||||
|
|
|
|||
|
|
@ -16,7 +16,10 @@ define([
|
|||
labelDocName,
|
||||
btnSubmit,
|
||||
_submitFail, $submitedTooltip, $requiredTooltip,
|
||||
$ttEl, $tooltip;
|
||||
$ttEl, $tooltip,
|
||||
$listControlMenu, listControlItems = [], listObj,
|
||||
bodyWidth = 0,
|
||||
ttOffset = [0, -10];
|
||||
|
||||
DE.Controllers.ApplicationController = Backbone.Controller.extend(_.assign({
|
||||
views: [
|
||||
|
|
@ -173,6 +176,7 @@ define([
|
|||
|
||||
onDocumentResize: function() {
|
||||
this.api && this.api.Resize();
|
||||
bodyWidth = $('body').width();
|
||||
},
|
||||
|
||||
onBeforeUnload: function() {
|
||||
|
|
@ -324,10 +328,11 @@ define([
|
|||
$('#toolbar').addClass('bottom');
|
||||
this.boxSdk.addClass('bottom');
|
||||
$('#box-tools').removeClass('dropdown').addClass('dropup');
|
||||
// ttOffset[1] = -40;
|
||||
ttOffset[1] = -40;
|
||||
} else {
|
||||
$('#toolbar').addClass('top');
|
||||
this.boxSdk.addClass('top');
|
||||
ttOffset[1] = 40;
|
||||
}
|
||||
|
||||
this.appOptions.customization = this.editorConfig.customization;
|
||||
|
|
@ -665,34 +670,50 @@ define([
|
|||
},
|
||||
|
||||
onDocMouseMove: function(data) {
|
||||
var me = this;
|
||||
if (data) {
|
||||
if (data.get_Type() == 1) { // hyperlink
|
||||
var type = data.get_Type();
|
||||
if (type == Asc.c_oAscMouseMoveDataTypes.Hyperlink || type==Asc.c_oAscMouseMoveDataTypes.Form) { // hyperlink
|
||||
this.isHideBodyTip = false;
|
||||
|
||||
var str = (type == Asc.c_oAscMouseMoveDataTypes.Hyperlink) ? me.txtPressLink : data.get_FormHelpText();
|
||||
if (str.length>500)
|
||||
str = str.substr(0, 500) + '...';
|
||||
str = Common.Utils.String.htmlEncode(str);
|
||||
|
||||
if ( !$ttEl ) {
|
||||
$ttEl = $('.hyperlink-tooltip');
|
||||
$ttEl.tooltip({'container':'body', 'trigger':'manual'});
|
||||
$ttEl.on('shown.bs.tooltip', function(e) {
|
||||
$tooltip = $ttEl.data('bs.tooltip').tip();
|
||||
|
||||
$tooltip.css({
|
||||
left: $ttEl.ttpos[0] + ttOffset[0],
|
||||
top: $ttEl.ttpos[1] + ttOffset[1]
|
||||
});
|
||||
|
||||
$tooltip.find('.tooltip-arrow').css({left: 10});
|
||||
});
|
||||
}
|
||||
|
||||
if ( !$tooltip ) {
|
||||
$ttEl.ttpos = [data.get_X(), data.get_Y()];
|
||||
$ttEl.tooltip('show');
|
||||
} else {
|
||||
$tooltip.css({
|
||||
left:data.get_X() + ttOffset[0],
|
||||
top:data.get_Y() + ttOffset[1]
|
||||
});
|
||||
$ttEl.ttpos = [data.get_X(), data.get_Y()];
|
||||
if ( !$tooltip)
|
||||
$tooltip = $ttEl.data('bs.tooltip').tip();
|
||||
|
||||
if (!$tooltip.is(':visible')) {
|
||||
var tip = $ttEl.data('bs.tooltip');
|
||||
tip.options.title = str;
|
||||
tip.show([-1000, -1000]);
|
||||
} else
|
||||
$tooltip.find('.tooltip-inner')['text'](str);
|
||||
|
||||
var ttHeight = $tooltip.height(),
|
||||
ttWidth = $tooltip.width();
|
||||
!bodyWidth && (bodyWidth = $('body').width());
|
||||
|
||||
$ttEl.ttpos[1] -= (ttHeight - ttOffset[1] + 20);
|
||||
if ($ttEl.ttpos[0] + ttWidth + 10 >bodyWidth) {
|
||||
$ttEl.ttpos[0] = bodyWidth - ttWidth - 5;
|
||||
if ($ttEl.ttpos[1] < 0)
|
||||
$ttEl.ttpos[1] += ttHeight + ttOffset[1] + 20;
|
||||
} else if ($ttEl.ttpos[1] < 0) {
|
||||
$ttEl.ttpos[1] = 0;
|
||||
$ttEl.ttpos[0] += 20;
|
||||
}
|
||||
$tooltip.css({
|
||||
left: $ttEl.ttpos[0],
|
||||
top: $ttEl.ttpos[1]
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
|
|
@ -784,6 +805,99 @@ define([
|
|||
}
|
||||
},
|
||||
|
||||
onShowContentControlsActions: function(obj, x, y) {
|
||||
var me = this;
|
||||
switch (obj.type) {
|
||||
case Asc.c_oAscContentControlSpecificType.Picture:
|
||||
if (obj.pr && obj.pr.get_Lock) {
|
||||
var lock = obj.pr.get_Lock();
|
||||
if (lock == Asc.c_oAscSdtLockType.SdtContentLocked || lock==Asc.c_oAscSdtLockType.ContentLocked)
|
||||
return;
|
||||
}
|
||||
this.api.asc_addImage(obj);
|
||||
setTimeout(function(){
|
||||
me.api.asc_UncheckContentControlButtons();
|
||||
}, 500);
|
||||
break;
|
||||
case Asc.c_oAscContentControlSpecificType.DropDownList:
|
||||
case Asc.c_oAscContentControlSpecificType.ComboBox:
|
||||
this.onShowListActions(obj, x, y);
|
||||
break;
|
||||
}
|
||||
},
|
||||
|
||||
onHideContentControlsActions: function() {
|
||||
$listControlMenu && $listControlMenu.hide();
|
||||
this.api.asc_UncheckContentControlButtons();
|
||||
},
|
||||
|
||||
onShowListActions: function(obj, x, y) {
|
||||
var type = obj.type,
|
||||
props = obj.pr,
|
||||
specProps = (type == Asc.c_oAscContentControlSpecificType.ComboBox) ? props.get_ComboBoxPr() : props.get_DropDownListPr(),
|
||||
isForm = !!props.get_FormPr(),
|
||||
me = this;
|
||||
|
||||
var menuContainer = this.view.getMenuForm();
|
||||
|
||||
if (!$listControlMenu) {
|
||||
$listControlMenu = menuContainer.find('ul');
|
||||
$listControlMenu.on('click', 'li', function(e) {
|
||||
var value = $(e.target).attr('value');
|
||||
if (value) {
|
||||
value = parseInt(value);
|
||||
setTimeout(function(){
|
||||
(value!==-1) && me.api.asc_SelectContentControlListItem(listControlItems[value], listObj.get_InternalId());
|
||||
}, 1);
|
||||
}
|
||||
});
|
||||
$('#editor_sdk').on('click', function(e){
|
||||
if (e.target.localName == 'canvas') {
|
||||
if (me._preventClick)
|
||||
me._preventClick = false;
|
||||
else {
|
||||
$listControlMenu && $listControlMenu.hide();
|
||||
me.api.asc_UncheckContentControlButtons();
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
$listControlMenu.find('li').remove();
|
||||
listControlItems = [];
|
||||
listObj = props;
|
||||
|
||||
if (specProps) {
|
||||
var k = 0;
|
||||
if (isForm){ // for dropdown and combobox form control always add placeholder item
|
||||
var text = props.get_PlaceholderText();
|
||||
$listControlMenu.append('<li><a tabindex="-1" type="menuitem" style="opacity: 0.6" value="0">' +
|
||||
((text.trim()!=='') ? text : me.txtEmpty) +
|
||||
'</a></li>');
|
||||
listControlItems.push('');
|
||||
}
|
||||
var count = specProps.get_ItemsCount();
|
||||
k = listControlItems.length;
|
||||
for (var i=0; i<count; i++) {
|
||||
if (specProps.get_ItemValue(i)!=='' || !isForm) {
|
||||
$listControlMenu.append('<li><a tabindex="-1" type="menuitem" value="' + (i+k) + '">' +
|
||||
Common.Utils.String.htmlEncode(specProps.get_ItemDisplayText(i)) +
|
||||
'</a></li>');
|
||||
listControlItems.push(specProps.get_ItemValue(i));
|
||||
}
|
||||
}
|
||||
if (!isForm && listControlItems.length<1) {
|
||||
$listControlMenu.append('<li><a tabindex="-1" type="menuitem" value="0">' +
|
||||
me.txtEmpty +
|
||||
'</a></li>');
|
||||
listControlItems.push(-1);
|
||||
}
|
||||
}
|
||||
|
||||
menuContainer.css({left: x, top : y});
|
||||
me._preventClick = true;
|
||||
$listControlMenu.show();
|
||||
},
|
||||
|
||||
onDocumentContentReady: function() {
|
||||
var me = this;
|
||||
|
||||
|
|
@ -859,6 +973,11 @@ define([
|
|||
this.api.asc_registerCallback('asc_onPrint', _.bind(this.onPrint, this));
|
||||
this.api.asc_registerCallback('asc_onPrintUrl', _.bind(this.onPrintUrl, this));
|
||||
this.api.asc_registerCallback('sync_onAllRequiredFormsFilled', _.bind(this.onFillRequiredFields, this));
|
||||
if (this.appOptions.canFillForms) {
|
||||
this.api.asc_registerCallback('asc_onShowContentControlsActions', _.bind(this.onShowContentControlsActions, this));
|
||||
this.api.asc_registerCallback('asc_onHideContentControlsActions', _.bind(this.onHideContentControlsActions, this));
|
||||
// this.api.asc_SetHighlightRequiredFields(true);
|
||||
}
|
||||
|
||||
Common.Gateway.on('processmouse', _.bind(this.onProcessMouse, this));
|
||||
Common.Gateway.on('downloadas', _.bind(this.onDownloadAs, this));
|
||||
|
|
@ -1024,6 +1143,8 @@ define([
|
|||
textRequired: 'Fill all required fields to send form.',
|
||||
textGotIt: 'Got it',
|
||||
errorForceSave: "An error occurred while saving the file. Please use the 'Download as' option to save the file to your computer hard drive or try again later.",
|
||||
textCloseTip: "Click to close the tip."
|
||||
textCloseTip: "Click to close the tip.",
|
||||
txtPressLink: 'Press Ctrl and click link',
|
||||
txtEmpty: '(Empty)'
|
||||
}, DE.Controllers.ApplicationController));
|
||||
});
|
||||
|
|
|
|||
|
|
@ -10,7 +10,8 @@ define([
|
|||
'use strict';
|
||||
|
||||
var $btnTools;
|
||||
|
||||
var $menuForm;
|
||||
|
||||
DE.Views.ApplicationView = Backbone.View.extend({
|
||||
// Render layout
|
||||
render: function() {
|
||||
|
|
@ -38,6 +39,17 @@ define([
|
|||
return $btnTools.parent().find(name);
|
||||
},
|
||||
|
||||
getMenuForm: function() {
|
||||
if (!$menuForm) {
|
||||
$menuForm = $('<div id="menu-container-form" style="position: absolute; z-index: 10000;" data-value="prevent-canvas-click">' +
|
||||
'<div class="dropdown-toggle" data-toggle="dropdown"></div>' +
|
||||
'<ul class="dropdown-menu" oo_editor_input="true" role="menu" style="right: 0; left: auto;max-height: 200px; overflow-y: auto;"></ul>' +
|
||||
'</div>');
|
||||
$('#editor_sdk').append($menuForm);
|
||||
}
|
||||
return $menuForm;
|
||||
},
|
||||
|
||||
txtDownload: 'Download',
|
||||
txtPrint: 'Print',
|
||||
txtShare: 'Share',
|
||||
|
|
|
|||
|
|
@ -222,7 +222,7 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="hyperlink-tooltip" data-toggle="tooltip" title="Press Ctrl and click the link" style="display:none;"></div>
|
||||
<div class="hyperlink-tooltip" data-toggle="tooltip" title="" style="display:none;"></div>
|
||||
|
||||
<!--vendor-->
|
||||
<script type="text/javascript" src="../../../vendor/jquery/jquery.min.js"></script>
|
||||
|
|
|
|||
|
|
@ -34,6 +34,8 @@
|
|||
"DE.ApplicationController.unknownErrorText": "Unknown error.",
|
||||
"DE.ApplicationController.unsupportedBrowserErrorText": "Your browser is not supported.",
|
||||
"DE.ApplicationController.waitText": "Please, wait...",
|
||||
"DE.ApplicationController.txtEmpty": "(Empty)",
|
||||
"DE.ApplicationController.txtPressLink": "Press Ctrl and click link",
|
||||
"DE.ApplicationView.txtDownload": "Download",
|
||||
"DE.ApplicationView.txtDownloadDocx": "Download as docx",
|
||||
"DE.ApplicationView.txtDownloadPdf": "Download as pdf",
|
||||
|
|
|
|||
Loading…
Reference in a new issue