Refactoring color palette (fix width, bugs 33599, 33600
This commit is contained in:
parent
4f85426deb
commit
736af63c30
|
@ -98,7 +98,7 @@ define([
|
||||||
cls: 'shifted-left',
|
cls: 'shifted-left',
|
||||||
additionalAlign: options.additionalAlign,
|
additionalAlign: options.additionalAlign,
|
||||||
items: (options.additionalItems ? options.additionalItems : []).concat(auto).concat([
|
items: (options.additionalItems ? options.additionalItems : []).concat(auto).concat([
|
||||||
{ template: _.template('<div id="' + id + '-color-menu" style="width: 169px; height:' + height + '; margin: 10px;display: inline-block;"></div>') },
|
{ template: _.template('<div id="' + id + '-color-menu" style="width: 164px; height:' + height + '; display: inline-block;"></div>') },
|
||||||
{caption: '--'},
|
{caption: '--'},
|
||||||
{
|
{
|
||||||
id: id + '-color-new',
|
id: id + '-color-new',
|
||||||
|
|
|
@ -52,6 +52,7 @@ define([
|
||||||
dynamiccolors: 10,
|
dynamiccolors: 10,
|
||||||
standardcolors: 10,
|
standardcolors: 10,
|
||||||
themecolors: 10,
|
themecolors: 10,
|
||||||
|
columns: 10,
|
||||||
effects: 5,
|
effects: 5,
|
||||||
allowReselect: true,
|
allowReselect: true,
|
||||||
transparent: false,
|
transparent: false,
|
||||||
|
@ -62,7 +63,7 @@ define([
|
||||||
|
|
||||||
template :
|
template :
|
||||||
_.template(
|
_.template(
|
||||||
'<div style="padding: 4px 12px 12px;">' +
|
'<div style="padding: 4px 0 0 12px;">' +
|
||||||
'<% var me = this; var idx = 0; %>' +
|
'<% var me = this; var idx = 0; %>' +
|
||||||
'<% $(colors).each(function(num, item) { %>' +
|
'<% $(colors).each(function(num, item) { %>' +
|
||||||
'<% if (me.isBlankSeparator(item)) { %> <div class="palette-color-spacer" style="width:100%;height:8px;float:left;"></div>' +
|
'<% if (me.isBlankSeparator(item)) { %> <div class="palette-color-spacer" style="width:100%;height:8px;float:left;"></div>' +
|
||||||
|
@ -76,6 +77,9 @@ define([
|
||||||
'<em><span unselectable="on"> </span></em>' +
|
'<em><span unselectable="on"> </span></em>' +
|
||||||
'</a>' +
|
'</a>' +
|
||||||
'<% } else if (me.isEffect(item)) { %>' +
|
'<% } else if (me.isEffect(item)) { %>' +
|
||||||
|
'<% if (idx>0 && me.columns>0 && idx%me.columns===0) { %> ' +
|
||||||
|
'<div style="width:100%;height:0;float:left;"></div>' +
|
||||||
|
'<% } %>' +
|
||||||
'<a effectid="<%=item.effectId%>" effectvalue="<%=item.effectValue%>" class="palette-color-effect color-<%=item.color%>" style="background:#<%=item.color%>" idx="<%=idx++%>">' +
|
'<a effectid="<%=item.effectId%>" effectvalue="<%=item.effectValue%>" class="palette-color-effect color-<%=item.color%>" style="background:#<%=item.color%>" idx="<%=idx++%>">' +
|
||||||
'<em><span style="background:#<%=item.color%>;" unselectable="on"> </span></em>' +
|
'<em><span style="background:#<%=item.color%>;" unselectable="on"> </span></em>' +
|
||||||
'</a>' +
|
'</a>' +
|
||||||
|
@ -85,7 +89,7 @@ define([
|
||||||
'<% }); %>' +
|
'<% }); %>' +
|
||||||
'</div>' +
|
'</div>' +
|
||||||
'<% if (me.options.dynamiccolors!==undefined) { %>' +
|
'<% if (me.options.dynamiccolors!==undefined) { %>' +
|
||||||
'<div style="padding: 12px;">' +
|
'<div style="padding: 4px 0 0 12px">' +
|
||||||
'<div class="palette-color-spacer" style="width:100%;height:8px;float:left;"></div>' +
|
'<div class="palette-color-spacer" style="width:100%;height:8px;float:left;"></div>' +
|
||||||
'<div class="palette-color-caption" style="width:100%;float:left;font-size: 11px;"><%=me.textRecentColors%></div>' +
|
'<div class="palette-color-caption" style="width:100%;float:left;font-size: 11px;"><%=me.textRecentColors%></div>' +
|
||||||
'<% for (var i=0; i<me.options.dynamiccolors; i++) { %>' +
|
'<% for (var i=0; i<me.options.dynamiccolors; i++) { %>' +
|
||||||
|
@ -105,6 +109,7 @@ define([
|
||||||
el = me.$el || $(this.el);
|
el = me.$el || $(this.el);
|
||||||
|
|
||||||
this.colors = me.options.colors || this.generateColorData(me.options.themecolors, me.options.effects, me.options.standardcolors, me.options.transparent);
|
this.colors = me.options.colors || this.generateColorData(me.options.themecolors, me.options.effects, me.options.standardcolors, me.options.transparent);
|
||||||
|
this.columns = me.options.columns || 0;
|
||||||
this.enableKeyEvents= me.options.enableKeyEvents;
|
this.enableKeyEvents= me.options.enableKeyEvents;
|
||||||
this.tabindex = me.options.tabindex || 0;
|
this.tabindex = me.options.tabindex || 0;
|
||||||
this.outerMenu = me.options.outerMenu;
|
this.outerMenu = me.options.outerMenu;
|
||||||
|
|
|
@ -898,7 +898,7 @@ define([
|
||||||
checkable: true
|
checkable: true
|
||||||
}),
|
}),
|
||||||
{caption: '--'},
|
{caption: '--'},
|
||||||
{template: _.template('<div id="id-toolbar-menu-controls-color" style="width: 169px; margin: 10px;display: inline-block;"></div>')},
|
{template: _.template('<div id="id-toolbar-menu-controls-color" style="width: 164px; display: inline-block;"></div>')},
|
||||||
{caption: '--'},
|
{caption: '--'},
|
||||||
{
|
{
|
||||||
id: 'id-toolbar-menu-new-control-color',
|
id: 'id-toolbar-menu-new-control-color',
|
||||||
|
|
|
@ -531,7 +531,7 @@ define([ 'text!spreadsheeteditor/main/app/template/FormatRulesEditDlg.template',
|
||||||
menu : new Common.UI.Menu({
|
menu : new Common.UI.Menu({
|
||||||
menuAlign : 'tl-tr',
|
menuAlign : 'tl-tr',
|
||||||
items : [
|
items : [
|
||||||
{ template: _.template('<div id="format-rules-borders-menu-bordercolor" style="width: 169px; margin: 10px;display: inline-block;"></div>'), stopPropagation: true },
|
{ template: _.template('<div id="format-rules-borders-menu-bordercolor" style="width: 164px; display: inline-block;"></div>'), stopPropagation: true },
|
||||||
{caption: '--'},
|
{caption: '--'},
|
||||||
{ template: _.template('<a id="format-rules-borders-menu-new-bordercolor" style="padding-left:12px;">' + this.textNewColor + '</a>'), stopPropagation: true }
|
{ template: _.template('<a id="format-rules-borders-menu-new-bordercolor" style="padding-left:12px;">' + this.textNewColor + '</a>'), stopPropagation: true }
|
||||||
]
|
]
|
||||||
|
|
|
@ -335,7 +335,7 @@ define([
|
||||||
menuAlign: 'tl-tr',
|
menuAlign: 'tl-tr',
|
||||||
cls: 'color-tab',
|
cls: 'color-tab',
|
||||||
items: [
|
items: [
|
||||||
{ template: _.template('<div id="id-tab-menu-color" style="width: 169px;display: inline-block;"></div>') },
|
{ template: _.template('<div id="id-tab-menu-color" style="width: 164px;display: inline-block;"></div>') },
|
||||||
{caption: '--'},
|
{caption: '--'},
|
||||||
{ template: _.template('<a id="id-tab-menu-new-color" style="padding-left:12px;">' + me.textNewColor + '</a>') }
|
{ template: _.template('<a id="id-tab-menu-new-color" style="padding-left:12px;">' + me.textNewColor + '</a>') }
|
||||||
]
|
]
|
||||||
|
|
|
@ -2120,7 +2120,7 @@ define([
|
||||||
stopPropagation: true
|
stopPropagation: true
|
||||||
},
|
},
|
||||||
{caption: '--'},
|
{caption: '--'},
|
||||||
{ template: _.template('<div id="id-toolbar-menu-bordercolor" style="width: 169px;display: inline-block;"></div>'), stopPropagation: true },
|
{ template: _.template('<div id="id-toolbar-menu-bordercolor" style="width: 164px;display: inline-block;"></div>'), stopPropagation: true },
|
||||||
{caption: '--'},
|
{caption: '--'},
|
||||||
{ template: _.template('<a id="id-toolbar-menu-new-bordercolor" style="padding-left:12px;">' + this.textNewColor + '</a>'), stopPropagation: true }
|
{ template: _.template('<a id="id-toolbar-menu-new-bordercolor" style="padding-left:12px;">' + this.textNewColor + '</a>'), stopPropagation: true }
|
||||||
]
|
]
|
||||||
|
|
Loading…
Reference in a new issue