2016-04-01 13:17:09 +00:00
|
|
|
/*
|
|
|
|
|
*
|
2017-01-17 14:58:08 +00:00
|
|
|
* (c) Copyright Ascensio System Limited 2010-2017
|
2016-04-01 13:17:09 +00:00
|
|
|
*
|
|
|
|
|
* This program is a free software product. You can redistribute it and/or
|
|
|
|
|
* modify it under the terms of the GNU Affero General Public License (AGPL)
|
|
|
|
|
* version 3 as published by the Free Software Foundation. In accordance with
|
|
|
|
|
* Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect
|
|
|
|
|
* that Ascensio System SIA expressly excludes the warranty of non-infringement
|
|
|
|
|
* of any third-party rights.
|
|
|
|
|
*
|
|
|
|
|
* This program is distributed WITHOUT ANY WARRANTY; without even the implied
|
|
|
|
|
* warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. For
|
|
|
|
|
* details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
|
|
|
|
|
*
|
|
|
|
|
* You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
|
|
|
|
|
* EU, LV-1021.
|
|
|
|
|
*
|
|
|
|
|
* The interactive user interfaces in modified source and object code versions
|
|
|
|
|
* of the Program must display Appropriate Legal Notices, as required under
|
|
|
|
|
* Section 5 of the GNU AGPL version 3.
|
|
|
|
|
*
|
|
|
|
|
* Pursuant to Section 7(b) of the License you must retain the original Product
|
|
|
|
|
* logo when distributing the program. Pursuant to Section 7(e) we decline to
|
|
|
|
|
* grant you any rights under trademark law for use of our trademarks.
|
|
|
|
|
*
|
|
|
|
|
* All the Product's GUI elements, including illustrations and icon sets, as
|
|
|
|
|
* well as technical writing content are licensed under the terms of the
|
|
|
|
|
* Creative Commons Attribution-ShareAlike 4.0 International. See the License
|
|
|
|
|
* terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
|
|
|
|
|
*
|
|
|
|
|
*/
|
2016-03-11 00:48:53 +00:00
|
|
|
/**
|
|
|
|
|
* Toolbar.js
|
|
|
|
|
*
|
|
|
|
|
* Toolbar view
|
|
|
|
|
*
|
2017-02-15 13:45:25 +00:00
|
|
|
* Created by Maxim.Kadushkin on 2/13/17
|
|
|
|
|
* Copyright (c) 2017 Ascensio System SIA. All rights reserved.
|
2016-03-11 00:48:53 +00:00
|
|
|
*
|
|
|
|
|
*/
|
|
|
|
|
|
|
|
|
|
define([
|
|
|
|
|
'jquery',
|
|
|
|
|
'underscore',
|
|
|
|
|
'backbone',
|
|
|
|
|
'text!documenteditor/main/app/template/Toolbar.template',
|
|
|
|
|
'common/main/lib/collection/Fonts',
|
|
|
|
|
'common/main/lib/component/Button',
|
|
|
|
|
'common/main/lib/component/ComboBox',
|
|
|
|
|
'common/main/lib/component/DataView',
|
|
|
|
|
'common/main/lib/component/ColorPalette',
|
|
|
|
|
'common/main/lib/component/ThemeColorPalette',
|
|
|
|
|
'common/main/lib/component/Menu',
|
|
|
|
|
'common/main/lib/component/DimensionPicker',
|
|
|
|
|
'common/main/lib/component/Window',
|
|
|
|
|
'common/main/lib/component/ComboBoxFonts',
|
|
|
|
|
'common/main/lib/component/ComboDataView'
|
|
|
|
|
,'common/main/lib/component/SynchronizeTip'
|
2017-02-15 13:45:25 +00:00
|
|
|
], function ($, _, Backbone, template) {
|
2016-03-11 00:48:53 +00:00
|
|
|
'use strict';
|
|
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
DE.Views.Toolbar = Backbone.View.extend(_.extend((function(){
|
|
|
|
|
var $tabs, $boxTabs;
|
|
|
|
|
var $panels, $marker, $scrollL;
|
|
|
|
|
var lastPanel;
|
2017-02-28 10:09:05 +00:00
|
|
|
var isFolded = false;
|
|
|
|
|
var optsFold = {timeout: 2000};
|
2017-02-20 14:51:33 +00:00
|
|
|
|
2017-04-20 10:23:50 +00:00
|
|
|
var config = {};
|
2017-02-27 12:02:37 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
function hasTabInvisible() {
|
|
|
|
|
var _left_bound_ = $boxTabs.offset().left,
|
|
|
|
|
_right_bound_ = _left_bound_ + $boxTabs.width();
|
|
|
|
|
|
|
|
|
|
var tab = $tabs.first().get(0);
|
|
|
|
|
var rect = tab.getBoundingClientRect();
|
|
|
|
|
|
|
|
|
|
if (!(rect.left < _left_bound_)) {
|
|
|
|
|
tab = $tabs.last().get(0);
|
|
|
|
|
rect = tab.getBoundingClientRect();
|
|
|
|
|
|
|
|
|
|
if (!(rect.right > _right_bound_))
|
|
|
|
|
return false;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return true;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function isTabActive(tab) {
|
|
|
|
|
var t = $tabs.filter('.active').find('> a');
|
|
|
|
|
return t.length && t.data('tab') == tab;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function onResize(e) {
|
|
|
|
|
if ( hasTabInvisible() ){
|
|
|
|
|
if ( !$boxTabs.parent().hasClass('short') )
|
|
|
|
|
$boxTabs.parent().addClass('short');
|
|
|
|
|
} else
|
|
|
|
|
if ( $boxTabs.parent().hasClass('short') ) {
|
|
|
|
|
$boxTabs.parent().removeClass('short');
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function onScrollTabs(opts, e) {
|
|
|
|
|
var sv = $boxTabs.scrollLeft();
|
|
|
|
|
if ( sv || opts == 'right') {
|
|
|
|
|
$boxTabs.animate({scrollLeft: opts == 'left' ? sv - 100 : sv + 100}, 200);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
2017-02-28 10:09:05 +00:00
|
|
|
function collapseToolbar() {
|
|
|
|
|
optsFold.$bar.removeClass('expanded');
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function expandToolbar() {
|
|
|
|
|
clearTimeout(optsFold.timer);
|
|
|
|
|
|
|
|
|
|
optsFold.$bar.addClass('expanded');
|
|
|
|
|
optsFold.timer = setTimeout(collapseToolbar, optsFold.timeout);
|
|
|
|
|
}
|
|
|
|
|
|
2017-04-10 13:39:03 +00:00
|
|
|
function onShowCoveredPanel(state) {
|
|
|
|
|
collapseToolbar();
|
|
|
|
|
|
|
|
|
|
if ( state )
|
|
|
|
|
optsFold.$bar.addClass('cover'); else
|
|
|
|
|
optsFold.$bar.removeClass('cover');
|
|
|
|
|
}
|
|
|
|
|
|
2017-04-06 09:34:01 +00:00
|
|
|
function setFolded(value) {
|
|
|
|
|
isFolded = value;
|
2017-02-28 10:09:05 +00:00
|
|
|
|
|
|
|
|
if ( isFolded ) {
|
|
|
|
|
if ( !optsFold.$bar ) optsFold.$bar = this.$el.find('.toolbar');
|
|
|
|
|
if ( !optsFold.$box ) optsFold.$box = this.$el.find('.box-controls');
|
|
|
|
|
|
|
|
|
|
optsFold.$bar.addClass('folded');
|
|
|
|
|
optsFold.$box.on({
|
|
|
|
|
mouseleave: function (e) {
|
|
|
|
|
optsFold.timer = setTimeout(collapseToolbar, optsFold.timeout);
|
|
|
|
|
},
|
|
|
|
|
mouseenter: function (e) {
|
|
|
|
|
clearTimeout(optsFold.timer);
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
// $(document.body).on('focus', 'input, textarea', function(e) {
|
|
|
|
|
// });
|
|
|
|
|
//
|
|
|
|
|
// $(document.body).on('blur', 'input, textarea', function(e) {
|
|
|
|
|
// });
|
|
|
|
|
//
|
|
|
|
|
// Common.NotificationCenter.on({
|
|
|
|
|
// 'modal:show': function(){
|
|
|
|
|
// },
|
|
|
|
|
// 'modal:close': function(dlg) {
|
|
|
|
|
// },
|
|
|
|
|
// 'modal:hide': function(dlg) {
|
|
|
|
|
// },
|
|
|
|
|
// 'dataview:focus': function(e){
|
|
|
|
|
// },
|
|
|
|
|
// 'dataview:blur': function(e){
|
|
|
|
|
// },
|
|
|
|
|
// 'menu:show': function(e){
|
|
|
|
|
// },
|
|
|
|
|
// 'menu:hide': function(e){
|
|
|
|
|
// },
|
|
|
|
|
// 'edit:complete': _.bind(me.onEditComplete, me)
|
|
|
|
|
// });
|
|
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
clearTimeout(optsFold.timer);
|
|
|
|
|
optsFold.$bar.removeClass('folded');
|
|
|
|
|
optsFold.$box.off();
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
return {
|
|
|
|
|
el: '#toolbar',
|
|
|
|
|
|
|
|
|
|
// Compile our stats template
|
2017-02-27 12:02:37 +00:00
|
|
|
// template: _.template(template),
|
2017-02-20 14:51:33 +00:00
|
|
|
|
|
|
|
|
// Delegated events for creating new items, and clearing completed ones.
|
|
|
|
|
events: {
|
|
|
|
|
//
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
initialize: function () {
|
2017-04-20 10:23:50 +00:00
|
|
|
var me = this;
|
|
|
|
|
|
|
|
|
|
config.tabs = [
|
|
|
|
|
{ caption: me.textTabFile, action: 'file'},
|
|
|
|
|
{ caption: me.textTabHome, action: 'home', extcls: 'canedit'},
|
|
|
|
|
{ caption: me.textTabInsert, action: 'ins', extcls: 'canedit'},
|
|
|
|
|
{ caption: me.textTabLayout, action: 'layout', extcls: 'canedit'} ];
|
2017-02-27 12:02:37 +00:00
|
|
|
config.$dom = $(_.template(template, config));
|
|
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
/**
|
|
|
|
|
* UI Components
|
|
|
|
|
*/
|
|
|
|
|
|
|
|
|
|
this.SchemeNames = [
|
|
|
|
|
this.txtScheme1, this.txtScheme2, this.txtScheme3, this.txtScheme4, this.txtScheme5,
|
|
|
|
|
this.txtScheme6, this.txtScheme7, this.txtScheme8, this.txtScheme9, this.txtScheme10,
|
|
|
|
|
this.txtScheme11, this.txtScheme12, this.txtScheme13, this.txtScheme14, this.txtScheme15,
|
|
|
|
|
this.txtScheme16, this.txtScheme17, this.txtScheme18, this.txtScheme19, this.txtScheme20,
|
|
|
|
|
this.txtScheme21
|
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
this.paragraphControls = [];
|
|
|
|
|
this.toolbarControls = [];
|
|
|
|
|
this.textOnlyControls = [];
|
|
|
|
|
this._state = {
|
|
|
|
|
hasCollaborativeChanges: undefined
|
|
|
|
|
};
|
|
|
|
|
this.btnSaveCls = 'btn-save';
|
|
|
|
|
this.btnSaveTip = this.tipSave + Common.Utils.String.platformKey('Ctrl+S');
|
|
|
|
|
|
|
|
|
|
this.btnPrint = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-print',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-print no-mask'
|
|
|
|
|
});
|
|
|
|
|
this.toolbarControls.push(this.btnPrint);
|
|
|
|
|
|
|
|
|
|
this.btnSave = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-save',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'no-mask ' + this.btnSaveCls
|
|
|
|
|
});
|
|
|
|
|
this.toolbarControls.push(this.btnSave);
|
|
|
|
|
|
|
|
|
|
this.btnUndo = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-undo',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-undo'
|
|
|
|
|
});
|
|
|
|
|
this.toolbarControls.push(this.btnUndo);
|
|
|
|
|
|
|
|
|
|
this.btnRedo = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-redo',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-redo'
|
|
|
|
|
});
|
|
|
|
|
this.toolbarControls.push(this.btnRedo);
|
|
|
|
|
|
|
|
|
|
this.btnCopy = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-copy',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-copy'
|
|
|
|
|
});
|
|
|
|
|
this.toolbarControls.push(this.btnCopy);
|
|
|
|
|
|
|
|
|
|
this.btnPaste = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-paste',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-paste'
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnPaste);
|
|
|
|
|
|
|
|
|
|
this.btnIncFontSize = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-incfont',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-incfont'
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnIncFontSize);
|
|
|
|
|
|
|
|
|
|
this.btnDecFontSize = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-decfont',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-decfont'
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnDecFontSize);
|
|
|
|
|
|
|
|
|
|
this.btnBold = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-bold',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-bold',
|
|
|
|
|
enableToggle: true
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnBold);
|
|
|
|
|
|
|
|
|
|
this.btnItalic = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-italic',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-italic',
|
|
|
|
|
enableToggle: true
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnItalic);
|
|
|
|
|
|
|
|
|
|
this.btnUnderline = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-underline',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-underline',
|
|
|
|
|
enableToggle: true
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnUnderline);
|
|
|
|
|
|
|
|
|
|
this.btnStrikeout = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-strikeout',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-strikeout',
|
|
|
|
|
enableToggle: true
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnStrikeout);
|
|
|
|
|
|
|
|
|
|
this.btnSuperscript = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-superscript',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-superscript',
|
|
|
|
|
enableToggle: true,
|
|
|
|
|
toggleGroup: 'superscriptGroup'
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnSuperscript);
|
|
|
|
|
|
|
|
|
|
this.btnSubscript = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-subscript',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-subscript',
|
|
|
|
|
enableToggle: true,
|
|
|
|
|
toggleGroup: 'superscriptGroup'
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnSubscript);
|
|
|
|
|
|
|
|
|
|
this.btnHighlightColor = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-highlight',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-highlight',
|
|
|
|
|
enableToggle: true,
|
|
|
|
|
allowDepress: true,
|
|
|
|
|
split: true,
|
|
|
|
|
menu: new Common.UI.Menu({
|
|
|
|
|
style: 'min-width: 100px;',
|
|
|
|
|
items: [
|
|
|
|
|
{template: _.template('<div id="id-toolbar-menu-highlight" style="width: 120px; height: 120px; margin: 10px;"></div>')},
|
|
|
|
|
{caption: '--'},
|
|
|
|
|
this.mnuHighlightTransparent = new Common.UI.MenuItem({
|
|
|
|
|
caption: this.strMenuNoFill,
|
|
|
|
|
checkable: true
|
2016-03-11 00:48:53 +00:00
|
|
|
})
|
2017-02-20 14:51:33 +00:00
|
|
|
]
|
|
|
|
|
})
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnHighlightColor);
|
|
|
|
|
this.textOnlyControls.push(this.btnHighlightColor);
|
|
|
|
|
|
|
|
|
|
this.btnFontColor = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-fontcolor',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-fontcolor',
|
|
|
|
|
split: true,
|
|
|
|
|
menu: new Common.UI.Menu({
|
|
|
|
|
items: [
|
|
|
|
|
{
|
|
|
|
|
id: 'id-toolbar-menu-auto-fontcolor',
|
|
|
|
|
caption: this.textAutoColor,
|
|
|
|
|
template: _.template('<a tabindex="-1" type="menuitem"><span class="menu-item-icon" style="background-image: none; width: 12px; height: 12px; margin: 1px 7px 0 -7px; background-color: #000;"></span><%= caption %></a>')
|
|
|
|
|
},
|
|
|
|
|
{caption: '--'},
|
|
|
|
|
{template: _.template('<div id="id-toolbar-menu-fontcolor" style="width: 169px; height: 220px; margin: 10px;"></div>')},
|
|
|
|
|
{template: _.template('<a id="id-toolbar-menu-new-fontcolor" style="padding-left:12px;">' + this.textNewColor + '</a>')}
|
|
|
|
|
]
|
|
|
|
|
})
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnFontColor);
|
|
|
|
|
|
|
|
|
|
this.btnParagraphColor = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-paracolor',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-paracolor',
|
|
|
|
|
split: true,
|
|
|
|
|
menu: new Common.UI.Menu({
|
|
|
|
|
items: [
|
|
|
|
|
{template: _.template('<div id="id-toolbar-menu-paracolor" style="width: 169px; height: 220px; margin: 10px;"></div>')},
|
|
|
|
|
{template: _.template('<a id="id-toolbar-menu-new-paracolor" style="padding-left:12px;">' + this.textNewColor + '</a>')}
|
|
|
|
|
]
|
|
|
|
|
})
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnParagraphColor);
|
|
|
|
|
this.textOnlyControls.push(this.btnParagraphColor);
|
|
|
|
|
|
|
|
|
|
this.btnAlignLeft = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-align-left',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-align-left',
|
|
|
|
|
enableToggle: true,
|
|
|
|
|
allowDepress: false,
|
|
|
|
|
toggleGroup: 'alignGroup'
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnAlignLeft);
|
|
|
|
|
|
|
|
|
|
this.btnAlignCenter = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-align-center',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-align-center',
|
|
|
|
|
enableToggle: true,
|
|
|
|
|
allowDepress: false,
|
|
|
|
|
toggleGroup: 'alignGroup'
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnAlignCenter);
|
|
|
|
|
|
|
|
|
|
this.btnAlignRight = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-align-right',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-align-right',
|
|
|
|
|
enableToggle: true,
|
|
|
|
|
allowDepress: false,
|
|
|
|
|
toggleGroup: 'alignGroup'
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnAlignRight);
|
|
|
|
|
|
|
|
|
|
this.btnAlignJust = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-align-just',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-align-just',
|
|
|
|
|
enableToggle: true,
|
|
|
|
|
allowDepress: false,
|
|
|
|
|
toggleGroup: 'alignGroup'
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnAlignJust);
|
|
|
|
|
|
|
|
|
|
this.btnHorizontalAlign = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-halign',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-align-left',
|
|
|
|
|
icls: 'btn-align-left',
|
|
|
|
|
menu: new Common.UI.Menu({
|
|
|
|
|
cls: 'ppm-toolbar',
|
|
|
|
|
items: [
|
|
|
|
|
{
|
|
|
|
|
caption: this.tipAlignLeft + Common.Utils.String.platformKey('Ctrl+L'),
|
|
|
|
|
iconCls: 'mnu-align-left',
|
|
|
|
|
icls: 'btn-align-left',
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'halignGroup',
|
|
|
|
|
checked: true,
|
|
|
|
|
value: 1
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: this.tipAlignCenter + Common.Utils.String.platformKey('Ctrl+E'),
|
|
|
|
|
iconCls: 'mnu-align-center',
|
|
|
|
|
icls: 'btn-align-center',
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'halignGroup',
|
|
|
|
|
value: 2
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: this.tipAlignRight + Common.Utils.String.platformKey('Ctrl+R'),
|
|
|
|
|
iconCls: 'mnu-align-right',
|
|
|
|
|
icls: 'btn-align-right',
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'halignGroup',
|
|
|
|
|
value: 0
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: this.tipAlignJust + Common.Utils.String.platformKey('Ctrl+J'),
|
|
|
|
|
iconCls: 'mnu-align-just',
|
|
|
|
|
icls: 'btn-align-just',
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'halignGroup',
|
|
|
|
|
value: 3
|
|
|
|
|
}
|
|
|
|
|
]
|
|
|
|
|
})
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnHorizontalAlign);
|
|
|
|
|
|
|
|
|
|
this.btnDecLeftOffset = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-decoffset',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-decoffset'
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnDecLeftOffset);
|
|
|
|
|
|
|
|
|
|
this.btnIncLeftOffset = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-incoffset',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-incoffset'
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnIncLeftOffset);
|
|
|
|
|
|
|
|
|
|
this.btnLineSpace = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-linespace',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-linespace',
|
|
|
|
|
menu: new Common.UI.Menu({
|
|
|
|
|
style: 'min-width: 60px;',
|
|
|
|
|
items: [
|
|
|
|
|
{caption: '1.0', value: 1.0, checkable: true, toggleGroup: 'linesize'},
|
|
|
|
|
{caption: '1.15', value: 1.15, checkable: true, toggleGroup: 'linesize'},
|
|
|
|
|
{caption: '1.5', value: 1.5, checkable: true, toggleGroup: 'linesize'},
|
|
|
|
|
{caption: '2.0', value: 2.0, checkable: true, toggleGroup: 'linesize'},
|
|
|
|
|
{caption: '2.5', value: 2.5, checkable: true, toggleGroup: 'linesize'},
|
|
|
|
|
{caption: '3.0', value: 3.0, checkable: true, toggleGroup: 'linesize'}
|
|
|
|
|
]
|
|
|
|
|
})
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnLineSpace);
|
|
|
|
|
|
|
|
|
|
this.btnShowHidenChars = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-hidenchars',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-hidenchars',
|
|
|
|
|
enableToggle: true,
|
|
|
|
|
split: true,
|
|
|
|
|
menu: new Common.UI.Menu({
|
|
|
|
|
style: 'min-width: 60px;',
|
|
|
|
|
items: [
|
|
|
|
|
{caption: this.mniHiddenChars, value: 'characters', checkable: true},
|
|
|
|
|
{caption: this.mniHiddenBorders, value: 'table', checkable: true}
|
|
|
|
|
]
|
|
|
|
|
})
|
|
|
|
|
});
|
|
|
|
|
this.toolbarControls.push(this.btnShowHidenChars);
|
|
|
|
|
|
|
|
|
|
this.btnMarkers = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-markers',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-setmarkers',
|
|
|
|
|
enableToggle: true,
|
|
|
|
|
toggleGroup: 'markersGroup',
|
|
|
|
|
split: true,
|
|
|
|
|
menu: true
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnMarkers);
|
|
|
|
|
this.textOnlyControls.push(this.btnMarkers);
|
|
|
|
|
|
|
|
|
|
this.btnNumbers = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-numbering',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-numbering',
|
|
|
|
|
enableToggle: true,
|
|
|
|
|
toggleGroup: 'markersGroup',
|
|
|
|
|
split: true,
|
|
|
|
|
menu: true
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnNumbers);
|
|
|
|
|
this.textOnlyControls.push(this.btnNumbers);
|
|
|
|
|
|
|
|
|
|
this.btnMultilevels = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-multilevels',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-multilevels',
|
|
|
|
|
menu: true
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnMultilevels);
|
|
|
|
|
this.textOnlyControls.push(this.btnMultilevels);
|
|
|
|
|
|
|
|
|
|
var clone = function (source) {
|
|
|
|
|
var obj = {};
|
|
|
|
|
for (var prop in source)
|
|
|
|
|
obj[prop] = (typeof(source[prop]) == 'object') ? clone(source[prop]) : source[prop];
|
|
|
|
|
return obj;
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
this.mnuMarkersPicker = {
|
|
|
|
|
conf: {index: 0},
|
|
|
|
|
selectByIndex: function (idx) {
|
|
|
|
|
this.conf.index = idx;
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
this.mnuNumbersPicker = clone(this.mnuMarkersPicker);
|
|
|
|
|
this.mnuMultilevelPicker = clone(this.mnuMarkersPicker);
|
|
|
|
|
|
|
|
|
|
this.btnInsertTable = new Common.UI.Button({
|
2017-03-06 09:30:18 +00:00
|
|
|
id: 'tlb-btn-instable',
|
2017-02-20 14:51:33 +00:00
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-inserttable',
|
2017-03-06 09:26:18 +00:00
|
|
|
caption: me.capBtnInsTable,
|
2017-02-20 14:51:33 +00:00
|
|
|
menu: new Common.UI.Menu({
|
|
|
|
|
items: [
|
|
|
|
|
{template: _.template('<div id="id-toolbar-menu-tablepicker" class="dimension-picker" style="margin: 5px 10px;"></div>')},
|
|
|
|
|
{caption: this.mniCustomTable, value: 'custom'}
|
|
|
|
|
]
|
|
|
|
|
})
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnInsertTable);
|
|
|
|
|
|
|
|
|
|
this.btnInsertImage = new Common.UI.Button({
|
2017-03-06 09:30:18 +00:00
|
|
|
id: 'tlb-btn-insimage',
|
2017-02-20 14:51:33 +00:00
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-insertimage',
|
2017-03-06 09:26:18 +00:00
|
|
|
caption: me.capBtnInsImage,
|
2017-02-20 14:51:33 +00:00
|
|
|
menu: new Common.UI.Menu({
|
|
|
|
|
items: [
|
|
|
|
|
{caption: this.mniImageFromFile, value: 'file'},
|
|
|
|
|
{caption: this.mniImageFromUrl, value: 'url'}
|
|
|
|
|
]
|
|
|
|
|
})
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnInsertImage);
|
|
|
|
|
|
|
|
|
|
this.btnInsertChart = new Common.UI.Button({
|
2017-03-06 09:30:18 +00:00
|
|
|
id: 'tlb-btn-inschart',
|
2017-02-20 14:51:33 +00:00
|
|
|
cls: 'btn-toolbar',
|
2017-03-06 09:26:18 +00:00
|
|
|
caption: me.capBtnInsChart,
|
2017-02-20 14:51:33 +00:00
|
|
|
iconCls: 'btn-insertchart',
|
|
|
|
|
menu: new Common.UI.Menu({
|
|
|
|
|
style: 'width: 435px;',
|
|
|
|
|
items: [
|
|
|
|
|
{template: _.template('<div id="id-toolbar-menu-insertchart" class="menu-insertchart" style="margin: 5px 5px 5px 10px;"></div>')}
|
|
|
|
|
]
|
|
|
|
|
})
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnInsertChart);
|
|
|
|
|
|
|
|
|
|
this.btnInsertText = new Common.UI.Button({
|
2017-03-06 09:30:18 +00:00
|
|
|
id: 'tlb-btn-inserttext',
|
2017-02-20 14:51:33 +00:00
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-text',
|
2017-03-06 09:26:18 +00:00
|
|
|
caption: me.capBtnInsTextbox,
|
2017-02-20 14:51:33 +00:00
|
|
|
enableToggle: true,
|
|
|
|
|
split: true,
|
|
|
|
|
menu: new Common.UI.Menu({
|
|
|
|
|
items: [
|
|
|
|
|
{caption: this.textInsText, value: 'text'},
|
|
|
|
|
this.mnuInsertTextArt = new Common.UI.MenuItem({
|
|
|
|
|
caption: this.textInsTextArt,
|
|
|
|
|
value: 'art',
|
|
|
|
|
menu: new Common.UI.Menu({
|
|
|
|
|
menuAlign: 'tl-tr',
|
|
|
|
|
cls: 'menu-shapes',
|
|
|
|
|
items: [
|
|
|
|
|
{template: _.template('<div id="id-toolbar-menu-insart" style="width: 239px; margin-left: 5px;"></div>')}
|
|
|
|
|
]
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
]
|
|
|
|
|
})
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnInsertText);
|
|
|
|
|
|
|
|
|
|
this.btnInsertHyperlink = new Common.UI.Button({
|
2017-03-06 09:30:18 +00:00
|
|
|
id: 'tlb-btn-inshyperlink',
|
2017-02-20 14:51:33 +00:00
|
|
|
cls: 'btn-toolbar',
|
2017-03-06 09:26:18 +00:00
|
|
|
caption: me.capBtnInsLink,
|
2017-02-20 14:51:33 +00:00
|
|
|
iconCls: 'btn-inserthyperlink'
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnInsertHyperlink);
|
|
|
|
|
|
|
|
|
|
this.btnEditHeader = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-editheader',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-editheader',
|
2017-03-06 09:26:18 +00:00
|
|
|
caption: me.capBtnInsHeader,
|
2017-02-20 14:51:33 +00:00
|
|
|
menu: true
|
|
|
|
|
});
|
|
|
|
|
this.mnuPageNumberPosPicker = {
|
|
|
|
|
conf: {disabled: false},
|
|
|
|
|
isDisabled: function () {
|
|
|
|
|
return this.conf.disabled;
|
|
|
|
|
},
|
|
|
|
|
setDisabled: function (val) {
|
|
|
|
|
this.conf.disabled = val;
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
this.mnuPageNumCurrentPos = clone(this.mnuPageNumberPosPicker);
|
|
|
|
|
this.mnuInsertPageNum = clone(this.mnuPageNumberPosPicker);
|
|
|
|
|
this.mnuInsertPageCount = clone(this.mnuPageNumberPosPicker);
|
|
|
|
|
this.paragraphControls.push(this.mnuPageNumCurrentPos);
|
|
|
|
|
this.paragraphControls.push(this.mnuInsertPageCount);
|
|
|
|
|
this.toolbarControls.push(this.btnEditHeader);
|
|
|
|
|
|
|
|
|
|
this.btnInsertShape = new Common.UI.Button({
|
2017-03-06 09:30:18 +00:00
|
|
|
id: 'tlb-btn-insshape',
|
2017-02-20 14:51:33 +00:00
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-insertshape',
|
2017-03-06 09:26:18 +00:00
|
|
|
caption: me.capBtnInsShape,
|
2017-02-20 14:51:33 +00:00
|
|
|
enableToggle: true,
|
|
|
|
|
menu: new Common.UI.Menu({cls: 'menu-shapes'})
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnInsertShape);
|
|
|
|
|
|
|
|
|
|
this.btnInsertEquation = new Common.UI.Button({
|
2017-03-06 09:30:18 +00:00
|
|
|
id: 'tlb-btn-insequation',
|
2017-02-20 14:51:33 +00:00
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-insertequation',
|
2017-03-06 09:26:18 +00:00
|
|
|
caption: me.capBtnInsEquation,
|
2017-02-20 14:51:33 +00:00
|
|
|
split: true,
|
|
|
|
|
menu: new Common.UI.Menu({cls: 'menu-shapes'})
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnInsertEquation);
|
|
|
|
|
|
|
|
|
|
this.btnDropCap = new Common.UI.Button({
|
2017-03-06 09:30:18 +00:00
|
|
|
id: 'tlb-btn-dropcap',
|
2017-02-20 14:51:33 +00:00
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-dropcap',
|
2017-03-06 09:26:18 +00:00
|
|
|
caption: me.capBtnInsDropcap,
|
2017-02-20 14:51:33 +00:00
|
|
|
menu: new Common.UI.Menu({
|
|
|
|
|
cls: 'ppm-toolbar',
|
|
|
|
|
items: [
|
|
|
|
|
{
|
|
|
|
|
caption: this.textNone,
|
|
|
|
|
iconCls: 'mnu-dropcap-none',
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'menuDropCap',
|
|
|
|
|
value: Asc.c_oAscDropCap.None,
|
|
|
|
|
checked: true
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: this.textInText,
|
|
|
|
|
iconCls: 'mnu-dropcap-intext',
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'menuDropCap',
|
|
|
|
|
value: Asc.c_oAscDropCap.Drop
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: this.textInMargin,
|
|
|
|
|
iconCls: 'mnu-dropcap-inmargin',
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'menuDropCap',
|
|
|
|
|
value: Asc.c_oAscDropCap.Margin
|
|
|
|
|
},
|
|
|
|
|
{caption: '--'},
|
|
|
|
|
this.mnuDropCapAdvanced = new Common.UI.MenuItem({caption: this.mniEditDropCap})
|
|
|
|
|
]
|
|
|
|
|
})
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnDropCap);
|
|
|
|
|
|
|
|
|
|
this.btnColumns = new Common.UI.Button({
|
2017-03-06 09:30:18 +00:00
|
|
|
id: 'tlb-btn-columns',
|
2017-02-20 14:51:33 +00:00
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-columns',
|
2017-03-06 09:26:18 +00:00
|
|
|
caption: me.capBtnColumns,
|
2017-02-20 14:51:33 +00:00
|
|
|
menu: new Common.UI.Menu({
|
|
|
|
|
cls: 'ppm-toolbar',
|
|
|
|
|
items: [
|
|
|
|
|
{
|
|
|
|
|
caption: this.textColumnsOne,
|
|
|
|
|
iconCls: 'mnu-columns-one',
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'menuColumns',
|
|
|
|
|
value: 0
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: this.textColumnsTwo,
|
|
|
|
|
iconCls: 'mnu-columns-two',
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'menuColumns',
|
|
|
|
|
value: 1
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: this.textColumnsThree,
|
|
|
|
|
iconCls: 'mnu-columns-three',
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'menuColumns',
|
|
|
|
|
value: 2
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: this.textColumnsLeft,
|
|
|
|
|
iconCls: 'mnu-columns-left',
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'menuColumns',
|
|
|
|
|
value: 3
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: this.textColumnsRight,
|
|
|
|
|
iconCls: 'mnu-columns-right',
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'menuColumns',
|
|
|
|
|
value: 4
|
|
|
|
|
}
|
|
|
|
|
]
|
|
|
|
|
})
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnColumns);
|
|
|
|
|
|
|
|
|
|
this.btnPageOrient = new Common.UI.Button({
|
2017-03-06 09:30:18 +00:00
|
|
|
id: 'tlb-btn-pageorient',
|
2017-02-20 14:51:33 +00:00
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-pageorient',
|
2017-03-06 09:26:18 +00:00
|
|
|
caption: me.capBtnPageOrient,
|
2017-02-20 14:51:33 +00:00
|
|
|
menu: new Common.UI.Menu({
|
|
|
|
|
cls: 'ppm-toolbar',
|
|
|
|
|
items: [
|
|
|
|
|
{
|
|
|
|
|
caption: this.textPortrait,
|
|
|
|
|
iconCls: 'mnu-orient-portrait',
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'menuOrient',
|
|
|
|
|
value: true
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: this.textLandscape,
|
|
|
|
|
iconCls: 'mnu-orient-landscape',
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'menuOrient',
|
|
|
|
|
value: false
|
|
|
|
|
}
|
|
|
|
|
]
|
|
|
|
|
})
|
|
|
|
|
});
|
|
|
|
|
this.toolbarControls.push(this.btnPageOrient);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var pageMarginsTemplate = _.template('<a id="<%= id %>" tabindex="-1" type="menuitem"><div><b><%= caption %></b></div>' +
|
|
|
|
|
'<% if (options.value !== null) { %><div style="display: inline-block;margin-right: 20px;min-width: 80px;">' +
|
|
|
|
|
'<label style="display: block;">' + this.textTop + '<%= parseFloat(Common.Utils.Metric.fnRecalcFromMM(options.value[0]).toFixed(2)) %> <%= Common.Utils.Metric.getCurrentMetricName() %></label>' +
|
|
|
|
|
'<label style="display: block;">' + this.textLeft + '<%= parseFloat(Common.Utils.Metric.fnRecalcFromMM(options.value[1]).toFixed(2)) %> <%= Common.Utils.Metric.getCurrentMetricName() %></label></div><div style="display: inline-block;">' +
|
|
|
|
|
'<label style="display: block;">' + this.textBottom + '<%= parseFloat(Common.Utils.Metric.fnRecalcFromMM(options.value[2]).toFixed(2)) %> <%= Common.Utils.Metric.getCurrentMetricName() %></label>' +
|
|
|
|
|
'<label style="display: block;">' + this.textRight + '<%= parseFloat(Common.Utils.Metric.fnRecalcFromMM(options.value[3]).toFixed(2)) %> <%= Common.Utils.Metric.getCurrentMetricName() %></label></div>' +
|
|
|
|
|
'<% } %></a>');
|
|
|
|
|
|
|
|
|
|
this.btnPageMargins = new Common.UI.Button({
|
2017-03-06 09:30:18 +00:00
|
|
|
id: 'tlb-btn-pagemargins',
|
2017-02-20 14:51:33 +00:00
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-pagemargins',
|
2017-03-06 09:26:18 +00:00
|
|
|
caption: me.capBtnMargins,
|
2017-02-20 14:51:33 +00:00
|
|
|
menu: new Common.UI.Menu({
|
|
|
|
|
items: [
|
|
|
|
|
{
|
|
|
|
|
caption: this.textMarginsLast,
|
|
|
|
|
checkable: true,
|
|
|
|
|
template: pageMarginsTemplate,
|
|
|
|
|
toggleGroup: 'menuPageMargins'
|
|
|
|
|
}, //top,left,bottom,right
|
|
|
|
|
{
|
|
|
|
|
caption: this.textMarginsNormal,
|
|
|
|
|
checkable: true,
|
|
|
|
|
template: pageMarginsTemplate,
|
|
|
|
|
toggleGroup: 'menuPageMargins',
|
|
|
|
|
value: [20, 30, 20, 15]
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: this.textMarginsUsNormal,
|
|
|
|
|
checkable: true,
|
|
|
|
|
template: pageMarginsTemplate,
|
|
|
|
|
toggleGroup: 'menuPageMargins',
|
|
|
|
|
value: [25.4, 25.4, 25.4, 25.4]
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: this.textMarginsNarrow,
|
|
|
|
|
checkable: true,
|
|
|
|
|
template: pageMarginsTemplate,
|
|
|
|
|
toggleGroup: 'menuPageMargins',
|
|
|
|
|
value: [12.7, 12.7, 12.7, 12.7]
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: this.textMarginsModerate,
|
|
|
|
|
checkable: true,
|
|
|
|
|
template: pageMarginsTemplate,
|
|
|
|
|
toggleGroup: 'menuPageMargins',
|
|
|
|
|
value: [25.4, 19.1, 25.4, 19.1]
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: this.textMarginsWide,
|
|
|
|
|
checkable: true,
|
|
|
|
|
template: pageMarginsTemplate,
|
|
|
|
|
toggleGroup: 'menuPageMargins',
|
|
|
|
|
value: [25.4, 50.8, 25.4, 50.8]
|
|
|
|
|
},
|
|
|
|
|
{caption: '--'},
|
|
|
|
|
{caption: this.textPageMarginsCustom, value: 'advanced'}
|
|
|
|
|
]
|
|
|
|
|
})
|
|
|
|
|
});
|
|
|
|
|
this.toolbarControls.push(this.btnPageMargins);
|
|
|
|
|
|
|
|
|
|
var pageSizeTemplate = _.template('<a id="<%= id %>" tabindex="-1" type="menuitem"><div><b><%= caption %></b></div>' +
|
|
|
|
|
'<div><%= parseFloat(Common.Utils.Metric.fnRecalcFromMM(options.value[0]).toFixed(2)) %> <%= Common.Utils.Metric.getCurrentMetricName() %> x ' +
|
|
|
|
|
'<%= parseFloat(Common.Utils.Metric.fnRecalcFromMM(options.value[1]).toFixed(2)) %> <%= Common.Utils.Metric.getCurrentMetricName() %></div></a>');
|
|
|
|
|
|
|
|
|
|
this.btnPageSize = new Common.UI.Button({
|
2017-03-06 09:30:18 +00:00
|
|
|
id: 'tlb-btn-pagesize',
|
2017-02-20 14:51:33 +00:00
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-pagesize',
|
2017-03-06 09:26:18 +00:00
|
|
|
caption: me.capBtnPageSize,
|
2017-02-20 14:51:33 +00:00
|
|
|
menu: new Common.UI.Menu({
|
|
|
|
|
items: [
|
|
|
|
|
{
|
|
|
|
|
caption: 'US Letter',
|
|
|
|
|
subtitle: '21,59cm x 27,94cm',
|
|
|
|
|
template: pageSizeTemplate,
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'menuPageSize',
|
|
|
|
|
value: [215.9, 279.4]
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: 'US Legal',
|
|
|
|
|
subtitle: '21,59cm x 35,56cm',
|
|
|
|
|
template: pageSizeTemplate,
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'menuPageSize',
|
|
|
|
|
value: [215.9, 355.6]
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: 'A4',
|
|
|
|
|
subtitle: '21cm x 29,7cm',
|
|
|
|
|
template: pageSizeTemplate,
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'menuPageSize',
|
|
|
|
|
value: [210, 297],
|
|
|
|
|
checked: true
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: 'A5',
|
|
|
|
|
subtitle: '14,81cm x 20,99cm',
|
|
|
|
|
template: pageSizeTemplate,
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'menuPageSize',
|
|
|
|
|
value: [148.1, 209.9]
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: 'B5',
|
|
|
|
|
subtitle: '17,6cm x 25,01cm',
|
|
|
|
|
template: pageSizeTemplate,
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'menuPageSize',
|
|
|
|
|
value: [176, 250.1]
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: 'Envelope #10',
|
|
|
|
|
subtitle: '10,48cm x 24,13cm',
|
|
|
|
|
template: pageSizeTemplate,
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'menuPageSize',
|
|
|
|
|
value: [104.8, 241.3]
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: 'Envelope DL',
|
|
|
|
|
subtitle: '11,01cm x 22,01cm',
|
|
|
|
|
template: pageSizeTemplate,
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'menuPageSize',
|
|
|
|
|
value: [110.1, 220.1]
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: 'Tabloid',
|
|
|
|
|
subtitle: '27,94cm x 43,17cm',
|
|
|
|
|
template: pageSizeTemplate,
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'menuPageSize',
|
|
|
|
|
value: [279.4, 431.7]
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: 'A3',
|
|
|
|
|
subtitle: '29,7cm x 42,01cm',
|
|
|
|
|
template: pageSizeTemplate,
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'menuPageSize',
|
|
|
|
|
value: [297, 420.1]
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: 'Tabloid Oversize',
|
|
|
|
|
subtitle: '30,48cm x 45,71cm',
|
|
|
|
|
template: pageSizeTemplate,
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'menuPageSize',
|
|
|
|
|
value: [304.8, 457.1]
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: 'ROC 16K',
|
|
|
|
|
subtitle: '19,68cm x 27,3cm',
|
|
|
|
|
template: pageSizeTemplate,
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'menuPageSize',
|
|
|
|
|
value: [196.8, 273]
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: 'Envelope Choukei 3',
|
|
|
|
|
subtitle: '11,99cm x 23,49cm',
|
|
|
|
|
template: pageSizeTemplate,
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'menuPageSize',
|
|
|
|
|
value: [119.9, 234.9]
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
caption: 'Super B/A3',
|
|
|
|
|
subtitle: '33,02cm x 48,25cm',
|
|
|
|
|
template: pageSizeTemplate,
|
|
|
|
|
checkable: true,
|
|
|
|
|
toggleGroup: 'menuPageSize',
|
|
|
|
|
value: [330.2, 482.5]
|
|
|
|
|
},
|
|
|
|
|
{caption: '--'},
|
|
|
|
|
{caption: this.textPageSizeCustom, value: 'advanced'}
|
|
|
|
|
]
|
|
|
|
|
})
|
|
|
|
|
});
|
|
|
|
|
this.toolbarControls.push(this.btnPageSize);
|
|
|
|
|
|
|
|
|
|
this.btnClearStyle = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-clearstyle',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-clearstyle'
|
|
|
|
|
});
|
|
|
|
|
this.toolbarControls.push(this.btnClearStyle);
|
|
|
|
|
|
|
|
|
|
this.btnCopyStyle = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-copystyle',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-copystyle',
|
|
|
|
|
enableToggle: true
|
|
|
|
|
});
|
|
|
|
|
this.toolbarControls.push(this.btnCopyStyle);
|
|
|
|
|
|
|
|
|
|
this.btnColorSchemas = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-colorschemas',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-colorschemas',
|
|
|
|
|
menu: new Common.UI.Menu({
|
|
|
|
|
items: [],
|
|
|
|
|
maxHeight: 600,
|
|
|
|
|
restoreHeight: 600
|
|
|
|
|
}).on('show:before', function (mnu) {
|
|
|
|
|
if (!this.scroller) {
|
|
|
|
|
this.scroller = new Common.UI.Scroller({
|
|
|
|
|
el: $(this.el).find('.dropdown-menu '),
|
|
|
|
|
useKeyboard: this.enableKeyEvents && !this.handleSelect,
|
|
|
|
|
minScrollbarLength: 40,
|
|
|
|
|
alwaysVisibleY: true
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
}).on('show:after', function (btn, e) {
|
|
|
|
|
var mnu = $(this.el).find('.dropdown-menu '),
|
|
|
|
|
docH = $(document).height(),
|
|
|
|
|
menuH = mnu.outerHeight(),
|
|
|
|
|
top = parseInt(mnu.css('top'));
|
|
|
|
|
|
|
|
|
|
if (menuH > docH) {
|
|
|
|
|
mnu.css('max-height', (docH - parseInt(mnu.css('padding-top')) - parseInt(mnu.css('padding-bottom')) - 5) + 'px');
|
|
|
|
|
this.scroller.update({minScrollbarLength: 40});
|
|
|
|
|
} else if (mnu.height() < this.options.restoreHeight) {
|
|
|
|
|
mnu.css('max-height', (Math.min(docH - parseInt(mnu.css('padding-top')) - parseInt(mnu.css('padding-bottom')) - 5, this.options.restoreHeight)) + 'px');
|
|
|
|
|
menuH = mnu.outerHeight();
|
|
|
|
|
if (top + menuH > docH) {
|
|
|
|
|
mnu.css('top', 0);
|
|
|
|
|
}
|
|
|
|
|
this.scroller.update({minScrollbarLength: 40});
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
});
|
|
|
|
|
this.toolbarControls.push(this.btnColorSchemas);
|
|
|
|
|
|
|
|
|
|
this.btnNotes = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-notes',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-notes',
|
2017-04-19 12:09:44 +00:00
|
|
|
caption: me.capBtnInsFootnote,
|
2017-02-20 14:51:33 +00:00
|
|
|
split: true,
|
|
|
|
|
menu: true
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.btnNotes);
|
|
|
|
|
|
|
|
|
|
this.btnMailRecepients = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-mailrecepients',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-mailrecepients'
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
this.btnHide = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-hidebars',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-hidebars no-mask',
|
|
|
|
|
menu: true
|
|
|
|
|
});
|
|
|
|
|
this.toolbarControls.push(this.btnHide);
|
|
|
|
|
|
|
|
|
|
this.btnFitPage = {
|
|
|
|
|
conf: {checked: false},
|
|
|
|
|
setChecked: function (val) {
|
|
|
|
|
this.conf.checked = val;
|
|
|
|
|
},
|
|
|
|
|
isChecked: function () {
|
|
|
|
|
return this.conf.checked;
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
this.btnFitWidth = clone(this.btnFitPage);
|
|
|
|
|
this.mnuZoom = {options: {value: 100}};
|
|
|
|
|
|
|
|
|
|
this.btnAdvSettings = new Common.UI.Button({
|
|
|
|
|
id: 'id-toolbar-btn-settings',
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-settings no-mask'
|
|
|
|
|
});
|
|
|
|
|
this.toolbarControls.push(this.btnAdvSettings);
|
|
|
|
|
|
2017-03-29 16:24:20 +00:00
|
|
|
me.btnImgAlign = new Common.UI.Button({
|
|
|
|
|
cls: 'btn-toolbar',
|
2017-04-04 14:47:21 +00:00
|
|
|
iconCls: 'btn-img-align',
|
2017-03-29 16:24:20 +00:00
|
|
|
caption: me.capImgAlign,
|
|
|
|
|
menu: true
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
me.btnImgGroup = new Common.UI.Button({
|
|
|
|
|
cls: 'btn-toolbar',
|
2017-04-04 14:47:21 +00:00
|
|
|
iconCls: 'btn-img-group',
|
2017-03-29 16:24:20 +00:00
|
|
|
caption: me.capImgGroup,
|
|
|
|
|
menu: true
|
|
|
|
|
});
|
|
|
|
|
me.btnImgForward = new Common.UI.Button({
|
|
|
|
|
cls: 'btn-toolbar',
|
2017-04-04 14:47:21 +00:00
|
|
|
iconCls: 'btn-img-frwd',
|
2017-03-29 16:24:20 +00:00
|
|
|
caption: me.capImgForward,
|
2017-04-04 15:43:19 +00:00
|
|
|
split: true,
|
2017-03-29 16:24:20 +00:00
|
|
|
menu: true
|
|
|
|
|
});
|
|
|
|
|
me.btnImgBackward = new Common.UI.Button({
|
|
|
|
|
cls: 'btn-toolbar',
|
2017-04-04 14:47:21 +00:00
|
|
|
iconCls: 'btn-img-bkwd',
|
2017-03-29 16:24:20 +00:00
|
|
|
caption: me.capImgBackward,
|
2017-04-04 15:43:19 +00:00
|
|
|
split: true,
|
2017-03-29 16:24:20 +00:00
|
|
|
menu: true
|
|
|
|
|
});
|
|
|
|
|
me.btnImgWrapping = new Common.UI.Button({
|
|
|
|
|
cls: 'btn-toolbar',
|
2017-04-04 14:47:21 +00:00
|
|
|
iconCls: 'btn-img-wrap',
|
2017-03-29 16:24:20 +00:00
|
|
|
caption: me.capImgWrapping,
|
|
|
|
|
menu: true
|
|
|
|
|
});
|
|
|
|
|
me.toolbarControls.push( me.btnImgAlign,
|
|
|
|
|
me.btnImgGroup, me.btnImgForward, me.btnImgBackward, me.btnImgWrapping);
|
|
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
//
|
|
|
|
|
// Menus
|
|
|
|
|
//
|
|
|
|
|
|
|
|
|
|
this.mnuLineSpace = this.btnLineSpace.menu;
|
|
|
|
|
this.mnuNonPrinting = this.btnShowHidenChars.menu;
|
|
|
|
|
this.mnuInsertTable = this.btnInsertTable.menu;
|
|
|
|
|
this.mnuInsertImage = this.btnInsertImage.menu;
|
|
|
|
|
this.mnuPageSize = this.btnPageSize.menu;
|
|
|
|
|
this.mnuColorSchema = this.btnColorSchemas.menu;
|
|
|
|
|
|
|
|
|
|
//
|
|
|
|
|
// DataView and pickers
|
|
|
|
|
//
|
|
|
|
|
|
|
|
|
|
this.btnHighlightColor.on('render:after', function (btn) {
|
|
|
|
|
var colorVal = $('<div class="btn-color-value-line"></div>');
|
|
|
|
|
$('button:first-child', btn.cmpEl).append(colorVal);
|
|
|
|
|
btn.currentColor = 'FFFF00';
|
|
|
|
|
colorVal.css('background-color', '#' + btn.currentColor);
|
|
|
|
|
|
|
|
|
|
me.mnuHighlightColorPicker = new Common.UI.ColorPalette({
|
|
|
|
|
el: $('#id-toolbar-menu-highlight'),
|
|
|
|
|
value: 'FFFF00',
|
|
|
|
|
colors: [
|
|
|
|
|
'FFFF00', '00FF00', '00FFFF', 'FF00FF', '0000FF', 'FF0000', '00008B', '008B8B',
|
|
|
|
|
'006400', '800080', '8B0000', '808000', 'FFFFFF', 'D3D3D3', 'A9A9A9', '000000'
|
|
|
|
|
]
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
me.mnuHighlightColorPicker.select('FFFF00');
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
this.btnFontColor.on('render:after', function (btn) {
|
|
|
|
|
var colorVal = $('<div class="btn-color-value-line"></div>');
|
|
|
|
|
$('button:first-child', btn.cmpEl).append(colorVal);
|
|
|
|
|
colorVal.css('background-color', btn.currentColor || 'transparent');
|
|
|
|
|
|
|
|
|
|
me.mnuFontColorPicker = new Common.UI.ThemeColorPalette({
|
|
|
|
|
el: $('#id-toolbar-menu-fontcolor')
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
this.btnParagraphColor.on('render:after', function (btn) {
|
|
|
|
|
var colorVal = $('<div class="btn-color-value-line"></div>');
|
|
|
|
|
$('button:first-child', btn.cmpEl).append(colorVal);
|
|
|
|
|
colorVal.css('background-color', btn.currentColor || 'transparent');
|
|
|
|
|
|
|
|
|
|
me.mnuParagraphColorPicker = new Common.UI.ThemeColorPalette({
|
|
|
|
|
el: $('#id-toolbar-menu-paracolor'),
|
|
|
|
|
transparent: true
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
this.cmbFontSize = new Common.UI.ComboBox({
|
|
|
|
|
cls: 'input-group-nr',
|
|
|
|
|
menuStyle: 'min-width: 55px;',
|
|
|
|
|
hint: this.tipFontSize,
|
|
|
|
|
data: [
|
|
|
|
|
{value: 8, displayValue: "8"},
|
|
|
|
|
{value: 9, displayValue: "9"},
|
|
|
|
|
{value: 10, displayValue: "10"},
|
|
|
|
|
{value: 11, displayValue: "11"},
|
|
|
|
|
{value: 12, displayValue: "12"},
|
|
|
|
|
{value: 14, displayValue: "14"},
|
|
|
|
|
{value: 16, displayValue: "16"},
|
|
|
|
|
{value: 18, displayValue: "18"},
|
|
|
|
|
{value: 20, displayValue: "20"},
|
|
|
|
|
{value: 22, displayValue: "22"},
|
|
|
|
|
{value: 24, displayValue: "24"},
|
|
|
|
|
{value: 26, displayValue: "26"},
|
|
|
|
|
{value: 28, displayValue: "28"},
|
|
|
|
|
{value: 36, displayValue: "36"},
|
|
|
|
|
{value: 48, displayValue: "48"},
|
|
|
|
|
{value: 72, displayValue: "72"}
|
2016-03-11 00:48:53 +00:00
|
|
|
]
|
|
|
|
|
});
|
2017-02-20 14:51:33 +00:00
|
|
|
this.paragraphControls.push(this.cmbFontSize);
|
|
|
|
|
|
|
|
|
|
this.cmbFontName = new Common.UI.ComboBoxFonts({
|
|
|
|
|
cls: 'input-group-nr',
|
|
|
|
|
menuCls: 'scrollable-menu',
|
|
|
|
|
menuStyle: 'min-width: 325px;',
|
|
|
|
|
hint: this.tipFontName,
|
|
|
|
|
store: new Common.Collections.Fonts()
|
|
|
|
|
});
|
|
|
|
|
this.paragraphControls.push(this.cmbFontName);
|
2016-03-11 00:48:53 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
this.listStylesAdditionalMenuItem = new Common.UI.MenuItem({
|
|
|
|
|
template: _.template(
|
|
|
|
|
'<div id="id-save-style-container" class = "save-style-container">' +
|
2016-03-11 00:48:53 +00:00
|
|
|
'<span id="id-save-style-plus" class="plus img-commonctrl" ></span>' +
|
|
|
|
|
'<label id="id-save-style-link" class="save-style-link" >' + me.textStyleMenuNew + '</label>' +
|
2017-02-20 14:51:33 +00:00
|
|
|
'</div>')
|
|
|
|
|
});
|
2016-03-11 00:48:53 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
this.listStyles = new Common.UI.ComboDataView({
|
|
|
|
|
cls: 'combo-styles',
|
|
|
|
|
itemWidth: 104,
|
|
|
|
|
itemHeight: 38,
|
2016-03-11 00:48:53 +00:00
|
|
|
// hint : this.tipParagraphStyle,
|
2017-02-20 14:51:33 +00:00
|
|
|
enableKeyEvents: true,
|
|
|
|
|
additionalMenuItems: [this.listStylesAdditionalMenuItem],
|
|
|
|
|
beforeOpenHandler: function (e) {
|
|
|
|
|
var cmp = this,
|
|
|
|
|
menu = cmp.openButton.menu,
|
|
|
|
|
minMenuColumn = 6;
|
|
|
|
|
|
|
|
|
|
if (menu.cmpEl) {
|
|
|
|
|
var itemEl = $(cmp.cmpEl.find('.dataview.inner .style').get(0)).parent();
|
|
|
|
|
var itemMargin = /*parseInt($(itemEl.get(0)).parent().css('margin-right'))*/-1;
|
|
|
|
|
var itemWidth = itemEl.is(':visible') ? parseInt(itemEl.css('width')) :
|
|
|
|
|
(cmp.itemWidth + parseInt(itemEl.css('padding-left')) + parseInt(itemEl.css('padding-right')) +
|
|
|
|
|
parseInt(itemEl.css('border-left-width')) + parseInt(itemEl.css('border-right-width')));
|
|
|
|
|
|
|
|
|
|
var minCount = cmp.menuPicker.store.length >= minMenuColumn ? minMenuColumn : cmp.menuPicker.store.length,
|
|
|
|
|
columnCount = Math.min(cmp.menuPicker.store.length, Math.round($('.dataview', $(cmp.fieldPicker.el)).width() / (itemMargin + itemWidth) + 0.5));
|
|
|
|
|
|
|
|
|
|
columnCount = columnCount < minCount ? minCount : columnCount;
|
|
|
|
|
menu.menuAlignEl = cmp.cmpEl;
|
|
|
|
|
|
|
|
|
|
menu.menuAlign = 'tl-tl';
|
|
|
|
|
var offset = cmp.cmpEl.width() - cmp.openButton.$el.width() - columnCount * (itemMargin + itemWidth) - 1;
|
|
|
|
|
menu.setOffset(Math.min(offset, 0));
|
|
|
|
|
|
|
|
|
|
menu.cmpEl.css({
|
|
|
|
|
'width': columnCount * (itemWidth + itemMargin),
|
|
|
|
|
'min-height': cmp.cmpEl.height()
|
|
|
|
|
});
|
|
|
|
|
}
|
2016-03-11 00:48:53 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
if (cmp.menuPicker.scroller) {
|
|
|
|
|
cmp.menuPicker.scroller.update({
|
|
|
|
|
includePadding: true,
|
|
|
|
|
suppressScrollX: true
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
cmp.removeTips();
|
2016-03-11 00:48:53 +00:00
|
|
|
}
|
2017-02-20 14:51:33 +00:00
|
|
|
});
|
|
|
|
|
|
|
|
|
|
this.listStyles.fieldPicker.itemTemplate = _.template([
|
|
|
|
|
'<div class="style" id="<%= id %>">',
|
|
|
|
|
'<div style="background-image: url(<%= imageUrl %>); width: ' + this.listStyles.itemWidth + 'px; height: ' + this.listStyles.itemHeight + 'px;"/>',
|
|
|
|
|
'</div>'
|
|
|
|
|
].join(''));
|
|
|
|
|
this.listStyles.menuPicker.itemTemplate = _.template([
|
|
|
|
|
'<div class="style" id="<%= id %>">',
|
|
|
|
|
'<div style="background-image: url(<%= imageUrl %>); width: ' + this.listStyles.itemWidth + 'px; height: ' + this.listStyles.itemHeight + 'px;"/>',
|
|
|
|
|
'</div>'
|
|
|
|
|
].join(''));
|
|
|
|
|
this.paragraphControls.push(this.listStyles);
|
|
|
|
|
this.textOnlyControls.push(this.listStyles);
|
|
|
|
|
|
|
|
|
|
// Disable all components before load document
|
|
|
|
|
_.each(this.toolbarControls.concat(this.paragraphControls), function (cmp) {
|
|
|
|
|
if (_.isFunction(cmp.setDisabled))
|
|
|
|
|
cmp.setDisabled(true);
|
|
|
|
|
});
|
|
|
|
|
this.btnMailRecepients.setDisabled(true);
|
2016-03-11 00:48:53 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
var editStyleMenuUpdate = new Common.UI.MenuItem({
|
|
|
|
|
caption: me.textStyleMenuUpdate
|
|
|
|
|
}).on('click', _.bind(me.onStyleMenuUpdate, me));
|
|
|
|
|
|
|
|
|
|
var editStyleMenuRestore = new Common.UI.MenuItem({
|
|
|
|
|
caption: me.textStyleMenuDelete
|
|
|
|
|
}).on('click', _.bind(me.onStyleMenuDelete, me));
|
|
|
|
|
|
|
|
|
|
var editStyleMenuDelete = new Common.UI.MenuItem({
|
|
|
|
|
caption: me.textStyleMenuRestore
|
|
|
|
|
}).on('click', _.bind(me.onStyleMenuDelete, me));
|
|
|
|
|
|
|
|
|
|
var editStyleMenuRestoreAll = new Common.UI.MenuItem({
|
|
|
|
|
caption: me.textStyleMenuRestoreAll
|
|
|
|
|
}).on('click', _.bind(me.onStyleMenuRestoreAll, me));
|
|
|
|
|
|
|
|
|
|
var editStyleMenuDeleteAll = new Common.UI.MenuItem({
|
|
|
|
|
caption: me.textStyleMenuDeleteAll
|
|
|
|
|
}).on('click', _.bind(me.onStyleMenuDeleteAll, me));
|
|
|
|
|
|
|
|
|
|
if (this.styleMenu == null) {
|
|
|
|
|
this.styleMenu = new Common.UI.Menu({
|
|
|
|
|
items: [
|
|
|
|
|
editStyleMenuUpdate,
|
|
|
|
|
editStyleMenuRestore,
|
|
|
|
|
editStyleMenuDelete,
|
|
|
|
|
editStyleMenuRestoreAll,
|
|
|
|
|
editStyleMenuDeleteAll
|
|
|
|
|
]
|
|
|
|
|
});
|
2016-03-11 00:48:53 +00:00
|
|
|
}
|
2017-02-20 14:51:33 +00:00
|
|
|
|
2017-03-31 10:54:02 +00:00
|
|
|
Common.NotificationCenter.on('app:ready', me.onAppReady.bind(this));
|
|
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
return this;
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
render: function (mode) {
|
|
|
|
|
var me = this;
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* Render UI layout
|
|
|
|
|
*/
|
|
|
|
|
|
2017-03-01 13:33:12 +00:00
|
|
|
this.fireEvent('render:before', [this]);
|
2017-02-20 14:51:33 +00:00
|
|
|
|
2017-04-20 10:35:06 +00:00
|
|
|
if ( mode.isEdit ) {
|
|
|
|
|
me.isCompactView = Common.localStorage.getBool("de-compact-toolbar");
|
|
|
|
|
me.$el.html(me.rendererComponents(config.$dom));
|
|
|
|
|
} else {
|
|
|
|
|
config.$dom.find('.canedit').hide();
|
2017-04-10 13:39:03 +00:00
|
|
|
config.$dom.addClass('folded');
|
2017-04-20 10:35:06 +00:00
|
|
|
me.isCompactView = true;
|
2017-02-20 14:51:33 +00:00
|
|
|
|
2017-04-10 13:39:03 +00:00
|
|
|
me.$el.html(config.$dom);
|
|
|
|
|
}
|
2016-03-11 00:48:53 +00:00
|
|
|
|
2017-03-01 13:33:12 +00:00
|
|
|
this.fireEvent('render:after', [this]);
|
2016-03-11 00:48:53 +00:00
|
|
|
|
2017-04-20 11:16:50 +00:00
|
|
|
me.isCompactView = mode.isCompactView;
|
2017-02-20 14:51:33 +00:00
|
|
|
/** coauthoring begin **/
|
2017-04-06 09:42:43 +00:00
|
|
|
this.showSynchTip = !Common.localStorage.getBool("de-hide-synch");
|
2017-02-20 14:51:33 +00:00
|
|
|
this.needShowSynchTip = false;
|
|
|
|
|
/** coauthoring end **/
|
|
|
|
|
|
|
|
|
|
$boxTabs = me.$el.find('.tabs > ul');
|
|
|
|
|
$tabs = $boxTabs.find('> li');
|
|
|
|
|
$panels = me.$el.find('.box-panels > .panel');
|
2017-04-20 10:32:55 +00:00
|
|
|
$tabs.parent().on('click', '.ribtab', function (e) {
|
2017-02-20 14:51:33 +00:00
|
|
|
var tab = $(e.target).data('tab');
|
|
|
|
|
if (tab == 'file') {
|
|
|
|
|
me.fireEvent('file:open');
|
|
|
|
|
} else
|
|
|
|
|
if ( isTabActive('file') )
|
|
|
|
|
me.fireEvent('file:close');
|
|
|
|
|
|
|
|
|
|
me.setTab(tab);
|
|
|
|
|
});
|
2016-03-11 00:48:53 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
$marker = me.$el.find('.tabs .marker');
|
|
|
|
|
var $scrollR = me.$el.find('.tabs .scroll.right');
|
|
|
|
|
$scrollL = me.$el.find('.tabs .scroll.left');
|
2016-03-11 00:48:53 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
$scrollL.on('click', onScrollTabs.bind(this, 'left'));
|
|
|
|
|
$scrollR.on('click', onScrollTabs.bind(this, 'right'));
|
2017-02-15 13:45:25 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
Common.NotificationCenter.on({
|
2017-04-10 13:39:03 +00:00
|
|
|
'window:resize': onResize
|
2017-02-20 14:51:33 +00:00
|
|
|
});
|
2017-02-15 13:45:25 +00:00
|
|
|
|
2017-04-06 09:34:01 +00:00
|
|
|
if ( me.isCompactView )
|
|
|
|
|
me.setFolded(true); else
|
|
|
|
|
me.setTab('home');
|
2017-02-15 13:45:25 +00:00
|
|
|
|
2017-04-10 13:39:03 +00:00
|
|
|
var top = Common.localStorage.getItem("de-pgmargins-top"),
|
|
|
|
|
left = Common.localStorage.getItem("de-pgmargins-left"),
|
|
|
|
|
bottom = Common.localStorage.getItem("de-pgmargins-bottom"),
|
|
|
|
|
right = Common.localStorage.getItem("de-pgmargins-right");
|
|
|
|
|
if ( top!==null && left!==null && bottom!==null && right!==null ) {
|
|
|
|
|
var mnu = this.btnPageMargins.menu.items[0];
|
|
|
|
|
mnu.options.value = mnu.value = [parseFloat(top), parseFloat(left), parseFloat(bottom), parseFloat(right)];
|
|
|
|
|
mnu.setVisible(true);
|
|
|
|
|
$(mnu.el).html(mnu.template({id: Common.UI.getId(), caption : mnu.caption, options : mnu.options}));
|
|
|
|
|
} else
|
|
|
|
|
this.btnPageMargins.menu.items[0].setVisible(false);
|
|
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
return this;
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
rendererComponents: function (html) {
|
|
|
|
|
var $host = $(html);
|
|
|
|
|
var _injectComponent = function (id, cmp) {
|
|
|
|
|
var $slot = $host.find(id);
|
|
|
|
|
if ($slot.length) {
|
|
|
|
|
cmp.rendered ?
|
|
|
|
|
$slot.append(cmp.$el) : cmp.render($slot);
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
_injectComponent('#slot-field-fontname', this.cmbFontName);
|
|
|
|
|
_injectComponent('#slot-field-fontsize', this.cmbFontSize);
|
|
|
|
|
_injectComponent('#slot-btn-print', this.btnPrint);
|
|
|
|
|
_injectComponent('#slot-btn-save', this.btnSave);
|
|
|
|
|
_injectComponent('#slot-btn-undo', this.btnUndo);
|
|
|
|
|
_injectComponent('#slot-btn-redo', this.btnRedo);
|
|
|
|
|
_injectComponent('#slot-btn-copy', this.btnCopy);
|
|
|
|
|
_injectComponent('#slot-btn-paste', this.btnPaste);
|
|
|
|
|
_injectComponent('#slot-btn-incfont', this.btnIncFontSize);
|
|
|
|
|
_injectComponent('#slot-btn-decfont', this.btnDecFontSize);
|
|
|
|
|
_injectComponent('#slot-btn-bold', this.btnBold);
|
|
|
|
|
_injectComponent('#slot-btn-italic', this.btnItalic);
|
|
|
|
|
_injectComponent('#slot-btn-underline', this.btnUnderline);
|
|
|
|
|
_injectComponent('#slot-btn-strikeout', this.btnStrikeout);
|
|
|
|
|
_injectComponent('#slot-btn-superscript', this.btnSuperscript);
|
|
|
|
|
_injectComponent('#slot-btn-subscript', this.btnSubscript);
|
|
|
|
|
_injectComponent('#slot-btn-highlight', this.btnHighlightColor);
|
|
|
|
|
_injectComponent('#slot-btn-fontcolor', this.btnFontColor);
|
|
|
|
|
_injectComponent('#slot-btn-align-left', this.btnAlignLeft);
|
|
|
|
|
_injectComponent('#slot-btn-align-center', this.btnAlignCenter);
|
|
|
|
|
_injectComponent('#slot-btn-align-right', this.btnAlignRight);
|
|
|
|
|
_injectComponent('#slot-btn-align-just', this.btnAlignJust);
|
|
|
|
|
_injectComponent('#slot-btn-incoffset', this.btnIncLeftOffset);
|
|
|
|
|
_injectComponent('#slot-btn-decoffset', this.btnDecLeftOffset);
|
|
|
|
|
_injectComponent('#slot-btn-linespace', this.btnLineSpace);
|
|
|
|
|
_injectComponent('#slot-btn-hidenchars', this.btnShowHidenChars);
|
|
|
|
|
_injectComponent('#slot-btn-markers', this.btnMarkers);
|
|
|
|
|
_injectComponent('#slot-btn-numbering', this.btnNumbers);
|
|
|
|
|
_injectComponent('#slot-btn-multilevels', this.btnMultilevels);
|
|
|
|
|
_injectComponent('#slot-btn-instable', this.btnInsertTable);
|
|
|
|
|
_injectComponent('#slot-btn-insimage', this.btnInsertImage);
|
|
|
|
|
_injectComponent('#slot-btn-inschart', this.btnInsertChart);
|
|
|
|
|
_injectComponent('#slot-btn-instext', this.btnInsertText);
|
|
|
|
|
_injectComponent('#slot-btn-dropcap', this.btnDropCap);
|
|
|
|
|
_injectComponent('#slot-btn-columns', this.btnColumns);
|
|
|
|
|
_injectComponent('#slot-btn-inshyperlink', this.btnInsertHyperlink);
|
|
|
|
|
_injectComponent('#slot-btn-editheader', this.btnEditHeader);
|
|
|
|
|
_injectComponent('#slot-btn-insshape', this.btnInsertShape);
|
|
|
|
|
_injectComponent('#slot-btn-insequation', this.btnInsertEquation);
|
|
|
|
|
_injectComponent('#slot-btn-pageorient', this.btnPageOrient);
|
|
|
|
|
_injectComponent('#slot-btn-pagemargins', this.btnPageMargins);
|
|
|
|
|
_injectComponent('#slot-btn-pagesize', this.btnPageSize);
|
|
|
|
|
_injectComponent('#slot-btn-clearstyle', this.btnClearStyle);
|
|
|
|
|
_injectComponent('#slot-btn-copystyle', this.btnCopyStyle);
|
|
|
|
|
_injectComponent('#slot-btn-colorschemas', this.btnColorSchemas);
|
|
|
|
|
_injectComponent('#slot-btn-hidebars', this.btnHide);
|
|
|
|
|
_injectComponent('#slot-btn-settings', this.btnAdvSettings);
|
|
|
|
|
_injectComponent('#slot-btn-paracolor', this.btnParagraphColor);
|
|
|
|
|
_injectComponent('#slot-field-styles', this.listStyles);
|
|
|
|
|
_injectComponent('#slot-btn-halign', this.btnHorizontalAlign);
|
|
|
|
|
_injectComponent('#slot-btn-mailrecepients', this.btnMailRecepients);
|
|
|
|
|
_injectComponent('#slot-btn-notes', this.btnNotes);
|
2017-03-29 16:24:20 +00:00
|
|
|
_injectComponent('#slot-img-align', this.btnImgAlign);
|
|
|
|
|
_injectComponent('#slot-img-group', this.btnImgGroup);
|
|
|
|
|
_injectComponent('#slot-img-movefrwd', this.btnImgForward);
|
|
|
|
|
_injectComponent('#slot-img-movebkwd', this.btnImgBackward);
|
|
|
|
|
_injectComponent('#slot-img-wrapping', this.btnImgWrapping);
|
|
|
|
|
|
2017-03-31 10:54:02 +00:00
|
|
|
+function injectBreakButtons() {
|
|
|
|
|
var me = this;
|
|
|
|
|
|
|
|
|
|
me.btnsPageBreak = [];
|
|
|
|
|
me.btnsPageBreak.disable = function(status) {
|
|
|
|
|
this.forEach(function(btn) {
|
|
|
|
|
btn.setDisabled(status);
|
|
|
|
|
});
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
var $slots = $host.find('.btn-slot.btn-pagebreak');
|
|
|
|
|
$slots.each(function(index, el) {
|
|
|
|
|
var button = new Common.UI.Button({
|
|
|
|
|
cls: 'btn-toolbar',
|
|
|
|
|
iconCls: 'btn-pagebreak',
|
|
|
|
|
caption: me.capBtnInsPagebreak,
|
|
|
|
|
split: true,
|
|
|
|
|
menu: true
|
|
|
|
|
}).render( $slots.eq(index) );
|
|
|
|
|
|
|
|
|
|
me.btnsPageBreak.push(button);
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
Array.prototype.push.apply(me.paragraphControls, me.btnsPageBreak);
|
|
|
|
|
}.call(this);
|
|
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
return $host;
|
|
|
|
|
},
|
|
|
|
|
|
2017-03-31 10:54:02 +00:00
|
|
|
onAppReady: function (config) {
|
|
|
|
|
var me = this;
|
|
|
|
|
(new Promise( function(resolve, reject) {
|
|
|
|
|
resolve();
|
|
|
|
|
})).then(function () {
|
2017-04-10 13:39:03 +00:00
|
|
|
if ( !config.isEdit ) return;
|
|
|
|
|
|
2017-03-31 10:54:02 +00:00
|
|
|
me.btnsPageBreak.forEach( function(btn) {
|
|
|
|
|
btn.updateHint( me.tipPageBreak );
|
|
|
|
|
|
|
|
|
|
var _menu_section_break = new Common.UI.Menu({
|
|
|
|
|
menuAlign: 'tl-tr',
|
|
|
|
|
items: [
|
|
|
|
|
{caption: me.textNextPage, value: Asc.c_oAscSectionBreakType.NextPage},
|
|
|
|
|
{caption: me.textContPage, value: Asc.c_oAscSectionBreakType.Continuous},
|
|
|
|
|
{caption: me.textEvenPage, value: Asc.c_oAscSectionBreakType.EvenPage},
|
|
|
|
|
{caption: me.textOddPage, value: Asc.c_oAscSectionBreakType.OddPage}
|
|
|
|
|
]
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
var _menu = new Common.UI.Menu({
|
|
|
|
|
items: [
|
|
|
|
|
{caption: me.textInsPageBreak},
|
|
|
|
|
{caption: me.textInsColumnBreak, value: 'column'},
|
|
|
|
|
{caption: me.textInsSectionBreak, value: 'section', menu: _menu_section_break}
|
|
|
|
|
]
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
btn.setMenu(_menu);
|
|
|
|
|
});
|
2017-04-04 15:43:19 +00:00
|
|
|
|
|
|
|
|
var _holder_view = DE.getController('DocumentHolder').getView();
|
|
|
|
|
me.btnImgForward.updateHint(me.tipSendForward);
|
|
|
|
|
me.btnImgForward.setMenu(new Common.UI.Menu({
|
|
|
|
|
items: [{
|
|
|
|
|
caption : _holder_view.textArrangeFront,
|
|
|
|
|
iconCls : 'mnu-arrange-front',
|
|
|
|
|
valign : Asc.c_oAscChangeLevel.BringToFront
|
|
|
|
|
}, {
|
|
|
|
|
caption : _holder_view.textArrangeForward,
|
|
|
|
|
iconCls : 'mnu-arrange-forward',
|
|
|
|
|
valign : Asc.c_oAscChangeLevel.BringForward
|
|
|
|
|
}
|
|
|
|
|
]})
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
me.btnImgBackward.updateHint(me.tipSendBackward);
|
|
|
|
|
me.btnImgBackward.setMenu(new Common.UI.Menu({
|
|
|
|
|
items: [{
|
|
|
|
|
caption : _holder_view.textArrangeBack,
|
|
|
|
|
iconCls : 'mnu-arrange-back',
|
|
|
|
|
valign : Asc.c_oAscChangeLevel.SendToBack
|
|
|
|
|
}, {
|
|
|
|
|
caption : _holder_view.textArrangeBackward,
|
|
|
|
|
iconCls : 'mnu-arrange-backward',
|
|
|
|
|
valign : Asc.c_oAscChangeLevel.BringBackward
|
|
|
|
|
}]
|
|
|
|
|
}));
|
|
|
|
|
|
|
|
|
|
me.btnImgAlign.updateHint(me.tipImgAlign);
|
|
|
|
|
me.btnImgAlign.setMenu(new Common.UI.Menu({
|
|
|
|
|
items: [{
|
|
|
|
|
caption : _holder_view.textShapeAlignLeft,
|
|
|
|
|
iconCls : 'mnu-img-align-left',
|
|
|
|
|
halign : Asc.c_oAscAlignH.Left
|
|
|
|
|
}, {
|
|
|
|
|
caption : _holder_view.textShapeAlignCenter,
|
|
|
|
|
iconCls : 'mnu-img-align-center',
|
|
|
|
|
halign : Asc.c_oAscAlignH.Center
|
|
|
|
|
}, {
|
|
|
|
|
caption : _holder_view.textShapeAlignRight,
|
|
|
|
|
iconCls : 'mnu-img-align-right',
|
|
|
|
|
halign : Asc.c_oAscAlignH.Right
|
|
|
|
|
}, {
|
|
|
|
|
caption : _holder_view.textShapeAlignTop,
|
|
|
|
|
iconCls : 'mnu-img-align-top',
|
|
|
|
|
valign : Asc.c_oAscAlignV.Top
|
|
|
|
|
}, {
|
|
|
|
|
caption : _holder_view.textShapeAlignMiddle,
|
|
|
|
|
iconCls : 'mnu-img-align-middle',
|
|
|
|
|
valign : Asc.c_oAscAlignV.Center
|
|
|
|
|
}, {
|
|
|
|
|
caption : _holder_view.textShapeAlignBottom,
|
|
|
|
|
iconCls : 'mnu-img-align-bottom',
|
|
|
|
|
valign : Asc.c_oAscAlignV.Bottom
|
|
|
|
|
}]
|
|
|
|
|
}));
|
|
|
|
|
|
|
|
|
|
me.btnImgGroup.updateHint(me.tipImgGroup);
|
|
|
|
|
me.btnImgGroup.setMenu(new Common.UI.Menu({
|
|
|
|
|
items: [{
|
|
|
|
|
caption : _holder_view.txtGroup,
|
|
|
|
|
iconCls : 'mnu-arrange-group',
|
|
|
|
|
groupval: 1
|
|
|
|
|
}, {
|
|
|
|
|
caption : _holder_view.txtUngroup,
|
|
|
|
|
iconCls : 'mnu-arrange-ungroup',
|
|
|
|
|
groupval: -1
|
|
|
|
|
}]
|
|
|
|
|
}));
|
|
|
|
|
|
|
|
|
|
me.btnImgWrapping.updateHint(me.tipImgWrapping);
|
|
|
|
|
me.btnImgWrapping.setMenu(new Common.UI.Menu({
|
|
|
|
|
cls: 'ppm-toolbar',
|
|
|
|
|
items: [{
|
|
|
|
|
caption : _holder_view.txtInline,
|
|
|
|
|
iconCls : 'mnu-wrap-inline',
|
|
|
|
|
toggleGroup : 'imgwrapping',
|
|
|
|
|
wrapType : Asc.c_oAscWrapStyle2.Inline,
|
|
|
|
|
checkable : true
|
|
|
|
|
}, {
|
|
|
|
|
caption : _holder_view.txtSquare,
|
|
|
|
|
iconCls : 'mnu-wrap-square',
|
|
|
|
|
toggleGroup : 'imgwrapping',
|
|
|
|
|
wrapType : Asc.c_oAscWrapStyle2.Square,
|
|
|
|
|
checkable : true
|
|
|
|
|
}, {
|
|
|
|
|
caption : _holder_view.txtTight,
|
|
|
|
|
iconCls : 'mnu-wrap-tight',
|
|
|
|
|
toggleGroup : 'imgwrapping',
|
|
|
|
|
wrapType : Asc.c_oAscWrapStyle2.Tight,
|
|
|
|
|
checkable : true
|
|
|
|
|
}, {
|
|
|
|
|
caption : _holder_view.txtThrough,
|
|
|
|
|
iconCls : 'mnu-wrap-through',
|
|
|
|
|
toggleGroup : 'imgwrapping',
|
|
|
|
|
wrapType : Asc.c_oAscWrapStyle2.Through,
|
|
|
|
|
checkable : true
|
|
|
|
|
}, {
|
|
|
|
|
caption : _holder_view.txtTopAndBottom,
|
|
|
|
|
iconCls : 'mnu-wrap-topAndBottom',
|
|
|
|
|
toggleGroup : 'imgwrapping',
|
|
|
|
|
wrapType : Asc.c_oAscWrapStyle2.TopAndBottom,
|
|
|
|
|
checkable : true
|
|
|
|
|
}, {
|
|
|
|
|
caption : _holder_view.txtInFront,
|
|
|
|
|
iconCls : 'mnu-wrap-inFront',
|
|
|
|
|
toggleGroup : 'imgwrapping',
|
|
|
|
|
wrapType : Asc.c_oAscWrapStyle2.InFront,
|
|
|
|
|
checkable : true
|
|
|
|
|
}, {
|
|
|
|
|
caption : _holder_view.txtBehind,
|
|
|
|
|
iconCls : 'mnu-wrap-behind',
|
|
|
|
|
toggleGroup : 'imgwrapping',
|
|
|
|
|
wrapType : Asc.c_oAscWrapStyle2.Behind,
|
|
|
|
|
checkable : true
|
|
|
|
|
}
|
|
|
|
|
]
|
|
|
|
|
}));
|
2017-03-31 10:54:02 +00:00
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
createDelayedElements: function () {
|
|
|
|
|
if (this.api) {
|
|
|
|
|
this.mnuNonPrinting.items[0].setChecked(this.api.get_ShowParaMarks(), true);
|
|
|
|
|
this.mnuNonPrinting.items[1].setChecked(this.api.get_ShowTableEmptyLine(), true);
|
|
|
|
|
this.btnShowHidenChars.toggle(this.mnuNonPrinting.items[0].checked, true);
|
|
|
|
|
|
|
|
|
|
this.updateMetricUnit();
|
2016-03-11 00:48:53 +00:00
|
|
|
}
|
2016-08-04 17:02:57 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
// set hints
|
|
|
|
|
this.btnPrint.updateHint(this.tipPrint + Common.Utils.String.platformKey('Ctrl+P'));
|
|
|
|
|
this.btnSave.updateHint(this.btnSaveTip);
|
|
|
|
|
this.btnUndo.updateHint(this.tipUndo + Common.Utils.String.platformKey('Ctrl+Z'));
|
|
|
|
|
this.btnRedo.updateHint(this.tipRedo + Common.Utils.String.platformKey('Ctrl+Y'));
|
|
|
|
|
this.btnCopy.updateHint(this.tipCopy + Common.Utils.String.platformKey('Ctrl+C'));
|
|
|
|
|
this.btnPaste.updateHint(this.tipPaste + Common.Utils.String.platformKey('Ctrl+V'));
|
|
|
|
|
this.btnIncFontSize.updateHint(this.tipIncFont + Common.Utils.String.platformKey('Ctrl+]'));
|
|
|
|
|
this.btnDecFontSize.updateHint(this.tipDecFont + Common.Utils.String.platformKey('Ctrl+['));
|
|
|
|
|
this.btnBold.updateHint(this.textBold + Common.Utils.String.platformKey('Ctrl+B'));
|
|
|
|
|
this.btnItalic.updateHint(this.textItalic + Common.Utils.String.platformKey('Ctrl+I'));
|
|
|
|
|
this.btnUnderline.updateHint(this.textUnderline + Common.Utils.String.platformKey('Ctrl+U'));
|
|
|
|
|
this.btnStrikeout.updateHint(this.textStrikeout);
|
|
|
|
|
this.btnSuperscript.updateHint(this.textSuperscript);
|
|
|
|
|
this.btnSubscript.updateHint(this.textSubscript);
|
|
|
|
|
this.btnHighlightColor.updateHint(this.tipHighlightColor);
|
|
|
|
|
this.btnFontColor.updateHint(this.tipFontColor);
|
|
|
|
|
this.btnParagraphColor.updateHint(this.tipPrColor);
|
|
|
|
|
this.btnAlignLeft.updateHint(this.tipAlignLeft + Common.Utils.String.platformKey('Ctrl+L'));
|
|
|
|
|
this.btnAlignCenter.updateHint(this.tipAlignCenter + Common.Utils.String.platformKey('Ctrl+E'));
|
|
|
|
|
this.btnAlignRight.updateHint(this.tipAlignRight + Common.Utils.String.platformKey('Ctrl+R'));
|
|
|
|
|
this.btnAlignJust.updateHint(this.tipAlignJust + Common.Utils.String.platformKey('Ctrl+J'));
|
|
|
|
|
this.btnHorizontalAlign.updateHint(this.tipHAligh);
|
|
|
|
|
this.btnDecLeftOffset.updateHint(this.tipDecPrLeft + Common.Utils.String.platformKey('Ctrl+Shift+M'));
|
|
|
|
|
this.btnIncLeftOffset.updateHint(this.tipIncPrLeft + Common.Utils.String.platformKey('Ctrl+M'));
|
|
|
|
|
this.btnLineSpace.updateHint(this.tipLineSpace);
|
|
|
|
|
this.btnShowHidenChars.updateHint(this.tipShowHiddenChars);
|
|
|
|
|
this.btnMarkers.updateHint(this.tipMarkers);
|
|
|
|
|
this.btnNumbers.updateHint(this.tipNumbers);
|
|
|
|
|
this.btnMultilevels.updateHint(this.tipMultilevels);
|
|
|
|
|
this.btnInsertTable.updateHint(this.tipInsertTable);
|
|
|
|
|
this.btnInsertImage.updateHint(this.tipInsertImage);
|
|
|
|
|
this.btnInsertChart.updateHint(this.tipInsertChart);
|
|
|
|
|
this.btnInsertText.updateHint(this.tipInsertText);
|
|
|
|
|
this.btnInsertHyperlink.updateHint(this.tipInsertHyperlink + Common.Utils.String.platformKey('Ctrl+K'));
|
|
|
|
|
this.btnEditHeader.updateHint(this.tipEditHeader);
|
|
|
|
|
this.btnInsertShape.updateHint(this.tipInsertShape);
|
|
|
|
|
this.btnInsertEquation.updateHint(this.tipInsertEquation);
|
|
|
|
|
this.btnDropCap.updateHint(this.tipDropCap);
|
|
|
|
|
this.btnColumns.updateHint(this.tipColumns);
|
|
|
|
|
this.btnPageOrient.updateHint(this.tipPageOrient);
|
|
|
|
|
this.btnPageSize.updateHint(this.tipPageSize);
|
|
|
|
|
this.btnPageMargins.updateHint(this.tipPageMargins);
|
|
|
|
|
this.btnClearStyle.updateHint(this.tipClearStyle);
|
|
|
|
|
this.btnCopyStyle.updateHint(this.tipCopyStyle + Common.Utils.String.platformKey('Ctrl+Shift+C'));
|
|
|
|
|
this.btnColorSchemas.updateHint(this.tipColorSchemas);
|
|
|
|
|
this.btnMailRecepients.updateHint(this.tipMailRecepients);
|
|
|
|
|
this.btnHide.updateHint(this.tipViewSettings);
|
|
|
|
|
this.btnAdvSettings.updateHint(this.tipAdvSettings);
|
|
|
|
|
this.btnNotes.updateHint(this.tipNotes);
|
|
|
|
|
|
|
|
|
|
// set menus
|
|
|
|
|
|
|
|
|
|
var me = this;
|
|
|
|
|
|
|
|
|
|
this.btnHide.setMenu(new Common.UI.Menu({
|
|
|
|
|
cls: 'pull-right',
|
|
|
|
|
style: 'min-width: 180px;',
|
|
|
|
|
items: [
|
|
|
|
|
this.mnuitemCompactToolbar = new Common.UI.MenuItem({
|
|
|
|
|
caption: this.textCompactView,
|
|
|
|
|
checkable: true
|
|
|
|
|
}),
|
2017-04-10 13:40:48 +00:00
|
|
|
// this.mnuitemHideTitleBar = new Common.UI.MenuItem({
|
|
|
|
|
// caption: this.textHideTitleBar,
|
|
|
|
|
// checkable: true
|
|
|
|
|
// }),
|
2017-02-20 14:51:33 +00:00
|
|
|
this.mnuitemHideStatusBar = new Common.UI.MenuItem({
|
|
|
|
|
caption: this.textHideStatusBar,
|
|
|
|
|
checkable: true
|
|
|
|
|
}),
|
|
|
|
|
this.mnuitemHideRulers = new Common.UI.MenuItem({
|
|
|
|
|
caption: this.textHideLines,
|
|
|
|
|
checkable: true
|
|
|
|
|
}),
|
|
|
|
|
{caption: '--'},
|
|
|
|
|
this.btnFitPage = new Common.UI.MenuItem({
|
|
|
|
|
caption: this.textFitPage,
|
|
|
|
|
checkable: true,
|
|
|
|
|
checked: this.btnFitPage.isChecked()
|
|
|
|
|
}),
|
|
|
|
|
this.btnFitWidth = new Common.UI.MenuItem({
|
|
|
|
|
caption: this.textFitWidth,
|
|
|
|
|
checkable: true,
|
|
|
|
|
checked: this.btnFitWidth.isChecked()
|
|
|
|
|
}),
|
|
|
|
|
this.mnuZoom = new Common.UI.MenuItem({
|
|
|
|
|
template: _.template([
|
|
|
|
|
'<div id="id-toolbar-menu-zoom" class="menu-zoom" style="height: 25px;" ',
|
|
|
|
|
'<% if(!_.isUndefined(options.stopPropagation)) { %>',
|
|
|
|
|
'data-stopPropagation="true"',
|
|
|
|
|
'<% } %>', '>',
|
|
|
|
|
'<label class="title">' + this.textZoom + '</label>',
|
2017-04-11 12:31:45 +00:00
|
|
|
'<button id="id-menu-zoom-in" type="button" style="float:right; margin: 2px 5px 0 0;" class="btn small btn-toolbar"><i class="icon btn-zoomup"> </i></button>',
|
2017-02-20 14:51:33 +00:00
|
|
|
'<label class="zoom"><%= options.value %>%</label>',
|
2017-04-11 12:31:45 +00:00
|
|
|
'<button id="id-menu-zoom-out" type="button" style="float:right; margin-top: 2px;" class="btn small btn-toolbar"><i class="icon btn-zoomdown"> </i></button>',
|
2017-02-20 14:51:33 +00:00
|
|
|
'</div>'
|
|
|
|
|
].join('')),
|
|
|
|
|
stopPropagation: true,
|
|
|
|
|
value: this.mnuZoom.options.value
|
|
|
|
|
})
|
|
|
|
|
]
|
|
|
|
|
})
|
|
|
|
|
);
|
2017-04-10 13:40:48 +00:00
|
|
|
// if (this.mode.isDesktopApp || this.mode.canBrandingExt && this.mode.customization && this.mode.customization.header === false)
|
|
|
|
|
// this.mnuitemHideTitleBar.hide();
|
2017-02-20 14:51:33 +00:00
|
|
|
|
2017-04-12 07:59:28 +00:00
|
|
|
if (this.mode.canBrandingExt && this.mode.customization && this.mode.customization.statusBar===false)
|
|
|
|
|
this.mnuitemHideStatusBar.hide();
|
|
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
this.btnMarkers.setMenu(
|
|
|
|
|
new Common.UI.Menu({
|
|
|
|
|
items: [
|
|
|
|
|
{template: _.template('<div id="id-toolbar-menu-markers" class="menu-markers" style="width: 185px; margin: 0 5px;"></div>')}
|
|
|
|
|
]
|
|
|
|
|
})
|
|
|
|
|
);
|
2016-08-04 17:02:57 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
this.btnNumbers.setMenu(
|
|
|
|
|
new Common.UI.Menu({
|
|
|
|
|
items: [
|
|
|
|
|
{template: _.template('<div id="id-toolbar-menu-numbering" class="menu-markers" style="width: 330px; margin: 0 5px;"></div>')}
|
|
|
|
|
]
|
|
|
|
|
})
|
|
|
|
|
);
|
2016-08-04 17:02:57 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
this.btnMultilevels.setMenu(
|
|
|
|
|
new Common.UI.Menu({
|
|
|
|
|
items: [
|
|
|
|
|
{template: _.template('<div id="id-toolbar-menu-multilevels" class="menu-markers" style="width: 165px; margin: 0 5px;"></div>')}
|
|
|
|
|
]
|
2016-08-17 13:25:21 +00:00
|
|
|
})
|
2017-02-20 14:51:33 +00:00
|
|
|
);
|
2016-08-17 13:25:21 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
this.btnEditHeader.setMenu(
|
|
|
|
|
new Common.UI.Menu({
|
|
|
|
|
items: [
|
|
|
|
|
{caption: this.mniEditHeader, value: 'header'},
|
|
|
|
|
{caption: this.mniEditFooter, value: 'footer'},
|
|
|
|
|
{caption: '--'},
|
|
|
|
|
this.mnuInsertPageNum = new Common.UI.MenuItem({
|
|
|
|
|
caption: this.textInsertPageNumber,
|
|
|
|
|
disabled: this.mnuInsertPageNum.isDisabled(),
|
|
|
|
|
menu: new Common.UI.Menu({
|
|
|
|
|
menuAlign: 'tl-tr',
|
|
|
|
|
items: [
|
|
|
|
|
{template: _.template('<div id="id-toolbar-menu-pageposition" class="menu-pageposition"></div>')},
|
|
|
|
|
this.mnuPageNumCurrentPos = new Common.UI.MenuItem({
|
|
|
|
|
caption: this.textToCurrent,
|
|
|
|
|
disabled: this.mnuPageNumCurrentPos.isDisabled(),
|
|
|
|
|
value: 'current'
|
|
|
|
|
})
|
|
|
|
|
]
|
|
|
|
|
})
|
|
|
|
|
}),
|
|
|
|
|
this.mnuInsertPageCount = new Common.UI.MenuItem({
|
|
|
|
|
caption: this.textInsertPageCount,
|
|
|
|
|
disabled: this.mnuInsertPageCount.isDisabled()
|
|
|
|
|
})
|
|
|
|
|
]
|
|
|
|
|
})
|
|
|
|
|
);
|
|
|
|
|
this.paragraphControls.push(this.mnuPageNumCurrentPos);
|
|
|
|
|
this.paragraphControls.push(this.mnuInsertPageCount);
|
|
|
|
|
|
|
|
|
|
this.mnuZoomOut = new Common.UI.Button({
|
|
|
|
|
el: $('#id-menu-zoom-out'),
|
|
|
|
|
cls: 'btn-toolbar'
|
|
|
|
|
});
|
|
|
|
|
this.mnuZoomIn = new Common.UI.Button({
|
|
|
|
|
el: $('#id-menu-zoom-in'),
|
|
|
|
|
cls: 'btn-toolbar'
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
this.btnNotes.setMenu(
|
|
|
|
|
new Common.UI.Menu({
|
|
|
|
|
items: [
|
|
|
|
|
{caption: this.mniInsFootnote, value: 'ins_footnote'},
|
|
|
|
|
{caption: '--'},
|
|
|
|
|
this.mnuGotoFootnote = new Common.UI.MenuItem({
|
|
|
|
|
template: _.template([
|
|
|
|
|
'<div id="id-toolbar-menu-goto-footnote" class="menu-zoom" style="height: 25px;" ',
|
|
|
|
|
'<% if(!_.isUndefined(options.stopPropagation)) { %>',
|
|
|
|
|
'data-stopPropagation="true"',
|
|
|
|
|
'<% } %>', '>',
|
|
|
|
|
'<label class="title">' + this.textGotoFootnote + '</label>',
|
2017-04-03 16:25:21 +00:00
|
|
|
'<button id="id-menu-goto-footnote-next" type="button" style="float:right; margin: 2px 5px 0 0;" class="btn small btn-toolbar"><i class="icon mmerge-next"> </i></button>',
|
|
|
|
|
'<button id="id-menu-goto-footnote-prev" type="button" style="float:right; margin-top: 2px;" class="btn small btn-toolbar"><i class="icon mmerge-prev"> </i></button>',
|
2017-02-20 14:51:33 +00:00
|
|
|
'</div>'
|
|
|
|
|
].join('')),
|
|
|
|
|
stopPropagation: true
|
|
|
|
|
}),
|
|
|
|
|
{caption: '--'},
|
|
|
|
|
{caption: this.mniDelFootnote, value: 'delele'},
|
|
|
|
|
{caption: this.mniNoteSettings, value: 'settings'}
|
|
|
|
|
]
|
|
|
|
|
})
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
this.mnuGotoFootPrev = new Common.UI.Button({
|
|
|
|
|
el: $('#id-menu-goto-footnote-prev'),
|
|
|
|
|
cls: 'btn-toolbar'
|
|
|
|
|
});
|
|
|
|
|
this.mnuGotoFootNext = new Common.UI.Button({
|
|
|
|
|
el: $('#id-menu-goto-footnote-next'),
|
|
|
|
|
cls: 'btn-toolbar'
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
// set dataviews
|
|
|
|
|
|
|
|
|
|
var _conf = this.mnuMarkersPicker.conf;
|
|
|
|
|
this.mnuMarkersPicker = new Common.UI.DataView({
|
|
|
|
|
el: $('#id-toolbar-menu-markers'),
|
|
|
|
|
parentMenu: this.btnMarkers.menu,
|
|
|
|
|
restoreHeight: 92,
|
|
|
|
|
allowScrollbar: false,
|
|
|
|
|
store: new Common.UI.DataViewStore([
|
|
|
|
|
{offsety: 0, data: {type: 0, subtype: -1}},
|
|
|
|
|
{offsety: 38, data: {type: 0, subtype: 1}},
|
|
|
|
|
{offsety: 76, data: {type: 0, subtype: 2}},
|
|
|
|
|
{offsety: 114, data: {type: 0, subtype: 3}},
|
|
|
|
|
{offsety: 152, data: {type: 0, subtype: 4}},
|
|
|
|
|
{offsety: 190, data: {type: 0, subtype: 5}},
|
|
|
|
|
{offsety: 228, data: {type: 0, subtype: 6}},
|
|
|
|
|
{offsety: 266, data: {type: 0, subtype: 7}}
|
|
|
|
|
]),
|
|
|
|
|
itemTemplate: _.template('<div id="<%= id %>" class="item-markerlist" style="background-position: 0 -<%= offsety %>px;"></div>')
|
|
|
|
|
});
|
|
|
|
|
_conf && this.mnuMarkersPicker.selectByIndex(_conf.index, true);
|
|
|
|
|
|
|
|
|
|
_conf = this.mnuNumbersPicker.conf;
|
|
|
|
|
this.mnuNumbersPicker = new Common.UI.DataView({
|
|
|
|
|
el: $('#id-toolbar-menu-numbering'),
|
|
|
|
|
parentMenu: this.btnNumbers.menu,
|
|
|
|
|
restoreHeight: 164,
|
|
|
|
|
allowScrollbar: false,
|
|
|
|
|
store: new Common.UI.DataViewStore([
|
|
|
|
|
{offsety: 0, data: {type: 1, subtype: -1}},
|
|
|
|
|
{offsety: 518, data: {type: 1, subtype: 4}},
|
|
|
|
|
{offsety: 592, data: {type: 1, subtype: 5}},
|
|
|
|
|
{offsety: 666, data: {type: 1, subtype: 6}},
|
|
|
|
|
{offsety: 296, data: {type: 1, subtype: 1}},
|
|
|
|
|
{offsety: 370, data: {type: 1, subtype: 2}},
|
|
|
|
|
{offsety: 444, data: {type: 1, subtype: 3}},
|
|
|
|
|
{offsety: 740, data: {type: 1, subtype: 7}}
|
2016-08-04 17:02:57 +00:00
|
|
|
]),
|
2017-02-20 14:51:33 +00:00
|
|
|
itemTemplate: _.template('<div id="<%= id %>" class="item-numberlist" style="background-position: 0 -<%= offsety %>px;"></div>')
|
|
|
|
|
});
|
|
|
|
|
_conf && this.mnuNumbersPicker.selectByIndex(_conf.index, true);
|
|
|
|
|
|
|
|
|
|
_conf = this.mnuMultilevelPicker.conf;
|
|
|
|
|
this.mnuMultilevelPicker = new Common.UI.DataView({
|
|
|
|
|
el: $('#id-toolbar-menu-multilevels'),
|
|
|
|
|
parentMenu: this.btnMultilevels.menu,
|
|
|
|
|
restoreHeight: 164,
|
|
|
|
|
allowScrollbar: false,
|
|
|
|
|
store: new Common.UI.DataViewStore([
|
|
|
|
|
{offsety: 0, data: {type: 2, subtype: -1}},
|
|
|
|
|
{offsety: 74, data: {type: 2, subtype: 1}},
|
|
|
|
|
{offsety: 148, data: {type: 2, subtype: 2}},
|
|
|
|
|
{offsety: 222, data: {type: 2, subtype: 3}}
|
2016-08-04 17:02:57 +00:00
|
|
|
]),
|
2017-02-20 14:51:33 +00:00
|
|
|
itemTemplate: _.template('<div id="<%= id %>" class="item-multilevellist" style="background-position: 0 -<%= offsety %>px;"></div>')
|
|
|
|
|
});
|
|
|
|
|
_conf && this.mnuMultilevelPicker.selectByIndex(_conf.index, true);
|
2016-08-04 17:02:57 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
_conf = this.mnuPageNumberPosPicker ? this.mnuPageNumberPosPicker.conf : undefined;
|
|
|
|
|
this.mnuPageNumberPosPicker = new Common.UI.DataView({
|
2016-08-04 17:02:57 +00:00
|
|
|
el: $('#id-toolbar-menu-pageposition'),
|
|
|
|
|
allowScrollbar: false,
|
|
|
|
|
store: new Common.UI.DataViewStore([
|
2017-02-20 14:51:33 +00:00
|
|
|
{
|
|
|
|
|
offsety: 132,
|
|
|
|
|
allowSelected: false,
|
|
|
|
|
data: {
|
|
|
|
|
type: c_pageNumPosition.PAGE_NUM_POSITION_TOP,
|
|
|
|
|
subtype: c_pageNumPosition.PAGE_NUM_POSITION_LEFT
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
offsety: 99,
|
|
|
|
|
allowSelected: false,
|
|
|
|
|
data: {
|
|
|
|
|
type: c_pageNumPosition.PAGE_NUM_POSITION_TOP,
|
|
|
|
|
subtype: c_pageNumPosition.PAGE_NUM_POSITION_CENTER
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
offsety: 66,
|
|
|
|
|
allowSelected: false,
|
|
|
|
|
data: {
|
|
|
|
|
type: c_pageNumPosition.PAGE_NUM_POSITION_TOP,
|
|
|
|
|
subtype: c_pageNumPosition.PAGE_NUM_POSITION_RIGHT
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
offsety: 33,
|
|
|
|
|
allowSelected: false,
|
|
|
|
|
data: {
|
|
|
|
|
type: c_pageNumPosition.PAGE_NUM_POSITION_BOTTOM,
|
|
|
|
|
subtype: c_pageNumPosition.PAGE_NUM_POSITION_LEFT
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
offsety: 0,
|
|
|
|
|
allowSelected: false,
|
|
|
|
|
data: {
|
|
|
|
|
type: c_pageNumPosition.PAGE_NUM_POSITION_BOTTOM,
|
|
|
|
|
subtype: c_pageNumPosition.PAGE_NUM_POSITION_CENTER
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
offsety: 165,
|
|
|
|
|
allowSelected: false,
|
|
|
|
|
data: {
|
|
|
|
|
type: c_pageNumPosition.PAGE_NUM_POSITION_BOTTOM,
|
|
|
|
|
subtype: c_pageNumPosition.PAGE_NUM_POSITION_RIGHT
|
|
|
|
|
}
|
|
|
|
|
}
|
2016-08-04 17:02:57 +00:00
|
|
|
]),
|
|
|
|
|
itemTemplate: _.template('<div id="<%= id %>" class="item-pagenumber" style="background-position: 0 -<%= offsety %>px"></div>')
|
2017-02-20 14:51:33 +00:00
|
|
|
});
|
|
|
|
|
_conf && this.mnuPageNumberPosPicker.setDisabled(_conf.disabled);
|
|
|
|
|
|
|
|
|
|
this.mnuInsertChartPicker = new Common.UI.DataView({
|
|
|
|
|
el: $('#id-toolbar-menu-insertchart'),
|
|
|
|
|
parentMenu: this.btnInsertChart.menu,
|
|
|
|
|
showLast: false,
|
|
|
|
|
restoreHeight: 421,
|
|
|
|
|
groups: new Common.UI.DataViewGroupStore([
|
|
|
|
|
{id: 'menu-chart-group-bar', caption: me.textColumn, headername: me.textCharts},
|
|
|
|
|
{id: 'menu-chart-group-line', caption: me.textLine},
|
|
|
|
|
{id: 'menu-chart-group-pie', caption: me.textPie},
|
|
|
|
|
{id: 'menu-chart-group-hbar', caption: me.textBar},
|
|
|
|
|
{id: 'menu-chart-group-area', caption: me.textArea, inline: true},
|
|
|
|
|
{id: 'menu-chart-group-scatter', caption: me.textPoint, inline: true},
|
|
|
|
|
{id: 'menu-chart-group-stock', caption: me.textStock, inline: true}
|
|
|
|
|
]),
|
|
|
|
|
store: new Common.UI.DataViewStore([
|
|
|
|
|
{
|
|
|
|
|
group: 'menu-chart-group-bar',
|
|
|
|
|
type: Asc.c_oAscChartTypeSettings.barNormal,
|
|
|
|
|
allowSelected: true,
|
|
|
|
|
iconCls: 'column-normal',
|
|
|
|
|
selected: true
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
group: 'menu-chart-group-bar',
|
|
|
|
|
type: Asc.c_oAscChartTypeSettings.barStacked,
|
|
|
|
|
allowSelected: true,
|
|
|
|
|
iconCls: 'column-stack'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
group: 'menu-chart-group-bar',
|
|
|
|
|
type: Asc.c_oAscChartTypeSettings.barStackedPer,
|
|
|
|
|
allowSelected: true,
|
|
|
|
|
iconCls: 'column-pstack'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
group: 'menu-chart-group-bar',
|
|
|
|
|
type: Asc.c_oAscChartTypeSettings.barNormal3d,
|
|
|
|
|
allowSelected: true,
|
|
|
|
|
iconCls: 'column-3d-normal'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
group: 'menu-chart-group-bar',
|
|
|
|
|
type: Asc.c_oAscChartTypeSettings.barStacked3d,
|
|
|
|
|
allowSelected: true,
|
|
|
|
|
iconCls: 'column-3d-stack'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
group: 'menu-chart-group-bar',
|
|
|
|
|
type: Asc.c_oAscChartTypeSettings.barStackedPer3d,
|
|
|
|
|
allowSelected: true,
|
|
|
|
|
iconCls: 'column-3d-pstack'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
group: 'menu-chart-group-bar',
|
|
|
|
|
type: Asc.c_oAscChartTypeSettings.barNormal3dPerspective,
|
|
|
|
|
allowSelected: true,
|
|
|
|
|
iconCls: 'column-3d-normal-per'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
group: 'menu-chart-group-line',
|
|
|
|
|
type: Asc.c_oAscChartTypeSettings.lineNormal,
|
|
|
|
|
allowSelected: true,
|
|
|
|
|
iconCls: 'line-normal'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
group: 'menu-chart-group-line',
|
|
|
|
|
type: Asc.c_oAscChartTypeSettings.lineStacked,
|
|
|
|
|
allowSelected: true,
|
|
|
|
|
iconCls: 'line-stack'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
group: 'menu-chart-group-line',
|
|
|
|
|
type: Asc.c_oAscChartTypeSettings.lineStackedPer,
|
|
|
|
|
allowSelected: true,
|
|
|
|
|
iconCls: 'line-pstack'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
group: 'menu-chart-group-line',
|
|
|
|
|
type: Asc.c_oAscChartTypeSettings.line3d,
|
|
|
|
|
allowSelected: true,
|
|
|
|
|
iconCls: 'line-3d'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
group: 'menu-chart-group-pie',
|
|
|
|
|
type: Asc.c_oAscChartTypeSettings.pie,
|
|
|
|
|
allowSelected: true,
|
|
|
|
|
iconCls: 'pie-normal'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
group: 'menu-chart-group-pie',
|
|
|
|
|
type: Asc.c_oAscChartTypeSettings.doughnut,
|
|
|
|
|
allowSelected: true,
|
|
|
|
|
iconCls: 'pie-doughnut'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
group: 'menu-chart-group-pie',
|
|
|
|
|
type: Asc.c_oAscChartTypeSettings.pie3d,
|
|
|
|
|
allowSelected: true,
|
|
|
|
|
iconCls: 'pie-3d-normal'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
group: 'menu-chart-group-hbar',
|
|
|
|
|
type: Asc.c_oAscChartTypeSettings.hBarNormal,
|
|
|
|
|
allowSelected: true,
|
|
|
|
|
iconCls: 'bar-normal'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
group: 'menu-chart-group-hbar',
|
|
|
|
|
type: Asc.c_oAscChartTypeSettings.hBarStacked,
|
|
|
|
|
allowSelected: true,
|
|
|
|
|
iconCls: 'bar-stack'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
group: 'menu-chart-group-hbar',
|
|
|
|
|
type: Asc.c_oAscChartTypeSettings.hBarStackedPer,
|
|
|
|
|
allowSelected: true,
|
|
|
|
|
iconCls: 'bar-pstack'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
group: 'menu-chart-group-hbar',
|
|
|
|
|
type: Asc.c_oAscChartTypeSettings.hBarNormal3d,
|
|
|
|
|
allowSelected: true,
|
|
|
|
|
iconCls: 'bar-3d-normal'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
group: 'menu-chart-group-hbar',
|
|
|
|
|
type: Asc.c_oAscChartTypeSettings.hBarStacked3d,
|
|
|
|
|
allowSelected: true,
|
|
|
|
|
iconCls: 'bar-3d-stack'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
group: 'menu-chart-group-hbar',
|
|
|
|
|
type: Asc.c_oAscChartTypeSettings.hBarStackedPer3d,
|
|
|
|
|
allowSelected: true,
|
|
|
|
|
iconCls: 'bar-3d-pstack'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
group: 'menu-chart-group-area',
|
|
|
|
|
type: Asc.c_oAscChartTypeSettings.areaNormal,
|
|
|
|
|
allowSelected: true,
|
|
|
|
|
iconCls: 'area-normal'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
group: 'menu-chart-group-area',
|
|
|
|
|
type: Asc.c_oAscChartTypeSettings.areaStacked,
|
|
|
|
|
allowSelected: true,
|
|
|
|
|
iconCls: 'area-stack'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
group: 'menu-chart-group-area',
|
|
|
|
|
type: Asc.c_oAscChartTypeSettings.areaStackedPer,
|
|
|
|
|
allowSelected: true,
|
|
|
|
|
iconCls: 'area-pstack'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
group: 'menu-chart-group-scatter',
|
|
|
|
|
type: Asc.c_oAscChartTypeSettings.scatter,
|
|
|
|
|
allowSelected: true,
|
|
|
|
|
iconCls: 'point-normal'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
group: 'menu-chart-group-stock',
|
|
|
|
|
type: Asc.c_oAscChartTypeSettings.stock,
|
|
|
|
|
allowSelected: true,
|
|
|
|
|
iconCls: 'stock-normal'
|
|
|
|
|
}
|
|
|
|
|
]),
|
|
|
|
|
itemTemplate: _.template('<div id="<%= id %>" class="item-chartlist <%= iconCls %>"></div>')
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
this.mnuTablePicker = new Common.UI.DimensionPicker({
|
|
|
|
|
el: $('#id-toolbar-menu-tablepicker'),
|
|
|
|
|
minRows: 8,
|
|
|
|
|
minColumns: 10,
|
|
|
|
|
maxRows: 8,
|
|
|
|
|
maxColumns: 10
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
/**/
|
|
|
|
|
var mode = this.mode;
|
|
|
|
|
|
2017-04-06 09:34:01 +00:00
|
|
|
// value = Common.localStorage.getItem("de-compact-toolbar");
|
|
|
|
|
// var valueCompact = !!(value !== null && parseInt(value) == 1 || value === null && this.mode.customization && this.mode.customization.compactToolbar);
|
|
|
|
|
this.mnuitemCompactToolbar.setChecked(this.isCompactView, true);
|
2017-02-20 14:51:33 +00:00
|
|
|
this.mnuitemCompactToolbar.on('toggle', _.bind(this.changeViewMode, this));
|
|
|
|
|
|
2017-04-10 13:40:48 +00:00
|
|
|
// this.mnuitemHideTitleBar.setChecked( Common.localStorage.getBool("de-hidden-title"), true );
|
2017-04-06 09:42:43 +00:00
|
|
|
this.mnuitemHideStatusBar.setChecked( Common.localStorage.getBool("de-hidden-status"), true );
|
|
|
|
|
this.mnuitemHideRulers.setChecked( Common.localStorage.getBool("de-hidden-rulers"), true );
|
2017-02-20 14:51:33 +00:00
|
|
|
/**/
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
updateMetricUnit: function () {
|
|
|
|
|
var items = this.btnPageMargins.menu.items;
|
|
|
|
|
for (var i = 0; i < items.length; i++) {
|
|
|
|
|
var mnu = items[i];
|
|
|
|
|
if (mnu.checkable) {
|
|
|
|
|
var checked = mnu.checked;
|
|
|
|
|
$(mnu.el).html(mnu.template({
|
|
|
|
|
id: Common.UI.getId(),
|
|
|
|
|
caption: mnu.caption,
|
|
|
|
|
options: mnu.options
|
|
|
|
|
}));
|
|
|
|
|
if (checked) mnu.setChecked(checked);
|
|
|
|
|
}
|
2016-04-07 09:08:13 +00:00
|
|
|
}
|
2017-02-20 14:51:33 +00:00
|
|
|
items = this.btnPageSize.menu.items;
|
|
|
|
|
for (var i = 0; i < items.length; i++) {
|
|
|
|
|
var mnu = items[i];
|
|
|
|
|
if (mnu.checkable) {
|
|
|
|
|
var checked = mnu.checked;
|
|
|
|
|
$(mnu.el).html(mnu.template({
|
|
|
|
|
id: Common.UI.getId(),
|
|
|
|
|
caption: mnu.caption,
|
|
|
|
|
options: mnu.options
|
|
|
|
|
}));
|
|
|
|
|
if (checked) mnu.setChecked(checked);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
setApi: function (api) {
|
|
|
|
|
this.api = api;
|
|
|
|
|
/** coauthoring begin **/
|
|
|
|
|
this.api.asc_registerCallback('asc_onSendThemeColorSchemes', _.bind(this.onSendThemeColorSchemes, this));
|
|
|
|
|
this.api.asc_registerCallback('asc_onCollaborativeChanges', _.bind(this.onCollaborativeChanges, this));
|
|
|
|
|
this.api.asc_registerCallback('asc_onAuthParticipantsChanged', _.bind(this.onApiUsersChanged, this));
|
|
|
|
|
this.api.asc_registerCallback('asc_onParticipantsChanged', _.bind(this.onApiUsersChanged, this));
|
|
|
|
|
/** coauthoring end **/
|
|
|
|
|
return this;
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
setMode: function (mode) {
|
|
|
|
|
if (mode.isDisconnected) {
|
|
|
|
|
this.btnSave.setDisabled(true);
|
|
|
|
|
this.btnCopy.setDisabled(true);
|
|
|
|
|
this.btnPaste.setDisabled(true);
|
|
|
|
|
this.btnUndo.setDisabled(true);
|
|
|
|
|
this.btnRedo.setDisabled(true);
|
|
|
|
|
this.btnIncFontSize.setDisabled(true);
|
|
|
|
|
this.btnDecFontSize.setDisabled(true);
|
|
|
|
|
this.btnBold.setDisabled(true);
|
|
|
|
|
this.btnItalic.setDisabled(true);
|
|
|
|
|
this.btnUnderline.setDisabled(true);
|
|
|
|
|
this.btnStrikeout.setDisabled(true);
|
|
|
|
|
this.btnSuperscript.setDisabled(true);
|
|
|
|
|
this.btnSubscript.setDisabled(true);
|
|
|
|
|
this.btnHighlightColor.setDisabled(true);
|
|
|
|
|
this.btnFontColor.setDisabled(true);
|
|
|
|
|
this.btnParagraphColor.setDisabled(true);
|
|
|
|
|
this.btnMarkers.setDisabled(true);
|
|
|
|
|
this.btnNumbers.setDisabled(true);
|
|
|
|
|
this.btnMultilevels.setDisabled(true);
|
|
|
|
|
this.btnAlignLeft.setDisabled(true);
|
|
|
|
|
this.btnAlignCenter.setDisabled(true);
|
|
|
|
|
this.btnAlignRight.setDisabled(true);
|
|
|
|
|
this.btnAlignJust.setDisabled(true);
|
|
|
|
|
this.btnDecLeftOffset.setDisabled(true);
|
|
|
|
|
this.btnIncLeftOffset.setDisabled(true);
|
|
|
|
|
this.btnLineSpace.setDisabled(true);
|
|
|
|
|
this.btnShowHidenChars.setDisabled(true);
|
|
|
|
|
this.btnInsertTable.setDisabled(true);
|
|
|
|
|
this.btnInsertImage.setDisabled(true);
|
|
|
|
|
this.btnInsertChart.setDisabled(true);
|
|
|
|
|
this.btnInsertText.setDisabled(true);
|
|
|
|
|
this.btnDropCap.setDisabled(true);
|
|
|
|
|
this.btnColumns.setDisabled(true);
|
|
|
|
|
this.btnInsertHyperlink.setDisabled(true);
|
|
|
|
|
this.btnEditHeader.setDisabled(true);
|
|
|
|
|
this.btnInsertShape.setDisabled(true);
|
|
|
|
|
this.btnInsertEquation.setDisabled(true);
|
|
|
|
|
this.btnPageOrient.setDisabled(true);
|
|
|
|
|
this.btnPageMargins.setDisabled(true);
|
|
|
|
|
this.btnPageSize.setDisabled(true);
|
|
|
|
|
this.btnClearStyle.setDisabled(true);
|
|
|
|
|
this.btnCopyStyle.setDisabled(true);
|
|
|
|
|
this.btnColorSchemas.setDisabled(true);
|
|
|
|
|
this.btnMailRecepients.setDisabled(true);
|
|
|
|
|
this.btnHorizontalAlign.setDisabled(true);
|
|
|
|
|
this.cmbFontName.setDisabled(true);
|
|
|
|
|
this.cmbFontSize.setDisabled(true);
|
|
|
|
|
this.listStyles.setDisabled(true);
|
|
|
|
|
this.btnNotes.setDisabled(true);
|
|
|
|
|
if (mode.disableDownload)
|
|
|
|
|
this.btnPrint.setDisabled(true);
|
2017-03-31 10:54:02 +00:00
|
|
|
|
|
|
|
|
this.btnsPageBreak.disable(true);
|
2016-04-07 09:08:13 +00:00
|
|
|
}
|
2016-03-11 00:48:53 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
this.mode = mode;
|
2016-08-23 11:36:55 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
this.btnMailRecepients.setVisible(mode.canCoAuthoring == true && mode.canUseMailMerge);
|
|
|
|
|
this.listStylesAdditionalMenuItem.setVisible(mode.canEditStyles);
|
|
|
|
|
},
|
2016-03-11 00:48:53 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
changeViewMode: function (item, compact) {
|
2017-04-06 09:34:01 +00:00
|
|
|
this.fireEvent('view:compact', [this, compact]);
|
2017-02-20 14:51:33 +00:00
|
|
|
},
|
2016-03-11 00:48:53 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
onSendThemeColorSchemes: function (schemas) {
|
|
|
|
|
var me = this;
|
2016-03-11 00:48:53 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
if (this.mnuColorSchema && this.mnuColorSchema.items.length > 0) {
|
|
|
|
|
_.each(this.mnuColorSchema.items, function (item) {
|
|
|
|
|
item.remove();
|
|
|
|
|
});
|
|
|
|
|
}
|
2016-03-11 00:48:53 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
if (this.mnuColorSchema == null) {
|
|
|
|
|
this.mnuColorSchema = new Common.UI.Menu({
|
|
|
|
|
maxHeight: 600,
|
|
|
|
|
restoreHeight: 600
|
|
|
|
|
}).on('show:before', function (mnu) {
|
|
|
|
|
this.scroller = new Common.UI.Scroller({
|
|
|
|
|
el: $(this.el).find('.dropdown-menu '),
|
|
|
|
|
useKeyboard: this.enableKeyEvents && !this.handleSelect,
|
|
|
|
|
minScrollbarLength: 40
|
|
|
|
|
});
|
2016-08-23 08:25:57 +00:00
|
|
|
});
|
2017-02-20 14:51:33 +00:00
|
|
|
}
|
|
|
|
|
this.mnuColorSchema.items = [];
|
2016-03-11 00:48:53 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
var itemTemplate = _.template([
|
|
|
|
|
'<a id="<%= id %>" tabindex="-1" type="menuitem" class="<%= options.cls %>">',
|
2016-03-11 00:48:53 +00:00
|
|
|
'<span class="colors">',
|
2017-02-20 14:51:33 +00:00
|
|
|
'<% _.each(options.colors, function(color) { %>',
|
|
|
|
|
'<span class="color" style="background: <%= color %>;"></span>',
|
|
|
|
|
'<% }) %>',
|
2016-03-11 00:48:53 +00:00
|
|
|
'</span>',
|
|
|
|
|
'<span class="text"><%= caption %></span>',
|
2017-02-20 14:51:33 +00:00
|
|
|
'</a>'
|
|
|
|
|
].join(''));
|
|
|
|
|
|
|
|
|
|
_.each(schemas, function (schema, index) {
|
|
|
|
|
var colors = schema.get_colors();//schema.colors;
|
|
|
|
|
var schemecolors = [];
|
|
|
|
|
for (var j = 2; j < 7; j++) {
|
|
|
|
|
var clr = '#' + Common.Utils.ThemeColor.getHexColor(colors[j].get_r(), colors[j].get_g(), colors[j].get_b());
|
|
|
|
|
schemecolors.push(clr);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
if (index == 21) {
|
|
|
|
|
this.mnuColorSchema.addItem({
|
|
|
|
|
caption: '--'
|
|
|
|
|
});
|
|
|
|
|
} else {
|
|
|
|
|
this.mnuColorSchema.addItem({
|
|
|
|
|
template: itemTemplate,
|
|
|
|
|
cls: 'color-schemas-menu',
|
|
|
|
|
colors: schemecolors,
|
|
|
|
|
caption: (index < 21) ? (me.SchemeNames[index] || schema.get_name()) : schema.get_name(),
|
|
|
|
|
value: index
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
}, this);
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
/** coauthoring begin **/
|
|
|
|
|
onCollaborativeChanges: function () {
|
|
|
|
|
if (this._state.hasCollaborativeChanges) return;
|
|
|
|
|
if (!this.btnSave.rendered) {
|
|
|
|
|
this.needShowSynchTip = true;
|
|
|
|
|
return;
|
2016-03-11 00:48:53 +00:00
|
|
|
}
|
|
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
this._state.hasCollaborativeChanges = true;
|
2017-04-19 11:24:23 +00:00
|
|
|
var iconEl = $('.icon', this.btnSave.cmpEl);
|
2017-02-20 14:51:33 +00:00
|
|
|
iconEl.removeClass(this.btnSaveCls);
|
|
|
|
|
iconEl.addClass('btn-synch');
|
|
|
|
|
if (this.showSynchTip) {
|
|
|
|
|
this.btnSave.updateHint('');
|
|
|
|
|
if (this.synchTooltip === undefined)
|
|
|
|
|
this.createSynchTip();
|
|
|
|
|
|
|
|
|
|
this.synchTooltip.show();
|
2016-03-11 00:48:53 +00:00
|
|
|
} else {
|
2017-02-20 14:51:33 +00:00
|
|
|
this.btnSave.updateHint(this.tipSynchronize + Common.Utils.String.platformKey('Ctrl+S'));
|
2016-03-11 00:48:53 +00:00
|
|
|
}
|
|
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
this.btnSave.setDisabled(false);
|
|
|
|
|
Common.Gateway.collaborativeChanges();
|
|
|
|
|
},
|
2016-03-11 00:48:53 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
createSynchTip: function () {
|
|
|
|
|
this.synchTooltip = new Common.UI.SynchronizeTip({
|
|
|
|
|
target: $('#id-toolbar-btn-save')
|
|
|
|
|
});
|
|
|
|
|
this.synchTooltip.on('dontshowclick', function () {
|
|
|
|
|
this.showSynchTip = false;
|
|
|
|
|
this.synchTooltip.hide();
|
|
|
|
|
this.btnSave.updateHint(this.tipSynchronize + Common.Utils.String.platformKey('Ctrl+S'));
|
|
|
|
|
Common.localStorage.setItem("de-hide-synch", 1);
|
|
|
|
|
}, this);
|
|
|
|
|
this.synchTooltip.on('closeclick', function () {
|
|
|
|
|
this.synchTooltip.hide();
|
|
|
|
|
this.btnSave.updateHint(this.tipSynchronize + Common.Utils.String.platformKey('Ctrl+S'));
|
|
|
|
|
}, this);
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
synchronizeChanges: function () {
|
|
|
|
|
if (this.btnSave.rendered) {
|
2017-04-19 11:24:23 +00:00
|
|
|
var iconEl = $('.icon', this.btnSave.cmpEl);
|
2017-02-20 14:51:33 +00:00
|
|
|
|
|
|
|
|
if (iconEl.hasClass('btn-synch')) {
|
|
|
|
|
iconEl.removeClass('btn-synch');
|
|
|
|
|
iconEl.addClass(this.btnSaveCls);
|
|
|
|
|
if (this.synchTooltip)
|
|
|
|
|
this.synchTooltip.hide();
|
|
|
|
|
this.btnSave.updateHint(this.btnSaveTip);
|
2017-04-11 13:40:01 +00:00
|
|
|
this.btnSave.setDisabled(!this.mode.forcesave);
|
2017-02-20 14:51:33 +00:00
|
|
|
this._state.hasCollaborativeChanges = false;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
2016-03-11 00:48:53 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
onApiUsersChanged: function (users) {
|
|
|
|
|
var editusers = [];
|
|
|
|
|
_.each(users, function (item) {
|
|
|
|
|
if (!item.asc_getView())
|
|
|
|
|
editusers.push(item);
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
var length = _.size(editusers);
|
|
|
|
|
var cls = (length > 1) ? 'btn-save-coauth' : 'btn-save';
|
|
|
|
|
if (cls !== this.btnSaveCls && this.btnSave.rendered) {
|
|
|
|
|
this.btnSaveTip = ((length > 1) ? this.tipSaveCoauth : this.tipSave ) + Common.Utils.String.platformKey('Ctrl+S');
|
|
|
|
|
|
2017-04-19 11:24:23 +00:00
|
|
|
var iconEl = $('.icon', this.btnSave.cmpEl);
|
2017-02-20 14:51:33 +00:00
|
|
|
if (!iconEl.hasClass('btn-synch')) {
|
|
|
|
|
iconEl.removeClass(this.btnSaveCls);
|
|
|
|
|
iconEl.addClass(cls);
|
|
|
|
|
this.btnSave.updateHint(this.btnSaveTip);
|
|
|
|
|
}
|
|
|
|
|
this.btnSaveCls = cls;
|
2016-03-11 00:48:53 +00:00
|
|
|
}
|
2017-02-20 14:51:33 +00:00
|
|
|
},
|
2016-03-11 00:48:53 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
/** coauthoring end **/
|
2016-03-11 00:48:53 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
onStyleMenuUpdate: function (item, e, eOpt) {
|
|
|
|
|
var me = this;
|
|
|
|
|
if (me.api) {
|
|
|
|
|
var style = me.api.asc_GetStyleFromFormatting();
|
|
|
|
|
var title = item.styleTitle;
|
|
|
|
|
|
|
|
|
|
var characterStyle = style.get_Link();
|
|
|
|
|
style.put_Name(title);
|
|
|
|
|
characterStyle.put_Name(title + '_character');
|
|
|
|
|
me.api.asc_AddNewStyle(style);
|
|
|
|
|
setTimeout(function () {
|
|
|
|
|
me.listStyles.openButton.menu.hide();
|
|
|
|
|
}, 100);
|
|
|
|
|
}
|
|
|
|
|
},
|
2016-03-11 00:48:53 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
onStyleMenuDelete: function (item, e, eOpt) {
|
|
|
|
|
var me = this;
|
|
|
|
|
if (me.api) {
|
|
|
|
|
this.api.asc_RemoveStyle(item.styleTitle);
|
2016-03-11 00:48:53 +00:00
|
|
|
}
|
2017-02-20 14:51:33 +00:00
|
|
|
},
|
|
|
|
|
|
|
|
|
|
onStyleMenuRestoreAll: function (item, e, eOpt) {
|
|
|
|
|
var me = this;
|
|
|
|
|
if (me.api) {
|
|
|
|
|
_.each(window.styles.get_MergedStyles(), function (style) {
|
|
|
|
|
if (me.api.asc_IsStyleDefault(style.get_Name())) {
|
|
|
|
|
me.api.asc_RemoveStyle(style.get_Name());
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
},
|
2016-03-11 00:48:53 +00:00
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
onStyleMenuDeleteAll: function (item, e, eOpt) {
|
|
|
|
|
if (this.api)
|
|
|
|
|
this.api.asc_RemoveAllCustomStyles();
|
|
|
|
|
},
|
|
|
|
|
|
2017-03-16 10:20:07 +00:00
|
|
|
setTab: function (tab) {
|
2017-04-10 13:39:03 +00:00
|
|
|
if ( !tab || !tab.length ) {
|
|
|
|
|
if ( isFolded ) onShowCoveredPanel(false);
|
|
|
|
|
else tab = lastPanel;
|
2017-02-20 14:51:33 +00:00
|
|
|
}
|
|
|
|
|
|
2017-04-10 13:39:03 +00:00
|
|
|
if ( tab ) {
|
|
|
|
|
$tabs.removeClass('active');
|
|
|
|
|
$panels.removeClass('active');
|
|
|
|
|
|
|
|
|
|
var panel = $panels.filter('[data-tab=' + tab + ']');
|
|
|
|
|
if (panel.length) {
|
|
|
|
|
lastPanel = tab;
|
|
|
|
|
panel.addClass('active');
|
|
|
|
|
}
|
2017-02-20 14:51:33 +00:00
|
|
|
|
2017-04-10 13:39:03 +00:00
|
|
|
var $tp = $tabs.find('> a[data-tab=' + tab + ']').parent();
|
|
|
|
|
if ($tp.length) {
|
|
|
|
|
$tp.addClass('active');
|
2017-02-20 14:51:33 +00:00
|
|
|
|
2017-04-10 13:39:03 +00:00
|
|
|
$marker.width($tp.width());
|
|
|
|
|
|
|
|
|
|
if ($scrollL.is(':visible'))
|
|
|
|
|
$marker.css({left: $tp.position().left + $boxTabs.scrollLeft() - $scrollL.width()});
|
|
|
|
|
else $marker.css({left: $tp.position().left});
|
|
|
|
|
}
|
2017-02-28 10:09:05 +00:00
|
|
|
|
2017-04-10 13:39:03 +00:00
|
|
|
if ( isFolded ) {
|
|
|
|
|
if ( panel.length )
|
|
|
|
|
expandToolbar(); else
|
|
|
|
|
onShowCoveredPanel(true);
|
|
|
|
|
}
|
|
|
|
|
}
|
2017-02-20 14:51:33 +00:00
|
|
|
},
|
|
|
|
|
|
2017-02-27 12:02:37 +00:00
|
|
|
addTab: function (tab, panel, after) {
|
2017-03-16 10:20:07 +00:00
|
|
|
function _get_tab_action(index) {
|
|
|
|
|
if ( !config.tabs[index] )
|
|
|
|
|
return _get_tab_action(--index);
|
|
|
|
|
|
|
|
|
|
return config.tabs[index].action;
|
|
|
|
|
}
|
|
|
|
|
|
2017-04-20 10:32:55 +00:00
|
|
|
var _tplTab = '<li class="ribtab"><a href="#" data-tab="<%= action %>" data-title="<%= caption %>"><%= caption %></a></li>';
|
2017-02-27 12:02:37 +00:00
|
|
|
|
2017-03-16 10:20:07 +00:00
|
|
|
config.tabs[after + 1] = tab;
|
|
|
|
|
var _after_action = _get_tab_action( after );
|
|
|
|
|
|
2017-03-29 16:24:20 +00:00
|
|
|
var _elements = $tabs || config.$dom.find('.tabs');
|
|
|
|
|
var $target = _elements.find('a[data-tab=' + _after_action + ']');
|
|
|
|
|
if ( $target.length ) {
|
|
|
|
|
$target.parent().after( _.template(_tplTab, tab) );
|
2017-02-27 12:02:37 +00:00
|
|
|
|
2017-03-29 16:24:20 +00:00
|
|
|
if ( panel ) {
|
|
|
|
|
_elements = $panels || config.$dom.find('.box-panels > .panel');
|
|
|
|
|
$target = _elements.filter('[data-tab=' + _after_action + ']');
|
2017-02-27 12:02:37 +00:00
|
|
|
|
2017-03-29 16:24:20 +00:00
|
|
|
if ( $target.length ) {
|
|
|
|
|
$target.after(panel);
|
2017-02-27 12:02:37 +00:00
|
|
|
}
|
|
|
|
|
}
|
2017-03-29 16:24:20 +00:00
|
|
|
|
|
|
|
|
// synchronize matched elements
|
|
|
|
|
$tabs && ($tabs = $boxTabs.find('> li'));
|
|
|
|
|
$panels && ($panels = this.$el.find('.box-panels > .panel'));
|
2017-02-27 12:02:37 +00:00
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
2017-02-28 10:09:05 +00:00
|
|
|
setFolded: function (f) {
|
|
|
|
|
setFolded.call(this, f);
|
|
|
|
|
},
|
|
|
|
|
|
2017-03-01 13:33:12 +00:00
|
|
|
setExtra: function (place, el) {
|
|
|
|
|
if ( $tabs ) {
|
|
|
|
|
} else {
|
|
|
|
|
if ( place == 'right' ) {
|
|
|
|
|
config.$dom.find('.extra.right').html(el);
|
|
|
|
|
} else
|
|
|
|
|
if ( place == 'left' ) {
|
|
|
|
|
config.$dom.find('.extra.left').html(el);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
2017-04-06 09:42:43 +00:00
|
|
|
isCompact: function () {
|
|
|
|
|
return isFolded;
|
|
|
|
|
},
|
|
|
|
|
|
2017-02-20 14:51:33 +00:00
|
|
|
textBold: 'Bold',
|
|
|
|
|
textItalic: 'Italic',
|
|
|
|
|
textUnderline: 'Underline',
|
|
|
|
|
textStrikeout: 'Strikeout',
|
|
|
|
|
textSuperscript: 'Superscript',
|
|
|
|
|
textSubscript: 'Subscript',
|
|
|
|
|
strMenuNoFill: 'No Fill',
|
|
|
|
|
tipFontName: 'Font Name',
|
|
|
|
|
tipFontSize: 'Font Size',
|
|
|
|
|
tipParagraphStyle: 'Paragraph Style',
|
|
|
|
|
tipCopy: 'Copy',
|
|
|
|
|
tipPaste: 'Paste',
|
|
|
|
|
tipUndo: 'Undo',
|
|
|
|
|
tipRedo: 'Redo',
|
|
|
|
|
tipPrint: 'Print',
|
|
|
|
|
tipSave: 'Save',
|
|
|
|
|
tipIncFont: 'Increment font size',
|
|
|
|
|
tipDecFont: 'Decrement font size',
|
|
|
|
|
tipHighlightColor: 'Highlight color',
|
|
|
|
|
tipFontColor: 'Font color',
|
|
|
|
|
tipMarkers: 'Bullets',
|
|
|
|
|
tipNumbers: 'Numbering',
|
|
|
|
|
tipMultilevels: 'Outline',
|
|
|
|
|
tipAlignLeft: 'Align Left',
|
|
|
|
|
tipAlignRight: 'Align Right',
|
|
|
|
|
tipAlignCenter: 'Align Center',
|
|
|
|
|
tipAlignJust: 'Justified',
|
|
|
|
|
tipDecPrLeft: 'Decrease Indent',
|
|
|
|
|
tipIncPrLeft: 'Increase Indent',
|
|
|
|
|
tipShowHiddenChars: 'Nonprinting Characters',
|
|
|
|
|
tipLineSpace: 'Paragraph Line Spacing',
|
|
|
|
|
tipPrColor: 'Background color',
|
|
|
|
|
tipInsertTable: 'Insert Table',
|
|
|
|
|
tipInsertImage: 'Insert Picture',
|
|
|
|
|
tipPageBreak: 'Insert Page or Section break',
|
|
|
|
|
tipInsertNum: 'Insert Page Number',
|
|
|
|
|
tipClearStyle: 'Clear Style',
|
|
|
|
|
tipCopyStyle: 'Copy Style',
|
|
|
|
|
tipPageSize: 'Page Size',
|
|
|
|
|
tipPageOrient: 'Page Orientation',
|
|
|
|
|
tipBack: 'Back',
|
|
|
|
|
tipInsertShape: 'Insert Autoshape',
|
|
|
|
|
tipInsertEquation: 'Insert Equation',
|
|
|
|
|
mniImageFromFile: 'Picture from file',
|
|
|
|
|
mniImageFromUrl: 'Picture from url',
|
|
|
|
|
mniCustomTable: 'Insert Custom Table',
|
|
|
|
|
textTitleError: 'Error',
|
|
|
|
|
textInsertPageNumber: 'Insert page number',
|
|
|
|
|
textToCurrent: 'To Current Position',
|
|
|
|
|
tipEditHeader: 'Edit Document Header or Footer',
|
|
|
|
|
mniEditHeader: 'Edit Document Header',
|
|
|
|
|
mniEditFooter: 'Edit Document Footer',
|
|
|
|
|
tipInsertHyperlink: 'Add Hyperlink',
|
|
|
|
|
mniHiddenChars: 'Nonprinting Characters',
|
|
|
|
|
mniHiddenBorders: 'Hidden Table Borders',
|
|
|
|
|
tipSynchronize: 'The document has been changed by another user. Please click to save your changes and reload the updates.',
|
|
|
|
|
textNewColor: 'Add New Custom Color',
|
|
|
|
|
textAutoColor: 'Automatic',
|
|
|
|
|
tipInsertChart: 'Insert Chart',
|
|
|
|
|
textLine: 'Line',
|
|
|
|
|
textColumn: 'Column',
|
|
|
|
|
textBar: 'Bar',
|
|
|
|
|
textArea: 'Area',
|
|
|
|
|
textPie: 'Pie',
|
|
|
|
|
textPoint: 'XY (Scatter)',
|
|
|
|
|
textStock: 'Stock',
|
|
|
|
|
tipColorSchemas: 'Change Color Scheme',
|
|
|
|
|
tipInsertText: 'Insert Text',
|
|
|
|
|
tipHAligh: 'Horizontal Align',
|
|
|
|
|
tipViewSettings: 'View Settings',
|
|
|
|
|
tipAdvSettings: 'Advanced Settings',
|
|
|
|
|
textCompactView: 'View Compact Toolbar',
|
|
|
|
|
textHideTitleBar: 'Hide Title Bar',
|
|
|
|
|
textHideStatusBar: 'Hide Status Bar',
|
|
|
|
|
textHideLines: 'Hide Rulers',
|
|
|
|
|
textFitPage: 'Fit to Page',
|
|
|
|
|
textFitWidth: 'Fit to Width',
|
|
|
|
|
textZoom: 'Zoom',
|
|
|
|
|
mniEditDropCap: 'Drop Cap Settings',
|
|
|
|
|
textNone: 'None',
|
|
|
|
|
textInText: 'In Text',
|
|
|
|
|
textInMargin: 'In Margin',
|
|
|
|
|
tipDropCap: 'Insert drop cap',
|
|
|
|
|
txtScheme1: 'Office',
|
|
|
|
|
txtScheme2: 'Grayscale',
|
|
|
|
|
txtScheme3: 'Apex',
|
|
|
|
|
txtScheme4: 'Aspect',
|
|
|
|
|
txtScheme5: 'Civic',
|
|
|
|
|
txtScheme6: 'Concourse',
|
|
|
|
|
txtScheme7: 'Equity',
|
|
|
|
|
txtScheme8: 'Flow',
|
|
|
|
|
txtScheme9: 'Foundry',
|
|
|
|
|
txtScheme10: 'Median',
|
|
|
|
|
txtScheme11: 'Metro',
|
|
|
|
|
txtScheme12: 'Module',
|
|
|
|
|
txtScheme13: 'Opulent',
|
|
|
|
|
txtScheme14: 'Oriel',
|
|
|
|
|
txtScheme15: 'Origin',
|
|
|
|
|
txtScheme16: 'Paper',
|
|
|
|
|
txtScheme17: 'Solstice',
|
|
|
|
|
txtScheme18: 'Technic',
|
|
|
|
|
txtScheme19: 'Trek',
|
|
|
|
|
txtScheme20: 'Urban',
|
|
|
|
|
txtScheme21: 'Verve',
|
|
|
|
|
textInsPageBreak: 'Insert Page Break',
|
|
|
|
|
textInsColumnBreak: 'Insert Column Break',
|
|
|
|
|
textInsSectionBreak: 'Insert Section Break',
|
|
|
|
|
textNextPage: 'Next Page',
|
|
|
|
|
textContPage: 'Continuous Page',
|
|
|
|
|
textEvenPage: 'Even Page',
|
|
|
|
|
textOddPage: 'Odd Page',
|
|
|
|
|
tipSaveCoauth: 'Save your changes for the other users to see them.',
|
|
|
|
|
tipMailRecepients: 'Mail Merge',
|
|
|
|
|
textStyleMenuUpdate: 'Update from select',
|
|
|
|
|
textStyleMenuRestore: 'Restore to default',
|
|
|
|
|
textStyleMenuDelete: 'Delete style',
|
|
|
|
|
textStyleMenuRestoreAll: 'Restore all to default styles',
|
|
|
|
|
textStyleMenuDeleteAll: 'Delete all custom styles',
|
|
|
|
|
textStyleMenuNew: 'New style from selection',
|
|
|
|
|
textInsText: 'Insert text box',
|
|
|
|
|
textInsTextArt: 'Insert Text Art',
|
|
|
|
|
tipColumns: 'Insert columns',
|
|
|
|
|
textColumnsOne: 'One',
|
|
|
|
|
textColumnsTwo: 'Two',
|
|
|
|
|
textColumnsThree: 'Three',
|
|
|
|
|
textColumnsLeft: 'Left',
|
|
|
|
|
textColumnsRight: 'Right',
|
|
|
|
|
tipPageMargins: 'Page Margins',
|
|
|
|
|
textMarginsLast: 'Last Custom',
|
|
|
|
|
textMarginsNormal: 'Normal',
|
|
|
|
|
textMarginsUsNormal: 'US Normal',
|
|
|
|
|
textMarginsNarrow: 'Narrow',
|
|
|
|
|
textMarginsModerate: 'Moderate',
|
|
|
|
|
textMarginsWide: 'Wide',
|
|
|
|
|
textPageMarginsCustom: 'Custom margins',
|
|
|
|
|
textTop: 'Top: ',
|
|
|
|
|
textLeft: 'Left: ',
|
|
|
|
|
textBottom: 'Bottom: ',
|
|
|
|
|
textRight: 'Right: ',
|
|
|
|
|
textPageSizeCustom: 'Custom Page Size',
|
|
|
|
|
textPortrait: 'Portrait',
|
|
|
|
|
textLandscape: 'Landscape',
|
|
|
|
|
textInsertPageCount: 'Insert number of pages',
|
|
|
|
|
textCharts: 'Charts',
|
|
|
|
|
tipNotes: 'Footnotes',
|
|
|
|
|
mniInsFootnote: 'Insert Footnote',
|
|
|
|
|
mniDelFootnote: 'Delete All Footnotes',
|
|
|
|
|
mniNoteSettings: 'Notes Settings',
|
|
|
|
|
textGotoFootnote: 'Go to Footnotes',
|
2017-04-20 10:23:50 +00:00
|
|
|
tipChangeChart: 'Change Chart Type',
|
2017-04-19 12:09:44 +00:00
|
|
|
capBtnInsPagebreak: 'Page Break',
|
|
|
|
|
capBtnInsImage: 'Picture',
|
|
|
|
|
capBtnInsTable: 'Table',
|
|
|
|
|
capBtnInsChart: 'Chart',
|
|
|
|
|
capBtnInsLink: 'Hyperlink',
|
2017-04-20 10:23:50 +00:00
|
|
|
textTabFile: 'File',
|
|
|
|
|
textTabHome: 'Home',
|
|
|
|
|
textTabInsert: 'Insert',
|
|
|
|
|
textTabLayout: 'Page Layout',
|
|
|
|
|
textTabReview: 'Review'
|
2017-04-19 12:09:44 +00:00
|
|
|
capBtnInsShape: 'Shape',
|
|
|
|
|
capBtnInsTextbox: 'Text',
|
|
|
|
|
capBtnInsDropcap: 'Drop Cap',
|
|
|
|
|
capBtnInsFootnote: 'Footnotes',
|
|
|
|
|
capBtnInsEquation: 'Equation',
|
|
|
|
|
capBtnInsHeader: 'Headers/Footers',
|
|
|
|
|
capBtnColumns: 'Columns',
|
|
|
|
|
capBtnPageOrient: 'Orientation',
|
|
|
|
|
capBtnMargins: 'Margins',
|
|
|
|
|
capBtnPageSize: 'Size',
|
|
|
|
|
tipImgAlign: 'Align objects',
|
|
|
|
|
tipImgGroup: 'Group objects',
|
|
|
|
|
tipImgWrapping: 'Wrap text',
|
|
|
|
|
tipSendForward: 'Send forward',
|
|
|
|
|
tipSendBackward: 'Send backward',
|
|
|
|
|
capImgAlign: 'Align',
|
|
|
|
|
capImgGroup: 'Group',
|
|
|
|
|
capImgForward: 'Move forward',
|
|
|
|
|
capImgBackward: 'Move backward',
|
|
|
|
|
capImgWrapping: 'Wrapping'
|
2017-02-20 14:51:33 +00:00
|
|
|
}
|
|
|
|
|
})(), DE.Views.Toolbar || {}));
|
2016-03-11 00:48:53 +00:00
|
|
|
});
|
