Skip to content

W
web-apps
Commit af7f2254 authored by Julia Radzhabova's avatar Julia Radzhabova Committed by GitHub
Browse files
Options

Merge pull request #15 from ONLYOFFICE/refactor 

Refactor
parents de773f86 d38c8714
Hide whitespace changes
Inline Side-by-side
Showing with 1688 additions and 1584 deletions
apps/common/main/lib/component/Button.js
View file @ af7f2254
......@@ -218,7 +218,7 @@ define([
style : me.style
}));
if (me.menu && _.isFunction(me.menu.render))
if (me.menu && _.isObject(me.menu) && _.isFunction(me.menu.render))
me.menu.render(me.cmpEl);
parentEl.html(me.cmpEl);
......@@ -379,7 +379,7 @@ define([
}
if (me.disabled) {
me.setDisabled(me.disabled);
me.setDisabled(!(me.disabled=false));
}
me.trigger('render:after', me);
......@@ -414,7 +414,7 @@ define([
},
setDisabled: function(disabled) {
if (this.rendered) {
if (this.rendered && this.disabled != disabled) {
var el = this.cmpEl,
isGroup = el.hasClass('btn-group');
......@@ -489,6 +489,13 @@ define([
}
}
}
},
setMenu: function (m) {
if (m && _.isObject(m) && _.isFunction(m.render)){
this.menu = m;
this.menu.render(this.cmpEl);
}
}
});
});
......
apps/common/main/lib/component/ComboBox.js
View file @ af7f2254
......@@ -188,13 +188,6 @@ define([
Common.NotificationCenter.on('menumanager:hideall', _.bind(me.closeMenu, me));
this.scroller = new Common.UI.Scroller({
el: $('.dropdown-menu', me.cmpEl),
minScrollbarLength : 40,
scrollYMarginOffset: 30,
includePadding : true
});
// set default selection
this.setDefaultSelection();
......@@ -232,6 +225,15 @@ define([
},
onBeforeShowMenu: function(e) {
if ( !this.scroller ) {
this.scroller = new Common.UI.Scroller(_.extend({
el: $('.dropdown-menu', this.cmpEl),
minScrollbarLength: 40,
scrollYMarginOffset: 30,
includePadding: true
}, this.options.scroller));
}
Common.NotificationCenter.trigger('menu:show');
this.trigger('show:before', this, e);
if (this.options.hint) {
......@@ -525,12 +527,12 @@ define([
this.scroller.destroy();
delete this.scroller;
}
this.scroller = new Common.UI.Scroller({
this.scroller = new Common.UI.Scroller(_.extend({
el: $('.dropdown-menu', this.cmpEl),
minScrollbarLength : 40,
scrollYMarginOffset: 30,
includePadding : true
});
}, this.options.scroller));
}
}
})());
......
apps/common/main/lib/component/ComboBoxFonts.js
View file @ af7f2254
......@@ -85,11 +85,14 @@ define([
initialize : function(options) {
Common.UI.ComboBox.prototype.initialize.call(this, _.extend(options, {
displayField: 'name'
displayField: 'name',
scroller: {
alwaysVisibleY: true,
onChange: this.updateVisibleFontsTiles.bind(this)
}
}));
this.recent = _.isNumber(options.recent) ? options.recent : 3;
this.bindUpdateVisibleFontsTiles = _.bind(this.updateVisibleFontsTiles, this);
Common.NotificationCenter.on('fonts:change', _.bind(this.onApiChangeFont, this));
Common.NotificationCenter.on('fonts:load', _.bind(this.fillFonts, this));
......@@ -109,8 +112,6 @@ define([
this._input.on('keyup', _.bind(this.onInputKeyUp, this));
this._input.on('keydown', _.bind(this.onInputKeyDown, this));
this.scroller.update({alwaysVisibleY: true, onChange:this.bindUpdateVisibleFontsTiles});
return this;
},
......
apps/documenteditor/main/app/controller/Main.js
View file @ af7f2254
......@@ -851,7 +851,7 @@ define([
if (window.styles_loaded) {
clearInterval(timer_sl);
toolbarController.getView('Toolbar').createDelayedElements();
toolbarController.createDelayedElements();
documentHolderController.getView('DocumentHolder').createDelayedElements();
me.loadLanguages();
......
apps/documenteditor/main/app/controller/Toolbar.js
View file @ af7f2254
......@@ -166,7 +166,7 @@ define([
// Create toolbar view
this.toolbar = this.createView('Toolbar');
this.toolbar.on('render:after', _.bind(this.onToolbarAfterRender, this));
// this.toolbar.on('render:after', _.bind(this.onToolbarAfterRender, this));
},
onToolbarAfterRender: function(toolbar) {
......@@ -2627,6 +2627,11 @@ define([
me._mailMergeDlg.show();
},
createDelayedElements: function() {
this.toolbar.createDelayedElements();
this.onToolbarAfterRender(this.toolbar);
},
textEmptyImgUrl : 'You need to specify image URL.',
textWarning : 'Warning',
textFontSizeErr : 'The entered value is incorrect.<br>Please enter a numeric value between 1 and 100',
......
apps/documenteditor/main/app/view/ChartSettings.js
View file @ af7f2254
......@@ -63,7 +63,6 @@ define([
},
initialize: function () {
var me = this;
this._initSettings = true;
this._state = {
......@@ -85,133 +84,8 @@ define([
this.render();
var viewData = [
{ offsetx: 0, data: Asc.c_oAscWrapStyle2.Inline, iconCls:'wrap-inline', tip: this.txtInline, selected: true },
{ offsetx: 50, data: Asc.c_oAscWrapStyle2.Square, iconCls:'wrap-square', tip: this.txtSquare },
{ offsetx: 100, data: Asc.c_oAscWrapStyle2.Tight, iconCls:'wrap-tight', tip: this.txtTight },
{ offsetx: 150, data: Asc.c_oAscWrapStyle2.Through, iconCls:'wrap-through', tip: this.txtThrough },
{ offsetx: 200, data: Asc.c_oAscWrapStyle2.TopAndBottom, iconCls:'wrap-topAndBottom', tip: this.txtTopAndBottom },
{ offsetx: 250, data: Asc.c_oAscWrapStyle2.InFront, iconCls:'wrap-inFront', tip: this.txtInFront },
{ offsetx: 300, data: Asc.c_oAscWrapStyle2.Behind, iconCls:'wrap-behind', tip: this.txtBehind }
];
this.btnWrapType = new Common.UI.Button({
cls : 'btn-large-dataview',
iconCls : 'item-wrap wrap-inline',
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="id-chart-menu-wrap" style="width: 235px; margin: 0 5px;"></div>') }
]
})
});
this.btnWrapType.on('render:after', function(btn) {
me.mnuWrapPicker = new Common.UI.DataView({
el: $('#id-chart-menu-wrap'),
parentMenu: btn.menu,
store: new Common.UI.DataViewStore(viewData),
itemTemplate: _.template('<div id="<%= id %>" class="item-wrap" style="background-position: -<%= offsetx %>px 0;"></div>')
});
});
this.btnWrapType.render($('#chart-button-wrap'));
this.mnuWrapPicker.on('item:click', _.bind(this.onSelectWrap, this, this.btnWrapType));
this.lockedControls.push(this.btnWrapType);
this.btnChartType = new Common.UI.Button({
cls : 'btn-large-dataview',
iconCls : 'item-chartlist bar-normal',
menu : new Common.UI.Menu({
style: 'width: 560px;',
items: [
{ template: _.template('<div id="id-chart-menu-type" class="menu-insertchart" style="margin: 5px 5px 5px 10px;"></div>') }
]
})
});
this.btnChartType.on('render:after', function(btn) {
me.mnuChartTypePicker = new Common.UI.DataView({
el: $('#id-chart-menu-type'),
parentMenu: btn.menu,
restoreHeight: 411,
groups: new Common.UI.DataViewGroupStore([
{ id: 'menu-chart-group-bar', caption: me.textColumn },
{ 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 },
{ id: 'menu-chart-group-scatter', caption: me.textPoint },
{ id: 'menu-chart-group-stock', caption: me.textStock }
]),
store: new Common.UI.DataViewStore([
{ group: 'menu-chart-group-bar', type: Asc.c_oAscChartTypeSettings.barNormal, iconCls: 'column-normal', selected: true},
{ group: 'menu-chart-group-bar', type: Asc.c_oAscChartTypeSettings.barStacked, iconCls: 'column-stack'},
{ group: 'menu-chart-group-bar', type: Asc.c_oAscChartTypeSettings.barStackedPer, iconCls: 'column-pstack'},
{ group: 'menu-chart-group-bar', type: Asc.c_oAscChartTypeSettings.barNormal3d, iconCls: 'column-3d-normal'},
{ group: 'menu-chart-group-bar', type: Asc.c_oAscChartTypeSettings.barStacked3d, iconCls: 'column-3d-stack'},
{ group: 'menu-chart-group-bar', type: Asc.c_oAscChartTypeSettings.barStackedPer3d, iconCls: 'column-3d-pstack'},
{ group: 'menu-chart-group-bar', type: Asc.c_oAscChartTypeSettings.barNormal3dPerspective, iconCls: 'column-3d-normal-per'},
{ group: 'menu-chart-group-line', type: Asc.c_oAscChartTypeSettings.lineNormal, iconCls: 'line-normal'},
{ group: 'menu-chart-group-line', type: Asc.c_oAscChartTypeSettings.lineStacked, iconCls: 'line-stack'},
{ group: 'menu-chart-group-line', type: Asc.c_oAscChartTypeSettings.lineStackedPer, iconCls: 'line-pstack'},
{ group: 'menu-chart-group-line', type: Asc.c_oAscChartTypeSettings.line3d, iconCls: 'line-3d'},
{ group: 'menu-chart-group-pie', type: Asc.c_oAscChartTypeSettings.pie, iconCls: 'pie-normal'},
{ group: 'menu-chart-group-pie', type: Asc.c_oAscChartTypeSettings.doughnut, iconCls: 'pie-doughnut'},
{ group: 'menu-chart-group-pie', type: Asc.c_oAscChartTypeSettings.pie3d, iconCls: 'pie-3d-normal'},
{ group: 'menu-chart-group-hbar', type: Asc.c_oAscChartTypeSettings.hBarNormal, iconCls: 'bar-normal'},
{ group: 'menu-chart-group-hbar', type: Asc.c_oAscChartTypeSettings.hBarStacked, iconCls: 'bar-stack'},
{ group: 'menu-chart-group-hbar', type: Asc.c_oAscChartTypeSettings.hBarStackedPer, iconCls: 'bar-pstack'},
{ group: 'menu-chart-group-hbar', type: Asc.c_oAscChartTypeSettings.hBarNormal3d, iconCls: 'bar-3d-normal'},
{ group: 'menu-chart-group-hbar', type: Asc.c_oAscChartTypeSettings.hBarStacked3d, iconCls: 'bar-3d-stack'},
{ group: 'menu-chart-group-hbar', type: Asc.c_oAscChartTypeSettings.hBarStackedPer3d, iconCls: 'bar-3d-pstack'},
{ group: 'menu-chart-group-area', type: Asc.c_oAscChartTypeSettings.areaNormal, iconCls: 'area-normal'},
{ group: 'menu-chart-group-area', type: Asc.c_oAscChartTypeSettings.areaStacked, iconCls: 'area-stack'},
{ group: 'menu-chart-group-area', type: Asc.c_oAscChartTypeSettings.areaStackedPer, iconCls: 'area-pstack'},
{ group: 'menu-chart-group-scatter', type: Asc.c_oAscChartTypeSettings.scatter, iconCls: 'point-normal'},
{ group: 'menu-chart-group-stock', type: Asc.c_oAscChartTypeSettings.stock, iconCls: 'stock-normal'}
]),
itemTemplate: _.template('<div id="<%= id %>" class="item-chartlist <%= iconCls %>"></div>')
});
});
this.btnChartType.render($('#chart-button-type'));
this.mnuChartTypePicker.on('item:click', _.bind(this.onSelectType, this, this.btnChartType));
this.lockedControls.push(this.btnChartType);
this.btnChartStyle = new Common.UI.Button({
cls : 'btn-large-dataview',
iconCls : 'item-wrap',
menu : new Common.UI.Menu({
menuAlign: 'tr-br',
items: [
{ template: _.template('<div id="id-chart-menu-style" style="width: 245px; margin: 0 5px;"></div>') }
]
})
});
this.btnChartStyle.on('render:after', function(btn) {
me.mnuChartStylePicker = new Common.UI.DataView({
el: $('#id-chart-menu-style'),
style: 'max-height: 411px;',
parentMenu: btn.menu,
store: new Common.UI.DataViewStore(),
itemTemplate: _.template('<div id="<%= id %>" class="item-wrap" style="background-image: url(<%= imageUrl %>); background-position: 0 0;"></div>')
});
if (me.btnChartStyle.menu) {
me.btnChartStyle.menu.on('show:after', function () {
me.mnuChartStylePicker.scroller.update({alwaysVisibleY: true});
});
}
});
this.btnChartStyle.render($('#chart-button-style'));
this.mnuChartStylePicker.on('item:click', _.bind(this.onSelectStyle, this, this.btnChartStyle));
this.lockedControls.push(this.btnChartStyle);
this.labelWidth = $(this.el).find('#chart-label-width');
this.labelHeight = $(this.el).find('#chart-label-height');
this.btnEditData = new Common.UI.Button({
el: $('#chart-button-edit-data')
});
this.lockedControls.push(this.btnEditData);
this.btnEditData.on('click', _.bind(this.setEditData, this));
$(this.el).on('click', '#chart-advanced-link', _.bind(this.openAdvancedSettings, this));
},
render: function () {
......@@ -219,8 +93,6 @@ define([
el.html(this.template({
scope: this
}));
this.linkAdvanced = $('#chart-advanced-link');
},
setApi: function(api) {
......@@ -331,11 +203,114 @@ define([
this.labelHeight[0].innerHTML = this.textHeight + ': ' + value.toFixed(1) + ' ' + Common.Utils.Metric.getCurrentMetricName();
},
createDelayedControls: function() {
var me = this,
viewData = [
{ offsetx: 0, data: Asc.c_oAscWrapStyle2.Inline, iconCls:'wrap-inline', tip: this.txtInline, selected: true },
{ offsetx: 50, data: Asc.c_oAscWrapStyle2.Square, iconCls:'wrap-square', tip: this.txtSquare },
{ offsetx: 100, data: Asc.c_oAscWrapStyle2.Tight, iconCls:'wrap-tight', tip: this.txtTight },
{ offsetx: 150, data: Asc.c_oAscWrapStyle2.Through, iconCls:'wrap-through', tip: this.txtThrough },
{ offsetx: 200, data: Asc.c_oAscWrapStyle2.TopAndBottom, iconCls:'wrap-topAndBottom', tip: this.txtTopAndBottom },
{ offsetx: 250, data: Asc.c_oAscWrapStyle2.InFront, iconCls:'wrap-inFront', tip: this.txtInFront },
{ offsetx: 300, data: Asc.c_oAscWrapStyle2.Behind, iconCls:'wrap-behind', tip: this.txtBehind }
];
this.btnWrapType = new Common.UI.Button({
cls : 'btn-large-dataview',
iconCls : 'item-wrap wrap-inline',
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="id-chart-menu-wrap" style="width: 235px; margin: 0 5px;"></div>') }
]
})
});
this.btnWrapType.on('render:after', function(btn) {
me.mnuWrapPicker = new Common.UI.DataView({
el: $('#id-chart-menu-wrap'),
parentMenu: btn.menu,
store: new Common.UI.DataViewStore(viewData),
itemTemplate: _.template('<div id="<%= id %>" class="item-wrap" style="background-position: -<%= offsetx %>px 0;"></div>')
});
});
this.btnWrapType.render($('#chart-button-wrap'));
this.mnuWrapPicker.on('item:click', _.bind(this.onSelectWrap, this, this.btnWrapType));
this.lockedControls.push(this.btnWrapType);
this.btnChartType = new Common.UI.Button({
cls : 'btn-large-dataview',
iconCls : 'item-chartlist bar-normal',
menu : new Common.UI.Menu({
style: 'width: 560px;',
items: [
{ template: _.template('<div id="id-chart-menu-type" class="menu-insertchart" style="margin: 5px 5px 5px 10px;"></div>') }
]
})
});
this.btnChartType.on('render:after', function(btn) {
me.mnuChartTypePicker = new Common.UI.DataView({
el: $('#id-chart-menu-type'),
parentMenu: btn.menu,
restoreHeight: 411,
groups: new Common.UI.DataViewGroupStore([
{ id: 'menu-chart-group-bar', caption: me.textColumn },
{ 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 },
{ id: 'menu-chart-group-scatter', caption: me.textPoint },
{ id: 'menu-chart-group-stock', caption: me.textStock }
]),
store: new Common.UI.DataViewStore([
{ group: 'menu-chart-group-bar', type: Asc.c_oAscChartTypeSettings.barNormal, iconCls: 'column-normal', selected: true},
{ group: 'menu-chart-group-bar', type: Asc.c_oAscChartTypeSettings.barStacked, iconCls: 'column-stack'},
{ group: 'menu-chart-group-bar', type: Asc.c_oAscChartTypeSettings.barStackedPer, iconCls: 'column-pstack'},
{ group: 'menu-chart-group-bar', type: Asc.c_oAscChartTypeSettings.barNormal3d, iconCls: 'column-3d-normal'},
{ group: 'menu-chart-group-bar', type: Asc.c_oAscChartTypeSettings.barStacked3d, iconCls: 'column-3d-stack'},
{ group: 'menu-chart-group-bar', type: Asc.c_oAscChartTypeSettings.barStackedPer3d, iconCls: 'column-3d-pstack'},
{ group: 'menu-chart-group-bar', type: Asc.c_oAscChartTypeSettings.barNormal3dPerspective, iconCls: 'column-3d-normal-per'},
{ group: 'menu-chart-group-line', type: Asc.c_oAscChartTypeSettings.lineNormal, iconCls: 'line-normal'},
{ group: 'menu-chart-group-line', type: Asc.c_oAscChartTypeSettings.lineStacked, iconCls: 'line-stack'},
{ group: 'menu-chart-group-line', type: Asc.c_oAscChartTypeSettings.lineStackedPer, iconCls: 'line-pstack'},
{ group: 'menu-chart-group-line', type: Asc.c_oAscChartTypeSettings.line3d, iconCls: 'line-3d'},
{ group: 'menu-chart-group-pie', type: Asc.c_oAscChartTypeSettings.pie, iconCls: 'pie-normal'},
{ group: 'menu-chart-group-pie', type: Asc.c_oAscChartTypeSettings.doughnut, iconCls: 'pie-doughnut'},
{ group: 'menu-chart-group-pie', type: Asc.c_oAscChartTypeSettings.pie3d, iconCls: 'pie-3d-normal'},
{ group: 'menu-chart-group-hbar', type: Asc.c_oAscChartTypeSettings.hBarNormal, iconCls: 'bar-normal'},
{ group: 'menu-chart-group-hbar', type: Asc.c_oAscChartTypeSettings.hBarStacked, iconCls: 'bar-stack'},
{ group: 'menu-chart-group-hbar', type: Asc.c_oAscChartTypeSettings.hBarStackedPer, iconCls: 'bar-pstack'},
{ group: 'menu-chart-group-hbar', type: Asc.c_oAscChartTypeSettings.hBarNormal3d, iconCls: 'bar-3d-normal'},
{ group: 'menu-chart-group-hbar', type: Asc.c_oAscChartTypeSettings.hBarStacked3d, iconCls: 'bar-3d-stack'},
{ group: 'menu-chart-group-hbar', type: Asc.c_oAscChartTypeSettings.hBarStackedPer3d, iconCls: 'bar-3d-pstack'},
{ group: 'menu-chart-group-area', type: Asc.c_oAscChartTypeSettings.areaNormal, iconCls: 'area-normal'},
{ group: 'menu-chart-group-area', type: Asc.c_oAscChartTypeSettings.areaStacked, iconCls: 'area-stack'},
{ group: 'menu-chart-group-area', type: Asc.c_oAscChartTypeSettings.areaStackedPer, iconCls: 'area-pstack'},
{ group: 'menu-chart-group-scatter', type: Asc.c_oAscChartTypeSettings.scatter, iconCls: 'point-normal'},
{ group: 'menu-chart-group-stock', type: Asc.c_oAscChartTypeSettings.stock, iconCls: 'stock-normal'}
]),
itemTemplate: _.template('<div id="<%= id %>" class="item-chartlist <%= iconCls %>"></div>')
});
});
this.btnChartType.render($('#chart-button-type'));
this.mnuChartTypePicker.on('item:click', _.bind(this.onSelectType, this, this.btnChartType));
this.lockedControls.push(this.btnChartType);
this.btnEditData = new Common.UI.Button({
el: $('#chart-button-edit-data')
});
this.lockedControls.push(this.btnEditData);
this.btnEditData.on('click', _.bind(this.setEditData, this));
this.linkAdvanced = $('#chart-advanced-link');
$(this.el).on('click', '#chart-advanced-link', _.bind(this.openAdvancedSettings, this));
},
createDelayedElements: function() {
this.createDelayedControls();
this.updateMetricUnit();
},
_ChartWrapStyleChanged: function(style) {
if (!this.mnuWrapPicker) return;
if (this._state.WrappingStyle!==style) {
this._noApply = true;
var record = this.mnuWrapPicker.store.findWhere({data: style});
......@@ -507,6 +482,36 @@ define([
updateChartStyles: function(styles) {
var me = this;
if (!this.btnChartStyle) {
this.btnChartStyle = new Common.UI.Button({
cls : 'btn-large-dataview',
iconCls : 'item-wrap',
menu : new Common.UI.Menu({
menuAlign: 'tr-br',
items: [
{ template: _.template('<div id="id-chart-menu-style" style="width: 245px; margin: 0 5px;"></div>') }
]
})
});
this.btnChartStyle.render($('#chart-button-style'));
this.lockedControls.push(this.btnChartStyle);
this.mnuChartStylePicker = new Common.UI.DataView({
el: $('#id-chart-menu-style'),
style: 'max-height: 411px;',
parentMenu: this.btnChartStyle.menu,
store: new Common.UI.DataViewStore(),
itemTemplate: _.template('<div id="<%= id %>" class="item-wrap" style="background-image: url(<%= imageUrl %>); background-position: 0 0;"></div>')
});
if (this.btnChartStyle.menu) {
this.btnChartStyle.menu.on('show:after', function () {
me.mnuChartStylePicker.scroller.update({alwaysVisibleY: true});
});
}
this.mnuChartStylePicker.on('item:click', _.bind(this.onSelectStyle, this, this.btnChartStyle));
}
if (styles && styles.length>0){
var stylesStore = this.mnuChartStylePicker.store;
if (stylesStore) {
......@@ -542,6 +547,8 @@ define([
},
disableControls: function(disable) {
if (this._initSettings) return;
if (this._state.DisabledControls!==disable) {
this._state.DisabledControls = disable;
_.each(this.lockedControls, function(item) {
......
apps/documenteditor/main/app/view/HeaderFooterSettings.js
View file @ af7f2254
......@@ -64,7 +64,6 @@ define([
},
initialize: function () {
var me = this;
this._initSettings = true;
this._state = {
......@@ -80,67 +79,6 @@ define([
this._locked = false;
this.render();
var _arrPosition = [
[c_pageNumPosition.PAGE_NUM_POSITION_TOP, c_pageNumPosition.PAGE_NUM_POSITION_LEFT, 'icon-right-panel btn-colontitul-tl', 'headerfooter-button-top-left', this.textTopLeft],
[c_pageNumPosition.PAGE_NUM_POSITION_TOP, c_pageNumPosition.PAGE_NUM_POSITION_CENTER, 'icon-right-panel btn-colontitul-tc', 'headerfooter-button-top-center', this.textTopCenter],
[c_pageNumPosition.PAGE_NUM_POSITION_TOP, c_pageNumPosition.PAGE_NUM_POSITION_RIGHT, 'icon-right-panel btn-colontitul-tr', 'headerfooter-button-top-right', this.textTopRight],
[c_pageNumPosition.PAGE_NUM_POSITION_BOTTOM, c_pageNumPosition.PAGE_NUM_POSITION_LEFT, 'icon-right-panel btn-colontitul-bl', 'headerfooter-button-bottom-left', this.textBottomLeft],
[c_pageNumPosition.PAGE_NUM_POSITION_BOTTOM, c_pageNumPosition.PAGE_NUM_POSITION_CENTER, 'icon-right-panel btn-colontitul-bc', 'headerfooter-button-bottom-center', this.textBottomCenter],
[c_pageNumPosition.PAGE_NUM_POSITION_BOTTOM, c_pageNumPosition.PAGE_NUM_POSITION_RIGHT, 'icon-right-panel btn-colontitul-br', 'headerfooter-button-bottom-right', this.textBottomRight]
];
this._btnsPosition = [];
_.each(_arrPosition, function(item, index, list){
var _btn = new Common.UI.Button({
cls: 'btn-options huge',
iconCls: item[2],
posWhere:item[0],
posAlign:item[1],
hint: item[4]
});
_btn.render( $('#'+item[3])) ;
_btn.on('click', _.bind(this.onBtnPositionClick, this));
this._btnsPosition.push( _btn );
this.lockedControls.push(_btn);
}, this);
this.numPosition = new Common.UI.MetricSpinner({
el: $('#headerfooter-spin-position'),
step: .1,
width: 85,
value: '1.25 cm',
defaultUnit : "cm",
maxValue: 55.88,
minValue: 0
});
this.spinners.push(this.numPosition);
this.lockedControls.push(this.numPosition);
this.lblPosition = $(this.el).find('#headerfooter-label-position');
this.chDiffFirst = new Common.UI.CheckBox({
el: $('#headerfooter-check-diff-first'),
labelText: this.textDiffFirst
});
this.lockedControls.push(this.chDiffFirst);
this.chDiffOdd = new Common.UI.CheckBox({
el: $('#headerfooter-check-diff-odd'),
labelText: this.textDiffOdd
});
this.lockedControls.push(this.chDiffOdd);
this.chSameAs = new Common.UI.CheckBox({
el: $('#headerfooter-check-same-as'),
labelText: this.textSameAs
});
this.lockedControls.push(this.chSameAs);
this.numPosition.on('change', _.bind(this.onNumPositionChange, this));
this.chDiffFirst.on('change', _.bind(this.onDiffFirstChange, this));
this.chDiffOdd.on('change', _.bind(this.onDiffOddChange, this));
this.chSameAs.on('change', _.bind(this.onSameAsChange, this));
},
render: function () {
......@@ -240,7 +178,71 @@ define([
}
},
createDelayedControls: function() {
var _arrPosition = [
[c_pageNumPosition.PAGE_NUM_POSITION_TOP, c_pageNumPosition.PAGE_NUM_POSITION_LEFT, 'icon-right-panel btn-colontitul-tl', 'headerfooter-button-top-left', this.textTopLeft],
[c_pageNumPosition.PAGE_NUM_POSITION_TOP, c_pageNumPosition.PAGE_NUM_POSITION_CENTER, 'icon-right-panel btn-colontitul-tc', 'headerfooter-button-top-center', this.textTopCenter],
[c_pageNumPosition.PAGE_NUM_POSITION_TOP, c_pageNumPosition.PAGE_NUM_POSITION_RIGHT, 'icon-right-panel btn-colontitul-tr', 'headerfooter-button-top-right', this.textTopRight],
[c_pageNumPosition.PAGE_NUM_POSITION_BOTTOM, c_pageNumPosition.PAGE_NUM_POSITION_LEFT, 'icon-right-panel btn-colontitul-bl', 'headerfooter-button-bottom-left', this.textBottomLeft],
[c_pageNumPosition.PAGE_NUM_POSITION_BOTTOM, c_pageNumPosition.PAGE_NUM_POSITION_CENTER, 'icon-right-panel btn-colontitul-bc', 'headerfooter-button-bottom-center', this.textBottomCenter],
[c_pageNumPosition.PAGE_NUM_POSITION_BOTTOM, c_pageNumPosition.PAGE_NUM_POSITION_RIGHT, 'icon-right-panel btn-colontitul-br', 'headerfooter-button-bottom-right', this.textBottomRight]
];
this._btnsPosition = [];
_.each(_arrPosition, function(item, index, list){
var _btn = new Common.UI.Button({
cls: 'btn-options huge',
iconCls: item[2],
posWhere:item[0],
posAlign:item[1],
hint: item[4]
});
_btn.render( $('#'+item[3])) ;
_btn.on('click', _.bind(this.onBtnPositionClick, this));
this._btnsPosition.push( _btn );
this.lockedControls.push(_btn);
}, this);
this.numPosition = new Common.UI.MetricSpinner({
el: $('#headerfooter-spin-position'),
step: .1,
width: 85,
value: '1.25 cm',
defaultUnit : "cm",
maxValue: 55.88,
minValue: 0
});
this.spinners.push(this.numPosition);
this.lockedControls.push(this.numPosition);
this.lblPosition = $(this.el).find('#headerfooter-label-position');
this.chDiffFirst = new Common.UI.CheckBox({
el: $('#headerfooter-check-diff-first'),
labelText: this.textDiffFirst
});
this.lockedControls.push(this.chDiffFirst);
this.chDiffOdd = new Common.UI.CheckBox({
el: $('#headerfooter-check-diff-odd'),
labelText: this.textDiffOdd
});
this.lockedControls.push(this.chDiffOdd);
this.chSameAs = new Common.UI.CheckBox({
el: $('#headerfooter-check-same-as'),
labelText: this.textSameAs
});
this.lockedControls.push(this.chSameAs);
this.numPosition.on('change', _.bind(this.onNumPositionChange, this));
this.chDiffFirst.on('change', _.bind(this.onDiffFirstChange, this));
this.chDiffOdd.on('change', _.bind(this.onDiffOddChange, this));
this.chSameAs.on('change', _.bind(this.onSameAsChange, this));
},
createDelayedElements: function() {
this.createDelayedControls();
this.updateMetricUnit();
},
......@@ -249,6 +251,8 @@ define([
},
disableControls: function(disable) {
if (this._initSettings) return;
if (this._state.DisabledControls!==disable) {
this._state.DisabledControls = disable;
_.each(this.lockedControls, function(item) {
......
apps/documenteditor/main/app/view/ImageSettings.js
View file @ af7f2254
......@@ -64,7 +64,6 @@ define([
},
initialize: function () {
var me = this;
this._initSettings = true;
this._state = {
......@@ -84,7 +83,35 @@ define([
this.render();
var viewData = [
this.labelWidth = $(this.el).find('#image-label-width');
this.labelHeight = $(this.el).find('#image-label-height');
},
render: function () {
var el = $(this.el);
el.html(this.template({
scope: this
}));
},
setApi: function(api) {
this.api = api;
if (this.api)
this.api.asc_registerCallback('asc_onImgWrapStyleChanged', _.bind(this._ImgWrapStyleChanged, this));
return this;
},
updateMetricUnit: function() {
var value = Common.Utils.Metric.fnRecalcFromMM(this._state.Width);
this.labelWidth[0].innerHTML = this.textWidth + ': ' + value.toFixed(1) + ' ' + Common.Utils.Metric.getCurrentMetricName();
value = Common.Utils.Metric.fnRecalcFromMM(this._state.Height);
this.labelHeight[0].innerHTML = this.textHeight + ': ' + value.toFixed(1) + ' ' + Common.Utils.Metric.getCurrentMetricName();
},
createDelayedControls: function() {
var me = this,
viewData = [
{ offsetx: 0, data: Asc.c_oAscWrapStyle2.Inline, iconcls:'wrap-inline', tip: this.txtInline, selected: true },
{ offsetx: 50, data: Asc.c_oAscWrapStyle2.Square, iconcls:'wrap-square', tip: this.txtSquare },
{ offsetx: 100, data: Asc.c_oAscWrapStyle2.Tight, iconcls:'wrap-tight', tip: this.txtTight },
......@@ -116,9 +143,6 @@ define([
this.mnuWrapPicker.on('item:click', _.bind(this.onSelectWrap, this, this.btnWrapType));
this.lockedControls.push(this.btnWrapType);
this.labelWidth = $(this.el).find('#image-label-width');
this.labelHeight = $(this.el).find('#image-label-height');
this.btnOriginalSize = new Common.UI.Button({
el: $('#image-button-original-size')
});
......@@ -149,35 +173,14 @@ define([
if (this.api) this.api.asc_pluginRun(this._originalProps.asc_getPluginGuid(), 0, this._originalProps.asc_getPluginData());
this.fireEvent('editcomplete', this);
}, this));
$(this.el).on('click', '#image-advanced-link', _.bind(this.openAdvancedSettings, this));
},
render: function () {
var el = $(this.el);
el.html(this.template({
scope: this
}));
this.linkAdvanced = $('#image-advanced-link');
this.lblReplace = $('#image-lbl-replace');
$(this.el).on('click', '#image-advanced-link', _.bind(this.openAdvancedSettings, this));
},
setApi: function(api) {
this.api = api;
if (this.api)
this.api.asc_registerCallback('asc_onImgWrapStyleChanged', _.bind(this._ImgWrapStyleChanged, this));
return this;
},
updateMetricUnit: function() {
var value = Common.Utils.Metric.fnRecalcFromMM(this._state.Width);
this.labelWidth[0].innerHTML = this.textWidth + ': ' + value.toFixed(1) + ' ' + Common.Utils.Metric.getCurrentMetricName();
value = Common.Utils.Metric.fnRecalcFromMM(this._state.Height);
this.labelHeight[0].innerHTML = this.textHeight + ': ' + value.toFixed(1) + ' ' + Common.Utils.Metric.getCurrentMetricName();
},
createDelayedElements: function() {
this.createDelayedControls();
this.updateMetricUnit();
},
......@@ -248,6 +251,7 @@ define([
},
_ImgWrapStyleChanged: function(style) {
if (!this.mnuWrapPicker) return;
if (this._state.WrappingStyle!==style) {
this._noApply = true;
var record = this.mnuWrapPicker.store.findWhere({data: style});
......@@ -387,6 +391,8 @@ define([
},
disableControls: function(disable) {
if (this._initSettings) return;
if (this._state.DisabledControls!==disable) {
this._state.DisabledControls = disable;
_.each(this.lockedControls, function(item) {
......
apps/documenteditor/main/app/view/MailMergeSettings.js
View file @ af7f2254
......@@ -72,7 +72,9 @@ define([
},
initialize: function () {
var me = this;
var me = this,
_set = DE.enumLockMM;
this._initSettings = true;
this._state = {
......@@ -88,18 +90,8 @@ define([
this.emailAddresses = undefined;
this.mergeMailData = undefined;
var _set = DE.enumLockMM;
this.render();
this.btnEditData = new Common.UI.Button({
el: me.$el.find('#mmerge-button-edit-data'),
lock: [_set.preview, _set.lostConnect]
});
this.btnEditData.on('click', _.bind(this.onEditData, this));
this.lblAddRecipients = $('#mmerge-lbl-add-recipients');
this.btnInsField = new Common.UI.Button({
cls: 'btn-text-menu-default',
caption: this.textInsertField,
......@@ -120,19 +112,6 @@ define([
});
this.btnInsField.render( $('#mmerge-btn-ins-field',me.$el)) ;
this.chHighlight = new Common.UI.Switcher({
el: me.$el.find('#mmerge-switcher-highlight'),
lock: [_set.noFields, _set.lostConnect]
});
this.chHighlight.on('change', _.bind(this.onCheckHighlightChange, this));
this.chPreview = new Common.UI.Switcher({
el: me.$el.find('#mmerge-switcher-preview'),
lock: [_set.noRecipients, _set.lostConnect]
});
this.chPreview.on('change', _.bind(this.onCheckPreviewChange, this));
this.emptyDBControls.push(this.chPreview);
this.txtFieldNum = new Common.UI.InputField({
el : $('#mmerge-field-num', me.$el),
allowBlank : true,
......@@ -161,6 +140,52 @@ define([
}
});
this.emptyDBControls.push(this.txtFieldNum);
},
render: function () {
this.$el.html(this.template({
scope: this
}));
},
setApi: function(api) {
this.api = api;
if (this.api) {
this.api.asc_registerCallback('asc_onPreviewMailMergeResult', _.bind(this.onPreviewMailMergeResult, this));
this.api.asc_registerCallback('asc_onEndPreviewMailMergeResult', _.bind(this.onEndPreviewMailMergeResult, this));
this.api.asc_registerCallback('asc_onStartMailMerge', _.bind(this.onStartMailMerge, this));
this.api.asc_registerCallback('asc_onSaveMailMerge', _.bind(this.onSaveMailMerge, this));
this.api.asc_registerCallback('asc_onEndAction', _.bind(this.onLongActionEnd, this));
Common.Gateway.on('setemailaddresses', _.bind(this.onSetEmailAddresses, this));
Common.Gateway.on('processmailmerge', _.bind(this.onProcessMailMerge, this));
}
return this;
},
createDelayedControls: function() {
var me = this,
_set = DE.enumLockMM;
this.btnEditData = new Common.UI.Button({
el: me.$el.find('#mmerge-button-edit-data'),
lock: [_set.preview, _set.lostConnect]
});
this.btnEditData.on('click', _.bind(this.onEditData, this));
this.lblAddRecipients = $('#mmerge-lbl-add-recipients');
this.chHighlight = new Common.UI.Switcher({
el: me.$el.find('#mmerge-switcher-highlight'),
lock: [_set.noFields, _set.lostConnect]
});
this.chHighlight.on('change', _.bind(this.onCheckHighlightChange, this));
this.chPreview = new Common.UI.Switcher({
el: me.$el.find('#mmerge-switcher-preview'),
lock: [_set.noRecipients, _set.lostConnect]
});
this.chPreview.on('change', _.bind(this.onCheckPreviewChange, this));
this.emptyDBControls.push(this.chPreview);
this.btnFirst = new Common.UI.Button({
cls: 'btn-toolbar',
......@@ -343,32 +368,26 @@ define([
}).on('click', _.bind(this.onMergeClick, this, false));
this.emptyDBControls.push(this.btnMerge);
this.$el.on('click', '#mmerge-readmore-link', _.bind(this.openHelp, this));
},
render: function () {
this.$el.html(this.template({
scope: this
}));
this.linkReadMore = $('#mmerge-readmore-link', this.$el);
},
this.$el.on('click', '#mmerge-readmore-link', _.bind(this.openHelp, this));
setApi: function(api) {
this.api = api;
if (this.api) {
this.api.asc_registerCallback('asc_onPreviewMailMergeResult', _.bind(this.onPreviewMailMergeResult, this));
this.api.asc_registerCallback('asc_onEndPreviewMailMergeResult', _.bind(this.onEndPreviewMailMergeResult, this));
this.api.asc_registerCallback('asc_onStartMailMerge', _.bind(this.onStartMailMerge, this));
this.api.asc_registerCallback('asc_onSaveMailMerge', _.bind(this.onSaveMailMerge, this));
this.api.asc_registerCallback('asc_onEndAction', _.bind(this.onLongActionEnd, this));
Common.Gateway.on('setemailaddresses', _.bind(this.onSetEmailAddresses, this));
Common.Gateway.on('processmailmerge', _.bind(this.onProcessMailMerge, this));
if (this.mode) {
if (!this.mode.mergeFolderUrl)
this.btnPortal.setVisible(false);
if (!this.mode.canSendEmailAddresses) {
this._arrMergeSrc.pop();
this.cmbMergeTo.setData(this._arrMergeSrc);
this.cmbMergeTo.setValue(this._arrMergeSrc[0].value);
}
}
return this;
},
ChangeSettings: function(props) {
if (this._initSettings) {
this.createDelayedControls();
this._initSettings = false;
}
this.disableInsertControls(this._locked);
if (props) {
......@@ -763,6 +782,8 @@ define([
},
disableControls: function(disable) {
if (this._initSettings) return;
this.lockControls(DE.enumLockMM.lostConnect, disable, {
array: _.union([this.btnEditData, this.btnInsField, this.chHighlight], (this.mode.mergeFolderUrl) ? [this.btnPortal] : []),
merge: true
......@@ -775,13 +796,6 @@ define([
setMode: function(mode) {
this.mode = mode;
if (!this.mode.mergeFolderUrl)
this.btnPortal.setVisible(false);
if (!this.mode.canSendEmailAddresses) {
this._arrMergeSrc.pop();
this.cmbMergeTo.setData(this._arrMergeSrc);
this.cmbMergeTo.setValue(this._arrMergeSrc[0].value);
}
},
disableEditing: function(disable) {
......@@ -807,7 +821,7 @@ define([
},
disablePreviewMode: function() {
if (this.api && this.chPreview.getValue()) {
if (this.api && this.chPreview && this.chPreview.getValue()) {
this.api.asc_EndPreviewMailMergeResult();
}
},
......
apps/documenteditor/main/app/view/ParagraphSettings.js
View file @ af7f2254
......@@ -67,7 +67,6 @@ define([
},
initialize: function () {
var me = this;
this._initSettings = true;
this._state = {
......@@ -157,22 +156,8 @@ define([
this.btnColor = new Common.UI.ColorButton({
style: "width:45px;",
disabled: this._locked,
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="paragraph-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
{ template: _.template('<a id="paragraph-color-new" style="padding-left:12px;">' + me.textNewColor + '</a>') }
]
})
});
this.btnColor.on('render:after', function(btn) {
me.mnuColorPicker = new Common.UI.ThemeColorPalette({
el: $('#paragraph-color-menu'),
transparent: true
});
me.mnuColorPicker.on('select', _.bind(me.onColorPickerSelect, me));
menu : true
});
this.btnColor.render( $('#paragraph-color-btn'));
this.lockedControls.push(this.btnColor);
......@@ -456,8 +441,20 @@ define([
},
UpdateThemeColors: function() {
if (this.mnuColorPicker)
this.mnuColorPicker.updateColors(Common.Utils.ThemeColor.getEffectColors(), Common.Utils.ThemeColor.getStandartColors());
if (!this.mnuColorPicker) {
this.btnColor.setMenu( new Common.UI.Menu({
items: [
{ template: _.template('<div id="paragraph-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
{ template: _.template('<a id="paragraph-color-new" style="padding-left:12px;">' + this.textNewColor + '</a>') }
]
}));
this.mnuColorPicker = new Common.UI.ThemeColorPalette({
el: $('#paragraph-color-menu'),
transparent: true
});
this.mnuColorPicker.on('select', _.bind(this.onColorPickerSelect, this));
}
this.mnuColorPicker.updateColors(Common.Utils.ThemeColor.getEffectColors(), Common.Utils.ThemeColor.getStandartColors());
},
onHideMenus: function(e){
......
apps/documenteditor/main/app/view/ShapeSettings.js
View file @ af7f2254
......@@ -71,7 +71,7 @@ define([
},
initialize: function () {
var me = this;
this._initSettings = true;
this._originalProps = null;
this._noApply = true;
......@@ -127,382 +127,6 @@ define([
this.render();
this._arrFillSrc = [
{displayValue: this.textColor, value: Asc.c_oAscFill.FILL_TYPE_SOLID},
{displayValue: this.textGradientFill, value: Asc.c_oAscFill.FILL_TYPE_GRAD},
{displayValue: this.textImageTexture, value: Asc.c_oAscFill.FILL_TYPE_BLIP},
{displayValue: this.textPatternFill, value: Asc.c_oAscFill.FILL_TYPE_PATT},
{displayValue: this.textNoFill, value: Asc.c_oAscFill.FILL_TYPE_NOFILL}
];
this.cmbFillSrc = new Common.UI.ComboBox({
el: $('#shape-combo-fill-src'),
cls: 'input-group-nr',
style: 'width: 100%;',
menuStyle: 'min-width: 190px;',
editable: false,
data: this._arrFillSrc
});
this.cmbFillSrc.setValue(this._arrFillSrc[0].value);
this.cmbFillSrc.on('selected', _.bind(this.onFillSrcSelect, this));
this.fillControls.push(this.cmbFillSrc);
this.btnBackColor = new Common.UI.ColorButton({
style: "width:45px;",
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="shape-back-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
{ template: _.template('<a id="shape-back-color-new" style="padding-left:12px;">' + me.textNewColor + '</a>') }
]
})
});
this.btnBackColor.on('render:after', function(btn) {
me.colorsBack = new Common.UI.ThemeColorPalette({
el: $('#shape-back-color-menu'),
value: 'transparent',
transparent: true
});
me.colorsBack.on('select', _.bind(me.onColorsBackSelect, me));
});
this.btnBackColor.render( $('#shape-back-color-btn'));
this.btnBackColor.setColor('transparent');
$(this.el).on('click', '#shape-back-color-new', _.bind(this.addNewColor, this, this.colorsBack, this.btnBackColor));
this.fillControls.push(this.btnBackColor);
this.cmbPattern = new Common.UI.ComboDataView({
itemWidth: 28,
itemHeight: 28,
menuMaxHeight: 300,
enableKeyEvents: true,
cls: 'combo-pattern'
});
this.cmbPattern.menuPicker.itemTemplate = this.cmbPattern.fieldPicker.itemTemplate = _.template([
'<div class="style" id="<%= id %>">',
'<img src="data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" class="combo-pattern-item" ',
'width="' + this.cmbPattern.itemWidth + '" height="' + this.cmbPattern.itemHeight + '" ',
'style="background-position: -<%= offsetx %>px -<%= offsety %>px;"/>',
'</div>'
].join(''));
this.cmbPattern.render($('#shape-combo-pattern'));
this.cmbPattern.openButton.menu.cmpEl.css({
'min-width': 178,
'max-width': 178
});
this.cmbPattern.on('click', _.bind(this.onPatternSelect, this));
this.cmbPattern.openButton.menu.on('show:after', function () {
me.cmbPattern.menuPicker.scroller.update({alwaysVisibleY: true});
});
this.fillControls.push(this.cmbPattern);
this.btnFGColor = new Common.UI.ColorButton({
style: "width:45px;",
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="shape-foreground-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
{ template: _.template('<a id="shape-foreground-color-new" style="padding-left:12px;">' + me.textNewColor + '</a>') }
]
})
});
this.btnFGColor.on('render:after', function(btn) {
me.colorsFG = new Common.UI.ThemeColorPalette({
el: $('#shape-foreground-color-menu'),
value: '000000'
});
me.colorsFG.on('select', _.bind(me.onColorsFGSelect, me));
});
this.btnFGColor.render( $('#shape-foreground-color-btn'));
this.btnFGColor.setColor('000000');
$(this.el).on('click', '#shape-foreground-color-new', _.bind(this.addNewColor, this, this.colorsFG, this.btnFGColor));
this.fillControls.push(this.btnFGColor);
this.btnBGColor = new Common.UI.ColorButton({
style: "width:45px;",
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="shape-background-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
{ template: _.template('<a id="shape-background-color-new" style="padding-left:12px;">' + me.textNewColor + '</a>') }
]
})
});
this.btnBGColor.on('render:after', function(btn) {
me.colorsBG = new Common.UI.ThemeColorPalette({
el: $('#shape-background-color-menu'),
value: 'ffffff'
});
me.colorsBG.on('select', _.bind(me.onColorsBGSelect, me));
});
this.btnBGColor.render( $('#shape-background-color-btn'));
this.btnBGColor.setColor('ffffff');
$(this.el).on('click', '#shape-background-color-new', _.bind(this.addNewColor, this, this.colorsBG, this.btnBGColor));
this.fillControls.push(this.btnBGColor);
this.btnInsertFromFile = new Common.UI.Button({
el: $('#shape-button-from-file')
});
this.fillControls.push(this.btnInsertFromFile);
this.btnInsertFromUrl = new Common.UI.Button({
el: $('#shape-button-from-url')
});
this.fillControls.push(this.btnInsertFromUrl);
this.btnInsertFromFile.on('click', _.bind(function(btn){
if (this.api) this.api.ChangeShapeImageFromFile();
this.fireEvent('editcomplete', this);
}, this));
this.btnInsertFromUrl.on('click', _.bind(this.insertFromUrl, this));
this._arrFillType = [
{displayValue: this.textStretch, value: Asc.c_oAscFillBlipType.STRETCH},
{displayValue: this.textTile, value: Asc.c_oAscFillBlipType.TILE}
];
this.cmbFillType = new Common.UI.ComboBox({
el: $('#shape-combo-fill-type'),
cls: 'input-group-nr',
menuStyle: 'min-width: 90px;',
editable: false,
data: this._arrFillType
});
this.cmbFillType.setValue(this._arrFillType[0].value);
this.cmbFillType.on('selected', _.bind(this.onFillTypeSelect, this));
this.fillControls.push(this.cmbFillType);
this.btnTexture = new Common.UI.ComboBox({
el: $('#shape-combo-fill-texture'),
template: _.template([
'<div class="input-group combobox combo-dataview-menu input-group-nr dropdown-toggle" tabindex="0" data-toggle="dropdown">',
'<div class="form-control text" style="width: 90px;">' + this.textSelectTexture + '</div>',
'<div style="display: table-cell;"></div>',
'<button type="button" class="btn btn-default"><span class="caret img-commonctrl"></span></button>',
'</div>'
].join(''))
});
this.textureMenu = new Common.UI.Menu({
items: [
{ template: _.template('<div id="id-shape-menu-texture" style="width: 233px; margin: 0 5px;"></div>') }
]
});
this.textureMenu.render($('#shape-combo-fill-texture'));
this.fillControls.push(this.btnTexture);
this.numTransparency = new Common.UI.MetricSpinner({
el: $('#shape-spin-transparency'),
step: 1,
width: 62,
value: '100 %',
defaultUnit : "%",
maxValue: 100,
minValue: 0
});
this.numTransparency.on('change', _.bind(this.onNumTransparencyChange, this));
this.fillControls.push(this.numTransparency);
this.sldrTransparency = new Common.UI.SingleSlider({
el: $('#shape-slider-transparency'),
width: 75,
minValue: 0,
maxValue: 100,
value: 100
});
this.sldrTransparency.on('change', _.bind(this.onTransparencyChange, this));
this.sldrTransparency.on('changecomplete', _.bind(this.onTransparencyChangeComplete, this));
this.fillControls.push(this.sldrTransparency);
this.lblTransparencyStart = $(this.el).find('#shape-lbl-transparency-start');
this.lblTransparencyEnd = $(this.el).find('#shape-lbl-transparency-end');
this._arrGradType = [
{displayValue: this.textLinear, value: Asc.c_oAscFillGradType.GRAD_LINEAR},
{displayValue: this.textRadial, value: Asc.c_oAscFillGradType.GRAD_PATH}
];
this.cmbGradType = new Common.UI.ComboBox({
el: $('#shape-combo-grad-type'),
cls: 'input-group-nr',
menuStyle: 'min-width: 90px;',
editable: false,
data: this._arrGradType
});
this.cmbGradType.setValue(this._arrGradType[0].value);
this.cmbGradType.on('selected', _.bind(this.onGradTypeSelect, this));
this.fillControls.push(this.cmbGradType);
this._viewDataLinear = [
{ offsetx: 0, offsety: 0, type:45, subtype:-1, iconcls:'gradient-left-top' },
{ offsetx: 50, offsety: 0, type:90, subtype:4, iconcls:'gradient-top'},
{ offsetx: 100, offsety: 0, type:135, subtype:5, iconcls:'gradient-right-top'},
{ offsetx: 0, offsety: 50, type:0, subtype:6, iconcls:'gradient-left', cls: 'item-gradient-separator', selected: true},
{ offsetx: 100, offsety: 50, type:180, subtype:1, iconcls:'gradient-right'},
{ offsetx: 0, offsety: 100, type:315, subtype:2, iconcls:'gradient-left-bottom'},
{ offsetx: 50, offsety: 100, type:270, subtype:3, iconcls:'gradient-bottom'},
{ offsetx: 100, offsety: 100, type:225, subtype:7, iconcls:'gradient-right-bottom'}
];
this._viewDataRadial = [
{ offsetx: 100, offsety: 150, type:2, subtype:5, iconcls:'gradient-radial-center'}
];
this.btnDirection = new Common.UI.Button({
cls : 'btn-large-dataview',
iconCls : 'item-gradient gradient-left',
menu : new Common.UI.Menu({
style: 'min-width: 60px;',
menuAlign: 'tr-br',
items: [
{ template: _.template('<div id="id-shape-menu-direction" style="width: 175px; margin: 0 5px;"></div>') }
]
})
});
this.btnDirection.on('render:after', function(btn) {
me.mnuDirectionPicker = new Common.UI.DataView({
el: $('#id-shape-menu-direction'),
parentMenu: btn.menu,
restoreHeight: 174,
allowScrollbar: false,
store: new Common.UI.DataViewStore(me._viewDataLinear),
itemTemplate: _.template('<div id="<%= id %>" class="item-gradient" style="background-position: -<%= offsetx %>px -<%= offsety %>px;"></div>')
});
});
this.btnDirection.render($('#shape-button-direction'));
this.mnuDirectionPicker.on('item:click', _.bind(this.onSelectGradient, this, this.btnDirection));
this.fillControls.push(this.btnDirection);
this.btnGradColor = new Common.UI.ColorButton({
style: "width:45px;",
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="shape-gradient-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
{ template: _.template('<a id="shape-gradient-color-new" style="padding-left:12px;">' + me.textNewColor + '</a>') }
]
})
});
this.btnGradColor.on('render:after', function(btn) {
me.colorsGrad = new Common.UI.ThemeColorPalette({
el: $('#shape-gradient-color-menu'),
value: '000000'
});
me.colorsGrad.on('select', _.bind(me.onColorsGradientSelect, me));
});
this.btnGradColor.render( $('#shape-gradient-color-btn'));
this.btnGradColor.setColor('000000');
$(this.el).on('click', '#shape-gradient-color-new', _.bind(this.addNewColor, this, this.colorsGrad, this.btnGradColor));
this.fillControls.push(this.btnGradColor);
this.sldrGradient = new Common.UI.MultiSliderGradient({
el: $('#shape-slider-gradient'),
width: 125,
minValue: 0,
maxValue: 100,
values: [0, 100]
});
this.sldrGradient.on('change', _.bind(this.onGradientChange, this));
this.sldrGradient.on('changecomplete', _.bind(this.onGradientChangeComplete, this));
this.sldrGradient.on('thumbclick', function(cmp, index){
me.GradColor.currentIdx = index;
var color = me.GradColor.colors[me.GradColor.currentIdx];
me.btnGradColor.setColor(color);
me.colorsGrad.select(color,false);
});
this.sldrGradient.on('thumbdblclick', function(cmp){
me.btnGradColor.cmpEl.find('button').dropdown('toggle');
});
this.fillControls.push(this.sldrGradient);
this.cmbBorderSize = new Common.UI.ComboBorderSizeEditable({
el: $('#shape-combo-border-size'),
style: "width: 93px;",
txtNoBorders: this.txtNoBorders
})
.on('selected', _.bind(this.onBorderSizeSelect, this))
.on('changed:before',_.bind(this.onBorderSizeChanged, this, true))
.on('changed:after', _.bind(this.onBorderSizeChanged, this, false))
.on('combo:blur', _.bind(this.onComboBlur, this, false));
this.BorderSize = this.cmbBorderSize.store.at(2).get('value');
this.cmbBorderSize.setValue(this.BorderSize);
this.lockedControls.push(this.cmbBorderSize);
this.btnBorderColor = new Common.UI.ColorButton({
style: "width:45px;",
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="shape-border-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
{ template: _.template('<a id="shape-border-color-new" style="padding-left:12px;">' + me.textNewColor + '</a>') }
]
})
});
this.lockedControls.push(this.btnBorderColor);
this.btnBorderColor.on('render:after', function(btn) {
me.colorsBorder = new Common.UI.ThemeColorPalette({
el: $('#shape-border-color-menu'),
value: '000000'
});
me.colorsBorder.on('select', _.bind(me.onColorsBorderSelect, me));
});
this.btnBorderColor.render( $('#shape-border-color-btn'));
this.btnBorderColor.setColor('000000');
$(this.el).on('click', '#shape-border-color-new', _.bind(this.addNewColor, this, this.colorsBorder, this.btnBorderColor));
this.cmbBorderType = new Common.UI.ComboBorderType({
el: $('#shape-combo-border-type'),
style: "width: 93px;",
menuStyle: 'min-width: 93px;'
}).on('selected', _.bind(this.onBorderTypeSelect, this))
.on('combo:blur', _.bind(this.onComboBlur, this, false));
this.BorderType = Asc.c_oDashType.solid;
this.cmbBorderType.setValue(this.BorderType);
this.lockedControls.push(this.cmbBorderType);
var viewData = [
{ offsetx: 0, data: Asc.c_oAscWrapStyle2.Inline, iconcls:'wrap-inline', tip: this.txtInline, selected: true },
{ offsetx: 50, data: Asc.c_oAscWrapStyle2.Square, iconcls:'wrap-square', tip: this.txtSquare },
{ offsetx: 100, data: Asc.c_oAscWrapStyle2.Tight, iconcls:'wrap-tight', tip: this.txtTight },
{ offsetx: 150, data: Asc.c_oAscWrapStyle2.Through, iconcls:'wrap-through', tip: this.txtThrough },
{ offsetx: 200, data: Asc.c_oAscWrapStyle2.TopAndBottom, iconcls:'wrap-topAndBottom', tip: this.txtTopAndBottom },
{ offsetx: 250, data: Asc.c_oAscWrapStyle2.InFront, iconcls:'wrap-inFront', tip: this.txtInFront },
{ offsetx: 300, data: Asc.c_oAscWrapStyle2.Behind, iconcls:'wrap-behind', tip: this.txtBehind }
];
this.btnWrapType = new Common.UI.Button({
cls : 'btn-large-dataview',
iconCls : 'item-wrap wrap-inline',
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="id-shape-menu-wrap" style="width: 235px; margin: 0 5px;"></div>') }
]
})
});
this.btnWrapType.on('render:after', function(btn) {
me.mnuWrapPicker = new Common.UI.DataView({
el: $('#id-shape-menu-wrap'),
parentMenu: btn.menu,
store: new Common.UI.DataViewStore(viewData),
itemTemplate: _.template('<div id="<%= id %>" class="item-wrap" style="background-position: -<%= offsetx %>px 0;"></div>')
});
});
this.btnWrapType.render($('#shape-button-wrap'));
this.mnuWrapPicker.on('item:click', _.bind(this.onSelectWrap, this, this.btnWrapType));
this.lockedControls.push(this.btnWrapType);
this.btnChangeShape = new Common.UI.Button({
cls: 'btn-icon-default',
iconCls: 'btn-change-shape',
menu : new Common.UI.Menu({
menuAlign: 'tr-br',
cls: 'menu-shapes',
items: []
})
});
this.btnChangeShape.render( $('#shape-btn-change')) ;
this.lockedControls.push(this.btnChangeShape);
$(this.el).on('click', '#shape-advanced-link', _.bind(this.openAdvancedSettings, this));
this.FillColorContainer = $('#shape-panel-color-fill');
this.FillImageContainer = $('#shape-panel-image-fill');
this.FillPatternContainer = $('#shape-panel-pattern-fill');
......@@ -517,8 +141,6 @@ define([
el.html(this.template({
scope: this
}));
this.linkAdvanced = $('#shape-advanced-link');
},
setApi: function(api) {
......@@ -1018,6 +640,7 @@ define([
},
_ImgWrapStyleChanged: function(style) {
if (!this.mnuWrapPicker) return;
if (this._state.WrappingStyle!==style) {
this._noApply = true;
var record = this.mnuWrapPicker.store.findWhere({data: style});
......@@ -1461,85 +1084,339 @@ define([
this.cmbBorderType.setValue(borderType);
}
// pattern colors
type1 = typeof(this.FGColor.Color);
type2 = typeof(this._state.FGColor);
// pattern colors
type1 = typeof(this.FGColor.Color);
type2 = typeof(this._state.FGColor);
if ( (type1 !== type2) || (type1=='object' &&
(this.FGColor.Color.effectValue!==this._state.FGColor.effectValue || this._state.FGColor.color.indexOf(this.FGColor.Color.color)<0)) ||
(type1!='object' && this._state.FGColor.indexOf(this.FGColor.Color)<0 )) {
this.btnFGColor.setColor(this.FGColor.Color);
if ( typeof(this.FGColor.Color) == 'object' ) {
var isselected = false;
for (var i=0; i<10; i++) {
if ( Common.Utils.ThemeColor.ThemeValues[i] == this.FGColor.Color.effectValue ) {
this.colorsFG.select(this.FGColor.Color,true);
isselected = true;
break;
}
}
if (!isselected) this.colorsFG.clearSelection();
} else
this.colorsFG.select(this.FGColor.Color,true);
this._state.FGColor = this.FGColor.Color;
}
type1 = typeof(this.BGColor.Color);
type2 = typeof(this._state.BGColor);
if ( (type1 !== type2) || (type1=='object' &&
(this.BGColor.Color.effectValue!==this._state.BGColor.effectValue || this._state.BGColor.color.indexOf(this.BGColor.Color.color)<0)) ||
(type1!='object' && this._state.BGColor.indexOf(this.BGColor.Color)<0 )) {
this.btnBGColor.setColor(this.BGColor.Color);
if ( typeof(this.BGColor.Color) == 'object' ) {
var isselected = false;
for (var i=0; i<10; i++) {
if ( Common.Utils.ThemeColor.ThemeValues[i] == this.BGColor.Color.effectValue ) {
this.colorsBG.select(this.BGColor.Color,true);
isselected = true;
break;
}
}
if (!isselected) this.colorsBG.clearSelection();
} else
this.colorsBG.select(this.BGColor.Color,true);
this._state.BGColor = this.BGColor.Color;
}
color = this.GradColor.colors[this.GradColor.currentIdx];
type1 = typeof(color);
type2 = typeof(this._state.GradColor);
if ( (type1 !== type2) || (type1=='object' &&
(color.effectValue!==this._state.GradColor.effectValue || this._state.GradColor.color.indexOf(color.color)<0)) ||
(type1!='object' && this._state.GradColor.indexOf(color)<0 )) {
this.btnGradColor.setColor(color);
if ( typeof(color) == 'object' ) {
var isselected = false;
for (var i=0; i<10; i++) {
if ( Common.Utils.ThemeColor.ThemeValues[i] == color.effectValue ) {
this.colorsGrad.select(color,true);
isselected = true;
break;
}
}
if (!isselected) this.colorsGrad.clearSelection();
} else
this.colorsGrad.select(color,true);
this._state.GradColor = color;
}
this._noApply = false;
}
},
createDelayedControls: function() {
var me = this;
this._arrFillSrc = [
{displayValue: this.textColor, value: Asc.c_oAscFill.FILL_TYPE_SOLID},
{displayValue: this.textGradientFill, value: Asc.c_oAscFill.FILL_TYPE_GRAD},
{displayValue: this.textImageTexture, value: Asc.c_oAscFill.FILL_TYPE_BLIP},
{displayValue: this.textPatternFill, value: Asc.c_oAscFill.FILL_TYPE_PATT},
{displayValue: this.textNoFill, value: Asc.c_oAscFill.FILL_TYPE_NOFILL}
];
this.cmbFillSrc = new Common.UI.ComboBox({
el: $('#shape-combo-fill-src'),
cls: 'input-group-nr',
style: 'width: 100%;',
menuStyle: 'min-width: 190px;',
editable: false,
data: this._arrFillSrc
});
this.cmbFillSrc.setValue(this._arrFillSrc[0].value);
this.cmbFillSrc.on('selected', _.bind(this.onFillSrcSelect, this));
this.fillControls.push(this.cmbFillSrc);
this.cmbPattern = new Common.UI.ComboDataView({
itemWidth: 28,
itemHeight: 28,
menuMaxHeight: 300,
enableKeyEvents: true,
cls: 'combo-pattern'
});
this.cmbPattern.menuPicker.itemTemplate = this.cmbPattern.fieldPicker.itemTemplate = _.template([
'<div class="style" id="<%= id %>">',
'<img src="data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" class="combo-pattern-item" ',
'width="' + this.cmbPattern.itemWidth + '" height="' + this.cmbPattern.itemHeight + '" ',
'style="background-position: -<%= offsetx %>px -<%= offsety %>px;"/>',
'</div>'
].join(''));
this.cmbPattern.render($('#shape-combo-pattern'));
this.cmbPattern.openButton.menu.cmpEl.css({
'min-width': 178,
'max-width': 178
});
this.cmbPattern.on('click', _.bind(this.onPatternSelect, this));
this.cmbPattern.openButton.menu.on('show:after', function () {
me.cmbPattern.menuPicker.scroller.update({alwaysVisibleY: true});
});
this.fillControls.push(this.cmbPattern);
this.btnInsertFromFile = new Common.UI.Button({
el: $('#shape-button-from-file')
});
this.fillControls.push(this.btnInsertFromFile);
this.btnInsertFromUrl = new Common.UI.Button({
el: $('#shape-button-from-url')
});
this.fillControls.push(this.btnInsertFromUrl);
this.btnInsertFromFile.on('click', _.bind(function(btn){
if (this.api) this.api.ChangeShapeImageFromFile();
this.fireEvent('editcomplete', this);
}, this));
this.btnInsertFromUrl.on('click', _.bind(this.insertFromUrl, this));
this._arrFillType = [
{displayValue: this.textStretch, value: Asc.c_oAscFillBlipType.STRETCH},
{displayValue: this.textTile, value: Asc.c_oAscFillBlipType.TILE}
];
this.cmbFillType = new Common.UI.ComboBox({
el: $('#shape-combo-fill-type'),
cls: 'input-group-nr',
menuStyle: 'min-width: 90px;',
editable: false,
data: this._arrFillType
});
this.cmbFillType.setValue(this._arrFillType[0].value);
this.cmbFillType.on('selected', _.bind(this.onFillTypeSelect, this));
this.fillControls.push(this.cmbFillType);
this.numTransparency = new Common.UI.MetricSpinner({
el: $('#shape-spin-transparency'),
step: 1,
width: 62,
value: '100 %',
defaultUnit : "%",
maxValue: 100,
minValue: 0
});
this.numTransparency.on('change', _.bind(this.onNumTransparencyChange, this));
this.fillControls.push(this.numTransparency);
this.sldrTransparency = new Common.UI.SingleSlider({
el: $('#shape-slider-transparency'),
width: 75,
minValue: 0,
maxValue: 100,
value: 100
});
this.sldrTransparency.on('change', _.bind(this.onTransparencyChange, this));
this.sldrTransparency.on('changecomplete', _.bind(this.onTransparencyChangeComplete, this));
this.fillControls.push(this.sldrTransparency);
this.lblTransparencyStart = $(this.el).find('#shape-lbl-transparency-start');
this.lblTransparencyEnd = $(this.el).find('#shape-lbl-transparency-end');
if ( (type1 !== type2) || (type1=='object' &&
(this.FGColor.Color.effectValue!==this._state.FGColor.effectValue || this._state.FGColor.color.indexOf(this.FGColor.Color.color)<0)) ||
(type1!='object' && this._state.FGColor.indexOf(this.FGColor.Color)<0 )) {
this._arrGradType = [
{displayValue: this.textLinear, value: Asc.c_oAscFillGradType.GRAD_LINEAR},
{displayValue: this.textRadial, value: Asc.c_oAscFillGradType.GRAD_PATH}
];
this.btnFGColor.setColor(this.FGColor.Color);
if ( typeof(this.FGColor.Color) == 'object' ) {
var isselected = false;
for (var i=0; i<10; i++) {
if ( Common.Utils.ThemeColor.ThemeValues[i] == this.FGColor.Color.effectValue ) {
this.colorsFG.select(this.FGColor.Color,true);
isselected = true;
break;
}
}
if (!isselected) this.colorsFG.clearSelection();
} else
this.colorsFG.select(this.FGColor.Color,true);
this.cmbGradType = new Common.UI.ComboBox({
el: $('#shape-combo-grad-type'),
cls: 'input-group-nr',
menuStyle: 'min-width: 90px;',
editable: false,
data: this._arrGradType
});
this.cmbGradType.setValue(this._arrGradType[0].value);
this.cmbGradType.on('selected', _.bind(this.onGradTypeSelect, this));
this.fillControls.push(this.cmbGradType);
this._state.FGColor = this.FGColor.Color;
}
this._viewDataLinear = [
{ offsetx: 0, offsety: 0, type:45, subtype:-1, iconcls:'gradient-left-top' },
{ offsetx: 50, offsety: 0, type:90, subtype:4, iconcls:'gradient-top'},
{ offsetx: 100, offsety: 0, type:135, subtype:5, iconcls:'gradient-right-top'},
{ offsetx: 0, offsety: 50, type:0, subtype:6, iconcls:'gradient-left', cls: 'item-gradient-separator', selected: true},
{ offsetx: 100, offsety: 50, type:180, subtype:1, iconcls:'gradient-right'},
{ offsetx: 0, offsety: 100, type:315, subtype:2, iconcls:'gradient-left-bottom'},
{ offsetx: 50, offsety: 100, type:270, subtype:3, iconcls:'gradient-bottom'},
{ offsetx: 100, offsety: 100, type:225, subtype:7, iconcls:'gradient-right-bottom'}
];
type1 = typeof(this.BGColor.Color);
type2 = typeof(this._state.BGColor);
this._viewDataRadial = [
{ offsetx: 100, offsety: 150, type:2, subtype:5, iconcls:'gradient-radial-center'}
];
if ( (type1 !== type2) || (type1=='object' &&
(this.BGColor.Color.effectValue!==this._state.BGColor.effectValue || this._state.BGColor.color.indexOf(this.BGColor.Color.color)<0)) ||
(type1!='object' && this._state.BGColor.indexOf(this.BGColor.Color)<0 )) {
this.btnDirection = new Common.UI.Button({
cls : 'btn-large-dataview',
iconCls : 'item-gradient gradient-left',
menu : new Common.UI.Menu({
style: 'min-width: 60px;',
menuAlign: 'tr-br',
items: [
{ template: _.template('<div id="id-shape-menu-direction" style="width: 175px; margin: 0 5px;"></div>') }
]
})
});
this.btnDirection.on('render:after', function(btn) {
me.mnuDirectionPicker = new Common.UI.DataView({
el: $('#id-shape-menu-direction'),
parentMenu: btn.menu,
restoreHeight: 174,
allowScrollbar: false,
store: new Common.UI.DataViewStore(me._viewDataLinear),
itemTemplate: _.template('<div id="<%= id %>" class="item-gradient" style="background-position: -<%= offsetx %>px -<%= offsety %>px;"></div>')
});
});
this.btnDirection.render($('#shape-button-direction'));
this.mnuDirectionPicker.on('item:click', _.bind(this.onSelectGradient, this, this.btnDirection));
this.fillControls.push(this.btnDirection);
this.btnBGColor.setColor(this.BGColor.Color);
if ( typeof(this.BGColor.Color) == 'object' ) {
var isselected = false;
for (var i=0; i<10; i++) {
if ( Common.Utils.ThemeColor.ThemeValues[i] == this.BGColor.Color.effectValue ) {
this.colorsBG.select(this.BGColor.Color,true);
isselected = true;
break;
}
}
if (!isselected) this.colorsBG.clearSelection();
} else
this.colorsBG.select(this.BGColor.Color,true);
this.sldrGradient = new Common.UI.MultiSliderGradient({
el: $('#shape-slider-gradient'),
width: 125,
minValue: 0,
maxValue: 100,
values: [0, 100]
});
this.sldrGradient.on('change', _.bind(this.onGradientChange, this));
this.sldrGradient.on('changecomplete', _.bind(this.onGradientChangeComplete, this));
this.sldrGradient.on('thumbclick', function(cmp, index){
me.GradColor.currentIdx = index;
var color = me.GradColor.colors[me.GradColor.currentIdx];
me.btnGradColor.setColor(color);
me.colorsGrad.select(color,false);
});
this.sldrGradient.on('thumbdblclick', function(cmp){
me.btnGradColor.cmpEl.find('button').dropdown('toggle');
});
this.fillControls.push(this.sldrGradient);
this._state.BGColor = this.BGColor.Color;
}
this.cmbBorderSize = new Common.UI.ComboBorderSizeEditable({
el: $('#shape-combo-border-size'),
style: "width: 93px;",
txtNoBorders: this.txtNoBorders
})
.on('selected', _.bind(this.onBorderSizeSelect, this))
.on('changed:before',_.bind(this.onBorderSizeChanged, this, true))
.on('changed:after', _.bind(this.onBorderSizeChanged, this, false))
.on('combo:blur', _.bind(this.onComboBlur, this, false));
this.BorderSize = this.cmbBorderSize.store.at(2).get('value');
this.cmbBorderSize.setValue(this.BorderSize);
this.lockedControls.push(this.cmbBorderSize);
color = this.GradColor.colors[this.GradColor.currentIdx];
type1 = typeof(color);
type2 = typeof(this._state.GradColor);
this.cmbBorderType = new Common.UI.ComboBorderType({
el: $('#shape-combo-border-type'),
style: "width: 93px;",
menuStyle: 'min-width: 93px;'
}).on('selected', _.bind(this.onBorderTypeSelect, this))
.on('combo:blur', _.bind(this.onComboBlur, this, false));
this.BorderType = Asc.c_oDashType.solid;
this.cmbBorderType.setValue(this.BorderType);
this.lockedControls.push(this.cmbBorderType);
if ( (type1 !== type2) || (type1=='object' &&
(color.effectValue!==this._state.GradColor.effectValue || this._state.GradColor.color.indexOf(color.color)<0)) ||
(type1!='object' && this._state.GradColor.indexOf(color)<0 )) {
var viewData = [
{ offsetx: 0, data: Asc.c_oAscWrapStyle2.Inline, iconcls:'wrap-inline', tip: this.txtInline, selected: true },
{ offsetx: 50, data: Asc.c_oAscWrapStyle2.Square, iconcls:'wrap-square', tip: this.txtSquare },
{ offsetx: 100, data: Asc.c_oAscWrapStyle2.Tight, iconcls:'wrap-tight', tip: this.txtTight },
{ offsetx: 150, data: Asc.c_oAscWrapStyle2.Through, iconcls:'wrap-through', tip: this.txtThrough },
{ offsetx: 200, data: Asc.c_oAscWrapStyle2.TopAndBottom, iconcls:'wrap-topAndBottom', tip: this.txtTopAndBottom },
{ offsetx: 250, data: Asc.c_oAscWrapStyle2.InFront, iconcls:'wrap-inFront', tip: this.txtInFront },
{ offsetx: 300, data: Asc.c_oAscWrapStyle2.Behind, iconcls:'wrap-behind', tip: this.txtBehind }
];
this.btnGradColor.setColor(color);
if ( typeof(color) == 'object' ) {
var isselected = false;
for (var i=0; i<10; i++) {
if ( Common.Utils.ThemeColor.ThemeValues[i] == color.effectValue ) {
this.colorsGrad.select(color,true);
isselected = true;
break;
}
}
if (!isselected) this.colorsGrad.clearSelection();
} else
this.colorsGrad.select(color,true);
this.btnWrapType = new Common.UI.Button({
cls : 'btn-large-dataview',
iconCls : 'item-wrap wrap-inline',
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="id-shape-menu-wrap" style="width: 235px; margin: 0 5px;"></div>') }
]
})
});
this.btnWrapType.on('render:after', function(btn) {
me.mnuWrapPicker = new Common.UI.DataView({
el: $('#id-shape-menu-wrap'),
parentMenu: btn.menu,
store: new Common.UI.DataViewStore(viewData),
itemTemplate: _.template('<div id="<%= id %>" class="item-wrap" style="background-position: -<%= offsetx %>px 0;"></div>')
});
});
this.btnWrapType.render($('#shape-button-wrap'));
this.mnuWrapPicker.on('item:click', _.bind(this.onSelectWrap, this, this.btnWrapType));
this.lockedControls.push(this.btnWrapType);
this._state.GradColor = color;
}
this.btnChangeShape = new Common.UI.Button({
cls: 'btn-icon-default',
iconCls: 'btn-change-shape',
menu : new Common.UI.Menu({
menuAlign: 'tr-br',
cls: 'menu-shapes',
items: []
})
});
this.btnChangeShape.render( $('#shape-btn-change')) ;
this.lockedControls.push(this.btnChangeShape);
this._noApply = false;
}
this.linkAdvanced = $('#shape-advanced-link');
$(this.el).on('click', '#shape-advanced-link', _.bind(this.openAdvancedSettings, this));
},
createDelayedElements: function() {
this.createDelayedControls();
var global_hatch_menu_map = [
0,1,3,2,4,
53,5,6,7,8,
......@@ -1571,7 +1448,6 @@ define([
this.PatternFillType = this.patternViewData[0].type;
}
this.fillAutoShapes();
this.UpdateThemeColors();
},
......@@ -1579,6 +1455,24 @@ define([
onInitStandartTextures: function(texture) {
var me = this;
if (texture && texture.length>0){
this.btnTexture = new Common.UI.ComboBox({
el: $('#shape-combo-fill-texture'),
template: _.template([
'<div class="input-group combobox combo-dataview-menu input-group-nr dropdown-toggle" tabindex="0" data-toggle="dropdown">',
'<div class="form-control text" style="width: 90px;">' + this.textSelectTexture + '</div>',
'<div style="display: table-cell;"></div>',
'<button type="button" class="btn btn-default"><span class="caret img-commonctrl"></span></button>',
'</div>'
].join(''))
});
this.textureMenu = new Common.UI.Menu({
items: [
{ template: _.template('<div id="id-shape-menu-texture" style="width: 233px; margin: 0 5px;"></div>') }
]
});
this.textureMenu.render($('#shape-combo-fill-texture'));
this.fillControls.push(this.btnTexture);
var texturearray = [];
_.each(texture, function(item){
texturearray.push({
......@@ -1659,6 +1553,105 @@ define([
},
UpdateThemeColors: function() {
if (!this.btnBackColor) {
// create color buttons
this.btnBackColor = new Common.UI.ColorButton({
style: "width:45px;",
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="shape-back-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
{ template: _.template('<a id="shape-back-color-new" style="padding-left:12px;">' + this.textNewColor + '</a>') }
]
})
});
this.btnBackColor.render( $('#shape-back-color-btn'));
this.btnBackColor.setColor('transparent');
this.fillControls.push(this.btnBackColor);
this.colorsBack = new Common.UI.ThemeColorPalette({
el: $('#shape-back-color-menu'),
value: 'transparent',
transparent: true
});
this.colorsBack.on('select', _.bind(this.onColorsBackSelect, this));
$(this.el).on('click', '#shape-back-color-new', _.bind(this.addNewColor, this, this.colorsBack, this.btnBackColor));
this.btnFGColor = new Common.UI.ColorButton({
style: "width:45px;",
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="shape-foreground-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
{ template: _.template('<a id="shape-foreground-color-new" style="padding-left:12px;">' + this.textNewColor + '</a>') }
]
})
});
this.btnFGColor.render( $('#shape-foreground-color-btn'));
this.btnFGColor.setColor('000000');
this.fillControls.push(this.btnFGColor);
this.colorsFG = new Common.UI.ThemeColorPalette({
el: $('#shape-foreground-color-menu'),
value: '000000'
});
this.colorsFG.on('select', _.bind(this.onColorsFGSelect, this));
$(this.el).on('click', '#shape-foreground-color-new', _.bind(this.addNewColor, this, this.colorsFG, this.btnFGColor));
this.btnBGColor = new Common.UI.ColorButton({
style: "width:45px;",
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="shape-background-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
{ template: _.template('<a id="shape-background-color-new" style="padding-left:12px;">' + this.textNewColor + '</a>') }
]
})
});
this.btnBGColor.render( $('#shape-background-color-btn'));
this.btnBGColor.setColor('ffffff');
this.fillControls.push(this.btnBGColor);
this.colorsBG = new Common.UI.ThemeColorPalette({
el: $('#shape-background-color-menu'),
value: 'ffffff'
});
this.colorsBG.on('select', _.bind(this.onColorsBGSelect, this));
$(this.el).on('click', '#shape-background-color-new', _.bind(this.addNewColor, this, this.colorsBG, this.btnBGColor));
this.btnGradColor = new Common.UI.ColorButton({
style: "width:45px;",
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="shape-gradient-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
{ template: _.template('<a id="shape-gradient-color-new" style="padding-left:12px;">' + this.textNewColor + '</a>') }
]
})
});
this.btnGradColor.render( $('#shape-gradient-color-btn'));
this.btnGradColor.setColor('000000');
this.fillControls.push(this.btnGradColor);
this.colorsGrad = new Common.UI.ThemeColorPalette({
el: $('#shape-gradient-color-menu'),
value: '000000'
});
this.colorsGrad.on('select', _.bind(this.onColorsGradientSelect, this));
$(this.el).on('click', '#shape-gradient-color-new', _.bind(this.addNewColor, this, this.colorsGrad, this.btnGradColor));
this.btnBorderColor = new Common.UI.ColorButton({
style: "width:45px;",
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="shape-border-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
{ template: _.template('<a id="shape-border-color-new" style="padding-left:12px;">' + this.textNewColor + '</a>') }
]
})
});
this.btnBorderColor.render( $('#shape-border-color-btn'));
this.btnBorderColor.setColor('000000');
this.lockedControls.push(this.btnBorderColor);
this.colorsBorder = new Common.UI.ThemeColorPalette({
el: $('#shape-border-color-menu'),
value: '000000'
});
this.colorsBorder.on('select', _.bind(this.onColorsBorderSelect, this));
$(this.el).on('click', '#shape-border-color-new', _.bind(this.addNewColor, this, this.colorsBorder, this.btnBorderColor));
}
this.colorsBorder.updateColors(Common.Utils.ThemeColor.getEffectColors(), Common.Utils.ThemeColor.getStandartColors());
this.colorsBack.updateColors(Common.Utils.ThemeColor.getEffectColors(), Common.Utils.ThemeColor.getStandartColors());
this.colorsFG.updateColors(Common.Utils.ThemeColor.getEffectColors(), Common.Utils.ThemeColor.getStandartColors());
......@@ -1698,6 +1691,8 @@ define([
},
disableControls: function(disable, disableFill) {
if (this._initSettings) return;
this.disableFillPanels(disable || disableFill);
if (this._state.DisabledControls!==disable) {
this._state.DisabledControls = disable;
......
apps/documenteditor/main/app/view/TableSettings.js
View file @ af7f2254
......@@ -69,7 +69,7 @@ define([
},
initialize: function () {
var me = this;
this._initSettings = true;
this._state = {
TemplateId: 0,
......@@ -99,218 +99,6 @@ define([
this._wrapHandled = false;
this.render();
this.chHeader = new Common.UI.CheckBox({
el: $('#table-checkbox-header'),
labelText: this.textHeader
});
this.lockedControls.push(this.chHeader);
this.chTotal = new Common.UI.CheckBox({
el: $('#table-checkbox-total'),
labelText: this.textTotal
});
this.lockedControls.push(this.chTotal);
this.chBanded = new Common.UI.CheckBox({
el: $('#table-checkbox-banded'),
labelText: this.textBanded
});
this.lockedControls.push(this.chBanded);
this.chFirst = new Common.UI.CheckBox({
el: $('#table-checkbox-first'),
labelText: this.textFirst
});
this.lockedControls.push(this.chFirst);
this.chLast = new Common.UI.CheckBox({
el: $('#table-checkbox-last'),
labelText: this.textLast
});
this.lockedControls.push(this.chLast);
this.chColBanded = new Common.UI.CheckBox({
el: $('#table-checkbox-col-banded'),
labelText: this.textBanded
});
this.lockedControls.push(this.chColBanded);
this.chHeader.on('change', _.bind(this.onCheckTemplateChange, this, 0));
this.chTotal.on('change', _.bind(this.onCheckTemplateChange, this, 1));
this.chBanded.on('change', _.bind(this.onCheckTemplateChange, this, 2));
this.chFirst.on('change', _.bind(this.onCheckTemplateChange, this, 3));
this.chLast.on('change', _.bind(this.onCheckTemplateChange, this, 4));
this.chColBanded.on('change', _.bind(this.onCheckTemplateChange, this, 5));
this.cmbTableTemplate = new Common.UI.ComboDataView({
itemWidth: 70,
itemHeight: 50,
menuMaxHeight: 300,
enableKeyEvents: true,
cls: 'combo-template'
});
this.cmbTableTemplate.render($('#table-combo-template'));
this.cmbTableTemplate.openButton.menu.cmpEl.css({
'min-width': 175,
'max-width': 175
});
this.cmbTableTemplate.on('click', _.bind(this.onTableTemplateSelect, this));
this.cmbTableTemplate.openButton.menu.on('show:after', function () {
me.cmbTableTemplate.menuPicker.scroller.update({alwaysVisibleY: true});
});
this.lockedControls.push(this.cmbTableTemplate);
this.btnWrapNone = new Common.UI.Button({
cls: 'btn-options huge',
iconCls: 'icon-right-panel btn-wrap-none',
posId: c_tableWrap.TABLE_WRAP_NONE,
hint: this.textWrapNoneTooltip,
enableToggle: true,
allowDepress: false,
toggleGroup : 'tablewrapGroup'
});
this.btnWrapNone.render( $('#table-button-wrap-none')) ;
this.btnWrapNone.on('click', _.bind(this.onBtnWrapClick, this));
this.lockedControls.push(this.btnWrapNone);
this.btnWrapParallel = new Common.UI.Button({
cls: 'btn-options huge',
iconCls: 'icon-right-panel btn-wrap-parallel',
posId: c_tableWrap.TABLE_WRAP_PARALLEL,
hint: this.textWrapParallelTooltip,
enableToggle: true,
allowDepress: false,
toggleGroup : 'tablewrapGroup'
});
this.btnWrapParallel.render( $('#table-button-wrap-parallel')) ;
this.btnWrapParallel.on('click', _.bind(this.onBtnWrapClick, this));
this.lockedControls.push(this.btnWrapParallel);
var _arrBorderPosition = [
['l', 'btn-borders-small btn-position-left', 'table-button-border-left', this.tipLeft],
['c','btn-borders-small btn-position-inner-vert', 'table-button-border-inner-vert', this.tipInnerVert],
['r','btn-borders-small btn-position-right', 'table-button-border-right', this.tipRight],
['t','btn-borders-small btn-position-top', 'table-button-border-top', this.tipTop],
['m','btn-borders-small btn-position-inner-hor', 'table-button-border-inner-hor', this.tipInnerHor],
['b', 'btn-borders-small btn-position-bottom', 'table-button-border-bottom', this.tipBottom],
['cm', 'btn-borders-small btn-position-inner', 'table-button-border-inner', this.tipInner],
['lrtb', 'btn-borders-small btn-position-outer', 'table-button-border-outer', this.tipOuter],
['lrtbcm', 'btn-borders-small btn-position-all', 'table-button-border-all', this.tipAll],
['', 'btn-borders-small btn-position-none', 'table-button-border-none', this.tipNone]
];
this._btnsBorderPosition = [];
_.each(_arrBorderPosition, function(item, index, list){
var _btn = new Common.UI.Button({
cls: 'btn-toolbar',
iconCls: item[1],
strId :item[0],
hint: item[3]
});
_btn.render( $('#'+item[2])) ;
_btn.on('click', _.bind(this.onBtnBordersClick, this));
this._btnsBorderPosition.push( _btn );
this.lockedControls.push(_btn);
}, this);
this.cmbBorderSize = new Common.UI.ComboBorderSize({
el: $('#table-combo-border-size'),
style: "width: 93px;"
});
this.BorderSize = this.cmbBorderSize.store.at(1).get('value');
this.cmbBorderSize.setValue(this.BorderSize);
this.cmbBorderSize.on('selected', _.bind(this.onBorderSizeSelect, this));
this.lockedControls.push(this.cmbBorderSize);
this.btnBorderColor = new Common.UI.ColorButton({
style: "width:45px;",
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="table-border-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
{ template: _.template('<a id="table-border-color-new" style="padding-left:12px;">' + me.textNewColor + '</a>') }
]
})
});
this.btnBorderColor.on('render:after', function(btn) {
me.borderColor = new Common.UI.ThemeColorPalette({
el: $('#table-border-color-menu')
});
me.borderColor.on('select', _.bind(me.onColorsBorderSelect, me));
});
this.btnBorderColor.render( $('#table-border-color-btn'));
this.btnBorderColor.setColor('000000');
$(this.el).on('click', '#table-border-color-new', _.bind(this.addNewColor, this, this.borderColor, this.btnBorderColor));
this.lockedControls.push(this.btnBorderColor);
this.btnBackColor = new Common.UI.ColorButton({
style: "width:45px;",
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="table-back-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
{ template: _.template('<a id="table-back-color-new" style="padding-left:12px;">' + me.textNewColor + '</a>') }
]
})
});
this.btnBackColor.on('render:after', function(btn) {
me.colorsBack = new Common.UI.ThemeColorPalette({
el: $('#table-back-color-menu'),
transparent: true
});
me.colorsBack.on('select', _.bind(me.onColorsBackSelect, me));
});
this.btnBackColor.render( $('#table-back-color-btn'));
$(this.el).on('click', '#table-back-color-new', _.bind(this.addNewColor, this, this.colorsBack, this.btnBackColor, this.btnBackColor));
this.lockedControls.push(this.btnBackColor);
this.btnEdit = new Common.UI.Button({
cls: 'btn-icon-default',
iconCls: 'btn-edit-table',
menu : new Common.UI.Menu({
menuAlign: 'tr-br',
items: [
{ caption: this.selectRowText, value: 0 },
{ caption: this.selectColumnText, value: 1 },
{ caption: this.selectCellText, value: 2 },
{ caption: this.selectTableText, value: 3 },
{ caption: '--' },
{ caption: this.insertRowAboveText, value: 4 },
{ caption: this.insertRowBelowText, value: 5 },
{ caption: this.insertColumnLeftText, value: 6 },
{ caption: this.insertColumnRightText, value: 7 },
{ caption: '--' },
{ caption: this.deleteRowText, value: 8 },
{ caption: this.deleteColumnText, value: 9 },
{ caption: this.deleteTableText, value: 10 },
{ caption: '--' },
{ caption: this.mergeCellsText, value: 11 },
{ caption: this.splitCellsText, value: 12 }
]
})
});
this.btnEdit.render( $('#table-btn-edit')) ;
this.mnuMerge = this.btnEdit.menu.items[this.btnEdit.menu.items.length-2];
this.mnuSplit = this.btnEdit.menu.items[this.btnEdit.menu.items.length-1];
this.btnEdit.menu.on('show:after', _.bind( function(){
if (this.api) {
this.mnuMerge.setDisabled(!this.api.CheckBeforeMergeCells());
this.mnuSplit.setDisabled(!this.api.CheckBeforeSplitCells());
}
}, this));
this.btnEdit.menu.on('item:click', _.bind(this.onEditClick, this));
this.lockedControls.push(this.btnEdit);
this.chRepeatRow = new Common.UI.CheckBox({
el: $('#table-checkbox-repeat-row'),
labelText: this.strRepeatRow
});
this.chRepeatRow.on('change', _.bind(this.onCheckRepeatRowChange, this));
this.lockedControls.push(this.chRepeatRow);
$(this.el).on('click', '#table-advanced-link', _.bind(this.openAdvancedSettings, this));
},
onCheckTemplateChange: function(type, field, newValue, oldValue, eOpts) {
......@@ -465,8 +253,6 @@ define([
el.html(this.template({
scope: this
}));
this.linkAdvanced = $('#table-advanced-link');
},
setApi: function(o) {
......@@ -479,7 +265,171 @@ define([
return this;
},
createDelayedControls: function() {
this.chHeader = new Common.UI.CheckBox({
el: $('#table-checkbox-header'),
labelText: this.textHeader
});
this.lockedControls.push(this.chHeader);
this.chTotal = new Common.UI.CheckBox({
el: $('#table-checkbox-total'),
labelText: this.textTotal
});
this.lockedControls.push(this.chTotal);
this.chBanded = new Common.UI.CheckBox({
el: $('#table-checkbox-banded'),
labelText: this.textBanded
});
this.lockedControls.push(this.chBanded);
this.chFirst = new Common.UI.CheckBox({
el: $('#table-checkbox-first'),
labelText: this.textFirst
});
this.lockedControls.push(this.chFirst);
this.chLast = new Common.UI.CheckBox({
el: $('#table-checkbox-last'),
labelText: this.textLast
});
this.lockedControls.push(this.chLast);
this.chColBanded = new Common.UI.CheckBox({
el: $('#table-checkbox-col-banded'),
labelText: this.textBanded
});
this.lockedControls.push(this.chColBanded);
this.chHeader.on('change', _.bind(this.onCheckTemplateChange, this, 0));
this.chTotal.on('change', _.bind(this.onCheckTemplateChange, this, 1));
this.chBanded.on('change', _.bind(this.onCheckTemplateChange, this, 2));
this.chFirst.on('change', _.bind(this.onCheckTemplateChange, this, 3));
this.chLast.on('change', _.bind(this.onCheckTemplateChange, this, 4));
this.chColBanded.on('change', _.bind(this.onCheckTemplateChange, this, 5));
this.btnWrapNone = new Common.UI.Button({
cls: 'btn-options huge',
iconCls: 'icon-right-panel btn-wrap-none',
posId: c_tableWrap.TABLE_WRAP_NONE,
hint: this.textWrapNoneTooltip,
enableToggle: true,
allowDepress: false,
toggleGroup : 'tablewrapGroup'
});
this.btnWrapNone.render( $('#table-button-wrap-none')) ;
this.btnWrapNone.on('click', _.bind(this.onBtnWrapClick, this));
this.lockedControls.push(this.btnWrapNone);
this.btnWrapParallel = new Common.UI.Button({
cls: 'btn-options huge',
iconCls: 'icon-right-panel btn-wrap-parallel',
posId: c_tableWrap.TABLE_WRAP_PARALLEL,
hint: this.textWrapParallelTooltip,
enableToggle: true,
allowDepress: false,
toggleGroup : 'tablewrapGroup'
});
this.btnWrapParallel.render( $('#table-button-wrap-parallel')) ;
this.btnWrapParallel.on('click', _.bind(this.onBtnWrapClick, this));
this.lockedControls.push(this.btnWrapParallel);
var _arrBorderPosition = [
['l', 'btn-borders-small btn-position-left', 'table-button-border-left', this.tipLeft],
['c','btn-borders-small btn-position-inner-vert', 'table-button-border-inner-vert', this.tipInnerVert],
['r','btn-borders-small btn-position-right', 'table-button-border-right', this.tipRight],
['t','btn-borders-small btn-position-top', 'table-button-border-top', this.tipTop],
['m','btn-borders-small btn-position-inner-hor', 'table-button-border-inner-hor', this.tipInnerHor],
['b', 'btn-borders-small btn-position-bottom', 'table-button-border-bottom', this.tipBottom],
['cm', 'btn-borders-small btn-position-inner', 'table-button-border-inner', this.tipInner],
['lrtb', 'btn-borders-small btn-position-outer', 'table-button-border-outer', this.tipOuter],
['lrtbcm', 'btn-borders-small btn-position-all', 'table-button-border-all', this.tipAll],
['', 'btn-borders-small btn-position-none', 'table-button-border-none', this.tipNone]
];
this._btnsBorderPosition = [];
_.each(_arrBorderPosition, function(item, index, list){
var _btn = new Common.UI.Button({
cls: 'btn-toolbar',
iconCls: item[1],
strId :item[0],
hint: item[3]
});
_btn.render( $('#'+item[2])) ;
_btn.on('click', _.bind(this.onBtnBordersClick, this));
this._btnsBorderPosition.push( _btn );
this.lockedControls.push(_btn);
}, this);
this.cmbBorderSize = new Common.UI.ComboBorderSize({
el: $('#table-combo-border-size'),
style: "width: 93px;"
});
this.BorderSize = this.cmbBorderSize.store.at(1).get('value');
this.cmbBorderSize.setValue(this.BorderSize);
this.cmbBorderSize.on('selected', _.bind(this.onBorderSizeSelect, this));
this.lockedControls.push(this.cmbBorderSize);
this.btnEdit = new Common.UI.Button({
cls: 'btn-icon-default',
iconCls: 'btn-edit-table',
menu : new Common.UI.Menu({
menuAlign: 'tr-br',
items: [
{ caption: this.selectRowText, value: 0 },
{ caption: this.selectColumnText, value: 1 },
{ caption: this.selectCellText, value: 2 },
{ caption: this.selectTableText, value: 3 },
{ caption: '--' },
{ caption: this.insertRowAboveText, value: 4 },
{ caption: this.insertRowBelowText, value: 5 },
{ caption: this.insertColumnLeftText, value: 6 },
{ caption: this.insertColumnRightText, value: 7 },
{ caption: '--' },
{ caption: this.deleteRowText, value: 8 },
{ caption: this.deleteColumnText, value: 9 },
{ caption: this.deleteTableText, value: 10 },
{ caption: '--' },
{ caption: this.mergeCellsText, value: 11 },
{ caption: this.splitCellsText, value: 12 }
]
})
});
this.btnEdit.render( $('#table-btn-edit')) ;
this.mnuMerge = this.btnEdit.menu.items[this.btnEdit.menu.items.length-2];
this.mnuSplit = this.btnEdit.menu.items[this.btnEdit.menu.items.length-1];
this.btnEdit.menu.on('show:after', _.bind( function(){
if (this.api) {
this.mnuMerge.setDisabled(!this.api.CheckBeforeMergeCells());
this.mnuSplit.setDisabled(!this.api.CheckBeforeSplitCells());
}
}, this));
this.btnEdit.menu.on('item:click', _.bind(this.onEditClick, this));
this.lockedControls.push(this.btnEdit);
this.chRepeatRow = new Common.UI.CheckBox({
el: $('#table-checkbox-repeat-row'),
labelText: this.strRepeatRow
});
this.chRepeatRow.on('change', _.bind(this.onCheckRepeatRowChange, this));
this.lockedControls.push(this.chRepeatRow);
this.linkAdvanced = $('#table-advanced-link');
$(this.el).on('click', '#table-advanced-link', _.bind(this.openAdvancedSettings, this));
},
createDelayedElements: function() {
this.createDelayedControls();
this.UpdateThemeColors();
},
ChangeSettings: function(props) {
if (this._initSettings)
this.createDelayedElements();
this._initSettings = false;
this.disableControls(this._locked);
if (props )
......@@ -671,6 +621,7 @@ define([
},
_TblWrapStyleChanged: function(style) {
if (!this.btnWrapNone || !this.btnWrapParallel) return;
if ( this._state.WrapStyle!==style ) {
this._noApply = true;
this.btnWrapNone.toggle((style==c_tableWrap.TABLE_WRAP_NONE), true);
......@@ -685,18 +636,73 @@ define([
},
UpdateThemeColors: function() {
if (this.colorsBack)
this.colorsBack.updateColors(Common.Utils.ThemeColor.getEffectColors(), Common.Utils.ThemeColor.getStandartColors());
if (this.borderColor) {
this.borderColor.updateColors(Common.Utils.ThemeColor.getEffectColors(), Common.Utils.ThemeColor.getStandartColors());
this.btnBorderColor.setColor(this.borderColor.getColor());
}
if (!this.btnBackColor) {
// create color buttons
this.btnBorderColor = new Common.UI.ColorButton({
style: "width:45px;",
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="table-border-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
{ template: _.template('<a id="table-border-color-new" style="padding-left:12px;">' + this.textNewColor + '</a>') }
]
})
});
this.btnBorderColor.render( $('#table-border-color-btn'));
this.btnBorderColor.setColor('000000');
this.lockedControls.push(this.btnBorderColor);
this.borderColor = new Common.UI.ThemeColorPalette({
el: $('#table-border-color-menu')
});
this.borderColor.on('select', _.bind(this.onColorsBorderSelect, this));
$(this.el).on('click', '#table-border-color-new', _.bind(this.addNewColor, this, this.borderColor, this.btnBorderColor));
this.btnBackColor = new Common.UI.ColorButton({
style: "width:45px;",
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="table-back-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
{ template: _.template('<a id="table-back-color-new" style="padding-left:12px;">' + this.textNewColor + '</a>') }
]
})
});
this.btnBackColor.render( $('#table-back-color-btn'));
this.lockedControls.push(this.btnBackColor);
this.colorsBack = new Common.UI.ThemeColorPalette({
el: $('#table-back-color-menu'),
transparent: true
});
this.colorsBack.on('select', _.bind(this.onColorsBackSelect, this));
$(this.el).on('click', '#table-back-color-new', _.bind(this.addNewColor, this, this.colorsBack, this.btnBackColor, this.btnBackColor));
}
this.colorsBack.updateColors(Common.Utils.ThemeColor.getEffectColors(), Common.Utils.ThemeColor.getStandartColors());
this.borderColor.updateColors(Common.Utils.ThemeColor.getEffectColors(), Common.Utils.ThemeColor.getStandartColors());
this.btnBorderColor.setColor(this.borderColor.getColor());
},
_onInitTemplates: function(Templates){
var self = this;
this._isTemplatesChanged = true;
if (!this.cmbTableTemplate) {
this.cmbTableTemplate = new Common.UI.ComboDataView({
itemWidth: 70,
itemHeight: 50,
menuMaxHeight: 300,
enableKeyEvents: true,
cls: 'combo-template'
});
this.cmbTableTemplate.render($('#table-combo-template'));
this.cmbTableTemplate.openButton.menu.cmpEl.css({
'min-width': 175,
'max-width': 175
});
this.cmbTableTemplate.on('click', _.bind(this.onTableTemplateSelect, this));
this.cmbTableTemplate.openButton.menu.on('show:after', function () {
self.cmbTableTemplate.menuPicker.scroller.update({alwaysVisibleY: true});
});
this.lockedControls.push(this.cmbTableTemplate);
}
var count = self.cmbTableTemplate.menuPicker.store.length;
if (count>0 && count==Templates.length) {
var data = self.cmbTableTemplate.menuPicker.store.models;
......@@ -759,6 +765,8 @@ define([
},
disableControls: function(disable) {
if (this._initSettings) return;
if (this._state.DisabledControls!==disable) {
this._state.DisabledControls = disable;
_.each(this.lockedControls, function(item) {
......
apps/documenteditor/main/app/view/TextArtSettings.js
View file @ af7f2254
......@@ -69,7 +69,6 @@ define([
},
initialize: function () {
var me = this;
this._initSettings = true;
this._noApply = true;
this.imgprops = null;
......@@ -108,251 +107,6 @@ define([
this.render();
this.cmbTextArt = new Common.UI.ComboDataView({
itemWidth: 50,
itemHeight: 50,
menuMaxHeight: 300,
enableKeyEvents: true,
showLast: false,
cls: 'combo-textart'
});
this.cmbTextArt.render($('#textart-combo-template'));
this.cmbTextArt.openButton.menu.cmpEl.css({
'min-width': 178,
'max-width': 178
});
this.cmbTextArt.on('click', _.bind(this.onTextArtSelect, this));
this.cmbTextArt.openButton.menu.on('show:after', function () {
me.cmbTextArt.menuPicker.scroller.update({alwaysVisibleY: true});
});
this.lockedControls.push(this.cmbTextArt);
this._arrFillSrc = [
{displayValue: this.textColor, value: Asc.c_oAscFill.FILL_TYPE_SOLID},
{displayValue: this.textGradientFill, value: Asc.c_oAscFill.FILL_TYPE_GRAD},
{displayValue: this.textNoFill, value: Asc.c_oAscFill.FILL_TYPE_NOFILL}
];
this.cmbFillSrc = new Common.UI.ComboBox({
el: $('#textart-combo-fill-src'),
cls: 'input-group-nr',
style: 'width: 100%;',
menuStyle: 'min-width: 190px;',
editable: false,
data: this._arrFillSrc
});
this.cmbFillSrc.setValue(this._arrFillSrc[0].value);
this.cmbFillSrc.on('selected', _.bind(this.onFillSrcSelect, this));
this.lockedControls.push(this.cmbFillSrc);
this.btnBackColor = new Common.UI.ColorButton({
style: "width:45px;",
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="textart-back-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
{ template: _.template('<a id="textart-back-color-new" style="padding-left:12px;">' + me.textNewColor + '</a>') }
]
})
});
this.btnBackColor.on('render:after', function(btn) {
me.colorsBack = new Common.UI.ThemeColorPalette({
el: $('#textart-back-color-menu'),
value: 'transparent',
transparent: true
});
me.colorsBack.on('select', _.bind(me.onColorsBackSelect, me));
});
this.btnBackColor.render( $('#textart-back-color-btn'));
this.btnBackColor.setColor('transparent');
$(this.el).on('click', '#textart-back-color-new', _.bind(this.addNewColor, this, this.colorsBack, this.btnBackColor));
this.lockedControls.push(this.btnBackColor);
this.numTransparency = new Common.UI.MetricSpinner({
el: $('#textart-spin-transparency'),
step: 1,
width: 62,
value: '100 %',
defaultUnit : "%",
maxValue: 100,
minValue: 0
});
this.numTransparency.on('change', _.bind(this.onNumTransparencyChange, this));
this.lockedControls.push(this.numTransparency);
this.sldrTransparency = new Common.UI.SingleSlider({
el: $('#textart-slider-transparency'),
width: 75,
minValue: 0,
maxValue: 100,
value: 100
});
this.sldrTransparency.on('change', _.bind(this.onTransparencyChange, this));
this.sldrTransparency.on('changecomplete', _.bind(this.onTransparencyChangeComplete, this));
this.lockedControls.push(this.sldrTransparency);
this.lblTransparencyStart = $(this.el).find('#textart-lbl-transparency-start');
this.lblTransparencyEnd = $(this.el).find('#textart-lbl-transparency-end');
this._arrGradType = [
{displayValue: this.textLinear, value: Asc.c_oAscFillGradType.GRAD_LINEAR},
{displayValue: this.textRadial, value: Asc.c_oAscFillGradType.GRAD_PATH}
];
this.cmbGradType = new Common.UI.ComboBox({
el: $('#textart-combo-grad-type'),
cls: 'input-group-nr',
menuStyle: 'min-width: 90px;',
editable: false,
data: this._arrGradType
});
this.cmbGradType.setValue(this._arrGradType[0].value);
this.cmbGradType.on('selected', _.bind(this.onGradTypeSelect, this));
this.lockedControls.push(this.cmbGradType);
this._viewDataLinear = [
{ offsetx: 0, offsety: 0, type:45, subtype:-1, iconcls:'gradient-left-top' },
{ offsetx: 50, offsety: 0, type:90, subtype:4, iconcls:'gradient-top'},
{ offsetx: 100, offsety: 0, type:135, subtype:5, iconcls:'gradient-right-top'},
{ offsetx: 0, offsety: 50, type:0, subtype:6, iconcls:'gradient-left', cls: 'item-gradient-separator', selected: true},
{ offsetx: 100, offsety: 50, type:180, subtype:1, iconcls:'gradient-right'},
{ offsetx: 0, offsety: 100, type:315, subtype:2, iconcls:'gradient-left-bottom'},
{ offsetx: 50, offsety: 100, type:270, subtype:3, iconcls:'gradient-bottom'},
{ offsetx: 100, offsety: 100, type:225, subtype:7, iconcls:'gradient-right-bottom'}
];
this._viewDataRadial = [
{ offsetx: 100, offsety: 150, type:2, subtype:5, iconcls:'gradient-radial-center'}
];
this.btnDirection = new Common.UI.Button({
cls : 'btn-large-dataview',
iconCls : 'item-gradient gradient-left',
menu : new Common.UI.Menu({
style: 'min-width: 60px;',
menuAlign: 'tr-br',
items: [
{ template: _.template('<div id="id-textart-menu-direction" style="width: 175px; margin: 0 5px;"></div>') }
]
})
});
this.btnDirection.on('render:after', function(btn) {
me.mnuDirectionPicker = new Common.UI.DataView({
el: $('#id-textart-menu-direction'),
parentMenu: btn.menu,
restoreHeight: 174,
store: new Common.UI.DataViewStore(me._viewDataLinear),
itemTemplate: _.template('<div id="<%= id %>" class="item-gradient" style="background-position: -<%= offsetx %>px -<%= offsety %>px;"></div>')
});
});
this.btnDirection.render($('#textart-button-direction'));
this.mnuDirectionPicker.on('item:click', _.bind(this.onSelectGradient, this, this.btnDirection));
this.lockedControls.push(this.btnDirection);
this.btnGradColor = new Common.UI.ColorButton({
style: "width:45px;",
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="textart-gradient-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
{ template: _.template('<a id="textart-gradient-color-new" style="padding-left:12px;">' + me.textNewColor + '</a>') }
]
})
});
this.btnGradColor.on('render:after', function(btn) {
me.colorsGrad = new Common.UI.ThemeColorPalette({
el: $('#textart-gradient-color-menu'),
value: '000000'
});
me.colorsGrad.on('select', _.bind(me.onColorsGradientSelect, me));
});
this.btnGradColor.render( $('#textart-gradient-color-btn'));
this.btnGradColor.setColor('000000');
$(this.el).on('click', '#textart-gradient-color-new', _.bind(this.addNewColor, this, this.colorsGrad, this.btnGradColor));
this.lockedControls.push(this.btnGradColor);
this.sldrGradient = new Common.UI.MultiSliderGradient({
el: $('#textart-slider-gradient'),
width: 125,
minValue: 0,
maxValue: 100,
values: [0, 100]
});
this.sldrGradient.on('change', _.bind(this.onGradientChange, this));
this.sldrGradient.on('changecomplete', _.bind(this.onGradientChangeComplete, this));
this.sldrGradient.on('thumbclick', function(cmp, index){
me.GradColor.currentIdx = index;
var color = me.GradColor.colors[me.GradColor.currentIdx];
me.btnGradColor.setColor(color);
me.colorsGrad.select(color,false);
});
this.sldrGradient.on('thumbdblclick', function(cmp){
me.btnGradColor.cmpEl.find('button').dropdown('toggle');
});
this.lockedControls.push(this.sldrGradient);
this.cmbBorderSize = new Common.UI.ComboBorderSizeEditable({
el: $('#textart-combo-border-size'),
style: "width: 93px;",
txtNoBorders: this.txtNoBorders
})
.on('selected', _.bind(this.onBorderSizeSelect, this))
.on('changed:before',_.bind(this.onBorderSizeChanged, this, true))
.on('changed:after', _.bind(this.onBorderSizeChanged, this, false))
.on('combo:blur', _.bind(this.onComboBlur, this, false));
this.BorderSize = this.cmbBorderSize.store.at(2).get('value');
this.cmbBorderSize.setValue(this.BorderSize);
this.lockedControls.push(this.cmbBorderSize);
this.btnBorderColor = new Common.UI.ColorButton({
style: "width:45px;",
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="textart-border-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
{ template: _.template('<a id="textart-border-color-new" style="padding-left:12px;">' + me.textNewColor + '</a>') }
]
})
});
this.lockedControls.push(this.btnBorderColor);
this.btnBorderColor.on('render:after', function(btn) {
me.colorsBorder = new Common.UI.ThemeColorPalette({
el: $('#textart-border-color-menu'),
value: '000000'
});
me.colorsBorder.on('select', _.bind(me.onColorsBorderSelect, me));
});
this.btnBorderColor.render( $('#textart-border-color-btn'));
this.btnBorderColor.setColor('000000');
$(this.el).on('click', '#textart-border-color-new', _.bind(this.addNewColor, this, this.colorsBorder, this.btnBorderColor));
this.cmbBorderType = new Common.UI.ComboBorderType({
el: $('#textart-combo-border-type'),
style: "width: 93px;",
menuStyle: 'min-width: 93px;'
}).on('selected', _.bind(this.onBorderTypeSelect, this))
.on('combo:blur', _.bind(this.onComboBlur, this, false));
this.BorderType = Asc.c_oDashType.solid;
this.cmbBorderType.setValue(this.BorderType);
this.lockedControls.push(this.cmbBorderType);
this.cmbTransform = new Common.UI.ComboDataView({
itemWidth: 50,
itemHeight: 50,
menuMaxHeight: 300,
enableKeyEvents: true,
cls: 'combo-textart'
});
this.cmbTransform.render($('#textart-combo-transform'));
this.cmbTransform.openButton.menu.cmpEl.css({
'min-width': 178,
'max-width': 178
});
this.cmbTransform.on('click', _.bind(this.onTransformSelect, this));
this.cmbTransform.openButton.menu.on('show:after', function () {
me.cmbTransform.menuPicker.scroller.update({alwaysVisibleY: true});
});
this.lockedControls.push(this.cmbTransform);
this.FillColorContainer = $('#textart-panel-color-fill');
this.FillGradientContainer = $('#textart-panel-gradient-fill');
this.TransparencyContainer = $('#textart-panel-transparent-fill');
......@@ -1043,14 +797,201 @@ define([
}
},
createDelayedControls: function() {
var me = this;
this._arrFillSrc = [
{displayValue: this.textColor, value: Asc.c_oAscFill.FILL_TYPE_SOLID},
{displayValue: this.textGradientFill, value: Asc.c_oAscFill.FILL_TYPE_GRAD},
{displayValue: this.textNoFill, value: Asc.c_oAscFill.FILL_TYPE_NOFILL}
];
this.cmbFillSrc = new Common.UI.ComboBox({
el: $('#textart-combo-fill-src'),
cls: 'input-group-nr',
style: 'width: 100%;',
menuStyle: 'min-width: 190px;',
editable: false,
data: this._arrFillSrc
});
this.cmbFillSrc.setValue(this._arrFillSrc[0].value);
this.cmbFillSrc.on('selected', _.bind(this.onFillSrcSelect, this));
this.lockedControls.push(this.cmbFillSrc);
this.numTransparency = new Common.UI.MetricSpinner({
el: $('#textart-spin-transparency'),
step: 1,
width: 62,
value: '100 %',
defaultUnit : "%",
maxValue: 100,
minValue: 0
});
this.numTransparency.on('change', _.bind(this.onNumTransparencyChange, this));
this.lockedControls.push(this.numTransparency);
this.sldrTransparency = new Common.UI.SingleSlider({
el: $('#textart-slider-transparency'),
width: 75,
minValue: 0,
maxValue: 100,
value: 100
});
this.sldrTransparency.on('change', _.bind(this.onTransparencyChange, this));
this.sldrTransparency.on('changecomplete', _.bind(this.onTransparencyChangeComplete, this));
this.lockedControls.push(this.sldrTransparency);
this.lblTransparencyStart = $(this.el).find('#textart-lbl-transparency-start');
this.lblTransparencyEnd = $(this.el).find('#textart-lbl-transparency-end');
this._arrGradType = [
{displayValue: this.textLinear, value: Asc.c_oAscFillGradType.GRAD_LINEAR},
{displayValue: this.textRadial, value: Asc.c_oAscFillGradType.GRAD_PATH}
];
this.cmbGradType = new Common.UI.ComboBox({
el: $('#textart-combo-grad-type'),
cls: 'input-group-nr',
menuStyle: 'min-width: 90px;',
editable: false,
data: this._arrGradType
});
this.cmbGradType.setValue(this._arrGradType[0].value);
this.cmbGradType.on('selected', _.bind(this.onGradTypeSelect, this));
this.lockedControls.push(this.cmbGradType);
this._viewDataLinear = [
{ offsetx: 0, offsety: 0, type:45, subtype:-1, iconcls:'gradient-left-top' },
{ offsetx: 50, offsety: 0, type:90, subtype:4, iconcls:'gradient-top'},
{ offsetx: 100, offsety: 0, type:135, subtype:5, iconcls:'gradient-right-top'},
{ offsetx: 0, offsety: 50, type:0, subtype:6, iconcls:'gradient-left', cls: 'item-gradient-separator', selected: true},
{ offsetx: 100, offsety: 50, type:180, subtype:1, iconcls:'gradient-right'},
{ offsetx: 0, offsety: 100, type:315, subtype:2, iconcls:'gradient-left-bottom'},
{ offsetx: 50, offsety: 100, type:270, subtype:3, iconcls:'gradient-bottom'},
{ offsetx: 100, offsety: 100, type:225, subtype:7, iconcls:'gradient-right-bottom'}
];
this._viewDataRadial = [
{ offsetx: 100, offsety: 150, type:2, subtype:5, iconcls:'gradient-radial-center'}
];
this.btnDirection = new Common.UI.Button({
cls : 'btn-large-dataview',
iconCls : 'item-gradient gradient-left',
menu : new Common.UI.Menu({
style: 'min-width: 60px;',
menuAlign: 'tr-br',
items: [
{ template: _.template('<div id="id-textart-menu-direction" style="width: 175px; margin: 0 5px;"></div>') }
]
})
});
this.btnDirection.on('render:after', function(btn) {
me.mnuDirectionPicker = new Common.UI.DataView({
el: $('#id-textart-menu-direction'),
parentMenu: btn.menu,
restoreHeight: 174,
store: new Common.UI.DataViewStore(me._viewDataLinear),
itemTemplate: _.template('<div id="<%= id %>" class="item-gradient" style="background-position: -<%= offsetx %>px -<%= offsety %>px;"></div>')
});
});
this.btnDirection.render($('#textart-button-direction'));
this.mnuDirectionPicker.on('item:click', _.bind(this.onSelectGradient, this, this.btnDirection));
this.lockedControls.push(this.btnDirection);
this.sldrGradient = new Common.UI.MultiSliderGradient({
el: $('#textart-slider-gradient'),
width: 125,
minValue: 0,
maxValue: 100,
values: [0, 100]
});
this.sldrGradient.on('change', _.bind(this.onGradientChange, this));
this.sldrGradient.on('changecomplete', _.bind(this.onGradientChangeComplete, this));
this.sldrGradient.on('thumbclick', function(cmp, index){
me.GradColor.currentIdx = index;
var color = me.GradColor.colors[me.GradColor.currentIdx];
me.btnGradColor.setColor(color);
me.colorsGrad.select(color,false);
});
this.sldrGradient.on('thumbdblclick', function(cmp){
me.btnGradColor.cmpEl.find('button').dropdown('toggle');
});
this.lockedControls.push(this.sldrGradient);
this.cmbBorderSize = new Common.UI.ComboBorderSizeEditable({
el: $('#textart-combo-border-size'),
style: "width: 93px;",
txtNoBorders: this.txtNoBorders
})
.on('selected', _.bind(this.onBorderSizeSelect, this))
.on('changed:before',_.bind(this.onBorderSizeChanged, this, true))
.on('changed:after', _.bind(this.onBorderSizeChanged, this, false))
.on('combo:blur', _.bind(this.onComboBlur, this, false));
this.BorderSize = this.cmbBorderSize.store.at(2).get('value');
this.cmbBorderSize.setValue(this.BorderSize);
this.lockedControls.push(this.cmbBorderSize);
this.cmbBorderType = new Common.UI.ComboBorderType({
el: $('#textart-combo-border-type'),
style: "width: 93px;",
menuStyle: 'min-width: 93px;'
}).on('selected', _.bind(this.onBorderTypeSelect, this))
.on('combo:blur', _.bind(this.onComboBlur, this, false));
this.BorderType = Asc.c_oDashType.solid;
this.cmbBorderType.setValue(this.BorderType);
this.lockedControls.push(this.cmbBorderType);
this.cmbTransform = new Common.UI.ComboDataView({
itemWidth: 50,
itemHeight: 50,
menuMaxHeight: 300,
enableKeyEvents: true,
cls: 'combo-textart'
});
this.cmbTransform.render($('#textart-combo-transform'));
this.cmbTransform.openButton.menu.cmpEl.css({
'min-width': 178,
'max-width': 178
});
this.cmbTransform.on('click', _.bind(this.onTransformSelect, this));
this.cmbTransform.openButton.menu.on('show:after', function () {
me.cmbTransform.menuPicker.scroller.update({alwaysVisibleY: true});
});
this.lockedControls.push(this.cmbTransform);
},
createDelayedElements: function() {
this.createDelayedControls();
this.UpdateThemeColors();
this.fillTransform(this.api.asc_getPropertyEditorTextArts());
},
fillTextArt: function() {
var me = this,
models = this.application.getCollection('Common.Collections.TextArt').models,
var me = this;
if (!this.cmbTextArt) {
this.cmbTextArt = new Common.UI.ComboDataView({
itemWidth: 50,
itemHeight: 50,
menuMaxHeight: 300,
enableKeyEvents: true,
showLast: false,
cls: 'combo-textart'
});
this.cmbTextArt.render($('#textart-combo-template'));
this.cmbTextArt.openButton.menu.cmpEl.css({
'min-width': 178,
'max-width': 178
});
this.cmbTextArt.on('click', _.bind(this.onTextArtSelect, this));
this.cmbTextArt.openButton.menu.on('show:after', function () {
me.cmbTextArt.menuPicker.scroller.update({alwaysVisibleY: true});
});
this.lockedControls.push(this.cmbTextArt);
}
var models = this.application.getCollection('Common.Collections.TextArt').models,
count = this.cmbTextArt.menuPicker.store.length;
if (count>0 && count==models.length) {
var data = this.cmbTextArt.menuPicker.store.models;
......@@ -1108,6 +1049,66 @@ define([
},
UpdateThemeColors: function() {
if (!this.btnBackColor) {
this.btnBorderColor = new Common.UI.ColorButton({
style: "width:45px;",
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="textart-border-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
{ template: _.template('<a id="textart-border-color-new" style="padding-left:12px;">' + this.textNewColor + '</a>') }
]
})
});
this.btnBorderColor.render( $('#textart-border-color-btn'));
this.btnBorderColor.setColor('000000');
this.lockedControls.push(this.btnBorderColor);
this.colorsBorder = new Common.UI.ThemeColorPalette({
el: $('#textart-border-color-menu'),
value: '000000'
});
this.colorsBorder.on('select', _.bind(this.onColorsBorderSelect, this));
$(this.el).on('click', '#textart-border-color-new', _.bind(this.addNewColor, this, this.colorsBorder, this.btnBorderColor));
this.btnGradColor = new Common.UI.ColorButton({
style: "width:45px;",
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="textart-gradient-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
{ template: _.template('<a id="textart-gradient-color-new" style="padding-left:12px;">' + this.textNewColor + '</a>') }
]
})
});
this.btnGradColor.render( $('#textart-gradient-color-btn'));
this.btnGradColor.setColor('000000');
this.lockedControls.push(this.btnGradColor);
this.colorsGrad = new Common.UI.ThemeColorPalette({
el: $('#textart-gradient-color-menu'),
value: '000000'
});
this.colorsGrad.on('select', _.bind(this.onColorsGradientSelect, this));
$(this.el).on('click', '#textart-gradient-color-new', _.bind(this.addNewColor, this, this.colorsGrad, this.btnGradColor));
this.btnBackColor = new Common.UI.ColorButton({
style: "width:45px;",
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="textart-back-color-menu" style="width: 165px; height: 220px; margin: 10px;"></div>') },
{ template: _.template('<a id="textart-back-color-new" style="padding-left:12px;">' + this.textNewColor + '</a>') }
]
})
});
this.btnBackColor.render( $('#textart-back-color-btn'));
this.btnBackColor.setColor('transparent');
this.lockedControls.push(this.btnBackColor);
this.colorsBack = new Common.UI.ThemeColorPalette({
el: $('#textart-back-color-menu'),
value: 'transparent',
transparent: true
});
this.colorsBack.on('select', _.bind(this.onColorsBackSelect, this));
$(this.el).on('click', '#textart-back-color-new', _.bind(this.addNewColor, this, this.colorsBack, this.btnBackColor));
}
this.colorsBorder.updateColors(Common.Utils.ThemeColor.getEffectColors(), Common.Utils.ThemeColor.getStandartColors());
this.colorsBack.updateColors(Common.Utils.ThemeColor.getEffectColors(), Common.Utils.ThemeColor.getStandartColors());
this.colorsGrad.updateColors(Common.Utils.ThemeColor.getEffectColors(), Common.Utils.ThemeColor.getStandartColors());
......@@ -1132,6 +1133,8 @@ define([
},
disableControls: function(disable) {
if (this._initSettings) return;
if (this._state.DisabledControls!==disable) {
this._state.DisabledControls = disable;
_.each(this.lockedControls, function(item) {
......
apps/documenteditor/main/app/view/Toolbar.js
View file @ af7f2254
......@@ -101,80 +101,70 @@ define([
this.btnNewDocument = new Common.UI.Button({
id : 'id-toolbar-btn-newdocument',
cls : 'btn-toolbar',
iconCls : 'btn-newdocument',
hint : this.tipNewDocument
iconCls : 'btn-newdocument'
});
this.toolbarControls.push(this.btnNewDocument);
this.btnOpenDocument = new Common.UI.Button({
id : 'id-toolbar-btn-opendocument',
cls : 'btn-toolbar',
iconCls : 'btn-opendocument',
hint : this.tipOpenDocument
iconCls : 'btn-opendocument'
});
this.toolbarControls.push(this.btnOpenDocument);
this.btnPrint = new Common.UI.Button({
id : 'id-toolbar-btn-print',
cls : 'btn-toolbar',
iconCls : 'btn-print no-mask',
hint : this.tipPrint + Common.Utils.String.platformKey('Ctrl+P')
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,
hint : this.btnSaveTip
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',
hint : this.tipUndo + Common.Utils.String.platformKey('Ctrl+Z')
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',
hint : this.tipRedo + Common.Utils.String.platformKey('Ctrl+Y')
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',
hint : this.tipCopy + Common.Utils.String.platformKey('Ctrl+C')
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',
hint : this.tipPaste + Common.Utils.String.platformKey('Ctrl+V')
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',
hint : this.tipIncFont + Common.Utils.String.platformKey('Ctrl+]')
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',
hint : this.tipDecFont + Common.Utils.String.platformKey('Ctrl+[')
iconCls : 'btn-decfont'
});
this.paragraphControls.push(this.btnDecFontSize);
......@@ -182,7 +172,6 @@ define([
id : 'id-toolbar-btn-bold',
cls : 'btn-toolbar',
iconCls : 'btn-bold',
hint : this.textBold + Common.Utils.String.platformKey('Ctrl+B'),
enableToggle: true
});
this.paragraphControls.push(this.btnBold);
......@@ -191,7 +180,6 @@ define([
id : 'id-toolbar-btn-italic',
cls : 'btn-toolbar',
iconCls : 'btn-italic',
hint : this.textItalic + Common.Utils.String.platformKey('Ctrl+I'),
enableToggle: true
});
this.paragraphControls.push(this.btnItalic);
......@@ -200,7 +188,6 @@ define([
id : 'id-toolbar-btn-underline',
cls : 'btn-toolbar',
iconCls : 'btn-underline',
hint : this.textUnderline + Common.Utils.String.platformKey('Ctrl+U'),
enableToggle: true
});
this.paragraphControls.push(this.btnUnderline);
......@@ -209,7 +196,6 @@ define([
id : 'id-toolbar-btn-strikeout',
cls : 'btn-toolbar',
iconCls : 'btn-strikeout',
hint : this.textStrikeout,
enableToggle: true
});
this.paragraphControls.push(this.btnStrikeout);
......@@ -218,7 +204,6 @@ define([
id : 'id-toolbar-btn-superscript',
cls : 'btn-toolbar',
iconCls : 'btn-superscript',
hint : this.textSuperscript,
enableToggle: true,
toggleGroup : 'superscriptGroup'
});
......@@ -228,7 +213,6 @@ define([
id : 'id-toolbar-btn-subscript',
cls : 'btn-toolbar',
iconCls : 'btn-subscript',
hint : this.textSubscript,
enableToggle: true,
toggleGroup : 'superscriptGroup'
});
......@@ -238,7 +222,6 @@ define([
id : 'id-toolbar-btn-highlight',
cls : 'btn-toolbar',
iconCls : 'btn-highlight',
hint : this.tipHighlightColor,
enableToggle: true,
allowDepress: true,
split : true,
......@@ -261,7 +244,6 @@ define([
id : 'id-toolbar-btn-fontcolor',
cls : 'btn-toolbar',
iconCls : 'btn-fontcolor',
hint : this.tipFontColor,
split : true,
menu : new Common.UI.Menu({
items: [
......@@ -282,7 +264,6 @@ define([
id : 'id-toolbar-btn-paracolor',
cls : 'btn-toolbar',
iconCls : 'btn-paracolor',
hint : this.tipPrColor,
split : true,
menu : new Common.UI.Menu({
items: [
......@@ -298,7 +279,6 @@ define([
id : 'id-toolbar-btn-align-left',
cls : 'btn-toolbar',
iconCls : 'btn-align-left',
hint : this.tipAlignLeft + Common.Utils.String.platformKey('Ctrl+L'),
enableToggle: true,
allowDepress: false,
toggleGroup : 'alignGroup'
......@@ -309,7 +289,6 @@ define([
id : 'id-toolbar-btn-align-center',
cls : 'btn-toolbar',
iconCls : 'btn-align-center',
hint : this.tipAlignCenter + Common.Utils.String.platformKey('Ctrl+E'),
enableToggle: true,
allowDepress: false,
toggleGroup : 'alignGroup'
......@@ -320,7 +299,6 @@ define([
id : 'id-toolbar-btn-align-right',
cls : 'btn-toolbar',
iconCls : 'btn-align-right',
hint : this.tipAlignRight + Common.Utils.String.platformKey('Ctrl+R'),
enableToggle: true,
allowDepress: false,
toggleGroup : 'alignGroup'
......@@ -331,7 +309,6 @@ define([
id : 'id-toolbar-btn-align-just',
cls : 'btn-toolbar',
iconCls : 'btn-align-just',
hint : this.tipAlignJust + Common.Utils.String.platformKey('Ctrl+J'),
enableToggle: true,
allowDepress: false,
toggleGroup: 'alignGroup'
......@@ -342,7 +319,6 @@ define([
id : 'id-toolbar-btn-halign',
cls : 'btn-toolbar',
iconCls : 'btn-align-left',
hint : this.tipHAligh,
icls : 'btn-align-left',
menu : new Common.UI.Menu({
cls: 'ppm-toolbar',
......@@ -388,16 +364,14 @@ define([
this.btnDecLeftOffset = new Common.UI.Button({
id : 'id-toolbar-btn-decoffset',
cls : 'btn-toolbar',
iconCls : 'btn-decoffset',
hint : this.tipDecPrLeft + Common.Utils.String.platformKey('Ctrl+Shift+M')
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',
hint : this.tipIncPrLeft + Common.Utils.String.platformKey('Ctrl+M')
iconCls : 'btn-incoffset'
});
this.paragraphControls.push(this.btnIncLeftOffset);
......@@ -405,7 +379,6 @@ define([
id : 'id-toolbar-btn-linespace',
cls : 'btn-toolbar',
iconCls : 'btn-linespace',
hint : this.tipLineSpace,
menu : new Common.UI.Menu({
style: 'min-width: 60px;',
items: [
......@@ -424,7 +397,6 @@ define([
id : 'id-toolbar-btn-hidenchars',
cls : 'btn-toolbar',
iconCls : 'btn-hidenchars',
hint : this.tipShowHiddenChars,
enableToggle: true,
split : true,
menu : new Common.UI.Menu({
......@@ -441,15 +413,10 @@ define([
id : 'id-toolbar-btn-markers',
cls : 'btn-toolbar',
iconCls : 'btn-setmarkers',
hint : this.tipMarkers,
enableToggle: true,
toggleGroup : 'markersGroup',
split : true,
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="id-toolbar-menu-markers" class="menu-markers" style="width: 185px; margin: 0 5px;"></div>') }
]
})
menu : true
});
this.paragraphControls.push(this.btnMarkers);
this.textOnlyControls.push(this.btnMarkers);
......@@ -458,15 +425,10 @@ define([
id : 'id-toolbar-btn-numbering',
cls : 'btn-toolbar',
iconCls : 'btn-numbering',
hint : this.tipNumbers,
enableToggle: true,
toggleGroup : 'markersGroup',
split : true,
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="id-toolbar-menu-numbering" class="menu-markers" style="width: 330px; margin: 0 5px;"></div>') }
]
})
menu : true
});
this.paragraphControls.push(this.btnNumbers);
this.textOnlyControls.push(this.btnNumbers);
......@@ -475,21 +437,24 @@ define([
id : 'id-toolbar-btn-multilevels',
cls : 'btn-toolbar',
iconCls : 'btn-multilevels',
hint : this.tipMultilevels,
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="id-toolbar-menu-multilevels" class="menu-markers" style="width: 165px; margin: 0 5px;"></div>') }
]
})
menu : true
});
this.paragraphControls.push(this.btnMultilevels);
this.textOnlyControls.push(this.btnMultilevels);
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({
id : 'id-toolbar-btn-inserttable',
cls : 'btn-toolbar',
iconCls : 'btn-inserttable',
hint : this.tipInsertTable,
menu : new Common.UI.Menu({
items: [
{ template: _.template('<div id="id-toolbar-menu-tablepicker" class="dimension-picker" style="margin: 5px 10px;"></div>') },
......@@ -503,7 +468,6 @@ define([
id : 'id-toolbar-btn-insertimage',
cls : 'btn-toolbar',
iconCls : 'btn-insertimage',
hint : this.tipInsertImage,
menu : new Common.UI.Menu({
items: [
{ caption: this.mniImageFromFile, value: 'file' },
......@@ -517,7 +481,6 @@ define([
id : 'id-toolbar-btn-insertchart',
cls : 'btn-toolbar',
iconCls : 'btn-insertchart',
hint : this.tipInsertChart,
menu : new Common.UI.Menu({
style: 'width: 560px;',
items: [
......@@ -531,7 +494,6 @@ define([
id : 'id-toolbar-btn-inserttext',
cls : 'btn-toolbar',
iconCls : 'btn-text',
hint : this.tipInsertText,
enableToggle: true,
split : true,
menu : new Common.UI.Menu({
......@@ -557,35 +519,15 @@ define([
id : 'id-toolbar-btn-pagebreak',
cls : 'btn-toolbar',
iconCls : 'btn-pagebreak',
hint : this.tipPageBreak,
split : true,
menu : new Common.UI.Menu({
items : [
{caption: this.textInsPageBreak},
{caption: this.textInsColumnBreak, value: 'column'},
this.mnuInsertSectionBreak = new Common.UI.MenuItem({
caption: this.textInsSectionBreak,
value: 'section',
menu: new Common.UI.Menu({
menuAlign: 'tl-tr',
items : [
{caption: this.textNextPage, value: Asc.c_oAscSectionBreakType.NextPage},
{caption: this.textContPage, value: Asc.c_oAscSectionBreakType.Continuous},
{caption: this.textEvenPage, value: Asc.c_oAscSectionBreakType.EvenPage},
{caption: this.textOddPage, value: Asc.c_oAscSectionBreakType.OddPage}
]
})
})
]
})
menu : true
});
this.paragraphControls.push(this.btnInsertPageBreak);
this.btnInsertHyperlink = new Common.UI.Button({
id : 'id-toolbar-btn-inserthyperlink',
cls : 'btn-toolbar',
iconCls : 'btn-inserthyperlink',
hint : this.tipInsertHyperlink + Common.Utils.String.platformKey('Ctrl+K')
iconCls : 'btn-inserthyperlink'
});
this.paragraphControls.push(this.btnInsertHyperlink);
......@@ -593,28 +535,19 @@ define([
id : 'id-toolbar-btn-editheader',
cls : 'btn-toolbar',
iconCls : 'btn-editheader',
hint : this.tipEditHeader,
menu : new Common.UI.Menu({
items: [
{ caption: this.mniEditHeader, value: 'header' },
{ caption: this.mniEditFooter, value: 'footer' },
{ caption: '--' },
me.mnuInsertPageNum = new Common.UI.MenuItem({
caption: this.textInsertPageNumber,
menu: new Common.UI.Menu({
menuAlign: 'tl-tr',
items: [
{ template: _.template('<div id="id-toolbar-menu-pageposition" class="menu-pageposition"></div>') },
me.mnuPageNumCurrentPos = new Common.UI.MenuItem({
caption: this.textToCurrent,
value: 'current'
})
]
})
})
]
})
});
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.paragraphControls.push(this.mnuPageNumCurrentPos);
this.toolbarControls.push(this.btnEditHeader);
......@@ -622,7 +555,6 @@ define([
id : 'id-toolbar-btn-insertshape',
cls : 'btn-toolbar',
iconCls : 'btn-insertshape',
hint : this.tipInsertShape,
enableToggle: true,
menu : new Common.UI.Menu({cls: 'menu-shapes'})
});
......@@ -632,7 +564,6 @@ define([
id : 'id-toolbar-btn-insertequation',
cls : 'btn-toolbar',
iconCls : 'btn-insertequation',
hint : this.tipInsertEquation,
split : true,
menu : new Common.UI.Menu({cls: 'menu-shapes'})
});
......@@ -642,7 +573,6 @@ define([
id : 'id-toolbar-btn-dropcap',
cls : 'btn-toolbar',
iconCls : 'btn-dropcap',
hint : this.tipDropCap,
menu : new Common.UI.Menu({
cls: 'ppm-toolbar',
items: [
......@@ -660,7 +590,6 @@ define([
id : 'id-toolbar-btn-columns',
cls : 'btn-toolbar',
iconCls : 'btn-columns',
hint : this.tipColumns,
menu : new Common.UI.Menu({
cls: 'ppm-toolbar',
items: [
......@@ -678,7 +607,6 @@ define([
id : 'id-toolbar-btn-pageorient',
cls : 'btn-toolbar',
iconCls : 'btn-pageorient',
hint : this.tipPageOrient,
menu : new Common.UI.Menu({
cls: 'ppm-toolbar',
items: [
......@@ -702,7 +630,6 @@ define([
id : 'id-toolbar-btn-pagemargins',
cls : 'btn-toolbar',
iconCls : 'btn-pagemargins',
hint : this.tipPageMargins,
menu : new Common.UI.Menu({
items: [
{ caption: this.textMarginsLast, checkable: true, template: pageMarginsTemplate, toggleGroup: 'menuPageMargins'}, //top,left,bottom,right
......@@ -726,7 +653,6 @@ define([
id : 'id-toolbar-btn-pagesize',
cls : 'btn-toolbar',
iconCls : 'btn-pagesize',
hint : this.tipPageSize,
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] },
......@@ -752,8 +678,7 @@ define([
this.btnClearStyle = new Common.UI.Button({
id : 'id-toolbar-btn-clearstyle',
cls : 'btn-toolbar',
iconCls : 'btn-clearstyle',
hint : this.tipClearStyle
iconCls : 'btn-clearstyle'
});
this.toolbarControls.push(this.btnClearStyle);
......@@ -761,7 +686,6 @@ define([
id : 'id-toolbar-btn-copystyle',
cls : 'btn-toolbar',
iconCls : 'btn-copystyle',
hint : this.tipCopyStyle + Common.Utils.String.platformKey('Ctrl+Shift+C'),
enableToggle: true
});
this.toolbarControls.push(this.btnCopyStyle);
......@@ -770,113 +694,35 @@ define([
id : 'id-toolbar-btn-colorschemas',
cls : 'btn-toolbar',
iconCls : 'btn-colorschemas',
hint : this.tipColorSchemas,
menu : new Common.UI.Menu({
items: [],
maxHeight : 600,
restoreHeight: 600
}).on('render:after', function(mnu) {
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 = Common.Utils.innerHeight(),
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});
}
})
menu : true
});
this.toolbarControls.push(this.btnColorSchemas);
this.btnMailRecepients= new Common.UI.Button({
id : 'id-toolbar-btn-mailrecepients',
cls : 'btn-toolbar',
iconCls : 'btn-mailrecepients',
hint : this.tipMailRecepients
iconCls : 'btn-mailrecepients'
});
this.btnHide = new Common.UI.Button({
id : 'id-toolbar-btn-hidebars',
cls : 'btn-toolbar',
iconCls : 'btn-hidebars no-mask',
hint : this.tipViewSettings,
menu : new Common.UI.Menu({
cls: 'pull-right',
style: 'min-width: 180px;',
items: [
this.mnuitemCompactToolbar = new Common.UI.MenuItem({
caption : this.textCompactView,
checkable : true
}),
this.mnuitemHideTitleBar = new Common.UI.MenuItem({
caption : this.textHideTitleBar,
checkable : true
}),
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
}),
this.btnFitWidth = new Common.UI.MenuItem({
caption: this.textFitWidth,
checkable: true
}),
(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>',
'<button id="id-menu-zoom-in" type="button" style="float:right; margin: 2px 5px 0 0;" class="btn small btn-toolbar"><span class="btn-icon btn-zoomin">&nbsp;</span></button>',
'<label class="zoom">100%</label>',
'<button id="id-menu-zoom-out" type="button" style="float:right; margin-top: 2px;" class="btn small btn-toolbar"><span class="btn-icon btn-zoomout">&nbsp;</span></button>',
'</div>'
].join('')),
stopPropagation: true
}))
]
})
}).on('render:after', _.bind(function(cmp){
me.mnuZoomOut = new Common.UI.Button({
el : $('#id-menu-zoom-out'),
cls : 'btn-toolbar'
});
me.mnuZoomIn = new Common.UI.Button({
el : $('#id-menu-zoom-in'),
cls : 'btn-toolbar'
});
}), me);
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.btnAdvSettings = new Common.UI.Button({
id : 'id-toolbar-btn-settings',
cls : 'btn-toolbar',
iconCls : 'btn-settings no-mask',
hint : this.tipAdvSettings
iconCls : 'btn-settings no-mask'
});
this.toolbarControls.push(this.btnAdvSettings);
......@@ -889,79 +735,11 @@ define([
this.mnuInsertTable = this.btnInsertTable.menu;
this.mnuInsertImage = this.btnInsertImage.menu;
this.mnuPageSize = this.btnPageSize.menu;
this.mnuColorSchema = this.btnColorSchemas.menu;
//
// DataView and pickers
//
this.btnMarkers.on('render:after', function(btn) {
me.mnuMarkersPicker = new Common.UI.DataView({
el: $('#id-toolbar-menu-markers'),
parentMenu: btn.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>')
});
});
this.btnNumbers.on('render:after', function(btn) {
me.mnuNumbersPicker = new Common.UI.DataView({
el: $('#id-toolbar-menu-numbering'),
parentMenu: btn.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} }
]),
itemTemplate: _.template('<div id="<%= id %>" class="item-numberlist" style="background-position: 0 -<%= offsety %>px;"></div>')
});
});
this.btnMultilevels.on('render:after', function(btn) {
me.mnuMultilevelPicker = new Common.UI.DataView({
el: $('#id-toolbar-menu-multilevels'),
parentMenu: btn.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} }
]),
itemTemplate: _.template('<div id="<%= id %>" class="item-multilevellist" style="background-position: 0 -<%= offsety %>px;"></div>')
});
});
this.btnInsertTable.on('render:after', function(btn) {
me.mnuTablePicker = new Common.UI.DimensionPicker({
el : $('#id-toolbar-menu-tablepicker'),
minRows : 8,
minColumns : 10,
maxRows : 8,
maxColumns : 10
});
});
this.btnHighlightColor.on('render:after', function(btn) {
var colorVal = $('<div class="btn-color-value-line"></div>');
$('button:first-child', btn.cmpEl).append(colorVal);
......@@ -1001,68 +779,6 @@ define([
});
});
this.btnInsertChart.on('render:after', function(btn) {
me.mnuInsertChartPicker = new Common.UI.DataView({
el: $('#id-toolbar-menu-insertchart'),
parentMenu: btn.menu,
showLast: false,
restoreHeight: 411,
groups: new Common.UI.DataViewGroupStore([
{ id: 'menu-chart-group-bar', caption: me.textColumn },
{ 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 },
{ id: 'menu-chart-group-scatter', caption: me.textPoint },
{ id: 'menu-chart-group-stock', caption: me.textStock }
]),
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.btnEditHeader.on('render:after', function(btn) {
me.mnuPageNumberPosPicker = new Common.UI.DataView({
el: $('#id-toolbar-menu-pageposition'),
allowScrollbar: false,
store: new Common.UI.DataViewStore([
{ 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} }
]),
itemTemplate: _.template('<div id="<%= id %>" class="item-pagenumber" style="background-position: 0 -<%= offsety %>px"></div>')
})
});
this.cmbFontSize = new Common.UI.ComboBox({
cls: 'input-group-nr',
menuStyle: 'min-width: 55px;',
......@@ -1215,23 +931,6 @@ define([
this.trigger('render:before', this);
var value = Common.localStorage.getItem("de-compact-toolbar");
var valueCompact = (value !== null && parseInt(value) == 1);
value = Common.localStorage.getItem("de-hidden-title");
var valueTitle = (value !== null && parseInt(value) == 1);
value = Common.localStorage.getItem("de-hidden-status");
var valueStatus = (value !== null && parseInt(value) == 1);
value = Common.localStorage.getItem("de-hidden-rulers");
var valueRulers = (value !== null && parseInt(value) == 1);
this.mnuitemCompactToolbar.setChecked(valueCompact, true);
this.mnuitemHideTitleBar.setChecked(valueTitle, true);
this.mnuitemHideStatusBar.setChecked(valueStatus, true);
this.mnuitemHideRulers.setChecked(valueRulers, true);
var top = Common.localStorage.getItem("de-pgmargins-top"),
left = Common.localStorage.getItem("de-pgmargins-left"),
bottom = Common.localStorage.getItem("de-pgmargins-bottom"),
......@@ -1244,6 +943,9 @@ define([
} else
this.btnPageMargins.menu.items[0].setVisible(false);
var value = Common.localStorage.getItem("de-compact-toolbar");
var valueCompact = (mode.isLightVersion || value !== null && parseInt(value) == 1);
me.$el.html(this.template({
isCompactView: valueCompact
}));
......@@ -1251,8 +953,6 @@ define([
me.rendererComponents(valueCompact ? 'short' : 'full');
me.isCompactView = valueCompact;
this.mnuitemCompactToolbar.on('toggle', _.bind(this.changeViewMode, this));
this.trigger('render:after', this);
/** coauthoring begin **/
......@@ -1349,6 +1049,339 @@ define([
this.updateMetricUnit();
}
// set hints
this.btnNewDocument.updateHint(this.tipNewDocument);
this.btnOpenDocument.updateHint(this.tipOpenDocument);
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.btnInsertPageBreak.updateHint(this.tipPageBreak);
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.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);
// 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
}),
this.mnuitemHideTitleBar = new Common.UI.MenuItem({
caption : this.textHideTitleBar,
checkable : true
}),
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()
}),
(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>',
'<button id="id-menu-zoom-in" type="button" style="float:right; margin: 2px 5px 0 0;" class="btn small btn-toolbar"><span class="btn-icon btn-zoomin">&nbsp;</span></button>',
'<label class="zoom">100%</label>',
'<button id="id-menu-zoom-out" type="button" style="float:right; margin-top: 2px;" class="btn small btn-toolbar"><span class="btn-icon btn-zoomout">&nbsp;</span></button>',
'</div>'
].join('')),
stopPropagation: true
}))
]
})
);
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>') }
]
})
);
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>') }
]
})
);
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>') }
]
})
);
this.btnInsertPageBreak.setMenu(new Common.UI.Menu({
items : [
{caption: this.textInsPageBreak},
{caption: this.textInsColumnBreak, value: 'column'},
this.mnuInsertSectionBreak = new Common.UI.MenuItem({
caption: this.textInsSectionBreak,
value: 'section',
menu: new Common.UI.Menu({
menuAlign: 'tl-tr',
items : [
{caption: this.textNextPage, value: Asc.c_oAscSectionBreakType.NextPage},
{caption: this.textContPage, value: Asc.c_oAscSectionBreakType.Continuous},
{caption: this.textEvenPage, value: Asc.c_oAscSectionBreakType.EvenPage},
{caption: this.textOddPage, value: Asc.c_oAscSectionBreakType.OddPage}
]
})
})
]
}));
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.paragraphControls.push(this.mnuPageNumCurrentPos);
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'
});
// 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}}
]),
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} }
]),
itemTemplate: _.template('<div id="<%= id %>" class="item-multilevellist" style="background-position: 0 -<%= offsety %>px;"></div>')
});
_conf && this.mnuMultilevelPicker.selectByIndex(_conf.index, true);
_conf = this.mnuPageNumberPosPicker ? this.mnuPageNumberPosPicker.conf : undefined;
this.mnuPageNumberPosPicker = new Common.UI.DataView({
el: $('#id-toolbar-menu-pageposition'),
allowScrollbar: false,
store: new Common.UI.DataViewStore([
{ 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} }
]),
itemTemplate: _.template('<div id="<%= id %>" class="item-pagenumber" style="background-position: 0 -<%= offsety %>px"></div>')
});
_conf && this.mnuPageNumberPosPicker.setDisabled(_conf.disabled);
this.mnuInsertChartPicker = new Common.UI.DataView({
el: $('#id-toolbar-menu-insertchart'),
parentMenu: this.btnInsertChart.menu,
showLast: false,
restoreHeight: 411,
groups: new Common.UI.DataViewGroupStore([
{ id: 'menu-chart-group-bar', caption: me.textColumn },
{ 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 },
{ id: 'menu-chart-group-scatter', caption: me.textPoint },
{ id: 'menu-chart-group-stock', caption: me.textStock }
]),
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;
var value = Common.localStorage.getItem("de-compact-toolbar");
var valueCompact = (mode.isLightVersion || value !== null && parseInt(value) == 1);
value = Common.localStorage.getItem("de-hidden-title");
var valueTitle = (value !== null && parseInt(value) == 1);
value = Common.localStorage.getItem("de-hidden-status");
var valueStatus = (value !== null && parseInt(value) == 1);
value = Common.localStorage.getItem("de-hidden-rulers");
var valueRulers = (value !== null && parseInt(value) == 1);
this.mnuitemCompactToolbar.setVisible(!mode.isLightVersion);
this.mnuitemCompactToolbar.setChecked(valueCompact, true);
this.mnuitemCompactToolbar.on('toggle', _.bind(this.changeViewMode, this));
this.mnuitemHideTitleBar.setChecked(valueTitle, true);
this.mnuitemHideStatusBar.setChecked(valueStatus, true);
this.mnuitemHideRulers.setChecked(valueRulers, true);
/**/
},
updateMetricUnit: function() {
......@@ -1508,19 +1541,41 @@ define([
});
}
if (this.mnuColorSchema == null) {
this.mnuColorSchema = new Common.UI.Menu({
if (!this.mnuColorSchema) {
this.btnColorSchemas.setMenu(new Common.UI.Menu({
items: [],
maxHeight : 600,
restoreHeight: 600
}).on('render:after', function(mnu) {
}));
this.mnuColorSchema = this.btnColorSchemas.menu;
this.mnuColorSchema.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
});
});
}
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 = Common.Utils.innerHeight(),
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.mnuColorSchema.items = [];
var itemTemplate = _.template([
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7