diff --git a/apps/common/main/lib/view/ListSettingsDialog.js b/apps/common/main/lib/view/ListSettingsDialog.js index 87df71f64..aa77d226c 100644 --- a/apps/common/main/lib/view/ListSettingsDialog.js +++ b/apps/common/main/lib/view/ListSettingsDialog.js @@ -53,8 +53,8 @@ define([ Common.Views.ListSettingsDialog = Common.UI.Window.extend(_.extend({ options: { type: 0, // 0 - markers, 1 - numbers - width: 230, - height: 200, + width: 280, + height: 255, style: 'min-width: 240px;', cls: 'modal-dlg', split: false, @@ -70,28 +70,59 @@ define([ this.template = [ '
', - '
', - '
', + '
', + '', + '', '
', - '
', - '
', + '
', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '
', + '', + '', + '
', + '
', + '
', + '', + '', + '
', + '		', + '', + '
', + '', + '', + '
', + '
', + '', + '', + '
', + '
', '
', - '<% if (type == 0) { %>', - '
', - '', - '', - '
', - '<% } %>', - '<% if (type == 1) { %>', - '
', - '
', - '
', - '<% } %>', '
' ].join(''); this.props = options.props; this.options.tpl = _.template(this.template)(this.options); + this.color = '000000'; Common.UI.Window.prototype.initialize.call(this, this.options); }, @@ -103,10 +134,148 @@ define([ $window = this.getChild(); $window.find('.dlg-btn').on('click', _.bind(this.onBtnClick, this)); + me.btnBullet = new Common.UI.Button({ + el: $('#id-dlg-list-bullet'), + enableToggle: true, + toggleGroup: 'list-type', + allowDepress: false, + pressed: true + }); + me.btnBullet.on('click', _.bind(me.onListTypeClick, me, 0)); + + me.btnNumbering = new Common.UI.Button({ + el: $('#id-dlg-list-numbering'), + enableToggle: true, + toggleGroup: 'list-type', + allowDepress: false + }); + me.btnNumbering.on('click', _.bind(me.onListTypeClick, me, 1)); + + this.cmbNumFormat = new Common.UI.ComboBox({ + el : $('#id-dlg-list-numbering-format'), + menuStyle : 'min-width: 100%;max-height: 183px;', + editable : false, + cls : 'input-group-nr', + data : [ + { displayValue: this.txtNone, value: -1 }, + { displayValue: 'A, B, C,...', value: 4 }, + { displayValue: 'a), b), c),...', value: 6 }, + { displayValue: 'a, b, c,...', value: 6 }, + { displayValue: '1, 2, 3,...', value: 1 }, + { displayValue: '1), 2), 3),...', value: 2 }, + { displayValue: 'I, II, III,...', value: 3 }, + { displayValue: 'i, ii, iii,...', value: 7 } + ] + }); + this.cmbNumFormat.on('selected', _.bind(function (combo, record) { + if (this._changedProps) { + this._changedProps.asc_putListType(1, record.value); + } + }, this)); + this.cmbNumFormat.setValue(1); + + var itemsTemplate = + [ + '<% _.each(items, function(item) { %>', + '
  • ', + '<%= item.displayValue %><% if (item.value === 0) { %><%=item.symbol%><% } %>', + '
    • ', + '<% }); %>' + ]; + var template = [ + '
    ', + '
    ', + '
    ', + '', + '', + '
    ' + ]); + this.cmbBulletFormat = new Common.UI.ComboBoxCustom({ + el : $('#id-dlg-list-bullet-format'), + menuStyle : 'min-width: 100%;max-height: 183px;', + style : "width: 100px;", + editable : false, + template : _.template(template.join('')), + itemsTemplate: _.template(itemsTemplate.join('')), + data : [ + { displayValue: this.txtNone, value: -1 }, + { displayValue: this.txtSymbol + ': ', value: 0, symbol: "•", font: 'Arial' }, + { displayValue: this.txtSymbol + ': ', value: 0, symbol: "o", font: 'Courier New' }, + { displayValue: this.txtSymbol + ': ', value: 0, symbol: "§", font: 'Wingdings' }, + { displayValue: this.txtSymbol + ': ', value: 0, symbol: "v", font: 'Wingdings' }, + { displayValue: this.txtSymbol + ': ', value: 0, symbol: "Ø", font: 'Wingdings' }, + { displayValue: this.txtSymbol + ': ', value: 0, symbol: "ü", font: 'Wingdings' }, + { displayValue: this.txtSymbol + ': ', value: 0, symbol: "w", font: 'Wingdings' }, + { displayValue: this.txtSymbol + ': ', value: 0, symbol: "–", font: 'Arial' }, + { displayValue: this.txtNewBullet, value: 1 } + ], + updateFormControl: function(record) { + var formcontrol = $(this.el).find('.form-control'); + if (record) { + if (record.get('value')==0) + formcontrol[0].innerHTML = record.get('displayValue') + '' + record.get('symbol') + ''; + else + formcontrol[0].innerHTML = record.get('displayValue'); + } else + formcontrol[0].innerHTML = ''; + } + }); + var rec = this.cmbBulletFormat.store.at(1); + this.cmbBulletFormat.selectRecord(rec); + this.bulletProps = {symbol: rec.get('symbol'), font: rec.get('font')}; + this.cmbBulletFormat.on('selected', _.bind(function (combo, record) { + if (this._changedProps) { + if (record.value === 1) { + var me = this, + props = me.bulletProps, + handler = function(dlg, result, settings) { + if (result == 'ok') { + props.changed = true; + props.code = settings.code; + props.font = settings.font; + props.symbol = settings.symbol; + if (me._changedProps) { + me._changedProps.asc_putFont(props.font); + me._changedProps.asc_putSymbol(props.symbol); + } + } + var store = combo.store; + if (!store.findWhere({value: 0, symbol: props.symbol, font: props.font})) + store.add({ displayValue: me.txtSymbol + ': ', value: 0, symbol: props.symbol, font: props.font }, {at: store.length-1}); + combo.setData(store.models); + combo.selectRecord(combo.store.findWhere({value: 0, symbol: props.symbol, font: props.font})); + }, + win = new Common.Views.SymbolTableDialog({ + api: me.options.api, + lang: me.options.interfaceLang, + modal: true, + type: 0, + font: props.font, + symbol: props.symbol, + handler: handler + }); + win.show(); + win.on('symbol:dblclick', handler); + } else if (record.value == -1) { + this._changedProps.asc_putListType(0, record.value); + } else { + this.bulletProps.changed = true; + this.bulletProps.code = record.code; + this.bulletProps.font = record.font; + this.bulletProps.symbol = record.symbol; + if (this._changedProps) { + this._changedProps.asc_putFont(this.bulletProps.font); + this._changedProps.asc_putSymbol(this.bulletProps.symbol); + } + } + } + }, this)); + this.spnSize = new Common.UI.MetricSpinner({ el : $window.find('#id-dlg-list-size'), step : 1, - width : 53, + width : 100, value : 100, defaultUnit : '', maxValue : 400, @@ -114,14 +283,15 @@ define([ allowDecimal: false }).on('change', function(field, newValue, oldValue, eOpts){ if (me._changedProps) { - me._changedProps.asc_putBulletSize(field.getNumberValue()); + me._changedProps.asc_putSize(field.getNumberValue()); } }); this.btnColor = new Common.UI.ColorButton({ parentEl: $window.find('#id-dlg-list-color'), - style: "width:53px;", - additionalAlign: this.menuAddAlign + style: "width:45px;", + additionalAlign: this.menuAddAlign, + color: this.color }); this.btnColor.on('color:select', _.bind(this.onColorsSelect, this)); this.colors = this.btnColor.getPicker(); @@ -129,7 +299,7 @@ define([ this.spnStart = new Common.UI.MetricSpinner({ el : $window.find('#id-dlg-list-start'), step : 1, - width : 53, + width : 100, value : 1, defaultUnit : '', maxValue : 32767, @@ -137,16 +307,14 @@ define([ allowDecimal: false }).on('change', function(field, newValue, oldValue, eOpts){ if (me._changedProps) { - me._changedProps.put_NumStartAt(field.getNumberValue()); + me._changedProps.asc_putNumStartAt(field.getNumberValue()); } }); - this.btnEdit = new Common.UI.Button({ - el: $window.find('#id-dlg-list-edit'), - hint: this.tipChange - }); - this.btnEdit.on('click', _.bind(this.onEditBullet, this)); - this.btnEdit.cmpEl.css({'font-size': '16px', 'line-height': '16px'}); + me.numberingControls = $window.find('.numbering'); + + var el = $window.find('table tr:first() td:first()'); + el.width(Math.max($window.find('.numbering .text').width(), el.width())); this.afterRender(); }, @@ -161,43 +329,46 @@ define([ }, onColorsSelect: function(btn, color) { + this.color = color; if (this._changedProps) { - this._changedProps.asc_putBulletColor(Common.Utils.ThemeColor.getRgbColor(color)); + this._changedProps.asc_putColor(Common.Utils.ThemeColor.getRgbColor(color)); } }, - onEditBullet: function() { - var me = this, - props = me.bulletProps, - handler = function(dlg, result, settings) { - if (result == 'ok') { - props.changed = true; - props.code = settings.code; - props.font = settings.font; - props.symbol = settings.symbol; - props.font && me.btnEdit.cmpEl.css('font-family', props.font); - settings.symbol && me.btnEdit.setCaption(settings.symbol); - if (me._changedProps) { - me._changedProps.asc_putBulletFont(props.font); - me._changedProps.asc_putBulletSymbol(props.symbol); - } - } - }, - win = new Common.Views.SymbolTableDialog({ - api: me.options.api, - lang: me.options.interfaceLang, - modal: true, - type: 0, - font: props.font, - symbol: props.symbol, - handler: handler - }); - win.show(); - win.on('symbol:dblclick', handler); + onListTypeClick: function(type, btn, event) { + this.ShowHideElem(type); + }, + + ShowHideElem: function(value) { + this.numberingControls.toggleClass('hidden', value==0); + this.cmbNumFormat.setVisible(value==1); + this.cmbBulletFormat.setVisible(value==0); }, _handleInput: function(state) { - if (this.options.handler) { + if (this.options.handler) + { + var type = this.btnBullet.pressed ? 0 : 1; + if (this.originalType == AscFormat.BULLET_TYPE_BULLET_NONE) { + this._changedProps = new Asc.asc_CBullet(); + this._changedProps.asc_putColor(Common.Utils.ThemeColor.getRgbColor(this.color)); + this._changedProps.asc_putSize(this.spnSize.getNumberValue()); + } + + if (this.originalType == AscFormat.BULLET_TYPE_BULLET_NONE || + this.originalType == AscFormat.BULLET_TYPE_BULLET_CHAR && type==1 || this.originalType == AscFormat.BULLET_TYPE_BULLET_AUTONUM && type==0) { // changed list type + if (type==0) {//markers + if (this.cmbBulletFormat.getValue()==-1) { + this._changedProps.asc_putListType(0, -1); + } else { + this._changedProps.asc_putFont(this.bulletProps.font); + this._changedProps.asc_putSymbol(this.bulletProps.symbol); + } + } else { + this._changedProps.asc_putListType(1, this.cmbNumFormat.getValue()); + this._changedProps.asc_putNumStartAt(this.spnStart.getNumberValue()); + } + } this.options.handler.call(this, state, this._changedProps); } this.close(); @@ -214,40 +385,73 @@ define([ _setDefaults: function (props) { if (props) { - this.spnSize.setValue(props.asc_getBulletSize() || '', true); - var value = props.get_NumStartAt(); - this.spnStart.setValue(value || '', true); - this.spnStart.setDisabled(value===null); - var color = props.asc_getBulletColor(); - if (color) { - if (color.get_type() == Asc.c_oAscColor.COLOR_TYPE_SCHEME) { - color = {color: Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b()), effectValue: color.get_value()}; - } else { - color = Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b()); - } - } else - color = 'transparent'; - this.btnColor.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.colors.select(color,true); - isselected = true; - break; - } - } - if (!isselected) this.colors.clearSelection(); - } else - this.colors.select(color,true); + var type = 0; + var bullet = props.asc_getBullet(); + if (bullet) { + this.originalType = bullet.asc_getType(); - if (this.type==0) { - this.bulletProps = {symbol: props.asc_getBulletSymbol(), font: props.asc_getBulletFont()}; - this.bulletProps.font && this.btnEdit.cmpEl.css('font-family', this.bulletProps.font); - this.bulletProps.symbol && this.btnEdit.setCaption(this.bulletProps.symbol); + this.spnSize.setValue(bullet.asc_getSize() || '', true); + + var color = bullet.asc_getColor(); + if (color) { + if (color.get_type() == Asc.c_oAscColor.COLOR_TYPE_SCHEME) { + color = {color: Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b()), effectValue: color.get_value()}; + } else { + color = Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b()); + } + } else + color = 'transparent'; + this.color = Common.Utils.ThemeColor.colorValue2EffectId(color); + this.btnColor.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.colors.select(color,true); + isselected = true; + break; + } + } + if (!isselected) this.colors.clearSelection(); + } else + this.colors.select(color,true); + + if (this.originalType == AscFormat.BULLET_TYPE_BULLET_NONE) { + this.cmbNumFormat.setValue(-1); + this.cmbBulletFormat.setValue(-1); + type = this.type; + } else if (this.originalType == AscFormat.BULLET_TYPE_BULLET_CHAR) { + var symbol = bullet.asc_getSymbol(); + if (symbol) { + this.bulletProps = {symbol: symbol, font: bullet.asc_getFont()}; + if (!this.cmbBulletFormat.store.findWhere({value: 0, symbol: this.bulletProps.symbol, font: this.bulletProps.font})) + this.cmbBulletFormat.store.add({ displayValue: this.txtSymbol + ': ', value: 0, symbol: this.bulletProps.symbol, font: this.bulletProps.font }, {at: this.cmbBulletFormat.store.length-1}); + this.cmbBulletFormat.setData(this.cmbBulletFormat.store.models); + this.cmbBulletFormat.selectRecord(this.cmbBulletFormat.store.findWhere({value: 0, symbol: this.bulletProps.symbol, font: this.bulletProps.font})); + } else + this.cmbBulletFormat.setValue(''); + this._changedProps = bullet; + type = 0; + } else if (this.originalType == AscFormat.BULLET_TYPE_BULLET_AUTONUM) { + var autonum = bullet.asc_getAutoNumType(); + this.cmbNumFormat.setValue(autonum, ''); + + var value = bullet.asc_getNumStartAt(); + this.spnStart.setValue(value || '', true); + this.spnStart.setDisabled(value===null); + this._changedProps = bullet; + type = 1; + } + } else {// different bullet types + this.cmbNumFormat.setValue(-1); + this.cmbBulletFormat.setValue(-1); + this._changedProps = new Asc.asc_CBullet(); + type = this.type; } } - this._changedProps = new Asc.asc_CParagraphProperty(); + + (type == 1) ? this.btnNumbering.toggle(true) : this.btnBullet.toggle(true); + this.ShowHideElem(type); }, txtTitle: 'List Settings', @@ -256,6 +460,12 @@ define([ txtOfText: '% of text', txtStart: 'Start at', txtBullet: 'Bullet', - tipChange: 'Change bullet' + tipChange: 'Change bullet', + textBulleted: 'Bulleted', + textNumbering: 'Numbered', + txtType: 'Type', + txtNone: 'None', + txtNewBullet: 'New bullet', + txtSymbol: 'Symbol' }, Common.Views.ListSettingsDialog || {})) }); \ No newline at end of file diff --git a/apps/presentationeditor/main/app/controller/Toolbar.js b/apps/presentationeditor/main/app/controller/Toolbar.js index b56dedc45..eff06972e 100644 --- a/apps/presentationeditor/main/app/controller/Toolbar.js +++ b/apps/presentationeditor/main/app/controller/Toolbar.js @@ -486,7 +486,6 @@ define([ this.toolbar.mnuMarkersPicker.selectByIndex(this._state.bullets.subtype, true); else this.toolbar.mnuMarkersPicker.deselectAll(true); - this.toolbar.mnuMarkerSettings && this.toolbar.mnuMarkerSettings.setDisabled(this._state.bullets.subtype<0); break; case 1: var idx = 0; @@ -515,7 +514,6 @@ define([ } this.toolbar.btnNumbers.toggle(true, true); this.toolbar.mnuNumbersPicker.selectByIndex(idx, true); - this.toolbar.mnuNumberSettings && this.toolbar.mnuNumberSettings.setDisabled(idx==0); break; } } @@ -1140,7 +1138,8 @@ define([ handler: function(result, value) { if (result == 'ok') { if (me.api) { - me.api.paraApply(value); + props.asc_putBullet(value); + me.api.paraApply(props); } } Common.NotificationCenter.trigger('edit:complete', me.toolbar); @@ -1709,8 +1708,6 @@ define([ this.toolbar.mnuMarkersPicker.selectByIndex(0, true); this.toolbar.mnuNumbersPicker.selectByIndex(0, true); - this.toolbar.mnuMarkerSettings && this.toolbar.mnuMarkerSettings.setDisabled(true); - this.toolbar.mnuNumberSettings && this.toolbar.mnuNumberSettings.setDisabled(true); }, _getApiTextSize: function () { diff --git a/apps/presentationeditor/main/app/view/Toolbar.js b/apps/presentationeditor/main/app/view/Toolbar.js index 4537f48c0..e3b673fbe 100644 --- a/apps/presentationeditor/main/app/view/Toolbar.js +++ b/apps/presentationeditor/main/app/view/Toolbar.js @@ -1111,7 +1111,6 @@ define([ {template: _.template('')}, this.mnuMarkerSettings = new Common.UI.MenuItem({ caption: this.textListSettings, - disabled: (this.mnuMarkersPicker.conf.index || 0)==0, value: 'settings' }) ] @@ -1124,7 +1123,6 @@ define([ {template: _.template('')}, this.mnuNumberSettings = new Common.UI.MenuItem({ caption: this.textListSettings, - disabled: (this.mnuNumbersPicker.conf.index || 0)==0, value: 'settings' }) ] diff --git a/apps/spreadsheeteditor/main/app/controller/DocumentHolder.js b/apps/spreadsheeteditor/main/app/controller/DocumentHolder.js index e35085aae..03743a1a8 100644 --- a/apps/spreadsheeteditor/main/app/controller/DocumentHolder.js +++ b/apps/spreadsheeteditor/main/app/controller/DocumentHolder.js @@ -759,7 +759,7 @@ define([ onSelectBulletMenu: function(menu, item) { if (this.api) { if (item.options.value == -1) { - this.api.asc_setListType(item.options.value); + this.api.asc_setListType(0, item.options.value); Common.NotificationCenter.trigger('edit:complete', this.documentHolder); Common.component.Analytics.trackEvent('DocumentHolder', 'List Type'); } else if (item.options.value == 'settings') { @@ -773,15 +773,17 @@ define([ } } if (props) { + var listtype = me.api.asc_getCurrentListType(); (new Common.Views.ListSettingsDialog({ api: me.api, props: props, - type: me.api.asc_getCurrentListType().get_ListType(), + type: 0, interfaceLang: me.permissions.lang, handler: function(result, value) { if (result == 'ok') { if (me.api) { - me.api.asc_setGraphicObjectProps(value); + props.asc_putBullet(value); + me.api.asc_setGraphicObjectProps(props); } } Common.NotificationCenter.trigger('edit:complete', me.documentHolder); @@ -1783,7 +1785,7 @@ define([ documentHolder.menuParagraphDirect270.setChecked(direct == Asc.c_oAscVertDrawingText.vert270); documentHolder.menuParagraphBulletNone.setChecked(listtype.get_ListType() == -1); - documentHolder.mnuListSettings.setDisabled(listtype.get_ListType() == -1); + // documentHolder.mnuListSettings.setDisabled(listtype.get_ListType() == -1); var rec = documentHolder.paraBulletsPicker.store.findWhere({ type: listtype.get_ListType(), subtype: listtype.get_ListSubType() }); documentHolder.paraBulletsPicker.selectRecord(rec, true); } else if (elType == Asc.c_oAscTypeSelectElement.Paragraph) {