' +
+ //
+ // DataView and pickers
+ //
+
+ this.btnHighlightColor.on('render:after', function (btn) {
+ var colorVal = $('
');
+ $('button:first-child', btn.cmpEl).append(colorVal);
+ btn.currentColor = 'FFFF00';
+ colorVal.css('background-color', '#' + btn.currentColor);
+
+ me.mnuHighlightColorPicker = new Common.UI.ColorPalette({
+ el: $('#id-toolbar-menu-highlight'),
+ value: 'FFFF00',
+ colors: [
+ 'FFFF00', '00FF00', '00FFFF', 'FF00FF', '0000FF', 'FF0000', '00008B', '008B8B',
+ '006400', '800080', '8B0000', '808000', 'FFFFFF', 'D3D3D3', 'A9A9A9', '000000'
+ ]
+ });
+
+ me.mnuHighlightColorPicker.select('FFFF00');
+ });
+
+ this.btnFontColor.on('render:after', function (btn) {
+ var colorVal = $('
');
+ $('button:first-child', btn.cmpEl).append(colorVal);
+ colorVal.css('background-color', btn.currentColor || 'transparent');
+
+ me.mnuFontColorPicker = new Common.UI.ThemeColorPalette({
+ el: $('#id-toolbar-menu-fontcolor')
+ });
+ });
+
+ this.btnParagraphColor.on('render:after', function (btn) {
+ var colorVal = $('
');
+ $('button:first-child', btn.cmpEl).append(colorVal);
+ colorVal.css('background-color', btn.currentColor || 'transparent');
+
+ me.mnuParagraphColorPicker = new Common.UI.ThemeColorPalette({
+ el: $('#id-toolbar-menu-paracolor'),
+ transparent: true
+ });
+ });
+
+ this.cmbFontSize = new Common.UI.ComboBox({
+ cls: 'input-group-nr',
+ menuStyle: 'min-width: 55px;',
+ hint: this.tipFontSize,
+ data: [
+ {value: 8, displayValue: "8"},
+ {value: 9, displayValue: "9"},
+ {value: 10, displayValue: "10"},
+ {value: 11, displayValue: "11"},
+ {value: 12, displayValue: "12"},
+ {value: 14, displayValue: "14"},
+ {value: 16, displayValue: "16"},
+ {value: 18, displayValue: "18"},
+ {value: 20, displayValue: "20"},
+ {value: 22, displayValue: "22"},
+ {value: 24, displayValue: "24"},
+ {value: 26, displayValue: "26"},
+ {value: 28, displayValue: "28"},
+ {value: 36, displayValue: "36"},
+ {value: 48, displayValue: "48"},
+ {value: 72, displayValue: "72"}
+ ]
+ });
+ this.paragraphControls.push(this.cmbFontSize);
+
+ this.cmbFontName = new Common.UI.ComboBoxFonts({
+ cls: 'input-group-nr',
+ menuCls: 'scrollable-menu',
+ menuStyle: 'min-width: 325px;',
+ hint: this.tipFontName,
+ store: new Common.Collections.Fonts()
+ });
+ this.paragraphControls.push(this.cmbFontName);
+
+ this.listStylesAdditionalMenuItem = new Common.UI.MenuItem({
+ template: _.template(
+ '
' +
'' +
'' +
- '
')
- });
-
- this.listStyles = new Common.UI.ComboDataView({
- cls : 'combo-styles',
- itemWidth : 104,
- itemHeight : 38,
-// hint : this.tipParagraphStyle,
- enableKeyEvents: true,
- additionalMenuItems: [this.listStylesAdditionalMenuItem],
- beforeOpenHandler: function(e) {
- var cmp = this,
- menu = cmp.openButton.menu,
- minMenuColumn = 6;
-
- if (menu.cmpEl) {
- var itemEl = $(cmp.cmpEl.find('.dataview.inner .style').get(0)).parent();
- var itemMargin = /*parseInt($(itemEl.get(0)).parent().css('margin-right'))*/-1;
- var itemWidth = itemEl.is(':visible') ? parseInt(itemEl.css('width')) :
- (cmp.itemWidth + parseInt(itemEl.css('padding-left')) + parseInt(itemEl.css('padding-right')) +
- parseInt(itemEl.css('border-left-width')) + parseInt(itemEl.css('border-right-width')));
-
- var minCount = cmp.menuPicker.store.length >= minMenuColumn ? minMenuColumn : cmp.menuPicker.store.length,
- columnCount = Math.min(cmp.menuPicker.store.length, Math.round($('.dataview', $(cmp.fieldPicker.el)).width() / (itemMargin + itemWidth) + 0.5));
-
- columnCount = columnCount < minCount ? minCount : columnCount;
- menu.menuAlignEl = cmp.cmpEl;
-
- menu.menuAlign = 'tl-tl';
- var offset = cmp.cmpEl.width() - cmp.openButton.$el.width() - columnCount * (itemMargin + itemWidth) - 1;
- menu.setOffset(Math.min(offset, 0));
-
- menu.cmpEl.css({
- 'width' : columnCount * (itemWidth + itemMargin),
- 'min-height': cmp.cmpEl.height()
- });
- }
-
- if (cmp.menuPicker.scroller) {
- cmp.menuPicker.scroller.update({
- includePadding: true,
- suppressScrollX: true
- });
- }
-
- cmp.removeTips();
- }
- });
-
- this.listStyles.fieldPicker.itemTemplate = _.template([
- '
'
- ].join(''));
- this.listStyles.menuPicker.itemTemplate = _.template([
- '
'
- ].join(''));
- this.paragraphControls.push(this.listStyles);
- this.textOnlyControls.push(this.listStyles);
-
- // Disable all components before load document
- _.each(this.toolbarControls.concat(this.paragraphControls), function(cmp) {
- if (_.isFunction(cmp.setDisabled))
- cmp.setDisabled(true);
- });
- this.btnMailRecepients.setDisabled(true);
-
- var editStyleMenuUpdate = new Common.UI.MenuItem({
- caption : me.textStyleMenuUpdate
- }).on('click', _.bind(me.onStyleMenuUpdate, me));
-
- var editStyleMenuRestore = new Common.UI.MenuItem({
- caption : me.textStyleMenuDelete
- }).on('click', _.bind(me.onStyleMenuDelete, me));
-
- var editStyleMenuDelete = new Common.UI.MenuItem({
- caption : me.textStyleMenuRestore
- }).on('click', _.bind(me.onStyleMenuDelete, me));
-
- var editStyleMenuRestoreAll = new Common.UI.MenuItem({
- caption : me.textStyleMenuRestoreAll
- }).on('click', _.bind(me.onStyleMenuRestoreAll, me));
-
- var editStyleMenuDeleteAll = new Common.UI.MenuItem({
- caption : me.textStyleMenuDeleteAll
- }).on('click', _.bind(me.onStyleMenuDeleteAll, me));
-
- if (this.styleMenu == null) {
- this.styleMenu = new Common.UI.Menu({
- items: [
- editStyleMenuUpdate,
- editStyleMenuRestore,
- editStyleMenuDelete,
- editStyleMenuRestoreAll,
- editStyleMenuDeleteAll
- ]
+ '