Browse Source

Merge pull request #345 in FUI/fineui from ~WINDY/fui:master to master

* commit '6d8b582837d5ea95c52f60a5182b94625b07028d':
  update
  update
  update
  inline布局 && rich_editor && code_editor
  update
es6
guy 7 years ago
parent
commit
30786c667b
  1. 56
      demo/js/base/editor/demo.rich_editor.js
  2. 88
      dist/_fineui.min.js
  3. 9
      dist/base.js
  4. 15
      dist/bundle.css
  5. 274
      dist/bundle.js
  6. 2
      dist/bundle.min.css
  7. 88
      dist/bundle.min.js
  8. 6
      dist/case.js
  9. 15
      dist/core.css
  10. 259
      dist/core.js
  11. 15
      dist/core_without_normalize.css
  12. 56
      dist/demo.js
  13. 15
      dist/fineui.css
  14. 2
      dist/fineui.min.css
  15. 88
      dist/fineui.min.js
  16. 9
      src/base/single/editor/editor.code.js
  17. 1
      src/case/colorchooser/colorchooser.js
  18. 5
      src/case/richeditor/plugins/combo.backgroundcolorchooser.js
  19. 23
      src/core/config.js
  20. 100
      src/core/wrapper/layout/adapt/inline.center.js
  21. 74
      src/core/wrapper/layout/adapt/inline.vertical.js
  22. 65
      src/core/wrapper/layout/layout.inline.js
  23. 15
      src/css/core/wrapper/inline.css
  24. 9
      src/less/core/wrapper/inline.center.less
  25. 9
      src/less/core/wrapper/inline.vertical.less

56
demo/js/base/editor/demo.rich_editor.js

@ -4,23 +4,49 @@ Demo.RichEditor = BI.inherit(BI.Widget, {
},
render: function () {
var self = this;
this.editor = BI.createWidget({
type: "bi.rich_editor",
cls: "bi-border",
width: 600,
height: 400
});
BI.createWidget({
type: "bi.vertical",
type: "bi.absolute",
element: this,
hgap: 30,
vgap: 50,
items: [this.editor, {
type: "bi.button",
text: "focus",
handler: function () {
self.editor.focus();
}
items: [{
el: {
type: "bi.rich_editor",
height: "100%",
cls: "bi-border",
ref: function () {
self.editor = this;
},
toolbar: {
type: "bi.rich_editor_text_toolbar",
buttons: [
{type: "bi.rich_editor_font_chooser"},
{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",
listeners: [{
eventName: "EVENT_CHANGE",
action: function (backgroundColor) {
self.editor.element.css({
backgroundColor: backgroundColor,
color: BI.DOM.getContrastColor(backgroundColor)
});
}
}]
},
{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"}
]
}
},
left: 10,
top: 10,
bottom: 10,
right: 10
}]
});
},

88
dist/_fineui.min.js vendored

File diff suppressed because one or more lines are too long

9
dist/base.js vendored

@ -18178,15 +18178,16 @@ BI.CodeEditor = BI.inherit(BI.Single, {
left: o.lineNumbers ? 30 + 5 : 5
}]
});
},
mounted: function () {
var o = this.options;
if (BI.isNumber(o.value) || BI.isString(o.value)) {
BI.nextTick(function () {
self.setValue(o.value);
});
this.setValue(o.value);
}
if (BI.isNotNull(o.style)) {
self.setStyle(o.style);
this.setStyle(o.style);
}
},

15
dist/bundle.css vendored

@ -2029,6 +2029,21 @@ textarea {
-o-align-items: stretch;
align-items: stretch;
}
.bi-inline-center-adapt-layout:after {
display: inline-block;
width: 0;
min-height: 100%;
vertical-align: middle;
content: ' ';
}
.bi-inline-vertical-adapt-layout:after {
display: inline-block;
width: 0;
min-height: 100%;
vertical-align: middle;
content: ' ';
}
.bi-theme-dark {
background-color: #191B2B;
color: #cccccc;

274
dist/bundle.js vendored

@ -26504,21 +26504,18 @@ BI.RedMarkBehavior = BI.inherit(BI.Behavior, {
// 注册布局
var isSupportFlex = BI.isSupportCss3("flex");
BI.Plugin.registerWidget("bi.horizontal", function (ob) {
if (isSupportFlex) {
if (!BI.isIE() && isSupportFlex) {
return BI.extend(ob, {type: "bi.flex_horizontal"});
}
return ob;
});
BI.Plugin.registerWidget("bi.center_adapt", function (ob) {
if (isSupportFlex && ob.items && ob.items.length <= 1) {
if (!BI.isIE() && isSupportFlex && ob.items && ob.items.length <= 1) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
if (!BI.isIE()) {
return BI.extend(ob, {type: "bi.flex_wrapper_center"});
}
return ob;
return BI.extend(ob, {type: "bi.flex_wrapper_center"});
}
return BI.extend(ob, {type: "bi.flex_center"});
}
@ -26526,14 +26523,11 @@ BI.RedMarkBehavior = BI.inherit(BI.Behavior, {
});
BI.Plugin.registerWidget("bi.vertical_adapt", function (ob) {
if (isSupportFlex) {
if (!BI.isIE() && isSupportFlex) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
if (!BI.isIE()) {
return BI.extend({}, ob, {type: "bi.flex_wrapper_vertical_center"});
}
return ob;
return BI.extend({}, ob, {type: "bi.flex_wrapper_vertical_center"});
}
return BI.extend(ob, {type: "bi.flex_vertical_center"});
}
@ -26541,14 +26535,11 @@ BI.RedMarkBehavior = BI.inherit(BI.Behavior, {
});
BI.Plugin.registerWidget("bi.float_center_adapt", function (ob) {
if (isSupportFlex) {
if (!BI.isIE() && isSupportFlex) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
if (!BI.isIE()) {
return BI.extend({}, ob, {type: "bi.flex_wrapper_center"});
}
return ob;
return BI.extend({}, ob, {type: "bi.flex_wrapper_center"});
}
return BI.extend(ob, {type: "bi.flex_center"});
}
@ -31413,6 +31404,178 @@ BI.FloatHorizontalLayout = BI.inherit(BI.Layout, {
}
});
BI.shortcut("bi.horizontal_float", BI.FloatHorizontalLayout);/**
* 内联布局
* @class BI.InlineCenterAdaptLayout
* @extends BI.Layout
*
* @cfg {JSON} options 配置属性
* @cfg {Number} [hgap=0] 水平间隙
* @cfg {Number} [vgap=0] 垂直间隙
*/
BI.InlineCenterAdaptLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.InlineLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-inline-center-adapt-layout",
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
BI.InlineCenterAdaptLayout.superclass.render.apply(this, arguments);
this.element.css({
whiteSpace: "nowrap"
});
this.populate(this.options.items);
},
_addElement: function (i, item, length) {
var o = this.options;
if (!this.hasWidget(this.getName() + i)) {
var t = BI.createWidget(item);
t.element.css({
position: "relative"
});
var w = BI.createWidget({
type: "bi.horizontal_auto",
items: [t]
});
this.addWidget(this.getName() + i, w);
} else {
var w = this.getWidgetByName(this.getName() + i);
}
w.element.css({
position: "relative",
display: "inline-block",
"vertical-align": "middle",
"*display": "inline",
"*zoom": 1,
"min-width": 100 / length + "%"
});
if (o.hgap + o.lgap + (item.lgap || 0) > 0) {
w.element.css({
"margin-left": o.hgap + o.lgap + (item.lgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) > 0) {
w.element.css({
"margin-right": o.hgap + o.rgap + (item.rgap || 0) + "px"
});
}
if (o.vgap + o.tgap + (item.tgap || 0) > 0) {
w.element.css({
"margin-top": o.vgap + o.tgap + (item.tgap || 0) + "px"
});
}
if (o.vgap + o.bgap + (item.bgap || 0) > 0) {
w.element.css({
"margin-bottom": o.vgap + o.bgap + (item.bgap || 0) + "px"
});
}
return w;
},
resize: function () {
this.stroke(this.options.items);
},
addItem: function (item) {
throw new Error("不能添加元素");
},
stroke: function (items) {
var self = this;
BI.each(items, function (i, item) {
if (item) {
self._addElement(i, item, items.length);
}
});
},
populate: function (items) {
BI.InlineCenterAdaptLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.inline_center_adapt", BI.InlineCenterAdaptLayout);/**
* 内联布局
* @class BI.InlineVerticalAdaptLayout
* @extends BI.Layout
*
* @cfg {JSON} options 配置属性
* @cfg {Number} [hgap=0] 水平间隙
* @cfg {Number} [vgap=0] 垂直间隙
*/
BI.InlineVerticalAdaptLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.InlineLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-inline-vertical-adapt-layout",
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
BI.InlineVerticalAdaptLayout.superclass.render.apply(this, arguments);
this.element.css({
whiteSpace: "nowrap"
});
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.InlineVerticalAdaptLayout.superclass._addElement.apply(this, arguments);
w.element.css({
position: "relative",
display: "inline-block",
"vertical-align": "middle",
"*display": "inline",
"*zoom": 1
});
if (o.hgap + o.lgap + (item.lgap || 0) > 0) {
w.element.css({
"margin-left": o.hgap + o.lgap + (item.lgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) > 0) {
w.element.css({
"margin-right": o.hgap + o.rgap + (item.rgap || 0) + "px"
});
}
if (o.vgap + o.tgap + (item.tgap || 0) > 0) {
w.element.css({
"margin-top": o.vgap + o.tgap + (item.tgap || 0) + "px"
});
}
if (o.vgap + o.bgap + (item.bgap || 0) > 0) {
w.element.css({
"margin-bottom": o.vgap + o.bgap + (item.bgap || 0) + "px"
});
}
return w;
},
resize: function () {
this.stroke(this.options.items);
},
populate: function (items) {
BI.InlineVerticalAdaptLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.inline_vertical_adapt", BI.InlineVerticalAdaptLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
@ -33007,6 +33170,70 @@ BI.HorizontalCellLayout = BI.inherit(BI.Layout, {
}
});
BI.shortcut("bi.horizontal_cell", BI.HorizontalCellLayout);/**
* 内联布局
* @class BI.InlineLayout
* @extends BI.Layout
*
* @cfg {JSON} options 配置属性
* @cfg {Number} [hgap=0] 水平间隙
* @cfg {Number} [vgap=0] 垂直间隙
*/
BI.InlineLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.InlineLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-inline-layout",
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
BI.InlineLayout.superclass.render.apply(this, arguments);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.InlineLayout.superclass._addElement.apply(this, arguments);
w.element.css({"position": "relative", display: "inline-block", "*display": "inline", "*zoom": 1});
if (o.hgap + o.lgap + (item.lgap || 0) > 0) {
w.element.css({
"margin-left": o.hgap + o.lgap + (item.lgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) > 0) {
w.element.css({
"margin-right": o.hgap + o.rgap + (item.rgap || 0) + "px"
});
}
if (o.vgap + o.tgap + (item.tgap || 0) > 0) {
w.element.css({
"margin-top": o.vgap + o.tgap + (item.tgap || 0) + "px"
});
}
if (o.vgap + o.bgap + (item.bgap || 0) > 0) {
w.element.css({
"margin-bottom": o.vgap + o.bgap + (item.bgap || 0) + "px"
});
}
return w;
},
resize: function () {
this.stroke(this.options.items);
},
populate: function (items) {
BI.InlineLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.inline", BI.InlineLayout);/**
* 靠左对齐的自由浮动布局
* @class BI.LatticeLayout
* @extends BI.Layout
@ -53699,15 +53926,16 @@ BI.CodeEditor = BI.inherit(BI.Single, {
left: o.lineNumbers ? 30 + 5 : 5
}]
});
},
mounted: function () {
var o = this.options;
if (BI.isNumber(o.value) || BI.isString(o.value)) {
BI.nextTick(function () {
self.setValue(o.value);
});
this.setValue(o.value);
}
if (BI.isNotNull(o.style)) {
self.setStyle(o.style);
this.setStyle(o.style);
}
},
@ -75865,7 +76093,6 @@ BI.ColorChooser = BI.inherit(BI.Widget, {
}]
},
stopPropagation: false,
minWidth: 202,
minWidth: 202
},
value: o.value
@ -83202,10 +83429,7 @@ BI.RichEditorBackgroundColorChooser = BI.inherit(BI.RichEditorAction, {
});
this.colorchooser.on(BI.ColorChooser.EVENT_CHANGE, function () {
var backgroundColor = this.getValue();
o.editor.element.css({
backgroundColor: backgroundColor,
color: BI.DOM.getContrastColor(backgroundColor)
});
self.fireEvent("EVENT_CHANGE", backgroundColor);
});
},

2
dist/bundle.min.css vendored

File diff suppressed because one or more lines are too long

88
dist/bundle.min.js vendored

File diff suppressed because one or more lines are too long

6
dist/case.js vendored

@ -3656,7 +3656,6 @@ BI.ColorChooser = BI.inherit(BI.Widget, {
}]
},
stopPropagation: false,
minWidth: 202,
minWidth: 202
},
value: o.value
@ -10993,10 +10992,7 @@ BI.RichEditorBackgroundColorChooser = BI.inherit(BI.RichEditorAction, {
});
this.colorchooser.on(BI.ColorChooser.EVENT_CHANGE, function () {
var backgroundColor = this.getValue();
o.editor.element.css({
backgroundColor: backgroundColor,
color: BI.DOM.getContrastColor(backgroundColor)
});
self.fireEvent("EVENT_CHANGE", backgroundColor);
});
},

15
dist/core.css vendored

@ -2029,6 +2029,21 @@ textarea {
-o-align-items: stretch;
align-items: stretch;
}
.bi-inline-center-adapt-layout:after {
display: inline-block;
width: 0;
min-height: 100%;
vertical-align: middle;
content: ' ';
}
.bi-inline-vertical-adapt-layout:after {
display: inline-block;
width: 0;
min-height: 100%;
vertical-align: middle;
content: ' ';
}
.bi-theme-dark {
background-color: #191B2B;
color: #cccccc;

259
dist/core.js vendored

@ -26504,21 +26504,18 @@ BI.RedMarkBehavior = BI.inherit(BI.Behavior, {
// 注册布局
var isSupportFlex = BI.isSupportCss3("flex");
BI.Plugin.registerWidget("bi.horizontal", function (ob) {
if (isSupportFlex) {
if (!BI.isIE() && isSupportFlex) {
return BI.extend(ob, {type: "bi.flex_horizontal"});
}
return ob;
});
BI.Plugin.registerWidget("bi.center_adapt", function (ob) {
if (isSupportFlex && ob.items && ob.items.length <= 1) {
if (!BI.isIE() && isSupportFlex && ob.items && ob.items.length <= 1) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
if (!BI.isIE()) {
return BI.extend(ob, {type: "bi.flex_wrapper_center"});
}
return ob;
return BI.extend(ob, {type: "bi.flex_wrapper_center"});
}
return BI.extend(ob, {type: "bi.flex_center"});
}
@ -26526,14 +26523,11 @@ BI.RedMarkBehavior = BI.inherit(BI.Behavior, {
});
BI.Plugin.registerWidget("bi.vertical_adapt", function (ob) {
if (isSupportFlex) {
if (!BI.isIE() && isSupportFlex) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
if (!BI.isIE()) {
return BI.extend({}, ob, {type: "bi.flex_wrapper_vertical_center"});
}
return ob;
return BI.extend({}, ob, {type: "bi.flex_wrapper_vertical_center"});
}
return BI.extend(ob, {type: "bi.flex_vertical_center"});
}
@ -26541,14 +26535,11 @@ BI.RedMarkBehavior = BI.inherit(BI.Behavior, {
});
BI.Plugin.registerWidget("bi.float_center_adapt", function (ob) {
if (isSupportFlex) {
if (!BI.isIE() && isSupportFlex) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
if (!BI.isIE()) {
return BI.extend({}, ob, {type: "bi.flex_wrapper_center"});
}
return ob;
return BI.extend({}, ob, {type: "bi.flex_wrapper_center"});
}
return BI.extend(ob, {type: "bi.flex_center"});
}
@ -31413,6 +31404,178 @@ BI.FloatHorizontalLayout = BI.inherit(BI.Layout, {
}
});
BI.shortcut("bi.horizontal_float", BI.FloatHorizontalLayout);/**
* 内联布局
* @class BI.InlineCenterAdaptLayout
* @extends BI.Layout
*
* @cfg {JSON} options 配置属性
* @cfg {Number} [hgap=0] 水平间隙
* @cfg {Number} [vgap=0] 垂直间隙
*/
BI.InlineCenterAdaptLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.InlineLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-inline-center-adapt-layout",
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
BI.InlineCenterAdaptLayout.superclass.render.apply(this, arguments);
this.element.css({
whiteSpace: "nowrap"
});
this.populate(this.options.items);
},
_addElement: function (i, item, length) {
var o = this.options;
if (!this.hasWidget(this.getName() + i)) {
var t = BI.createWidget(item);
t.element.css({
position: "relative"
});
var w = BI.createWidget({
type: "bi.horizontal_auto",
items: [t]
});
this.addWidget(this.getName() + i, w);
} else {
var w = this.getWidgetByName(this.getName() + i);
}
w.element.css({
position: "relative",
display: "inline-block",
"vertical-align": "middle",
"*display": "inline",
"*zoom": 1,
"min-width": 100 / length + "%"
});
if (o.hgap + o.lgap + (item.lgap || 0) > 0) {
w.element.css({
"margin-left": o.hgap + o.lgap + (item.lgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) > 0) {
w.element.css({
"margin-right": o.hgap + o.rgap + (item.rgap || 0) + "px"
});
}
if (o.vgap + o.tgap + (item.tgap || 0) > 0) {
w.element.css({
"margin-top": o.vgap + o.tgap + (item.tgap || 0) + "px"
});
}
if (o.vgap + o.bgap + (item.bgap || 0) > 0) {
w.element.css({
"margin-bottom": o.vgap + o.bgap + (item.bgap || 0) + "px"
});
}
return w;
},
resize: function () {
this.stroke(this.options.items);
},
addItem: function (item) {
throw new Error("不能添加元素");
},
stroke: function (items) {
var self = this;
BI.each(items, function (i, item) {
if (item) {
self._addElement(i, item, items.length);
}
});
},
populate: function (items) {
BI.InlineCenterAdaptLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.inline_center_adapt", BI.InlineCenterAdaptLayout);/**
* 内联布局
* @class BI.InlineVerticalAdaptLayout
* @extends BI.Layout
*
* @cfg {JSON} options 配置属性
* @cfg {Number} [hgap=0] 水平间隙
* @cfg {Number} [vgap=0] 垂直间隙
*/
BI.InlineVerticalAdaptLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.InlineLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-inline-vertical-adapt-layout",
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
BI.InlineVerticalAdaptLayout.superclass.render.apply(this, arguments);
this.element.css({
whiteSpace: "nowrap"
});
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.InlineVerticalAdaptLayout.superclass._addElement.apply(this, arguments);
w.element.css({
position: "relative",
display: "inline-block",
"vertical-align": "middle",
"*display": "inline",
"*zoom": 1
});
if (o.hgap + o.lgap + (item.lgap || 0) > 0) {
w.element.css({
"margin-left": o.hgap + o.lgap + (item.lgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) > 0) {
w.element.css({
"margin-right": o.hgap + o.rgap + (item.rgap || 0) + "px"
});
}
if (o.vgap + o.tgap + (item.tgap || 0) > 0) {
w.element.css({
"margin-top": o.vgap + o.tgap + (item.tgap || 0) + "px"
});
}
if (o.vgap + o.bgap + (item.bgap || 0) > 0) {
w.element.css({
"margin-bottom": o.vgap + o.bgap + (item.bgap || 0) + "px"
});
}
return w;
},
resize: function () {
this.stroke(this.options.items);
},
populate: function (items) {
BI.InlineVerticalAdaptLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.inline_vertical_adapt", BI.InlineVerticalAdaptLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
@ -33007,6 +33170,70 @@ BI.HorizontalCellLayout = BI.inherit(BI.Layout, {
}
});
BI.shortcut("bi.horizontal_cell", BI.HorizontalCellLayout);/**
* 内联布局
* @class BI.InlineLayout
* @extends BI.Layout
*
* @cfg {JSON} options 配置属性
* @cfg {Number} [hgap=0] 水平间隙
* @cfg {Number} [vgap=0] 垂直间隙
*/
BI.InlineLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.InlineLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-inline-layout",
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
BI.InlineLayout.superclass.render.apply(this, arguments);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.InlineLayout.superclass._addElement.apply(this, arguments);
w.element.css({"position": "relative", display: "inline-block", "*display": "inline", "*zoom": 1});
if (o.hgap + o.lgap + (item.lgap || 0) > 0) {
w.element.css({
"margin-left": o.hgap + o.lgap + (item.lgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) > 0) {
w.element.css({
"margin-right": o.hgap + o.rgap + (item.rgap || 0) + "px"
});
}
if (o.vgap + o.tgap + (item.tgap || 0) > 0) {
w.element.css({
"margin-top": o.vgap + o.tgap + (item.tgap || 0) + "px"
});
}
if (o.vgap + o.bgap + (item.bgap || 0) > 0) {
w.element.css({
"margin-bottom": o.vgap + o.bgap + (item.bgap || 0) + "px"
});
}
return w;
},
resize: function () {
this.stroke(this.options.items);
},
populate: function (items) {
BI.InlineLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.inline", BI.InlineLayout);/**
* 靠左对齐的自由浮动布局
* @class BI.LatticeLayout
* @extends BI.Layout

15
dist/core_without_normalize.css vendored

@ -1751,6 +1751,21 @@ textarea {
-o-align-items: stretch;
align-items: stretch;
}
.bi-inline-center-adapt-layout:after {
display: inline-block;
width: 0;
min-height: 100%;
vertical-align: middle;
content: ' ';
}
.bi-inline-vertical-adapt-layout:after {
display: inline-block;
width: 0;
min-height: 100%;
vertical-align: middle;
content: ' ';
}
.bi-theme-dark {
background-color: #191B2B;
color: #cccccc;

56
dist/demo.js vendored

@ -857,23 +857,49 @@ BI.shortcut("demo.multifile_editor", Demo.CodeEditor);Demo.RichEditor = BI.inher
},
render: function () {
var self = this;
this.editor = BI.createWidget({
type: "bi.rich_editor",
cls: "bi-border",
width: 600,
height: 400
});
BI.createWidget({
type: "bi.vertical",
type: "bi.absolute",
element: this,
hgap: 30,
vgap: 50,
items: [this.editor, {
type: "bi.button",
text: "focus",
handler: function () {
self.editor.focus();
}
items: [{
el: {
type: "bi.rich_editor",
height: "100%",
cls: "bi-border",
ref: function () {
self.editor = this;
},
toolbar: {
type: "bi.rich_editor_text_toolbar",
buttons: [
{type: "bi.rich_editor_font_chooser"},
{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",
listeners: [{
eventName: "EVENT_CHANGE",
action: function (backgroundColor) {
self.editor.element.css({
backgroundColor: backgroundColor,
color: BI.DOM.getContrastColor(backgroundColor)
});
}
}]
},
{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"}
]
}
},
left: 10,
top: 10,
bottom: 10,
right: 10
}]
});
},

15
dist/fineui.css vendored

@ -2029,6 +2029,21 @@ textarea {
-o-align-items: stretch;
align-items: stretch;
}
.bi-inline-center-adapt-layout:after {
display: inline-block;
width: 0;
min-height: 100%;
vertical-align: middle;
content: ' ';
}
.bi-inline-vertical-adapt-layout:after {
display: inline-block;
width: 0;
min-height: 100%;
vertical-align: middle;
content: ' ';
}
.bi-theme-dark {
background-color: #191B2B;
color: #cccccc;

2
dist/fineui.min.css vendored

File diff suppressed because one or more lines are too long

88
dist/fineui.min.js vendored

File diff suppressed because one or more lines are too long

9
src/base/single/editor/editor.code.js

@ -87,15 +87,16 @@ BI.CodeEditor = BI.inherit(BI.Single, {
left: o.lineNumbers ? 30 + 5 : 5
}]
});
},
mounted: function () {
var o = this.options;
if (BI.isNumber(o.value) || BI.isString(o.value)) {
BI.nextTick(function () {
self.setValue(o.value);
});
this.setValue(o.value);
}
if (BI.isNotNull(o.style)) {
self.setStyle(o.style);
this.setStyle(o.style);
}
},

1
src/case/colorchooser/colorchooser.js

@ -50,7 +50,6 @@ BI.ColorChooser = BI.inherit(BI.Widget, {
}]
},
stopPropagation: false,
minWidth: 202,
minWidth: 202
},
value: o.value

5
src/case/richeditor/plugins/combo.backgroundcolorchooser.js

@ -29,10 +29,7 @@ BI.RichEditorBackgroundColorChooser = BI.inherit(BI.RichEditorAction, {
});
this.colorchooser.on(BI.ColorChooser.EVENT_CHANGE, function () {
var backgroundColor = this.getValue();
o.editor.element.css({
backgroundColor: backgroundColor,
color: BI.DOM.getContrastColor(backgroundColor)
});
self.fireEvent("EVENT_CHANGE", backgroundColor);
});
},

23
src/core/config.js

@ -3,21 +3,18 @@
// 注册布局
var isSupportFlex = BI.isSupportCss3("flex");
BI.Plugin.registerWidget("bi.horizontal", function (ob) {
if (isSupportFlex) {
if (!BI.isIE() && isSupportFlex) {
return BI.extend(ob, {type: "bi.flex_horizontal"});
}
return ob;
});
BI.Plugin.registerWidget("bi.center_adapt", function (ob) {
if (isSupportFlex && ob.items && ob.items.length <= 1) {
if (!BI.isIE() && isSupportFlex && ob.items && ob.items.length <= 1) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
if (!BI.isIE()) {
return BI.extend(ob, {type: "bi.flex_wrapper_center"});
}
return ob;
return BI.extend(ob, {type: "bi.flex_wrapper_center"});
}
return BI.extend(ob, {type: "bi.flex_center"});
}
@ -25,14 +22,11 @@
});
BI.Plugin.registerWidget("bi.vertical_adapt", function (ob) {
if (isSupportFlex) {
if (!BI.isIE() && isSupportFlex) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
if (!BI.isIE()) {
return BI.extend({}, ob, {type: "bi.flex_wrapper_vertical_center"});
}
return ob;
return BI.extend({}, ob, {type: "bi.flex_wrapper_vertical_center"});
}
return BI.extend(ob, {type: "bi.flex_vertical_center"});
}
@ -40,14 +34,11 @@
});
BI.Plugin.registerWidget("bi.float_center_adapt", function (ob) {
if (isSupportFlex) {
if (!BI.isIE() && isSupportFlex) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
if (!BI.isIE()) {
return BI.extend({}, ob, {type: "bi.flex_wrapper_center"});
}
return ob;
return BI.extend({}, ob, {type: "bi.flex_wrapper_center"});
}
return BI.extend(ob, {type: "bi.flex_center"});
}

100
src/core/wrapper/layout/adapt/inline.center.js

@ -0,0 +1,100 @@
/**
* 内联布局
* @class BI.InlineCenterAdaptLayout
* @extends BI.Layout
*
* @cfg {JSON} options 配置属性
* @cfg {Number} [hgap=0] 水平间隙
* @cfg {Number} [vgap=0] 垂直间隙
*/
BI.InlineCenterAdaptLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.InlineLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-inline-center-adapt-layout",
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
BI.InlineCenterAdaptLayout.superclass.render.apply(this, arguments);
this.element.css({
whiteSpace: "nowrap"
});
this.populate(this.options.items);
},
_addElement: function (i, item, length) {
var o = this.options;
if (!this.hasWidget(this.getName() + i)) {
var t = BI.createWidget(item);
t.element.css({
position: "relative"
});
var w = BI.createWidget({
type: "bi.horizontal_auto",
items: [t]
});
this.addWidget(this.getName() + i, w);
} else {
var w = this.getWidgetByName(this.getName() + i);
}
w.element.css({
position: "relative",
display: "inline-block",
"vertical-align": "middle",
"*display": "inline",
"*zoom": 1,
"min-width": 100 / length + "%"
});
if (o.hgap + o.lgap + (item.lgap || 0) > 0) {
w.element.css({
"margin-left": o.hgap + o.lgap + (item.lgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) > 0) {
w.element.css({
"margin-right": o.hgap + o.rgap + (item.rgap || 0) + "px"
});
}
if (o.vgap + o.tgap + (item.tgap || 0) > 0) {
w.element.css({
"margin-top": o.vgap + o.tgap + (item.tgap || 0) + "px"
});
}
if (o.vgap + o.bgap + (item.bgap || 0) > 0) {
w.element.css({
"margin-bottom": o.vgap + o.bgap + (item.bgap || 0) + "px"
});
}
return w;
},
resize: function () {
this.stroke(this.options.items);
},
addItem: function (item) {
throw new Error("不能添加元素");
},
stroke: function (items) {
var self = this;
BI.each(items, function (i, item) {
if (item) {
self._addElement(i, item, items.length);
}
});
},
populate: function (items) {
BI.InlineCenterAdaptLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.inline_center_adapt", BI.InlineCenterAdaptLayout);

74
src/core/wrapper/layout/adapt/inline.vertical.js

@ -0,0 +1,74 @@
/**
* 内联布局
* @class BI.InlineVerticalAdaptLayout
* @extends BI.Layout
*
* @cfg {JSON} options 配置属性
* @cfg {Number} [hgap=0] 水平间隙
* @cfg {Number} [vgap=0] 垂直间隙
*/
BI.InlineVerticalAdaptLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.InlineLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-inline-vertical-adapt-layout",
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
BI.InlineVerticalAdaptLayout.superclass.render.apply(this, arguments);
this.element.css({
whiteSpace: "nowrap"
});
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.InlineVerticalAdaptLayout.superclass._addElement.apply(this, arguments);
w.element.css({
position: "relative",
display: "inline-block",
"vertical-align": "middle",
"*display": "inline",
"*zoom": 1
});
if (o.hgap + o.lgap + (item.lgap || 0) > 0) {
w.element.css({
"margin-left": o.hgap + o.lgap + (item.lgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) > 0) {
w.element.css({
"margin-right": o.hgap + o.rgap + (item.rgap || 0) + "px"
});
}
if (o.vgap + o.tgap + (item.tgap || 0) > 0) {
w.element.css({
"margin-top": o.vgap + o.tgap + (item.tgap || 0) + "px"
});
}
if (o.vgap + o.bgap + (item.bgap || 0) > 0) {
w.element.css({
"margin-bottom": o.vgap + o.bgap + (item.bgap || 0) + "px"
});
}
return w;
},
resize: function () {
this.stroke(this.options.items);
},
populate: function (items) {
BI.InlineVerticalAdaptLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.inline_vertical_adapt", BI.InlineVerticalAdaptLayout);

65
src/core/wrapper/layout/layout.inline.js

@ -0,0 +1,65 @@
/**
* 内联布局
* @class BI.InlineLayout
* @extends BI.Layout
*
* @cfg {JSON} options 配置属性
* @cfg {Number} [hgap=0] 水平间隙
* @cfg {Number} [vgap=0] 垂直间隙
*/
BI.InlineLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.InlineLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-inline-layout",
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
BI.InlineLayout.superclass.render.apply(this, arguments);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.InlineLayout.superclass._addElement.apply(this, arguments);
w.element.css({"position": "relative", display: "inline-block", "*display": "inline", "*zoom": 1});
if (o.hgap + o.lgap + (item.lgap || 0) > 0) {
w.element.css({
"margin-left": o.hgap + o.lgap + (item.lgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) > 0) {
w.element.css({
"margin-right": o.hgap + o.rgap + (item.rgap || 0) + "px"
});
}
if (o.vgap + o.tgap + (item.tgap || 0) > 0) {
w.element.css({
"margin-top": o.vgap + o.tgap + (item.tgap || 0) + "px"
});
}
if (o.vgap + o.bgap + (item.bgap || 0) > 0) {
w.element.css({
"margin-bottom": o.vgap + o.bgap + (item.bgap || 0) + "px"
});
}
return w;
},
resize: function () {
this.stroke(this.options.items);
},
populate: function (items) {
BI.InlineLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.inline", BI.InlineLayout);

15
src/css/core/wrapper/inline.css

@ -0,0 +1,15 @@
.bi-inline-center-adapt-layout:after {
display: inline-block;
width: 0;
min-height: 100%;
vertical-align: middle;
content: ' ';
}
.bi-inline-vertical-adapt-layout:after {
display: inline-block;
width: 0;
min-height: 100%;
vertical-align: middle;
content: ' ';
}

9
src/less/core/wrapper/inline.center.less

@ -0,0 +1,9 @@
.bi-inline-center-adapt-layout{
&:after{
display:inline-block;
width:0;
min-height:100%;
vertical-align:middle;
content:' ';
}
}

9
src/less/core/wrapper/inline.vertical.less

@ -0,0 +1,9 @@
.bi-inline-vertical-adapt-layout{
&:after{
display:inline-block;
width:0;
min-height:100%;
vertical-align:middle;
content:' ';
}
}
Loading…
Cancel
Save