From 4ccc8cb4f868927b0bd8a0ba718331e39400d870 Mon Sep 17 00:00:00 2001 From: windy <1374721899@qq.com> Date: Thu, 2 Nov 2017 15:37:58 +0800 Subject: [PATCH] update --- bi/base.js | 642 ++++++------ bi/sliders.css | 42 +- bi/sliders.js | 9 +- dist/base.js | 642 ++++++------ dist/bundle.js | 642 ++++++------ dist/demo.js | 2410 +++++++++++++++++++++++----------------------- dist/sliders.css | 42 +- dist/sliders.js | 9 +- 8 files changed, 2218 insertions(+), 2220 deletions(-) diff --git a/bi/base.js b/bi/base.js index de379bc264..9ceadbb807 100644 --- a/bi/base.js +++ b/bi/base.js @@ -16267,68 +16267,68 @@ BI.RichEditorParamAction = BI.inherit(BI.RichEditorAction, { key: function (e) { } -});/** - * 颜色选择 - * - * Created by GUY on 2015/11/26. - * @class BI.RichEditorTextToolbar - * @extends BI.Widget - */ -BI.RichEditorTextToolbar = BI.inherit(BI.Widget, { - _defaultConfig: function () { - return BI.extend(BI.RichEditorTextToolbar.superclass._defaultConfig.apply(this, arguments), { - baseCls: "bi-rich-editor-text-toolbar bi-background", - buttons: [ - {type: "bi.rich_editor_size_chooser"}, - {type: "bi.rich_editor_bold_button"}, - {type: "bi.rich_editor_italic_button"}, - {type: "bi.rich_editor_underline_button"}, - {type: "bi.rich_editor_color_chooser"}, - {type: "bi.rich_editor_background_color_chooser"}, - {type: "bi.rich_editor_align_left_button"}, - {type: "bi.rich_editor_align_center_button"}, - {type: "bi.rich_editor_align_right_button"}, - {type: "bi.rich_editor_param_button"}, - ], - height: 28 - }); - }, - - _init: function () { - BI.RichEditorTextToolbar.superclass._init.apply(this, arguments); - var self = this, o = this.options; - BI.createWidget({ - type: "bi.left", - element: this, - items: BI.map(o.buttons, function (i, btn) { - return BI.extend(btn, { - editor: o.editor - }); - }), - hgap: 3, - vgap: 3 - }) - }, - - mounted: function () { - var self = this; - if (BI.isIE9Below()) {//IE8下必须要设置unselectable才能不blur输入框 - this.element.mousedown(function () { - self._noSelect(self.element[0]); - }); - this._noSelect(this.element[0]); - } - }, - - _noSelect: function (element) { - if (element.setAttribute && element.nodeName.toLowerCase() != 'input' && element.nodeName.toLowerCase() != 'textarea') { - element.setAttribute('unselectable', 'on'); - } - for (var i = 0; i < element.childNodes.length; i++) { - this._noSelect(element.childNodes[i]); - } - } -}); +});/** + * 颜色选择 + * + * Created by GUY on 2015/11/26. + * @class BI.RichEditorTextToolbar + * @extends BI.Widget + */ +BI.RichEditorTextToolbar = BI.inherit(BI.Widget, { + _defaultConfig: function () { + return BI.extend(BI.RichEditorTextToolbar.superclass._defaultConfig.apply(this, arguments), { + baseCls: "bi-rich-editor-text-toolbar bi-background", + buttons: [ + {type: "bi.rich_editor_size_chooser"}, + {type: "bi.rich_editor_bold_button"}, + {type: "bi.rich_editor_italic_button"}, + {type: "bi.rich_editor_underline_button"}, + {type: "bi.rich_editor_color_chooser"}, + {type: "bi.rich_editor_background_color_chooser"}, + {type: "bi.rich_editor_align_left_button"}, + {type: "bi.rich_editor_align_center_button"}, + {type: "bi.rich_editor_align_right_button"}, + {type: "bi.rich_editor_param_button"}, + ], + height: 28 + }); + }, + + _init: function () { + BI.RichEditorTextToolbar.superclass._init.apply(this, arguments); + var self = this, o = this.options; + BI.createWidget({ + type: "bi.left", + element: this, + items: BI.map(o.buttons, function (i, btn) { + return BI.extend(btn, { + editor: o.editor + }); + }), + hgap: 3, + vgap: 3 + }) + }, + + mounted: function () { + var self = this; + if (BI.isIE9Below()) {//IE8下必须要设置unselectable才能不blur输入框 + this.element.mousedown(function () { + self._noSelect(self.element[0]); + }); + this._noSelect(this.element[0]); + } + }, + + _noSelect: function (element) { + if (element.setAttribute && element.nodeName.toLowerCase() != 'input' && element.nodeName.toLowerCase() != 'textarea') { + element.setAttribute('unselectable', 'on'); + } + for (var i = 0; i < element.childNodes.length; i++) { + this._noSelect(element.childNodes[i]); + } + } +}); BI.shortcut('bi.rich_editor_text_toolbar', BI.RichEditorTextToolbar);/** * 富文本编辑器 * @@ -16609,57 +16609,57 @@ BI.shortcut('bi.rich_editor_text_toolbar', BI.RichEditorTextToolbar);/** } }); }()); -/** - * 颜色选择trigger - * - * Created by GUY on 2015/11/26. - * @class BI.RichEditorBackgroundChooserTrigger - * @extends BI.Widget - */ -BI.RichEditorBackgroundChooserTrigger = BI.inherit(BI.Widget, { - _defaultConfig: function () { - var conf = BI.RichEditorBackgroundChooserTrigger.superclass._defaultConfig.apply(this, arguments); - return BI.extend(conf, { - width: 20, - height: 20 - }); - }, - - _init: function () { - BI.RichEditorBackgroundChooserTrigger.superclass._init.apply(this, arguments); - this.font = BI.createWidget({ - type: "bi.icon_button", - cls: "text-background-font" - }); - - this.underline = BI.createWidget({ - type: "bi.icon_button", - cls: "text-color-underline-font" - }); - - BI.createWidget({ - type: "bi.absolute", - element: this, - items: [{ - el: this.font, - top: 2, - left: 2 - }, { - el: this.underline, - top: 7, - left: 2 - }] - }) - }, - - setValue: function (color) { - this.underline.element.css("color", color); - }, - - getValue: function () { - return this.font.element.css("color"); - } -}); +/** + * 颜色选择trigger + * + * Created by GUY on 2015/11/26. + * @class BI.RichEditorBackgroundChooserTrigger + * @extends BI.Widget + */ +BI.RichEditorBackgroundChooserTrigger = BI.inherit(BI.Widget, { + _defaultConfig: function () { + var conf = BI.RichEditorBackgroundChooserTrigger.superclass._defaultConfig.apply(this, arguments); + return BI.extend(conf, { + width: 20, + height: 20 + }); + }, + + _init: function () { + BI.RichEditorBackgroundChooserTrigger.superclass._init.apply(this, arguments); + this.font = BI.createWidget({ + type: "bi.icon_button", + cls: "text-background-font" + }); + + this.underline = BI.createWidget({ + type: "bi.icon_button", + cls: "text-color-underline-font" + }); + + BI.createWidget({ + type: "bi.absolute", + element: this, + items: [{ + el: this.font, + top: 2, + left: 2 + }, { + el: this.underline, + top: 7, + left: 2 + }] + }) + }, + + setValue: function (color) { + this.underline.element.css("color", color); + }, + + getValue: function () { + return this.font.element.css("color"); + } +}); BI.shortcut('bi.rich_editor_background_color_chooser_trigger', BI.RichEditorBackgroundChooserTrigger);/** * * Created by GUY on 2015/11/26. @@ -16927,214 +16927,214 @@ BI.RichEditorUnderlineButton = BI.inherit(BI.RichEditorAction, { this.underline.setSelected(false); }, }); -BI.shortcut("bi.rich_editor_underline_button", BI.RichEditorUnderlineButton)/** - * 颜色选择trigger - * - * Created by GUY on 2015/11/26. - * @class BI.RichEditorColorChooserTrigger - * @extends BI.Widget - */ -BI.RichEditorColorChooserTrigger = BI.inherit(BI.Widget, { - _defaultConfig: function () { - var conf = BI.RichEditorColorChooserTrigger.superclass._defaultConfig.apply(this, arguments); - return BI.extend(conf, { - width: 20, - height: 20 - }); - }, - - _init: function () { - BI.RichEditorColorChooserTrigger.superclass._init.apply(this, arguments); - this.font = BI.createWidget({ - type: "bi.icon_button", - cls: "text-color-font" - }); - - this.underline = BI.createWidget({ - type: "bi.icon_button", - cls: "text-color-underline-font" - }); - - BI.createWidget({ - type: "bi.absolute", - element: this, - items: [{ - el: this.font, - top: 2, - left: 2 - }, { - el: this.underline, - top: 7, - left: 2 - }] - }) - }, - - setValue: function (color) { - this.underline.element.css("color", color); - }, - - getValue: function () { - return this.font.element.css("color"); - } -}); -BI.shortcut('bi.rich_editor_color_chooser_trigger', BI.RichEditorColorChooserTrigger);/** - * 颜色选择 - * - * Created by GUY on 2015/11/26. - * @class BI.RichEditorBackgroundColorChooser - * @extends BI.RichEditorAction - */ -BI.RichEditorBackgroundColorChooser = BI.inherit(BI.RichEditorAction, { - _defaultConfig: function () { - return BI.extend(BI.RichEditorBackgroundColorChooser.superclass._defaultConfig.apply(this, arguments), { - width: 20, - height: 20, - }); - }, - - _init: function () { - BI.RichEditorBackgroundColorChooser.superclass._init.apply(this, arguments); - var self = this, o = this.options; - this.colorchooser = BI.createWidget({ - type: "bi.color_chooser", - element: this, - width: o.width, - height: o.height, - el: { - type: "bi.rich_editor_background_color_chooser_trigger", - title: BI.i18nText("BI-Widget_Background_Colour"), - cls: "text-toolbar-button" - } - }); - this.colorchooser.on(BI.ColorChooser.EVENT_CHANGE, function () { - var backgroundColor = this.getValue(); - o.editor.element.css({ - backgroundColor: backgroundColor, - color: BI.DOM.getContrastColor(backgroundColor) - }); - this.setValue(""); - }); - }, - - deactivate: function () { - } -}); -BI.shortcut('bi.rich_editor_background_color_chooser', BI.RichEditorBackgroundColorChooser);/** - * 颜色选择 - * - * Created by GUY on 2015/11/26. - * @class BI.RichEditorColorChooser - * @extends BI.RichEditorAction - */ -BI.RichEditorColorChooser = BI.inherit(BI.RichEditorAction, { - _defaultConfig: function () { - return BI.extend(BI.RichEditorColorChooser.superclass._defaultConfig.apply(this, arguments), { - width: 20, - height: 20, - command: "foreColor" - }); - }, - - _init: function () { - BI.RichEditorColorChooser.superclass._init.apply(this, arguments); - var self = this, o = this.options; - this.colorchooser = BI.createWidget({ - type: "bi.color_chooser", - element: this, - width: o.width, - height: o.height, - el: { - type: "bi.rich_editor_color_chooser_trigger", - title: BI.i18nText("BI-Font_Colour"), - cls: "text-toolbar-button" - } - }); - this.colorchooser.on(BI.ColorChooser.EVENT_CHANGE, function () { - self.doCommand(this.getValue()); - }); - - }, - - deactivate: function () { - this.colorchooser.setValue(""); - } -}); -BI.shortcut('bi.rich_editor_color_chooser', BI.RichEditorColorChooser);/** - * 字体大小选择 - * - * Created by GUY on 2015/11/26. - * @class BI.RichEditorSizeChooser - * @extends BI.RichEditorAction - */ -BI.RichEditorSizeChooser = BI.inherit(BI.RichEditorAction, { - _defaultConfig: function () { - return BI.extend(BI.RichEditorSizeChooser.superclass._defaultConfig.apply(this, arguments), { - baseCls: "bi-rich-editor-size-chooser bi-border bi-card", - command: "FontSize", - width: 50, - height: 20 - }); - }, - - _items: [{ - value: 1, - text: "1(8pt)" - }, { - value: 2, - text: "2(10pt)" - }, { - value: 3, - text: "3(12pt)" - }, { - value: 4, - text: "4(14pt)" - }, { - value: 5, - text: "5(18pt)" - }, { - value: 6, - text: "6(24pt)" - }], - - _init: function () { - BI.RichEditorSizeChooser.superclass._init.apply(this, arguments); - var self = this, o = this.options; - this.trigger = BI.createWidget({ - type: "bi.text_trigger", - readonly: true, - height: o.height, - triggerWidth: 16, - text: BI.i18nText("BI-Font_Size") - }); - - this.combo = BI.createWidget({ - type: "bi.combo", - element: this, - el: this.trigger, - adjustLength: 1, - popup: { - maxWidth: 70, - minWidth: 70, - el: { - type: "bi.button_group", - items: BI.createItems(this._items, { - type: "bi.single_select_item" - }), - layouts: [{ - type: "bi.vertical" - }] - } - } - }); - this.combo.on(BI.Combo.EVENT_CHANGE, function () { - var val = this.getValue()[0]; - self.doCommand(val); - this.hideView(); - this.setValue([]); - }) - } -}); +BI.shortcut("bi.rich_editor_underline_button", BI.RichEditorUnderlineButton)/** + * 颜色选择trigger + * + * Created by GUY on 2015/11/26. + * @class BI.RichEditorColorChooserTrigger + * @extends BI.Widget + */ +BI.RichEditorColorChooserTrigger = BI.inherit(BI.Widget, { + _defaultConfig: function () { + var conf = BI.RichEditorColorChooserTrigger.superclass._defaultConfig.apply(this, arguments); + return BI.extend(conf, { + width: 20, + height: 20 + }); + }, + + _init: function () { + BI.RichEditorColorChooserTrigger.superclass._init.apply(this, arguments); + this.font = BI.createWidget({ + type: "bi.icon_button", + cls: "text-color-font" + }); + + this.underline = BI.createWidget({ + type: "bi.icon_button", + cls: "text-color-underline-font" + }); + + BI.createWidget({ + type: "bi.absolute", + element: this, + items: [{ + el: this.font, + top: 2, + left: 2 + }, { + el: this.underline, + top: 7, + left: 2 + }] + }) + }, + + setValue: function (color) { + this.underline.element.css("color", color); + }, + + getValue: function () { + return this.font.element.css("color"); + } +}); +BI.shortcut('bi.rich_editor_color_chooser_trigger', BI.RichEditorColorChooserTrigger);/** + * 颜色选择 + * + * Created by GUY on 2015/11/26. + * @class BI.RichEditorBackgroundColorChooser + * @extends BI.RichEditorAction + */ +BI.RichEditorBackgroundColorChooser = BI.inherit(BI.RichEditorAction, { + _defaultConfig: function () { + return BI.extend(BI.RichEditorBackgroundColorChooser.superclass._defaultConfig.apply(this, arguments), { + width: 20, + height: 20, + }); + }, + + _init: function () { + BI.RichEditorBackgroundColorChooser.superclass._init.apply(this, arguments); + var self = this, o = this.options; + this.colorchooser = BI.createWidget({ + type: "bi.color_chooser", + element: this, + width: o.width, + height: o.height, + el: { + type: "bi.rich_editor_background_color_chooser_trigger", + title: BI.i18nText("BI-Widget_Background_Colour"), + cls: "text-toolbar-button" + } + }); + this.colorchooser.on(BI.ColorChooser.EVENT_CHANGE, function () { + var backgroundColor = this.getValue(); + o.editor.element.css({ + backgroundColor: backgroundColor, + color: BI.DOM.getContrastColor(backgroundColor) + }); + this.setValue(""); + }); + }, + + deactivate: function () { + } +}); +BI.shortcut('bi.rich_editor_background_color_chooser', BI.RichEditorBackgroundColorChooser);/** + * 颜色选择 + * + * Created by GUY on 2015/11/26. + * @class BI.RichEditorColorChooser + * @extends BI.RichEditorAction + */ +BI.RichEditorColorChooser = BI.inherit(BI.RichEditorAction, { + _defaultConfig: function () { + return BI.extend(BI.RichEditorColorChooser.superclass._defaultConfig.apply(this, arguments), { + width: 20, + height: 20, + command: "foreColor" + }); + }, + + _init: function () { + BI.RichEditorColorChooser.superclass._init.apply(this, arguments); + var self = this, o = this.options; + this.colorchooser = BI.createWidget({ + type: "bi.color_chooser", + element: this, + width: o.width, + height: o.height, + el: { + type: "bi.rich_editor_color_chooser_trigger", + title: BI.i18nText("BI-Font_Colour"), + cls: "text-toolbar-button" + } + }); + this.colorchooser.on(BI.ColorChooser.EVENT_CHANGE, function () { + self.doCommand(this.getValue()); + }); + + }, + + deactivate: function () { + this.colorchooser.setValue(""); + } +}); +BI.shortcut('bi.rich_editor_color_chooser', BI.RichEditorColorChooser);/** + * 字体大小选择 + * + * Created by GUY on 2015/11/26. + * @class BI.RichEditorSizeChooser + * @extends BI.RichEditorAction + */ +BI.RichEditorSizeChooser = BI.inherit(BI.RichEditorAction, { + _defaultConfig: function () { + return BI.extend(BI.RichEditorSizeChooser.superclass._defaultConfig.apply(this, arguments), { + baseCls: "bi-rich-editor-size-chooser bi-border bi-card", + command: "FontSize", + width: 50, + height: 20 + }); + }, + + _items: [{ + value: 1, + text: "1(8pt)" + }, { + value: 2, + text: "2(10pt)" + }, { + value: 3, + text: "3(12pt)" + }, { + value: 4, + text: "4(14pt)" + }, { + value: 5, + text: "5(18pt)" + }, { + value: 6, + text: "6(24pt)" + }], + + _init: function () { + BI.RichEditorSizeChooser.superclass._init.apply(this, arguments); + var self = this, o = this.options; + this.trigger = BI.createWidget({ + type: "bi.text_trigger", + readonly: true, + height: o.height, + triggerWidth: 16, + text: BI.i18nText("BI-Font_Size") + }); + + this.combo = BI.createWidget({ + type: "bi.combo", + element: this, + el: this.trigger, + adjustLength: 1, + popup: { + maxWidth: 70, + minWidth: 70, + el: { + type: "bi.button_group", + items: BI.createItems(this._items, { + type: "bi.single_select_item" + }), + layouts: [{ + type: "bi.vertical" + }] + } + } + }); + this.combo.on(BI.Combo.EVENT_CHANGE, function () { + var val = this.getValue()[0]; + self.doCommand(val); + this.hideView(); + this.setValue([]); + }) + } +}); BI.shortcut('bi.rich_editor_size_chooser', BI.RichEditorSizeChooser);/** * 富文本编辑器 * diff --git a/bi/sliders.css b/bi/sliders.css index a8d9688bba..66780294e4 100644 --- a/bi/sliders.css +++ b/bi/sliders.css @@ -24,27 +24,15 @@ -moz-border-radius: 7px; border-radius: 7px; } -.bi-single-slider-button .slider-button { - cursor: ew-resize; - -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); - -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); - box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); - -webkit-border-radius: 7px; - -moz-border-radius: 7px; - border-radius: 7px; -} -.bi-slider-track .gray-track { - background-color: rgba(153, 153, 153, 0.3); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4d999999,endColorstr=#4d999999); - -webkit-border-radius: 3px; - -moz-border-radius: 3px; - border-radius: 3px; -} -.bi-slider-track .blue-track { - -webkit-border-radius: 3px; - -moz-border-radius: 3px; - border-radius: 3px; -} +.bi-single-slider-button .slider-button { + cursor: ew-resize; + -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); + -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); + box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); + -webkit-border-radius: 7px; + -moz-border-radius: 7px; + border-radius: 7px; +} .bi-slider-track .gray-track { background-color: rgba(153, 153, 153, 0.3); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4d999999,endColorstr=#4d999999); @@ -57,3 +45,15 @@ -moz-border-radius: 3px; border-radius: 3px; } +.bi-slider-track .gray-track { + background-color: rgba(153, 153, 153, 0.3); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4d999999,endColorstr=#4d999999); + -webkit-border-radius: 3px; + -moz-border-radius: 3px; + border-radius: 3px; +} +.bi-slider-track .blue-track { + -webkit-border-radius: 3px; + -moz-border-radius: 3px; + border-radius: 3px; +} diff --git a/bi/sliders.js b/bi/sliders.js index 0f21ed46fd..e5bcfa86d6 100644 --- a/bi/sliders.js +++ b/bi/sliders.js @@ -6,7 +6,6 @@ BI.IntervalSlider = BI.inherit(BI.Widget, { EDITOR_WIDTH: 58, EDITOR_R_GAP: 60, EDITOR_HEIGHT: 30, - HEIGHT: 28, SLIDER_WIDTH_HALF: 15, SLIDER_WIDTH: 30, SLIDER_HEIGHT: 30, @@ -51,7 +50,6 @@ BI.IntervalSlider = BI.inherit(BI.Widget, { cls: "slider-editor-button", errorText: "", allowBlank: false, - height: c.HEIGHT, width: c.EDITOR_WIDTH, validationChecker: function (v) { return self._checkValidation(v); @@ -78,7 +76,6 @@ BI.IntervalSlider = BI.inherit(BI.Widget, { cls: "slider-editor-button", errorText: "", allowBlank: false, - height: c.HEIGHT, width: c.EDITOR_WIDTH, validationChecker: function (v) { return self._checkValidation(v); @@ -122,6 +119,10 @@ BI.IntervalSlider = BI.inherit(BI.Widget, { var significantPercent = BI.parseFloat(percent.toFixed(1)); self._setSliderOnePosition(significantPercent); self.fireEvent(BI.IntervalSlider.EVENT_CHANGE); + ui.helper.removeClass("dragging"); + }, + start: function (e, ui) { + ui.helper.removeClass("dragging").addClass("dragging"); } }); @@ -1183,7 +1184,6 @@ BI.SingleSlider = BI.inherit(BI.Widget, { _constant: { EDITOR_WIDTH: 90, EDITOR_HEIGHT: 30, - HEIGHT: 28, SLIDER_WIDTH_HALF: 15, SLIDER_WIDTH: 30, SLIDER_HEIGHT: 30, @@ -1276,7 +1276,6 @@ BI.SingleSlider = BI.inherit(BI.Widget, { type: "bi.sign_editor", cls: "slider-editor-button", errorText: "", - height: c.HEIGHT, width: c.EDITOR_WIDTH - 2, allowBlank: false, validationChecker: function (v) { diff --git a/dist/base.js b/dist/base.js index de379bc264..9ceadbb807 100644 --- a/dist/base.js +++ b/dist/base.js @@ -16267,68 +16267,68 @@ BI.RichEditorParamAction = BI.inherit(BI.RichEditorAction, { key: function (e) { } -});/** - * 颜色选择 - * - * Created by GUY on 2015/11/26. - * @class BI.RichEditorTextToolbar - * @extends BI.Widget - */ -BI.RichEditorTextToolbar = BI.inherit(BI.Widget, { - _defaultConfig: function () { - return BI.extend(BI.RichEditorTextToolbar.superclass._defaultConfig.apply(this, arguments), { - baseCls: "bi-rich-editor-text-toolbar bi-background", - buttons: [ - {type: "bi.rich_editor_size_chooser"}, - {type: "bi.rich_editor_bold_button"}, - {type: "bi.rich_editor_italic_button"}, - {type: "bi.rich_editor_underline_button"}, - {type: "bi.rich_editor_color_chooser"}, - {type: "bi.rich_editor_background_color_chooser"}, - {type: "bi.rich_editor_align_left_button"}, - {type: "bi.rich_editor_align_center_button"}, - {type: "bi.rich_editor_align_right_button"}, - {type: "bi.rich_editor_param_button"}, - ], - height: 28 - }); - }, - - _init: function () { - BI.RichEditorTextToolbar.superclass._init.apply(this, arguments); - var self = this, o = this.options; - BI.createWidget({ - type: "bi.left", - element: this, - items: BI.map(o.buttons, function (i, btn) { - return BI.extend(btn, { - editor: o.editor - }); - }), - hgap: 3, - vgap: 3 - }) - }, - - mounted: function () { - var self = this; - if (BI.isIE9Below()) {//IE8下必须要设置unselectable才能不blur输入框 - this.element.mousedown(function () { - self._noSelect(self.element[0]); - }); - this._noSelect(this.element[0]); - } - }, - - _noSelect: function (element) { - if (element.setAttribute && element.nodeName.toLowerCase() != 'input' && element.nodeName.toLowerCase() != 'textarea') { - element.setAttribute('unselectable', 'on'); - } - for (var i = 0; i < element.childNodes.length; i++) { - this._noSelect(element.childNodes[i]); - } - } -}); +});/** + * 颜色选择 + * + * Created by GUY on 2015/11/26. + * @class BI.RichEditorTextToolbar + * @extends BI.Widget + */ +BI.RichEditorTextToolbar = BI.inherit(BI.Widget, { + _defaultConfig: function () { + return BI.extend(BI.RichEditorTextToolbar.superclass._defaultConfig.apply(this, arguments), { + baseCls: "bi-rich-editor-text-toolbar bi-background", + buttons: [ + {type: "bi.rich_editor_size_chooser"}, + {type: "bi.rich_editor_bold_button"}, + {type: "bi.rich_editor_italic_button"}, + {type: "bi.rich_editor_underline_button"}, + {type: "bi.rich_editor_color_chooser"}, + {type: "bi.rich_editor_background_color_chooser"}, + {type: "bi.rich_editor_align_left_button"}, + {type: "bi.rich_editor_align_center_button"}, + {type: "bi.rich_editor_align_right_button"}, + {type: "bi.rich_editor_param_button"}, + ], + height: 28 + }); + }, + + _init: function () { + BI.RichEditorTextToolbar.superclass._init.apply(this, arguments); + var self = this, o = this.options; + BI.createWidget({ + type: "bi.left", + element: this, + items: BI.map(o.buttons, function (i, btn) { + return BI.extend(btn, { + editor: o.editor + }); + }), + hgap: 3, + vgap: 3 + }) + }, + + mounted: function () { + var self = this; + if (BI.isIE9Below()) {//IE8下必须要设置unselectable才能不blur输入框 + this.element.mousedown(function () { + self._noSelect(self.element[0]); + }); + this._noSelect(this.element[0]); + } + }, + + _noSelect: function (element) { + if (element.setAttribute && element.nodeName.toLowerCase() != 'input' && element.nodeName.toLowerCase() != 'textarea') { + element.setAttribute('unselectable', 'on'); + } + for (var i = 0; i < element.childNodes.length; i++) { + this._noSelect(element.childNodes[i]); + } + } +}); BI.shortcut('bi.rich_editor_text_toolbar', BI.RichEditorTextToolbar);/** * 富文本编辑器 * @@ -16609,57 +16609,57 @@ BI.shortcut('bi.rich_editor_text_toolbar', BI.RichEditorTextToolbar);/** } }); }()); -/** - * 颜色选择trigger - * - * Created by GUY on 2015/11/26. - * @class BI.RichEditorBackgroundChooserTrigger - * @extends BI.Widget - */ -BI.RichEditorBackgroundChooserTrigger = BI.inherit(BI.Widget, { - _defaultConfig: function () { - var conf = BI.RichEditorBackgroundChooserTrigger.superclass._defaultConfig.apply(this, arguments); - return BI.extend(conf, { - width: 20, - height: 20 - }); - }, - - _init: function () { - BI.RichEditorBackgroundChooserTrigger.superclass._init.apply(this, arguments); - this.font = BI.createWidget({ - type: "bi.icon_button", - cls: "text-background-font" - }); - - this.underline = BI.createWidget({ - type: "bi.icon_button", - cls: "text-color-underline-font" - }); - - BI.createWidget({ - type: "bi.absolute", - element: this, - items: [{ - el: this.font, - top: 2, - left: 2 - }, { - el: this.underline, - top: 7, - left: 2 - }] - }) - }, - - setValue: function (color) { - this.underline.element.css("color", color); - }, - - getValue: function () { - return this.font.element.css("color"); - } -}); +/** + * 颜色选择trigger + * + * Created by GUY on 2015/11/26. + * @class BI.RichEditorBackgroundChooserTrigger + * @extends BI.Widget + */ +BI.RichEditorBackgroundChooserTrigger = BI.inherit(BI.Widget, { + _defaultConfig: function () { + var conf = BI.RichEditorBackgroundChooserTrigger.superclass._defaultConfig.apply(this, arguments); + return BI.extend(conf, { + width: 20, + height: 20 + }); + }, + + _init: function () { + BI.RichEditorBackgroundChooserTrigger.superclass._init.apply(this, arguments); + this.font = BI.createWidget({ + type: "bi.icon_button", + cls: "text-background-font" + }); + + this.underline = BI.createWidget({ + type: "bi.icon_button", + cls: "text-color-underline-font" + }); + + BI.createWidget({ + type: "bi.absolute", + element: this, + items: [{ + el: this.font, + top: 2, + left: 2 + }, { + el: this.underline, + top: 7, + left: 2 + }] + }) + }, + + setValue: function (color) { + this.underline.element.css("color", color); + }, + + getValue: function () { + return this.font.element.css("color"); + } +}); BI.shortcut('bi.rich_editor_background_color_chooser_trigger', BI.RichEditorBackgroundChooserTrigger);/** * * Created by GUY on 2015/11/26. @@ -16927,214 +16927,214 @@ BI.RichEditorUnderlineButton = BI.inherit(BI.RichEditorAction, { this.underline.setSelected(false); }, }); -BI.shortcut("bi.rich_editor_underline_button", BI.RichEditorUnderlineButton)/** - * 颜色选择trigger - * - * Created by GUY on 2015/11/26. - * @class BI.RichEditorColorChooserTrigger - * @extends BI.Widget - */ -BI.RichEditorColorChooserTrigger = BI.inherit(BI.Widget, { - _defaultConfig: function () { - var conf = BI.RichEditorColorChooserTrigger.superclass._defaultConfig.apply(this, arguments); - return BI.extend(conf, { - width: 20, - height: 20 - }); - }, - - _init: function () { - BI.RichEditorColorChooserTrigger.superclass._init.apply(this, arguments); - this.font = BI.createWidget({ - type: "bi.icon_button", - cls: "text-color-font" - }); - - this.underline = BI.createWidget({ - type: "bi.icon_button", - cls: "text-color-underline-font" - }); - - BI.createWidget({ - type: "bi.absolute", - element: this, - items: [{ - el: this.font, - top: 2, - left: 2 - }, { - el: this.underline, - top: 7, - left: 2 - }] - }) - }, - - setValue: function (color) { - this.underline.element.css("color", color); - }, - - getValue: function () { - return this.font.element.css("color"); - } -}); -BI.shortcut('bi.rich_editor_color_chooser_trigger', BI.RichEditorColorChooserTrigger);/** - * 颜色选择 - * - * Created by GUY on 2015/11/26. - * @class BI.RichEditorBackgroundColorChooser - * @extends BI.RichEditorAction - */ -BI.RichEditorBackgroundColorChooser = BI.inherit(BI.RichEditorAction, { - _defaultConfig: function () { - return BI.extend(BI.RichEditorBackgroundColorChooser.superclass._defaultConfig.apply(this, arguments), { - width: 20, - height: 20, - }); - }, - - _init: function () { - BI.RichEditorBackgroundColorChooser.superclass._init.apply(this, arguments); - var self = this, o = this.options; - this.colorchooser = BI.createWidget({ - type: "bi.color_chooser", - element: this, - width: o.width, - height: o.height, - el: { - type: "bi.rich_editor_background_color_chooser_trigger", - title: BI.i18nText("BI-Widget_Background_Colour"), - cls: "text-toolbar-button" - } - }); - this.colorchooser.on(BI.ColorChooser.EVENT_CHANGE, function () { - var backgroundColor = this.getValue(); - o.editor.element.css({ - backgroundColor: backgroundColor, - color: BI.DOM.getContrastColor(backgroundColor) - }); - this.setValue(""); - }); - }, - - deactivate: function () { - } -}); -BI.shortcut('bi.rich_editor_background_color_chooser', BI.RichEditorBackgroundColorChooser);/** - * 颜色选择 - * - * Created by GUY on 2015/11/26. - * @class BI.RichEditorColorChooser - * @extends BI.RichEditorAction - */ -BI.RichEditorColorChooser = BI.inherit(BI.RichEditorAction, { - _defaultConfig: function () { - return BI.extend(BI.RichEditorColorChooser.superclass._defaultConfig.apply(this, arguments), { - width: 20, - height: 20, - command: "foreColor" - }); - }, - - _init: function () { - BI.RichEditorColorChooser.superclass._init.apply(this, arguments); - var self = this, o = this.options; - this.colorchooser = BI.createWidget({ - type: "bi.color_chooser", - element: this, - width: o.width, - height: o.height, - el: { - type: "bi.rich_editor_color_chooser_trigger", - title: BI.i18nText("BI-Font_Colour"), - cls: "text-toolbar-button" - } - }); - this.colorchooser.on(BI.ColorChooser.EVENT_CHANGE, function () { - self.doCommand(this.getValue()); - }); - - }, - - deactivate: function () { - this.colorchooser.setValue(""); - } -}); -BI.shortcut('bi.rich_editor_color_chooser', BI.RichEditorColorChooser);/** - * 字体大小选择 - * - * Created by GUY on 2015/11/26. - * @class BI.RichEditorSizeChooser - * @extends BI.RichEditorAction - */ -BI.RichEditorSizeChooser = BI.inherit(BI.RichEditorAction, { - _defaultConfig: function () { - return BI.extend(BI.RichEditorSizeChooser.superclass._defaultConfig.apply(this, arguments), { - baseCls: "bi-rich-editor-size-chooser bi-border bi-card", - command: "FontSize", - width: 50, - height: 20 - }); - }, - - _items: [{ - value: 1, - text: "1(8pt)" - }, { - value: 2, - text: "2(10pt)" - }, { - value: 3, - text: "3(12pt)" - }, { - value: 4, - text: "4(14pt)" - }, { - value: 5, - text: "5(18pt)" - }, { - value: 6, - text: "6(24pt)" - }], - - _init: function () { - BI.RichEditorSizeChooser.superclass._init.apply(this, arguments); - var self = this, o = this.options; - this.trigger = BI.createWidget({ - type: "bi.text_trigger", - readonly: true, - height: o.height, - triggerWidth: 16, - text: BI.i18nText("BI-Font_Size") - }); - - this.combo = BI.createWidget({ - type: "bi.combo", - element: this, - el: this.trigger, - adjustLength: 1, - popup: { - maxWidth: 70, - minWidth: 70, - el: { - type: "bi.button_group", - items: BI.createItems(this._items, { - type: "bi.single_select_item" - }), - layouts: [{ - type: "bi.vertical" - }] - } - } - }); - this.combo.on(BI.Combo.EVENT_CHANGE, function () { - var val = this.getValue()[0]; - self.doCommand(val); - this.hideView(); - this.setValue([]); - }) - } -}); +BI.shortcut("bi.rich_editor_underline_button", BI.RichEditorUnderlineButton)/** + * 颜色选择trigger + * + * Created by GUY on 2015/11/26. + * @class BI.RichEditorColorChooserTrigger + * @extends BI.Widget + */ +BI.RichEditorColorChooserTrigger = BI.inherit(BI.Widget, { + _defaultConfig: function () { + var conf = BI.RichEditorColorChooserTrigger.superclass._defaultConfig.apply(this, arguments); + return BI.extend(conf, { + width: 20, + height: 20 + }); + }, + + _init: function () { + BI.RichEditorColorChooserTrigger.superclass._init.apply(this, arguments); + this.font = BI.createWidget({ + type: "bi.icon_button", + cls: "text-color-font" + }); + + this.underline = BI.createWidget({ + type: "bi.icon_button", + cls: "text-color-underline-font" + }); + + BI.createWidget({ + type: "bi.absolute", + element: this, + items: [{ + el: this.font, + top: 2, + left: 2 + }, { + el: this.underline, + top: 7, + left: 2 + }] + }) + }, + + setValue: function (color) { + this.underline.element.css("color", color); + }, + + getValue: function () { + return this.font.element.css("color"); + } +}); +BI.shortcut('bi.rich_editor_color_chooser_trigger', BI.RichEditorColorChooserTrigger);/** + * 颜色选择 + * + * Created by GUY on 2015/11/26. + * @class BI.RichEditorBackgroundColorChooser + * @extends BI.RichEditorAction + */ +BI.RichEditorBackgroundColorChooser = BI.inherit(BI.RichEditorAction, { + _defaultConfig: function () { + return BI.extend(BI.RichEditorBackgroundColorChooser.superclass._defaultConfig.apply(this, arguments), { + width: 20, + height: 20, + }); + }, + + _init: function () { + BI.RichEditorBackgroundColorChooser.superclass._init.apply(this, arguments); + var self = this, o = this.options; + this.colorchooser = BI.createWidget({ + type: "bi.color_chooser", + element: this, + width: o.width, + height: o.height, + el: { + type: "bi.rich_editor_background_color_chooser_trigger", + title: BI.i18nText("BI-Widget_Background_Colour"), + cls: "text-toolbar-button" + } + }); + this.colorchooser.on(BI.ColorChooser.EVENT_CHANGE, function () { + var backgroundColor = this.getValue(); + o.editor.element.css({ + backgroundColor: backgroundColor, + color: BI.DOM.getContrastColor(backgroundColor) + }); + this.setValue(""); + }); + }, + + deactivate: function () { + } +}); +BI.shortcut('bi.rich_editor_background_color_chooser', BI.RichEditorBackgroundColorChooser);/** + * 颜色选择 + * + * Created by GUY on 2015/11/26. + * @class BI.RichEditorColorChooser + * @extends BI.RichEditorAction + */ +BI.RichEditorColorChooser = BI.inherit(BI.RichEditorAction, { + _defaultConfig: function () { + return BI.extend(BI.RichEditorColorChooser.superclass._defaultConfig.apply(this, arguments), { + width: 20, + height: 20, + command: "foreColor" + }); + }, + + _init: function () { + BI.RichEditorColorChooser.superclass._init.apply(this, arguments); + var self = this, o = this.options; + this.colorchooser = BI.createWidget({ + type: "bi.color_chooser", + element: this, + width: o.width, + height: o.height, + el: { + type: "bi.rich_editor_color_chooser_trigger", + title: BI.i18nText("BI-Font_Colour"), + cls: "text-toolbar-button" + } + }); + this.colorchooser.on(BI.ColorChooser.EVENT_CHANGE, function () { + self.doCommand(this.getValue()); + }); + + }, + + deactivate: function () { + this.colorchooser.setValue(""); + } +}); +BI.shortcut('bi.rich_editor_color_chooser', BI.RichEditorColorChooser);/** + * 字体大小选择 + * + * Created by GUY on 2015/11/26. + * @class BI.RichEditorSizeChooser + * @extends BI.RichEditorAction + */ +BI.RichEditorSizeChooser = BI.inherit(BI.RichEditorAction, { + _defaultConfig: function () { + return BI.extend(BI.RichEditorSizeChooser.superclass._defaultConfig.apply(this, arguments), { + baseCls: "bi-rich-editor-size-chooser bi-border bi-card", + command: "FontSize", + width: 50, + height: 20 + }); + }, + + _items: [{ + value: 1, + text: "1(8pt)" + }, { + value: 2, + text: "2(10pt)" + }, { + value: 3, + text: "3(12pt)" + }, { + value: 4, + text: "4(14pt)" + }, { + value: 5, + text: "5(18pt)" + }, { + value: 6, + text: "6(24pt)" + }], + + _init: function () { + BI.RichEditorSizeChooser.superclass._init.apply(this, arguments); + var self = this, o = this.options; + this.trigger = BI.createWidget({ + type: "bi.text_trigger", + readonly: true, + height: o.height, + triggerWidth: 16, + text: BI.i18nText("BI-Font_Size") + }); + + this.combo = BI.createWidget({ + type: "bi.combo", + element: this, + el: this.trigger, + adjustLength: 1, + popup: { + maxWidth: 70, + minWidth: 70, + el: { + type: "bi.button_group", + items: BI.createItems(this._items, { + type: "bi.single_select_item" + }), + layouts: [{ + type: "bi.vertical" + }] + } + } + }); + this.combo.on(BI.Combo.EVENT_CHANGE, function () { + var val = this.getValue()[0]; + self.doCommand(val); + this.hideView(); + this.setValue([]); + }) + } +}); BI.shortcut('bi.rich_editor_size_chooser', BI.RichEditorSizeChooser);/** * 富文本编辑器 * diff --git a/dist/bundle.js b/dist/bundle.js index e44fecce17..1259cd2e9d 100644 --- a/dist/bundle.js +++ b/dist/bundle.js @@ -42008,68 +42008,68 @@ BI.RichEditorParamAction = BI.inherit(BI.RichEditorAction, { key: function (e) { } -});/** - * 颜色选择 - * - * Created by GUY on 2015/11/26. - * @class BI.RichEditorTextToolbar - * @extends BI.Widget - */ -BI.RichEditorTextToolbar = BI.inherit(BI.Widget, { - _defaultConfig: function () { - return BI.extend(BI.RichEditorTextToolbar.superclass._defaultConfig.apply(this, arguments), { - baseCls: "bi-rich-editor-text-toolbar bi-background", - buttons: [ - {type: "bi.rich_editor_size_chooser"}, - {type: "bi.rich_editor_bold_button"}, - {type: "bi.rich_editor_italic_button"}, - {type: "bi.rich_editor_underline_button"}, - {type: "bi.rich_editor_color_chooser"}, - {type: "bi.rich_editor_background_color_chooser"}, - {type: "bi.rich_editor_align_left_button"}, - {type: "bi.rich_editor_align_center_button"}, - {type: "bi.rich_editor_align_right_button"}, - {type: "bi.rich_editor_param_button"}, - ], - height: 28 - }); - }, - - _init: function () { - BI.RichEditorTextToolbar.superclass._init.apply(this, arguments); - var self = this, o = this.options; - BI.createWidget({ - type: "bi.left", - element: this, - items: BI.map(o.buttons, function (i, btn) { - return BI.extend(btn, { - editor: o.editor - }); - }), - hgap: 3, - vgap: 3 - }) - }, - - mounted: function () { - var self = this; - if (BI.isIE9Below()) {//IE8下必须要设置unselectable才能不blur输入框 - this.element.mousedown(function () { - self._noSelect(self.element[0]); - }); - this._noSelect(this.element[0]); - } - }, - - _noSelect: function (element) { - if (element.setAttribute && element.nodeName.toLowerCase() != 'input' && element.nodeName.toLowerCase() != 'textarea') { - element.setAttribute('unselectable', 'on'); - } - for (var i = 0; i < element.childNodes.length; i++) { - this._noSelect(element.childNodes[i]); - } - } -}); +});/** + * 颜色选择 + * + * Created by GUY on 2015/11/26. + * @class BI.RichEditorTextToolbar + * @extends BI.Widget + */ +BI.RichEditorTextToolbar = BI.inherit(BI.Widget, { + _defaultConfig: function () { + return BI.extend(BI.RichEditorTextToolbar.superclass._defaultConfig.apply(this, arguments), { + baseCls: "bi-rich-editor-text-toolbar bi-background", + buttons: [ + {type: "bi.rich_editor_size_chooser"}, + {type: "bi.rich_editor_bold_button"}, + {type: "bi.rich_editor_italic_button"}, + {type: "bi.rich_editor_underline_button"}, + {type: "bi.rich_editor_color_chooser"}, + {type: "bi.rich_editor_background_color_chooser"}, + {type: "bi.rich_editor_align_left_button"}, + {type: "bi.rich_editor_align_center_button"}, + {type: "bi.rich_editor_align_right_button"}, + {type: "bi.rich_editor_param_button"}, + ], + height: 28 + }); + }, + + _init: function () { + BI.RichEditorTextToolbar.superclass._init.apply(this, arguments); + var self = this, o = this.options; + BI.createWidget({ + type: "bi.left", + element: this, + items: BI.map(o.buttons, function (i, btn) { + return BI.extend(btn, { + editor: o.editor + }); + }), + hgap: 3, + vgap: 3 + }) + }, + + mounted: function () { + var self = this; + if (BI.isIE9Below()) {//IE8下必须要设置unselectable才能不blur输入框 + this.element.mousedown(function () { + self._noSelect(self.element[0]); + }); + this._noSelect(this.element[0]); + } + }, + + _noSelect: function (element) { + if (element.setAttribute && element.nodeName.toLowerCase() != 'input' && element.nodeName.toLowerCase() != 'textarea') { + element.setAttribute('unselectable', 'on'); + } + for (var i = 0; i < element.childNodes.length; i++) { + this._noSelect(element.childNodes[i]); + } + } +}); BI.shortcut('bi.rich_editor_text_toolbar', BI.RichEditorTextToolbar);/** * 富文本编辑器 * @@ -42350,57 +42350,57 @@ BI.shortcut('bi.rich_editor_text_toolbar', BI.RichEditorTextToolbar);/** } }); }()); -/** - * 颜色选择trigger - * - * Created by GUY on 2015/11/26. - * @class BI.RichEditorBackgroundChooserTrigger - * @extends BI.Widget - */ -BI.RichEditorBackgroundChooserTrigger = BI.inherit(BI.Widget, { - _defaultConfig: function () { - var conf = BI.RichEditorBackgroundChooserTrigger.superclass._defaultConfig.apply(this, arguments); - return BI.extend(conf, { - width: 20, - height: 20 - }); - }, - - _init: function () { - BI.RichEditorBackgroundChooserTrigger.superclass._init.apply(this, arguments); - this.font = BI.createWidget({ - type: "bi.icon_button", - cls: "text-background-font" - }); - - this.underline = BI.createWidget({ - type: "bi.icon_button", - cls: "text-color-underline-font" - }); - - BI.createWidget({ - type: "bi.absolute", - element: this, - items: [{ - el: this.font, - top: 2, - left: 2 - }, { - el: this.underline, - top: 7, - left: 2 - }] - }) - }, - - setValue: function (color) { - this.underline.element.css("color", color); - }, - - getValue: function () { - return this.font.element.css("color"); - } -}); +/** + * 颜色选择trigger + * + * Created by GUY on 2015/11/26. + * @class BI.RichEditorBackgroundChooserTrigger + * @extends BI.Widget + */ +BI.RichEditorBackgroundChooserTrigger = BI.inherit(BI.Widget, { + _defaultConfig: function () { + var conf = BI.RichEditorBackgroundChooserTrigger.superclass._defaultConfig.apply(this, arguments); + return BI.extend(conf, { + width: 20, + height: 20 + }); + }, + + _init: function () { + BI.RichEditorBackgroundChooserTrigger.superclass._init.apply(this, arguments); + this.font = BI.createWidget({ + type: "bi.icon_button", + cls: "text-background-font" + }); + + this.underline = BI.createWidget({ + type: "bi.icon_button", + cls: "text-color-underline-font" + }); + + BI.createWidget({ + type: "bi.absolute", + element: this, + items: [{ + el: this.font, + top: 2, + left: 2 + }, { + el: this.underline, + top: 7, + left: 2 + }] + }) + }, + + setValue: function (color) { + this.underline.element.css("color", color); + }, + + getValue: function () { + return this.font.element.css("color"); + } +}); BI.shortcut('bi.rich_editor_background_color_chooser_trigger', BI.RichEditorBackgroundChooserTrigger);/** * * Created by GUY on 2015/11/26. @@ -42668,214 +42668,214 @@ BI.RichEditorUnderlineButton = BI.inherit(BI.RichEditorAction, { this.underline.setSelected(false); }, }); -BI.shortcut("bi.rich_editor_underline_button", BI.RichEditorUnderlineButton)/** - * 颜色选择trigger - * - * Created by GUY on 2015/11/26. - * @class BI.RichEditorColorChooserTrigger - * @extends BI.Widget - */ -BI.RichEditorColorChooserTrigger = BI.inherit(BI.Widget, { - _defaultConfig: function () { - var conf = BI.RichEditorColorChooserTrigger.superclass._defaultConfig.apply(this, arguments); - return BI.extend(conf, { - width: 20, - height: 20 - }); - }, - - _init: function () { - BI.RichEditorColorChooserTrigger.superclass._init.apply(this, arguments); - this.font = BI.createWidget({ - type: "bi.icon_button", - cls: "text-color-font" - }); - - this.underline = BI.createWidget({ - type: "bi.icon_button", - cls: "text-color-underline-font" - }); - - BI.createWidget({ - type: "bi.absolute", - element: this, - items: [{ - el: this.font, - top: 2, - left: 2 - }, { - el: this.underline, - top: 7, - left: 2 - }] - }) - }, - - setValue: function (color) { - this.underline.element.css("color", color); - }, - - getValue: function () { - return this.font.element.css("color"); - } -}); -BI.shortcut('bi.rich_editor_color_chooser_trigger', BI.RichEditorColorChooserTrigger);/** - * 颜色选择 - * - * Created by GUY on 2015/11/26. - * @class BI.RichEditorBackgroundColorChooser - * @extends BI.RichEditorAction - */ -BI.RichEditorBackgroundColorChooser = BI.inherit(BI.RichEditorAction, { - _defaultConfig: function () { - return BI.extend(BI.RichEditorBackgroundColorChooser.superclass._defaultConfig.apply(this, arguments), { - width: 20, - height: 20, - }); - }, - - _init: function () { - BI.RichEditorBackgroundColorChooser.superclass._init.apply(this, arguments); - var self = this, o = this.options; - this.colorchooser = BI.createWidget({ - type: "bi.color_chooser", - element: this, - width: o.width, - height: o.height, - el: { - type: "bi.rich_editor_background_color_chooser_trigger", - title: BI.i18nText("BI-Widget_Background_Colour"), - cls: "text-toolbar-button" - } - }); - this.colorchooser.on(BI.ColorChooser.EVENT_CHANGE, function () { - var backgroundColor = this.getValue(); - o.editor.element.css({ - backgroundColor: backgroundColor, - color: BI.DOM.getContrastColor(backgroundColor) - }); - this.setValue(""); - }); - }, - - deactivate: function () { - } -}); -BI.shortcut('bi.rich_editor_background_color_chooser', BI.RichEditorBackgroundColorChooser);/** - * 颜色选择 - * - * Created by GUY on 2015/11/26. - * @class BI.RichEditorColorChooser - * @extends BI.RichEditorAction - */ -BI.RichEditorColorChooser = BI.inherit(BI.RichEditorAction, { - _defaultConfig: function () { - return BI.extend(BI.RichEditorColorChooser.superclass._defaultConfig.apply(this, arguments), { - width: 20, - height: 20, - command: "foreColor" - }); - }, - - _init: function () { - BI.RichEditorColorChooser.superclass._init.apply(this, arguments); - var self = this, o = this.options; - this.colorchooser = BI.createWidget({ - type: "bi.color_chooser", - element: this, - width: o.width, - height: o.height, - el: { - type: "bi.rich_editor_color_chooser_trigger", - title: BI.i18nText("BI-Font_Colour"), - cls: "text-toolbar-button" - } - }); - this.colorchooser.on(BI.ColorChooser.EVENT_CHANGE, function () { - self.doCommand(this.getValue()); - }); - - }, - - deactivate: function () { - this.colorchooser.setValue(""); - } -}); -BI.shortcut('bi.rich_editor_color_chooser', BI.RichEditorColorChooser);/** - * 字体大小选择 - * - * Created by GUY on 2015/11/26. - * @class BI.RichEditorSizeChooser - * @extends BI.RichEditorAction - */ -BI.RichEditorSizeChooser = BI.inherit(BI.RichEditorAction, { - _defaultConfig: function () { - return BI.extend(BI.RichEditorSizeChooser.superclass._defaultConfig.apply(this, arguments), { - baseCls: "bi-rich-editor-size-chooser bi-border bi-card", - command: "FontSize", - width: 50, - height: 20 - }); - }, - - _items: [{ - value: 1, - text: "1(8pt)" - }, { - value: 2, - text: "2(10pt)" - }, { - value: 3, - text: "3(12pt)" - }, { - value: 4, - text: "4(14pt)" - }, { - value: 5, - text: "5(18pt)" - }, { - value: 6, - text: "6(24pt)" - }], - - _init: function () { - BI.RichEditorSizeChooser.superclass._init.apply(this, arguments); - var self = this, o = this.options; - this.trigger = BI.createWidget({ - type: "bi.text_trigger", - readonly: true, - height: o.height, - triggerWidth: 16, - text: BI.i18nText("BI-Font_Size") - }); - - this.combo = BI.createWidget({ - type: "bi.combo", - element: this, - el: this.trigger, - adjustLength: 1, - popup: { - maxWidth: 70, - minWidth: 70, - el: { - type: "bi.button_group", - items: BI.createItems(this._items, { - type: "bi.single_select_item" - }), - layouts: [{ - type: "bi.vertical" - }] - } - } - }); - this.combo.on(BI.Combo.EVENT_CHANGE, function () { - var val = this.getValue()[0]; - self.doCommand(val); - this.hideView(); - this.setValue([]); - }) - } -}); +BI.shortcut("bi.rich_editor_underline_button", BI.RichEditorUnderlineButton)/** + * 颜色选择trigger + * + * Created by GUY on 2015/11/26. + * @class BI.RichEditorColorChooserTrigger + * @extends BI.Widget + */ +BI.RichEditorColorChooserTrigger = BI.inherit(BI.Widget, { + _defaultConfig: function () { + var conf = BI.RichEditorColorChooserTrigger.superclass._defaultConfig.apply(this, arguments); + return BI.extend(conf, { + width: 20, + height: 20 + }); + }, + + _init: function () { + BI.RichEditorColorChooserTrigger.superclass._init.apply(this, arguments); + this.font = BI.createWidget({ + type: "bi.icon_button", + cls: "text-color-font" + }); + + this.underline = BI.createWidget({ + type: "bi.icon_button", + cls: "text-color-underline-font" + }); + + BI.createWidget({ + type: "bi.absolute", + element: this, + items: [{ + el: this.font, + top: 2, + left: 2 + }, { + el: this.underline, + top: 7, + left: 2 + }] + }) + }, + + setValue: function (color) { + this.underline.element.css("color", color); + }, + + getValue: function () { + return this.font.element.css("color"); + } +}); +BI.shortcut('bi.rich_editor_color_chooser_trigger', BI.RichEditorColorChooserTrigger);/** + * 颜色选择 + * + * Created by GUY on 2015/11/26. + * @class BI.RichEditorBackgroundColorChooser + * @extends BI.RichEditorAction + */ +BI.RichEditorBackgroundColorChooser = BI.inherit(BI.RichEditorAction, { + _defaultConfig: function () { + return BI.extend(BI.RichEditorBackgroundColorChooser.superclass._defaultConfig.apply(this, arguments), { + width: 20, + height: 20, + }); + }, + + _init: function () { + BI.RichEditorBackgroundColorChooser.superclass._init.apply(this, arguments); + var self = this, o = this.options; + this.colorchooser = BI.createWidget({ + type: "bi.color_chooser", + element: this, + width: o.width, + height: o.height, + el: { + type: "bi.rich_editor_background_color_chooser_trigger", + title: BI.i18nText("BI-Widget_Background_Colour"), + cls: "text-toolbar-button" + } + }); + this.colorchooser.on(BI.ColorChooser.EVENT_CHANGE, function () { + var backgroundColor = this.getValue(); + o.editor.element.css({ + backgroundColor: backgroundColor, + color: BI.DOM.getContrastColor(backgroundColor) + }); + this.setValue(""); + }); + }, + + deactivate: function () { + } +}); +BI.shortcut('bi.rich_editor_background_color_chooser', BI.RichEditorBackgroundColorChooser);/** + * 颜色选择 + * + * Created by GUY on 2015/11/26. + * @class BI.RichEditorColorChooser + * @extends BI.RichEditorAction + */ +BI.RichEditorColorChooser = BI.inherit(BI.RichEditorAction, { + _defaultConfig: function () { + return BI.extend(BI.RichEditorColorChooser.superclass._defaultConfig.apply(this, arguments), { + width: 20, + height: 20, + command: "foreColor" + }); + }, + + _init: function () { + BI.RichEditorColorChooser.superclass._init.apply(this, arguments); + var self = this, o = this.options; + this.colorchooser = BI.createWidget({ + type: "bi.color_chooser", + element: this, + width: o.width, + height: o.height, + el: { + type: "bi.rich_editor_color_chooser_trigger", + title: BI.i18nText("BI-Font_Colour"), + cls: "text-toolbar-button" + } + }); + this.colorchooser.on(BI.ColorChooser.EVENT_CHANGE, function () { + self.doCommand(this.getValue()); + }); + + }, + + deactivate: function () { + this.colorchooser.setValue(""); + } +}); +BI.shortcut('bi.rich_editor_color_chooser', BI.RichEditorColorChooser);/** + * 字体大小选择 + * + * Created by GUY on 2015/11/26. + * @class BI.RichEditorSizeChooser + * @extends BI.RichEditorAction + */ +BI.RichEditorSizeChooser = BI.inherit(BI.RichEditorAction, { + _defaultConfig: function () { + return BI.extend(BI.RichEditorSizeChooser.superclass._defaultConfig.apply(this, arguments), { + baseCls: "bi-rich-editor-size-chooser bi-border bi-card", + command: "FontSize", + width: 50, + height: 20 + }); + }, + + _items: [{ + value: 1, + text: "1(8pt)" + }, { + value: 2, + text: "2(10pt)" + }, { + value: 3, + text: "3(12pt)" + }, { + value: 4, + text: "4(14pt)" + }, { + value: 5, + text: "5(18pt)" + }, { + value: 6, + text: "6(24pt)" + }], + + _init: function () { + BI.RichEditorSizeChooser.superclass._init.apply(this, arguments); + var self = this, o = this.options; + this.trigger = BI.createWidget({ + type: "bi.text_trigger", + readonly: true, + height: o.height, + triggerWidth: 16, + text: BI.i18nText("BI-Font_Size") + }); + + this.combo = BI.createWidget({ + type: "bi.combo", + element: this, + el: this.trigger, + adjustLength: 1, + popup: { + maxWidth: 70, + minWidth: 70, + el: { + type: "bi.button_group", + items: BI.createItems(this._items, { + type: "bi.single_select_item" + }), + layouts: [{ + type: "bi.vertical" + }] + } + } + }); + this.combo.on(BI.Combo.EVENT_CHANGE, function () { + var val = this.getValue()[0]; + self.doCommand(val); + this.hideView(); + this.setValue([]); + }) + } +}); BI.shortcut('bi.rich_editor_size_chooser', BI.RichEditorSizeChooser);/** * 富文本编辑器 * diff --git a/dist/demo.js b/dist/demo.js index 9548abe22e..432562092b 100644 --- a/dist/demo.js +++ b/dist/demo.js @@ -8890,1211 +8890,1211 @@ BI.shortcut("demo.vtape", Demo.VtapeLayout);Demo.Face = BI.inherit(BI.Widget, { this._runGlobalStyle(); } }); -BI.shortcut("demo.face", Demo.Face);//change函数 -ChangeView = BI.inherit(BI.View, { - _defaultConfig: function(){ - return BI.extend(ChangeView.superclass._defaultConfig.apply(this, arguments),{ - baseCls: "bi-change" - }) - }, - - _init: function(){ - ChangeView.superclass._init.apply(this, arguments); - }, - - change: function(changed){ - if(changed.child){ - this._showModelData(); - } - if(changed.superiors){ - this._showModelData(); - } - }, - - _showModelData: function(){ - this.outerText.setText("父级Model层数据: " + JSON.stringify(this.model.toJSON())); - }, - - _createOuter: function(){ - this.outerText = BI.createWidget({ - type: "bi.label", - cls: "outer-text", - whiteSpace: "normal" - }); - - return BI.createWidget({ - type: "bi.border", - items: { - north: { - el: this.outerText, - height: 50 - }, - center: this._createInner() - } - }); - }, - - _createInner: function(){ - var innerPane = BI.createWidget({ - type: "bi.absolute", - cls: "inner" - }); - this.addSubVessel("innerPane", innerPane, { - defaultShowName: "inner" - }); - return innerPane; - }, - - render: function(vessel){ - BI.createWidget({ - type: "bi.center", - element: vessel, - items: [this._createOuter()], - hgap: 100, - vgap: 100 - }); - - this._showModelData(); - }, - - refresh: function(){ - this.skipTo("inner", "innerPane", "superiors"); - } -}); - -ChangeModel = BI.inherit(BI.Model, { - _defaultConfig: function(){ - return BI.extend(ChangeModel.superclass._defaultConfig.apply(this, arguments),{ - superiors: { - child: "default" - }, - child: "default" - }) - }, - - _init: function(){ - ChangeModel.superclass._init.apply(this, arguments); - }, - - change: function(changed){ - if(changed.superiors){ - this.set("child", changed.superiors.child); - } - } -}); - -//ChangeView 的子级 -ChangeInnerView = BI.inherit(BI.View, { - _init: function(){ - ChangeInnerView.superclass._init.apply(this, arguments); - }, - - change: function(changed){ - if(changed.child){ - this._showModelData(); - } - }, - - _createOuter: function(){ - var self = this; - this.text = BI.createWidget({ - type: "bi.label", - height: 26 - }); - - this.buttons = BI.createWidget({ - type: "bi.button_group", - items: BI.createItems(this.model.get("items"), { - type: "bi.text_button", - height: 30, - textAlign: "center", - hgap: 20 - }) - }); - - this.buttons.on(BI.ButtonGroup.EVENT_CHANGE, function(){ - self.model.set("child", this.getValue()[0]); - }); - - return BI.createWidget({ - type: "bi.vertical", - vgap: 20, - items: [{ - type: "bi.center", - items: [this.buttons], - height: 30 - }, this.text] - }); - }, - - _showModelData: function(){ - this.text.setText("子级Model层数据: " + JSON.stringify(this.model.toJSON())); - }, - - render: function(vessel){ - BI.createWidget({ - type: "bi.center", - element: vessel, - items: [this._createOuter()] - }); - this._showModelData(); - } -}); - - -ChangeInnerModel = BI.inherit(BI.Model, { - _defaultConfig: function(){ - return BI.extend(ChangeInnerModel.superclass._defaultConfig.apply(this, arguments),{ - - }) - }, - - _static: function(){ - return { - items: [{ - text: "Type-1", - value: "First", - cls: "type-first mvc-button" - }, { - text: "Type-2", - value: "Second", - cls: "type-second mvc-button" - }, { - text: "Type-3", - value: "third", - cls: "type-third mvc-button" - }] - } - }, - - _init: function(){ - ChangeInnerModel.superclass._init.apply(this, arguments); - } - -}); - -Demo.Func = BI.inherit(BI.Widget, { - render: function () { - var view = BI.View.createView("/change", {}, { - element: this - }); - view.populate(); - }, - - mounted: function () { - } -}); -BI.shortcut("demo.change", Demo.Func);//local函数 -LocalView = BI.inherit(BI.View, { - _defaultConfig: function(){ - return BI.extend(LocalView.superclass._defaultConfig.apply(this, arguments),{ - baseCls: "bi-local" - }) - }, - - _init: function(){ - LocalView.superclass._init.apply(this, arguments); - this.buttons = {}; - }, - - _addElement2Vessel: function(id){ - var self = this; - this.buttons[id] = this.elementVessel.addItem({ - type: "bi.text_button", - text: "Button:" + id, - width: 180, - height: 22, - cls: "delete-button button", - handler: function(){ - self.set("delete", id); - } - }) - }, - - _deleteElement: function(id){ - this.buttons[id] && this.buttons[id].destroy(); - delete this.buttons[id]; - }, - - _createTop: function(){ - var self = this; - this.elementVessel = BI.createWidget({ - type: "bi.left", - height: 200, - cls: "vessel-border", - scrollable: true, - vgap: 10, - hgap: 10 - }); - - return BI.createWidget({ - type: "bi.vertical", - items: [ - { - el: { - type: "bi.text_button", - text: "点击添加元素", - cls: "top-button", - handler: function(){ - self.model.set("add", true); - }, - height: 30 - } - }, - this.elementVessel - ] - }) - }, - - _showModelData: function(){ - this.text.setText(JSON.stringify(this.model.toJSON())); - }, - - _createCenter: function(){ - var modelData = BI.createWidget({ - type: "bi.center", - vgap: 10, - hgap: 10, - cls: "vessel-border", - height: 200, - items: [{ - el: this.text = BI.createWidget({ - type: "bi.label", - hgap: 30, - textHeight: 30, - whiteSpace: "normal" - }) - }] - }); - - return BI.createWidget({ - type: "bi.vertical", - items: [ - { - el: { - type: "bi.label", - cls: "bottom-label", - text: "Model层数据", - height: 30 - } - }, - modelData - ] - }) - }, - - render: function(vessel){ - BI.createWidget({ - type: "bi.vertical", - element: vessel, - items: [{ - el :this._createTop() - },{ - el : this._createCenter() - }], - hgap: 50, - vgap: 20 - }); - - this._showModelData(); - }, - - local: function(){ - if(this.model.has("add")){ - var add = this.model.get("add"); - this._addElement2Vessel(this.model.getEditing()); - this._showModelData(); - return true; - } - if(this.model.has("delete")){ - var id = this.model.get("delete"); - this._deleteElement(id); - this._showModelData(); - return true; - } - return false; - } -}); - -LocalModel = BI.inherit(BI.Model, { - _defaultConfig: function(){ - return BI.extend(LocalModel.superclass._defaultConfig.apply(this, arguments),{ - - }) - }, - - _init: function(){ - LocalModel.superclass._init.apply(this, arguments); - }, - - local: function(){ - if(this.has("add")){ - this.get("add"); - var id = BI.UUID(); - this.set(id, "这是新增的属性:"+id); - this.setEditing(id); - return true; - } - if(this.has("delete")){ - var id = this.get("delete"); - this.unset(id); - return true; - } - return false; - } - -}); - -Demo.Func = BI.inherit(BI.Widget, { - render: function () { - var view = BI.View.createView("/local", {}, { - element: this - }); - view.populate(); - }, - - mounted: function () { - } -}); -BI.shortcut("demo.local", Demo.Func);//set、get函数 -SetGetView = BI.inherit(BI.View, { - _defaultConfig: function () { - return BI.extend(SetGetView.superclass._defaultConfig.apply(this, arguments), { - baseCls: "bi-set-get" - }) - }, - - _init: function () { - SetGetView.superclass._init.apply(this, arguments); - }, - - change: function (changed) { - this._showModelData(); - }, - - _createLeft: function () { - var self = this; - return (this.left = BI.createWidget({ - type: "bi.border", - items: { - north: { - el: { - type: "bi.label", - cls: "left-title", - text: "get、set用法:", - height: 30 - }, - height: 30 - }, - center: { - el: { - type: "bi.button_group", - items: BI.createItems(this.model.get("arr"), { - type: "bi.text_button", - cls: "left-nav", - height: 30, - handler: function (v) { - self.model.set("click", v); - } - }), - layouts: [{ - type: "bi.vertical" - }] - } - } - } - })) - }, - - _showModelData: function () { - this.text.setText(JSON.stringify(this.model.toJSON())); - }, - - _createRight: function () { - return (this.right = BI.createWidget({ - type: "bi.border", - items: { - north: { - el: { - type: "bi.label", - cls: "right-title", - text: "Model层数据", - height: 30 - }, - height: 30 - }, - center: { - el: this.text = BI.createWidget({ - type: "bi.label", - whiteSpace: "normal", - textHeight: 50 - }) - } - } - })) - }, - - render: function (vessel) { - BI.createWidget({ - type: "bi.center", - element: vessel, - items: [{ - el: this._createLeft() - }, { - el: this._createRight() - }], - hgap: 50, - vgap: 100 - }) - this._showModelData(); - } -}) - -SetGetModel = BI.inherit(BI.Model, { - _defaultConfig: function () { - return BI.extend(SetGetModel.superclass._defaultConfig.apply(this, arguments), { - arr: [ - {text: "item1", value: 1}, - {text: "item2", value: 2}, - {text: "item3", value: 3}, - {text: "item4", value: 4}, - {text: "item5", value: 5}, - {text: "item6", value: 6}, - {text: "item7", value: 7}, - {text: "item8", value: 8} - ] - }) - }, - - _init: function () { - SetGetModel.superclass._init.apply(this, arguments); - } - -}) - - -Demo.Func = BI.inherit(BI.Widget, { - render: function () { - var view = BI.View.createView("/setget", {}, { - element: this - }); - view.populate(); - }, - - mounted: function () { - } -}); -BI.shortcut("demo.setget", Demo.Func);//skipTo 函数 -SkipToView = BI.inherit(BI.View, { - _defaultConfig: function(){ - return BI.extend(SkipToView.superclass._defaultConfig.apply(this, arguments),{ - baseCls: "bi-skip-to" - }) - }, - - _init: function(){ - SkipToView.superclass._init.apply(this, arguments); - }, - - _createNav: function(){ - var self = this; - var nav = BI.createWidget({ - type: "bi.button_group", - cls: "top-nav", - items: BI.createItems(this.model.get("items"), { - type: "bi.text_button", - height: 30, - textAlign: "center", - hgap: 20 - }), - layouts: [{ - type: "bi.left", - height: 40, - vgap: 5, - hgap: 3 - }] - }); - nav.on(BI.ButtonGroup.EVENT_CHANGE, function(){ - self.skipTo(this.getValue()[0], "pane", this.getValue()[0]); - }); - return nav; - }, - - _createPane: function(){ - var pane = BI.createWidget({ - type:"bi.center", - cls: "center-pane", - height: 200 - }); - this.addSubVessel("pane", pane, { - defaultShowName: "green" - }); - return pane; - }, - - render: function(vessel){ - BI.createWidget({ - type: "bi.vertical", - element: vessel, - items: [this._createNav(), this._createPane()], - vgap: 10, - hgap: 10 - }) - }, - - refresh: function(){ - this.skipTo("green", "pane", "green"); - } -}); - -SkipToModel = BI.inherit(BI.Model, { - _defaultConfig: function(){ - return BI.extend(SkipToModel.superclass._defaultConfig.apply(this, arguments),{ - "red": { - text: "hotpink" - },"blue": { - text: "cornflowerblue" - },"green": { - text: "darkcyan" - },"yellow": { - text: "darkgoldenrod" - } - }) - }, - _static: function(){ - return { - items: [{ - text: "hotpink", - value: "red", - cls: "red-pane mvc-button" - }, { - text: "cornflowerblue", - value: "blue", - cls: "blue-pane mvc-button" - }, { - text: "darkcyan", - value: "green", - cls: "green-pane mvc-button", - selected: true - }, { - text: "darkgoldenrod", - value: "yellow", - cls: "yellow-pane mvc-button" - }] - } - }, - - _init: function(){ - SkipToModel.superclass._init.apply(this, arguments); - } -}); - -//Red pane #FF69B4 -SkipToRedView = BI.inherit(BI.View, { - _init: function(){ - SkipToRedView.superclass._init.apply(this, arguments); - }, - - render: function(vessel){ - BI.createWidget({ - type: "bi.absolute", - element: vessel, - cls: "red-pane", - items: [{ - el: { - type: "bi.label", - text: "Model Data: " + JSON.stringify(this.model.toJSON()), - hgap: 20, - height: 26 - } - }] - }) - } - -}); - -SkipToRedModel = BI.inherit(BI.Model, { - _defaultConfig: function(){ - return BI.extend(SetGetModel.superclass._defaultConfig.apply(this, arguments),{ - - }) - }, - - _init: function(){ - SkipToRedModel.superclass._init.apply(this, arguments); - } -}); - -//Blue pane #6495ED -SkipToBlueView = BI.inherit(BI.View, { - _init: function(){ - SkipToBlueView.superclass._init.apply(this, arguments); - }, - - render: function(vessel){ - BI.createWidget({ - type: "bi.absolute", - element: vessel, - cls: "blue-pane", - items: [{ - el: { - type: "bi.label", - text: "Model Data: " + JSON.stringify(this.model.toJSON()), - hgap: 20, - height: 26 - }, - left: 0, - right: 0, - top: 0, - bottom: 0 - }] - }) - } -}); - -SkipToBlueModel = BI.inherit(BI.Model, { - _defaultConfig: function(){ - return BI.extend(SetGetModel.superclass._defaultConfig.apply(this, arguments),{ - }) - }, - - _init: function(){ - SkipToGreenModel.superclass._init.apply(this, arguments); - } -}); - -//Dark green pane #008B8B -SkipToGreenView = BI.inherit(BI.View, { - _init: function(){ - SkipToGreenView.superclass._init.apply(this, arguments); - }, - - render: function(vessel){ - BI.createWidget({ - type: "bi.absolute", - element: vessel, - cls: "green-pane", - items: [{ - el:{ - type: "bi.label", - text: "Model Data: " + JSON.stringify(this.model.toJSON()), - hgap: 20, - height: 26 - }, - left: 0, - right: 0, - top: 0, - bottom: 0 - }] - }) - } -}); - -SkipToGreenModel = BI.inherit(BI.Model, { - _defaultConfig: function(){ - return BI.extend(SetGetModel.superclass._defaultConfig.apply(this, arguments),{ - }) - }, - - _init: function(){ - SkipToGreenModel.superclass._init.apply(this, arguments); - } -}); - -//Dark yellow pane #B8860B -SkipToYellowView = BI.inherit(BI.View, { - _init: function(){ - SkipToYellowView.superclass._init.apply(this, arguments); - }, - - render: function(vessel){ - BI.createWidget({ - type: "bi.absolute", - element: vessel, - cls: "yellow-pane", - items: [{ - el:{ - type: "bi.label", - text: "Model Data: " + JSON.stringify(this.model.toJSON()), - hgap: 20, - height: 26 - }, - left: 0, - right: 0, - top: 0, - bottom: 0 - }] - }) - } -}); - -SkipToYellowModel = BI.inherit(BI.Model, { - _defaultConfig: function(){ - return BI.extend(SetGetModel.superclass._defaultConfig.apply(this, arguments),{ - }) - }, - - _init: function(){ - SkipToYellowModel.superclass._init.apply(this, arguments); - } -}); - -Demo.Func = BI.inherit(BI.Widget, { - render: function () { - var view = BI.View.createView("/skipTo", {}, { - element: this - }); - view.populate(); - }, - - mounted: function () { - } -}); -BI.shortcut("demo.skipTo", Demo.Func); -//splice和duplicate函数 -SpliceDuplicateView = BI.inherit(BI.View, { - _defaultConfig: function () { - return BI.extend(SpliceDuplicateView.superclass._defaultConfig.apply(this, arguments), { - baseCls: "bi-splice-duplicate" - }) - }, - - _init: function () { - SpliceDuplicateView.superclass._init.apply(this, arguments); - this.children = {}; - }, - - splice: function (old, key1, key2) { - this.children[key1].destroy(); - delete this.children[key1]; - this._showModelData(); - }, - - duplicate: function (copy, key1, key2) { - this.add(copy); - this._showModelData(); - }, - - _showModelData: function () { - //这里只是为了输出this.model.data 原则上是不允许这么调用的 - this.text.setText("父级数据：" + JSON.stringify(this.model.data)); - }, - - render: function (vessel) { - this.text = BI.createWidget({ - type: "bi.label", - height: 50, - cls: "superiors-label" - }); - this.container = BI.createWidget({ - type: "bi.vertical", - element: vessel, - items: [this.text], - hgap: 100, - vgap: 10 - }); - this._showModelData(); - }, - - add: function (id) { - this.children[id] = BI.createWidget({ - type: "bi.center", - hgap: 10, - vgap: 10 - }); - this.addSubVessel(id, this.children[id], { - defaultShowName: "sdSub" - }); - this.skipTo("sdSub", id, id); - this.container.addItem(this.children[id]); - }, - - refresh: function () { - var self = this; - BI.each(this.model.toJSON(), function (key, value) { - if (!self.children[key]) { - self.add(key); - } - }) - } -}); - -SpliceDuplicateModel = BI.inherit(BI.Model, { - _defaultConfig: function () { - return BI.extend(SpliceDuplicateModel.superclass._defaultConfig.apply(this, arguments), { - "1": { - name: "名字" - } - }) - }, - - splice: function (key1) { - delete this.data[key1]; - }, - - similar: function (value, key1) { - value.name = BI.Func.createDistinctName(this.data, this.get(key1).name); - return value; - }, - - duplicate: function (copy, key1) { - this.data[copy] = this.get(copy); - }, - - _init: function () { - SpliceDuplicateModel.superclass._init.apply(this, arguments); - }, - - refresh: function () { - this.data = BI.deepClone(this.toJSON()); - } -}); - -SDSubView = BI.inherit(BI.View, { - _defaultConfig: function () { - return SDSubView.superclass._defaultConfig.apply(this, arguments); - }, - - _init: function () { - SDSubView.superclass._init.apply(this, arguments); - }, - - render: function (vessel) { - var self = this; - BI.createWidget({ - type: "bi.center", - element: vessel, - cls: "sd-child", - height: 30, - items: [{ - type: "bi.text_button", - height: 30, - text: "复制 " + this.model.get("name") + " , 数据：" + JSON.stringify(this.model.toJSON()), - cls: "right-button-add", - handler: function () { - self.model.copy(); - } - }, { - type: "bi.text_button", - height: 30, - text: "删除", - cls: "right-button-del", - handler: function () { - self.model.destroy(); - } - }] - }) - } -}); - -SDSubModel = BI.inherit(BI.Model, { - _defaultConfig: function () { - return BI.extend(SDSubModel.superclass._defaultConfig.apply(this, arguments), {}); - }, - - _init: function () { - SDSubModel.superclass._init.apply(this, arguments); - } -}); - -Demo.Func = BI.inherit(BI.Widget, { - render: function () { - var view = BI.View.createView("/spliceDuplicate", {}, { - element: this - }); - view.populate(); - }, - - mounted: function () { - } -}); -BI.shortcut("demo.spliceDuplicate", Demo.Func); -TmpView = BI.inherit(BI.View, { - _defaultConfig: function(){ - return BI.extend(TmpView.superclass._defaultConfig.apply(this, arguments),{ - baseCls: "bi-tmp" - }) - }, - - _init: function(){ - TmpView.superclass._init.apply(this, arguments); - }, - - change: function(changed){ - if(changed.data1){ - this._showModelData(); - } - }, - - _showModelData: function(){ - this.text.setText("父级Model层数据为："+JSON.stringify(this.model.toJSON())); - }, - - _createMain: function(){ - var self = this; - return BI.createWidget({ - type: "bi.border", - items: { - west: { - el: { - type: "bi.vertical", - vgap: 10, - items: [{ - el: (this.text = BI.createWidget({ - type: "bi.label", - whiteSpace: "normal" - })) - }, { - el: { - type: "bi.text_button", - cls: "tmp-button mvc-button", - text: "点击触发事件tmp('data1', {child: {type: {value: \"临时数据\"}}})", - height: 30, - handler: function(){ - self.model.tmp("data1", { - child: { - type: { - value: "临时数据" - } - } - }) - } - } - }, { - el: { - type: "bi.text_button", - cls: "tmp-button mvc-button", - text: "点击触发事件submit", - height: 30, - handler: function(){ - self.model.submit(); - } - } - }, { - el: { - type: "bi.text_button", - cls: "tmp-button mvc-button", - text: "点击跳转到右方", - height: 30, - handler: function(){ - self.addSubVessel("test", self.center).skipTo("child", "test", "data1"); - } - } - }] - }, - width: 200 - }, - center: { - el: (this.center = BI.createWidget()) - } - } - }) - }, - - render: function(vessel){ - BI.createWidget({ - type: "bi.center", - element: vessel, - items: [{ - el: this._createMain() - }], - hgap: 50, - vgap: 100 - }) - }, - - refresh: function(){ - this._showModelData(); - } -}) - -TmpModel = BI.inherit(BI.Model, { - _defaultConfig: function(){ - return BI.extend(TmpModel.superclass._defaultConfig.apply(this, arguments),{ - data1: { - child: { - type: { - value: "这是一个测试数据" - } - } - }, - data2: "test" - }) - }, - - _init: function(){ - TmpModel.superclass._init.apply(this, arguments); - } - -}) - -TmpChildView = BI.inherit(BI.View, { - _defaultConfig: function(){ - return BI.extend(TmpChildView.superclass._defaultConfig.apply(this, arguments),{ - baseCls: "bi-tmp-child" - }) - }, - - _init: function(){ - TmpChildView.superclass._init.apply(this, arguments); - }, - - change: function(changed){ - if(changed.child){ - this._showModelData(); - } - }, - - _showModelData: function(){ - this.text.setText("子级Model层数据为："+JSON.stringify(this.model.toJSON())); - }, - - _createMain: function(){ - var self = this; - return BI.createWidget({ - type: "bi.border", - items: { - west: { - el: { - type: "bi.vertical", - vgap: 10, - items: [{ - el: (this.text = BI.createWidget({ - type: "bi.label", - whiteSpace: "normal" - })) - }, { - el: { - type: "bi.text_button", - cls: "tmp-button mvc-button", - text: "点击触发事件set", - height: 30, - handler: function(){ - self.set("child", { - type: { - value: "值改变了" - } - }) - } - } - }, { - el: { - type: "bi.text_button", - cls: "tmp-button mvc-button", - text: "点击跳转到右方", - height: 30, - handler: function(){ - self.addSubVessel("test", self.center).skipTo("child", "test", "child"); - } - } - }] - }, - width: 200 - }, - center: { - el: (this.center = BI.createWidget()) - } - } - }) - }, - - render: function(vessel){ - BI.createWidget({ - type: "bi.center", - element: vessel, - items: [{ - el: this._createMain() - }], - hgap: 50 - }) - }, - - refresh: function(){ - this._showModelData(); - } -}) - -TmpChildModel = BI.inherit(BI.Model, { - _defaultConfig: function(){ - return BI.extend(TmpChildModel.superclass._defaultConfig.apply(this, arguments),{ - - }) - }, - - _init: function(){ - TmpChildModel.superclass._init.apply(this, arguments); - } - -}) -TmpChildChildView = BI.inherit(BI.View, { - _defaultConfig: function(){ - return BI.extend(TmpChildChildView.superclass._defaultConfig.apply(this, arguments),{ - baseCls: "bi-tmp-child-child" - }) - }, - - _init: function(){ - TmpChildChildView.superclass._init.apply(this, arguments); - }, - - change: function(changed){ - if(changed.type){ - this._showModelData(); - } - }, - - _showModelData: function(){ - this.text.setText("叶节点数据为："+JSON.stringify(this.model.toJSON())); - }, - - _createMain: function(){ - return (this.text = BI.createWidget({ - type: "bi.label", - whiteSpace: "normal" - })) - }, - - render: function(vessel){ - BI.createWidget({ - type: "bi.center", - element: vessel, - items: [{ - el: this._createMain() - }], - hgap: 50 - }) - }, - - refresh: function(){ - this._showModelData(); - } -}) - -TmpChildChildModel = BI.inherit(BI.Model, { - _defaultConfig: function(){ - return BI.extend(TmpChildChildModel.superclass._defaultConfig.apply(this, arguments),{ - - }) - }, - - _init: function(){ - TmpChildChildModel.superclass._init.apply(this, arguments); - } - -}) - -Demo.Func = BI.inherit(BI.Widget, { - render: function () { - var view = BI.View.createView("/tmp", {}, { - element: this - }); - view.populate(); - }, - - mounted: function () { - } -}); -BI.shortcut("demo.tmp", Demo.Func); +BI.shortcut("demo.face", Demo.Face);//change函数 +ChangeView = BI.inherit(BI.View, { + _defaultConfig: function(){ + return BI.extend(ChangeView.superclass._defaultConfig.apply(this, arguments),{ + baseCls: "bi-change" + }) + }, + + _init: function(){ + ChangeView.superclass._init.apply(this, arguments); + }, + + change: function(changed){ + if(changed.child){ + this._showModelData(); + } + if(changed.superiors){ + this._showModelData(); + } + }, + + _showModelData: function(){ + this.outerText.setText("父级Model层数据: " + JSON.stringify(this.model.toJSON())); + }, + + _createOuter: function(){ + this.outerText = BI.createWidget({ + type: "bi.label", + cls: "outer-text", + whiteSpace: "normal" + }); + + return BI.createWidget({ + type: "bi.border", + items: { + north: { + el: this.outerText, + height: 50 + }, + center: this._createInner() + } + }); + }, + + _createInner: function(){ + var innerPane = BI.createWidget({ + type: "bi.absolute", + cls: "inner" + }); + this.addSubVessel("innerPane", innerPane, { + defaultShowName: "inner" + }); + return innerPane; + }, + + render: function(vessel){ + BI.createWidget({ + type: "bi.center", + element: vessel, + items: [this._createOuter()], + hgap: 100, + vgap: 100 + }); + + this._showModelData(); + }, + + refresh: function(){ + this.skipTo("inner", "innerPane", "superiors"); + } +}); + +ChangeModel = BI.inherit(BI.Model, { + _defaultConfig: function(){ + return BI.extend(ChangeModel.superclass._defaultConfig.apply(this, arguments),{ + superiors: { + child: "default" + }, + child: "default" + }) + }, + + _init: function(){ + ChangeModel.superclass._init.apply(this, arguments); + }, + + change: function(changed){ + if(changed.superiors){ + this.set("child", changed.superiors.child); + } + } +}); + +//ChangeView 的子级 +ChangeInnerView = BI.inherit(BI.View, { + _init: function(){ + ChangeInnerView.superclass._init.apply(this, arguments); + }, + + change: function(changed){ + if(changed.child){ + this._showModelData(); + } + }, + + _createOuter: function(){ + var self = this; + this.text = BI.createWidget({ + type: "bi.label", + height: 26 + }); + + this.buttons = BI.createWidget({ + type: "bi.button_group", + items: BI.createItems(this.model.get("items"), { + type: "bi.text_button", + height: 30, + textAlign: "center", + hgap: 20 + }) + }); + + this.buttons.on(BI.ButtonGroup.EVENT_CHANGE, function(){ + self.model.set("child", this.getValue()[0]); + }); + + return BI.createWidget({ + type: "bi.vertical", + vgap: 20, + items: [{ + type: "bi.center", + items: [this.buttons], + height: 30 + }, this.text] + }); + }, + + _showModelData: function(){ + this.text.setText("子级Model层数据: " + JSON.stringify(this.model.toJSON())); + }, + + render: function(vessel){ + BI.createWidget({ + type: "bi.center", + element: vessel, + items: [this._createOuter()] + }); + this._showModelData(); + } +}); + + +ChangeInnerModel = BI.inherit(BI.Model, { + _defaultConfig: function(){ + return BI.extend(ChangeInnerModel.superclass._defaultConfig.apply(this, arguments),{ + + }) + }, + + _static: function(){ + return { + items: [{ + text: "Type-1", + value: "First", + cls: "type-first mvc-button" + }, { + text: "Type-2", + value: "Second", + cls: "type-second mvc-button" + }, { + text: "Type-3", + value: "third", + cls: "type-third mvc-button" + }] + } + }, + + _init: function(){ + ChangeInnerModel.superclass._init.apply(this, arguments); + } + +}); + +Demo.Func = BI.inherit(BI.Widget, { + render: function () { + var view = BI.View.createView("/change", {}, { + element: this + }); + view.populate(); + }, + + mounted: function () { + } +}); +BI.shortcut("demo.change", Demo.Func);//local函数 +LocalView = BI.inherit(BI.View, { + _defaultConfig: function(){ + return BI.extend(LocalView.superclass._defaultConfig.apply(this, arguments),{ + baseCls: "bi-local" + }) + }, + + _init: function(){ + LocalView.superclass._init.apply(this, arguments); + this.buttons = {}; + }, + + _addElement2Vessel: function(id){ + var self = this; + this.buttons[id] = this.elementVessel.addItem({ + type: "bi.text_button", + text: "Button:" + id, + width: 180, + height: 22, + cls: "delete-button button", + handler: function(){ + self.set("delete", id); + } + }) + }, + + _deleteElement: function(id){ + this.buttons[id] && this.buttons[id].destroy(); + delete this.buttons[id]; + }, + + _createTop: function(){ + var self = this; + this.elementVessel = BI.createWidget({ + type: "bi.left", + height: 200, + cls: "vessel-border", + scrollable: true, + vgap: 10, + hgap: 10 + }); + + return BI.createWidget({ + type: "bi.vertical", + items: [ + { + el: { + type: "bi.text_button", + text: "点击添加元素", + cls: "top-button", + handler: function(){ + self.model.set("add", true); + }, + height: 30 + } + }, + this.elementVessel + ] + }) + }, + + _showModelData: function(){ + this.text.setText(JSON.stringify(this.model.toJSON())); + }, + + _createCenter: function(){ + var modelData = BI.createWidget({ + type: "bi.center", + vgap: 10, + hgap: 10, + cls: "vessel-border", + height: 200, + items: [{ + el: this.text = BI.createWidget({ + type: "bi.label", + hgap: 30, + textHeight: 30, + whiteSpace: "normal" + }) + }] + }); + + return BI.createWidget({ + type: "bi.vertical", + items: [ + { + el: { + type: "bi.label", + cls: "bottom-label", + text: "Model层数据", + height: 30 + } + }, + modelData + ] + }) + }, + + render: function(vessel){ + BI.createWidget({ + type: "bi.vertical", + element: vessel, + items: [{ + el :this._createTop() + },{ + el : this._createCenter() + }], + hgap: 50, + vgap: 20 + }); + + this._showModelData(); + }, + + local: function(){ + if(this.model.has("add")){ + var add = this.model.get("add"); + this._addElement2Vessel(this.model.getEditing()); + this._showModelData(); + return true; + } + if(this.model.has("delete")){ + var id = this.model.get("delete"); + this._deleteElement(id); + this._showModelData(); + return true; + } + return false; + } +}); + +LocalModel = BI.inherit(BI.Model, { + _defaultConfig: function(){ + return BI.extend(LocalModel.superclass._defaultConfig.apply(this, arguments),{ + + }) + }, + + _init: function(){ + LocalModel.superclass._init.apply(this, arguments); + }, + + local: function(){ + if(this.has("add")){ + this.get("add"); + var id = BI.UUID(); + this.set(id, "这是新增的属性:"+id); + this.setEditing(id); + return true; + } + if(this.has("delete")){ + var id = this.get("delete"); + this.unset(id); + return true; + } + return false; + } + +}); + +Demo.Func = BI.inherit(BI.Widget, { + render: function () { + var view = BI.View.createView("/local", {}, { + element: this + }); + view.populate(); + }, + + mounted: function () { + } +}); +BI.shortcut("demo.local", Demo.Func);//set、get函数 +SetGetView = BI.inherit(BI.View, { + _defaultConfig: function () { + return BI.extend(SetGetView.superclass._defaultConfig.apply(this, arguments), { + baseCls: "bi-set-get" + }) + }, + + _init: function () { + SetGetView.superclass._init.apply(this, arguments); + }, + + change: function (changed) { + this._showModelData(); + }, + + _createLeft: function () { + var self = this; + return (this.left = BI.createWidget({ + type: "bi.border", + items: { + north: { + el: { + type: "bi.label", + cls: "left-title", + text: "get、set用法:", + height: 30 + }, + height: 30 + }, + center: { + el: { + type: "bi.button_group", + items: BI.createItems(this.model.get("arr"), { + type: "bi.text_button", + cls: "left-nav", + height: 30, + handler: function (v) { + self.model.set("click", v); + } + }), + layouts: [{ + type: "bi.vertical" + }] + } + } + } + })) + }, + + _showModelData: function () { + this.text.setText(JSON.stringify(this.model.toJSON())); + }, + + _createRight: function () { + return (this.right = BI.createWidget({ + type: "bi.border", + items: { + north: { + el: { + type: "bi.label", + cls: "right-title", + text: "Model层数据", + height: 30 + }, + height: 30 + }, + center: { + el: this.text = BI.createWidget({ + type: "bi.label", + whiteSpace: "normal", + textHeight: 50 + }) + } + } + })) + }, + + render: function (vessel) { + BI.createWidget({ + type: "bi.center", + element: vessel, + items: [{ + el: this._createLeft() + }, { + el: this._createRight() + }], + hgap: 50, + vgap: 100 + }) + this._showModelData(); + } +}) + +SetGetModel = BI.inherit(BI.Model, { + _defaultConfig: function () { + return BI.extend(SetGetModel.superclass._defaultConfig.apply(this, arguments), { + arr: [ + {text: "item1", value: 1}, + {text: "item2", value: 2}, + {text: "item3", value: 3}, + {text: "item4", value: 4}, + {text: "item5", value: 5}, + {text: "item6", value: 6}, + {text: "item7", value: 7}, + {text: "item8", value: 8} + ] + }) + }, + + _init: function () { + SetGetModel.superclass._init.apply(this, arguments); + } + +}) + + +Demo.Func = BI.inherit(BI.Widget, { + render: function () { + var view = BI.View.createView("/setget", {}, { + element: this + }); + view.populate(); + }, + + mounted: function () { + } +}); +BI.shortcut("demo.setget", Demo.Func);//skipTo 函数 +SkipToView = BI.inherit(BI.View, { + _defaultConfig: function(){ + return BI.extend(SkipToView.superclass._defaultConfig.apply(this, arguments),{ + baseCls: "bi-skip-to" + }) + }, + + _init: function(){ + SkipToView.superclass._init.apply(this, arguments); + }, + + _createNav: function(){ + var self = this; + var nav = BI.createWidget({ + type: "bi.button_group", + cls: "top-nav", + items: BI.createItems(this.model.get("items"), { + type: "bi.text_button", + height: 30, + textAlign: "center", + hgap: 20 + }), + layouts: [{ + type: "bi.left", + height: 40, + vgap: 5, + hgap: 3 + }] + }); + nav.on(BI.ButtonGroup.EVENT_CHANGE, function(){ + self.skipTo(this.getValue()[0], "pane", this.getValue()[0]); + }); + return nav; + }, + + _createPane: function(){ + var pane = BI.createWidget({ + type:"bi.center", + cls: "center-pane", + height: 200 + }); + this.addSubVessel("pane", pane, { + defaultShowName: "green" + }); + return pane; + }, + + render: function(vessel){ + BI.createWidget({ + type: "bi.vertical", + element: vessel, + items: [this._createNav(), this._createPane()], + vgap: 10, + hgap: 10 + }) + }, + + refresh: function(){ + this.skipTo("green", "pane", "green"); + } +}); + +SkipToModel = BI.inherit(BI.Model, { + _defaultConfig: function(){ + return BI.extend(SkipToModel.superclass._defaultConfig.apply(this, arguments),{ + "red": { + text: "hotpink" + },"blue": { + text: "cornflowerblue" + },"green": { + text: "darkcyan" + },"yellow": { + text: "darkgoldenrod" + } + }) + }, + _static: function(){ + return { + items: [{ + text: "hotpink", + value: "red", + cls: "red-pane mvc-button" + }, { + text: "cornflowerblue", + value: "blue", + cls: "blue-pane mvc-button" + }, { + text: "darkcyan", + value: "green", + cls: "green-pane mvc-button", + selected: true + }, { + text: "darkgoldenrod", + value: "yellow", + cls: "yellow-pane mvc-button" + }] + } + }, + + _init: function(){ + SkipToModel.superclass._init.apply(this, arguments); + } +}); + +//Red pane #FF69B4 +SkipToRedView = BI.inherit(BI.View, { + _init: function(){ + SkipToRedView.superclass._init.apply(this, arguments); + }, + + render: function(vessel){ + BI.createWidget({ + type: "bi.absolute", + element: vessel, + cls: "red-pane", + items: [{ + el: { + type: "bi.label", + text: "Model Data: " + JSON.stringify(this.model.toJSON()), + hgap: 20, + height: 26 + } + }] + }) + } + +}); + +SkipToRedModel = BI.inherit(BI.Model, { + _defaultConfig: function(){ + return BI.extend(SetGetModel.superclass._defaultConfig.apply(this, arguments),{ + + }) + }, + + _init: function(){ + SkipToRedModel.superclass._init.apply(this, arguments); + } +}); + +//Blue pane #6495ED +SkipToBlueView = BI.inherit(BI.View, { + _init: function(){ + SkipToBlueView.superclass._init.apply(this, arguments); + }, + + render: function(vessel){ + BI.createWidget({ + type: "bi.absolute", + element: vessel, + cls: "blue-pane", + items: [{ + el: { + type: "bi.label", + text: "Model Data: " + JSON.stringify(this.model.toJSON()), + hgap: 20, + height: 26 + }, + left: 0, + right: 0, + top: 0, + bottom: 0 + }] + }) + } +}); + +SkipToBlueModel = BI.inherit(BI.Model, { + _defaultConfig: function(){ + return BI.extend(SetGetModel.superclass._defaultConfig.apply(this, arguments),{ + }) + }, + + _init: function(){ + SkipToGreenModel.superclass._init.apply(this, arguments); + } +}); + +//Dark green pane #008B8B +SkipToGreenView = BI.inherit(BI.View, { + _init: function(){ + SkipToGreenView.superclass._init.apply(this, arguments); + }, + + render: function(vessel){ + BI.createWidget({ + type: "bi.absolute", + element: vessel, + cls: "green-pane", + items: [{ + el:{ + type: "bi.label", + text: "Model Data: " + JSON.stringify(this.model.toJSON()), + hgap: 20, + height: 26 + }, + left: 0, + right: 0, + top: 0, + bottom: 0 + }] + }) + } +}); + +SkipToGreenModel = BI.inherit(BI.Model, { + _defaultConfig: function(){ + return BI.extend(SetGetModel.superclass._defaultConfig.apply(this, arguments),{ + }) + }, + + _init: function(){ + SkipToGreenModel.superclass._init.apply(this, arguments); + } +}); + +//Dark yellow pane #B8860B +SkipToYellowView = BI.inherit(BI.View, { + _init: function(){ + SkipToYellowView.superclass._init.apply(this, arguments); + }, + + render: function(vessel){ + BI.createWidget({ + type: "bi.absolute", + element: vessel, + cls: "yellow-pane", + items: [{ + el:{ + type: "bi.label", + text: "Model Data: " + JSON.stringify(this.model.toJSON()), + hgap: 20, + height: 26 + }, + left: 0, + right: 0, + top: 0, + bottom: 0 + }] + }) + } +}); + +SkipToYellowModel = BI.inherit(BI.Model, { + _defaultConfig: function(){ + return BI.extend(SetGetModel.superclass._defaultConfig.apply(this, arguments),{ + }) + }, + + _init: function(){ + SkipToYellowModel.superclass._init.apply(this, arguments); + } +}); + +Demo.Func = BI.inherit(BI.Widget, { + render: function () { + var view = BI.View.createView("/skipTo", {}, { + element: this + }); + view.populate(); + }, + + mounted: function () { + } +}); +BI.shortcut("demo.skipTo", Demo.Func); +//splice和duplicate函数 +SpliceDuplicateView = BI.inherit(BI.View, { + _defaultConfig: function () { + return BI.extend(SpliceDuplicateView.superclass._defaultConfig.apply(this, arguments), { + baseCls: "bi-splice-duplicate" + }) + }, + + _init: function () { + SpliceDuplicateView.superclass._init.apply(this, arguments); + this.children = {}; + }, + + splice: function (old, key1, key2) { + this.children[key1].destroy(); + delete this.children[key1]; + this._showModelData(); + }, + + duplicate: function (copy, key1, key2) { + this.add(copy); + this._showModelData(); + }, + + _showModelData: function () { + //这里只是为了输出this.model.data 原则上是不允许这么调用的 + this.text.setText("父级数据：" + JSON.stringify(this.model.data)); + }, + + render: function (vessel) { + this.text = BI.createWidget({ + type: "bi.label", + height: 50, + cls: "superiors-label" + }); + this.container = BI.createWidget({ + type: "bi.vertical", + element: vessel, + items: [this.text], + hgap: 100, + vgap: 10 + }); + this._showModelData(); + }, + + add: function (id) { + this.children[id] = BI.createWidget({ + type: "bi.center", + hgap: 10, + vgap: 10 + }); + this.addSubVessel(id, this.children[id], { + defaultShowName: "sdSub" + }); + this.skipTo("sdSub", id, id); + this.container.addItem(this.children[id]); + }, + + refresh: function () { + var self = this; + BI.each(this.model.toJSON(), function (key, value) { + if (!self.children[key]) { + self.add(key); + } + }) + } +}); + +SpliceDuplicateModel = BI.inherit(BI.Model, { + _defaultConfig: function () { + return BI.extend(SpliceDuplicateModel.superclass._defaultConfig.apply(this, arguments), { + "1": { + name: "名字" + } + }) + }, + + splice: function (key1) { + delete this.data[key1]; + }, + + similar: function (value, key1) { + value.name = BI.Func.createDistinctName(this.data, this.get(key1).name); + return value; + }, + + duplicate: function (copy, key1) { + this.data[copy] = this.get(copy); + }, + + _init: function () { + SpliceDuplicateModel.superclass._init.apply(this, arguments); + }, + + refresh: function () { + this.data = BI.deepClone(this.toJSON()); + } +}); + +SDSubView = BI.inherit(BI.View, { + _defaultConfig: function () { + return SDSubView.superclass._defaultConfig.apply(this, arguments); + }, + + _init: function () { + SDSubView.superclass._init.apply(this, arguments); + }, + + render: function (vessel) { + var self = this; + BI.createWidget({ + type: "bi.center", + element: vessel, + cls: "sd-child", + height: 30, + items: [{ + type: "bi.text_button", + height: 30, + text: "复制 " + this.model.get("name") + " , 数据：" + JSON.stringify(this.model.toJSON()), + cls: "right-button-add", + handler: function () { + self.model.copy(); + } + }, { + type: "bi.text_button", + height: 30, + text: "删除", + cls: "right-button-del", + handler: function () { + self.model.destroy(); + } + }] + }) + } +}); + +SDSubModel = BI.inherit(BI.Model, { + _defaultConfig: function () { + return BI.extend(SDSubModel.superclass._defaultConfig.apply(this, arguments), {}); + }, + + _init: function () { + SDSubModel.superclass._init.apply(this, arguments); + } +}); + +Demo.Func = BI.inherit(BI.Widget, { + render: function () { + var view = BI.View.createView("/spliceDuplicate", {}, { + element: this + }); + view.populate(); + }, + + mounted: function () { + } +}); +BI.shortcut("demo.spliceDuplicate", Demo.Func); +TmpView = BI.inherit(BI.View, { + _defaultConfig: function(){ + return BI.extend(TmpView.superclass._defaultConfig.apply(this, arguments),{ + baseCls: "bi-tmp" + }) + }, + + _init: function(){ + TmpView.superclass._init.apply(this, arguments); + }, + + change: function(changed){ + if(changed.data1){ + this._showModelData(); + } + }, + + _showModelData: function(){ + this.text.setText("父级Model层数据为："+JSON.stringify(this.model.toJSON())); + }, + + _createMain: function(){ + var self = this; + return BI.createWidget({ + type: "bi.border", + items: { + west: { + el: { + type: "bi.vertical", + vgap: 10, + items: [{ + el: (this.text = BI.createWidget({ + type: "bi.label", + whiteSpace: "normal" + })) + }, { + el: { + type: "bi.text_button", + cls: "tmp-button mvc-button", + text: "点击触发事件tmp('data1', {child: {type: {value: \"临时数据\"}}})", + height: 30, + handler: function(){ + self.model.tmp("data1", { + child: { + type: { + value: "临时数据" + } + } + }) + } + } + }, { + el: { + type: "bi.text_button", + cls: "tmp-button mvc-button", + text: "点击触发事件submit", + height: 30, + handler: function(){ + self.model.submit(); + } + } + }, { + el: { + type: "bi.text_button", + cls: "tmp-button mvc-button", + text: "点击跳转到右方", + height: 30, + handler: function(){ + self.addSubVessel("test", self.center).skipTo("child", "test", "data1"); + } + } + }] + }, + width: 200 + }, + center: { + el: (this.center = BI.createWidget()) + } + } + }) + }, + + render: function(vessel){ + BI.createWidget({ + type: "bi.center", + element: vessel, + items: [{ + el: this._createMain() + }], + hgap: 50, + vgap: 100 + }) + }, + + refresh: function(){ + this._showModelData(); + } +}) + +TmpModel = BI.inherit(BI.Model, { + _defaultConfig: function(){ + return BI.extend(TmpModel.superclass._defaultConfig.apply(this, arguments),{ + data1: { + child: { + type: { + value: "这是一个测试数据" + } + } + }, + data2: "test" + }) + }, + + _init: function(){ + TmpModel.superclass._init.apply(this, arguments); + } + +}) + +TmpChildView = BI.inherit(BI.View, { + _defaultConfig: function(){ + return BI.extend(TmpChildView.superclass._defaultConfig.apply(this, arguments),{ + baseCls: "bi-tmp-child" + }) + }, + + _init: function(){ + TmpChildView.superclass._init.apply(this, arguments); + }, + + change: function(changed){ + if(changed.child){ + this._showModelData(); + } + }, + + _showModelData: function(){ + this.text.setText("子级Model层数据为："+JSON.stringify(this.model.toJSON())); + }, + + _createMain: function(){ + var self = this; + return BI.createWidget({ + type: "bi.border", + items: { + west: { + el: { + type: "bi.vertical", + vgap: 10, + items: [{ + el: (this.text = BI.createWidget({ + type: "bi.label", + whiteSpace: "normal" + })) + }, { + el: { + type: "bi.text_button", + cls: "tmp-button mvc-button", + text: "点击触发事件set", + height: 30, + handler: function(){ + self.set("child", { + type: { + value: "值改变了" + } + }) + } + } + }, { + el: { + type: "bi.text_button", + cls: "tmp-button mvc-button", + text: "点击跳转到右方", + height: 30, + handler: function(){ + self.addSubVessel("test", self.center).skipTo("child", "test", "child"); + } + } + }] + }, + width: 200 + }, + center: { + el: (this.center = BI.createWidget()) + } + } + }) + }, + + render: function(vessel){ + BI.createWidget({ + type: "bi.center", + element: vessel, + items: [{ + el: this._createMain() + }], + hgap: 50 + }) + }, + + refresh: function(){ + this._showModelData(); + } +}) + +TmpChildModel = BI.inherit(BI.Model, { + _defaultConfig: function(){ + return BI.extend(TmpChildModel.superclass._defaultConfig.apply(this, arguments),{ + + }) + }, + + _init: function(){ + TmpChildModel.superclass._init.apply(this, arguments); + } + +}) +TmpChildChildView = BI.inherit(BI.View, { + _defaultConfig: function(){ + return BI.extend(TmpChildChildView.superclass._defaultConfig.apply(this, arguments),{ + baseCls: "bi-tmp-child-child" + }) + }, + + _init: function(){ + TmpChildChildView.superclass._init.apply(this, arguments); + }, + + change: function(changed){ + if(changed.type){ + this._showModelData(); + } + }, + + _showModelData: function(){ + this.text.setText("叶节点数据为："+JSON.stringify(this.model.toJSON())); + }, + + _createMain: function(){ + return (this.text = BI.createWidget({ + type: "bi.label", + whiteSpace: "normal" + })) + }, + + render: function(vessel){ + BI.createWidget({ + type: "bi.center", + element: vessel, + items: [{ + el: this._createMain() + }], + hgap: 50 + }) + }, + + refresh: function(){ + this._showModelData(); + } +}) + +TmpChildChildModel = BI.inherit(BI.Model, { + _defaultConfig: function(){ + return BI.extend(TmpChildChildModel.superclass._defaultConfig.apply(this, arguments),{ + + }) + }, + + _init: function(){ + TmpChildChildModel.superclass._init.apply(this, arguments); + } + +}) + +Demo.Func = BI.inherit(BI.Widget, { + render: function () { + var view = BI.View.createView("/tmp", {}, { + element: this + }); + view.populate(); + }, + + mounted: function () { + } +}); +BI.shortcut("demo.tmp", Demo.Func); ;(function(){ var model = Fix.define({ name: "原始属性", diff --git a/dist/sliders.css b/dist/sliders.css index a8d9688bba..66780294e4 100644 --- a/dist/sliders.css +++ b/dist/sliders.css @@ -24,27 +24,15 @@ -moz-border-radius: 7px; border-radius: 7px; } -.bi-single-slider-button .slider-button { - cursor: ew-resize; - -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); - -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); - box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); - -webkit-border-radius: 7px; - -moz-border-radius: 7px; - border-radius: 7px; -} -.bi-slider-track .gray-track { - background-color: rgba(153, 153, 153, 0.3); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4d999999,endColorstr=#4d999999); - -webkit-border-radius: 3px; - -moz-border-radius: 3px; - border-radius: 3px; -} -.bi-slider-track .blue-track { - -webkit-border-radius: 3px; - -moz-border-radius: 3px; - border-radius: 3px; -} +.bi-single-slider-button .slider-button { + cursor: ew-resize; + -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); + -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); + box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); + -webkit-border-radius: 7px; + -moz-border-radius: 7px; + border-radius: 7px; +} .bi-slider-track .gray-track { background-color: rgba(153, 153, 153, 0.3); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4d999999,endColorstr=#4d999999); @@ -57,3 +45,15 @@ -moz-border-radius: 3px; border-radius: 3px; } +.bi-slider-track .gray-track { + background-color: rgba(153, 153, 153, 0.3); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4d999999,endColorstr=#4d999999); + -webkit-border-radius: 3px; + -moz-border-radius: 3px; + border-radius: 3px; +} +.bi-slider-track .blue-track { + -webkit-border-radius: 3px; + -moz-border-radius: 3px; + border-radius: 3px; +} diff --git a/dist/sliders.js b/dist/sliders.js index 0f21ed46fd..e5bcfa86d6 100644 --- a/dist/sliders.js +++ b/dist/sliders.js @@ -6,7 +6,6 @@ BI.IntervalSlider = BI.inherit(BI.Widget, { EDITOR_WIDTH: 58, EDITOR_R_GAP: 60, EDITOR_HEIGHT: 30, - HEIGHT: 28, SLIDER_WIDTH_HALF: 15, SLIDER_WIDTH: 30, SLIDER_HEIGHT: 30, @@ -51,7 +50,6 @@ BI.IntervalSlider = BI.inherit(BI.Widget, { cls: "slider-editor-button", errorText: "", allowBlank: false, - height: c.HEIGHT, width: c.EDITOR_WIDTH, validationChecker: function (v) { return self._checkValidation(v); @@ -78,7 +76,6 @@ BI.IntervalSlider = BI.inherit(BI.Widget, { cls: "slider-editor-button", errorText: "", allowBlank: false, - height: c.HEIGHT, width: c.EDITOR_WIDTH, validationChecker: function (v) { return self._checkValidation(v); @@ -122,6 +119,10 @@ BI.IntervalSlider = BI.inherit(BI.Widget, { var significantPercent = BI.parseFloat(percent.toFixed(1)); self._setSliderOnePosition(significantPercent); self.fireEvent(BI.IntervalSlider.EVENT_CHANGE); + ui.helper.removeClass("dragging"); + }, + start: function (e, ui) { + ui.helper.removeClass("dragging").addClass("dragging"); } }); @@ -1183,7 +1184,6 @@ BI.SingleSlider = BI.inherit(BI.Widget, { _constant: { EDITOR_WIDTH: 90, EDITOR_HEIGHT: 30, - HEIGHT: 28, SLIDER_WIDTH_HALF: 15, SLIDER_WIDTH: 30, SLIDER_HEIGHT: 30, @@ -1276,7 +1276,6 @@ BI.SingleSlider = BI.inherit(BI.Widget, { type: "bi.sign_editor", cls: "slider-editor-button", errorText: "", - height: c.HEIGHT, width: c.EDITOR_WIDTH - 2, allowBlank: false, validationChecker: function (v) {