diff --git a/bi/base.js b/bi/base.js index 12f0a1f2b3..9562d00b56 100644 --- a/bi/base.js +++ b/bi/base.js @@ -4825,6 +4825,17 @@ BI.Tab = BI.inherit(BI.Widget, { } }, + removeTab: function (cardname) { + var self = this, o = this.options; + BI.any(this.cardMap, function (name, card) { + if (BI.isEqual(name, (cardname + ""))) { + self.layout.deleteCardByName(name); + delete self.cardMap[name]; + return true; + } + }); + }, + getSelect: function () { return this.curr; }, @@ -32473,14 +32484,14 @@ BI.ResizableTableCell = BI.inherit(BI.Widget, { function optimizeSize(s) { var optSize = BI.clamp(s, o.minSize, o.maxSize || Number.MAX_VALUE); - if (o.suitableSize) { - if (Math.abs(o.suitableSize - optSize) < 5) { - optSize = o.suitableSize; - self.handler.element.addClass("suitable"); - } else { - self.handler.element.removeClass("suitable"); - } - } + // if (o.suitableSize) { + // if (Math.abs(o.suitableSize - optSize) < 5) { + // optSize = o.suitableSize; + // self.handler.element.addClass("suitable"); + // } else { + // self.handler.element.removeClass("suitable"); + // } + // } return optSize; } diff --git a/bi/case.js b/bi/case.js index 9cd6d39883..f32acbb044 100644 --- a/bi/case.js +++ b/bi/case.js @@ -4914,6 +4914,7 @@ BI.BubbleCombo = BI.inherit(BI.Widget, { default: break; } + this.triangle && this.triangle.destroy(); this.triangle = BI.createWidget(op, { type: "bi.center_adapt", cls: "button-combo-triangle-wrapper", @@ -4974,6 +4975,7 @@ BI.BubbleCombo = BI.inherit(BI.Widget, { _hideTriangle: function () { this.triangle && this.triangle.destroy(); + this.triangle = null; this.combo.getView() && this.combo.getView().hideLine(); }, @@ -4986,10 +4988,6 @@ BI.BubbleCombo = BI.inherit(BI.Widget, { this.combo && this.combo.showView(); }, - hasView: function () { - return BI.isNotNull(this.combo.getView()); - }, - isViewVisible: function () { return this.combo.isViewVisible(); } @@ -9138,6 +9136,9 @@ BI.SortList = BI.inherit(BI.Widget, { }, populate: function (items) { + if (items) { + arguments[0] = this._formatItems(items); + } this.loader.populate.apply(this.loader, arguments); }, @@ -12346,6 +12347,7 @@ BI.EditorTrigger = BI.inherit(BI.Trigger, { }, { el: { type: "bi.trigger_icon_button", + cls: "bi-border-left", width: o.triggerWidth }, width: o.triggerWidth diff --git a/bi/widget.js b/bi/widget.js index 820a05217c..ad4163ffd7 100644 --- a/bi/widget.js +++ b/bi/widget.js @@ -792,1048 +792,1048 @@ BI.ArrangementDroppable = BI.inherit(BI.Widget, { }); } }); -BI.shortcut('bi.arrangement_droppable', BI.ArrangementDroppable);/** - * 布局 - * - * Created by GUY on 2016/2/23. - * @class BI.Arrangement - * @extends BI.Widget - */ -BI.Arrangement = BI.inherit(BI.Widget, { - - _defaultConfig: function () { - return BI.extend(BI.Arrangement.superclass._defaultConfig.apply(this, arguments), { - baseCls: "bi-arrangement", - layoutType: BI.Arrangement.LAYOUT_TYPE.GRID, - items: [] - }); - }, - - _init: function () { - BI.Arrangement.superclass._init.apply(this, arguments); - var self = this, o = this.options; - this.arrangement = BI.createWidget({ - type: "bi.arrangement_droppable", - cls: "arrangement-block", - invisible: true - }); - this.block = BI.createWidget({ - type: "bi.arrangement_block", - invisible: true - }); - this.container = BI.createWidget({ - type: "bi.absolute", - items: o.items.concat([this.block, this.arrangement]) - }); - - this.scrollContainer = BI.createWidget({ - type: "bi.adaptive", - width: "100%", - height: "100%", - scrollable: true, - items: [this.container] - }); - this.scrollContainer.element.scroll(function () { - self.fireEvent(BI.Arrangement.EVENT_SCROLL, { - scrollLeft: self.scrollContainer.element.scrollLeft(), - scrollTop: self.scrollContainer.element.scrollTop(), - clientWidth: self.scrollContainer.element[0].clientWidth, - clientHeight: self.scrollContainer.element[0].clientHeight - }); - }); - - BI.createWidget({ - type: "bi.adaptive", - element: this, - items: [this.scrollContainer] - }); - this.regions = {}; - if (o.items.length > 0) { - BI.nextTick(function () { - self.populate(o.items); - }); - } - }, - - ////初始化操作//// - _calculateRegions: function (items) { - var self = this, o = this.options; - this.regions = {}; - BI.each(items, function (i, item) { - var region = self._createOneRegion(item); - self.regions[region.id] = region; - }); - }, - - _isEqual: function (num1, num2) { - return Math.abs(num1 - num2) < 2; - }, - - _isLessThan: function (num1, num2) { - return num1 < num2 && !this._isEqual(num1, num2); - }, - - _isMoreThan: function (num1, num2) { - return num1 > num2 && !this._isEqual(num1, num2); - }, - - _isLessThanEqual: function (num1, num2) { - return num1 <= num2 || this._isEqual(num1, num2); - }, - - _isMoreThanEqual: function (num1, num2) { - return num1 >= num2 || this._isEqual(num1, num2); - }, - - //获取占有的最大Region - _getRegionOccupied: function (regions) { - var self = this, o = this.options; - if (BI.size(regions || this.regions) <= 0) { - return { - left: 0, - top: 0, - width: 0, - height: 0 - } - } - var minLeft = BI.MAX, maxLeft = BI.MIN, minTop = BI.MAX, maxTop = BI.MIN; - BI.each(regions || this.regions, function (id, region) { - minLeft = Math.min(minLeft, region.left); - maxLeft = Math.max(maxLeft, region.left + region.width); - minTop = Math.min(minTop, region.top); - maxTop = Math.max(maxTop, region.top + region.height); - }); - return { - left: minLeft, - top: minTop, - width: maxLeft - minLeft, - height: maxTop - minTop - } - }, - - //两个区域的交叉面积 - _getCrossArea: function (region1, region2) { - if (region1.left <= region2.left) { - if (region1.top <= region2.top) { - if (region1.top + region1.height > region2.top && region1.left + region1.width > region2.left) { - if (this._isEqual(region1.top + region1.height, region2.top) || this._isEqual(region1.left + region1.width, region2.left)) { - return 0; - } - return (region1.top + region1.height - region2.top) * (region1.left + region1.width - region2.left); - } - } else { - if (region2.top + region2.height > region1.top && region1.left + region1.width > region2.left) { - if (this._isEqual(region2.top + region2.height, region1.top) || this._isEqual(region1.left + region1.width, region2.left)) { - return 0; - } - return (region2.top + region2.height - region1.top) * (region1.left + region1.width - region2.left); - } - } - } else { - if (region1.top <= region2.top) { - if (region1.top + region1.height > region2.top && region2.left + region2.width > region1.left) { - if (this._isEqual(region1.top + region1.height, region2.top) || this._isEqual(region2.left + region2.width, region1.left)) { - return 0; - } - return (region1.top + region1.height - region2.top) * (region2.left + region2.width - region1.left); - } - } else { - if (region2.top + region2.height > region1.top && region2.left + region2.width > region1.left) { - if (this._isEqual(region2.top + region2.height, region1.top) || this._isEqual(region2.left + region2.width, region1.left)) { - return 0; - } - return (region2.top + region2.height - region1.top) * (region2.left + region2.width - region1.left); - } - } - } - return 0; - }, - - //是否有覆盖的组件 - _isRegionOverlay: function (regions) { - var reg = []; - BI.each(regions || this.regions, function (id, region) { - reg.push(new BI.Region(region.left, region.top, region.width, region.height)); - }); - for (var i = 0, len = reg.length; i < len; i++) { - for (var j = i + 1; j < len; j++) { - var area1 = { - left: reg[i].x, - top: reg[i].y, - width: reg[i].w, - height: reg[i].h - }; - var area2 = { - left: reg[j].x, - top: reg[j].y, - width: reg[j].w, - height: reg[j].h - }; - if (reg[i].isIntersects(reg[j]) && this._getCrossArea(area1, area2) > 1) { - return true; - } - } - } - return false; - }, - - //布局是否是优良的 - _isArrangeFine: function (regions) { - switch (this.options.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.FREE: - return true; - case BI.Arrangement.LAYOUT_TYPE.GRID: - if (this._isRegionOverlay()) { - return false; - } - } - return true; - }, - - _getRegionNames: function (regions) { - var names = []; - BI.each(regions || this.regions, function (i, region) { - names.push(region.id || region.attr("id")); - }); - return names; - }, - - _getRegionsByNames: function (names, regions) { - names = BI.isArray(names) ? names : [names]; - regions = regions || this.regions; - if (BI.isArray(regions)) { - var result = []; - BI.each(regions, function (i, region) { - if (names.contains(region.id || region.attr("id"))) { - result.push(region); - } - }); - } else { - var result = {}; - BI.each(names, function (i, name) { - result[name] = regions[name]; - }); - } - return result; - }, - - _cloneRegion: function (regions) { - var clone = {}; - BI.each(regions || this.regions, function (id, region) { - clone[id] = {}; - clone[id].el = region.el; - clone[id].id = region.id; - clone[id].left = region.left; - clone[id].top = region.top; - clone[id].width = region.width; - clone[id].height = region.height; - }); - return clone; - }, - - //测试合法性 - _test: function (regions) { - var self = this; - return !BI.any(regions || this.regions, function (i, region) { - if (BI.isNaN(region.width) || BI.isNaN(region.height) || region.width <= 21 || region.height <= 21) { - return true; - } - }) - }, - - _getScrollOffset: function () { - return { - left: this.scrollContainer.element[0].scrollLeft, - top: this.scrollContainer.element[0].scrollTop - } - }, - - ////操作//// - _createOneRegion: function (item) { - var el = BI.createWidget(item.el); - el.setVisible(true); - return { - id: el.attr("id"), - left: item.left, - top: item.top, - width: item.width, - height: item.height, - el: el - } - }, - - _applyRegion: function (regions) { - var self = this, o = this.options; - BI.each(regions || this.regions, function (i, region) { - region.el.element.css({ - left: region.left, - top: region.top, - width: region.width, - height: region.height - }); - }); - this._applyContainer(); - this.ratio = this.getLayoutRatio(); - }, - - _renderRegion: function () { - var self = this; - BI.createWidget({ - type: "bi.absolute", - element: this.container, - items: BI.toArray(this.regions) - }); - }, - - getClientWidth: function () { - return this.scrollContainer.element[0].clientWidth; - }, - - getClientHeight: function () { - return this.scrollContainer.element[0].clientHeight; - }, - - getContainerSize: function () { - return this.container.element.bounds(); - }, - - setContainerSize: function (bounds) { - return this.container.element.bounds(bounds); - }, - - _applyContainer: function () { - //先掩藏后显示能够明确滚动条是否出现 - this.scrollContainer.element.css("overflow", "hidden"); - var occupied = this._getRegionOccupied(); - this.container.element.width(occupied.left + occupied.width).height(occupied.top + occupied.height); - this.scrollContainer.element.css("overflow", "auto"); - return occupied; - }, - - _modifyRegion: function (regions) { - BI.each(this.regions, function (id, region) { - if (regions[id]) { - region.left = regions[id].left; - region.top = regions[id].top; - region.width = regions[id].width; - region.height = regions[id].height; - } - }); - }, - - _addRegion: function (item) { - var region = this._createOneRegion(item); - this.regions[region.id] = region; - BI.createWidget({ - type: "bi.absolute", - element: this.container, - items: [region] - }); - }, - - _deleteRegionByName: function (name) { - this.regions[name].el.setVisible(false); - delete this.regions[name]; - }, - - _setArrangeSize: function (size) { - this.arrangement.element.css({ - left: size.left, - top: size.top, - width: size.width, - height: size.height - }) - }, - - //Grid - _getOneWidthPortion: function () { - return this.getClientWidth() / BI.Arrangement.PORTION; - }, - _getOneHeightPortion: function () { - return this.getClientHeight() / BI.Arrangement.H_PORTION; - }, - - _getGridPositionAndSize: function (position) { - var perWidth = this._getOneWidthPortion(); - var perHeight = this._getOneHeightPortion(); - var widthPortion = Math.round(position.width / perWidth); - var leftPortion = Math.round(position.left / perWidth); - var topPortion = Math.round(position.top / perHeight); - var heightPortion = Math.round(position.height / perHeight); - // if (leftPortion > BI.Arrangement.PORTION) { - // leftPortion = BI.Arrangement.PORTION; - // } - // if (widthPortion > BI.Arrangement.PORTION) { - // widthPortion = BI.Arrangement.PORTION; - // } - // if (leftPortion + widthPortion > BI.Arrangement.PORTION) { - // leftPortion = BI.Arrangement.PORTION - widthPortion; - // } - if (widthPortion === 0) { - widthPortion = 1; - } - if (heightPortion === 0) { - heightPortion = 1; - } - return { - x: leftPortion, - y: topPortion, - w: widthPortion, - h: heightPortion - } - }, - - _getBlockPositionAndSize: function (position) { - var perWidth = this._getOneWidthPortion(); - var perHeight = this._getOneHeightPortion(); - return { - left: position.x * perWidth, - top: position.y * perHeight, - width: position.w * perWidth, - height: position.h * perHeight - }; - }, - - _getLayoutsByRegions: function (regions) { - var self = this; - var result = []; - BI.each(regions || this.regions, function (id, region) { - result.push(BI.extend(self._getGridPositionAndSize(region), { - i: region.id - })) - }); - return result; - }, - - _getLayoutIndexByName: function (layout, name) { - return BI.findIndex(layout, function (i, l) { - return l.i === name; - }); - }, - - _setBlockPositionAndSize: function (size) { - this.block.element.css({ - left: size.left, - top: size.top, - width: size.width, - height: size.height - }); - }, - - _getRegionsByLayout: function (layout) { - var self = this; - var regions = {}; - BI.each(layout, function (i, ly) { - regions[ly.i] = BI.extend(self._getBlockPositionAndSize(ly), { - id: ly.i - }); - }); - return regions; - }, - - _setRegionsByLayout: function (regions, layout) { - var self = this; - regions || (regions = this.regions); - BI.each(layout, function (i, ly) { - if (regions[ly.i]) { - BI.extend(regions[ly.i], self._getBlockPositionAndSize(ly)); - } - }); - return regions; - }, - - _moveElement: function (layout, l, x, y, isUserAction) { - var self = this; - if (l._static) { - return layout; - } - - if (l.y === y && l.x === x) { - return layout; - } - - var movingUp = y && l.y > y; - if (typeof x === 'number') { - l.x = x; - } - if (typeof y === 'number') { - l.y = y; - } - l.moved = true; - - var sorted = this._sortLayoutItemsByRowCol(layout); - if (movingUp) { - sorted = sorted.reverse(); - } - var collisions = getAllCollisions(sorted, l); - - for (var i = 0, len = collisions.length; i < len; i++) { - var collision = collisions[i]; - if (collision.moved) { - continue; - } - - if (l.y > collision.y && l.y - collision.y > collision.h / 4) { - continue; - } - - if (collision._static) { - layout = this._moveElementAwayFromCollision(layout, collision, l, isUserAction); - } else { - layout = this._moveElementAwayFromCollision(layout, l, collision, isUserAction); - } - } - - return layout; - - function getAllCollisions(layout, layoutItem) { - return BI.filter(layout, function (i, l) { - return self._collides(l, layoutItem); - }); - } - }, - - _sortLayoutItemsByRowCol: function (layout) { - return [].concat(layout).sort(function (a, b) { - if (a.y > b.y || (a.y === b.y && a.x > b.x)) { - return 1; - } - return -1; - }); - }, - - _collides: function (l1, l2) { - if (l1 === l2) { - return false; - } // same element - if (l1.x + l1.w <= l2.x) { - return false; - } // l1 is left of l2 - if (l1.x >= l2.x + l2.w) { - return false; - } // l1 is right of l2 - if (l1.y + l1.h <= l2.y) { - return false; - } // l1 is above l2 - if (l1.y >= l2.y + l2.h) { - return false; - } // l1 is below l2 - return true; // boxes overlap - }, - - _getFirstCollision: function (layout, layoutItem) { - for (var i = 0, len = layout.length; i < len; i++) { - if (this._collides(layout[i], layoutItem)) { - return layout[i]; - } - } - }, - - _moveElementAwayFromCollision: function (layout, collidesWith, - itemToMove, isUserAction) { - if (isUserAction) { - var fakeItem = { - x: itemToMove.x, - y: itemToMove.y, - w: itemToMove.w, - h: itemToMove.h, - i: '-1' - }; - fakeItem.y = Math.max(collidesWith.y - itemToMove.h, 0); - if (!this._getFirstCollision(layout, fakeItem)) { - return this._moveElement(layout, itemToMove, undefined, fakeItem.y); - } - } - - return this._moveElement(layout, itemToMove, undefined, itemToMove.y + 1); - }, - - _compactItem: function (compareWith, l, verticalCompact) { - if (verticalCompact) { - while (l.y > 0 && !this._getFirstCollision(compareWith, l)) { - l.y--; - } - } - - var collides; - while ((collides = this._getFirstCollision(compareWith, l))) { - l.y = collides.y + collides.h; - } - return l; - }, - - compact: function (layout, verticalCompact) { - var compareWith = getStatics(layout); - var sorted = this._sortLayoutItemsByRowCol(layout); - var out = []; - - for (var i = 0, len = sorted.length; i < len; i++) { - var l = sorted[i]; - - if (!l._static) { - l = this._compactItem(compareWith, l, verticalCompact); - - compareWith.push(l); - } - - out[layout.indexOf(l)] = l; - - l.moved = false; - } - - return out; - function getStatics(layout) { - return BI.filter(layout, function (i, l) { - return l._static; - }); - } - }, - - ////公有方法//// - getRegionByName: function (name) { - var obj = {}; - obj[name] = this.regions[name]; - return this._cloneRegion(obj)[name]; - }, - - getAllRegions: function () { - return BI.toArray(this._cloneRegion()); - }, - - getHelper: function () { - var helper = BI.createWidget({ - type: "bi.layout", - width: 18, - height: 18, - cls: "arrangement-helper bi-border" - }); - BI.createWidget({ - type: "bi.absolute", - element: this, - items: [helper] - }); - return helper; - }, - - _start: function () { - this.arrangement.setVisible(true); - if (this.options.layoutType === BI.Arrangement.LAYOUT_TYPE.GRID) { - this.block.setVisible(true); - } - }, - - _stop: function () { - this.arrangement.setVisible(false); - this.block.setVisible(false); - }, - - ////公有操作//// - setLayoutType: function (type) { - var self = this, o = this.options; - if (type !== o.layoutType) { - o.layoutType = type; - switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - this.relayout(); - break; - } - } - }, - - getLayoutType: function () { - return this.options.layoutType; - }, - - getLayoutRatio: function () { - var occupied = this._getRegionOccupied(); - var width = this.getClientWidth(), height = this.getClientHeight(); - return { - x: BI.parseFloat(BI.contentFormat((occupied.left + occupied.width) / width, "#.##;-#.##")), - y: BI.parseFloat(BI.contentFormat((occupied.top + occupied.height) / height, "#.##;-#.##")) - } - }, - - addRegion: function (region, position) { - if (position) { - this.setPosition(position, region); - } - var self = this, o = this.options; - if (!this.position) { - return false; - } - var test = this._cloneRegion(); - BI.each(this.position.regions, function (i, region) { - test[region.id].left = region.left; - test[region.id].top = region.top; - test[region.id].width = region.width; - test[region.id].height = region.height; - - }); - var item = BI.extend({}, region, { - left: this.position.insert.left, - top: this.position.insert.top, - width: this.position.insert.width, - height: this.position.insert.height - }); - var added = this._createOneRegion(item); - test[added.id] = added; - if (this._test(test)) { - delete test[added.id]; - this._modifyRegion(test); - this._addRegion(item); - this._populate(this.getAllRegions()); - return true; - } - return false; - }, - - deleteRegion: function (name) { - if (!this.regions[name]) { - return false; - } - var self = this, o = this.options; - switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.FREE: - this._deleteRegionByName(name); - this._populate(this.getAllRegions()); - return true; - case BI.Arrangement.LAYOUT_TYPE.GRID: - this._deleteRegionByName(name); - this._populate(this.getAllRegions()); - this.resize(); - return true; - } - return false; - }, - - setRegionSize: function (name, size) { - var self = this, o = this.options; - var flag = false; - switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.FREE: - var clone = this._cloneRegion(); - BI.extend(clone[name], { - width: size.width, - height: size.height - }); - if (this._test(clone)) { - this._modifyRegion(clone); - flag = true; - } - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - var clone = this._cloneRegion(); - BI.extend(clone[name], { - width: size.width, - height: size.height - }); - if (this._test(clone)) { - var layout = this._getLayoutsByRegions(clone); - layout = this.compact(layout, true); - var regions = this._getRegionsByLayout(layout); - this._modifyRegion(regions); - flag = true; - } - break; - } - this._applyRegion(); - return flag; - }, - - setPosition: function (position, size) { - var self = this, o = this.options; - var insert, regions = [], cur; - if (position.left < 0 || position.top < 0) { - switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - this.resize(); - break; - } - this._stop(); - this.position = null; - return null; - } - var offset = this._getScrollOffset(); - position = { - left: position.left + offset.left, - top: position.top + offset.top - }; - switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.FREE: - var insert = { - top: position.top < 0 ? 0 : position.top, - left: position.left < 0 ? 0 : position.left, - width: size.width, - height: size.height - }; - this.position = { - insert: insert - }; - this._setArrangeSize(insert); - this._start(); - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - var p = { - top: position.top < 0 ? 0 : position.top, - left: position.left < 0 ? 0 : position.left, - width: size.width, - height: size.height - }; - this._setArrangeSize(p); - var cur = this._getGridPositionAndSize(p); - var layout = [{ - x: 0, y: BI.MAX, w: cur.w, h: cur.h, i: cur.i - }].concat(this._getLayoutsByRegions()); - layout = this._moveElement(layout, layout[0], cur.x, cur.y, true); - layout = this.compact(layout, true); - var regions = this._setRegionsByLayout(this._cloneRegion(), layout); - var insert = this._getBlockPositionAndSize(layout[0]); - this.position = { - insert: insert, - regions: regions - }; - this._applyRegion(regions); - this._setBlockPositionAndSize(insert); - this._start(); - break; - } - return this.position; - }, - - setRegionPosition: function (name, position) { - var self = this, o = this.options; - var offset = this._getScrollOffset(); - position = BI.extend(position, { - left: position.left + offset.left, - top: position.top + offset.top - }); - switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.FREE: - BI.extend(this.regions[name], { - left: position.left < 0 ? 0 : position.left, - top: position.top < 0 ? 0 : position.top - }); - this._applyRegion(); - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - if (!position.stop) { - BI.extend(this.regions[name], { - left: position.left < 0 ? 0 : position.left, - top: position.top < 0 ? 0 : position.top - }); - var cloned = this._cloneRegion(); - var cur = this._getGridPositionAndSize(BI.extend(cloned[name], { - left: position.left < 0 ? 0 : position.left, - top: position.top < 0 ? 0 : position.top - })); - var x = cur.x, y = cur.y; - cur = BI.extend(cur, { - x: 0, y: BI.MAX, i: -1 - }); - delete cloned[name]; - var layout = this._getLayoutsByRegions(cloned); - layout = this._moveElement([cur].concat(layout), cur, x, y, true); - layout = this.compact(layout, true); - var regions = this._getRegionsByLayout(layout); - this._modifyRegion(regions); - this._applyRegion(); - - this._setBlockPositionAndSize(this._getBlockPositionAndSize(cur)); - this.block.setVisible(true); - } else { - BI.extend(this.regions[name], { - left: position.left < 0 ? 0 : position.left, - top: position.top < 0 ? 0 : position.top - }); - var cloned = this._cloneRegion(); - var layout = this._getLayoutsByRegions(cloned); - layout = this.compact(layout, true); - var regions = this._getRegionsByLayout(layout); - this._modifyRegion(regions); - this._applyRegion(); - this.block.setVisible(false); - } - break; - } - }, - - setDropPosition: function (position, size) { - var self = this; - this.arrangement.setVisible(true); - var offset = this._getScrollOffset(); - this._setArrangeSize(BI.extend({}, size, { - left: position.left + offset.left, - top: position.top + offset.top - })); - return function () { - self.arrangement.setVisible(false); - } - }, - - scrollTo: function (scroll) { - this.scrollContainer.element.scrollTop(scroll.top); - this.scrollContainer.element.scrollLeft(scroll.left); - }, - - zoom: function (ratio) { - var self = this, o = this.options; - if (!ratio) { - return; - } - var occupied = this._applyContainer(); - switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.FREE: - if (this._isArrangeFine()) { - var width = this.getClientWidth(); - var xRatio = (ratio.x || 1) * width / (occupied.left + occupied.width); - //var yRatio = ratio.y * height / (occupied.top + occupied.height); - var regions = this._cloneRegion(); - BI.each(regions, function (i, region) { - region.left = region.left * xRatio; - //region.top = region.top * yRatio; - region.width = region.width * xRatio; - //region.height = region.height * yRatio; - }); - if (this._test(regions)) { - this._modifyRegion(regions); - this._applyRegion(); - } - this.resize(); - // } else { - this.relayout(); - } - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - if (this._isArrangeFine()) { - var width = this.getClientWidth(), height = this.getClientHeight(); - var xRatio = (ratio.x || 1) * width / (occupied.left + occupied.width); - var yRatio = (ratio.y || 1) * height / (occupied.top + occupied.height); - var regions = this._cloneRegion(); - BI.each(regions, function (i, region) { - region.left = region.left * xRatio; - region.width = region.width * xRatio; - region.top = region.top * yRatio; - region.height = region.height * yRatio; - }); - if (this._test(regions)) { - var layout = this._getLayoutsByRegions(regions); - layout = this.compact(layout, true); - regions = this._getRegionsByLayout(layout); - this._modifyRegion(regions); - this._applyRegion(); - } - } else { - this.relayout(); - } - break; - } - }, - - resize: function () { - var self = this, o = this.options; - switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - this.zoom(this.ratio); - var regions = this._cloneRegion(); - var layout = this._getLayoutsByRegions(regions); - layout = this.compact(layout, true); - regions = this._getRegionsByLayout(layout); - this._modifyRegion(regions); - this._applyRegion(); - break; - } - }, - - relayout: function () { - var self = this, o = this.options; - switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - if (!this._isArrangeFine()) { - var perHeight = this._getOneHeightPortion(); - var width = this.getClientWidth(), height = this.getClientHeight(); - var regions = this._cloneRegion(); - var clone = BI.toArray(regions); - clone.sort(function (r1, r2) { - if (self._isEqual(r1.top, r2.top)) { - return r1.left - r2.left; - } - return r1.top - r2.top; - }); - var count = clone.length; - var cols = 4, rows = Math.floor((count - 1) / 4 + 1); - var w = width / cols, h = height / rows; - var store = {}; - BI.each(clone, function (i, region) { - var row = Math.floor(i / 4), col = i % 4; - BI.extend(region, { - top: row * perHeight * 6, - left: col * w, - width: w, - height: perHeight * 6 - }); - if (!store[row]) { - store[row] = {}; - } - store[row][col] = region; - }); - //非4的倍数 - // if (count % 4 !== 0) { - // var lasts = store[rows - 1]; - // var perWidth = width / (count % 4); - // BI.each(lasts, function (i, region) { - // BI.extend(region, { - // left: BI.parseInt(i) * perWidth, - // width: perWidth - // }); - // }); - // } - if (this._test(clone)) { - var layout = this._getLayoutsByRegions(regions); - layout = this.compact(layout, true); - regions = this._getRegionsByLayout(layout); - this._modifyRegion(regions); - this._populate(clone); - } - } else { - this.resize(); - } - break; - } - }, - - _populate: function (items) { - this._stop(); - this._calculateRegions(items); - this._applyRegion(); - }, - - populate: function (items) { - var self = this; - BI.each(this.regions, function (name, region) { - self.regions[name].el.setVisible(false); - delete self.regions[name]; - }); - this._populate(items); - this._renderRegion(); - } -}); -BI.Arrangement.EVENT_SCROLL = "EVENT_SCROLL"; -BI.extend(BI.Arrangement, { - PORTION: 36, - H_PORTION: 18, - LAYOUT_TYPE: { - GRID: 0, - FREE: 1 - } -}); +BI.shortcut('bi.arrangement_droppable', BI.ArrangementDroppable);/** + * 布局 + * + * Created by GUY on 2016/2/23. + * @class BI.Arrangement + * @extends BI.Widget + */ +BI.Arrangement = BI.inherit(BI.Widget, { + + _defaultConfig: function () { + return BI.extend(BI.Arrangement.superclass._defaultConfig.apply(this, arguments), { + baseCls: "bi-arrangement", + layoutType: BI.Arrangement.LAYOUT_TYPE.GRID, + items: [] + }); + }, + + _init: function () { + BI.Arrangement.superclass._init.apply(this, arguments); + var self = this, o = this.options; + this.arrangement = BI.createWidget({ + type: "bi.arrangement_droppable", + cls: "arrangement-block", + invisible: true + }); + this.block = BI.createWidget({ + type: "bi.arrangement_block", + invisible: true + }); + this.container = BI.createWidget({ + type: "bi.absolute", + items: o.items.concat([this.block, this.arrangement]) + }); + + this.scrollContainer = BI.createWidget({ + type: "bi.adaptive", + width: "100%", + height: "100%", + scrollable: true, + items: [this.container] + }); + this.scrollContainer.element.scroll(function () { + self.fireEvent(BI.Arrangement.EVENT_SCROLL, { + scrollLeft: self.scrollContainer.element.scrollLeft(), + scrollTop: self.scrollContainer.element.scrollTop(), + clientWidth: self.scrollContainer.element[0].clientWidth, + clientHeight: self.scrollContainer.element[0].clientHeight + }); + }); + + BI.createWidget({ + type: "bi.adaptive", + element: this, + items: [this.scrollContainer] + }); + this.regions = {}; + if (o.items.length > 0) { + BI.nextTick(function () { + self.populate(o.items); + }); + } + }, + + ////初始化操作//// + _calculateRegions: function (items) { + var self = this, o = this.options; + this.regions = {}; + BI.each(items, function (i, item) { + var region = self._createOneRegion(item); + self.regions[region.id] = region; + }); + }, + + _isEqual: function (num1, num2) { + return Math.abs(num1 - num2) < 2; + }, + + _isLessThan: function (num1, num2) { + return num1 < num2 && !this._isEqual(num1, num2); + }, + + _isMoreThan: function (num1, num2) { + return num1 > num2 && !this._isEqual(num1, num2); + }, + + _isLessThanEqual: function (num1, num2) { + return num1 <= num2 || this._isEqual(num1, num2); + }, + + _isMoreThanEqual: function (num1, num2) { + return num1 >= num2 || this._isEqual(num1, num2); + }, + + //获取占有的最大Region + _getRegionOccupied: function (regions) { + var self = this, o = this.options; + if (BI.size(regions || this.regions) <= 0) { + return { + left: 0, + top: 0, + width: 0, + height: 0 + } + } + var minLeft = BI.MAX, maxLeft = BI.MIN, minTop = BI.MAX, maxTop = BI.MIN; + BI.each(regions || this.regions, function (id, region) { + minLeft = Math.min(minLeft, region.left); + maxLeft = Math.max(maxLeft, region.left + region.width); + minTop = Math.min(minTop, region.top); + maxTop = Math.max(maxTop, region.top + region.height); + }); + return { + left: minLeft, + top: minTop, + width: maxLeft - minLeft, + height: maxTop - minTop + } + }, + + //两个区域的交叉面积 + _getCrossArea: function (region1, region2) { + if (region1.left <= region2.left) { + if (region1.top <= region2.top) { + if (region1.top + region1.height > region2.top && region1.left + region1.width > region2.left) { + if (this._isEqual(region1.top + region1.height, region2.top) || this._isEqual(region1.left + region1.width, region2.left)) { + return 0; + } + return (region1.top + region1.height - region2.top) * (region1.left + region1.width - region2.left); + } + } else { + if (region2.top + region2.height > region1.top && region1.left + region1.width > region2.left) { + if (this._isEqual(region2.top + region2.height, region1.top) || this._isEqual(region1.left + region1.width, region2.left)) { + return 0; + } + return (region2.top + region2.height - region1.top) * (region1.left + region1.width - region2.left); + } + } + } else { + if (region1.top <= region2.top) { + if (region1.top + region1.height > region2.top && region2.left + region2.width > region1.left) { + if (this._isEqual(region1.top + region1.height, region2.top) || this._isEqual(region2.left + region2.width, region1.left)) { + return 0; + } + return (region1.top + region1.height - region2.top) * (region2.left + region2.width - region1.left); + } + } else { + if (region2.top + region2.height > region1.top && region2.left + region2.width > region1.left) { + if (this._isEqual(region2.top + region2.height, region1.top) || this._isEqual(region2.left + region2.width, region1.left)) { + return 0; + } + return (region2.top + region2.height - region1.top) * (region2.left + region2.width - region1.left); + } + } + } + return 0; + }, + + //是否有覆盖的组件 + _isRegionOverlay: function (regions) { + var reg = []; + BI.each(regions || this.regions, function (id, region) { + reg.push(new BI.Region(region.left, region.top, region.width, region.height)); + }); + for (var i = 0, len = reg.length; i < len; i++) { + for (var j = i + 1; j < len; j++) { + var area1 = { + left: reg[i].x, + top: reg[i].y, + width: reg[i].w, + height: reg[i].h + }; + var area2 = { + left: reg[j].x, + top: reg[j].y, + width: reg[j].w, + height: reg[j].h + }; + if (reg[i].isIntersects(reg[j]) && this._getCrossArea(area1, area2) > 1) { + return true; + } + } + } + return false; + }, + + //布局是否是优良的 + _isArrangeFine: function (regions) { + switch (this.options.layoutType) { + case BI.Arrangement.LAYOUT_TYPE.FREE: + return true; + case BI.Arrangement.LAYOUT_TYPE.GRID: + if (this._isRegionOverlay()) { + return false; + } + } + return true; + }, + + _getRegionNames: function (regions) { + var names = []; + BI.each(regions || this.regions, function (i, region) { + names.push(region.id || region.attr("id")); + }); + return names; + }, + + _getRegionsByNames: function (names, regions) { + names = BI.isArray(names) ? names : [names]; + regions = regions || this.regions; + if (BI.isArray(regions)) { + var result = []; + BI.each(regions, function (i, region) { + if (names.contains(region.id || region.attr("id"))) { + result.push(region); + } + }); + } else { + var result = {}; + BI.each(names, function (i, name) { + result[name] = regions[name]; + }); + } + return result; + }, + + _cloneRegion: function (regions) { + var clone = {}; + BI.each(regions || this.regions, function (id, region) { + clone[id] = {}; + clone[id].el = region.el; + clone[id].id = region.id; + clone[id].left = region.left; + clone[id].top = region.top; + clone[id].width = region.width; + clone[id].height = region.height; + }); + return clone; + }, + + //测试合法性 + _test: function (regions) { + var self = this; + return !BI.any(regions || this.regions, function (i, region) { + if (BI.isNaN(region.width) || BI.isNaN(region.height) || region.width <= 21 || region.height <= 21) { + return true; + } + }) + }, + + _getScrollOffset: function () { + return { + left: this.scrollContainer.element[0].scrollLeft, + top: this.scrollContainer.element[0].scrollTop + } + }, + + ////操作//// + _createOneRegion: function (item) { + var el = BI.createWidget(item.el); + el.setVisible(true); + return { + id: el.attr("id"), + left: item.left, + top: item.top, + width: item.width, + height: item.height, + el: el + } + }, + + _applyRegion: function (regions) { + var self = this, o = this.options; + BI.each(regions || this.regions, function (i, region) { + region.el.element.css({ + left: region.left, + top: region.top, + width: region.width, + height: region.height + }); + }); + this._applyContainer(); + this.ratio = this.getLayoutRatio(); + }, + + _renderRegion: function () { + var self = this; + BI.createWidget({ + type: "bi.absolute", + element: this.container, + items: BI.toArray(this.regions) + }); + }, + + getClientWidth: function () { + return this.scrollContainer.element[0].clientWidth; + }, + + getClientHeight: function () { + return this.scrollContainer.element[0].clientHeight; + }, + + getContainerSize: function () { + return this.container.element.bounds(); + }, + + setContainerSize: function (bounds) { + return this.container.element.bounds(bounds); + }, + + _applyContainer: function () { + //先掩藏后显示能够明确滚动条是否出现 + this.scrollContainer.element.css("overflow", "hidden"); + var occupied = this._getRegionOccupied(); + this.container.element.width(occupied.left + occupied.width).height(occupied.top + occupied.height); + this.scrollContainer.element.css("overflow", "auto"); + return occupied; + }, + + _modifyRegion: function (regions) { + BI.each(this.regions, function (id, region) { + if (regions[id]) { + region.left = regions[id].left; + region.top = regions[id].top; + region.width = regions[id].width; + region.height = regions[id].height; + } + }); + }, + + _addRegion: function (item) { + var region = this._createOneRegion(item); + this.regions[region.id] = region; + BI.createWidget({ + type: "bi.absolute", + element: this.container, + items: [region] + }); + }, + + _deleteRegionByName: function (name) { + this.regions[name].el.setVisible(false); + delete this.regions[name]; + }, + + _setArrangeSize: function (size) { + this.arrangement.element.css({ + left: size.left, + top: size.top, + width: size.width, + height: size.height + }) + }, + + //Grid + _getOneWidthPortion: function () { + return this.getClientWidth() / BI.Arrangement.PORTION; + }, + _getOneHeightPortion: function () { + return this.getClientHeight() / BI.Arrangement.H_PORTION; + }, + + _getGridPositionAndSize: function (position) { + var perWidth = this._getOneWidthPortion(); + var perHeight = this._getOneHeightPortion(); + var widthPortion = Math.round(position.width / perWidth); + var leftPortion = Math.round(position.left / perWidth); + var topPortion = Math.round(position.top / perHeight); + var heightPortion = Math.round(position.height / perHeight); + // if (leftPortion > BI.Arrangement.PORTION) { + // leftPortion = BI.Arrangement.PORTION; + // } + // if (widthPortion > BI.Arrangement.PORTION) { + // widthPortion = BI.Arrangement.PORTION; + // } + // if (leftPortion + widthPortion > BI.Arrangement.PORTION) { + // leftPortion = BI.Arrangement.PORTION - widthPortion; + // } + if (widthPortion === 0) { + widthPortion = 1; + } + if (heightPortion === 0) { + heightPortion = 1; + } + return { + x: leftPortion, + y: topPortion, + w: widthPortion, + h: heightPortion + } + }, + + _getBlockPositionAndSize: function (position) { + var perWidth = this._getOneWidthPortion(); + var perHeight = this._getOneHeightPortion(); + return { + left: position.x * perWidth, + top: position.y * perHeight, + width: position.w * perWidth, + height: position.h * perHeight + }; + }, + + _getLayoutsByRegions: function (regions) { + var self = this; + var result = []; + BI.each(regions || this.regions, function (id, region) { + result.push(BI.extend(self._getGridPositionAndSize(region), { + i: region.id + })) + }); + return result; + }, + + _getLayoutIndexByName: function (layout, name) { + return BI.findIndex(layout, function (i, l) { + return l.i === name; + }); + }, + + _setBlockPositionAndSize: function (size) { + this.block.element.css({ + left: size.left, + top: size.top, + width: size.width, + height: size.height + }); + }, + + _getRegionsByLayout: function (layout) { + var self = this; + var regions = {}; + BI.each(layout, function (i, ly) { + regions[ly.i] = BI.extend(self._getBlockPositionAndSize(ly), { + id: ly.i + }); + }); + return regions; + }, + + _setRegionsByLayout: function (regions, layout) { + var self = this; + regions || (regions = this.regions); + BI.each(layout, function (i, ly) { + if (regions[ly.i]) { + BI.extend(regions[ly.i], self._getBlockPositionAndSize(ly)); + } + }); + return regions; + }, + + _moveElement: function (layout, l, x, y, isUserAction) { + var self = this; + if (l._static) { + return layout; + } + + if (l.y === y && l.x === x) { + return layout; + } + + var movingUp = y && l.y > y; + if (typeof x === 'number') { + l.x = x; + } + if (typeof y === 'number') { + l.y = y; + } + l.moved = true; + + var sorted = this._sortLayoutItemsByRowCol(layout); + if (movingUp) { + sorted = sorted.reverse(); + } + var collisions = getAllCollisions(sorted, l); + + for (var i = 0, len = collisions.length; i < len; i++) { + var collision = collisions[i]; + if (collision.moved) { + continue; + } + + if (l.y > collision.y && l.y - collision.y > collision.h / 4) { + continue; + } + + if (collision._static) { + layout = this._moveElementAwayFromCollision(layout, collision, l, isUserAction); + } else { + layout = this._moveElementAwayFromCollision(layout, l, collision, isUserAction); + } + } + + return layout; + + function getAllCollisions(layout, layoutItem) { + return BI.filter(layout, function (i, l) { + return self._collides(l, layoutItem); + }); + } + }, + + _sortLayoutItemsByRowCol: function (layout) { + return [].concat(layout).sort(function (a, b) { + if (a.y > b.y || (a.y === b.y && a.x > b.x)) { + return 1; + } + return -1; + }); + }, + + _collides: function (l1, l2) { + if (l1 === l2) { + return false; + } // same element + if (l1.x + l1.w <= l2.x) { + return false; + } // l1 is left of l2 + if (l1.x >= l2.x + l2.w) { + return false; + } // l1 is right of l2 + if (l1.y + l1.h <= l2.y) { + return false; + } // l1 is above l2 + if (l1.y >= l2.y + l2.h) { + return false; + } // l1 is below l2 + return true; // boxes overlap + }, + + _getFirstCollision: function (layout, layoutItem) { + for (var i = 0, len = layout.length; i < len; i++) { + if (this._collides(layout[i], layoutItem)) { + return layout[i]; + } + } + }, + + _moveElementAwayFromCollision: function (layout, collidesWith, + itemToMove, isUserAction) { + if (isUserAction) { + var fakeItem = { + x: itemToMove.x, + y: itemToMove.y, + w: itemToMove.w, + h: itemToMove.h, + i: '-1' + }; + fakeItem.y = Math.max(collidesWith.y - itemToMove.h, 0); + if (!this._getFirstCollision(layout, fakeItem)) { + return this._moveElement(layout, itemToMove, undefined, fakeItem.y); + } + } + + return this._moveElement(layout, itemToMove, undefined, itemToMove.y + 1); + }, + + _compactItem: function (compareWith, l, verticalCompact) { + if (verticalCompact) { + while (l.y > 0 && !this._getFirstCollision(compareWith, l)) { + l.y--; + } + } + + var collides; + while ((collides = this._getFirstCollision(compareWith, l))) { + l.y = collides.y + collides.h; + } + return l; + }, + + compact: function (layout, verticalCompact) { + var compareWith = getStatics(layout); + var sorted = this._sortLayoutItemsByRowCol(layout); + var out = []; + + for (var i = 0, len = sorted.length; i < len; i++) { + var l = sorted[i]; + + if (!l._static) { + l = this._compactItem(compareWith, l, verticalCompact); + + compareWith.push(l); + } + + out[layout.indexOf(l)] = l; + + l.moved = false; + } + + return out; + function getStatics(layout) { + return BI.filter(layout, function (i, l) { + return l._static; + }); + } + }, + + ////公有方法//// + getRegionByName: function (name) { + var obj = {}; + obj[name] = this.regions[name]; + return this._cloneRegion(obj)[name]; + }, + + getAllRegions: function () { + return BI.toArray(this._cloneRegion()); + }, + + getHelper: function () { + var helper = BI.createWidget({ + type: "bi.layout", + width: 18, + height: 18, + cls: "arrangement-helper bi-border" + }); + BI.createWidget({ + type: "bi.absolute", + element: this, + items: [helper] + }); + return helper; + }, + + _start: function () { + this.arrangement.setVisible(true); + if (this.options.layoutType === BI.Arrangement.LAYOUT_TYPE.GRID) { + this.block.setVisible(true); + } + }, + + _stop: function () { + this.arrangement.setVisible(false); + this.block.setVisible(false); + }, + + ////公有操作//// + setLayoutType: function (type) { + var self = this, o = this.options; + if (type !== o.layoutType) { + o.layoutType = type; + switch (o.layoutType) { + case BI.Arrangement.LAYOUT_TYPE.FREE: + break; + case BI.Arrangement.LAYOUT_TYPE.GRID: + this.relayout(); + break; + } + } + }, + + getLayoutType: function () { + return this.options.layoutType; + }, + + getLayoutRatio: function () { + var occupied = this._getRegionOccupied(); + var width = this.getClientWidth(), height = this.getClientHeight(); + return { + x: BI.parseFloat(BI.contentFormat((occupied.left + occupied.width) / width, "#.##;-#.##")), + y: BI.parseFloat(BI.contentFormat((occupied.top + occupied.height) / height, "#.##;-#.##")) + } + }, + + addRegion: function (region, position) { + if (position) { + this.setPosition(position, region); + } + var self = this, o = this.options; + if (!this.position) { + return false; + } + var test = this._cloneRegion(); + BI.each(this.position.regions, function (i, region) { + test[region.id].left = region.left; + test[region.id].top = region.top; + test[region.id].width = region.width; + test[region.id].height = region.height; + + }); + var item = BI.extend({}, region, { + left: this.position.insert.left, + top: this.position.insert.top, + width: this.position.insert.width, + height: this.position.insert.height + }); + var added = this._createOneRegion(item); + test[added.id] = added; + if (this._test(test)) { + delete test[added.id]; + this._modifyRegion(test); + this._addRegion(item); + this._populate(this.getAllRegions()); + return true; + } + return false; + }, + + deleteRegion: function (name) { + if (!this.regions[name]) { + return false; + } + var self = this, o = this.options; + switch (o.layoutType) { + case BI.Arrangement.LAYOUT_TYPE.FREE: + this._deleteRegionByName(name); + this._populate(this.getAllRegions()); + return true; + case BI.Arrangement.LAYOUT_TYPE.GRID: + this._deleteRegionByName(name); + this._populate(this.getAllRegions()); + this.resize(); + return true; + } + return false; + }, + + setRegionSize: function (name, size) { + var self = this, o = this.options; + var flag = false; + switch (o.layoutType) { + case BI.Arrangement.LAYOUT_TYPE.FREE: + var clone = this._cloneRegion(); + BI.extend(clone[name], { + width: size.width, + height: size.height + }); + if (this._test(clone)) { + this._modifyRegion(clone); + flag = true; + } + break; + case BI.Arrangement.LAYOUT_TYPE.GRID: + var clone = this._cloneRegion(); + BI.extend(clone[name], { + width: size.width, + height: size.height + }); + if (this._test(clone)) { + var layout = this._getLayoutsByRegions(clone); + layout = this.compact(layout, true); + var regions = this._getRegionsByLayout(layout); + this._modifyRegion(regions); + flag = true; + } + break; + } + this._applyRegion(); + return flag; + }, + + setPosition: function (position, size) { + var self = this, o = this.options; + var insert, regions = [], cur; + if (position.left < 0 || position.top < 0) { + switch (o.layoutType) { + case BI.Arrangement.LAYOUT_TYPE.FREE: + break; + case BI.Arrangement.LAYOUT_TYPE.GRID: + this.resize(); + break; + } + this._stop(); + this.position = null; + return null; + } + var offset = this._getScrollOffset(); + position = { + left: position.left + offset.left, + top: position.top + offset.top + }; + switch (o.layoutType) { + case BI.Arrangement.LAYOUT_TYPE.FREE: + var insert = { + top: position.top < 0 ? 0 : position.top, + left: position.left < 0 ? 0 : position.left, + width: size.width, + height: size.height + }; + this.position = { + insert: insert + }; + this._setArrangeSize(insert); + this._start(); + break; + case BI.Arrangement.LAYOUT_TYPE.GRID: + var p = { + top: position.top < 0 ? 0 : position.top, + left: position.left < 0 ? 0 : position.left, + width: size.width, + height: size.height + }; + this._setArrangeSize(p); + var cur = this._getGridPositionAndSize(p); + var layout = [{ + x: 0, y: BI.MAX, w: cur.w, h: cur.h, i: cur.i + }].concat(this._getLayoutsByRegions()); + layout = this._moveElement(layout, layout[0], cur.x, cur.y, true); + layout = this.compact(layout, true); + var regions = this._setRegionsByLayout(this._cloneRegion(), layout); + var insert = this._getBlockPositionAndSize(layout[0]); + this.position = { + insert: insert, + regions: regions + }; + this._applyRegion(regions); + this._setBlockPositionAndSize(insert); + this._start(); + break; + } + return this.position; + }, + + setRegionPosition: function (name, position) { + var self = this, o = this.options; + var offset = this._getScrollOffset(); + position = BI.extend(position, { + left: position.left + offset.left, + top: position.top + offset.top + }); + switch (o.layoutType) { + case BI.Arrangement.LAYOUT_TYPE.FREE: + BI.extend(this.regions[name], { + left: position.left < 0 ? 0 : position.left, + top: position.top < 0 ? 0 : position.top + }); + this._applyRegion(); + break; + case BI.Arrangement.LAYOUT_TYPE.GRID: + if (!position.stop) { + BI.extend(this.regions[name], { + left: position.left < 0 ? 0 : position.left, + top: position.top < 0 ? 0 : position.top + }); + var cloned = this._cloneRegion(); + var cur = this._getGridPositionAndSize(BI.extend(cloned[name], { + left: position.left < 0 ? 0 : position.left, + top: position.top < 0 ? 0 : position.top + })); + var x = cur.x, y = cur.y; + cur = BI.extend(cur, { + x: 0, y: BI.MAX, i: -1 + }); + delete cloned[name]; + var layout = this._getLayoutsByRegions(cloned); + layout = this._moveElement([cur].concat(layout), cur, x, y, true); + layout = this.compact(layout, true); + var regions = this._getRegionsByLayout(layout); + this._modifyRegion(regions); + this._applyRegion(); + + this._setBlockPositionAndSize(this._getBlockPositionAndSize(cur)); + this.block.setVisible(true); + } else { + BI.extend(this.regions[name], { + left: position.left < 0 ? 0 : position.left, + top: position.top < 0 ? 0 : position.top + }); + var cloned = this._cloneRegion(); + var layout = this._getLayoutsByRegions(cloned); + layout = this.compact(layout, true); + var regions = this._getRegionsByLayout(layout); + this._modifyRegion(regions); + this._applyRegion(); + this.block.setVisible(false); + } + break; + } + }, + + setDropPosition: function (position, size) { + var self = this; + this.arrangement.setVisible(true); + var offset = this._getScrollOffset(); + this._setArrangeSize(BI.extend({}, size, { + left: position.left + offset.left, + top: position.top + offset.top + })); + return function () { + self.arrangement.setVisible(false); + } + }, + + scrollTo: function (scroll) { + this.scrollContainer.element.scrollTop(scroll.top); + this.scrollContainer.element.scrollLeft(scroll.left); + }, + + zoom: function (ratio) { + var self = this, o = this.options; + if (!ratio) { + return; + } + var occupied = this._applyContainer(); + switch (this.getLayoutType()) { + case BI.Arrangement.LAYOUT_TYPE.FREE: + if (this._isArrangeFine()) { + var width = this.getClientWidth(); + var xRatio = (ratio.x || 1) * width / (occupied.left + occupied.width); + //var yRatio = ratio.y * height / (occupied.top + occupied.height); + var regions = this._cloneRegion(); + BI.each(regions, function (i, region) { + region.left = region.left * xRatio; + //region.top = region.top * yRatio; + region.width = region.width * xRatio; + //region.height = region.height * yRatio; + }); + if (this._test(regions)) { + this._modifyRegion(regions); + this._applyRegion(); + } + this.resize(); + // } else { + this.relayout(); + } + break; + case BI.Arrangement.LAYOUT_TYPE.GRID: + if (this._isArrangeFine()) { + var width = this.getClientWidth(), height = this.getClientHeight(); + var xRatio = (ratio.x || 1) * width / (occupied.left + occupied.width); + var yRatio = (ratio.y || 1) * height / (occupied.top + occupied.height); + var regions = this._cloneRegion(); + BI.each(regions, function (i, region) { + region.left = region.left * xRatio; + region.width = region.width * xRatio; + region.top = region.top * yRatio; + region.height = region.height * yRatio; + }); + if (this._test(regions)) { + var layout = this._getLayoutsByRegions(regions); + layout = this.compact(layout, true); + regions = this._getRegionsByLayout(layout); + this._modifyRegion(regions); + this._applyRegion(); + } + } else { + this.relayout(); + } + break; + } + }, + + resize: function () { + var self = this, o = this.options; + switch (o.layoutType) { + case BI.Arrangement.LAYOUT_TYPE.FREE: + break; + case BI.Arrangement.LAYOUT_TYPE.GRID: + this.zoom(this.ratio); + var regions = this._cloneRegion(); + var layout = this._getLayoutsByRegions(regions); + layout = this.compact(layout, true); + regions = this._getRegionsByLayout(layout); + this._modifyRegion(regions); + this._applyRegion(); + break; + } + }, + + relayout: function () { + var self = this, o = this.options; + switch (o.layoutType) { + case BI.Arrangement.LAYOUT_TYPE.FREE: + break; + case BI.Arrangement.LAYOUT_TYPE.GRID: + if (!this._isArrangeFine()) { + var perHeight = this._getOneHeightPortion(); + var width = this.getClientWidth(), height = this.getClientHeight(); + var regions = this._cloneRegion(); + var clone = BI.toArray(regions); + clone.sort(function (r1, r2) { + if (self._isEqual(r1.top, r2.top)) { + return r1.left - r2.left; + } + return r1.top - r2.top; + }); + var count = clone.length; + var cols = 4, rows = Math.floor((count - 1) / 4 + 1); + var w = width / cols, h = height / rows; + var store = {}; + BI.each(clone, function (i, region) { + var row = Math.floor(i / 4), col = i % 4; + BI.extend(region, { + top: row * perHeight * 6, + left: col * w, + width: w, + height: perHeight * 6 + }); + if (!store[row]) { + store[row] = {}; + } + store[row][col] = region; + }); + //非4的倍数 + // if (count % 4 !== 0) { + // var lasts = store[rows - 1]; + // var perWidth = width / (count % 4); + // BI.each(lasts, function (i, region) { + // BI.extend(region, { + // left: BI.parseInt(i) * perWidth, + // width: perWidth + // }); + // }); + // } + if (this._test(clone)) { + var layout = this._getLayoutsByRegions(regions); + layout = this.compact(layout, true); + regions = this._getRegionsByLayout(layout); + this._modifyRegion(regions); + this._populate(clone); + } + } else { + this.resize(); + } + break; + } + }, + + _populate: function (items) { + this._stop(); + this._calculateRegions(items); + this._applyRegion(); + }, + + populate: function (items) { + var self = this; + BI.each(this.regions, function (name, region) { + self.regions[name].el.setVisible(false); + delete self.regions[name]; + }); + this._populate(items); + this._renderRegion(); + } +}); +BI.Arrangement.EVENT_SCROLL = "EVENT_SCROLL"; +BI.extend(BI.Arrangement, { + PORTION: 36, + H_PORTION: 18, + LAYOUT_TYPE: { + GRID: 0, + FREE: 1 + } +}); BI.shortcut('bi.arrangement', BI.Arrangement);/** * 表关联树 * diff --git a/demo/js/widget/demo.multiselectcombo.js b/demo/js/widget/demo.multiselectcombo.js index 72e35cae7f..431982b934 100644 --- a/demo/js/widget/demo.multiselectcombo.js +++ b/demo/js/widget/demo.multiselectcombo.js @@ -35,7 +35,7 @@ Demo.MultiSelectCombo = BI.inherit(BI.Widget, { _itemsCreator: function (options, callback) { var self = this; - var items = Demo.MULTI_COMBO_ITEMS; + var items = Demo.CONSTANTS.ITEMS; var keywords = (options.keywords || []).slice(); if (options.keyword) { keywords.push(options.keyword); diff --git a/docs/base.js b/docs/base.js index 12f0a1f2b3..9562d00b56 100644 --- a/docs/base.js +++ b/docs/base.js @@ -4825,6 +4825,17 @@ BI.Tab = BI.inherit(BI.Widget, { } }, + removeTab: function (cardname) { + var self = this, o = this.options; + BI.any(this.cardMap, function (name, card) { + if (BI.isEqual(name, (cardname + ""))) { + self.layout.deleteCardByName(name); + delete self.cardMap[name]; + return true; + } + }); + }, + getSelect: function () { return this.curr; }, @@ -32473,14 +32484,14 @@ BI.ResizableTableCell = BI.inherit(BI.Widget, { function optimizeSize(s) { var optSize = BI.clamp(s, o.minSize, o.maxSize || Number.MAX_VALUE); - if (o.suitableSize) { - if (Math.abs(o.suitableSize - optSize) < 5) { - optSize = o.suitableSize; - self.handler.element.addClass("suitable"); - } else { - self.handler.element.removeClass("suitable"); - } - } + // if (o.suitableSize) { + // if (Math.abs(o.suitableSize - optSize) < 5) { + // optSize = o.suitableSize; + // self.handler.element.addClass("suitable"); + // } else { + // self.handler.element.removeClass("suitable"); + // } + // } return optSize; } diff --git a/docs/case.js b/docs/case.js index 9cd6d39883..f32acbb044 100644 --- a/docs/case.js +++ b/docs/case.js @@ -4914,6 +4914,7 @@ BI.BubbleCombo = BI.inherit(BI.Widget, { default: break; } + this.triangle && this.triangle.destroy(); this.triangle = BI.createWidget(op, { type: "bi.center_adapt", cls: "button-combo-triangle-wrapper", @@ -4974,6 +4975,7 @@ BI.BubbleCombo = BI.inherit(BI.Widget, { _hideTriangle: function () { this.triangle && this.triangle.destroy(); + this.triangle = null; this.combo.getView() && this.combo.getView().hideLine(); }, @@ -4986,10 +4988,6 @@ BI.BubbleCombo = BI.inherit(BI.Widget, { this.combo && this.combo.showView(); }, - hasView: function () { - return BI.isNotNull(this.combo.getView()); - }, - isViewVisible: function () { return this.combo.isViewVisible(); } @@ -9138,6 +9136,9 @@ BI.SortList = BI.inherit(BI.Widget, { }, populate: function (items) { + if (items) { + arguments[0] = this._formatItems(items); + } this.loader.populate.apply(this.loader, arguments); }, @@ -12346,6 +12347,7 @@ BI.EditorTrigger = BI.inherit(BI.Trigger, { }, { el: { type: "bi.trigger_icon_button", + cls: "bi-border-left", width: o.triggerWidth }, width: o.triggerWidth diff --git a/docs/demo.js b/docs/demo.js index 70b7c2cce5..9be90d02cc 100644 --- a/docs/demo.js +++ b/docs/demo.js @@ -5995,7 +5995,7 @@ Demo.MultiSelectCombo = BI.inherit(BI.Widget, { _itemsCreator: function (options, callback) { var self = this; - var items = Demo.MULTI_COMBO_ITEMS; + var items = Demo.CONSTANTS.ITEMS; var keywords = (options.keywords || []).slice(); if (options.keyword) { keywords.push(options.keyword); diff --git a/docs/widget.js b/docs/widget.js index 820a05217c..ad4163ffd7 100644 --- a/docs/widget.js +++ b/docs/widget.js @@ -792,1048 +792,1048 @@ BI.ArrangementDroppable = BI.inherit(BI.Widget, { }); } }); -BI.shortcut('bi.arrangement_droppable', BI.ArrangementDroppable);/** - * 布局 - * - * Created by GUY on 2016/2/23. - * @class BI.Arrangement - * @extends BI.Widget - */ -BI.Arrangement = BI.inherit(BI.Widget, { - - _defaultConfig: function () { - return BI.extend(BI.Arrangement.superclass._defaultConfig.apply(this, arguments), { - baseCls: "bi-arrangement", - layoutType: BI.Arrangement.LAYOUT_TYPE.GRID, - items: [] - }); - }, - - _init: function () { - BI.Arrangement.superclass._init.apply(this, arguments); - var self = this, o = this.options; - this.arrangement = BI.createWidget({ - type: "bi.arrangement_droppable", - cls: "arrangement-block", - invisible: true - }); - this.block = BI.createWidget({ - type: "bi.arrangement_block", - invisible: true - }); - this.container = BI.createWidget({ - type: "bi.absolute", - items: o.items.concat([this.block, this.arrangement]) - }); - - this.scrollContainer = BI.createWidget({ - type: "bi.adaptive", - width: "100%", - height: "100%", - scrollable: true, - items: [this.container] - }); - this.scrollContainer.element.scroll(function () { - self.fireEvent(BI.Arrangement.EVENT_SCROLL, { - scrollLeft: self.scrollContainer.element.scrollLeft(), - scrollTop: self.scrollContainer.element.scrollTop(), - clientWidth: self.scrollContainer.element[0].clientWidth, - clientHeight: self.scrollContainer.element[0].clientHeight - }); - }); - - BI.createWidget({ - type: "bi.adaptive", - element: this, - items: [this.scrollContainer] - }); - this.regions = {}; - if (o.items.length > 0) { - BI.nextTick(function () { - self.populate(o.items); - }); - } - }, - - ////初始化操作//// - _calculateRegions: function (items) { - var self = this, o = this.options; - this.regions = {}; - BI.each(items, function (i, item) { - var region = self._createOneRegion(item); - self.regions[region.id] = region; - }); - }, - - _isEqual: function (num1, num2) { - return Math.abs(num1 - num2) < 2; - }, - - _isLessThan: function (num1, num2) { - return num1 < num2 && !this._isEqual(num1, num2); - }, - - _isMoreThan: function (num1, num2) { - return num1 > num2 && !this._isEqual(num1, num2); - }, - - _isLessThanEqual: function (num1, num2) { - return num1 <= num2 || this._isEqual(num1, num2); - }, - - _isMoreThanEqual: function (num1, num2) { - return num1 >= num2 || this._isEqual(num1, num2); - }, - - //获取占有的最大Region - _getRegionOccupied: function (regions) { - var self = this, o = this.options; - if (BI.size(regions || this.regions) <= 0) { - return { - left: 0, - top: 0, - width: 0, - height: 0 - } - } - var minLeft = BI.MAX, maxLeft = BI.MIN, minTop = BI.MAX, maxTop = BI.MIN; - BI.each(regions || this.regions, function (id, region) { - minLeft = Math.min(minLeft, region.left); - maxLeft = Math.max(maxLeft, region.left + region.width); - minTop = Math.min(minTop, region.top); - maxTop = Math.max(maxTop, region.top + region.height); - }); - return { - left: minLeft, - top: minTop, - width: maxLeft - minLeft, - height: maxTop - minTop - } - }, - - //两个区域的交叉面积 - _getCrossArea: function (region1, region2) { - if (region1.left <= region2.left) { - if (region1.top <= region2.top) { - if (region1.top + region1.height > region2.top && region1.left + region1.width > region2.left) { - if (this._isEqual(region1.top + region1.height, region2.top) || this._isEqual(region1.left + region1.width, region2.left)) { - return 0; - } - return (region1.top + region1.height - region2.top) * (region1.left + region1.width - region2.left); - } - } else { - if (region2.top + region2.height > region1.top && region1.left + region1.width > region2.left) { - if (this._isEqual(region2.top + region2.height, region1.top) || this._isEqual(region1.left + region1.width, region2.left)) { - return 0; - } - return (region2.top + region2.height - region1.top) * (region1.left + region1.width - region2.left); - } - } - } else { - if (region1.top <= region2.top) { - if (region1.top + region1.height > region2.top && region2.left + region2.width > region1.left) { - if (this._isEqual(region1.top + region1.height, region2.top) || this._isEqual(region2.left + region2.width, region1.left)) { - return 0; - } - return (region1.top + region1.height - region2.top) * (region2.left + region2.width - region1.left); - } - } else { - if (region2.top + region2.height > region1.top && region2.left + region2.width > region1.left) { - if (this._isEqual(region2.top + region2.height, region1.top) || this._isEqual(region2.left + region2.width, region1.left)) { - return 0; - } - return (region2.top + region2.height - region1.top) * (region2.left + region2.width - region1.left); - } - } - } - return 0; - }, - - //是否有覆盖的组件 - _isRegionOverlay: function (regions) { - var reg = []; - BI.each(regions || this.regions, function (id, region) { - reg.push(new BI.Region(region.left, region.top, region.width, region.height)); - }); - for (var i = 0, len = reg.length; i < len; i++) { - for (var j = i + 1; j < len; j++) { - var area1 = { - left: reg[i].x, - top: reg[i].y, - width: reg[i].w, - height: reg[i].h - }; - var area2 = { - left: reg[j].x, - top: reg[j].y, - width: reg[j].w, - height: reg[j].h - }; - if (reg[i].isIntersects(reg[j]) && this._getCrossArea(area1, area2) > 1) { - return true; - } - } - } - return false; - }, - - //布局是否是优良的 - _isArrangeFine: function (regions) { - switch (this.options.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.FREE: - return true; - case BI.Arrangement.LAYOUT_TYPE.GRID: - if (this._isRegionOverlay()) { - return false; - } - } - return true; - }, - - _getRegionNames: function (regions) { - var names = []; - BI.each(regions || this.regions, function (i, region) { - names.push(region.id || region.attr("id")); - }); - return names; - }, - - _getRegionsByNames: function (names, regions) { - names = BI.isArray(names) ? names : [names]; - regions = regions || this.regions; - if (BI.isArray(regions)) { - var result = []; - BI.each(regions, function (i, region) { - if (names.contains(region.id || region.attr("id"))) { - result.push(region); - } - }); - } else { - var result = {}; - BI.each(names, function (i, name) { - result[name] = regions[name]; - }); - } - return result; - }, - - _cloneRegion: function (regions) { - var clone = {}; - BI.each(regions || this.regions, function (id, region) { - clone[id] = {}; - clone[id].el = region.el; - clone[id].id = region.id; - clone[id].left = region.left; - clone[id].top = region.top; - clone[id].width = region.width; - clone[id].height = region.height; - }); - return clone; - }, - - //测试合法性 - _test: function (regions) { - var self = this; - return !BI.any(regions || this.regions, function (i, region) { - if (BI.isNaN(region.width) || BI.isNaN(region.height) || region.width <= 21 || region.height <= 21) { - return true; - } - }) - }, - - _getScrollOffset: function () { - return { - left: this.scrollContainer.element[0].scrollLeft, - top: this.scrollContainer.element[0].scrollTop - } - }, - - ////操作//// - _createOneRegion: function (item) { - var el = BI.createWidget(item.el); - el.setVisible(true); - return { - id: el.attr("id"), - left: item.left, - top: item.top, - width: item.width, - height: item.height, - el: el - } - }, - - _applyRegion: function (regions) { - var self = this, o = this.options; - BI.each(regions || this.regions, function (i, region) { - region.el.element.css({ - left: region.left, - top: region.top, - width: region.width, - height: region.height - }); - }); - this._applyContainer(); - this.ratio = this.getLayoutRatio(); - }, - - _renderRegion: function () { - var self = this; - BI.createWidget({ - type: "bi.absolute", - element: this.container, - items: BI.toArray(this.regions) - }); - }, - - getClientWidth: function () { - return this.scrollContainer.element[0].clientWidth; - }, - - getClientHeight: function () { - return this.scrollContainer.element[0].clientHeight; - }, - - getContainerSize: function () { - return this.container.element.bounds(); - }, - - setContainerSize: function (bounds) { - return this.container.element.bounds(bounds); - }, - - _applyContainer: function () { - //先掩藏后显示能够明确滚动条是否出现 - this.scrollContainer.element.css("overflow", "hidden"); - var occupied = this._getRegionOccupied(); - this.container.element.width(occupied.left + occupied.width).height(occupied.top + occupied.height); - this.scrollContainer.element.css("overflow", "auto"); - return occupied; - }, - - _modifyRegion: function (regions) { - BI.each(this.regions, function (id, region) { - if (regions[id]) { - region.left = regions[id].left; - region.top = regions[id].top; - region.width = regions[id].width; - region.height = regions[id].height; - } - }); - }, - - _addRegion: function (item) { - var region = this._createOneRegion(item); - this.regions[region.id] = region; - BI.createWidget({ - type: "bi.absolute", - element: this.container, - items: [region] - }); - }, - - _deleteRegionByName: function (name) { - this.regions[name].el.setVisible(false); - delete this.regions[name]; - }, - - _setArrangeSize: function (size) { - this.arrangement.element.css({ - left: size.left, - top: size.top, - width: size.width, - height: size.height - }) - }, - - //Grid - _getOneWidthPortion: function () { - return this.getClientWidth() / BI.Arrangement.PORTION; - }, - _getOneHeightPortion: function () { - return this.getClientHeight() / BI.Arrangement.H_PORTION; - }, - - _getGridPositionAndSize: function (position) { - var perWidth = this._getOneWidthPortion(); - var perHeight = this._getOneHeightPortion(); - var widthPortion = Math.round(position.width / perWidth); - var leftPortion = Math.round(position.left / perWidth); - var topPortion = Math.round(position.top / perHeight); - var heightPortion = Math.round(position.height / perHeight); - // if (leftPortion > BI.Arrangement.PORTION) { - // leftPortion = BI.Arrangement.PORTION; - // } - // if (widthPortion > BI.Arrangement.PORTION) { - // widthPortion = BI.Arrangement.PORTION; - // } - // if (leftPortion + widthPortion > BI.Arrangement.PORTION) { - // leftPortion = BI.Arrangement.PORTION - widthPortion; - // } - if (widthPortion === 0) { - widthPortion = 1; - } - if (heightPortion === 0) { - heightPortion = 1; - } - return { - x: leftPortion, - y: topPortion, - w: widthPortion, - h: heightPortion - } - }, - - _getBlockPositionAndSize: function (position) { - var perWidth = this._getOneWidthPortion(); - var perHeight = this._getOneHeightPortion(); - return { - left: position.x * perWidth, - top: position.y * perHeight, - width: position.w * perWidth, - height: position.h * perHeight - }; - }, - - _getLayoutsByRegions: function (regions) { - var self = this; - var result = []; - BI.each(regions || this.regions, function (id, region) { - result.push(BI.extend(self._getGridPositionAndSize(region), { - i: region.id - })) - }); - return result; - }, - - _getLayoutIndexByName: function (layout, name) { - return BI.findIndex(layout, function (i, l) { - return l.i === name; - }); - }, - - _setBlockPositionAndSize: function (size) { - this.block.element.css({ - left: size.left, - top: size.top, - width: size.width, - height: size.height - }); - }, - - _getRegionsByLayout: function (layout) { - var self = this; - var regions = {}; - BI.each(layout, function (i, ly) { - regions[ly.i] = BI.extend(self._getBlockPositionAndSize(ly), { - id: ly.i - }); - }); - return regions; - }, - - _setRegionsByLayout: function (regions, layout) { - var self = this; - regions || (regions = this.regions); - BI.each(layout, function (i, ly) { - if (regions[ly.i]) { - BI.extend(regions[ly.i], self._getBlockPositionAndSize(ly)); - } - }); - return regions; - }, - - _moveElement: function (layout, l, x, y, isUserAction) { - var self = this; - if (l._static) { - return layout; - } - - if (l.y === y && l.x === x) { - return layout; - } - - var movingUp = y && l.y > y; - if (typeof x === 'number') { - l.x = x; - } - if (typeof y === 'number') { - l.y = y; - } - l.moved = true; - - var sorted = this._sortLayoutItemsByRowCol(layout); - if (movingUp) { - sorted = sorted.reverse(); - } - var collisions = getAllCollisions(sorted, l); - - for (var i = 0, len = collisions.length; i < len; i++) { - var collision = collisions[i]; - if (collision.moved) { - continue; - } - - if (l.y > collision.y && l.y - collision.y > collision.h / 4) { - continue; - } - - if (collision._static) { - layout = this._moveElementAwayFromCollision(layout, collision, l, isUserAction); - } else { - layout = this._moveElementAwayFromCollision(layout, l, collision, isUserAction); - } - } - - return layout; - - function getAllCollisions(layout, layoutItem) { - return BI.filter(layout, function (i, l) { - return self._collides(l, layoutItem); - }); - } - }, - - _sortLayoutItemsByRowCol: function (layout) { - return [].concat(layout).sort(function (a, b) { - if (a.y > b.y || (a.y === b.y && a.x > b.x)) { - return 1; - } - return -1; - }); - }, - - _collides: function (l1, l2) { - if (l1 === l2) { - return false; - } // same element - if (l1.x + l1.w <= l2.x) { - return false; - } // l1 is left of l2 - if (l1.x >= l2.x + l2.w) { - return false; - } // l1 is right of l2 - if (l1.y + l1.h <= l2.y) { - return false; - } // l1 is above l2 - if (l1.y >= l2.y + l2.h) { - return false; - } // l1 is below l2 - return true; // boxes overlap - }, - - _getFirstCollision: function (layout, layoutItem) { - for (var i = 0, len = layout.length; i < len; i++) { - if (this._collides(layout[i], layoutItem)) { - return layout[i]; - } - } - }, - - _moveElementAwayFromCollision: function (layout, collidesWith, - itemToMove, isUserAction) { - if (isUserAction) { - var fakeItem = { - x: itemToMove.x, - y: itemToMove.y, - w: itemToMove.w, - h: itemToMove.h, - i: '-1' - }; - fakeItem.y = Math.max(collidesWith.y - itemToMove.h, 0); - if (!this._getFirstCollision(layout, fakeItem)) { - return this._moveElement(layout, itemToMove, undefined, fakeItem.y); - } - } - - return this._moveElement(layout, itemToMove, undefined, itemToMove.y + 1); - }, - - _compactItem: function (compareWith, l, verticalCompact) { - if (verticalCompact) { - while (l.y > 0 && !this._getFirstCollision(compareWith, l)) { - l.y--; - } - } - - var collides; - while ((collides = this._getFirstCollision(compareWith, l))) { - l.y = collides.y + collides.h; - } - return l; - }, - - compact: function (layout, verticalCompact) { - var compareWith = getStatics(layout); - var sorted = this._sortLayoutItemsByRowCol(layout); - var out = []; - - for (var i = 0, len = sorted.length; i < len; i++) { - var l = sorted[i]; - - if (!l._static) { - l = this._compactItem(compareWith, l, verticalCompact); - - compareWith.push(l); - } - - out[layout.indexOf(l)] = l; - - l.moved = false; - } - - return out; - function getStatics(layout) { - return BI.filter(layout, function (i, l) { - return l._static; - }); - } - }, - - ////公有方法//// - getRegionByName: function (name) { - var obj = {}; - obj[name] = this.regions[name]; - return this._cloneRegion(obj)[name]; - }, - - getAllRegions: function () { - return BI.toArray(this._cloneRegion()); - }, - - getHelper: function () { - var helper = BI.createWidget({ - type: "bi.layout", - width: 18, - height: 18, - cls: "arrangement-helper bi-border" - }); - BI.createWidget({ - type: "bi.absolute", - element: this, - items: [helper] - }); - return helper; - }, - - _start: function () { - this.arrangement.setVisible(true); - if (this.options.layoutType === BI.Arrangement.LAYOUT_TYPE.GRID) { - this.block.setVisible(true); - } - }, - - _stop: function () { - this.arrangement.setVisible(false); - this.block.setVisible(false); - }, - - ////公有操作//// - setLayoutType: function (type) { - var self = this, o = this.options; - if (type !== o.layoutType) { - o.layoutType = type; - switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - this.relayout(); - break; - } - } - }, - - getLayoutType: function () { - return this.options.layoutType; - }, - - getLayoutRatio: function () { - var occupied = this._getRegionOccupied(); - var width = this.getClientWidth(), height = this.getClientHeight(); - return { - x: BI.parseFloat(BI.contentFormat((occupied.left + occupied.width) / width, "#.##;-#.##")), - y: BI.parseFloat(BI.contentFormat((occupied.top + occupied.height) / height, "#.##;-#.##")) - } - }, - - addRegion: function (region, position) { - if (position) { - this.setPosition(position, region); - } - var self = this, o = this.options; - if (!this.position) { - return false; - } - var test = this._cloneRegion(); - BI.each(this.position.regions, function (i, region) { - test[region.id].left = region.left; - test[region.id].top = region.top; - test[region.id].width = region.width; - test[region.id].height = region.height; - - }); - var item = BI.extend({}, region, { - left: this.position.insert.left, - top: this.position.insert.top, - width: this.position.insert.width, - height: this.position.insert.height - }); - var added = this._createOneRegion(item); - test[added.id] = added; - if (this._test(test)) { - delete test[added.id]; - this._modifyRegion(test); - this._addRegion(item); - this._populate(this.getAllRegions()); - return true; - } - return false; - }, - - deleteRegion: function (name) { - if (!this.regions[name]) { - return false; - } - var self = this, o = this.options; - switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.FREE: - this._deleteRegionByName(name); - this._populate(this.getAllRegions()); - return true; - case BI.Arrangement.LAYOUT_TYPE.GRID: - this._deleteRegionByName(name); - this._populate(this.getAllRegions()); - this.resize(); - return true; - } - return false; - }, - - setRegionSize: function (name, size) { - var self = this, o = this.options; - var flag = false; - switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.FREE: - var clone = this._cloneRegion(); - BI.extend(clone[name], { - width: size.width, - height: size.height - }); - if (this._test(clone)) { - this._modifyRegion(clone); - flag = true; - } - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - var clone = this._cloneRegion(); - BI.extend(clone[name], { - width: size.width, - height: size.height - }); - if (this._test(clone)) { - var layout = this._getLayoutsByRegions(clone); - layout = this.compact(layout, true); - var regions = this._getRegionsByLayout(layout); - this._modifyRegion(regions); - flag = true; - } - break; - } - this._applyRegion(); - return flag; - }, - - setPosition: function (position, size) { - var self = this, o = this.options; - var insert, regions = [], cur; - if (position.left < 0 || position.top < 0) { - switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - this.resize(); - break; - } - this._stop(); - this.position = null; - return null; - } - var offset = this._getScrollOffset(); - position = { - left: position.left + offset.left, - top: position.top + offset.top - }; - switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.FREE: - var insert = { - top: position.top < 0 ? 0 : position.top, - left: position.left < 0 ? 0 : position.left, - width: size.width, - height: size.height - }; - this.position = { - insert: insert - }; - this._setArrangeSize(insert); - this._start(); - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - var p = { - top: position.top < 0 ? 0 : position.top, - left: position.left < 0 ? 0 : position.left, - width: size.width, - height: size.height - }; - this._setArrangeSize(p); - var cur = this._getGridPositionAndSize(p); - var layout = [{ - x: 0, y: BI.MAX, w: cur.w, h: cur.h, i: cur.i - }].concat(this._getLayoutsByRegions()); - layout = this._moveElement(layout, layout[0], cur.x, cur.y, true); - layout = this.compact(layout, true); - var regions = this._setRegionsByLayout(this._cloneRegion(), layout); - var insert = this._getBlockPositionAndSize(layout[0]); - this.position = { - insert: insert, - regions: regions - }; - this._applyRegion(regions); - this._setBlockPositionAndSize(insert); - this._start(); - break; - } - return this.position; - }, - - setRegionPosition: function (name, position) { - var self = this, o = this.options; - var offset = this._getScrollOffset(); - position = BI.extend(position, { - left: position.left + offset.left, - top: position.top + offset.top - }); - switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.FREE: - BI.extend(this.regions[name], { - left: position.left < 0 ? 0 : position.left, - top: position.top < 0 ? 0 : position.top - }); - this._applyRegion(); - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - if (!position.stop) { - BI.extend(this.regions[name], { - left: position.left < 0 ? 0 : position.left, - top: position.top < 0 ? 0 : position.top - }); - var cloned = this._cloneRegion(); - var cur = this._getGridPositionAndSize(BI.extend(cloned[name], { - left: position.left < 0 ? 0 : position.left, - top: position.top < 0 ? 0 : position.top - })); - var x = cur.x, y = cur.y; - cur = BI.extend(cur, { - x: 0, y: BI.MAX, i: -1 - }); - delete cloned[name]; - var layout = this._getLayoutsByRegions(cloned); - layout = this._moveElement([cur].concat(layout), cur, x, y, true); - layout = this.compact(layout, true); - var regions = this._getRegionsByLayout(layout); - this._modifyRegion(regions); - this._applyRegion(); - - this._setBlockPositionAndSize(this._getBlockPositionAndSize(cur)); - this.block.setVisible(true); - } else { - BI.extend(this.regions[name], { - left: position.left < 0 ? 0 : position.left, - top: position.top < 0 ? 0 : position.top - }); - var cloned = this._cloneRegion(); - var layout = this._getLayoutsByRegions(cloned); - layout = this.compact(layout, true); - var regions = this._getRegionsByLayout(layout); - this._modifyRegion(regions); - this._applyRegion(); - this.block.setVisible(false); - } - break; - } - }, - - setDropPosition: function (position, size) { - var self = this; - this.arrangement.setVisible(true); - var offset = this._getScrollOffset(); - this._setArrangeSize(BI.extend({}, size, { - left: position.left + offset.left, - top: position.top + offset.top - })); - return function () { - self.arrangement.setVisible(false); - } - }, - - scrollTo: function (scroll) { - this.scrollContainer.element.scrollTop(scroll.top); - this.scrollContainer.element.scrollLeft(scroll.left); - }, - - zoom: function (ratio) { - var self = this, o = this.options; - if (!ratio) { - return; - } - var occupied = this._applyContainer(); - switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.FREE: - if (this._isArrangeFine()) { - var width = this.getClientWidth(); - var xRatio = (ratio.x || 1) * width / (occupied.left + occupied.width); - //var yRatio = ratio.y * height / (occupied.top + occupied.height); - var regions = this._cloneRegion(); - BI.each(regions, function (i, region) { - region.left = region.left * xRatio; - //region.top = region.top * yRatio; - region.width = region.width * xRatio; - //region.height = region.height * yRatio; - }); - if (this._test(regions)) { - this._modifyRegion(regions); - this._applyRegion(); - } - this.resize(); - // } else { - this.relayout(); - } - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - if (this._isArrangeFine()) { - var width = this.getClientWidth(), height = this.getClientHeight(); - var xRatio = (ratio.x || 1) * width / (occupied.left + occupied.width); - var yRatio = (ratio.y || 1) * height / (occupied.top + occupied.height); - var regions = this._cloneRegion(); - BI.each(regions, function (i, region) { - region.left = region.left * xRatio; - region.width = region.width * xRatio; - region.top = region.top * yRatio; - region.height = region.height * yRatio; - }); - if (this._test(regions)) { - var layout = this._getLayoutsByRegions(regions); - layout = this.compact(layout, true); - regions = this._getRegionsByLayout(layout); - this._modifyRegion(regions); - this._applyRegion(); - } - } else { - this.relayout(); - } - break; - } - }, - - resize: function () { - var self = this, o = this.options; - switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - this.zoom(this.ratio); - var regions = this._cloneRegion(); - var layout = this._getLayoutsByRegions(regions); - layout = this.compact(layout, true); - regions = this._getRegionsByLayout(layout); - this._modifyRegion(regions); - this._applyRegion(); - break; - } - }, - - relayout: function () { - var self = this, o = this.options; - switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - if (!this._isArrangeFine()) { - var perHeight = this._getOneHeightPortion(); - var width = this.getClientWidth(), height = this.getClientHeight(); - var regions = this._cloneRegion(); - var clone = BI.toArray(regions); - clone.sort(function (r1, r2) { - if (self._isEqual(r1.top, r2.top)) { - return r1.left - r2.left; - } - return r1.top - r2.top; - }); - var count = clone.length; - var cols = 4, rows = Math.floor((count - 1) / 4 + 1); - var w = width / cols, h = height / rows; - var store = {}; - BI.each(clone, function (i, region) { - var row = Math.floor(i / 4), col = i % 4; - BI.extend(region, { - top: row * perHeight * 6, - left: col * w, - width: w, - height: perHeight * 6 - }); - if (!store[row]) { - store[row] = {}; - } - store[row][col] = region; - }); - //非4的倍数 - // if (count % 4 !== 0) { - // var lasts = store[rows - 1]; - // var perWidth = width / (count % 4); - // BI.each(lasts, function (i, region) { - // BI.extend(region, { - // left: BI.parseInt(i) * perWidth, - // width: perWidth - // }); - // }); - // } - if (this._test(clone)) { - var layout = this._getLayoutsByRegions(regions); - layout = this.compact(layout, true); - regions = this._getRegionsByLayout(layout); - this._modifyRegion(regions); - this._populate(clone); - } - } else { - this.resize(); - } - break; - } - }, - - _populate: function (items) { - this._stop(); - this._calculateRegions(items); - this._applyRegion(); - }, - - populate: function (items) { - var self = this; - BI.each(this.regions, function (name, region) { - self.regions[name].el.setVisible(false); - delete self.regions[name]; - }); - this._populate(items); - this._renderRegion(); - } -}); -BI.Arrangement.EVENT_SCROLL = "EVENT_SCROLL"; -BI.extend(BI.Arrangement, { - PORTION: 36, - H_PORTION: 18, - LAYOUT_TYPE: { - GRID: 0, - FREE: 1 - } -}); +BI.shortcut('bi.arrangement_droppable', BI.ArrangementDroppable);/** + * 布局 + * + * Created by GUY on 2016/2/23. + * @class BI.Arrangement + * @extends BI.Widget + */ +BI.Arrangement = BI.inherit(BI.Widget, { + + _defaultConfig: function () { + return BI.extend(BI.Arrangement.superclass._defaultConfig.apply(this, arguments), { + baseCls: "bi-arrangement", + layoutType: BI.Arrangement.LAYOUT_TYPE.GRID, + items: [] + }); + }, + + _init: function () { + BI.Arrangement.superclass._init.apply(this, arguments); + var self = this, o = this.options; + this.arrangement = BI.createWidget({ + type: "bi.arrangement_droppable", + cls: "arrangement-block", + invisible: true + }); + this.block = BI.createWidget({ + type: "bi.arrangement_block", + invisible: true + }); + this.container = BI.createWidget({ + type: "bi.absolute", + items: o.items.concat([this.block, this.arrangement]) + }); + + this.scrollContainer = BI.createWidget({ + type: "bi.adaptive", + width: "100%", + height: "100%", + scrollable: true, + items: [this.container] + }); + this.scrollContainer.element.scroll(function () { + self.fireEvent(BI.Arrangement.EVENT_SCROLL, { + scrollLeft: self.scrollContainer.element.scrollLeft(), + scrollTop: self.scrollContainer.element.scrollTop(), + clientWidth: self.scrollContainer.element[0].clientWidth, + clientHeight: self.scrollContainer.element[0].clientHeight + }); + }); + + BI.createWidget({ + type: "bi.adaptive", + element: this, + items: [this.scrollContainer] + }); + this.regions = {}; + if (o.items.length > 0) { + BI.nextTick(function () { + self.populate(o.items); + }); + } + }, + + ////初始化操作//// + _calculateRegions: function (items) { + var self = this, o = this.options; + this.regions = {}; + BI.each(items, function (i, item) { + var region = self._createOneRegion(item); + self.regions[region.id] = region; + }); + }, + + _isEqual: function (num1, num2) { + return Math.abs(num1 - num2) < 2; + }, + + _isLessThan: function (num1, num2) { + return num1 < num2 && !this._isEqual(num1, num2); + }, + + _isMoreThan: function (num1, num2) { + return num1 > num2 && !this._isEqual(num1, num2); + }, + + _isLessThanEqual: function (num1, num2) { + return num1 <= num2 || this._isEqual(num1, num2); + }, + + _isMoreThanEqual: function (num1, num2) { + return num1 >= num2 || this._isEqual(num1, num2); + }, + + //获取占有的最大Region + _getRegionOccupied: function (regions) { + var self = this, o = this.options; + if (BI.size(regions || this.regions) <= 0) { + return { + left: 0, + top: 0, + width: 0, + height: 0 + } + } + var minLeft = BI.MAX, maxLeft = BI.MIN, minTop = BI.MAX, maxTop = BI.MIN; + BI.each(regions || this.regions, function (id, region) { + minLeft = Math.min(minLeft, region.left); + maxLeft = Math.max(maxLeft, region.left + region.width); + minTop = Math.min(minTop, region.top); + maxTop = Math.max(maxTop, region.top + region.height); + }); + return { + left: minLeft, + top: minTop, + width: maxLeft - minLeft, + height: maxTop - minTop + } + }, + + //两个区域的交叉面积 + _getCrossArea: function (region1, region2) { + if (region1.left <= region2.left) { + if (region1.top <= region2.top) { + if (region1.top + region1.height > region2.top && region1.left + region1.width > region2.left) { + if (this._isEqual(region1.top + region1.height, region2.top) || this._isEqual(region1.left + region1.width, region2.left)) { + return 0; + } + return (region1.top + region1.height - region2.top) * (region1.left + region1.width - region2.left); + } + } else { + if (region2.top + region2.height > region1.top && region1.left + region1.width > region2.left) { + if (this._isEqual(region2.top + region2.height, region1.top) || this._isEqual(region1.left + region1.width, region2.left)) { + return 0; + } + return (region2.top + region2.height - region1.top) * (region1.left + region1.width - region2.left); + } + } + } else { + if (region1.top <= region2.top) { + if (region1.top + region1.height > region2.top && region2.left + region2.width > region1.left) { + if (this._isEqual(region1.top + region1.height, region2.top) || this._isEqual(region2.left + region2.width, region1.left)) { + return 0; + } + return (region1.top + region1.height - region2.top) * (region2.left + region2.width - region1.left); + } + } else { + if (region2.top + region2.height > region1.top && region2.left + region2.width > region1.left) { + if (this._isEqual(region2.top + region2.height, region1.top) || this._isEqual(region2.left + region2.width, region1.left)) { + return 0; + } + return (region2.top + region2.height - region1.top) * (region2.left + region2.width - region1.left); + } + } + } + return 0; + }, + + //是否有覆盖的组件 + _isRegionOverlay: function (regions) { + var reg = []; + BI.each(regions || this.regions, function (id, region) { + reg.push(new BI.Region(region.left, region.top, region.width, region.height)); + }); + for (var i = 0, len = reg.length; i < len; i++) { + for (var j = i + 1; j < len; j++) { + var area1 = { + left: reg[i].x, + top: reg[i].y, + width: reg[i].w, + height: reg[i].h + }; + var area2 = { + left: reg[j].x, + top: reg[j].y, + width: reg[j].w, + height: reg[j].h + }; + if (reg[i].isIntersects(reg[j]) && this._getCrossArea(area1, area2) > 1) { + return true; + } + } + } + return false; + }, + + //布局是否是优良的 + _isArrangeFine: function (regions) { + switch (this.options.layoutType) { + case BI.Arrangement.LAYOUT_TYPE.FREE: + return true; + case BI.Arrangement.LAYOUT_TYPE.GRID: + if (this._isRegionOverlay()) { + return false; + } + } + return true; + }, + + _getRegionNames: function (regions) { + var names = []; + BI.each(regions || this.regions, function (i, region) { + names.push(region.id || region.attr("id")); + }); + return names; + }, + + _getRegionsByNames: function (names, regions) { + names = BI.isArray(names) ? names : [names]; + regions = regions || this.regions; + if (BI.isArray(regions)) { + var result = []; + BI.each(regions, function (i, region) { + if (names.contains(region.id || region.attr("id"))) { + result.push(region); + } + }); + } else { + var result = {}; + BI.each(names, function (i, name) { + result[name] = regions[name]; + }); + } + return result; + }, + + _cloneRegion: function (regions) { + var clone = {}; + BI.each(regions || this.regions, function (id, region) { + clone[id] = {}; + clone[id].el = region.el; + clone[id].id = region.id; + clone[id].left = region.left; + clone[id].top = region.top; + clone[id].width = region.width; + clone[id].height = region.height; + }); + return clone; + }, + + //测试合法性 + _test: function (regions) { + var self = this; + return !BI.any(regions || this.regions, function (i, region) { + if (BI.isNaN(region.width) || BI.isNaN(region.height) || region.width <= 21 || region.height <= 21) { + return true; + } + }) + }, + + _getScrollOffset: function () { + return { + left: this.scrollContainer.element[0].scrollLeft, + top: this.scrollContainer.element[0].scrollTop + } + }, + + ////操作//// + _createOneRegion: function (item) { + var el = BI.createWidget(item.el); + el.setVisible(true); + return { + id: el.attr("id"), + left: item.left, + top: item.top, + width: item.width, + height: item.height, + el: el + } + }, + + _applyRegion: function (regions) { + var self = this, o = this.options; + BI.each(regions || this.regions, function (i, region) { + region.el.element.css({ + left: region.left, + top: region.top, + width: region.width, + height: region.height + }); + }); + this._applyContainer(); + this.ratio = this.getLayoutRatio(); + }, + + _renderRegion: function () { + var self = this; + BI.createWidget({ + type: "bi.absolute", + element: this.container, + items: BI.toArray(this.regions) + }); + }, + + getClientWidth: function () { + return this.scrollContainer.element[0].clientWidth; + }, + + getClientHeight: function () { + return this.scrollContainer.element[0].clientHeight; + }, + + getContainerSize: function () { + return this.container.element.bounds(); + }, + + setContainerSize: function (bounds) { + return this.container.element.bounds(bounds); + }, + + _applyContainer: function () { + //先掩藏后显示能够明确滚动条是否出现 + this.scrollContainer.element.css("overflow", "hidden"); + var occupied = this._getRegionOccupied(); + this.container.element.width(occupied.left + occupied.width).height(occupied.top + occupied.height); + this.scrollContainer.element.css("overflow", "auto"); + return occupied; + }, + + _modifyRegion: function (regions) { + BI.each(this.regions, function (id, region) { + if (regions[id]) { + region.left = regions[id].left; + region.top = regions[id].top; + region.width = regions[id].width; + region.height = regions[id].height; + } + }); + }, + + _addRegion: function (item) { + var region = this._createOneRegion(item); + this.regions[region.id] = region; + BI.createWidget({ + type: "bi.absolute", + element: this.container, + items: [region] + }); + }, + + _deleteRegionByName: function (name) { + this.regions[name].el.setVisible(false); + delete this.regions[name]; + }, + + _setArrangeSize: function (size) { + this.arrangement.element.css({ + left: size.left, + top: size.top, + width: size.width, + height: size.height + }) + }, + + //Grid + _getOneWidthPortion: function () { + return this.getClientWidth() / BI.Arrangement.PORTION; + }, + _getOneHeightPortion: function () { + return this.getClientHeight() / BI.Arrangement.H_PORTION; + }, + + _getGridPositionAndSize: function (position) { + var perWidth = this._getOneWidthPortion(); + var perHeight = this._getOneHeightPortion(); + var widthPortion = Math.round(position.width / perWidth); + var leftPortion = Math.round(position.left / perWidth); + var topPortion = Math.round(position.top / perHeight); + var heightPortion = Math.round(position.height / perHeight); + // if (leftPortion > BI.Arrangement.PORTION) { + // leftPortion = BI.Arrangement.PORTION; + // } + // if (widthPortion > BI.Arrangement.PORTION) { + // widthPortion = BI.Arrangement.PORTION; + // } + // if (leftPortion + widthPortion > BI.Arrangement.PORTION) { + // leftPortion = BI.Arrangement.PORTION - widthPortion; + // } + if (widthPortion === 0) { + widthPortion = 1; + } + if (heightPortion === 0) { + heightPortion = 1; + } + return { + x: leftPortion, + y: topPortion, + w: widthPortion, + h: heightPortion + } + }, + + _getBlockPositionAndSize: function (position) { + var perWidth = this._getOneWidthPortion(); + var perHeight = this._getOneHeightPortion(); + return { + left: position.x * perWidth, + top: position.y * perHeight, + width: position.w * perWidth, + height: position.h * perHeight + }; + }, + + _getLayoutsByRegions: function (regions) { + var self = this; + var result = []; + BI.each(regions || this.regions, function (id, region) { + result.push(BI.extend(self._getGridPositionAndSize(region), { + i: region.id + })) + }); + return result; + }, + + _getLayoutIndexByName: function (layout, name) { + return BI.findIndex(layout, function (i, l) { + return l.i === name; + }); + }, + + _setBlockPositionAndSize: function (size) { + this.block.element.css({ + left: size.left, + top: size.top, + width: size.width, + height: size.height + }); + }, + + _getRegionsByLayout: function (layout) { + var self = this; + var regions = {}; + BI.each(layout, function (i, ly) { + regions[ly.i] = BI.extend(self._getBlockPositionAndSize(ly), { + id: ly.i + }); + }); + return regions; + }, + + _setRegionsByLayout: function (regions, layout) { + var self = this; + regions || (regions = this.regions); + BI.each(layout, function (i, ly) { + if (regions[ly.i]) { + BI.extend(regions[ly.i], self._getBlockPositionAndSize(ly)); + } + }); + return regions; + }, + + _moveElement: function (layout, l, x, y, isUserAction) { + var self = this; + if (l._static) { + return layout; + } + + if (l.y === y && l.x === x) { + return layout; + } + + var movingUp = y && l.y > y; + if (typeof x === 'number') { + l.x = x; + } + if (typeof y === 'number') { + l.y = y; + } + l.moved = true; + + var sorted = this._sortLayoutItemsByRowCol(layout); + if (movingUp) { + sorted = sorted.reverse(); + } + var collisions = getAllCollisions(sorted, l); + + for (var i = 0, len = collisions.length; i < len; i++) { + var collision = collisions[i]; + if (collision.moved) { + continue; + } + + if (l.y > collision.y && l.y - collision.y > collision.h / 4) { + continue; + } + + if (collision._static) { + layout = this._moveElementAwayFromCollision(layout, collision, l, isUserAction); + } else { + layout = this._moveElementAwayFromCollision(layout, l, collision, isUserAction); + } + } + + return layout; + + function getAllCollisions(layout, layoutItem) { + return BI.filter(layout, function (i, l) { + return self._collides(l, layoutItem); + }); + } + }, + + _sortLayoutItemsByRowCol: function (layout) { + return [].concat(layout).sort(function (a, b) { + if (a.y > b.y || (a.y === b.y && a.x > b.x)) { + return 1; + } + return -1; + }); + }, + + _collides: function (l1, l2) { + if (l1 === l2) { + return false; + } // same element + if (l1.x + l1.w <= l2.x) { + return false; + } // l1 is left of l2 + if (l1.x >= l2.x + l2.w) { + return false; + } // l1 is right of l2 + if (l1.y + l1.h <= l2.y) { + return false; + } // l1 is above l2 + if (l1.y >= l2.y + l2.h) { + return false; + } // l1 is below l2 + return true; // boxes overlap + }, + + _getFirstCollision: function (layout, layoutItem) { + for (var i = 0, len = layout.length; i < len; i++) { + if (this._collides(layout[i], layoutItem)) { + return layout[i]; + } + } + }, + + _moveElementAwayFromCollision: function (layout, collidesWith, + itemToMove, isUserAction) { + if (isUserAction) { + var fakeItem = { + x: itemToMove.x, + y: itemToMove.y, + w: itemToMove.w, + h: itemToMove.h, + i: '-1' + }; + fakeItem.y = Math.max(collidesWith.y - itemToMove.h, 0); + if (!this._getFirstCollision(layout, fakeItem)) { + return this._moveElement(layout, itemToMove, undefined, fakeItem.y); + } + } + + return this._moveElement(layout, itemToMove, undefined, itemToMove.y + 1); + }, + + _compactItem: function (compareWith, l, verticalCompact) { + if (verticalCompact) { + while (l.y > 0 && !this._getFirstCollision(compareWith, l)) { + l.y--; + } + } + + var collides; + while ((collides = this._getFirstCollision(compareWith, l))) { + l.y = collides.y + collides.h; + } + return l; + }, + + compact: function (layout, verticalCompact) { + var compareWith = getStatics(layout); + var sorted = this._sortLayoutItemsByRowCol(layout); + var out = []; + + for (var i = 0, len = sorted.length; i < len; i++) { + var l = sorted[i]; + + if (!l._static) { + l = this._compactItem(compareWith, l, verticalCompact); + + compareWith.push(l); + } + + out[layout.indexOf(l)] = l; + + l.moved = false; + } + + return out; + function getStatics(layout) { + return BI.filter(layout, function (i, l) { + return l._static; + }); + } + }, + + ////公有方法//// + getRegionByName: function (name) { + var obj = {}; + obj[name] = this.regions[name]; + return this._cloneRegion(obj)[name]; + }, + + getAllRegions: function () { + return BI.toArray(this._cloneRegion()); + }, + + getHelper: function () { + var helper = BI.createWidget({ + type: "bi.layout", + width: 18, + height: 18, + cls: "arrangement-helper bi-border" + }); + BI.createWidget({ + type: "bi.absolute", + element: this, + items: [helper] + }); + return helper; + }, + + _start: function () { + this.arrangement.setVisible(true); + if (this.options.layoutType === BI.Arrangement.LAYOUT_TYPE.GRID) { + this.block.setVisible(true); + } + }, + + _stop: function () { + this.arrangement.setVisible(false); + this.block.setVisible(false); + }, + + ////公有操作//// + setLayoutType: function (type) { + var self = this, o = this.options; + if (type !== o.layoutType) { + o.layoutType = type; + switch (o.layoutType) { + case BI.Arrangement.LAYOUT_TYPE.FREE: + break; + case BI.Arrangement.LAYOUT_TYPE.GRID: + this.relayout(); + break; + } + } + }, + + getLayoutType: function () { + return this.options.layoutType; + }, + + getLayoutRatio: function () { + var occupied = this._getRegionOccupied(); + var width = this.getClientWidth(), height = this.getClientHeight(); + return { + x: BI.parseFloat(BI.contentFormat((occupied.left + occupied.width) / width, "#.##;-#.##")), + y: BI.parseFloat(BI.contentFormat((occupied.top + occupied.height) / height, "#.##;-#.##")) + } + }, + + addRegion: function (region, position) { + if (position) { + this.setPosition(position, region); + } + var self = this, o = this.options; + if (!this.position) { + return false; + } + var test = this._cloneRegion(); + BI.each(this.position.regions, function (i, region) { + test[region.id].left = region.left; + test[region.id].top = region.top; + test[region.id].width = region.width; + test[region.id].height = region.height; + + }); + var item = BI.extend({}, region, { + left: this.position.insert.left, + top: this.position.insert.top, + width: this.position.insert.width, + height: this.position.insert.height + }); + var added = this._createOneRegion(item); + test[added.id] = added; + if (this._test(test)) { + delete test[added.id]; + this._modifyRegion(test); + this._addRegion(item); + this._populate(this.getAllRegions()); + return true; + } + return false; + }, + + deleteRegion: function (name) { + if (!this.regions[name]) { + return false; + } + var self = this, o = this.options; + switch (o.layoutType) { + case BI.Arrangement.LAYOUT_TYPE.FREE: + this._deleteRegionByName(name); + this._populate(this.getAllRegions()); + return true; + case BI.Arrangement.LAYOUT_TYPE.GRID: + this._deleteRegionByName(name); + this._populate(this.getAllRegions()); + this.resize(); + return true; + } + return false; + }, + + setRegionSize: function (name, size) { + var self = this, o = this.options; + var flag = false; + switch (o.layoutType) { + case BI.Arrangement.LAYOUT_TYPE.FREE: + var clone = this._cloneRegion(); + BI.extend(clone[name], { + width: size.width, + height: size.height + }); + if (this._test(clone)) { + this._modifyRegion(clone); + flag = true; + } + break; + case BI.Arrangement.LAYOUT_TYPE.GRID: + var clone = this._cloneRegion(); + BI.extend(clone[name], { + width: size.width, + height: size.height + }); + if (this._test(clone)) { + var layout = this._getLayoutsByRegions(clone); + layout = this.compact(layout, true); + var regions = this._getRegionsByLayout(layout); + this._modifyRegion(regions); + flag = true; + } + break; + } + this._applyRegion(); + return flag; + }, + + setPosition: function (position, size) { + var self = this, o = this.options; + var insert, regions = [], cur; + if (position.left < 0 || position.top < 0) { + switch (o.layoutType) { + case BI.Arrangement.LAYOUT_TYPE.FREE: + break; + case BI.Arrangement.LAYOUT_TYPE.GRID: + this.resize(); + break; + } + this._stop(); + this.position = null; + return null; + } + var offset = this._getScrollOffset(); + position = { + left: position.left + offset.left, + top: position.top + offset.top + }; + switch (o.layoutType) { + case BI.Arrangement.LAYOUT_TYPE.FREE: + var insert = { + top: position.top < 0 ? 0 : position.top, + left: position.left < 0 ? 0 : position.left, + width: size.width, + height: size.height + }; + this.position = { + insert: insert + }; + this._setArrangeSize(insert); + this._start(); + break; + case BI.Arrangement.LAYOUT_TYPE.GRID: + var p = { + top: position.top < 0 ? 0 : position.top, + left: position.left < 0 ? 0 : position.left, + width: size.width, + height: size.height + }; + this._setArrangeSize(p); + var cur = this._getGridPositionAndSize(p); + var layout = [{ + x: 0, y: BI.MAX, w: cur.w, h: cur.h, i: cur.i + }].concat(this._getLayoutsByRegions()); + layout = this._moveElement(layout, layout[0], cur.x, cur.y, true); + layout = this.compact(layout, true); + var regions = this._setRegionsByLayout(this._cloneRegion(), layout); + var insert = this._getBlockPositionAndSize(layout[0]); + this.position = { + insert: insert, + regions: regions + }; + this._applyRegion(regions); + this._setBlockPositionAndSize(insert); + this._start(); + break; + } + return this.position; + }, + + setRegionPosition: function (name, position) { + var self = this, o = this.options; + var offset = this._getScrollOffset(); + position = BI.extend(position, { + left: position.left + offset.left, + top: position.top + offset.top + }); + switch (o.layoutType) { + case BI.Arrangement.LAYOUT_TYPE.FREE: + BI.extend(this.regions[name], { + left: position.left < 0 ? 0 : position.left, + top: position.top < 0 ? 0 : position.top + }); + this._applyRegion(); + break; + case BI.Arrangement.LAYOUT_TYPE.GRID: + if (!position.stop) { + BI.extend(this.regions[name], { + left: position.left < 0 ? 0 : position.left, + top: position.top < 0 ? 0 : position.top + }); + var cloned = this._cloneRegion(); + var cur = this._getGridPositionAndSize(BI.extend(cloned[name], { + left: position.left < 0 ? 0 : position.left, + top: position.top < 0 ? 0 : position.top + })); + var x = cur.x, y = cur.y; + cur = BI.extend(cur, { + x: 0, y: BI.MAX, i: -1 + }); + delete cloned[name]; + var layout = this._getLayoutsByRegions(cloned); + layout = this._moveElement([cur].concat(layout), cur, x, y, true); + layout = this.compact(layout, true); + var regions = this._getRegionsByLayout(layout); + this._modifyRegion(regions); + this._applyRegion(); + + this._setBlockPositionAndSize(this._getBlockPositionAndSize(cur)); + this.block.setVisible(true); + } else { + BI.extend(this.regions[name], { + left: position.left < 0 ? 0 : position.left, + top: position.top < 0 ? 0 : position.top + }); + var cloned = this._cloneRegion(); + var layout = this._getLayoutsByRegions(cloned); + layout = this.compact(layout, true); + var regions = this._getRegionsByLayout(layout); + this._modifyRegion(regions); + this._applyRegion(); + this.block.setVisible(false); + } + break; + } + }, + + setDropPosition: function (position, size) { + var self = this; + this.arrangement.setVisible(true); + var offset = this._getScrollOffset(); + this._setArrangeSize(BI.extend({}, size, { + left: position.left + offset.left, + top: position.top + offset.top + })); + return function () { + self.arrangement.setVisible(false); + } + }, + + scrollTo: function (scroll) { + this.scrollContainer.element.scrollTop(scroll.top); + this.scrollContainer.element.scrollLeft(scroll.left); + }, + + zoom: function (ratio) { + var self = this, o = this.options; + if (!ratio) { + return; + } + var occupied = this._applyContainer(); + switch (this.getLayoutType()) { + case BI.Arrangement.LAYOUT_TYPE.FREE: + if (this._isArrangeFine()) { + var width = this.getClientWidth(); + var xRatio = (ratio.x || 1) * width / (occupied.left + occupied.width); + //var yRatio = ratio.y * height / (occupied.top + occupied.height); + var regions = this._cloneRegion(); + BI.each(regions, function (i, region) { + region.left = region.left * xRatio; + //region.top = region.top * yRatio; + region.width = region.width * xRatio; + //region.height = region.height * yRatio; + }); + if (this._test(regions)) { + this._modifyRegion(regions); + this._applyRegion(); + } + this.resize(); + // } else { + this.relayout(); + } + break; + case BI.Arrangement.LAYOUT_TYPE.GRID: + if (this._isArrangeFine()) { + var width = this.getClientWidth(), height = this.getClientHeight(); + var xRatio = (ratio.x || 1) * width / (occupied.left + occupied.width); + var yRatio = (ratio.y || 1) * height / (occupied.top + occupied.height); + var regions = this._cloneRegion(); + BI.each(regions, function (i, region) { + region.left = region.left * xRatio; + region.width = region.width * xRatio; + region.top = region.top * yRatio; + region.height = region.height * yRatio; + }); + if (this._test(regions)) { + var layout = this._getLayoutsByRegions(regions); + layout = this.compact(layout, true); + regions = this._getRegionsByLayout(layout); + this._modifyRegion(regions); + this._applyRegion(); + } + } else { + this.relayout(); + } + break; + } + }, + + resize: function () { + var self = this, o = this.options; + switch (o.layoutType) { + case BI.Arrangement.LAYOUT_TYPE.FREE: + break; + case BI.Arrangement.LAYOUT_TYPE.GRID: + this.zoom(this.ratio); + var regions = this._cloneRegion(); + var layout = this._getLayoutsByRegions(regions); + layout = this.compact(layout, true); + regions = this._getRegionsByLayout(layout); + this._modifyRegion(regions); + this._applyRegion(); + break; + } + }, + + relayout: function () { + var self = this, o = this.options; + switch (o.layoutType) { + case BI.Arrangement.LAYOUT_TYPE.FREE: + break; + case BI.Arrangement.LAYOUT_TYPE.GRID: + if (!this._isArrangeFine()) { + var perHeight = this._getOneHeightPortion(); + var width = this.getClientWidth(), height = this.getClientHeight(); + var regions = this._cloneRegion(); + var clone = BI.toArray(regions); + clone.sort(function (r1, r2) { + if (self._isEqual(r1.top, r2.top)) { + return r1.left - r2.left; + } + return r1.top - r2.top; + }); + var count = clone.length; + var cols = 4, rows = Math.floor((count - 1) / 4 + 1); + var w = width / cols, h = height / rows; + var store = {}; + BI.each(clone, function (i, region) { + var row = Math.floor(i / 4), col = i % 4; + BI.extend(region, { + top: row * perHeight * 6, + left: col * w, + width: w, + height: perHeight * 6 + }); + if (!store[row]) { + store[row] = {}; + } + store[row][col] = region; + }); + //非4的倍数 + // if (count % 4 !== 0) { + // var lasts = store[rows - 1]; + // var perWidth = width / (count % 4); + // BI.each(lasts, function (i, region) { + // BI.extend(region, { + // left: BI.parseInt(i) * perWidth, + // width: perWidth + // }); + // }); + // } + if (this._test(clone)) { + var layout = this._getLayoutsByRegions(regions); + layout = this.compact(layout, true); + regions = this._getRegionsByLayout(layout); + this._modifyRegion(regions); + this._populate(clone); + } + } else { + this.resize(); + } + break; + } + }, + + _populate: function (items) { + this._stop(); + this._calculateRegions(items); + this._applyRegion(); + }, + + populate: function (items) { + var self = this; + BI.each(this.regions, function (name, region) { + self.regions[name].el.setVisible(false); + delete self.regions[name]; + }); + this._populate(items); + this._renderRegion(); + } +}); +BI.Arrangement.EVENT_SCROLL = "EVENT_SCROLL"; +BI.extend(BI.Arrangement, { + PORTION: 36, + H_PORTION: 18, + LAYOUT_TYPE: { + GRID: 0, + FREE: 1 + } +}); BI.shortcut('bi.arrangement', BI.Arrangement);/** * 表关联树 * diff --git a/src/base/combination/tab.js b/src/base/combination/tab.js index f3c1ea2035..f52576a538 100644 --- a/src/base/combination/tab.js +++ b/src/base/combination/tab.js @@ -93,6 +93,17 @@ BI.Tab = BI.inherit(BI.Widget, { } }, + removeTab: function (cardname) { + var self = this, o = this.options; + BI.any(this.cardMap, function (name, card) { + if (BI.isEqual(name, (cardname + ""))) { + self.layout.deleteCardByName(name); + delete self.cardMap[name]; + return true; + } + }); + }, + getSelect: function () { return this.curr; }, diff --git a/src/base/table/table.resizable.cell.js b/src/base/table/table.resizable.cell.js index f0bdaff987..92b4ec6c17 100644 --- a/src/base/table/table.resizable.cell.js +++ b/src/base/table/table.resizable.cell.js @@ -1,115 +1,115 @@ -/** - * - * 表格单元格 - * - * Created by GUY on 2016/1/12. - * @class BI.ResizableTableCell - * @extends BI.Widget - */ -BI.ResizableTableCell = BI.inherit(BI.Widget, { - _defaultConfig: function () { - return BI.extend(BI.ResizableTableCell.superclass._defaultConfig.apply(this, arguments), { - baseCls: "bi-resizable-table-cell", - cell: {}, - minSize: 15, - // suitableSize, - maxSize: Number.MAX_VALUE, - start: BI.emptyFn, - resize: BI.emptyFn, - stop: BI.emptyFn - }) - }, - - _init: function () { - BI.ResizableTableCell.superclass._init.apply(this, arguments); - var self = this, o = this.options; - this.cell = BI.createWidget(BI.extend({type: "bi.label"}, o.cell, {width: o.width, height: o.height})); - - var startDrag = false; - var size = 0, offset = 0, defaultSize = o.width; - - function optimizeSize(s) { - var optSize = BI.clamp(s, o.minSize, o.maxSize || Number.MAX_VALUE); - if (o.suitableSize) { - if (Math.abs(o.suitableSize - optSize) < 5) { - optSize = o.suitableSize; - self.handler.element.addClass("suitable"); - } else { - self.handler.element.removeClass("suitable"); - } - } - return optSize; - } - - var mouseMoveTracker = new BI.MouseMoveTracker(function (deltaX, deltaY) { - if (mouseMoveTracker.isDragging()) { - startDrag = true; - offset += deltaX; - size = optimizeSize(defaultSize + offset); - self.handler.element.addClass("dragging"); - o.resize(size); - } - }, function () { - if (startDrag === true) { - size = optimizeSize(size); - o.stop(size); - size = 0; - offset = 0; - defaultSize = o.width; - startDrag = false; - } - self.handler.element.removeClass("dragging"); - self.handler.element.removeClass("suitable"); - mouseMoveTracker.releaseMouseMoves(); - }, document); - this.handler = BI.createWidget({ - type: "bi.absolute", - cls: "resizable-table-cell-resizer-container", - width: 6, - items: [{ - el: { - type: "bi.layout", - cls: "resizable-table-cell-resizer-knob", - width: 4 - }, - right: 0, - top: 0, - bottom: 0 - }] - }); - this.handler.element.on("mousedown", function (event) { - defaultSize = o.width; - optimizeSize(defaultSize); - mouseMoveTracker.captureMouseMoves(event); - }); - BI.createWidget({ - type: "bi.absolute", - element: this, - items: [{ - el: this.cell, - left: 0, - right: 0, - top: 0, - bottom: 0 - }, { - el: this.handler, - right: 0, - top: 0, - bottom: 0 - }] - }) - }, - - setWidth: function (width) { - BI.ResizableTableCell.superclass.setWidth.apply(this, arguments); - var o = this.options; - this.cell.setWidth(o.width); - }, - - setHeight: function (height) { - BI.ResizableTableCell.superclass.setHeight.apply(this, arguments); - var o = this.options; - this.cell.setHeight(o.height); - } -}); +/** + * + * 表格单元格 + * + * Created by GUY on 2016/1/12. + * @class BI.ResizableTableCell + * @extends BI.Widget + */ +BI.ResizableTableCell = BI.inherit(BI.Widget, { + _defaultConfig: function () { + return BI.extend(BI.ResizableTableCell.superclass._defaultConfig.apply(this, arguments), { + baseCls: "bi-resizable-table-cell", + cell: {}, + minSize: 15, + // suitableSize, + maxSize: Number.MAX_VALUE, + start: BI.emptyFn, + resize: BI.emptyFn, + stop: BI.emptyFn + }) + }, + + _init: function () { + BI.ResizableTableCell.superclass._init.apply(this, arguments); + var self = this, o = this.options; + this.cell = BI.createWidget(BI.extend({type: "bi.label"}, o.cell, {width: o.width, height: o.height})); + + var startDrag = false; + var size = 0, offset = 0, defaultSize = o.width; + + function optimizeSize(s) { + var optSize = BI.clamp(s, o.minSize, o.maxSize || Number.MAX_VALUE); + // if (o.suitableSize) { + // if (Math.abs(o.suitableSize - optSize) < 5) { + // optSize = o.suitableSize; + // self.handler.element.addClass("suitable"); + // } else { + // self.handler.element.removeClass("suitable"); + // } + // } + return optSize; + } + + var mouseMoveTracker = new BI.MouseMoveTracker(function (deltaX, deltaY) { + if (mouseMoveTracker.isDragging()) { + startDrag = true; + offset += deltaX; + size = optimizeSize(defaultSize + offset); + self.handler.element.addClass("dragging"); + o.resize(size); + } + }, function () { + if (startDrag === true) { + size = optimizeSize(size); + o.stop(size); + size = 0; + offset = 0; + defaultSize = o.width; + startDrag = false; + } + self.handler.element.removeClass("dragging"); + self.handler.element.removeClass("suitable"); + mouseMoveTracker.releaseMouseMoves(); + }, document); + this.handler = BI.createWidget({ + type: "bi.absolute", + cls: "resizable-table-cell-resizer-container", + width: 6, + items: [{ + el: { + type: "bi.layout", + cls: "resizable-table-cell-resizer-knob", + width: 4 + }, + right: 0, + top: 0, + bottom: 0 + }] + }); + this.handler.element.on("mousedown", function (event) { + defaultSize = o.width; + optimizeSize(defaultSize); + mouseMoveTracker.captureMouseMoves(event); + }); + BI.createWidget({ + type: "bi.absolute", + element: this, + items: [{ + el: this.cell, + left: 0, + right: 0, + top: 0, + bottom: 0 + }, { + el: this.handler, + right: 0, + top: 0, + bottom: 0 + }] + }) + }, + + setWidth: function (width) { + BI.ResizableTableCell.superclass.setWidth.apply(this, arguments); + var o = this.options; + this.cell.setWidth(o.width); + }, + + setHeight: function (height) { + BI.ResizableTableCell.superclass.setHeight.apply(this, arguments); + var o = this.options; + this.cell.setHeight(o.height); + } +}); BI.shortcut("bi.resizable_table_cell", BI.ResizableTableCell); \ No newline at end of file diff --git a/src/case/combo/bubblecombo/combo.bubble.js b/src/case/combo/bubblecombo/combo.bubble.js index 55fcd60d38..2e73757e80 100644 --- a/src/case/combo/bubblecombo/combo.bubble.js +++ b/src/case/combo/bubblecombo/combo.bubble.js @@ -1,224 +1,222 @@ -/** - * Created by GUY on 2017/2/8. - * - * @class BI.BubbleCombo - * @extends BI.Widget - */ -BI.BubbleCombo = BI.inherit(BI.Widget, { - _const: { - TRIANGLE_LENGTH: 6 - }, - _defaultConfig: function () { - return BI.extend(BI.BubbleCombo.superclass._defaultConfig.apply(this, arguments), { - baseCls: "bi-bubble-combo", - trigger: "click", - toggle: true, - direction: "bottom", //top||bottom||left||right||top,left||top,right||bottom,left||bottom,right - isDefaultInit: false, - destroyWhenHide: false, - isNeedAdjustHeight: true,//是否需要高度调整 - isNeedAdjustWidth: true, - stopPropagation: false, - adjustLength: 0,//调整的距离 - // adjustXOffset: 0, - // adjustYOffset: 10, - hideChecker: BI.emptyFn, - offsetStyle: "left", //left,right,center - el: {}, - popup: {}, - }) - }, - _init: function () { - BI.BubbleCombo.superclass._init.apply(this, arguments); - var self = this, o = this.options; - this.combo = BI.createWidget({ - type: "bi.combo", - element: this, - trigger: o.trigger, - toggle: o.toggle, - direction: o.direction, - isDefaultInit: o.isDefaultInit, - destroyWhenHide: o.destroyWhenHide, - isNeedAdjustHeight: o.isNeedAdjustHeight, - isNeedAdjustWidth: o.isNeedAdjustWidth, - adjustLength: this._getAdjustLength(), - stopPropagation: o.stopPropagation, - adjustXOffset: 0, - adjustYOffset: 0, - hideChecker: o.hideChecker, - offsetStyle: o.offsetStyle, - el: o.el, - popup: BI.extend({ - type: "bi.bubble_popup_view" - }, o.popup), - }); - this.combo.on(BI.Combo.EVENT_TRIGGER_CHANGE, function () { - self.fireEvent(BI.BubbleCombo.EVENT_TRIGGER_CHANGE, arguments); - }); - this.combo.on(BI.Combo.EVENT_CHANGE, function () { - self.fireEvent(BI.BubbleCombo.EVENT_CHANGE, arguments); - }); - this.combo.on(BI.Combo.EVENT_EXPAND, function () { - self.fireEvent(BI.BubbleCombo.EVENT_EXPAND, arguments); - }); - this.combo.on(BI.Combo.EVENT_COLLAPSE, function () { - self.fireEvent(BI.BubbleCombo.EVENT_COLLAPSE, arguments); - }); - this.combo.on(BI.Combo.EVENT_AFTER_INIT, function () { - self.fireEvent(BI.BubbleCombo.EVENT_AFTER_INIT, arguments); - }); - this.combo.on(BI.Combo.EVENT_BEFORE_POPUPVIEW, function () { - self.fireEvent(BI.BubbleCombo.EVENT_BEFORE_POPUPVIEW, arguments); - }); - this.combo.on(BI.Combo.EVENT_AFTER_POPUPVIEW, function () { - self._showTriangle(); - self.fireEvent(BI.BubbleCombo.EVENT_AFTER_POPUPVIEW, arguments); - }); - this.combo.on(BI.Combo.EVENT_BEFORE_HIDEVIEW, function () { - self._hideTriangle(); - self.fireEvent(BI.BubbleCombo.EVENT_BEFORE_HIDEVIEW, arguments); - }); - this.combo.on(BI.Combo.EVENT_AFTER_HIDEVIEW, function () { - self.fireEvent(BI.BubbleCombo.EVENT_AFTER_HIDEVIEW, arguments); - }); - }, - - _getAdjustLength: function () { - return this._const.TRIANGLE_LENGTH + this.options.adjustLength; - }, - - _createTriangle: function (direction) { - var pos = {}, op = {}; - var adjustLength = this.options.adjustLength; - var offset = this.element.offset(); - var left = offset.left, right = offset.left + this.element.outerWidth(); - var top = offset.top, bottom = offset.top + this.element.outerHeight(); - switch (direction) { - case "left": - pos = { - top: top, - height: this.element.outerHeight(), - left: left - adjustLength - this._const.TRIANGLE_LENGTH - }; - op = {width: this._const.TRIANGLE_LENGTH}; - break; - case "right": - pos = { - top: top, - height: this.element.outerHeight(), - left: right + adjustLength - }; - op = {width: this._const.TRIANGLE_LENGTH}; - break; - case "top": - pos = { - left: left, - width: this.element.outerWidth(), - top: top - adjustLength - this._const.TRIANGLE_LENGTH - }; - op = {height: this._const.TRIANGLE_LENGTH}; - break; - case "bottom": - pos = { - left: left, - width: this.element.outerWidth(), - top: bottom + adjustLength - }; - op = {height: this._const.TRIANGLE_LENGTH}; - break; - default: - break; - } - this.triangle = BI.createWidget(op, { - type: "bi.center_adapt", - cls: "button-combo-triangle-wrapper", - items: [{ - type: "bi.layout", - cls: "bubble-combo-triangle-" + direction + " bi-high-light-border" - }] - }); - pos.el = this.triangle; - BI.createWidget({ - type: "bi.absolute", - element: this, - items: [pos] - }) - }, - - _createLeftTriangle: function () { - this._createTriangle("left"); - }, - - _createRightTriangle: function () { - this._createTriangle("right"); - }, - - _createTopTriangle: function () { - this._createTriangle("top"); - }, - - _createBottomTriangle: function () { - this._createTriangle("bottom"); - }, - - _showTriangle: function () { - var pos = this.combo.getPopupPosition(); - switch (pos.dir) { - case "left,top": - case "left,bottom": - this._createLeftTriangle(); - this.combo.getView().showLine("right"); - break; - case "right,top": - case "right,bottom": - this._createRightTriangle(); - this.combo.getView().showLine("left"); - break; - case "top,left": - case "top,right": - this._createTopTriangle(); - this.combo.getView().showLine("bottom"); - break; - case "bottom,left": - case "bottom,right": - this._createBottomTriangle(); - this.combo.getView().showLine("top"); - break; - } - }, - - _hideTriangle: function () { - this.triangle && this.triangle.destroy(); - this.combo.getView() && this.combo.getView().hideLine(); - }, - - hideView: function () { - this._hideTriangle(); - this.combo && this.combo.hideView(); - }, - - showView: function () { - this.combo && this.combo.showView(); - }, - - hasView: function () { - return BI.isNotNull(this.combo.getView()); - }, - - isViewVisible: function () { - return this.combo.isViewVisible(); - } -}); - -BI.BubbleCombo.EVENT_TRIGGER_CHANGE = "EVENT_TRIGGER_CHANGE"; -BI.BubbleCombo.EVENT_CHANGE = "EVENT_CHANGE"; -BI.BubbleCombo.EVENT_EXPAND = "EVENT_EXPAND"; -BI.BubbleCombo.EVENT_COLLAPSE = "EVENT_COLLAPSE"; -BI.BubbleCombo.EVENT_AFTER_INIT = "EVENT_AFTER_INIT"; - - -BI.BubbleCombo.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW"; -BI.BubbleCombo.EVENT_AFTER_POPUPVIEW = "EVENT_AFTER_POPUPVIEW"; -BI.BubbleCombo.EVENT_BEFORE_HIDEVIEW = "EVENT_BEFORE_HIDEVIEW"; -BI.BubbleCombo.EVENT_AFTER_HIDEVIEW = "EVENT_AFTER_HIDEVIEW"; +/** + * Created by GUY on 2017/2/8. + * + * @class BI.BubbleCombo + * @extends BI.Widget + */ +BI.BubbleCombo = BI.inherit(BI.Widget, { + _const: { + TRIANGLE_LENGTH: 6 + }, + _defaultConfig: function () { + return BI.extend(BI.BubbleCombo.superclass._defaultConfig.apply(this, arguments), { + baseCls: "bi-bubble-combo", + trigger: "click", + toggle: true, + direction: "bottom", //top||bottom||left||right||top,left||top,right||bottom,left||bottom,right + isDefaultInit: false, + destroyWhenHide: false, + isNeedAdjustHeight: true,//是否需要高度调整 + isNeedAdjustWidth: true, + stopPropagation: false, + adjustLength: 0,//调整的距离 + // adjustXOffset: 0, + // adjustYOffset: 10, + hideChecker: BI.emptyFn, + offsetStyle: "left", //left,right,center + el: {}, + popup: {}, + }) + }, + _init: function () { + BI.BubbleCombo.superclass._init.apply(this, arguments); + var self = this, o = this.options; + this.combo = BI.createWidget({ + type: "bi.combo", + element: this, + trigger: o.trigger, + toggle: o.toggle, + direction: o.direction, + isDefaultInit: o.isDefaultInit, + destroyWhenHide: o.destroyWhenHide, + isNeedAdjustHeight: o.isNeedAdjustHeight, + isNeedAdjustWidth: o.isNeedAdjustWidth, + adjustLength: this._getAdjustLength(), + stopPropagation: o.stopPropagation, + adjustXOffset: 0, + adjustYOffset: 0, + hideChecker: o.hideChecker, + offsetStyle: o.offsetStyle, + el: o.el, + popup: BI.extend({ + type: "bi.bubble_popup_view" + }, o.popup), + }); + this.combo.on(BI.Combo.EVENT_TRIGGER_CHANGE, function () { + self.fireEvent(BI.BubbleCombo.EVENT_TRIGGER_CHANGE, arguments); + }); + this.combo.on(BI.Combo.EVENT_CHANGE, function () { + self.fireEvent(BI.BubbleCombo.EVENT_CHANGE, arguments); + }); + this.combo.on(BI.Combo.EVENT_EXPAND, function () { + self.fireEvent(BI.BubbleCombo.EVENT_EXPAND, arguments); + }); + this.combo.on(BI.Combo.EVENT_COLLAPSE, function () { + self.fireEvent(BI.BubbleCombo.EVENT_COLLAPSE, arguments); + }); + this.combo.on(BI.Combo.EVENT_AFTER_INIT, function () { + self.fireEvent(BI.BubbleCombo.EVENT_AFTER_INIT, arguments); + }); + this.combo.on(BI.Combo.EVENT_BEFORE_POPUPVIEW, function () { + self.fireEvent(BI.BubbleCombo.EVENT_BEFORE_POPUPVIEW, arguments); + }); + this.combo.on(BI.Combo.EVENT_AFTER_POPUPVIEW, function () { + self._showTriangle(); + self.fireEvent(BI.BubbleCombo.EVENT_AFTER_POPUPVIEW, arguments); + }); + this.combo.on(BI.Combo.EVENT_BEFORE_HIDEVIEW, function () { + self._hideTriangle(); + self.fireEvent(BI.BubbleCombo.EVENT_BEFORE_HIDEVIEW, arguments); + }); + this.combo.on(BI.Combo.EVENT_AFTER_HIDEVIEW, function () { + self.fireEvent(BI.BubbleCombo.EVENT_AFTER_HIDEVIEW, arguments); + }); + }, + + _getAdjustLength: function () { + return this._const.TRIANGLE_LENGTH + this.options.adjustLength; + }, + + _createTriangle: function (direction) { + var pos = {}, op = {}; + var adjustLength = this.options.adjustLength; + var offset = this.element.offset(); + var left = offset.left, right = offset.left + this.element.outerWidth(); + var top = offset.top, bottom = offset.top + this.element.outerHeight(); + switch (direction) { + case "left": + pos = { + top: top, + height: this.element.outerHeight(), + left: left - adjustLength - this._const.TRIANGLE_LENGTH + }; + op = {width: this._const.TRIANGLE_LENGTH}; + break; + case "right": + pos = { + top: top, + height: this.element.outerHeight(), + left: right + adjustLength + }; + op = {width: this._const.TRIANGLE_LENGTH}; + break; + case "top": + pos = { + left: left, + width: this.element.outerWidth(), + top: top - adjustLength - this._const.TRIANGLE_LENGTH + }; + op = {height: this._const.TRIANGLE_LENGTH}; + break; + case "bottom": + pos = { + left: left, + width: this.element.outerWidth(), + top: bottom + adjustLength + }; + op = {height: this._const.TRIANGLE_LENGTH}; + break; + default: + break; + } + this.triangle && this.triangle.destroy(); + this.triangle = BI.createWidget(op, { + type: "bi.center_adapt", + cls: "button-combo-triangle-wrapper", + items: [{ + type: "bi.layout", + cls: "bubble-combo-triangle-" + direction + " bi-high-light-border" + }] + }); + pos.el = this.triangle; + BI.createWidget({ + type: "bi.absolute", + element: this, + items: [pos] + }) + }, + + _createLeftTriangle: function () { + this._createTriangle("left"); + }, + + _createRightTriangle: function () { + this._createTriangle("right"); + }, + + _createTopTriangle: function () { + this._createTriangle("top"); + }, + + _createBottomTriangle: function () { + this._createTriangle("bottom"); + }, + + _showTriangle: function () { + var pos = this.combo.getPopupPosition(); + switch (pos.dir) { + case "left,top": + case "left,bottom": + this._createLeftTriangle(); + this.combo.getView().showLine("right"); + break; + case "right,top": + case "right,bottom": + this._createRightTriangle(); + this.combo.getView().showLine("left"); + break; + case "top,left": + case "top,right": + this._createTopTriangle(); + this.combo.getView().showLine("bottom"); + break; + case "bottom,left": + case "bottom,right": + this._createBottomTriangle(); + this.combo.getView().showLine("top"); + break; + } + }, + + _hideTriangle: function () { + this.triangle && this.triangle.destroy(); + this.triangle = null; + this.combo.getView() && this.combo.getView().hideLine(); + }, + + hideView: function () { + this._hideTriangle(); + this.combo && this.combo.hideView(); + }, + + showView: function () { + this.combo && this.combo.showView(); + }, + + isViewVisible: function () { + return this.combo.isViewVisible(); + } +}); + +BI.BubbleCombo.EVENT_TRIGGER_CHANGE = "EVENT_TRIGGER_CHANGE"; +BI.BubbleCombo.EVENT_CHANGE = "EVENT_CHANGE"; +BI.BubbleCombo.EVENT_EXPAND = "EVENT_EXPAND"; +BI.BubbleCombo.EVENT_COLLAPSE = "EVENT_COLLAPSE"; +BI.BubbleCombo.EVENT_AFTER_INIT = "EVENT_AFTER_INIT"; + + +BI.BubbleCombo.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW"; +BI.BubbleCombo.EVENT_AFTER_POPUPVIEW = "EVENT_AFTER_POPUPVIEW"; +BI.BubbleCombo.EVENT_BEFORE_HIDEVIEW = "EVENT_BEFORE_HIDEVIEW"; +BI.BubbleCombo.EVENT_AFTER_HIDEVIEW = "EVENT_AFTER_HIDEVIEW"; BI.shortcut("bi.bubble_combo", BI.BubbleCombo); \ No newline at end of file diff --git a/src/case/loader/sort.list.js b/src/case/loader/sort.list.js index c452307ff0..93a7d148d3 100644 --- a/src/case/loader/sort.list.js +++ b/src/case/loader/sort.list.js @@ -1,173 +1,176 @@ -/** - * Created by GUY on 2016/4/29. - * - * @class BI.SortList - * @extends BI.Widget - */ -BI.SortList = BI.inherit(BI.Widget, { - _defaultConfig: function () { - return BI.extend(BI.SortList.superclass._defaultConfig.apply(this, arguments), { - baseCls: "bi-sort-list", - - isDefaultInit: true,//是否默认初始化数据 - - //下面是button_group的属性 - el: { - type: "bi.button_group" - }, - - items: [], - itemsCreator: BI.emptyFn, - onLoaded: BI.emptyFn, - - //下面是分页信息 - count: false, - next: {}, - hasNext: BI.emptyFn - - //containment: this.element, - //connectWith: ".bi-sort-list", - }) - }, - - _init: function () { - BI.SortList.superclass._init.apply(this, arguments); - var self = this, o = this.options; - this.loader = BI.createWidget({ - type: "bi.list_loader", - element: this, - isDefaultInit: o.isDefaultInit, - el: o.el, - items: this._formatItems(o.items), - itemsCreator: function (op, callback) { - o.itemsCreator(op, function (items) { - callback(self._formatItems(items)); - }); - }, - onLoaded: o.onLoaded, - count: o.count, - next: o.next, - hasNext: o.hasNext - }); - this.loader.on(BI.Controller.EVENT_CHANGE, function (type, value, obj) { - self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); - if (type === BI.Events.CLICK) { - self.fireEvent(BI.SortList.EVENT_CHANGE, value, obj); - } - }); - - this.loader.element.sortable({ - containment: o.containment || this.element, - connectWith: o.connectWith || ".bi-sort-list", - items: ".sort-item", - cursor: o.cursor || "drag", - tolerance: o.tolerance || "intersect", - placeholder: { - element: function ($currentItem) { - var holder = BI.createWidget({ - type: "bi.layout", - cls: "bi-sortable-holder", - height: $currentItem.outerHeight() - }); - holder.element.css({ - "margin-left": $currentItem.css("margin-left"), - "margin-right": $currentItem.css("margin-right"), - "margin-top": $currentItem.css("margin-top"), - "margin-bottom": $currentItem.css("margin-bottom"), - "margin": $currentItem.css("margin") - }); - return holder.element; - }, - update: function () { - - } - }, - start: function (event, ui) { - - }, - stop: function (event, ui) { - self.fireEvent(BI.SortList.EVENT_CHANGE); - }, - over: function (event, ui) { - - } - }); - }, - - _formatItems: function (items) { - BI.each(items, function (i, item) { - item = BI.stripEL(item); - item.cls = item.cls ? item.cls + " sort-item" : "sort-item"; - item.attributes = { - sorted: item.value - }; - }); - return items; - }, - - hasNext: function () { - return this.loader.hasNext(); - }, - - addItems: function (items) { - this.loader.addItems(items); - }, - - populate: function (items) { - this.loader.populate.apply(this.loader, arguments); - }, - - empty: function () { - this.loader.empty(); - }, - - setNotSelectedValue: function () { - this.loader.setNotSelectedValue.apply(this.loader, arguments); - }, - - getNotSelectedValue: function () { - return this.loader.getNotSelectedValue(); - }, - - setValue: function () { - this.loader.setValue.apply(this.loader, arguments); - }, - - getValue: function () { - return this.loader.getValue(); - }, - - getAllButtons: function () { - return this.loader.getAllButtons(); - }, - - getAllLeaves: function () { - return this.loader.getAllLeaves(); - }, - - getSelectedButtons: function () { - return this.loader.getSelectedButtons(); - }, - - getNotSelectedButtons: function () { - return this.loader.getNotSelectedButtons(); - }, - - getIndexByValue: function (value) { - return this.loader.getIndexByValue(value); - }, - - getNodeById: function (id) { - return this.loader.getNodeById(id); - }, - - getNodeByValue: function (value) { - return this.loader.getNodeByValue(value); - }, - - getSortedValues: function () { - return this.loader.element.sortable("toArray", {attribute: "sorted"}); - } -}); -BI.SortList.EVENT_CHANGE = "EVENT_CHANGE"; +/** + * Created by GUY on 2016/4/29. + * + * @class BI.SortList + * @extends BI.Widget + */ +BI.SortList = BI.inherit(BI.Widget, { + _defaultConfig: function () { + return BI.extend(BI.SortList.superclass._defaultConfig.apply(this, arguments), { + baseCls: "bi-sort-list", + + isDefaultInit: true,//是否默认初始化数据 + + //下面是button_group的属性 + el: { + type: "bi.button_group" + }, + + items: [], + itemsCreator: BI.emptyFn, + onLoaded: BI.emptyFn, + + //下面是分页信息 + count: false, + next: {}, + hasNext: BI.emptyFn + + //containment: this.element, + //connectWith: ".bi-sort-list", + }) + }, + + _init: function () { + BI.SortList.superclass._init.apply(this, arguments); + var self = this, o = this.options; + this.loader = BI.createWidget({ + type: "bi.list_loader", + element: this, + isDefaultInit: o.isDefaultInit, + el: o.el, + items: this._formatItems(o.items), + itemsCreator: function (op, callback) { + o.itemsCreator(op, function (items) { + callback(self._formatItems(items)); + }); + }, + onLoaded: o.onLoaded, + count: o.count, + next: o.next, + hasNext: o.hasNext + }); + this.loader.on(BI.Controller.EVENT_CHANGE, function (type, value, obj) { + self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); + if (type === BI.Events.CLICK) { + self.fireEvent(BI.SortList.EVENT_CHANGE, value, obj); + } + }); + + this.loader.element.sortable({ + containment: o.containment || this.element, + connectWith: o.connectWith || ".bi-sort-list", + items: ".sort-item", + cursor: o.cursor || "drag", + tolerance: o.tolerance || "intersect", + placeholder: { + element: function ($currentItem) { + var holder = BI.createWidget({ + type: "bi.layout", + cls: "bi-sortable-holder", + height: $currentItem.outerHeight() + }); + holder.element.css({ + "margin-left": $currentItem.css("margin-left"), + "margin-right": $currentItem.css("margin-right"), + "margin-top": $currentItem.css("margin-top"), + "margin-bottom": $currentItem.css("margin-bottom"), + "margin": $currentItem.css("margin") + }); + return holder.element; + }, + update: function () { + + } + }, + start: function (event, ui) { + + }, + stop: function (event, ui) { + self.fireEvent(BI.SortList.EVENT_CHANGE); + }, + over: function (event, ui) { + + } + }); + }, + + _formatItems: function (items) { + BI.each(items, function (i, item) { + item = BI.stripEL(item); + item.cls = item.cls ? item.cls + " sort-item" : "sort-item"; + item.attributes = { + sorted: item.value + }; + }); + return items; + }, + + hasNext: function () { + return this.loader.hasNext(); + }, + + addItems: function (items) { + this.loader.addItems(items); + }, + + populate: function (items) { + if (items) { + arguments[0] = this._formatItems(items); + } + this.loader.populate.apply(this.loader, arguments); + }, + + empty: function () { + this.loader.empty(); + }, + + setNotSelectedValue: function () { + this.loader.setNotSelectedValue.apply(this.loader, arguments); + }, + + getNotSelectedValue: function () { + return this.loader.getNotSelectedValue(); + }, + + setValue: function () { + this.loader.setValue.apply(this.loader, arguments); + }, + + getValue: function () { + return this.loader.getValue(); + }, + + getAllButtons: function () { + return this.loader.getAllButtons(); + }, + + getAllLeaves: function () { + return this.loader.getAllLeaves(); + }, + + getSelectedButtons: function () { + return this.loader.getSelectedButtons(); + }, + + getNotSelectedButtons: function () { + return this.loader.getNotSelectedButtons(); + }, + + getIndexByValue: function (value) { + return this.loader.getIndexByValue(value); + }, + + getNodeById: function (id) { + return this.loader.getNodeById(id); + }, + + getNodeByValue: function (value) { + return this.loader.getNodeByValue(value); + }, + + getSortedValues: function () { + return this.loader.element.sortable("toArray", {attribute: "sorted"}); + } +}); +BI.SortList.EVENT_CHANGE = "EVENT_CHANGE"; BI.shortcut("bi.sort_list", BI.SortList); \ No newline at end of file diff --git a/src/case/trigger/trigger.editor.js b/src/case/trigger/trigger.editor.js index 5427b331af..0fa4452855 100644 --- a/src/case/trigger/trigger.editor.js +++ b/src/case/trigger/trigger.editor.js @@ -1,79 +1,80 @@ -/** - * 文本输入框trigger - * - * Created by GUY on 2015/9/15. - * @class BI.EditorTrigger - * @extends BI.Trigger - */ -BI.EditorTrigger = BI.inherit(BI.Trigger, { - _const: { - hgap: 4 - }, - - _defaultConfig: function () { - var conf = BI.EditorTrigger.superclass._defaultConfig.apply(this, arguments); - return BI.extend(conf, { - baseCls: (conf.baseCls || "") + " bi-editor-trigger bi-border", - height: 30, - validationChecker: BI.emptyFn, - quitChecker: BI.emptyFn, - allowBlank: false, - watermark: "", - errorText: "", - triggerWidth: 30 - }); - }, - - _init: function () { - this.options.height -= 2; - BI.EditorTrigger.superclass._init.apply(this, arguments); - var self = this, o = this.options, c = this._const; - this.editor = BI.createWidget({ - type: "bi.sign_editor", - height: o.height, - value: o.value, - validationChecker: o.validationChecker, - quitChecker: o.quitChecker, - mouseOut: false, - allowBlank: o.allowBlank, - watermark: o.watermark, - errorText: o.errorText - }); - this.editor.on(BI.Controller.EVENT_CHANGE, function () { - self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); - }); - this.editor.on(BI.SignEditor.EVENT_CHANGE, function () { - self.fireEvent(BI.EditorTrigger.EVENT_CHANGE, arguments); - }); - - BI.createWidget({ - element: this, - type: 'bi.htape', - items: [ - { - el: this.editor - }, { - el: { - type: "bi.trigger_icon_button", - width: o.triggerWidth - }, - width: o.triggerWidth - } - ] - }); - }, - - getValue: function () { - return this.editor.getValue(); - }, - - setValue: function (value) { - this.editor.setValue(value); - }, - - setText: function (text) { - this.editor.setState(text); - } -}); -BI.EditorTrigger.EVENT_CHANGE = "BI.EditorTrigger.EVENT_CHANGE"; +/** + * 文本输入框trigger + * + * Created by GUY on 2015/9/15. + * @class BI.EditorTrigger + * @extends BI.Trigger + */ +BI.EditorTrigger = BI.inherit(BI.Trigger, { + _const: { + hgap: 4 + }, + + _defaultConfig: function () { + var conf = BI.EditorTrigger.superclass._defaultConfig.apply(this, arguments); + return BI.extend(conf, { + baseCls: (conf.baseCls || "") + " bi-editor-trigger bi-border", + height: 30, + validationChecker: BI.emptyFn, + quitChecker: BI.emptyFn, + allowBlank: false, + watermark: "", + errorText: "", + triggerWidth: 30 + }); + }, + + _init: function () { + this.options.height -= 2; + BI.EditorTrigger.superclass._init.apply(this, arguments); + var self = this, o = this.options, c = this._const; + this.editor = BI.createWidget({ + type: "bi.sign_editor", + height: o.height, + value: o.value, + validationChecker: o.validationChecker, + quitChecker: o.quitChecker, + mouseOut: false, + allowBlank: o.allowBlank, + watermark: o.watermark, + errorText: o.errorText + }); + this.editor.on(BI.Controller.EVENT_CHANGE, function () { + self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); + }); + this.editor.on(BI.SignEditor.EVENT_CHANGE, function () { + self.fireEvent(BI.EditorTrigger.EVENT_CHANGE, arguments); + }); + + BI.createWidget({ + element: this, + type: 'bi.htape', + items: [ + { + el: this.editor + }, { + el: { + type: "bi.trigger_icon_button", + cls: "bi-border-left", + width: o.triggerWidth + }, + width: o.triggerWidth + } + ] + }); + }, + + getValue: function () { + return this.editor.getValue(); + }, + + setValue: function (value) { + this.editor.setValue(value); + }, + + setText: function (text) { + this.editor.setState(text); + } +}); +BI.EditorTrigger.EVENT_CHANGE = "BI.EditorTrigger.EVENT_CHANGE"; BI.shortcut("bi.editor_trigger", BI.EditorTrigger); \ No newline at end of file