Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

[DE] Delay rendering controls on the right panel.

Browse source
This commit is contained in:
Julia Radzhabova 2016-08-17 12:55:21 +03:00
parent 252ef52606
commit 2291189235
4 changed files with 119 additions and 112 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
apps/documenteditor/main/app/view/ChartSettings.js
View file

@ -83,6 +83,9 @@ define([
this._originalProps = null;
this.render();
this.labelWidth = $(this.el).find('#chart-label-width');
this.labelHeight = $(this.el).find('#chart-label-height');
},
render: function () {
@ -291,9 +294,6 @@ define([
this.mnuChartTypePicker.on('item:click', _.bind(this.onSelectType, this, this.btnChartType));
this.lockedControls.push(this.btnChartType);
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')
});

128
apps/documenteditor/main/app/view/HeaderFooterSettings.js
View file

@ -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) {

62
apps/documenteditor/main/app/view/ImageSettings.js
View file

@ -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');
},
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();
$(this.el).on('click', '#image-advanced-link', _.bind(this.openAdvancedSettings, this));
},
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) {

31
apps/documenteditor/main/app/view/ParagraphSettings.js
View file

@ -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>') }
]
})
menu : true
});
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));
});
this.btnColor.render( $('#paragraph-color-btn'));
this.lockedControls.push(this.btnColor);
@ -456,7 +441,19 @@ define([
},
UpdateThemeColors: function() {
if (this.mnuColorPicker)
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());
},