fanruan
/
fineui
4
1
Fork 2
Code Issues 1 Pull Requests Releases Wiki Activity
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 6 years ago
parent
81e6c5b486 6d8b582837
commit
30786c667b
25 changed files with 1059 additions and 239 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  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
Unescape View File

@ -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
View File

File diff suppressed because one or more lines are too long

9
dist/base.js vendored
Unescape View File

@ -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
Unescape View File

@ -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
Unescape View File

@ -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
View File

File diff suppressed because one or more lines are too long

88
dist/bundle.min.js vendored
View File

File diff suppressed because one or more lines are too long

6
dist/case.js vendored
Unescape View File

@ -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
Unescape View File

@ -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
Unescape View File

@ -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
Unescape View File

@ -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
Unescape View File

@ -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
Unescape View File

@ -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
View File

File diff suppressed because one or more lines are too long

88
dist/fineui.min.js vendored
View File

File diff suppressed because one or more lines are too long

9
src/base/single/editor/editor.code.js
Unescape View File

@ -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
Unescape View File

@ -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
Unescape View File

@ -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
Unescape View File

@ -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
Unescape View File

@ -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
Unescape View File

@ -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
Unescape View File

@ -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
Unescape View File

@ -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
Unescape View File

@ -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
Unescape View File

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