From 41e13887387f014be89491128188f8821f162eda Mon Sep 17 00:00:00 2001 From: zsmj Date: Thu, 15 Dec 2022 17:19:00 +0800 Subject: [PATCH] =?UTF-8?q?=E6=97=A0JRIA=20fix:=20=E5=86=8D=E6=A3=80?= =?UTF-8?q?=E6=9F=A5=E4=B8=80=E9=81=8D=E8=BE=93=E5=85=A5=E6=A1=86=E5=9C=86?= =?UTF-8?q?=E8=A7=92=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../colorpicker/button/button.colorshow.js | 38 +-- .../colorpicker/editor.colorpicker.hex.js | 274 +++++++++--------- .../editor.colorpicker.hex.simple.js | 170 +++++------ .../colorpicker/editor.colorpicker.js | 96 +++--- .../colorpicker/editor.colorpicker.simple.js | 64 ++-- 5 files changed, 337 insertions(+), 305 deletions(-) diff --git a/src/case/colorchooser/colorpicker/button/button.colorshow.js b/src/case/colorchooser/colorpicker/button/button.colorshow.js index 740a5d0a7..c9b2da438 100644 --- a/src/case/colorchooser/colorpicker/button/button.colorshow.js +++ b/src/case/colorchooser/colorpicker/button/button.colorshow.js @@ -6,30 +6,32 @@ BI.ColorChooserShowButton = BI.inherit(BI.BasicButton, { props: { - baseCls: 'bi-color-chooser-show-button bi-border bi-list-item-effect', + baseCls: 'bi-color-chooser-show-button bi-border bi-list-item-effect bi-border-radius', }, render: function () { var self = this, o = this.options; return { type: 'bi.htape', - items: [{ - el: { - type: "bi.icon_label", - ref: function (_ref) { - self.icon = _ref; + items: [ + { + el: { + type: "bi.icon_label", + ref: function (_ref) { + self.icon = _ref; + }, + iconWidth: 16, + iconHeight: 16, }, - iconWidth: 16, - iconHeight: 16, - }, - hgap: 20, - width: 16, - }, { - type: 'bi.label', - textAlign: 'left', - text: o.text, - }] - } + hgap: 20, + width: 16, + }, { + type: 'bi.label', + textAlign: 'left', + text: o.text, + } + ] + }; }, doClick: function () { @@ -40,4 +42,4 @@ BI.ColorChooserShowButton = BI.inherit(BI.BasicButton, { }, }); BI.ColorChooserShowButton.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.color_picker_show_button", BI.ColorChooserShowButton); \ No newline at end of file +BI.shortcut("bi.color_picker_show_button", BI.ColorChooserShowButton); diff --git a/src/case/colorchooser/colorpicker/editor.colorpicker.hex.js b/src/case/colorchooser/colorpicker/editor.colorpicker.hex.js index d2be8a8f9..22c66a250 100644 --- a/src/case/colorchooser/colorpicker/editor.colorpicker.hex.js +++ b/src/case/colorchooser/colorpicker/editor.colorpicker.hex.js @@ -21,7 +21,7 @@ BI.HexColorPickerEditor = BI.inherit(BI.Widget, { render: function () { var self = this, o = this.options, c = this.constants; this.storeValue = {}; - var RGB = BI.createItems([{text: "R"}, {text: "G"}, {text: "B"}], { + var RGB = BI.createItems([{ text: "R" }, { text: "G" }, { text: "B" }], { type: "bi.label", cls: "color-picker-editor-label", height: 20 @@ -33,146 +33,162 @@ BI.HexColorPickerEditor = BI.inherit(BI.Widget, { var Ws = BI.map(BI.range(0, 3), function () { return { type: "bi.small_text_editor", - cls: "color-picker-editor-input", + cls: "color-picker-editor-input bi-border-radius", validationChecker: checker, errorText: BI.i18nText("BI-Color_Picker_Error_Text"), allowBlank: true, value: 255, width: c.RGB_WIDTH, height: 24, - listeners: [{ - eventName: BI.TextEditor.EVENT_CHANGE, - action: function () { - self._checkEditors(); - if (checker(self.storeValue.r) && checker(self.storeValue.g) && checker(self.storeValue.b)) { - self.colorShow.element.css("background-color", self.getValue()); - self.fireEvent(BI.ColorPickerEditor.EVENT_CHANGE); + listeners: [ + { + eventName: BI.TextEditor.EVENT_CHANGE, + action: function () { + self._checkEditors(); + if (checker(self.storeValue.r) && checker(self.storeValue.g) && checker(self.storeValue.b)) { + self.colorShow.element.css("background-color", self.getValue()); + self.fireEvent(BI.ColorPickerEditor.EVENT_CHANGE); + } } } - }] + ] }; }); return { type: "bi.absolute", - items: [{ - el: { - type: "bi.vertical", - tgap: 10, - items: [{ - type: 'bi.vertical_adapt', - columnSize: ["fill", 'fill'], - height: 24, - items: [{ - type: "bi.color_picker_show_button", - cls: "trans-color-icon", - height: 22, - title: BI.i18nText("BI-Transparent_Color"), - text: BI.i18nText("BI-Transparent_Color"), - listeners: [{ - eventName: BI.ColorChooserShowButton.EVENT_CHANGE, - action: function () { - self.setValue("transparent"); - self.fireEvent(BI.ColorPickerEditor.EVENT_CHANGE); - } - }], - ref: function (_ref) { - self.transparent = _ref; - } - }, { - el: { - type: "bi.color_picker_show_button", - cls: "auto-color-icon", - height: 22, - title: BI.i18nText("BI-Basic_Auto"), - text: BI.i18nText("BI-Basic_Auto"), - listeners: [{ - eventName: BI.ColorChooserShowButton.EVENT_CHANGE, - action: function () { - self.setValue(""); - self.fireEvent(BI.ColorPickerEditor.EVENT_CHANGE); - } - }], - ref: function (_ref) { - self.none = _ref; - } - }, - lgap: 10, - }] - }, { - el: { - type: "bi.vertical_adapt", - columnSize: [22, 10, 'fill', 12, c.RGB_WIDTH, 12, c.RGB_WIDTH, 12, c.RGB_WIDTH], - - rgap: 5, - items: [{ - el: { - type: "bi.layout", - cls: "color-picker-editor-display bi-card bi-border", - height: 22, - width: 22, - ref: function (_ref) { - self.colorShow = _ref; - } - }, - width: 18 - }, { - type: "bi.label", - text: "#", - width: 10 - }, { - type: "bi.small_text_editor", - ref: function (_ref) { - self.hexEditor = _ref; - }, - cls: "color-picker-editor-input", - validationChecker: this._hexChecker, - allowBlank: true, - errorText: BI.i18nText("BI-Color_Picker_Error_Text_Hex"), - width: c.HEX_WIDTH, + items: [ + { + el: { + type: "bi.vertical", + tgap: 10, + items: [ + { + type: 'bi.vertical_adapt', + columnSize: ["fill", 'fill'], height: 24, - listeners: [{ - eventName: "EVENT_CHANGE", - action: function () { - self._checkHexEditor(); - if (checker(self.storeValue.r) && checker(self.storeValue.g) && checker(self.storeValue.b)) { - self.colorShow.element.css("background-color", self.getValue()); - self.fireEvent(BI.ColorPickerEditor.EVENT_CHANGE); + items: [ + { + type: "bi.color_picker_show_button", + cls: "trans-color-icon", + height: 22, + title: BI.i18nText("BI-Transparent_Color"), + text: BI.i18nText("BI-Transparent_Color"), + listeners: [ + { + eventName: BI.ColorChooserShowButton.EVENT_CHANGE, + action: function () { + self.setValue("transparent"); + self.fireEvent(BI.ColorPickerEditor.EVENT_CHANGE); + } + } + ], + ref: function (_ref) { + self.transparent = _ref; } - + }, { + el: { + type: "bi.color_picker_show_button", + cls: "auto-color-icon", + height: 22, + title: BI.i18nText("BI-Basic_Auto"), + text: BI.i18nText("BI-Basic_Auto"), + listeners: [ + { + eventName: BI.ColorChooserShowButton.EVENT_CHANGE, + action: function () { + self.setValue(""); + self.fireEvent(BI.ColorPickerEditor.EVENT_CHANGE); + } + } + ], + ref: function (_ref) { + self.none = _ref; + } + }, + lgap: 10, } - }] - }, RGB[0], { - el: BI.extend(Ws[0], { - ref: function (_ref) { - self.R = _ref - } - }), - width: c.RGB_WIDTH - }, RGB[1], { - el: BI.extend(Ws[1], { - ref: function (_ref) { - self.G = _ref - } - }), - width: c.RGB_WIDTH - }, RGB[2], { - el: BI.extend(Ws[2], { - ref: function (_ref) { - self.B = _ref - } - }), - rgap: -5, - width: c.RGB_WIDTH - }] - } - }] - }, - left: 0, - right: 0, - top: 0, - bottom: 0 - }] + ] + }, { + el: { + type: "bi.vertical_adapt", + columnSize: [22, 10, 'fill', 12, c.RGB_WIDTH, 12, c.RGB_WIDTH, 12, c.RGB_WIDTH], + + rgap: 5, + items: [ + { + el: { + type: "bi.layout", + cls: "color-picker-editor-display bi-card bi-border", + height: 22, + width: 22, + ref: function (_ref) { + self.colorShow = _ref; + } + }, + width: 18 + }, { + type: "bi.label", + text: "#", + width: 10 + }, { + type: "bi.small_text_editor", + ref: function (_ref) { + self.hexEditor = _ref; + }, + cls: "color-picker-editor-input bi-border-radius", + validationChecker: this._hexChecker, + allowBlank: true, + errorText: BI.i18nText("BI-Color_Picker_Error_Text_Hex"), + width: c.HEX_WIDTH, + height: 24, + listeners: [ + { + eventName: "EVENT_CHANGE", + action: function () { + self._checkHexEditor(); + if (checker(self.storeValue.r) && checker(self.storeValue.g) && checker(self.storeValue.b)) { + self.colorShow.element.css("background-color", self.getValue()); + self.fireEvent(BI.ColorPickerEditor.EVENT_CHANGE); + } + + } + } + ] + }, RGB[0], { + el: BI.extend(Ws[0], { + ref: function (_ref) { + self.R = _ref; + } + }), + width: c.RGB_WIDTH + }, RGB[1], { + el: BI.extend(Ws[1], { + ref: function (_ref) { + self.G = _ref; + } + }), + width: c.RGB_WIDTH + }, RGB[2], { + el: BI.extend(Ws[2], { + ref: function (_ref) { + self.B = _ref; + } + }), + rgap: -5, + width: c.RGB_WIDTH + } + ] + } + } + ] + }, + left: 0, + right: 0, + top: 0, + bottom: 0 + } + ] }; }, @@ -181,13 +197,13 @@ BI.HexColorPickerEditor = BI.inherit(BI.Widget, { }, _checkEditors: function () { - if(BI.isEmptyString(this.R.getValue())) { + if (BI.isEmptyString(this.R.getValue())) { this.R.setValue(0); } - if(BI.isEmptyString(this.G.getValue())) { + if (BI.isEmptyString(this.G.getValue())) { this.G.setValue(0); } - if(BI.isEmptyString(this.B.getValue())) { + if (BI.isEmptyString(this.B.getValue())) { this.B.setValue(0); } this.storeValue = { @@ -223,7 +239,7 @@ BI.HexColorPickerEditor = BI.inherit(BI.Widget, { } else if (color === "transparent") { this.colorShow.element.css("background-color", "").removeClass("auto-color-square-normal-background").addClass("trans-color-background"); } else { - this.colorShow.element.css({"background-color": color}).removeClass("auto-color-square-normal-background").removeClass("trans-color-background"); + this.colorShow.element.css({ "background-color": color }).removeClass("auto-color-square-normal-background").removeClass("trans-color-background"); } }, diff --git a/src/case/colorchooser/colorpicker/editor.colorpicker.hex.simple.js b/src/case/colorchooser/colorpicker/editor.colorpicker.hex.simple.js index 9e9c33e90..749806355 100644 --- a/src/case/colorchooser/colorpicker/editor.colorpicker.hex.simple.js +++ b/src/case/colorchooser/colorpicker/editor.colorpicker.hex.simple.js @@ -19,7 +19,7 @@ BI.SimpleHexColorPickerEditor = BI.inherit(BI.Widget, { render: function () { var self = this, o = this.options, c = this.constants; - var RGB = BI.createItems([{text: "R"}, {text: "G"}, {text: "B"}], { + var RGB = BI.createItems([{ text: "R" }, { text: "G" }, { text: "B" }], { type: "bi.label", cls: "color-picker-editor-label", height: 20 @@ -31,97 +31,105 @@ BI.SimpleHexColorPickerEditor = BI.inherit(BI.Widget, { var Ws = BI.map(BI.range(0, 3), function () { return { type: "bi.small_text_editor", - cls: "color-picker-editor-input", + cls: "color-picker-editor-input bi-border-radius", validationChecker: checker, errorText: BI.i18nText("BI-Color_Picker_Error_Text"), allowBlank: true, value: 255, width: c.RGB_WIDTH, height: 24, - listeners: [{ - eventName: BI.TextEditor.EVENT_CHANGE, - action: function () { - self._checkEditors(); - if (self.R.isValid() && self.G.isValid() && self.B.isValid()) { - self.colorShow.element.css("background-color", self.getValue()); - self.fireEvent(BI.SimpleColorPickerEditor.EVENT_CHANGE); + listeners: [ + { + eventName: BI.TextEditor.EVENT_CHANGE, + action: function () { + self._checkEditors(); + if (self.R.isValid() && self.G.isValid() && self.B.isValid()) { + self.colorShow.element.css("background-color", self.getValue()); + self.fireEvent(BI.SimpleColorPickerEditor.EVENT_CHANGE); + } } } - }] - } + ] + }; }); return { type: "bi.vertical", tgap: 10, - items: [{ - el: { - type: "bi.vertical_adapt", - rgap: 5, - columnSize: [22, 10, 'fill', 12, c.RGB_WIDTH, 12, c.RGB_WIDTH, 12, c.RGB_WIDTH], - items: [{ - el: { - type: "bi.layout", - cls: "color-picker-editor-display bi-card bi-border", - height: 22, - width: 22, - ref: function (_ref) { - self.colorShow = _ref; - } - }, - width: 18, - }, { - type: "bi.label", - text: "#", - width: 10 - }, { - type: "bi.small_text_editor", - ref: function (_ref) { - self.hexEditor = _ref; - }, - cls: "color-picker-editor-input", - validationChecker: this._hexChecker, - allowBlank: true, - errorText: BI.i18nText("BI-Color_Picker_Error_Text_Hex"), - width: c.HEX_WIDTH, - height: 24, - listeners: [{ - eventName: "EVENT_CHANGE", - action: function () { - self._checkHexEditor(); - if (checker(self.storeValue.r) && checker(self.storeValue.g) && checker(self.storeValue.b)) { - self.colorShow.element.css("background-color", self.getValue()); - self.fireEvent(BI.ColorPickerEditor.EVENT_CHANGE); - } - } - }] - }, RGB[0], { - el: BI.extend(Ws[0], { - ref: function (_ref) { - self.R = _ref - } - }), - width: c.RGB_WIDTH - }, RGB[1], { - el: BI.extend(Ws[1], { - ref: function (_ref) { - self.G = _ref + items: [ + { + el: { + type: "bi.vertical_adapt", + rgap: 5, + columnSize: [22, 10, 'fill', 12, c.RGB_WIDTH, 12, c.RGB_WIDTH, 12, c.RGB_WIDTH], + items: [ + { + el: { + type: "bi.layout", + cls: "color-picker-editor-display bi-card bi-border", + height: 22, + width: 22, + ref: function (_ref) { + self.colorShow = _ref; + } + }, + width: 18, + }, { + type: "bi.label", + text: "#", + width: 10 + }, { + type: "bi.small_text_editor", + ref: function (_ref) { + self.hexEditor = _ref; + }, + cls: "color-picker-editor-input bi-border-radius", + validationChecker: this._hexChecker, + allowBlank: true, + errorText: BI.i18nText("BI-Color_Picker_Error_Text_Hex"), + width: c.HEX_WIDTH, + height: 24, + listeners: [ + { + eventName: "EVENT_CHANGE", + action: function () { + self._checkHexEditor(); + if (checker(self.storeValue.r) && checker(self.storeValue.g) && checker(self.storeValue.b)) { + self.colorShow.element.css("background-color", self.getValue()); + self.fireEvent(BI.ColorPickerEditor.EVENT_CHANGE); + } + } + } + ] + }, RGB[0], { + el: BI.extend(Ws[0], { + ref: function (_ref) { + self.R = _ref; + } + }), + width: c.RGB_WIDTH + }, RGB[1], { + el: BI.extend(Ws[1], { + ref: function (_ref) { + self.G = _ref; + } + }), + width: c.RGB_WIDTH + }, RGB[2], { + el: BI.extend(Ws[2], { + ref: function (_ref) { + self.B = _ref; + } + }), + rgap: -5, + width: c.RGB_WIDTH } - }), - width: c.RGB_WIDTH - }, RGB[2], { - el: BI.extend(Ws[2], { - ref: function (_ref) { - self.B = _ref - } - }), - rgap: -5, - width: c.RGB_WIDTH - }] + ] + } } - }] + ] - } + }; }, _hexChecker: function (v) { @@ -129,13 +137,13 @@ BI.SimpleHexColorPickerEditor = BI.inherit(BI.Widget, { }, _checkEditors: function () { - if(BI.isEmptyString(this.R.getValue())) { + if (BI.isEmptyString(this.R.getValue())) { this.R.setValue(0); } - if(BI.isEmptyString(this.G.getValue())) { + if (BI.isEmptyString(this.G.getValue())) { this.G.setValue(0); } - if(BI.isEmptyString(this.B.getValue())) { + if (BI.isEmptyString(this.B.getValue())) { this.B.setValue(0); } this.hexEditor.setValue(this.getValue().slice(this.constants.HEX_PREFIX_POSITION)); @@ -157,7 +165,7 @@ BI.SimpleHexColorPickerEditor = BI.inherit(BI.Widget, { }, setValue: function (color) { - this.colorShow.element.css({"background-color": color}); + this.colorShow.element.css({ "background-color": color }); var json = BI.DOM.rgb2json(BI.DOM.hex2rgb(color)); this.R.setValue(BI.isNull(json.r) ? "" : json.r); this.G.setValue(BI.isNull(json.g) ? "" : json.g); @@ -174,4 +182,4 @@ BI.SimpleHexColorPickerEditor = BI.inherit(BI.Widget, { } }); BI.SimpleHexColorPickerEditor.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.simple_hex_color_picker_editor", BI.SimpleHexColorPickerEditor); \ No newline at end of file +BI.shortcut("bi.simple_hex_color_picker_editor", BI.SimpleHexColorPickerEditor); diff --git a/src/case/colorchooser/colorpicker/editor.colorpicker.js b/src/case/colorchooser/colorpicker/editor.colorpicker.js index 9d0dbbca0..982d333c3 100644 --- a/src/case/colorchooser/colorpicker/editor.colorpicker.js +++ b/src/case/colorchooser/colorpicker/editor.colorpicker.js @@ -29,7 +29,7 @@ BI.ColorPickerEditor = BI.inherit(BI.Widget, { height: 16, width: 16 }); - var RGB = BI.createWidgets(BI.createItems([{text: "R"}, {text: "G"}, {text: "B"}], { + var RGB = BI.createWidgets(BI.createItems([{ text: "R" }, { text: "G" }, { text: "B" }], { type: "bi.label", cls: "color-picker-editor-label", width: 20, @@ -41,7 +41,7 @@ BI.ColorPickerEditor = BI.inherit(BI.Widget, { }; var Ws = BI.createWidgets([{}, {}, {}], { type: "bi.small_text_editor", - cls: "color-picker-editor-input", + cls: "color-picker-editor-input bi-border-radius", validationChecker: checker, errorText: BI.i18nText("BI-Color_Picker_Error_Text"), allowBlank: true, @@ -95,56 +95,60 @@ BI.ColorPickerEditor = BI.inherit(BI.Widget, { BI.createWidget({ type: "bi.absolute", element: this, - items: [{ - el: { - type: "bi.vertical_adapt", - items: [{ - el: this.colorShow, - width: 16 - }, { - el: RGB[0], - width: 20 - }, { - el: this.R, - width: c.RGB_WIDTH - }, { - el: RGB[1], - width: 20 - }, { - el: this.G, - width: c.RGB_WIDTH - }, { - el: RGB[2], - width: 20 - }, { - el: this.B, - width: c.RGB_WIDTH - }, { - el: this.transparent, - width: 16, - lgap: 5 - }, { - el: this.none, - width: 16, - lgap: 5 - }] - }, - left: 10, - right: 10, - top: 0, - bottom: 0 - }] + items: [ + { + el: { + type: "bi.vertical_adapt", + items: [ + { + el: this.colorShow, + width: 16 + }, { + el: RGB[0], + width: 20 + }, { + el: this.R, + width: c.RGB_WIDTH + }, { + el: RGB[1], + width: 20 + }, { + el: this.G, + width: c.RGB_WIDTH + }, { + el: RGB[2], + width: 20 + }, { + el: this.B, + width: c.RGB_WIDTH + }, { + el: this.transparent, + width: 16, + lgap: 5 + }, { + el: this.none, + width: 16, + lgap: 5 + } + ] + }, + left: 10, + right: 10, + top: 0, + bottom: 0 + } + ] }); }, _checkEditors: function () { - if(BI.isEmptyString(this.R.getValue())) { + if (BI.isEmptyString(this.R.getValue())) { this.R.setValue(0); } - if(BI.isEmptyString(this.G.getValue())) { + if (BI.isEmptyString(this.G.getValue())) { this.G.setValue(0); } - if(BI.isEmptyString(this.B.getValue())) { + if (BI.isEmptyString(this.B.getValue())) { this.B.setValue(0); } this.storeValue = { @@ -164,7 +168,7 @@ BI.ColorPickerEditor = BI.inherit(BI.Widget, { } else if (color === "transparent") { this.colorShow.element.css("background-color", "").removeClass("auto-color-normal-background").addClass("trans-color-background"); } else { - this.colorShow.element.css({"background-color": color}).removeClass("auto-color-normal-background").removeClass("trans-color-background"); + this.colorShow.element.css({ "background-color": color }).removeClass("auto-color-normal-background").removeClass("trans-color-background"); } }, @@ -223,4 +227,4 @@ BI.ColorPickerEditor = BI.inherit(BI.Widget, { } }); BI.ColorPickerEditor.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.color_picker_editor", BI.ColorPickerEditor); \ No newline at end of file +BI.shortcut("bi.color_picker_editor", BI.ColorPickerEditor); diff --git a/src/case/colorchooser/colorpicker/editor.colorpicker.simple.js b/src/case/colorchooser/colorpicker/editor.colorpicker.simple.js index 32943ecee..63b7576b4 100644 --- a/src/case/colorchooser/colorpicker/editor.colorpicker.simple.js +++ b/src/case/colorchooser/colorpicker/editor.colorpicker.simple.js @@ -28,7 +28,7 @@ BI.SimpleColorPickerEditor = BI.inherit(BI.Widget, { height: 16, width: 16 }); - var RGB = BI.createWidgets(BI.createItems([{text: "R"}, {text: "G"}, {text: "B"}], { + var RGB = BI.createWidgets(BI.createItems([{ text: "R" }, { text: "G" }, { text: "B" }], { type: "bi.label", cls: "color-picker-editor-label", width: 20, @@ -40,7 +40,7 @@ BI.SimpleColorPickerEditor = BI.inherit(BI.Widget, { }; var Ws = BI.createWidgets([{}, {}, {}], { type: "bi.small_text_editor", - cls: "color-picker-editor-input", + cls: "color-picker-editor-input bi-border-radius", validationChecker: checker, errorText: BI.i18nText("BI-Color_Picker_Error_Text"), allowBlank: true, @@ -64,47 +64,49 @@ BI.SimpleColorPickerEditor = BI.inherit(BI.Widget, { BI.createWidget({ type: "bi.vertical_adapt", element: this, - items: [{ - el: this.colorShow, - width: 16, - lgap: 20, - rgap: 15 - }, { - el: RGB[0], - width: 20 - }, { - el: this.R, - width: c.RGB_WIDTH - }, { - el: RGB[1], - width: 20 - }, { - el: this.G, - width: c.RGB_WIDTH - }, { - el: RGB[2], - width: 20 - }, { - el: this.B, - width: c.RGB_WIDTH - }] + items: [ + { + el: this.colorShow, + width: 16, + lgap: 20, + rgap: 15 + }, { + el: RGB[0], + width: 20 + }, { + el: this.R, + width: c.RGB_WIDTH + }, { + el: RGB[1], + width: 20 + }, { + el: this.G, + width: c.RGB_WIDTH + }, { + el: RGB[2], + width: 20 + }, { + el: this.B, + width: c.RGB_WIDTH + } + ] }); }, _checkEditors: function () { - if(BI.isEmptyString(this.R.getValue())) { + if (BI.isEmptyString(this.R.getValue())) { this.R.setValue(0); } - if(BI.isEmptyString(this.G.getValue())) { + if (BI.isEmptyString(this.G.getValue())) { this.G.setValue(0); } - if(BI.isEmptyString(this.B.getValue())) { + if (BI.isEmptyString(this.B.getValue())) { this.B.setValue(0); } }, setValue: function (color) { - this.colorShow.element.css({"background-color": color}); + this.colorShow.element.css({ "background-color": color }); var json = BI.DOM.rgb2json(BI.DOM.hex2rgb(color)); this.R.setValue(BI.isNull(json.r) ? "" : json.r); this.G.setValue(BI.isNull(json.g) ? "" : json.g); @@ -120,4 +122,4 @@ BI.SimpleColorPickerEditor = BI.inherit(BI.Widget, { } }); BI.SimpleColorPickerEditor.EVENT_CHANGE = "EVENT_CHANGE"; -BI.shortcut("bi.simple_color_picker_editor", BI.SimpleColorPickerEditor); \ No newline at end of file +BI.shortcut("bi.simple_color_picker_editor", BI.SimpleColorPickerEditor);