diff --git a/bi/widget.js b/bi/widget.js index 5e6df6377..6086679f0 100644 --- a/bi/widget.js +++ b/bi/widget.js @@ -436,8 +436,6 @@ BI.AdaptiveArrangement = BI.inherit(BI.Widget, { return BI.extend(BI.AdaptiveArrangement.superclass._defaultConfig.apply(this, arguments), { baseCls: "bi-adaptive-arrangement", resizable: true, - isNeedReLayout: true, - isNeedResizeContainer: true, layoutType: BI.Arrangement.LAYOUT_TYPE.FREE, items: [] }); @@ -449,73 +447,18 @@ BI.AdaptiveArrangement = BI.inherit(BI.Widget, { this.arrangement = BI.createWidget({ type: "bi.arrangement", element: this, - isNeedReLayout: o.isNeedReLayout, layoutType: o.layoutType, items: o.items }); this.arrangement.on(BI.Arrangement.EVENT_SCROLL, function () { self.fireEvent(BI.AdaptiveArrangement.EVENT_SCROLL, arguments); }); - if (o.isNeedResizeContainer) { - - var isResizing = false; - var needEnd = false; - var height; - var interval; - var startSize; - var resize = function (e, ui) { - if (isResizing) { - return; - } - isResizing = true; - height = ui.size.height; - interval = setInterval(function () { - height += 40; - self.arrangement.setContainerSize({ - width: ui.size.width, - height: height - }); - self.arrangement.scrollTo({top: height}); - }, 300); - }; - this.arrangement.container.element.resizable({ - handles: "s", - minWidth: 100, - minHeight: 20, - helper: "bi-resizer", - autoHide: true, - start: function (e, ui) { - startSize = BI.clone(ui.size); - }, - resize: function (e, ui) { - if (ui.size.height >= startSize.height - 10) { - resize(e, ui); - } else { - interval && clearInterval(interval); - needEnd = true; - } - }, - stop: function (e, ui) { - var size = ui.size; - if (isResizing && !needEnd) { - size.height = height; - } - self.arrangement.setContainerSize(ui.size); - needEnd = false; - isResizing = false; - startSize = null; - interval && clearInterval(interval); - self.fireEvent(BI.AdaptiveArrangement.EVENT_RESIZE); - } - }); - this._setLayoutType(o.layoutType); - } this.zIndex = 0; BI.each(o.items, function (i, item) { self._initResizable(item.el); }); - this.element.click(function (e) { + this.element.mousedown(function (e) { BI.each(self.getAllRegions(), function (i, region) { if (!region.el.element.__isMouseInBounds__(e)) { region.el.element.removeClass("selected"); @@ -548,159 +491,65 @@ BI.AdaptiveArrangement = BI.inherit(BI.Widget, { item.element.mousedown(function () { self._setSelect(item) }); - o.resizable && item.element.resizable({ - handles: "e, s, se", - minWidth: 20, - minHeight: 20, - autoHide: true, - helper: "bi-resizer", - start: function () { - item.element.css("zIndex", ++self.zIndex); - self.fireEvent(BI.AdaptiveArrangement.EVENT_ELEMENT_START_RESIZE); - }, - resize: function (e, ui) { - // self._resize(item.attr("id"), ui.size); - self._resize(item.attr("id"), ui.size); - self.fireEvent(BI.AdaptiveArrangement.EVENT_ELEMENT_RESIZE, item.attr("id"), ui.size); - }, - stop: function (e, ui) { - self._stopResize(item.attr("id"), ui.size); - self.fireEvent(BI.AdaptiveArrangement.EVENT_ELEMENT_STOP_RESIZE, item.attr("id"), ui.size); - self.fireEvent(BI.AdaptiveArrangement.EVENT_RESIZE); - } - }); - }, - - _resize: function (name, size) { - var self = this; - switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - break; - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - this.setRegionSize(name, size); - break; - } - }, - - _stopResize: function (name, size) { - var self = this; - switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - this.setRegionSize(name, { - width: size.width, - height: size.height - }); - break; - case BI.Arrangement.LAYOUT_TYPE.FREE: - this.setRegionSize(name, size); - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - this.setRegionSize(name, size); - break; - } - }, - - //检查宽高是否规范 - _checkRegionSize: function (name, size) { - var self = this; - switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - var newSize = {}; - var leftid, rightid, topid, bottomid; - var region = this.getRegionByName(name); - var rs = this.arrangement._getInDirectRelativeRegions(name, ["right"]).right; - var bs = this.arrangement._getInDirectRelativeRegions(name, ["bottom"]).bottom; - if (rs.left.length > 0) { - topid = BI.first(rs.left).id; - bottomid = BI.last(rs.left).id; - } - if (bs.top.length > 0) { - leftid = BI.first(bs.top).id; - rightid = BI.last(bs.top).id; - } - if (this.arrangement._isEqual(region.width, size.width)) { - topid = name; - bottomid = name; - } - if (this.arrangement._isEqual(region.height, size.height)) { - leftid = name; - rightid = name; - } - var tops = topid ? this.getDirectRelativeRegions(topid, ["top"]).top : []; - var bottoms = bottomid ? this.getDirectRelativeRegions(bottomid, ["bottom"]).bottom : []; - var lefts = leftid ? this.getDirectRelativeRegions(leftid, ["left"]).left : []; - var rights = rightid ? this.getDirectRelativeRegions(rightid, ["right"]).right : []; - if (region.width !== size.width) { - if (rights.length === 0) {//最右边的组件不能调整宽度 - newSize.width = region.width; - } else { - var finded = BI.find(tops.concat(bottoms), function (i, r) { - r = self.getRegionByName(r.id); - return Math.abs(size.width + region.left - (r.left + r.width)) <= 3; - }); - if (finded) { - finded = this.getRegionByName(finded.id); - newSize.width = finded.left + finded.width - region.left; - } else { - newSize.width = size.width; - } - } - } else { - newSize.width = size.width; - } - if (region.height !== size.height) { - if (bottoms.length === 0) { - newSize.height = region.height; - } else { - var finded = BI.find(lefts.concat(rights), function (i, r) { - r = self.getRegionByName(r.id); - return Math.abs(size.height + region.top - (r.top + r.height)) <= 3; - }); - if (finded) { - finded = this.getRegionByName(finded.id); - newSize.height = finded.top + finded.height - region.top; - } else { - newSize.height = size.height; - } - } - } else { - newSize.height = size.height; - } - return newSize; - case BI.Arrangement.LAYOUT_TYPE.FREE: - return size; - case BI.Arrangement.LAYOUT_TYPE.GRID: - return size; - } - }, + // o.resizable && item.element.resizable({ + // handles: "e, s, se", + // minWidth: 20, + // minHeight: 20, + // autoHide: true, + // helper: "bi-resizer", + // start: function () { + // item.element.css("zIndex", ++self.zIndex); + // self.fireEvent(BI.AdaptiveArrangement.EVENT_ELEMENT_START_RESIZE); + // }, + // resize: function (e, ui) { + // // self._resize(item.attr("id"), ui.size); + // self._resize(item.attr("id"), e, ui.size, ui.position); + // }, + // stop: function (e, ui) { + // self._stopResize(item.attr("id"), ui.size); + // self.fireEvent(BI.AdaptiveArrangement.EVENT_ELEMENT_STOP_RESIZE, item.attr("id"), ui.size); + // self.fireEvent(BI.AdaptiveArrangement.EVENT_RESIZE); + // } + // }); + }, + + // _resize: function (name, e, size, position) { + // var self = this; + // this.scrollInterval(e, false, true, function (changedSize) { + // size.width += changedSize.offsetX; + // size.height += changedSize.offsetY; + // var containerWidth = self.arrangement.container.element.width(); + // var containerHeight = self.arrangement.container.element.height(); + // self.arrangement.container.element.width(containerWidth + changedSize.offsetX); + // self.arrangement.container.element.height(containerHeight + changedSize.offsetY); + // switch (self.getLayoutType()) { + // case BI.Arrangement.LAYOUT_TYPE.FREE: + // break; + // case BI.Arrangement.LAYOUT_TYPE.GRID: + // self.setRegionSize(name, size); + // break; + // } + // self.fireEvent(BI.AdaptiveArrangement.EVENT_ELEMENT_RESIZE, name, size); + // }); + // }, + // + // _stopResize: function (name, size) { + // var self = this; + // this.scrollEnd(); + // switch (this.getLayoutType()) { + // case BI.Arrangement.LAYOUT_TYPE.FREE: + // this.setRegionSize(name, size); + // break; + // case BI.Arrangement.LAYOUT_TYPE.GRID: + // this.setRegionSize(name, size); + // break; + // } + // }, _getScrollOffset: function () { return this.arrangement._getScrollOffset(); }, - _setLayoutType: function (type) { - try { - //BI.nextTick(function () { - switch (type) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - $(">.ui-resizable-s", this.arrangement.container.element).css("zIndex", ""); - break; - case BI.Arrangement.LAYOUT_TYPE.FREE: - $(">.ui-resizable-s", this.arrangement.container.element).css("zIndex", "-1"); - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - $(">.ui-resizable-s", this.arrangement.container.element).css("zIndex", "-1"); - break; - } - this.arrangement.container.element.resizable("option", "disabled", type === BI.Arrangement.LAYOUT_TYPE.FREE); - //}); - } catch (e) { - - } - }, - getClientWidth: function () { return this.arrangement.getClientWidth(); }, @@ -709,97 +558,13 @@ BI.AdaptiveArrangement = BI.inherit(BI.Widget, { return this.arrangement.getClientHeight(); }, - getDirectRelativeRegions: function (name, direction) { - return this.arrangement.getDirectRelativeRegions(name, direction); - }, - addRegion: function (region, position) { this._initResizable(region.el); this._setSelect(region.el); var self = this, flag; var old = this.arrangement.getAllRegions(); - if (BI.isNotNull(this.position)) { - switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - var type = this.position.type; - var current = this.position.region; - switch (type) { - case "top-gap": - var t = this.arrangement._getEquivalentRelativeRegions(current.id, ["top"])[0]; - current = this.getRegionByName(t.id); - break; - case "bottom-gap": - break; - } - var id = BI.UUID(); - var insert = this.position.insert; - if (insert.height > 0) { - var clone = this.arrangement._cloneRegion(); - //找到最下面的组件 - var occupied = this.arrangement._getRegionOccupied(); - var bottomRegions = []; - BI.each(clone, function (i, region) { - if (self.arrangement._isEqual(region.top + region.height, occupied.top + occupied.height)) { - bottomRegions.push(region); - } - }); - var bs = this.arrangement._getInDirectRelativeRegions(current.id, ["bottom"]).bottom; - var seen = [current.id]; - var bottoms = bs.bottom; - var occ = this.arrangement._getRegionOccupied(bottoms); - clone[id] = BI.extend({}, region, { - left: occ.left, - width: occ.width, - top: current.top + current.height, - height: insert.height - }); - while (bottoms.length > 0) { - BI.each(bottoms, function (i, bottom) { - seen.push(bottom.id); - var r = self.getRegionByName(bottom.id); - BI.extend(clone[bottom.id], { - top: r.top + insert.height - }); - }); - var t = []; - BI.each(bottoms, function (i, bottom) { - var n = self.arrangement._getInDirectRelativeRegions(bottom.id, ["bottom"]).bottom; - BI.each(n.top, function (i, region) { - if (!seen.contains(region.id)) { - seen.push(region.id); - var r = self.getRegionByName(region.id); - BI.extend(clone[region.id], { - height: r.height + insert.height - }); - } - }); - t = t.concat(n.bottom); - }); - t = BI.uniq(t, function (i, region) { - return region.id; - }); - bottoms = t; - } - BI.each(bottomRegions, function (i, region) { - if (!seen.contains(region.id)) { - region.height = region.height + insert.height; - } - }); - this.arrangement.populate(BI.toArray(clone)); - this.arrangement.resize(); - flag = true; - } - break; - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - break; - } - this.position = null; - } else { - if (flag = this.arrangement.addRegion(region, position)) { - this._old = old; - } + if (flag = this.arrangement.addRegion(region, position)) { + this._old = old; } return flag; }, @@ -813,13 +578,12 @@ BI.AdaptiveArrangement = BI.inherit(BI.Widget, { this._old = this.getAllRegions(); this.relayout(); } - return true; + return flag; }, setRegionSize: function (name, size) { var flag; var old = this.getAllRegions(); - size = this._checkRegionSize(name, size); if (flag = this.arrangement.setRegionSize(name, size)) { this._old = old; } @@ -828,55 +592,114 @@ BI.AdaptiveArrangement = BI.inherit(BI.Widget, { setPosition: function (position, size) { var self = this; - var at = this.arrangement.setPosition(position, size); - this.position = null; - if (!at) { - switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - if (position.left < 0 || position.top < 0) { - return null; + return this.arrangement.setPosition(position, size); + }, + + setRegionPosition: function (name, position) { + var region = this.getRegionByName(name); + return this.arrangement.setRegionPosition(name, position); + }, + + setDropPosition: function (position) { + return this.arrangement.setDropPosition(position); + }, + + scrollInterval: function (e, isBorderScroll, isOverflowScroll, cb) { + var self = this; + var map = { + top: [-1, 0], + bottom: [1, 0], + left: [0, -1], + right: [0, 1] + }; + var clientSize = this.element.bounds(); + + function scrollTo(direction, callback) { + if (direction === "") { + self.lastActiveRegion = ""; + if (self._scrollInterval) { + clearInterval(self._scrollInterval); + self._scrollInterval = null; + } + return; + } + if (self.lastActiveRegion !== direction) { + self.lastActiveRegion = direction; + if (self._scrollInterval) { + clearInterval(self._scrollInterval); + self._scrollInterval = null; + } + self._scrollInterval = setInterval(function () { + var offset = self._getScrollOffset(); + var t = offset.top + map[direction][0] * 40; + var l = offset.left + map[direction][1] * 40; + if (t < 0 || l < 0) { + return; } - var offset = this.arrangement._getScrollOffset(); - position = { - left: position.left + offset.left, - top: position.top + offset.top - }; - BI.some(this.getAllRegions(), function (id, region) { - if (self.arrangement._isPositionInBounds(position, region)) { - var at = self.arrangement._positionAt(position, region); - if (at.type === "top-gap" || at.type === "bottom-gap") { - self.arrangement._setArrangeSize({ - top: region.top - 8 + (at.type === "bottom-gap" ? region.height : 0), - left: region.left, - width: region.width, - height: 16 - }); - self.position = { - insert: { - height: (size || {}).height - }, - type: at.type, - region: region - }; - self.arrangement._start(); - } - return true; - } + callback({ + offsetX: map[direction][1] * 40, + offsetY: map[direction][0] * 40 }); - break; - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - break; + self.scrollTo({ + top: t, + left: l + }); + }, 300); + } + } + + cb({ + offsetX: 0, + offsetY: 0 + }); + var offset = this.element.offset(); + var p = { + left: e.pageX - offset.left, + top: e.pageY - offset.top + }; + //向上滚 + if (isBorderScroll && p.top >= 0 && p.top <= 30) { + scrollTo("top", cb) + } + //向下滚 + else if (isBorderScroll && p.top >= clientSize.height - 30 && p.top <= clientSize.height) { + scrollTo("bottom", cb) + } + //向左滚 + else if (isBorderScroll && p.left >= 0 && p.left <= 30) { + scrollTo("left", cb) + } + //向右滚 + else if (isBorderScroll && p.left >= clientSize.width - 30 && p.left <= clientSize.width) { + scrollTo("right", cb) + } else { + if (isOverflowScroll === true) { + if (p.top < 0) { + scrollTo("top", cb); + } + else if (p.top > clientSize.height) { + scrollTo("bottom", cb); + } + else if (p.left < 0) { + scrollTo("left", cb); + } + else if (p.left > clientSize.width) { + scrollTo("right", cb); + } else { + scrollTo("", cb); + } + } else { + scrollTo("", cb); } } - return this.position || at; }, - setRegionPosition: function (name, position) { - var region = this.getRegionByName(name); - region.el.element.css("zIndex", ++this.zIndex); - return this.arrangement.setRegionPosition(name, position); + scrollEnd: function () { + this.lastActiveRegion = ""; + if (this._scrollInterval) { + clearInterval(this._scrollInterval); + this._scrollInterval = null; + } }, scrollTo: function (scroll) { @@ -897,7 +720,6 @@ BI.AdaptiveArrangement = BI.inherit(BI.Widget, { setLayoutType: function (type) { var self = this; - this._setLayoutType(type); this.arrangement.setLayoutType(type); }, @@ -933,17 +755,6 @@ BI.AdaptiveArrangement = BI.inherit(BI.Widget, { self._initResizable(item.el); }); this.arrangement.populate(items); - switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - BI.nextTick(function () { - self.arrangement.resize(); - }); - break; - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - break; - } } }); BI.AdaptiveArrangement.EVENT_ELEMENT_START_RESIZE = "AdaptiveArrangement.EVENT_ELEMENT_START_RESIZE"; @@ -964,12 +775,6 @@ BI.ArrangementBlock = BI.inherit(BI.Widget, { return BI.extend(BI.ArrangementBlock.superclass._defaultConfig.apply(this, arguments), { baseCls: "bi-arrangement-block bi-mask" }); - }, - - _init: function () { - BI.ArrangementBlock.superclass._init.apply(this, arguments); - var self = this, o = this.options; - } }); BI.shortcut('bi.arrangement_block', BI.ArrangementBlock);/** @@ -985,12 +790,6 @@ BI.ArrangementDroppable = BI.inherit(BI.Widget, { return BI.extend(BI.ArrangementDroppable.superclass._defaultConfig.apply(this, arguments), { baseCls: "bi-arrangement-droppable bi-resizer" }); - }, - - _init: function () { - BI.ArrangementDroppable.superclass._init.apply(this, arguments); - var self = this, o = this.options; - } }); BI.shortcut('bi.arrangement_droppable', BI.ArrangementDroppable);/** @@ -1005,8 +804,7 @@ 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.FREE, - isNeedReLayout: true, + layoutType: BI.Arrangement.LAYOUT_TYPE.GRID, items: [] }); }, @@ -1023,20 +821,9 @@ BI.Arrangement = BI.inherit(BI.Widget, { type: "bi.arrangement_block", invisible: true }); - this.droppable = BI.createWidget({ - type: "bi.layout", - cls: "arrangement-drop-container", - invisible: true - }); this.container = BI.createWidget({ type: "bi.absolute", - items: o.items.concat([this.block, this.arrangement, { - el: this.droppable, - left: 0, - right: 0, - top: 0, - bottom: 0 - }]) + items: o.items.concat([this.block, this.arrangement]) }); this.scrollContainer = BI.createWidget({ @@ -1061,9 +848,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { items: [this.scrollContainer] }); this.regions = {}; - this.locations = {}; - this.drops = {}; - this.storeDrops = {}; if (o.items.length > 0) { BI.nextTick(function () { self.populate(o.items); @@ -1075,48 +859,9 @@ BI.Arrangement = BI.inherit(BI.Widget, { _calculateRegions: function (items) { var self = this, o = this.options; this.regions = {}; - this.drops = {}; BI.each(items, function (i, item) { var region = self._createOneRegion(item); self.regions[region.id] = region; - var drop = self._createOneDrop(region); - self.drops[drop.id] = drop; - self.storeDrops[drop.id] = drop; - }); - }, - - //定方位 - _locationRegion: function () { - var self = this, o = this.options; - this.locations = {}; - var reg = []; - BI.each(this.regions, function (id, region) { - var t = new BI.Region(region.left, region.top, region.width, region.height); - t.id = id; - reg.push(t); - self.locations[id] = {top: [], left: [], right: [], bottom: []}; - }); - BI.each(reg, function (i, dim) { - var topRegion = new BI.Region(dim.x, 0, dim.w, dim.y), - bottomRegion = new BI.Region(dim.x, dim.y + dim.h, dim.w, BI.MAX), - leftRegion = new BI.Region(0, dim.y, dim.x, dim.h), - rightRegion = new BI.Region(dim.x + dim.w, dim.y, BI.MAX, dim.h); - BI.each(reg, function (j, tar) { - if (i !== j) { - if (tar.isIntersects(topRegion) && self._isLessThanEqual(tar.y + tar.h, dim.y)) { - self.locations[dim.id].top.push(self.regions[tar.id]); - } - if (tar.isIntersects(bottomRegion) && self._isMoreThanEqual(tar.y, dim.y + dim.h)) { - self.locations[dim.id].bottom.push(self.regions[tar.id]); - } - if (tar.isIntersects(leftRegion) && self._isLessThanEqual(tar.x + tar.w, dim.x)) { - self.locations[dim.id].left.push(self.regions[tar.id]); - } - if (tar.isIntersects(rightRegion) && self._isMoreThanEqual(tar.x, dim.x + dim.w)) { - self.locations[dim.id].right.push(self.regions[tar.id]); - } - } - }); }); }, @@ -1140,394 +885,29 @@ BI.Arrangement = BI.inherit(BI.Widget, { return num1 >= num2 || this._isEqual(num1, num2); }, - ////方法//// - _isPositionInBounds: function (position, bound) { - var region = new BI.Region(bound.left, bound.top, bound.width, bound.height); - return region.isPointInside(position.left, position.top); - }, - - //获取某区域等量相关联的区域 - _getEquivalentRelativeRegions: function (name, direction) { - var self = this; - direction || (direction = ["top", "bottom", "left", "right"]); - var result = []; - var target = this.regions[name]; - var tops = this.locations[name].top; - var bottoms = this.locations[name].bottom; - var lefts = this.locations[name].left; - var rights = this.locations[name].right; - var finded = direction.contains("top") && BI.some(tops, function (i, region) { - if (self._isEqual(region.top + region.height, target.top) && self._isEqual(region.left, target.left) && self._isEqual(region.width, target.width)) { - var clone = BI.clone(region); - clone.height = region.height + target.height; - result.push(clone); - return true; - } - }); - if (!finded) { - finded = direction.contains("bottom") && BI.some(bottoms, function (i, region) { - if (self._isEqual(target.top + target.height, region.top) && self._isEqual(region.left, target.left) && self._isEqual(region.width, target.width)) { - var clone = BI.clone(region); - clone.top = region.top - target.height; - clone.height = region.height + target.height; - result.push(clone); - return true; - } - }); - if (!finded) { - finded = direction.contains("left") && BI.some(lefts, function (i, region) { - if (self._isEqual(region.left + region.width, target.left) && self._isEqual(region.top, target.top) && self._isEqual(region.height, target.height)) { - var clone = BI.clone(region); - clone.width = region.width + target.width; - result.push(clone); - return true; - } - }); - if (!finded) { - finded = direction.contains("right") && BI.some(rights, function (i, region) { - if (self._isEqual(target.left + target.width, region.left) && self._isEqual(region.top, target.top) && self._isEqual(region.height, target.height)) { - var clone = BI.clone(region); - clone.left = region.left - target.width; - clone.width = region.width + target.width; - result.push(clone); - return true; - } - }); - if (!finded) { - var findTopRegions = [], findBottomRegions = []; - direction.contains("top") && BI.each(tops, function (i, region) { - if (self._isEqual(region.top + region.height, target.top) - && self._isMoreThanEqual(region.left, target.left) - && self._isLessThanEqual(region.left + region.width, target.left + target.width)) { - findTopRegions.push(region); - } - }); - direction.contains("bottom") && BI.each(bottoms, function (i, region) { - if (self._isEqual(target.top + target.height, region.top) - && self._isMoreThanEqual(region.left, target.left) - && self._isLessThanEqual(region.left + region.width, target.left + target.width)) { - findBottomRegions.push(region); - } - }); - var topValid = isRegionsValid(findTopRegions, "top"), - bottomValid = isRegionsValid(findBottomRegions, "bottom"); - if (topValid && bottomValid) { - BI.each(findTopRegions, function (i, region) { - var clone = BI.clone(region); - clone.height = region.height + target.height / 2; - result.push(clone); - }); - BI.each(findBottomRegions, function (i, region) { - var clone = BI.clone(region); - clone.top = region.top - target.height / 2; - clone.height = region.height + target.height / 2; - result.push(clone); - }); - } else if (topValid) { - BI.each(findTopRegions, function (i, region) { - var clone = BI.clone(region); - clone.height = region.height + target.height; - result.push(clone); - }); - } else if (bottomValid) { - BI.each(findBottomRegions, function (i, region) { - var clone = BI.clone(region); - clone.top = region.top - target.height; - clone.height = region.height + target.height; - result.push(clone); - }); - } - if (!topValid && !bottomValid) { - var findLeftRegions = [], findRightRegions = []; - direction.contains("left") && BI.each(lefts, function (i, region) { - if (self._isEqual(region.left + region.width, target.left) - && self._isMoreThanEqual(region.top, target.top) - && self._isLessThanEqual(region.top + region.height, target.top + target.height)) { - findLeftRegions.push(region); - } - }); - direction.contains("right") && BI.each(rights, function (i, region) { - if (self._isEqual(target.left + target.width, region.left) - && self._isMoreThanEqual(region.top, target.top) - && self._isLessThanEqual(region.top + region.height, target.top + target.height)) { - findRightRegions.push(region); - } - }); - var leftValid = isRegionsValid(findLeftRegions, "left"), - rightValid = isRegionsValid(findRightRegions, "right"); - if (leftValid && rightValid) { - BI.each(findLeftRegions, function (i, region) { - var clone = BI.clone(region); - clone.width = region.width + target.width / 2; - result.push(clone); - }); - BI.each(findRightRegions, function (i, region) { - var clone = BI.clone(region); - clone.left = region.left - target.width / 2; - clone.width = region.width + target.width / 2; - result.push(clone); - }); - } else if (leftValid) { - BI.each(findLeftRegions, function (i, region) { - var clone = BI.clone(region); - clone.width = region.width + target.width; - result.push(clone); - }); - } else if (rightValid) { - BI.each(findRightRegions, function (i, region) { - var clone = BI.clone(region); - clone.left = region.left - target.width; - clone.width = region.width + target.width; - result.push(clone); - }); - } - - //上下左右都不可行 - if (!leftValid && !rightValid) { - - } - } - } - } + //获取占有的最大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 } } - return result; - function isRegionsValid(regions, dir) { - var occupied = self._getRegionOccupied(regions); - switch (dir) { - case "top": - case "bottom": - return self._isEqual(occupied.left, target.left) && self._isEqual(occupied.width, target.width); - case "left": - case "right": - return self._isEqual(occupied.top, target.top) && self._isEqual(occupied.height, target.height); - } - return false; - } - }, - - //获取某区域直接相关联的区域 - _getDirectRelativeRegions: function (name, direction) { - var self = this; - direction || (direction = ["top", "bottom", "left", "right"]); - var result = []; - var target = this.regions[name]; - var tops = this.locations[name].top; - var bottoms = this.locations[name].bottom; - var lefts = this.locations[name].left; - var rights = this.locations[name].right; - var finded = direction.contains("top") && BI.some(tops, function (i, region) { - if (self._isEqual(region.top + region.height, target.top) - && ((self._isMoreThanEqual(region.left, target.left) && self._isLessThan(region.left, target.left + target.width)) - || (self._isMoreThan(region.left + region.width, target.left) && self._isLessThanEqual(region.left + region.width, target.left + target.width)) - || (self._isLessThan(region.left, target.left) && self._isMoreThan(region.left + region.width, target.left + target.width)))) { - var clone = BI.clone(region); - clone.height = region.height + target.height; - result.push(clone); - } - }); - if (!finded) { - finded = direction.contains("bottom") && BI.some(bottoms, function (i, region) { - if (self._isEqual(target.top + target.height, region.top) - && ((self._isMoreThanEqual(region.left, target.left) && self._isLessThan(region.left, target.left + target.width)) - || (self._isMoreThan(region.left + region.width, target.left) && self._isLessThanEqual(region.left + region.width, target.left + target.width)) - || (self._isLessThan(region.left, target.left) && self._isMoreThan(region.left + region.width, target.left + target.width)))) { - var clone = BI.clone(region); - clone.top = region.top - target.height; - clone.height = region.height + target.height; - result.push(clone); - } - }); - if (!finded) { - finded = direction.contains("left") && BI.some(lefts, function (i, region) { - if (self._isEqual(region.left + region.width, target.left) - && ((self._isMoreThanEqual(region.top, target.top) && self._isLessThan(region.top, target.top + target.height)) - || (self._isMoreThan(region.top + region.height, target.top) && self._isLessThanEqual(region.top + region.height, target.top + target.height)) - || (self._isLessThan(region.top, target.top) && self._isMoreThan(region.top + region.height, target.top + target.height)))) { - var clone = BI.clone(region); - clone.width = region.width + target.width; - result.push(clone); - } - }); - if (!finded) { - finded = direction.contains("right") && BI.some(rights, function (i, region) { - if (self._isEqual(target.left + target.width, region.left) - && ((self._isMoreThanEqual(region.top, target.top) && self._isLessThan(region.top, target.top + target.height)) - || (self._isMoreThan(region.top + region.height, target.top) && self._isLessThanEqual(region.top + region.height, target.top + target.height)) - || (self._isLessThan(region.top, target.top) && self._isMoreThan(region.top + region.height, target.top + target.height)))) { - var clone = BI.clone(region); - clone.left = region.left - target.width; - clone.width = region.width + target.width; - result.push(clone); - } - }); - } - } - } - return result; - }, - - //获取间接相关联的区域,即调整name区域后需要附带调整的所有相关区域(包括自身) - _getInDirectRelativeRegions: function (name, direction) { - var self = this, dict = ["top", "left", "right", "bottom"]; - var result = {}; - direction || (direction = dict); - function recursion(regions, dir, store, cache) { - BI.each(regions, function (i, region) { - if (cache[region.id]) { - return; - } - cache[region.id] = true; - if (!store[dict[3 - dir]]) { - store[dict[3 - dir]] = []; - } - store[dict[3 - dir]].push(region); - recursion(self._getDirectRelativeRegions(region.id, [dict[dir]]), 3 - dir, store, cache); - }) - } - - if (direction.contains("top")) { - var store = {}, cache = {}; - recursion([this.regions[name]], dict.indexOf("top"), store, cache); - store["top"] = BI.sortBy(store["top"], "left"); - store["bottom"] = BI.sortBy(store["bottom"], "left"); - result["top"] = store; - } - if (direction.contains("bottom")) { - var store = {}, cache = {}; - recursion([this.regions[name]], dict.indexOf("bottom"), store, cache); - store["top"] = BI.sortBy(store["top"], "left"); - store["bottom"] = BI.sortBy(store["bottom"], "left"); - result["bottom"] = store; - } - if (direction.contains("left")) { - var store = {}, cache = {}; - recursion([this.regions[name]], dict.indexOf("left"), store, cache); - store["left"] = BI.sortBy(store["left"], "top"); - store["right"] = BI.sortBy(store["right"], "top"); - result["left"] = store; - } - if (direction.contains("right")) { - var store = {}, cache = {}; - recursion([this.regions[name]], dict.indexOf("right"), store, cache); - store["left"] = BI.sortBy(store["left"], "top"); - store["right"] = BI.sortBy(store["right"], "top"); - result["right"] = store; - } - return result; - }, - - _getLeftAlignRegions: function (name) { - var self = this; - var tops = this._getDirectRelativeRegions(name, ["top"]); - var bottoms = this._getDirectRelativeRegions(name, ["bottom"]); - var current = this.regions[name]; - var rtop = [], rbottom = []; - BI.each(tops, function (i, region) { - if (self._isEqual(region.left, current.left)) { - rtop.push(region); - } - }); - BI.each(bottoms, function (i, region) { - if (self._isEqual(region.left, current.left)) { - rbottom.push(region); - } - }); - return { - top: rtop, - bottom: rbottom - } - }, - - _getRightAlignRegions: function (name) { - var self = this; - var tops = this._getDirectRelativeRegions(name, ["top"]); - var bottoms = this._getDirectRelativeRegions(name, ["bottom"]); - var current = this.regions[name]; - var rtop = [], rbottom = []; - BI.each(tops, function (i, region) { - if (self._isEqual(region.left + region.width, current.left + current.width)) { - rtop.push(region); - } - }); - BI.each(bottoms, function (i, region) { - if (self._isEqual(region.left + region.width, current.left + current.width)) { - rbottom.push(region); - } - }); - return { - top: rtop, - bottom: rbottom - } - }, - - _getTopAlignRegions: function (name) { - var self = this; - var lefts = this._getDirectRelativeRegions(name, ["left"]); - var rights = this._getDirectRelativeRegions(name, ["right"]); - var current = this.regions[name]; - var rleft = [], rright = []; - BI.each(lefts, function (i, region) { - if (self._isEqual(region.top, current.top)) { - rleft.push(region); - } - }); - BI.each(rights, function (i, region) { - if (self._isEqual(region.top, current.top)) { - rright.push(region); - } - }); - return { - left: rleft, - right: rright - } - }, - - _getBottomAlignRegions: function (name) { - var self = this; - var lefts = this._getDirectRelativeRegions(name, ["left"]); - var rights = this._getDirectRelativeRegions(name, ["right"]); - var current = this.regions[name]; - var rleft = [], rright = []; - BI.each(lefts, function (i, region) { - if (self._isEqual(region.top + region.height, current.top + current.height)) { - rleft.push(region); - } - }); - BI.each(rights, function (i, region) { - if (self._isEqual(region.top + region.height, current.top + current.height)) { - rright.push(region); - } - }); - return { - left: rleft, - right: rright - } - }, - - //获取占有的最大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 + 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 } }, @@ -1600,17 +980,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { //布局是否是优良的 _isArrangeFine: function (regions) { switch (this.options.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - if (this._isRegionOverlay()) { - return false; - } - var maxRegion = this._getRegionOccupied(regions); - var area = maxRegion.width * maxRegion.height; - var all = 0; - BI.each(regions || this.regions, function (id, region) { - all += region.width * region.height; - }); - return Math.abs(area - all) < 8; case BI.Arrangement.LAYOUT_TYPE.FREE: return true; case BI.Arrangement.LAYOUT_TYPE.GRID: @@ -1638,1018 +1007,39 @@ BI.Arrangement = BI.inherit(BI.Widget, { 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; - } - }) - }, - - //对区域进行划分 - _splitRegions: function (name) { - var result = []; - var tid = BI.UUID(); - var _left = this._getLeftAlignRegions(name); - var _right = this._getRightAlignRegions(name); - var _top = this._getTopAlignRegions(name); - var _bottom = this._getBottomAlignRegions(name); - if (_left.top.length > 0) { - var upid = _left.top[0].id; - var tid = BI.UUID(); - var clone = this._cloneRegion(); - var _cur = clone[name]; - var split = Math.min(clone[name].width, clone[upid].width) / 2;//两个组件中较小宽度的一半 - var left = (clone[name].left + clone[upid].left) / 2;//求平均，减少误差 - var insert = clone[tid] = {//新增的区域 - left: left, - top: clone[upid].top, - width: split, - height: clone[name].height + clone[upid].height - }; - BI.extend(clone[name], { - left: left + split, - width: clone[name].width - split - (left - clone[name].left) - }); - BI.extend(clone[upid], { - left: left + split, - width: clone[upid].width - split - (left - clone[upid].left) - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "left-top", - regions: clone, - insert: insert - }); - } - } - if (_left.bottom.length > 0) { - var bottomid = _left.bottom[0].id; - var tid = BI.UUID(); - var clone = this._cloneRegion(); - var _cur = clone[name]; - var split = Math.min(clone[name].width, clone[bottomid].width) / 2; - var left = (clone[name].left + clone[bottomid].left) / 2; - var insert = clone[tid] = {//新增的区域 - left: left, - top: clone[name].top, - width: split, - height: clone[name].height + clone[bottomid].height - }; - BI.extend(clone[name], { - left: left + split, - width: clone[name].width - split - (left - clone[name].left) - }); - BI.extend(clone[bottomid], { - left: left + split, - width: clone[bottomid].width - split - (left - clone[bottomid].left) - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "bottom-left", - regions: clone, - insert: insert - }); - } - } - if (_right.top.length > 0) { - var upid = _right.top[0].id; - var tid = BI.UUID(); - var clone = this._cloneRegion(); - var _cur = clone[name]; - var split = Math.min(clone[name].width, clone[upid].width) / 2;//两个组件中较小宽度的一半 - var right = (clone[name].left + clone[name].width + clone[upid].left + clone[upid].width) / 2;//求平均，减少误差 - var insert = clone[tid] = {//新增的区域 - left: right - split, - top: clone[upid].top, - width: split, - height: clone[name].height + clone[upid].height - }; - BI.extend(clone[name], { - width: right - clone[name].left - split - }); - BI.extend(clone[upid], { - width: right - clone[upid].left - split - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "top-right", - regions: clone, - insert: insert - }); - } - } - if (_right.bottom.length > 0) { - var bottomid = _right.bottom[0].id; - var tid = BI.UUID(); - var clone = this._cloneRegion(); - var _cur = clone[name]; - var split = Math.min(clone[name].width, clone[bottomid].width) / 2;//两个组件中较小宽度的一半 - var right = (clone[name].left + clone[name].width + clone[bottomid].left + clone[bottomid].width) / 2;//求平均，减少误差 - var insert = clone[tid] = {//新增的区域 - left: right - split, - top: clone[name].top, - width: split, - height: clone[name].height + clone[bottomid].height - }; - BI.extend(clone[name], { - width: right - clone[name].left - split - }); - BI.extend(clone[bottomid], { - width: right - clone[bottomid].left - split - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "bottom-right", - regions: clone, - insert: insert - }); - } - } - if (_top.left.length > 0) { - var leftid = _top.left[0].id; - var tid = BI.UUID(); - var clone = this._cloneRegion(); - var _cur = clone[name]; - var split = Math.min(clone[name].height, clone[leftid].height) / 2;//两个组件中较小高度的一半 - var top = (clone[name].top + clone[leftid].top) / 2;//求平均，减少误差 - var insert = clone[tid] = {//新增的区域 - top: top, - left: clone[leftid].left, - height: split, - width: clone[name].width + clone[leftid].width - }; - BI.extend(clone[name], { - top: top + split, - height: clone[name].height - split - (top - clone[name].top) - }); - BI.extend(clone[leftid], { - top: top + split, - height: clone[leftid].height - split - (top - clone[leftid].top) - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "top-left", - regions: clone, - insert: insert - }); - } - } - if (_top.right.length > 0) { - var rightid = _top.right[0].id; - var tid = BI.UUID(); - var clone = this._cloneRegion(); - var _cur = clone[name]; - var split = Math.min(clone[name].height, clone[rightid].height) / 2;//两个组件中较小高度的一半 - var top = (clone[name].top + clone[rightid].top) / 2;//求平均，减少误差 - var insert = clone[tid] = {//新增的区域 - top: top, - left: clone[name].left, - height: split, - width: clone[name].width + clone[rightid].width - }; - BI.extend(clone[name], { - top: top + split, - height: clone[name].height - split - (top - clone[name].top) - }); - BI.extend(clone[rightid], { - top: top + split, - height: clone[rightid].height - split - (top - clone[rightid].top) - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "top-right-second", - regions: clone, - insert: insert - }); - } - } - if (_bottom.left.length > 0) { - var leftid = _bottom.left[0].id; - var tid = BI.UUID(); - var clone = this._cloneRegion(); - var _cur = clone[name]; - var split = Math.min(clone[name].height, clone[leftid].height) / 2;//两个组件中较小高度的一半 - var bottom = (clone[name].top + clone[name].height + clone[leftid].top + clone[leftid].height) / 2;//求平均，减少误差 - var insert = clone[tid] = {//新增的区域 - left: clone[leftid].left, - top: bottom - split, - height: split, - width: clone[name].width + clone[leftid].width - }; - BI.extend(clone[name], { - height: bottom - clone[name].top - split - }); - BI.extend(clone[leftid], { - height: bottom - clone[leftid].top - split - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "bottom-left-second", - regions: clone, - insert: insert - }); - } - } - if (_bottom.right.length > 0) { - var rightid = _bottom.right[0].id; - var tid = BI.UUID(); - var clone = this._cloneRegion(); - var _cur = clone[name]; - var split = Math.min(clone[name].height, clone[rightid].height) / 2;//两个组件中较小高度的一半 - var bottom = (clone[name].top + clone[name].height + clone[rightid].top + clone[rightid].height) / 2;//求平均，减少误差 - var insert = clone[tid] = {//新增的区域 - left: clone[name].left, - top: bottom - split, - height: split, - width: clone[name].width + clone[rightid].width - }; - BI.extend(clone[name], { - height: bottom - clone[name].top - split - }); - BI.extend(clone[rightid], { - height: bottom - clone[rightid].top - split - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "bottom-right-second", - regions: clone, - insert: insert - }); - } - } - //有上方居中drop - var lefts = _top.left, rights = _top.right; - if (lefts.length > 0 && rights.length > 0) { - var count = 0; - var store = [this.regions[name]]; - while (lefts.length > 0 || rights.length > 0) { - var clone = this._cloneRegion(); - if (lefts.length > 0) { - store.push(this.regions[lefts[0].id]); - } - if (rights.length > 0) { - store.push(this.regions[rights[0].id]); - } - count++; - var top = BI.average(store, function (i, r) {//求平均，减少误差 - return r.top; - }); - var occupied = this._getRegionOccupied(store); - - var split = BI.min(store, function (i, r) { - return r.height; - }).height / 2; - var insert = clone[tid] = { - left: occupied.left, - width: occupied.width, - top: top, - height: split - }; - BI.each(store, function (i, region) { - BI.extend(clone[region.id], { - top: top + split, - height: region.height - split - (top - region.top) - }); - }); - if (this._test(store)) { - delete clone[tid]; - result.push({ - type: "top-center" + count, - regions: clone, - insert: insert - }); - } else { - break; - } - - if (lefts.length > 0) { - lefts = this._getTopAlignRegions(lefts[0].id).left; - } - if (rights.length > 0) { - rights = this._getTopAlignRegions(rights[0].id).right; - } - } - } - //有下方居中drop - var lefts = _bottom.left, rights = _bottom.right; - if (lefts.length > 0 && rights.length > 0) { - var count = 0; - var store = [this.regions[name]]; - while (lefts.length > 0 || rights.length > 0) { - var clone = this._cloneRegion(); - if (lefts.length > 0) { - store.push(this.regions[lefts[0].id]); - } - if (rights.length > 0) { - store.push(this.regions[rights[0].id]); - } - count++; - var bottom = BI.average(store, function (i, r) {//求平均，减少误差 - return r.top + r.height; - }); - var occupied = this._getRegionOccupied(store); - - var split = BI.min(store, function (i, r) { - return r.height; - }).height / 2; - var insert = clone[tid] = { - left: occupied.left, - width: occupied.width, - top: bottom - split, - height: split - }; - BI.each(store, function (i, region) { - BI.extend(clone[region.id], { - height: bottom - region.top - split - }); - }); - if (this._test(store)) { - delete clone[tid]; - result.push({ - type: "bottom-center" + count, - regions: clone, - insert: insert - }); - } else { - break; - } - - if (lefts.length > 0) { - lefts = this._getBottomAlignRegions(lefts[0].id).left; - } - if (rights.length > 0) { - rights = this._getBottomAlignRegions(rights[0].id).right; - } - } - } - //有左方居中drop - var tops = _left.top, bottoms = _left.bottom; - if (tops.length > 0 && bottoms.length > 0) { - var count = 0; - var store = [this.regions[name]]; - while (tops.length > 0 || bottoms.length > 0) { - var clone = this._cloneRegion(); - if (tops.length > 0) { - store.push(this.regions[tops[0].id]); - } - if (bottoms.length > 0) { - store.push(this.regions[bottoms[0].id]); - } - count++; - var left = BI.average(store, function (i, r) {//求平均，减少误差 - return r.left; - }); - var occupied = this._getRegionOccupied(store); - - var split = BI.min(store, function (i, r) { - return r.width; - }).width / 2; - var insert = clone[tid] = { - left: left, - width: split, - top: occupied.top, - height: occupied.height - }; - BI.each(store, function (i, region) { - BI.extend(clone[region.id], { - left: left + split, - width: region.width - split - (left - region.left) - }); - }); - if (this._test(store)) { - delete clone[tid]; - result.push({ - type: "left-center" + count, - regions: clone, - insert: insert - }); - } else { - break; - } - - if (tops.length > 0) { - tops = this._getLeftAlignRegions(tops[0].id).top; - } - if (bottoms.length > 0) { - bottoms = this._getLeftAlignRegions(bottoms[0].id).bottom; - } - } - } - //有右方居中drop - var tops = _right.top, bottoms = _right.bottom; - if (tops.length > 0 && bottoms.length > 0) { - var count = 0; - var store = [this.regions[name]]; - while (tops.length > 0 || bottoms.length > 0) { - var clone = this._cloneRegion(); - if (tops.length > 0) { - store.push(this.regions[tops[0].id]); - } - if (bottoms.length > 0) { - store.push(this.regions[bottoms[0].id]); - } - count++; - var right = BI.average(store, function (i, r) {//求平均，减少误差 - return r.left + r.width; - }); - var occupied = this._getRegionOccupied(store); - - var split = BI.min(store, function (i, r) { - return r.width; - }).width / 2; - var insert = clone[tid] = { - left: right - split, - width: split, - top: occupied.top, - height: occupied.height - }; - BI.each(store, function (i, region) { - BI.extend(clone[region.id], { - width: right - region.left - split - }); - }); - if (this._test(store)) { - delete clone[tid]; - result.push({ - type: "right-center" + count, - regions: clone, - insert: insert - }); - } else { - break; - } - - if (tops.length > 0) { - tops = this._getRightAlignRegions(tops[0].id).top; - } - if (bottoms.length > 0) { - bottoms = this._getRightAlignRegions(bottoms[0].id).bottom; - } - } - } - var lefts = this._getEquivalentRelativeRegions(name, ["left"]); - if (lefts.length === 1) { - var clone = this._cloneRegion(); - var _cur = clone[name]; - var left = this.regions[lefts[0].id]; - var width = left.width; - var all = left.width + _cur.width; - var ratio = width / all; - var split = all / 3; - var lleft = width - split * ratio, rleft = _cur.width - split * (1 - ratio); - var insert = false; - if (lleft <= 21) { - rleft = _cur.width - split; - if (rleft <= 21) { - - } else { - insert = clone[tid] = { - top: _cur.top, - height: _cur.height, - left: _cur.left, - width: split, - }; - BI.extend(clone[name], { - top: _cur.top, - height: _cur.height, - left: _cur.left + split, - width: _cur.width - split - }); - } - } else if (rleft <= 21) { - lleft = width - split; - if (lleft <= 21) { - } else { - insert = clone[tid] = { - top: _cur.top, - height: _cur.height, - left: _cur.left - split, - width: split, - }; - BI.extend(clone[left.id], { - top: left.top, - height: left.height, - left: left.left, - width: left.width - split - }); - } - } else { - insert = clone[tid] = { - top: _cur.top, - height: _cur.height, - left: left.left + lleft, - width: split, - }; - BI.extend(clone[name], { - top: _cur.top, - height: _cur.height, - left: _cur.left + _cur.width - rleft, - width: rleft - }); - BI.extend(clone[left.id], { - top: left.top, - height: left.height, - left: left.left, - width: lleft - }); - } - if (insert !== false) { - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "left-line", - regions: clone, - insert: insert - }) - } - } - } - var rights = this._getEquivalentRelativeRegions(name, ["right"]); - if (rights.length === 1) { - var clone = this._cloneRegion(); - var _cur = clone[name]; - var right = this.regions[rights[0].id]; - var width = right.width; - var all = right.width + _cur.width; - var ratio = width / all; - var split = all / 3; - var lleft = _cur.width - split * (1 - ratio), rleft = width - split * ratio; - var insert = false; - if (lleft <= 21) { - rleft = width - split; - if (rleft <= 21) { - } else { - insert = clone[tid] = { - top: right.top, - height: right.height, - left: right.left, - width: split - }; - BI.extend(clone[right.id], { - top: right.top, - height: right.height, - left: right.left + split, - width: right.width - split - }) - } - } else if (rleft <= 21) { - lleft = _cur.width - split; - if (lleft <= 21) { - } else { - insert = clone[tid] = { - top: _cur.top, - height: _cur.height, - left: _cur.left + lleft, - width: split - }; - BI.extend(clone[name], { - top: _cur.top, - height: _cur.height, - left: _cur.left, - width: _cur.width - split - }) - } - } else { - insert = clone[tid] = { - top: _cur.top, - height: _cur.height, - left: _cur.left + lleft, - width: split - }; - BI.extend(clone[name], { - top: _cur.top, - height: _cur.height, - left: _cur.left, - width: lleft - }); - BI.extend(clone[right.id], { - top: right.top, - height: right.height, - left: right.left + right.width - rleft, - width: rleft - }); - } - if (insert !== false) { - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "right-line", - regions: clone, - insert: insert - }) - } - } - } - var tops = this._getEquivalentRelativeRegions(name, ["top"]); - if (tops.length === 1) { - var clone = this._cloneRegion(); - var _cur = clone[name]; - var top = this.regions[tops[0].id]; - var height = top.height; - var all = top.height + _cur.height; - var ratio = height / all; - var split = all / 3; - var tleft = height - split * ratio, bleft = _cur.height - split * (1 - ratio); - var insert = false; - if (tleft <= 21) { - bleft = _cur.height - split; - if (bleft <= 21) { - } else { - insert = clone[tid] = { - top: _cur.top, - width: _cur.width, - left: _cur.left, - height: split - }; - BI.extend(clone[name], { - top: _cur.top + split, - height: _cur.height - split, - left: _cur.left, - width: _cur.width - }); - } - } - if (bleft <= 21) { - tleft = height - split; - if (tleft <= 21) { - } else { - insert = clone[tid] = { - top: _cur.top - split, - height: split, - left: _cur.left, - width: _cur.width - }; - BI.extend(clone[top.id], { - top: top.top, - height: top.height - split, - left: top.left, - width: top.width - }); - } - } else { - insert = clone[tid] = { - top: top.top + tleft, - height: split, - left: _cur.left, - width: _cur.width - }; - BI.extend(clone[name], { - top: _cur.top + _cur.height - bleft, - height: bleft, - left: _cur.left, - width: _cur.width - }); - BI.extend(clone[top.id], { - top: top.top, - height: tleft, - left: top.left, - width: top.width - }); - } - if (insert !== false) { - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "top-line", - regions: clone, - insert: insert - }) - } - } - } - var bottoms = this._getEquivalentRelativeRegions(name, ["bottom"]); - if (bottoms.length === 1) { - var clone = this._cloneRegion(); - var _cur = clone[name]; - var bottom = this.regions[bottoms[0].id]; - var height = bottom.height; - var all = bottom.height + _cur.height; - var ratio = height / all; - var split = all / 3; - var tleft = _cur.height - split * (1 - ratio), bleft = height - split * ratio; - var insert = false; - if (tleft <= 21) { - bleft = height - split; - if (bleft <= 21) { - } else { - insert = clone[tid] = { - top: bottom.top, - height: bottom.height, - left: bottom.left, - width: split - }; - BI.extend(clone[bottom.id], { - top: bottom.top + split, - height: bottom.height - split, - left: bottom.left, - width: bottom.width - }); - } - } else if (bleft <= 21) { - tleft = _cur.height - split; - if (tleft <= 21) { - } else { - insert = clone[tid] = { - top: _cur.top + tleft, - height: split, - left: _cur.left, - width: _cur.width - }; - BI.extend(clone[name], { - top: _cur.top, - height: _cur.height - split, - left: _cur.left, - width: _cur.width - }); - } - } else { - insert = clone[tid] = { - top: _cur.top + tleft, - height: split, - left: _cur.left, - width: _cur.width, - }; - BI.extend(clone[name], { - top: _cur.top, - height: tleft, - left: _cur.left, - width: _cur.width - }); - BI.extend(clone[bottom.id], { - top: bottom.top + bottom.height - bleft, - height: bleft, - left: bottom.left, - width: bottom.width - }); - } - if (insert !== false) { - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "bottom-line", - regions: clone, - insert: insert - }) - } - } - } - if (tops.length >= 1) { - result.push({ - type: "top-gap" - }); - } - if (bottoms.length >= 1) { - result.push({ - type: "bottom-gap" - }); - } - //上 - var clone = this._cloneRegion(); - var _cur = clone[name]; - var insert = clone[tid] = { - top: _cur.top, - left: _cur.left, - width: _cur.width, - height: _cur.height / 2, - }; - BI.extend(clone[name], { - top: _cur.top + _cur.height / 2, - left: _cur.left, - width: _cur.width, - height: _cur.height / 2 - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "top", - regions: clone, - insert: insert - }) - } - //下 - var clone = this._cloneRegion(); - var _cur = clone[name]; - var insert = clone[tid] = { - top: _cur.top + _cur.height / 2, - left: _cur.left, - width: _cur.width, - height: _cur.height / 2 - }; - BI.extend(clone[name], { - top: _cur.top, - left: _cur.left, - width: _cur.width, - height: _cur.height / 2 - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "bottom", - regions: clone, - insert: insert - }) - } - //左 - var clone = this._cloneRegion(); - var _cur = clone[name]; - var insert = clone[tid] = { - top: _cur.top, - left: _cur.left, - width: _cur.width / 2, - height: _cur.height - }; - BI.extend(clone[name], { - top: _cur.top, - left: _cur.left + _cur.width / 2, - width: _cur.width / 2, - height: _cur.height - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "left", - regions: clone, - insert: insert - }) - } - //右 - var clone = this._cloneRegion(); - var _cur = clone[name]; - var insert = clone[tid] = { - top: _cur.top, - left: _cur.left + _cur.width / 2, - width: _cur.width / 2, - height: _cur.height - }; - BI.extend(clone[name], { - top: _cur.top, - left: _cur.left, - width: _cur.width / 2, - height: _cur.height - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "right", - regions: clone, - insert: insert - }) - } - return result; - }, - - _positionAt: function (position, bound) { - var left = position.left - bound.left, top = position.top - bound.top; - var right = bound.width - left, bottom = bound.height - top; - var halfW = bound.width / 2, halfH = bound.height / 2; - if (left < 0 || top < 0 || right < 0 || bottom < 0) { - return; - } - var devides = this._splitRegions(bound.id); - var types = []; - var result = {}; - var topcenterCount = 0, bottomcenterCount = 0, leftcenterCount = 0, rightcenterCount = 0; - BI.each(devides, function (i, devide) { - if (devide.type.indexOf("top-center") > -1) { - topcenterCount++; - } else if (devide.type.indexOf("bottom-center") > -1) { - bottomcenterCount++; - } else if (devide.type.indexOf("left-center") > -1) { - leftcenterCount++; - } else if (devide.type.indexOf("right-center") > -1) { - rightcenterCount++; - } - types.push(devide.type); - result[devide.type] = devide; - }); - //drop - if (top >= 5 && top <= 15 && left >= 5 && left <= 15 && types.contains("left-top")) { - return result["left-top"]; - } - if (top >= 5 && top <= 15 && right >= 5 && right <= 15 && types.contains("top-right")) { - return result["top-right"]; - } - if (bottom >= 5 && bottom <= 15 && left >= 5 && left <= 15 && types.contains("bottom-left")) { - return result["bottom-left"]; - } - if (bottom >= 5 && bottom <= 15 && right >= 5 && right <= 15 && types.contains("bottom-right")) { - return result["bottom-right"]; - } - - if (top >= 5 && top <= 15 && left >= 25 && left <= 35 && types.contains("top-left")) { - return result["top-left"]; - } - if (top >= 5 && top <= 15 && right >= 25 && right <= 35 && types.contains("top-right-second")) { - return result["top-right-second"]; - } - if (bottom >= 5 && bottom <= 15 && left >= 25 && left <= 35 && types.contains("bottom-left-second")) { - return result["bottom-left-second"]; - } - if (bottom >= 5 && bottom <= 15 && right >= 25 && right <= 35 && types.contains("bottom-right-second")) { - return result["bottom-right-second"]; - } - - //topcenter或bottomcenter - if (left >= halfW - 10 && left <= halfW + 10 && (topcenterCount > 0 || bottomcenterCount > 0)) { - for (var i = 1; i <= topcenterCount; i++) { - var s = (topcenterCount - i) * 20 + 5, e = s + 10; - if (top >= s && top <= e) { - return result["top-center" + i]; - } - } - for (var i = 1; i <= bottomcenterCount; i++) { - var s = (bottomcenterCount - i) * 20 + 5, e = s + 10; - if (bottom >= s && bottom <= e) { - return result["bottom-center" + i]; - } - } - } - //leftcenter或rightcenter - if (top >= halfH - 10 && top <= halfH + 10 && (leftcenterCount > 0 || rightcenterCount > 0)) { - for (var i = 1; i <= leftcenterCount; i++) { - var s = (leftcenterCount - i) * 20 + 5, e = s + 10; - if (left >= s && left <= e) { - return result["left-center" + i]; - } - } - for (var i = 1; i <= rightcenterCount; i++) { - var s = (rightcenterCount - i) * 20 + 5, e = s + 10; - if (right >= s && right <= e) { - return result["right-center" + i]; - } - } - } - - //缝隙 - if (top <= 8 && types.contains("top-gap")) { - return result["top-gap"]; - } - if (bottom <= 8 && types.contains("bottom-gap")) { - return result["bottom-gap"]; - } - - //三分 - if (top <= 15 && left >= 15 && right >= 15 && types.contains("top-line")) { - return result["top-line"]; - } - if (left <= 15 && top >= 15 && bottom >= 15 && types.contains("left-line")) { - return result["left-line"]; - } - if (right <= 15 && top >= 15 && bottom >= 15 && types.contains("right-line")) { - return result["right-line"]; - } - if (bottom <= 15 && left >= 15 && right >= 15 && types.contains("bottom-line")) { - return result["bottom-line"]; + }); + } else { + var result = {}; + BI.each(names, function (i, name) { + result[name] = regions[name]; + }); } + return result; + }, - //平分 - if (top <= 1 / 4 * bound.height && types.contains("top")) { - return result["top"]; - } - if (top >= 3 / 4 * bound.height && types.contains("bottom")) { - return result["bottom"]; - } - if (left <= bound.width / 2 && types.contains("left")) { - return result["left"]; - } - return result["right"]; + _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 { @@ -2672,215 +1062,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { } }, - _createOneDrop: function (region) { - if (this.storeDrops[region.id]) { - var drop = this.storeDrops[region.id].el; - drop.setVisible(true); - } else { - var drop = BI.createWidget({ - type: "bi.layout", - cls: "arrangement-drop-region", - widgetName: region.id - }); - } - return { - id: region.id, - left: region.left, - top: region.top, - width: region.width, - height: region.height, - el: drop - } - }, - - _calculateDrops: function () { - var self = this; - BI.each(this.drops, function (id, drop) { - drop.el.empty(); - var devides = self._splitRegions(id); - var topcenterCount = 0, bottomcenterCount = 0, leftcenterCount = 0, rightcenterCount = 0; - var absolutes = []; - var horizontals = []; - var verticals = []; - BI.each(devides, function (i, devide) { - if (devide.type.indexOf("top-center") > -1) { - topcenterCount++; - } else if (devide.type.indexOf("bottom-center") > -1) { - bottomcenterCount++; - } else if (devide.type.indexOf("left-center") > -1) { - leftcenterCount++; - } else if (devide.type.indexOf("right-center") > -1) { - rightcenterCount++; - } - }); - BI.each(devides, function (i, devide) { - switch (devide.type) { - case "left-top": - absolutes.push({ - el: { - type: "bi.layout", - width: 10, - height: 10, - cls: "drop-devider" - }, - left: 5, - top: 5 - }); - break; - case "top-right": - absolutes.push({ - el: { - type: "bi.layout", - width: 10, - height: 10, - cls: "drop-devider" - }, - right: 5, - top: 5 - }); - break; - case "bottom-left": - absolutes.push({ - el: { - type: "bi.layout", - width: 10, - height: 10, - cls: "drop-devider" - }, - left: 5, - bottom: 5 - }); - break; - case "bottom-right": - absolutes.push({ - el: { - type: "bi.layout", - width: 10, - height: 10, - cls: "drop-devider" - }, - right: 5, - bottom: 5 - }); - break; - case "top-left": - absolutes.push({ - el: { - type: "bi.layout", - width: 10, - height: 10, - cls: "drop-devider" - }, - left: 25, - top: 5 - }); - break; - case "top-right-second": - absolutes.push({ - el: { - type: "bi.layout", - width: 10, - height: 10, - cls: "drop-devider" - }, - right: 25, - top: 5 - }); - break; - case "bottom-left-second": - absolutes.push({ - el: { - type: "bi.layout", - width: 10, - height: 10, - cls: "drop-devider" - }, - left: 25, - bottom: 5 - }); - break; - case "bottom-right-second": - absolutes.push({ - el: { - type: "bi.layout", - width: 10, - height: 10, - cls: "drop-devider" - }, - right: 25, - bottom: 5 - }); - break; - default: - if (devide.type.indexOf("top-center") > -1) { - var num = devide.type.split("top-center")[1]; - horizontals.push({ - el: { - type: "bi.layout", - width: 20, - height: 10, - cls: "drop-devider" - }, - tgap: 20 * (topcenterCount - BI.parseInt(num)) + 5 - }) - } else if (devide.type.indexOf("bottom-center") > -1) { - var num = devide.type.split("bottom-center")[1]; - horizontals.push({ - el: { - type: "bi.layout", - width: 20, - height: 10, - cls: "drop-devider" - }, - bgap: 20 * (bottomcenterCount - BI.parseInt(num)) + 5 - }) - } else if (devide.type.indexOf("left-center") > -1) { - var num = devide.type.split("left-center")[1]; - verticals.push({ - el: { - type: "bi.layout", - width: 10, - height: 20, - cls: "drop-devider" - }, - lgap: 20 * (leftcenterCount - BI.parseInt(num)) + 5 - }) - } else if (devide.type.indexOf("right-center") > -1) { - var num = devide.type.split("right-center")[1]; - verticals.push({ - el: { - type: "bi.layout", - width: 10, - height: 20, - cls: "drop-devider" - }, - rgap: 20 * (rightcenterCount - BI.parseInt(num)) + 5 - }) - } - break; - } - - }); - BI.createWidget({ - type: "bi.absolute", - element: drop.el, - items: absolutes - }); - - BI.createWidget({ - type: "bi.absolute_horizontal_adapt", - element: drop.el, - items: horizontals - }); - - BI.createWidget({ - type: "bi.absolute_vertical_adapt", - element: drop.el, - items: verticals - }); - }); - }, - _applyRegion: function (regions) { var self = this, o = this.options; BI.each(regions || this.regions, function (i, region) { @@ -2890,21 +1071,8 @@ BI.Arrangement = BI.inherit(BI.Widget, { width: region.width, height: region.height }); - self.drops[region.id].left = region.left; - self.drops[region.id].top = region.top; - self.drops[region.id].width = region.width; - self.drops[region.id].height = region.height; - }); - BI.each(this.drops, function (i, region) { - region.el.element.css({ - left: region.left, - top: region.top, - width: region.width, - height: region.height - }); }); this._applyContainer(); - this._calculateDrops(); this.ratio = this.getLayoutRatio(); }, @@ -2915,11 +1083,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { element: this.container, items: BI.toArray(this.regions) }); - BI.createWidget({ - type: "bi.absolute", - element: this.droppable, - items: BI.toArray(this.drops) - }); }, getClientWidth: function () { @@ -2930,6 +1093,14 @@ BI.Arrangement = BI.inherit(BI.Widget, { 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"); @@ -2948,41 +1119,21 @@ BI.Arrangement = BI.inherit(BI.Widget, { region.height = regions[id].height; } }); - BI.each(this.drops, 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; - var drop = this._createOneDrop(region); - this.drops[drop.id] = drop; - this.storeDrops[drop.id] = drop; - this._locationRegion(); BI.createWidget({ type: "bi.absolute", element: this.container, items: [region] }); - BI.createWidget({ - type: "bi.absolute", - element: this.droppable, - items: [drop] - }) }, _deleteRegionByName: function (name) { this.regions[name].el.setVisible(false); - this.drops[name].el.setVisible(false); delete this.regions[name]; - delete this.drops[name]; - this._locationRegion(); }, _setArrangeSize: function (size) { @@ -3009,15 +1160,15 @@ BI.Arrangement = BI.inherit(BI.Widget, { 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 (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; } @@ -3264,46 +1415,24 @@ BI.Arrangement = BI.inherit(BI.Widget, { return helper; }, - _start: function (cur) { + _start: function () { this.arrangement.setVisible(true); - this.droppable.setVisible(true); if (this.options.layoutType === BI.Arrangement.LAYOUT_TYPE.GRID) { this.block.setVisible(true); } - BI.each(this.drops, function (i, drop) { - drop.el.setVisible(false); - }); - if (cur) { - if (this.drops[cur]) { - this.drops[cur].el.setVisible(true); - } - } }, _stop: function () { this.arrangement.setVisible(false); - this.droppable.setVisible(false); this.block.setVisible(false); }, - getDirectRelativeRegions: function (name, direction) { - direction || (direction = ["top", "bottom", "left", "right"]); - var self = this, result = {}; - BI.each(direction, function (i, dir) { - result[dir] = self._getDirectRelativeRegions(name, [dir]); - }); - return result; - }, - ////公有操作//// setLayoutType: function (type) { var self = this, o = this.options; if (type !== o.layoutType) { o.layoutType = type; switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - this.relayout(); - break; case BI.Arrangement.LAYOUT_TYPE.FREE: break; case BI.Arrangement.LAYOUT_TYPE.GRID: @@ -3366,18 +1495,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { } var self = this, o = this.options; switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - var clone = this._cloneRegion(); - var regions = this._getEquivalentRelativeRegions(name); - if (regions.length > 0) { - BI.each(regions, function (i, region) { - BI.extend(clone[region.id], region); - }); - this._modifyRegion(clone); - } - this._deleteRegionByName(name); - this._populate(this.getAllRegions()); - return true; case BI.Arrangement.LAYOUT_TYPE.FREE: this._deleteRegionByName(name); this._populate(this.getAllRegions()); @@ -3395,47 +1512,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { var self = this, o = this.options; var flag = false; switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - var current = this.regions[name]; - if (size.width !== current.width) { - var regions = this._getInDirectRelativeRegions(name, ["right"]).right; - var lefts = regions.left || [], rights = regions.right || []; - var offset = size.width - current.width; - var cloned = this._cloneRegion(); - BI.some(lefts, function (i, left) { - var region = cloned[left.id]; - region.width = region.width + offset; - }); - BI.some(rights, function (i, right) { - var region = cloned[right.id]; - region.width = region.width - offset; - region.left = region.left + offset; - }); - if (this._test(cloned) && this._isArrangeFine(cloned)) { - this._modifyRegion(cloned); - flag = true; - } - } - if (size.height !== current.height) { - var regions = this._getInDirectRelativeRegions(name, ["bottom"]).bottom; - var tops = regions.top || [], bottoms = regions.bottom || []; - var offset = size.height - current.height; - var cloned = this._cloneRegion(); - BI.some(tops, function (i, top) { - var region = cloned[top.id]; - region.height = region.height + offset; - }); - BI.some(bottoms, function (i, bottom) { - var region = cloned[bottom.id]; - region.height = region.height - offset; - region.top = region.top + offset; - }); - if (this._test(cloned) && this._isArrangeFine(cloned)) { - this._modifyRegion(cloned); - flag = true; - } - } - break; case BI.Arrangement.LAYOUT_TYPE.FREE: var clone = this._cloneRegion(); BI.extend(clone[name], { @@ -3462,7 +1538,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { } break; } - this._locationRegion(); this._applyRegion(); return flag; }, @@ -3472,8 +1547,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { var insert, regions = [], cur; if (position.left < 0 || position.top < 0) { switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - break; case BI.Arrangement.LAYOUT_TYPE.FREE: break; case BI.Arrangement.LAYOUT_TYPE.GRID: @@ -3490,54 +1563,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { top: position.top + offset.top }; switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - if (BI.isEmpty(this.regions)) { - if (self._isPositionInBounds(position, { - left: 0, - top: 0, - width: this.element[0].clientWidth, - height: this.element[0].clientHeight - })) { - insert = { - left: 0, - top: 0, - width: this.element[0].clientWidth, - height: this.element[0].clientHeight - }; - } - } else { - if (BI.some(this.regions, function (id, region) { - if (self._isPositionInBounds(position, region)) { - var at = self._positionAt(position, region); - if (!at) { - insert = null; - } else { - insert = at.insert; - regions = at.regions; - } - cur = id; - return true; - } - })) { - } - else { - insert = null; - regions = []; - } - } - if (insert == null) { - this._stop(); - self.position = null; - break; - } - - this.position = { - insert: insert, - regions: regions - }; - this._setArrangeSize(insert); - this._start(cur); - break; case BI.Arrangement.LAYOUT_TYPE.FREE: var insert = { top: position.top < 0 ? 0 : position.top, @@ -3587,8 +1612,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { top: position.top + offset.top }); switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - break; case BI.Arrangement.LAYOUT_TYPE.FREE: BI.extend(this.regions[name], { left: position.left < 0 ? 0 : position.left, @@ -3638,56 +1661,13 @@ BI.Arrangement = BI.inherit(BI.Widget, { } }, - setContainerSize: function (size) { - var self = this, o = this.options; - var occupied = this._getRegionOccupied(); - switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - if (this._isArrangeFine()) { - var width = size.width, height = size.height; - var regions = this._cloneRegion(); - BI.each(regions, function (i, region) { - region.width = region.width / occupied.width * width; - //region.height = region.height / occupied.height * height; - }); - BI.each(regions, function (id, region) { - var lefts = self.locations[id].left; - var tops = self.locations[id].top; - var bottoms = self.locations[id].bottom; - var maxRegion; - if (lefts.length > 0) { - var ids = self._getRegionNames(lefts); - var rs = self._getRegionsByNames(ids); - maxRegion = self._getRegionOccupied(rs); - region.left = maxRegion.left + maxRegion.width / occupied.width * width; - } else { - region.left = 0; - } - if (bottoms.length === 0) { - region.height = height - region.top; - } - //if (tops.length > 0) { - // var ids = self._getRegionNames(tops); - // var rs = self._getRegionsByNames(ids); - // maxRegion = self._getRegionOccupied(rs); - // region.top = maxRegion.top + maxRegion.height / occupied.height * height; - //} - //if (tops.length === 0) { - // region.top = 0; - //} - }); - if (this._test(regions)) { - this._modifyRegion(regions); - this._applyRegion(); - } - } - break; - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - break; + setDropPosition: function (position) { + var self = this; + this.arrangement.setVisible(true); + this._setArrangeSize(position); + return function () { + self.arrangement.setVisible(false); } - this.resize(); }, scrollTo: function (scroll) { @@ -3702,7 +1682,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { } var occupied = this._applyContainer(); switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: case BI.Arrangement.LAYOUT_TYPE.FREE: if (this._isArrangeFine()) { var width = this.getClientWidth(); @@ -3754,51 +1733,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { var self = this, o = this.options; var occupied = this._applyContainer(); switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - if (this._isArrangeFine()) { - var width = this.getClientWidth(), height = this.getClientHeight(); - var isHeightAdjust = height > occupied.height; - var regions = this._cloneRegion(); - BI.each(regions, function (i, region) { - region.width = region.width / occupied.width * width; - //if (isHeightAdjust) { - // region.height = region.height / occupied.height * height; - //} - }); - BI.each(regions, function (id, region) { - var lefts = self.locations[id].left; - var tops = self.locations[id].top; - var bottoms = self.locations[id].bottom; - var maxRegion; - if (lefts.length > 0) { - var ids = self._getRegionNames(lefts); - var rs = self._getRegionsByNames(ids); - maxRegion = self._getRegionOccupied(rs); - region.left = maxRegion.left + maxRegion.width / occupied.width * width; - } else { - region.left = 0; - } - if (tops.length === 0) { - region.top = 0; - } - if (isHeightAdjust && bottoms.length === 0) { - region.height = height - region.top; - } - //if (isHeightAdjust && tops.length > 0) { - // var ids = self._getRegionNames(tops); - // var rs = self._getRegionsByNames(ids); - // maxRegion = self._getRegionOccupied(rs); - // region.top = maxRegion.top + maxRegion.height / occupied.height * height; - //} - }); - if (this._test(regions)) { - this._modifyRegion(regions); - this._applyRegion(); - } - } else { - this.relayout(); - } - break; case BI.Arrangement.LAYOUT_TYPE.FREE: break; case BI.Arrangement.LAYOUT_TYPE.GRID: @@ -3815,15 +1749,15 @@ BI.Arrangement = BI.inherit(BI.Widget, { relayout: function () { var self = this, o = this.options; - if (o.isNeedReLayout === false) { - return; - } - //var occupied = this._applyContainer(); switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: + 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 clone = BI.toArray(this._cloneRegion()); + 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; @@ -3831,97 +1765,50 @@ BI.Arrangement = BI.inherit(BI.Widget, { return r1.top - r2.top; }); var count = clone.length; - var cols = 3, rows = Math.floor((count - 1) / 3 + 1); + 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 / 3), col = i % 3; + var row = Math.floor(i / 4), col = i % 4; BI.extend(region, { - top: row * 380, + top: row * perHeight * 6, left: col * w, width: w, - height: 380 + height: perHeight * 6 }); if (!store[row]) { store[row] = {}; } store[row][col] = region; }); - //非3的倍数 - if (count % 3 !== 0) { - var lasts = store[rows - 1]; - var perWidth = width / (count % 3); - BI.each(lasts, function (i, region) { - BI.extend(region, { - left: BI.parseInt(i) * perWidth, - width: perWidth - }); - }); - } + //非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); - this.resize(); } } else { this.resize(); } break; - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - 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 = 3, rows = Math.floor((count - 1) / 3 + 1); - var w = width / cols, h = height / rows; - var store = {}; - BI.each(clone, function (i, region) { - var row = Math.floor(i / 3), col = i % 3; - BI.extend(region, { - top: row * perHeight * 6, - left: col * w, - width: w, - height: perHeight * 6 - }); - if (!store[row]) { - store[row] = {}; - } - store[row][col] = region; - }); - //非3的倍数 - if (count % 3 !== 0) { - var lasts = store[rows - 1]; - var perWidth = width / (count % 3); - 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); - } - break; } }, _populate: function (items) { this._stop(); this._calculateRegions(items); - this._locationRegion(); this._applyRegion(); }, @@ -3929,9 +1816,7 @@ BI.Arrangement = BI.inherit(BI.Widget, { var self = this; BI.each(this.regions, function (name, region) { self.regions[name].el.setVisible(false); - self.drops[name].el.setVisible(false); delete self.regions[name]; - delete self.drops[name]; }); this._populate(items); this._renderRegion(); @@ -3942,9 +1827,8 @@ BI.extend(BI.Arrangement, { PORTION: 32, H_PORTION: 18, LAYOUT_TYPE: { - ADAPTIVE: 0, - FREE: 1, - GRID: 2 + GRID: 0, + FREE: 1 } }); BI.shortcut('bi.arrangement', BI.Arrangement);/** @@ -7184,9 +5068,7 @@ BI.InteractiveArrangement = BI.inherit(BI.Widget, { return BI.extend(BI.InteractiveArrangement.superclass._defaultConfig.apply(this, arguments), { baseCls: "bi-interactive-arrangement", resizable: true, - isNeedReLayout: true, - isNeedResizeContainer: true, - layoutType: BI.Arrangement.LAYOUT_TYPE.FREE, + layoutType: BI.Arrangement.LAYOUT_TYPE.GRID, items: [] }); }, @@ -7198,8 +5080,6 @@ BI.InteractiveArrangement = BI.inherit(BI.Widget, { type: "bi.adaptive_arrangement", element: this, resizable: o.resizable, - isNeedReLayout: o.isNeedReLayout, - isNeedResizeContainer: o.isNeedResizeContainer, layoutType: o.layoutType, items: o.items }); @@ -7611,7 +5491,6 @@ BI.InteractiveArrangement = BI.inherit(BI.Widget, { var self = this; this.stopDraw(); switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: case BI.Arrangement.LAYOUT_TYPE.FREE: var other = this._getRegionExcept(name); var left = this._leftAlign(position, size, other); @@ -7645,10 +5524,6 @@ BI.InteractiveArrangement = BI.inherit(BI.Widget, { } }, - getDirectRelativeRegions: function (name, direction) { - return this.arrangement.getDirectRelativeRegions(name, direction); - }, - addRegion: function (region, position) { this.stopDraw(); return this.arrangement.addRegion(region, position); @@ -7668,8 +5543,6 @@ BI.InteractiveArrangement = BI.inherit(BI.Widget, { this.stopDraw(); if (position.left > 0 && position.top > 0) { switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - break; case BI.Arrangement.LAYOUT_TYPE.FREE: position = this.getPosition(null, position, size); this.draw(position, size); @@ -7685,8 +5558,6 @@ BI.InteractiveArrangement = BI.inherit(BI.Widget, { setRegionPosition: function (name, position) { if (position.left > 0 && position.top > 0) { switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - break; case BI.Arrangement.LAYOUT_TYPE.FREE: position = this.getPosition(name, position); break; @@ -7697,6 +5568,18 @@ BI.InteractiveArrangement = BI.inherit(BI.Widget, { return this.arrangement.setRegionPosition(name, position); }, + setDropPosition: function (position) { + return this.arrangement.setDropPosition(position); + }, + + scrollInterval: function () { + this.arrangement.scrollInterval.apply(this.arrangement, arguments); + }, + + scrollEnd: function () { + this.arrangement.scrollEnd.apply(this.arrangement, arguments); + }, + scrollTo: function (scroll) { this.arrangement.scrollTo(scroll); }, diff --git a/demo/js/config/widget.js b/demo/js/config/widget.js index 003cadc12..49aaec038 100644 --- a/demo/js/config/widget.js +++ b/demo/js/config/widget.js @@ -41,4 +41,8 @@ Demo.WIDGET_CONFIG = [{ pId: 4, text: "bi.relation_view", value: "demo.relation_view" +}, { + pId: 4, + text: "bi.interactive_arrangement", + value: "demo.interactive_arrangement" }]; \ No newline at end of file diff --git a/demo/js/widget/demo.interactivearrangement.js b/demo/js/widget/demo.interactivearrangement.js new file mode 100644 index 000000000..8551daa72 --- /dev/null +++ b/demo/js/widget/demo.interactivearrangement.js @@ -0,0 +1,13 @@ +/** + * Created by User on 2017/3/22. + */ +Demo.RelationView = BI.inherit(BI.Widget, { + props: { + }, + render: function () { + return { + type: "bi.interactive_arrangement", + }; + } +}); +BI.shortcut("demo.interactive_arrangement", Demo.RelationView); \ No newline at end of file diff --git a/docs/demo.js b/docs/demo.js index abe7c4799..1a53657c6 100644 --- a/docs/demo.js +++ b/docs/demo.js @@ -3379,6 +3379,10 @@ Demo.COMPONENT_CONFIG = [{ pId: 4, text: "bi.relation_view", value: "demo.relation_view" +}, { + pId: 4, + text: "bi.interactive_arrangement", + value: "demo.interactive_arrangement" }];Demo.Func = BI.inherit(BI.Widget, { props: { baseCls: "demo-func" @@ -5945,6 +5949,18 @@ Demo.West.EVENT_VALUE_CHANGE = "EVENT_VALUE_CHANGE"; BI.shortcut("demo.west", Demo.West);/** * Created by User on 2017/3/22. */ +Demo.RelationView = BI.inherit(BI.Widget, { + props: { + }, + render: function () { + return { + type: "bi.interactive_arrangement", + }; + } +}); +BI.shortcut("demo.interactive_arrangement", Demo.RelationView);/** + * Created by User on 2017/3/22. + */ Demo.MultiSelectCombo = BI.inherit(BI.Widget, { props: { baseCls: "demo-multi-select-combo" diff --git a/docs/widget.js b/docs/widget.js index 5e6df6377..6086679f0 100644 --- a/docs/widget.js +++ b/docs/widget.js @@ -436,8 +436,6 @@ BI.AdaptiveArrangement = BI.inherit(BI.Widget, { return BI.extend(BI.AdaptiveArrangement.superclass._defaultConfig.apply(this, arguments), { baseCls: "bi-adaptive-arrangement", resizable: true, - isNeedReLayout: true, - isNeedResizeContainer: true, layoutType: BI.Arrangement.LAYOUT_TYPE.FREE, items: [] }); @@ -449,73 +447,18 @@ BI.AdaptiveArrangement = BI.inherit(BI.Widget, { this.arrangement = BI.createWidget({ type: "bi.arrangement", element: this, - isNeedReLayout: o.isNeedReLayout, layoutType: o.layoutType, items: o.items }); this.arrangement.on(BI.Arrangement.EVENT_SCROLL, function () { self.fireEvent(BI.AdaptiveArrangement.EVENT_SCROLL, arguments); }); - if (o.isNeedResizeContainer) { - - var isResizing = false; - var needEnd = false; - var height; - var interval; - var startSize; - var resize = function (e, ui) { - if (isResizing) { - return; - } - isResizing = true; - height = ui.size.height; - interval = setInterval(function () { - height += 40; - self.arrangement.setContainerSize({ - width: ui.size.width, - height: height - }); - self.arrangement.scrollTo({top: height}); - }, 300); - }; - this.arrangement.container.element.resizable({ - handles: "s", - minWidth: 100, - minHeight: 20, - helper: "bi-resizer", - autoHide: true, - start: function (e, ui) { - startSize = BI.clone(ui.size); - }, - resize: function (e, ui) { - if (ui.size.height >= startSize.height - 10) { - resize(e, ui); - } else { - interval && clearInterval(interval); - needEnd = true; - } - }, - stop: function (e, ui) { - var size = ui.size; - if (isResizing && !needEnd) { - size.height = height; - } - self.arrangement.setContainerSize(ui.size); - needEnd = false; - isResizing = false; - startSize = null; - interval && clearInterval(interval); - self.fireEvent(BI.AdaptiveArrangement.EVENT_RESIZE); - } - }); - this._setLayoutType(o.layoutType); - } this.zIndex = 0; BI.each(o.items, function (i, item) { self._initResizable(item.el); }); - this.element.click(function (e) { + this.element.mousedown(function (e) { BI.each(self.getAllRegions(), function (i, region) { if (!region.el.element.__isMouseInBounds__(e)) { region.el.element.removeClass("selected"); @@ -548,159 +491,65 @@ BI.AdaptiveArrangement = BI.inherit(BI.Widget, { item.element.mousedown(function () { self._setSelect(item) }); - o.resizable && item.element.resizable({ - handles: "e, s, se", - minWidth: 20, - minHeight: 20, - autoHide: true, - helper: "bi-resizer", - start: function () { - item.element.css("zIndex", ++self.zIndex); - self.fireEvent(BI.AdaptiveArrangement.EVENT_ELEMENT_START_RESIZE); - }, - resize: function (e, ui) { - // self._resize(item.attr("id"), ui.size); - self._resize(item.attr("id"), ui.size); - self.fireEvent(BI.AdaptiveArrangement.EVENT_ELEMENT_RESIZE, item.attr("id"), ui.size); - }, - stop: function (e, ui) { - self._stopResize(item.attr("id"), ui.size); - self.fireEvent(BI.AdaptiveArrangement.EVENT_ELEMENT_STOP_RESIZE, item.attr("id"), ui.size); - self.fireEvent(BI.AdaptiveArrangement.EVENT_RESIZE); - } - }); - }, - - _resize: function (name, size) { - var self = this; - switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - break; - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - this.setRegionSize(name, size); - break; - } - }, - - _stopResize: function (name, size) { - var self = this; - switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - this.setRegionSize(name, { - width: size.width, - height: size.height - }); - break; - case BI.Arrangement.LAYOUT_TYPE.FREE: - this.setRegionSize(name, size); - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - this.setRegionSize(name, size); - break; - } - }, - - //检查宽高是否规范 - _checkRegionSize: function (name, size) { - var self = this; - switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - var newSize = {}; - var leftid, rightid, topid, bottomid; - var region = this.getRegionByName(name); - var rs = this.arrangement._getInDirectRelativeRegions(name, ["right"]).right; - var bs = this.arrangement._getInDirectRelativeRegions(name, ["bottom"]).bottom; - if (rs.left.length > 0) { - topid = BI.first(rs.left).id; - bottomid = BI.last(rs.left).id; - } - if (bs.top.length > 0) { - leftid = BI.first(bs.top).id; - rightid = BI.last(bs.top).id; - } - if (this.arrangement._isEqual(region.width, size.width)) { - topid = name; - bottomid = name; - } - if (this.arrangement._isEqual(region.height, size.height)) { - leftid = name; - rightid = name; - } - var tops = topid ? this.getDirectRelativeRegions(topid, ["top"]).top : []; - var bottoms = bottomid ? this.getDirectRelativeRegions(bottomid, ["bottom"]).bottom : []; - var lefts = leftid ? this.getDirectRelativeRegions(leftid, ["left"]).left : []; - var rights = rightid ? this.getDirectRelativeRegions(rightid, ["right"]).right : []; - if (region.width !== size.width) { - if (rights.length === 0) {//最右边的组件不能调整宽度 - newSize.width = region.width; - } else { - var finded = BI.find(tops.concat(bottoms), function (i, r) { - r = self.getRegionByName(r.id); - return Math.abs(size.width + region.left - (r.left + r.width)) <= 3; - }); - if (finded) { - finded = this.getRegionByName(finded.id); - newSize.width = finded.left + finded.width - region.left; - } else { - newSize.width = size.width; - } - } - } else { - newSize.width = size.width; - } - if (region.height !== size.height) { - if (bottoms.length === 0) { - newSize.height = region.height; - } else { - var finded = BI.find(lefts.concat(rights), function (i, r) { - r = self.getRegionByName(r.id); - return Math.abs(size.height + region.top - (r.top + r.height)) <= 3; - }); - if (finded) { - finded = this.getRegionByName(finded.id); - newSize.height = finded.top + finded.height - region.top; - } else { - newSize.height = size.height; - } - } - } else { - newSize.height = size.height; - } - return newSize; - case BI.Arrangement.LAYOUT_TYPE.FREE: - return size; - case BI.Arrangement.LAYOUT_TYPE.GRID: - return size; - } - }, + // o.resizable && item.element.resizable({ + // handles: "e, s, se", + // minWidth: 20, + // minHeight: 20, + // autoHide: true, + // helper: "bi-resizer", + // start: function () { + // item.element.css("zIndex", ++self.zIndex); + // self.fireEvent(BI.AdaptiveArrangement.EVENT_ELEMENT_START_RESIZE); + // }, + // resize: function (e, ui) { + // // self._resize(item.attr("id"), ui.size); + // self._resize(item.attr("id"), e, ui.size, ui.position); + // }, + // stop: function (e, ui) { + // self._stopResize(item.attr("id"), ui.size); + // self.fireEvent(BI.AdaptiveArrangement.EVENT_ELEMENT_STOP_RESIZE, item.attr("id"), ui.size); + // self.fireEvent(BI.AdaptiveArrangement.EVENT_RESIZE); + // } + // }); + }, + + // _resize: function (name, e, size, position) { + // var self = this; + // this.scrollInterval(e, false, true, function (changedSize) { + // size.width += changedSize.offsetX; + // size.height += changedSize.offsetY; + // var containerWidth = self.arrangement.container.element.width(); + // var containerHeight = self.arrangement.container.element.height(); + // self.arrangement.container.element.width(containerWidth + changedSize.offsetX); + // self.arrangement.container.element.height(containerHeight + changedSize.offsetY); + // switch (self.getLayoutType()) { + // case BI.Arrangement.LAYOUT_TYPE.FREE: + // break; + // case BI.Arrangement.LAYOUT_TYPE.GRID: + // self.setRegionSize(name, size); + // break; + // } + // self.fireEvent(BI.AdaptiveArrangement.EVENT_ELEMENT_RESIZE, name, size); + // }); + // }, + // + // _stopResize: function (name, size) { + // var self = this; + // this.scrollEnd(); + // switch (this.getLayoutType()) { + // case BI.Arrangement.LAYOUT_TYPE.FREE: + // this.setRegionSize(name, size); + // break; + // case BI.Arrangement.LAYOUT_TYPE.GRID: + // this.setRegionSize(name, size); + // break; + // } + // }, _getScrollOffset: function () { return this.arrangement._getScrollOffset(); }, - _setLayoutType: function (type) { - try { - //BI.nextTick(function () { - switch (type) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - $(">.ui-resizable-s", this.arrangement.container.element).css("zIndex", ""); - break; - case BI.Arrangement.LAYOUT_TYPE.FREE: - $(">.ui-resizable-s", this.arrangement.container.element).css("zIndex", "-1"); - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - $(">.ui-resizable-s", this.arrangement.container.element).css("zIndex", "-1"); - break; - } - this.arrangement.container.element.resizable("option", "disabled", type === BI.Arrangement.LAYOUT_TYPE.FREE); - //}); - } catch (e) { - - } - }, - getClientWidth: function () { return this.arrangement.getClientWidth(); }, @@ -709,97 +558,13 @@ BI.AdaptiveArrangement = BI.inherit(BI.Widget, { return this.arrangement.getClientHeight(); }, - getDirectRelativeRegions: function (name, direction) { - return this.arrangement.getDirectRelativeRegions(name, direction); - }, - addRegion: function (region, position) { this._initResizable(region.el); this._setSelect(region.el); var self = this, flag; var old = this.arrangement.getAllRegions(); - if (BI.isNotNull(this.position)) { - switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - var type = this.position.type; - var current = this.position.region; - switch (type) { - case "top-gap": - var t = this.arrangement._getEquivalentRelativeRegions(current.id, ["top"])[0]; - current = this.getRegionByName(t.id); - break; - case "bottom-gap": - break; - } - var id = BI.UUID(); - var insert = this.position.insert; - if (insert.height > 0) { - var clone = this.arrangement._cloneRegion(); - //找到最下面的组件 - var occupied = this.arrangement._getRegionOccupied(); - var bottomRegions = []; - BI.each(clone, function (i, region) { - if (self.arrangement._isEqual(region.top + region.height, occupied.top + occupied.height)) { - bottomRegions.push(region); - } - }); - var bs = this.arrangement._getInDirectRelativeRegions(current.id, ["bottom"]).bottom; - var seen = [current.id]; - var bottoms = bs.bottom; - var occ = this.arrangement._getRegionOccupied(bottoms); - clone[id] = BI.extend({}, region, { - left: occ.left, - width: occ.width, - top: current.top + current.height, - height: insert.height - }); - while (bottoms.length > 0) { - BI.each(bottoms, function (i, bottom) { - seen.push(bottom.id); - var r = self.getRegionByName(bottom.id); - BI.extend(clone[bottom.id], { - top: r.top + insert.height - }); - }); - var t = []; - BI.each(bottoms, function (i, bottom) { - var n = self.arrangement._getInDirectRelativeRegions(bottom.id, ["bottom"]).bottom; - BI.each(n.top, function (i, region) { - if (!seen.contains(region.id)) { - seen.push(region.id); - var r = self.getRegionByName(region.id); - BI.extend(clone[region.id], { - height: r.height + insert.height - }); - } - }); - t = t.concat(n.bottom); - }); - t = BI.uniq(t, function (i, region) { - return region.id; - }); - bottoms = t; - } - BI.each(bottomRegions, function (i, region) { - if (!seen.contains(region.id)) { - region.height = region.height + insert.height; - } - }); - this.arrangement.populate(BI.toArray(clone)); - this.arrangement.resize(); - flag = true; - } - break; - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - break; - } - this.position = null; - } else { - if (flag = this.arrangement.addRegion(region, position)) { - this._old = old; - } + if (flag = this.arrangement.addRegion(region, position)) { + this._old = old; } return flag; }, @@ -813,13 +578,12 @@ BI.AdaptiveArrangement = BI.inherit(BI.Widget, { this._old = this.getAllRegions(); this.relayout(); } - return true; + return flag; }, setRegionSize: function (name, size) { var flag; var old = this.getAllRegions(); - size = this._checkRegionSize(name, size); if (flag = this.arrangement.setRegionSize(name, size)) { this._old = old; } @@ -828,55 +592,114 @@ BI.AdaptiveArrangement = BI.inherit(BI.Widget, { setPosition: function (position, size) { var self = this; - var at = this.arrangement.setPosition(position, size); - this.position = null; - if (!at) { - switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - if (position.left < 0 || position.top < 0) { - return null; + return this.arrangement.setPosition(position, size); + }, + + setRegionPosition: function (name, position) { + var region = this.getRegionByName(name); + return this.arrangement.setRegionPosition(name, position); + }, + + setDropPosition: function (position) { + return this.arrangement.setDropPosition(position); + }, + + scrollInterval: function (e, isBorderScroll, isOverflowScroll, cb) { + var self = this; + var map = { + top: [-1, 0], + bottom: [1, 0], + left: [0, -1], + right: [0, 1] + }; + var clientSize = this.element.bounds(); + + function scrollTo(direction, callback) { + if (direction === "") { + self.lastActiveRegion = ""; + if (self._scrollInterval) { + clearInterval(self._scrollInterval); + self._scrollInterval = null; + } + return; + } + if (self.lastActiveRegion !== direction) { + self.lastActiveRegion = direction; + if (self._scrollInterval) { + clearInterval(self._scrollInterval); + self._scrollInterval = null; + } + self._scrollInterval = setInterval(function () { + var offset = self._getScrollOffset(); + var t = offset.top + map[direction][0] * 40; + var l = offset.left + map[direction][1] * 40; + if (t < 0 || l < 0) { + return; } - var offset = this.arrangement._getScrollOffset(); - position = { - left: position.left + offset.left, - top: position.top + offset.top - }; - BI.some(this.getAllRegions(), function (id, region) { - if (self.arrangement._isPositionInBounds(position, region)) { - var at = self.arrangement._positionAt(position, region); - if (at.type === "top-gap" || at.type === "bottom-gap") { - self.arrangement._setArrangeSize({ - top: region.top - 8 + (at.type === "bottom-gap" ? region.height : 0), - left: region.left, - width: region.width, - height: 16 - }); - self.position = { - insert: { - height: (size || {}).height - }, - type: at.type, - region: region - }; - self.arrangement._start(); - } - return true; - } + callback({ + offsetX: map[direction][1] * 40, + offsetY: map[direction][0] * 40 }); - break; - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - break; + self.scrollTo({ + top: t, + left: l + }); + }, 300); + } + } + + cb({ + offsetX: 0, + offsetY: 0 + }); + var offset = this.element.offset(); + var p = { + left: e.pageX - offset.left, + top: e.pageY - offset.top + }; + //向上滚 + if (isBorderScroll && p.top >= 0 && p.top <= 30) { + scrollTo("top", cb) + } + //向下滚 + else if (isBorderScroll && p.top >= clientSize.height - 30 && p.top <= clientSize.height) { + scrollTo("bottom", cb) + } + //向左滚 + else if (isBorderScroll && p.left >= 0 && p.left <= 30) { + scrollTo("left", cb) + } + //向右滚 + else if (isBorderScroll && p.left >= clientSize.width - 30 && p.left <= clientSize.width) { + scrollTo("right", cb) + } else { + if (isOverflowScroll === true) { + if (p.top < 0) { + scrollTo("top", cb); + } + else if (p.top > clientSize.height) { + scrollTo("bottom", cb); + } + else if (p.left < 0) { + scrollTo("left", cb); + } + else if (p.left > clientSize.width) { + scrollTo("right", cb); + } else { + scrollTo("", cb); + } + } else { + scrollTo("", cb); } } - return this.position || at; }, - setRegionPosition: function (name, position) { - var region = this.getRegionByName(name); - region.el.element.css("zIndex", ++this.zIndex); - return this.arrangement.setRegionPosition(name, position); + scrollEnd: function () { + this.lastActiveRegion = ""; + if (this._scrollInterval) { + clearInterval(this._scrollInterval); + this._scrollInterval = null; + } }, scrollTo: function (scroll) { @@ -897,7 +720,6 @@ BI.AdaptiveArrangement = BI.inherit(BI.Widget, { setLayoutType: function (type) { var self = this; - this._setLayoutType(type); this.arrangement.setLayoutType(type); }, @@ -933,17 +755,6 @@ BI.AdaptiveArrangement = BI.inherit(BI.Widget, { self._initResizable(item.el); }); this.arrangement.populate(items); - switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - BI.nextTick(function () { - self.arrangement.resize(); - }); - break; - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - break; - } } }); BI.AdaptiveArrangement.EVENT_ELEMENT_START_RESIZE = "AdaptiveArrangement.EVENT_ELEMENT_START_RESIZE"; @@ -964,12 +775,6 @@ BI.ArrangementBlock = BI.inherit(BI.Widget, { return BI.extend(BI.ArrangementBlock.superclass._defaultConfig.apply(this, arguments), { baseCls: "bi-arrangement-block bi-mask" }); - }, - - _init: function () { - BI.ArrangementBlock.superclass._init.apply(this, arguments); - var self = this, o = this.options; - } }); BI.shortcut('bi.arrangement_block', BI.ArrangementBlock);/** @@ -985,12 +790,6 @@ BI.ArrangementDroppable = BI.inherit(BI.Widget, { return BI.extend(BI.ArrangementDroppable.superclass._defaultConfig.apply(this, arguments), { baseCls: "bi-arrangement-droppable bi-resizer" }); - }, - - _init: function () { - BI.ArrangementDroppable.superclass._init.apply(this, arguments); - var self = this, o = this.options; - } }); BI.shortcut('bi.arrangement_droppable', BI.ArrangementDroppable);/** @@ -1005,8 +804,7 @@ 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.FREE, - isNeedReLayout: true, + layoutType: BI.Arrangement.LAYOUT_TYPE.GRID, items: [] }); }, @@ -1023,20 +821,9 @@ BI.Arrangement = BI.inherit(BI.Widget, { type: "bi.arrangement_block", invisible: true }); - this.droppable = BI.createWidget({ - type: "bi.layout", - cls: "arrangement-drop-container", - invisible: true - }); this.container = BI.createWidget({ type: "bi.absolute", - items: o.items.concat([this.block, this.arrangement, { - el: this.droppable, - left: 0, - right: 0, - top: 0, - bottom: 0 - }]) + items: o.items.concat([this.block, this.arrangement]) }); this.scrollContainer = BI.createWidget({ @@ -1061,9 +848,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { items: [this.scrollContainer] }); this.regions = {}; - this.locations = {}; - this.drops = {}; - this.storeDrops = {}; if (o.items.length > 0) { BI.nextTick(function () { self.populate(o.items); @@ -1075,48 +859,9 @@ BI.Arrangement = BI.inherit(BI.Widget, { _calculateRegions: function (items) { var self = this, o = this.options; this.regions = {}; - this.drops = {}; BI.each(items, function (i, item) { var region = self._createOneRegion(item); self.regions[region.id] = region; - var drop = self._createOneDrop(region); - self.drops[drop.id] = drop; - self.storeDrops[drop.id] = drop; - }); - }, - - //定方位 - _locationRegion: function () { - var self = this, o = this.options; - this.locations = {}; - var reg = []; - BI.each(this.regions, function (id, region) { - var t = new BI.Region(region.left, region.top, region.width, region.height); - t.id = id; - reg.push(t); - self.locations[id] = {top: [], left: [], right: [], bottom: []}; - }); - BI.each(reg, function (i, dim) { - var topRegion = new BI.Region(dim.x, 0, dim.w, dim.y), - bottomRegion = new BI.Region(dim.x, dim.y + dim.h, dim.w, BI.MAX), - leftRegion = new BI.Region(0, dim.y, dim.x, dim.h), - rightRegion = new BI.Region(dim.x + dim.w, dim.y, BI.MAX, dim.h); - BI.each(reg, function (j, tar) { - if (i !== j) { - if (tar.isIntersects(topRegion) && self._isLessThanEqual(tar.y + tar.h, dim.y)) { - self.locations[dim.id].top.push(self.regions[tar.id]); - } - if (tar.isIntersects(bottomRegion) && self._isMoreThanEqual(tar.y, dim.y + dim.h)) { - self.locations[dim.id].bottom.push(self.regions[tar.id]); - } - if (tar.isIntersects(leftRegion) && self._isLessThanEqual(tar.x + tar.w, dim.x)) { - self.locations[dim.id].left.push(self.regions[tar.id]); - } - if (tar.isIntersects(rightRegion) && self._isMoreThanEqual(tar.x, dim.x + dim.w)) { - self.locations[dim.id].right.push(self.regions[tar.id]); - } - } - }); }); }, @@ -1140,394 +885,29 @@ BI.Arrangement = BI.inherit(BI.Widget, { return num1 >= num2 || this._isEqual(num1, num2); }, - ////方法//// - _isPositionInBounds: function (position, bound) { - var region = new BI.Region(bound.left, bound.top, bound.width, bound.height); - return region.isPointInside(position.left, position.top); - }, - - //获取某区域等量相关联的区域 - _getEquivalentRelativeRegions: function (name, direction) { - var self = this; - direction || (direction = ["top", "bottom", "left", "right"]); - var result = []; - var target = this.regions[name]; - var tops = this.locations[name].top; - var bottoms = this.locations[name].bottom; - var lefts = this.locations[name].left; - var rights = this.locations[name].right; - var finded = direction.contains("top") && BI.some(tops, function (i, region) { - if (self._isEqual(region.top + region.height, target.top) && self._isEqual(region.left, target.left) && self._isEqual(region.width, target.width)) { - var clone = BI.clone(region); - clone.height = region.height + target.height; - result.push(clone); - return true; - } - }); - if (!finded) { - finded = direction.contains("bottom") && BI.some(bottoms, function (i, region) { - if (self._isEqual(target.top + target.height, region.top) && self._isEqual(region.left, target.left) && self._isEqual(region.width, target.width)) { - var clone = BI.clone(region); - clone.top = region.top - target.height; - clone.height = region.height + target.height; - result.push(clone); - return true; - } - }); - if (!finded) { - finded = direction.contains("left") && BI.some(lefts, function (i, region) { - if (self._isEqual(region.left + region.width, target.left) && self._isEqual(region.top, target.top) && self._isEqual(region.height, target.height)) { - var clone = BI.clone(region); - clone.width = region.width + target.width; - result.push(clone); - return true; - } - }); - if (!finded) { - finded = direction.contains("right") && BI.some(rights, function (i, region) { - if (self._isEqual(target.left + target.width, region.left) && self._isEqual(region.top, target.top) && self._isEqual(region.height, target.height)) { - var clone = BI.clone(region); - clone.left = region.left - target.width; - clone.width = region.width + target.width; - result.push(clone); - return true; - } - }); - if (!finded) { - var findTopRegions = [], findBottomRegions = []; - direction.contains("top") && BI.each(tops, function (i, region) { - if (self._isEqual(region.top + region.height, target.top) - && self._isMoreThanEqual(region.left, target.left) - && self._isLessThanEqual(region.left + region.width, target.left + target.width)) { - findTopRegions.push(region); - } - }); - direction.contains("bottom") && BI.each(bottoms, function (i, region) { - if (self._isEqual(target.top + target.height, region.top) - && self._isMoreThanEqual(region.left, target.left) - && self._isLessThanEqual(region.left + region.width, target.left + target.width)) { - findBottomRegions.push(region); - } - }); - var topValid = isRegionsValid(findTopRegions, "top"), - bottomValid = isRegionsValid(findBottomRegions, "bottom"); - if (topValid && bottomValid) { - BI.each(findTopRegions, function (i, region) { - var clone = BI.clone(region); - clone.height = region.height + target.height / 2; - result.push(clone); - }); - BI.each(findBottomRegions, function (i, region) { - var clone = BI.clone(region); - clone.top = region.top - target.height / 2; - clone.height = region.height + target.height / 2; - result.push(clone); - }); - } else if (topValid) { - BI.each(findTopRegions, function (i, region) { - var clone = BI.clone(region); - clone.height = region.height + target.height; - result.push(clone); - }); - } else if (bottomValid) { - BI.each(findBottomRegions, function (i, region) { - var clone = BI.clone(region); - clone.top = region.top - target.height; - clone.height = region.height + target.height; - result.push(clone); - }); - } - if (!topValid && !bottomValid) { - var findLeftRegions = [], findRightRegions = []; - direction.contains("left") && BI.each(lefts, function (i, region) { - if (self._isEqual(region.left + region.width, target.left) - && self._isMoreThanEqual(region.top, target.top) - && self._isLessThanEqual(region.top + region.height, target.top + target.height)) { - findLeftRegions.push(region); - } - }); - direction.contains("right") && BI.each(rights, function (i, region) { - if (self._isEqual(target.left + target.width, region.left) - && self._isMoreThanEqual(region.top, target.top) - && self._isLessThanEqual(region.top + region.height, target.top + target.height)) { - findRightRegions.push(region); - } - }); - var leftValid = isRegionsValid(findLeftRegions, "left"), - rightValid = isRegionsValid(findRightRegions, "right"); - if (leftValid && rightValid) { - BI.each(findLeftRegions, function (i, region) { - var clone = BI.clone(region); - clone.width = region.width + target.width / 2; - result.push(clone); - }); - BI.each(findRightRegions, function (i, region) { - var clone = BI.clone(region); - clone.left = region.left - target.width / 2; - clone.width = region.width + target.width / 2; - result.push(clone); - }); - } else if (leftValid) { - BI.each(findLeftRegions, function (i, region) { - var clone = BI.clone(region); - clone.width = region.width + target.width; - result.push(clone); - }); - } else if (rightValid) { - BI.each(findRightRegions, function (i, region) { - var clone = BI.clone(region); - clone.left = region.left - target.width; - clone.width = region.width + target.width; - result.push(clone); - }); - } - - //上下左右都不可行 - if (!leftValid && !rightValid) { - - } - } - } - } + //获取占有的最大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 } } - return result; - function isRegionsValid(regions, dir) { - var occupied = self._getRegionOccupied(regions); - switch (dir) { - case "top": - case "bottom": - return self._isEqual(occupied.left, target.left) && self._isEqual(occupied.width, target.width); - case "left": - case "right": - return self._isEqual(occupied.top, target.top) && self._isEqual(occupied.height, target.height); - } - return false; - } - }, - - //获取某区域直接相关联的区域 - _getDirectRelativeRegions: function (name, direction) { - var self = this; - direction || (direction = ["top", "bottom", "left", "right"]); - var result = []; - var target = this.regions[name]; - var tops = this.locations[name].top; - var bottoms = this.locations[name].bottom; - var lefts = this.locations[name].left; - var rights = this.locations[name].right; - var finded = direction.contains("top") && BI.some(tops, function (i, region) { - if (self._isEqual(region.top + region.height, target.top) - && ((self._isMoreThanEqual(region.left, target.left) && self._isLessThan(region.left, target.left + target.width)) - || (self._isMoreThan(region.left + region.width, target.left) && self._isLessThanEqual(region.left + region.width, target.left + target.width)) - || (self._isLessThan(region.left, target.left) && self._isMoreThan(region.left + region.width, target.left + target.width)))) { - var clone = BI.clone(region); - clone.height = region.height + target.height; - result.push(clone); - } - }); - if (!finded) { - finded = direction.contains("bottom") && BI.some(bottoms, function (i, region) { - if (self._isEqual(target.top + target.height, region.top) - && ((self._isMoreThanEqual(region.left, target.left) && self._isLessThan(region.left, target.left + target.width)) - || (self._isMoreThan(region.left + region.width, target.left) && self._isLessThanEqual(region.left + region.width, target.left + target.width)) - || (self._isLessThan(region.left, target.left) && self._isMoreThan(region.left + region.width, target.left + target.width)))) { - var clone = BI.clone(region); - clone.top = region.top - target.height; - clone.height = region.height + target.height; - result.push(clone); - } - }); - if (!finded) { - finded = direction.contains("left") && BI.some(lefts, function (i, region) { - if (self._isEqual(region.left + region.width, target.left) - && ((self._isMoreThanEqual(region.top, target.top) && self._isLessThan(region.top, target.top + target.height)) - || (self._isMoreThan(region.top + region.height, target.top) && self._isLessThanEqual(region.top + region.height, target.top + target.height)) - || (self._isLessThan(region.top, target.top) && self._isMoreThan(region.top + region.height, target.top + target.height)))) { - var clone = BI.clone(region); - clone.width = region.width + target.width; - result.push(clone); - } - }); - if (!finded) { - finded = direction.contains("right") && BI.some(rights, function (i, region) { - if (self._isEqual(target.left + target.width, region.left) - && ((self._isMoreThanEqual(region.top, target.top) && self._isLessThan(region.top, target.top + target.height)) - || (self._isMoreThan(region.top + region.height, target.top) && self._isLessThanEqual(region.top + region.height, target.top + target.height)) - || (self._isLessThan(region.top, target.top) && self._isMoreThan(region.top + region.height, target.top + target.height)))) { - var clone = BI.clone(region); - clone.left = region.left - target.width; - clone.width = region.width + target.width; - result.push(clone); - } - }); - } - } - } - return result; - }, - - //获取间接相关联的区域,即调整name区域后需要附带调整的所有相关区域(包括自身) - _getInDirectRelativeRegions: function (name, direction) { - var self = this, dict = ["top", "left", "right", "bottom"]; - var result = {}; - direction || (direction = dict); - function recursion(regions, dir, store, cache) { - BI.each(regions, function (i, region) { - if (cache[region.id]) { - return; - } - cache[region.id] = true; - if (!store[dict[3 - dir]]) { - store[dict[3 - dir]] = []; - } - store[dict[3 - dir]].push(region); - recursion(self._getDirectRelativeRegions(region.id, [dict[dir]]), 3 - dir, store, cache); - }) - } - - if (direction.contains("top")) { - var store = {}, cache = {}; - recursion([this.regions[name]], dict.indexOf("top"), store, cache); - store["top"] = BI.sortBy(store["top"], "left"); - store["bottom"] = BI.sortBy(store["bottom"], "left"); - result["top"] = store; - } - if (direction.contains("bottom")) { - var store = {}, cache = {}; - recursion([this.regions[name]], dict.indexOf("bottom"), store, cache); - store["top"] = BI.sortBy(store["top"], "left"); - store["bottom"] = BI.sortBy(store["bottom"], "left"); - result["bottom"] = store; - } - if (direction.contains("left")) { - var store = {}, cache = {}; - recursion([this.regions[name]], dict.indexOf("left"), store, cache); - store["left"] = BI.sortBy(store["left"], "top"); - store["right"] = BI.sortBy(store["right"], "top"); - result["left"] = store; - } - if (direction.contains("right")) { - var store = {}, cache = {}; - recursion([this.regions[name]], dict.indexOf("right"), store, cache); - store["left"] = BI.sortBy(store["left"], "top"); - store["right"] = BI.sortBy(store["right"], "top"); - result["right"] = store; - } - return result; - }, - - _getLeftAlignRegions: function (name) { - var self = this; - var tops = this._getDirectRelativeRegions(name, ["top"]); - var bottoms = this._getDirectRelativeRegions(name, ["bottom"]); - var current = this.regions[name]; - var rtop = [], rbottom = []; - BI.each(tops, function (i, region) { - if (self._isEqual(region.left, current.left)) { - rtop.push(region); - } - }); - BI.each(bottoms, function (i, region) { - if (self._isEqual(region.left, current.left)) { - rbottom.push(region); - } - }); - return { - top: rtop, - bottom: rbottom - } - }, - - _getRightAlignRegions: function (name) { - var self = this; - var tops = this._getDirectRelativeRegions(name, ["top"]); - var bottoms = this._getDirectRelativeRegions(name, ["bottom"]); - var current = this.regions[name]; - var rtop = [], rbottom = []; - BI.each(tops, function (i, region) { - if (self._isEqual(region.left + region.width, current.left + current.width)) { - rtop.push(region); - } - }); - BI.each(bottoms, function (i, region) { - if (self._isEqual(region.left + region.width, current.left + current.width)) { - rbottom.push(region); - } - }); - return { - top: rtop, - bottom: rbottom - } - }, - - _getTopAlignRegions: function (name) { - var self = this; - var lefts = this._getDirectRelativeRegions(name, ["left"]); - var rights = this._getDirectRelativeRegions(name, ["right"]); - var current = this.regions[name]; - var rleft = [], rright = []; - BI.each(lefts, function (i, region) { - if (self._isEqual(region.top, current.top)) { - rleft.push(region); - } - }); - BI.each(rights, function (i, region) { - if (self._isEqual(region.top, current.top)) { - rright.push(region); - } - }); - return { - left: rleft, - right: rright - } - }, - - _getBottomAlignRegions: function (name) { - var self = this; - var lefts = this._getDirectRelativeRegions(name, ["left"]); - var rights = this._getDirectRelativeRegions(name, ["right"]); - var current = this.regions[name]; - var rleft = [], rright = []; - BI.each(lefts, function (i, region) { - if (self._isEqual(region.top + region.height, current.top + current.height)) { - rleft.push(region); - } - }); - BI.each(rights, function (i, region) { - if (self._isEqual(region.top + region.height, current.top + current.height)) { - rright.push(region); - } - }); - return { - left: rleft, - right: rright - } - }, - - //获取占有的最大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 + 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 } }, @@ -1600,17 +980,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { //布局是否是优良的 _isArrangeFine: function (regions) { switch (this.options.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - if (this._isRegionOverlay()) { - return false; - } - var maxRegion = this._getRegionOccupied(regions); - var area = maxRegion.width * maxRegion.height; - var all = 0; - BI.each(regions || this.regions, function (id, region) { - all += region.width * region.height; - }); - return Math.abs(area - all) < 8; case BI.Arrangement.LAYOUT_TYPE.FREE: return true; case BI.Arrangement.LAYOUT_TYPE.GRID: @@ -1638,1018 +1007,39 @@ BI.Arrangement = BI.inherit(BI.Widget, { 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; - } - }) - }, - - //对区域进行划分 - _splitRegions: function (name) { - var result = []; - var tid = BI.UUID(); - var _left = this._getLeftAlignRegions(name); - var _right = this._getRightAlignRegions(name); - var _top = this._getTopAlignRegions(name); - var _bottom = this._getBottomAlignRegions(name); - if (_left.top.length > 0) { - var upid = _left.top[0].id; - var tid = BI.UUID(); - var clone = this._cloneRegion(); - var _cur = clone[name]; - var split = Math.min(clone[name].width, clone[upid].width) / 2;//两个组件中较小宽度的一半 - var left = (clone[name].left + clone[upid].left) / 2;//求平均，减少误差 - var insert = clone[tid] = {//新增的区域 - left: left, - top: clone[upid].top, - width: split, - height: clone[name].height + clone[upid].height - }; - BI.extend(clone[name], { - left: left + split, - width: clone[name].width - split - (left - clone[name].left) - }); - BI.extend(clone[upid], { - left: left + split, - width: clone[upid].width - split - (left - clone[upid].left) - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "left-top", - regions: clone, - insert: insert - }); - } - } - if (_left.bottom.length > 0) { - var bottomid = _left.bottom[0].id; - var tid = BI.UUID(); - var clone = this._cloneRegion(); - var _cur = clone[name]; - var split = Math.min(clone[name].width, clone[bottomid].width) / 2; - var left = (clone[name].left + clone[bottomid].left) / 2; - var insert = clone[tid] = {//新增的区域 - left: left, - top: clone[name].top, - width: split, - height: clone[name].height + clone[bottomid].height - }; - BI.extend(clone[name], { - left: left + split, - width: clone[name].width - split - (left - clone[name].left) - }); - BI.extend(clone[bottomid], { - left: left + split, - width: clone[bottomid].width - split - (left - clone[bottomid].left) - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "bottom-left", - regions: clone, - insert: insert - }); - } - } - if (_right.top.length > 0) { - var upid = _right.top[0].id; - var tid = BI.UUID(); - var clone = this._cloneRegion(); - var _cur = clone[name]; - var split = Math.min(clone[name].width, clone[upid].width) / 2;//两个组件中较小宽度的一半 - var right = (clone[name].left + clone[name].width + clone[upid].left + clone[upid].width) / 2;//求平均，减少误差 - var insert = clone[tid] = {//新增的区域 - left: right - split, - top: clone[upid].top, - width: split, - height: clone[name].height + clone[upid].height - }; - BI.extend(clone[name], { - width: right - clone[name].left - split - }); - BI.extend(clone[upid], { - width: right - clone[upid].left - split - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "top-right", - regions: clone, - insert: insert - }); - } - } - if (_right.bottom.length > 0) { - var bottomid = _right.bottom[0].id; - var tid = BI.UUID(); - var clone = this._cloneRegion(); - var _cur = clone[name]; - var split = Math.min(clone[name].width, clone[bottomid].width) / 2;//两个组件中较小宽度的一半 - var right = (clone[name].left + clone[name].width + clone[bottomid].left + clone[bottomid].width) / 2;//求平均，减少误差 - var insert = clone[tid] = {//新增的区域 - left: right - split, - top: clone[name].top, - width: split, - height: clone[name].height + clone[bottomid].height - }; - BI.extend(clone[name], { - width: right - clone[name].left - split - }); - BI.extend(clone[bottomid], { - width: right - clone[bottomid].left - split - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "bottom-right", - regions: clone, - insert: insert - }); - } - } - if (_top.left.length > 0) { - var leftid = _top.left[0].id; - var tid = BI.UUID(); - var clone = this._cloneRegion(); - var _cur = clone[name]; - var split = Math.min(clone[name].height, clone[leftid].height) / 2;//两个组件中较小高度的一半 - var top = (clone[name].top + clone[leftid].top) / 2;//求平均，减少误差 - var insert = clone[tid] = {//新增的区域 - top: top, - left: clone[leftid].left, - height: split, - width: clone[name].width + clone[leftid].width - }; - BI.extend(clone[name], { - top: top + split, - height: clone[name].height - split - (top - clone[name].top) - }); - BI.extend(clone[leftid], { - top: top + split, - height: clone[leftid].height - split - (top - clone[leftid].top) - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "top-left", - regions: clone, - insert: insert - }); - } - } - if (_top.right.length > 0) { - var rightid = _top.right[0].id; - var tid = BI.UUID(); - var clone = this._cloneRegion(); - var _cur = clone[name]; - var split = Math.min(clone[name].height, clone[rightid].height) / 2;//两个组件中较小高度的一半 - var top = (clone[name].top + clone[rightid].top) / 2;//求平均，减少误差 - var insert = clone[tid] = {//新增的区域 - top: top, - left: clone[name].left, - height: split, - width: clone[name].width + clone[rightid].width - }; - BI.extend(clone[name], { - top: top + split, - height: clone[name].height - split - (top - clone[name].top) - }); - BI.extend(clone[rightid], { - top: top + split, - height: clone[rightid].height - split - (top - clone[rightid].top) - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "top-right-second", - regions: clone, - insert: insert - }); - } - } - if (_bottom.left.length > 0) { - var leftid = _bottom.left[0].id; - var tid = BI.UUID(); - var clone = this._cloneRegion(); - var _cur = clone[name]; - var split = Math.min(clone[name].height, clone[leftid].height) / 2;//两个组件中较小高度的一半 - var bottom = (clone[name].top + clone[name].height + clone[leftid].top + clone[leftid].height) / 2;//求平均，减少误差 - var insert = clone[tid] = {//新增的区域 - left: clone[leftid].left, - top: bottom - split, - height: split, - width: clone[name].width + clone[leftid].width - }; - BI.extend(clone[name], { - height: bottom - clone[name].top - split - }); - BI.extend(clone[leftid], { - height: bottom - clone[leftid].top - split - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "bottom-left-second", - regions: clone, - insert: insert - }); - } - } - if (_bottom.right.length > 0) { - var rightid = _bottom.right[0].id; - var tid = BI.UUID(); - var clone = this._cloneRegion(); - var _cur = clone[name]; - var split = Math.min(clone[name].height, clone[rightid].height) / 2;//两个组件中较小高度的一半 - var bottom = (clone[name].top + clone[name].height + clone[rightid].top + clone[rightid].height) / 2;//求平均，减少误差 - var insert = clone[tid] = {//新增的区域 - left: clone[name].left, - top: bottom - split, - height: split, - width: clone[name].width + clone[rightid].width - }; - BI.extend(clone[name], { - height: bottom - clone[name].top - split - }); - BI.extend(clone[rightid], { - height: bottom - clone[rightid].top - split - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "bottom-right-second", - regions: clone, - insert: insert - }); - } - } - //有上方居中drop - var lefts = _top.left, rights = _top.right; - if (lefts.length > 0 && rights.length > 0) { - var count = 0; - var store = [this.regions[name]]; - while (lefts.length > 0 || rights.length > 0) { - var clone = this._cloneRegion(); - if (lefts.length > 0) { - store.push(this.regions[lefts[0].id]); - } - if (rights.length > 0) { - store.push(this.regions[rights[0].id]); - } - count++; - var top = BI.average(store, function (i, r) {//求平均，减少误差 - return r.top; - }); - var occupied = this._getRegionOccupied(store); - - var split = BI.min(store, function (i, r) { - return r.height; - }).height / 2; - var insert = clone[tid] = { - left: occupied.left, - width: occupied.width, - top: top, - height: split - }; - BI.each(store, function (i, region) { - BI.extend(clone[region.id], { - top: top + split, - height: region.height - split - (top - region.top) - }); - }); - if (this._test(store)) { - delete clone[tid]; - result.push({ - type: "top-center" + count, - regions: clone, - insert: insert - }); - } else { - break; - } - - if (lefts.length > 0) { - lefts = this._getTopAlignRegions(lefts[0].id).left; - } - if (rights.length > 0) { - rights = this._getTopAlignRegions(rights[0].id).right; - } - } - } - //有下方居中drop - var lefts = _bottom.left, rights = _bottom.right; - if (lefts.length > 0 && rights.length > 0) { - var count = 0; - var store = [this.regions[name]]; - while (lefts.length > 0 || rights.length > 0) { - var clone = this._cloneRegion(); - if (lefts.length > 0) { - store.push(this.regions[lefts[0].id]); - } - if (rights.length > 0) { - store.push(this.regions[rights[0].id]); - } - count++; - var bottom = BI.average(store, function (i, r) {//求平均，减少误差 - return r.top + r.height; - }); - var occupied = this._getRegionOccupied(store); - - var split = BI.min(store, function (i, r) { - return r.height; - }).height / 2; - var insert = clone[tid] = { - left: occupied.left, - width: occupied.width, - top: bottom - split, - height: split - }; - BI.each(store, function (i, region) { - BI.extend(clone[region.id], { - height: bottom - region.top - split - }); - }); - if (this._test(store)) { - delete clone[tid]; - result.push({ - type: "bottom-center" + count, - regions: clone, - insert: insert - }); - } else { - break; - } - - if (lefts.length > 0) { - lefts = this._getBottomAlignRegions(lefts[0].id).left; - } - if (rights.length > 0) { - rights = this._getBottomAlignRegions(rights[0].id).right; - } - } - } - //有左方居中drop - var tops = _left.top, bottoms = _left.bottom; - if (tops.length > 0 && bottoms.length > 0) { - var count = 0; - var store = [this.regions[name]]; - while (tops.length > 0 || bottoms.length > 0) { - var clone = this._cloneRegion(); - if (tops.length > 0) { - store.push(this.regions[tops[0].id]); - } - if (bottoms.length > 0) { - store.push(this.regions[bottoms[0].id]); - } - count++; - var left = BI.average(store, function (i, r) {//求平均，减少误差 - return r.left; - }); - var occupied = this._getRegionOccupied(store); - - var split = BI.min(store, function (i, r) { - return r.width; - }).width / 2; - var insert = clone[tid] = { - left: left, - width: split, - top: occupied.top, - height: occupied.height - }; - BI.each(store, function (i, region) { - BI.extend(clone[region.id], { - left: left + split, - width: region.width - split - (left - region.left) - }); - }); - if (this._test(store)) { - delete clone[tid]; - result.push({ - type: "left-center" + count, - regions: clone, - insert: insert - }); - } else { - break; - } - - if (tops.length > 0) { - tops = this._getLeftAlignRegions(tops[0].id).top; - } - if (bottoms.length > 0) { - bottoms = this._getLeftAlignRegions(bottoms[0].id).bottom; - } - } - } - //有右方居中drop - var tops = _right.top, bottoms = _right.bottom; - if (tops.length > 0 && bottoms.length > 0) { - var count = 0; - var store = [this.regions[name]]; - while (tops.length > 0 || bottoms.length > 0) { - var clone = this._cloneRegion(); - if (tops.length > 0) { - store.push(this.regions[tops[0].id]); - } - if (bottoms.length > 0) { - store.push(this.regions[bottoms[0].id]); - } - count++; - var right = BI.average(store, function (i, r) {//求平均，减少误差 - return r.left + r.width; - }); - var occupied = this._getRegionOccupied(store); - - var split = BI.min(store, function (i, r) { - return r.width; - }).width / 2; - var insert = clone[tid] = { - left: right - split, - width: split, - top: occupied.top, - height: occupied.height - }; - BI.each(store, function (i, region) { - BI.extend(clone[region.id], { - width: right - region.left - split - }); - }); - if (this._test(store)) { - delete clone[tid]; - result.push({ - type: "right-center" + count, - regions: clone, - insert: insert - }); - } else { - break; - } - - if (tops.length > 0) { - tops = this._getRightAlignRegions(tops[0].id).top; - } - if (bottoms.length > 0) { - bottoms = this._getRightAlignRegions(bottoms[0].id).bottom; - } - } - } - var lefts = this._getEquivalentRelativeRegions(name, ["left"]); - if (lefts.length === 1) { - var clone = this._cloneRegion(); - var _cur = clone[name]; - var left = this.regions[lefts[0].id]; - var width = left.width; - var all = left.width + _cur.width; - var ratio = width / all; - var split = all / 3; - var lleft = width - split * ratio, rleft = _cur.width - split * (1 - ratio); - var insert = false; - if (lleft <= 21) { - rleft = _cur.width - split; - if (rleft <= 21) { - - } else { - insert = clone[tid] = { - top: _cur.top, - height: _cur.height, - left: _cur.left, - width: split, - }; - BI.extend(clone[name], { - top: _cur.top, - height: _cur.height, - left: _cur.left + split, - width: _cur.width - split - }); - } - } else if (rleft <= 21) { - lleft = width - split; - if (lleft <= 21) { - } else { - insert = clone[tid] = { - top: _cur.top, - height: _cur.height, - left: _cur.left - split, - width: split, - }; - BI.extend(clone[left.id], { - top: left.top, - height: left.height, - left: left.left, - width: left.width - split - }); - } - } else { - insert = clone[tid] = { - top: _cur.top, - height: _cur.height, - left: left.left + lleft, - width: split, - }; - BI.extend(clone[name], { - top: _cur.top, - height: _cur.height, - left: _cur.left + _cur.width - rleft, - width: rleft - }); - BI.extend(clone[left.id], { - top: left.top, - height: left.height, - left: left.left, - width: lleft - }); - } - if (insert !== false) { - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "left-line", - regions: clone, - insert: insert - }) - } - } - } - var rights = this._getEquivalentRelativeRegions(name, ["right"]); - if (rights.length === 1) { - var clone = this._cloneRegion(); - var _cur = clone[name]; - var right = this.regions[rights[0].id]; - var width = right.width; - var all = right.width + _cur.width; - var ratio = width / all; - var split = all / 3; - var lleft = _cur.width - split * (1 - ratio), rleft = width - split * ratio; - var insert = false; - if (lleft <= 21) { - rleft = width - split; - if (rleft <= 21) { - } else { - insert = clone[tid] = { - top: right.top, - height: right.height, - left: right.left, - width: split - }; - BI.extend(clone[right.id], { - top: right.top, - height: right.height, - left: right.left + split, - width: right.width - split - }) - } - } else if (rleft <= 21) { - lleft = _cur.width - split; - if (lleft <= 21) { - } else { - insert = clone[tid] = { - top: _cur.top, - height: _cur.height, - left: _cur.left + lleft, - width: split - }; - BI.extend(clone[name], { - top: _cur.top, - height: _cur.height, - left: _cur.left, - width: _cur.width - split - }) - } - } else { - insert = clone[tid] = { - top: _cur.top, - height: _cur.height, - left: _cur.left + lleft, - width: split - }; - BI.extend(clone[name], { - top: _cur.top, - height: _cur.height, - left: _cur.left, - width: lleft - }); - BI.extend(clone[right.id], { - top: right.top, - height: right.height, - left: right.left + right.width - rleft, - width: rleft - }); - } - if (insert !== false) { - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "right-line", - regions: clone, - insert: insert - }) - } - } - } - var tops = this._getEquivalentRelativeRegions(name, ["top"]); - if (tops.length === 1) { - var clone = this._cloneRegion(); - var _cur = clone[name]; - var top = this.regions[tops[0].id]; - var height = top.height; - var all = top.height + _cur.height; - var ratio = height / all; - var split = all / 3; - var tleft = height - split * ratio, bleft = _cur.height - split * (1 - ratio); - var insert = false; - if (tleft <= 21) { - bleft = _cur.height - split; - if (bleft <= 21) { - } else { - insert = clone[tid] = { - top: _cur.top, - width: _cur.width, - left: _cur.left, - height: split - }; - BI.extend(clone[name], { - top: _cur.top + split, - height: _cur.height - split, - left: _cur.left, - width: _cur.width - }); - } - } - if (bleft <= 21) { - tleft = height - split; - if (tleft <= 21) { - } else { - insert = clone[tid] = { - top: _cur.top - split, - height: split, - left: _cur.left, - width: _cur.width - }; - BI.extend(clone[top.id], { - top: top.top, - height: top.height - split, - left: top.left, - width: top.width - }); - } - } else { - insert = clone[tid] = { - top: top.top + tleft, - height: split, - left: _cur.left, - width: _cur.width - }; - BI.extend(clone[name], { - top: _cur.top + _cur.height - bleft, - height: bleft, - left: _cur.left, - width: _cur.width - }); - BI.extend(clone[top.id], { - top: top.top, - height: tleft, - left: top.left, - width: top.width - }); - } - if (insert !== false) { - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "top-line", - regions: clone, - insert: insert - }) - } - } - } - var bottoms = this._getEquivalentRelativeRegions(name, ["bottom"]); - if (bottoms.length === 1) { - var clone = this._cloneRegion(); - var _cur = clone[name]; - var bottom = this.regions[bottoms[0].id]; - var height = bottom.height; - var all = bottom.height + _cur.height; - var ratio = height / all; - var split = all / 3; - var tleft = _cur.height - split * (1 - ratio), bleft = height - split * ratio; - var insert = false; - if (tleft <= 21) { - bleft = height - split; - if (bleft <= 21) { - } else { - insert = clone[tid] = { - top: bottom.top, - height: bottom.height, - left: bottom.left, - width: split - }; - BI.extend(clone[bottom.id], { - top: bottom.top + split, - height: bottom.height - split, - left: bottom.left, - width: bottom.width - }); - } - } else if (bleft <= 21) { - tleft = _cur.height - split; - if (tleft <= 21) { - } else { - insert = clone[tid] = { - top: _cur.top + tleft, - height: split, - left: _cur.left, - width: _cur.width - }; - BI.extend(clone[name], { - top: _cur.top, - height: _cur.height - split, - left: _cur.left, - width: _cur.width - }); - } - } else { - insert = clone[tid] = { - top: _cur.top + tleft, - height: split, - left: _cur.left, - width: _cur.width, - }; - BI.extend(clone[name], { - top: _cur.top, - height: tleft, - left: _cur.left, - width: _cur.width - }); - BI.extend(clone[bottom.id], { - top: bottom.top + bottom.height - bleft, - height: bleft, - left: bottom.left, - width: bottom.width - }); - } - if (insert !== false) { - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "bottom-line", - regions: clone, - insert: insert - }) - } - } - } - if (tops.length >= 1) { - result.push({ - type: "top-gap" - }); - } - if (bottoms.length >= 1) { - result.push({ - type: "bottom-gap" - }); - } - //上 - var clone = this._cloneRegion(); - var _cur = clone[name]; - var insert = clone[tid] = { - top: _cur.top, - left: _cur.left, - width: _cur.width, - height: _cur.height / 2, - }; - BI.extend(clone[name], { - top: _cur.top + _cur.height / 2, - left: _cur.left, - width: _cur.width, - height: _cur.height / 2 - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "top", - regions: clone, - insert: insert - }) - } - //下 - var clone = this._cloneRegion(); - var _cur = clone[name]; - var insert = clone[tid] = { - top: _cur.top + _cur.height / 2, - left: _cur.left, - width: _cur.width, - height: _cur.height / 2 - }; - BI.extend(clone[name], { - top: _cur.top, - left: _cur.left, - width: _cur.width, - height: _cur.height / 2 - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "bottom", - regions: clone, - insert: insert - }) - } - //左 - var clone = this._cloneRegion(); - var _cur = clone[name]; - var insert = clone[tid] = { - top: _cur.top, - left: _cur.left, - width: _cur.width / 2, - height: _cur.height - }; - BI.extend(clone[name], { - top: _cur.top, - left: _cur.left + _cur.width / 2, - width: _cur.width / 2, - height: _cur.height - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "left", - regions: clone, - insert: insert - }) - } - //右 - var clone = this._cloneRegion(); - var _cur = clone[name]; - var insert = clone[tid] = { - top: _cur.top, - left: _cur.left + _cur.width / 2, - width: _cur.width / 2, - height: _cur.height - }; - BI.extend(clone[name], { - top: _cur.top, - left: _cur.left, - width: _cur.width / 2, - height: _cur.height - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "right", - regions: clone, - insert: insert - }) - } - return result; - }, - - _positionAt: function (position, bound) { - var left = position.left - bound.left, top = position.top - bound.top; - var right = bound.width - left, bottom = bound.height - top; - var halfW = bound.width / 2, halfH = bound.height / 2; - if (left < 0 || top < 0 || right < 0 || bottom < 0) { - return; - } - var devides = this._splitRegions(bound.id); - var types = []; - var result = {}; - var topcenterCount = 0, bottomcenterCount = 0, leftcenterCount = 0, rightcenterCount = 0; - BI.each(devides, function (i, devide) { - if (devide.type.indexOf("top-center") > -1) { - topcenterCount++; - } else if (devide.type.indexOf("bottom-center") > -1) { - bottomcenterCount++; - } else if (devide.type.indexOf("left-center") > -1) { - leftcenterCount++; - } else if (devide.type.indexOf("right-center") > -1) { - rightcenterCount++; - } - types.push(devide.type); - result[devide.type] = devide; - }); - //drop - if (top >= 5 && top <= 15 && left >= 5 && left <= 15 && types.contains("left-top")) { - return result["left-top"]; - } - if (top >= 5 && top <= 15 && right >= 5 && right <= 15 && types.contains("top-right")) { - return result["top-right"]; - } - if (bottom >= 5 && bottom <= 15 && left >= 5 && left <= 15 && types.contains("bottom-left")) { - return result["bottom-left"]; - } - if (bottom >= 5 && bottom <= 15 && right >= 5 && right <= 15 && types.contains("bottom-right")) { - return result["bottom-right"]; - } - - if (top >= 5 && top <= 15 && left >= 25 && left <= 35 && types.contains("top-left")) { - return result["top-left"]; - } - if (top >= 5 && top <= 15 && right >= 25 && right <= 35 && types.contains("top-right-second")) { - return result["top-right-second"]; - } - if (bottom >= 5 && bottom <= 15 && left >= 25 && left <= 35 && types.contains("bottom-left-second")) { - return result["bottom-left-second"]; - } - if (bottom >= 5 && bottom <= 15 && right >= 25 && right <= 35 && types.contains("bottom-right-second")) { - return result["bottom-right-second"]; - } - - //topcenter或bottomcenter - if (left >= halfW - 10 && left <= halfW + 10 && (topcenterCount > 0 || bottomcenterCount > 0)) { - for (var i = 1; i <= topcenterCount; i++) { - var s = (topcenterCount - i) * 20 + 5, e = s + 10; - if (top >= s && top <= e) { - return result["top-center" + i]; - } - } - for (var i = 1; i <= bottomcenterCount; i++) { - var s = (bottomcenterCount - i) * 20 + 5, e = s + 10; - if (bottom >= s && bottom <= e) { - return result["bottom-center" + i]; - } - } - } - //leftcenter或rightcenter - if (top >= halfH - 10 && top <= halfH + 10 && (leftcenterCount > 0 || rightcenterCount > 0)) { - for (var i = 1; i <= leftcenterCount; i++) { - var s = (leftcenterCount - i) * 20 + 5, e = s + 10; - if (left >= s && left <= e) { - return result["left-center" + i]; - } - } - for (var i = 1; i <= rightcenterCount; i++) { - var s = (rightcenterCount - i) * 20 + 5, e = s + 10; - if (right >= s && right <= e) { - return result["right-center" + i]; - } - } - } - - //缝隙 - if (top <= 8 && types.contains("top-gap")) { - return result["top-gap"]; - } - if (bottom <= 8 && types.contains("bottom-gap")) { - return result["bottom-gap"]; - } - - //三分 - if (top <= 15 && left >= 15 && right >= 15 && types.contains("top-line")) { - return result["top-line"]; - } - if (left <= 15 && top >= 15 && bottom >= 15 && types.contains("left-line")) { - return result["left-line"]; - } - if (right <= 15 && top >= 15 && bottom >= 15 && types.contains("right-line")) { - return result["right-line"]; - } - if (bottom <= 15 && left >= 15 && right >= 15 && types.contains("bottom-line")) { - return result["bottom-line"]; + }); + } else { + var result = {}; + BI.each(names, function (i, name) { + result[name] = regions[name]; + }); } + return result; + }, - //平分 - if (top <= 1 / 4 * bound.height && types.contains("top")) { - return result["top"]; - } - if (top >= 3 / 4 * bound.height && types.contains("bottom")) { - return result["bottom"]; - } - if (left <= bound.width / 2 && types.contains("left")) { - return result["left"]; - } - return result["right"]; + _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 { @@ -2672,215 +1062,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { } }, - _createOneDrop: function (region) { - if (this.storeDrops[region.id]) { - var drop = this.storeDrops[region.id].el; - drop.setVisible(true); - } else { - var drop = BI.createWidget({ - type: "bi.layout", - cls: "arrangement-drop-region", - widgetName: region.id - }); - } - return { - id: region.id, - left: region.left, - top: region.top, - width: region.width, - height: region.height, - el: drop - } - }, - - _calculateDrops: function () { - var self = this; - BI.each(this.drops, function (id, drop) { - drop.el.empty(); - var devides = self._splitRegions(id); - var topcenterCount = 0, bottomcenterCount = 0, leftcenterCount = 0, rightcenterCount = 0; - var absolutes = []; - var horizontals = []; - var verticals = []; - BI.each(devides, function (i, devide) { - if (devide.type.indexOf("top-center") > -1) { - topcenterCount++; - } else if (devide.type.indexOf("bottom-center") > -1) { - bottomcenterCount++; - } else if (devide.type.indexOf("left-center") > -1) { - leftcenterCount++; - } else if (devide.type.indexOf("right-center") > -1) { - rightcenterCount++; - } - }); - BI.each(devides, function (i, devide) { - switch (devide.type) { - case "left-top": - absolutes.push({ - el: { - type: "bi.layout", - width: 10, - height: 10, - cls: "drop-devider" - }, - left: 5, - top: 5 - }); - break; - case "top-right": - absolutes.push({ - el: { - type: "bi.layout", - width: 10, - height: 10, - cls: "drop-devider" - }, - right: 5, - top: 5 - }); - break; - case "bottom-left": - absolutes.push({ - el: { - type: "bi.layout", - width: 10, - height: 10, - cls: "drop-devider" - }, - left: 5, - bottom: 5 - }); - break; - case "bottom-right": - absolutes.push({ - el: { - type: "bi.layout", - width: 10, - height: 10, - cls: "drop-devider" - }, - right: 5, - bottom: 5 - }); - break; - case "top-left": - absolutes.push({ - el: { - type: "bi.layout", - width: 10, - height: 10, - cls: "drop-devider" - }, - left: 25, - top: 5 - }); - break; - case "top-right-second": - absolutes.push({ - el: { - type: "bi.layout", - width: 10, - height: 10, - cls: "drop-devider" - }, - right: 25, - top: 5 - }); - break; - case "bottom-left-second": - absolutes.push({ - el: { - type: "bi.layout", - width: 10, - height: 10, - cls: "drop-devider" - }, - left: 25, - bottom: 5 - }); - break; - case "bottom-right-second": - absolutes.push({ - el: { - type: "bi.layout", - width: 10, - height: 10, - cls: "drop-devider" - }, - right: 25, - bottom: 5 - }); - break; - default: - if (devide.type.indexOf("top-center") > -1) { - var num = devide.type.split("top-center")[1]; - horizontals.push({ - el: { - type: "bi.layout", - width: 20, - height: 10, - cls: "drop-devider" - }, - tgap: 20 * (topcenterCount - BI.parseInt(num)) + 5 - }) - } else if (devide.type.indexOf("bottom-center") > -1) { - var num = devide.type.split("bottom-center")[1]; - horizontals.push({ - el: { - type: "bi.layout", - width: 20, - height: 10, - cls: "drop-devider" - }, - bgap: 20 * (bottomcenterCount - BI.parseInt(num)) + 5 - }) - } else if (devide.type.indexOf("left-center") > -1) { - var num = devide.type.split("left-center")[1]; - verticals.push({ - el: { - type: "bi.layout", - width: 10, - height: 20, - cls: "drop-devider" - }, - lgap: 20 * (leftcenterCount - BI.parseInt(num)) + 5 - }) - } else if (devide.type.indexOf("right-center") > -1) { - var num = devide.type.split("right-center")[1]; - verticals.push({ - el: { - type: "bi.layout", - width: 10, - height: 20, - cls: "drop-devider" - }, - rgap: 20 * (rightcenterCount - BI.parseInt(num)) + 5 - }) - } - break; - } - - }); - BI.createWidget({ - type: "bi.absolute", - element: drop.el, - items: absolutes - }); - - BI.createWidget({ - type: "bi.absolute_horizontal_adapt", - element: drop.el, - items: horizontals - }); - - BI.createWidget({ - type: "bi.absolute_vertical_adapt", - element: drop.el, - items: verticals - }); - }); - }, - _applyRegion: function (regions) { var self = this, o = this.options; BI.each(regions || this.regions, function (i, region) { @@ -2890,21 +1071,8 @@ BI.Arrangement = BI.inherit(BI.Widget, { width: region.width, height: region.height }); - self.drops[region.id].left = region.left; - self.drops[region.id].top = region.top; - self.drops[region.id].width = region.width; - self.drops[region.id].height = region.height; - }); - BI.each(this.drops, function (i, region) { - region.el.element.css({ - left: region.left, - top: region.top, - width: region.width, - height: region.height - }); }); this._applyContainer(); - this._calculateDrops(); this.ratio = this.getLayoutRatio(); }, @@ -2915,11 +1083,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { element: this.container, items: BI.toArray(this.regions) }); - BI.createWidget({ - type: "bi.absolute", - element: this.droppable, - items: BI.toArray(this.drops) - }); }, getClientWidth: function () { @@ -2930,6 +1093,14 @@ BI.Arrangement = BI.inherit(BI.Widget, { 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"); @@ -2948,41 +1119,21 @@ BI.Arrangement = BI.inherit(BI.Widget, { region.height = regions[id].height; } }); - BI.each(this.drops, 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; - var drop = this._createOneDrop(region); - this.drops[drop.id] = drop; - this.storeDrops[drop.id] = drop; - this._locationRegion(); BI.createWidget({ type: "bi.absolute", element: this.container, items: [region] }); - BI.createWidget({ - type: "bi.absolute", - element: this.droppable, - items: [drop] - }) }, _deleteRegionByName: function (name) { this.regions[name].el.setVisible(false); - this.drops[name].el.setVisible(false); delete this.regions[name]; - delete this.drops[name]; - this._locationRegion(); }, _setArrangeSize: function (size) { @@ -3009,15 +1160,15 @@ BI.Arrangement = BI.inherit(BI.Widget, { 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 (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; } @@ -3264,46 +1415,24 @@ BI.Arrangement = BI.inherit(BI.Widget, { return helper; }, - _start: function (cur) { + _start: function () { this.arrangement.setVisible(true); - this.droppable.setVisible(true); if (this.options.layoutType === BI.Arrangement.LAYOUT_TYPE.GRID) { this.block.setVisible(true); } - BI.each(this.drops, function (i, drop) { - drop.el.setVisible(false); - }); - if (cur) { - if (this.drops[cur]) { - this.drops[cur].el.setVisible(true); - } - } }, _stop: function () { this.arrangement.setVisible(false); - this.droppable.setVisible(false); this.block.setVisible(false); }, - getDirectRelativeRegions: function (name, direction) { - direction || (direction = ["top", "bottom", "left", "right"]); - var self = this, result = {}; - BI.each(direction, function (i, dir) { - result[dir] = self._getDirectRelativeRegions(name, [dir]); - }); - return result; - }, - ////公有操作//// setLayoutType: function (type) { var self = this, o = this.options; if (type !== o.layoutType) { o.layoutType = type; switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - this.relayout(); - break; case BI.Arrangement.LAYOUT_TYPE.FREE: break; case BI.Arrangement.LAYOUT_TYPE.GRID: @@ -3366,18 +1495,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { } var self = this, o = this.options; switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - var clone = this._cloneRegion(); - var regions = this._getEquivalentRelativeRegions(name); - if (regions.length > 0) { - BI.each(regions, function (i, region) { - BI.extend(clone[region.id], region); - }); - this._modifyRegion(clone); - } - this._deleteRegionByName(name); - this._populate(this.getAllRegions()); - return true; case BI.Arrangement.LAYOUT_TYPE.FREE: this._deleteRegionByName(name); this._populate(this.getAllRegions()); @@ -3395,47 +1512,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { var self = this, o = this.options; var flag = false; switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - var current = this.regions[name]; - if (size.width !== current.width) { - var regions = this._getInDirectRelativeRegions(name, ["right"]).right; - var lefts = regions.left || [], rights = regions.right || []; - var offset = size.width - current.width; - var cloned = this._cloneRegion(); - BI.some(lefts, function (i, left) { - var region = cloned[left.id]; - region.width = region.width + offset; - }); - BI.some(rights, function (i, right) { - var region = cloned[right.id]; - region.width = region.width - offset; - region.left = region.left + offset; - }); - if (this._test(cloned) && this._isArrangeFine(cloned)) { - this._modifyRegion(cloned); - flag = true; - } - } - if (size.height !== current.height) { - var regions = this._getInDirectRelativeRegions(name, ["bottom"]).bottom; - var tops = regions.top || [], bottoms = regions.bottom || []; - var offset = size.height - current.height; - var cloned = this._cloneRegion(); - BI.some(tops, function (i, top) { - var region = cloned[top.id]; - region.height = region.height + offset; - }); - BI.some(bottoms, function (i, bottom) { - var region = cloned[bottom.id]; - region.height = region.height - offset; - region.top = region.top + offset; - }); - if (this._test(cloned) && this._isArrangeFine(cloned)) { - this._modifyRegion(cloned); - flag = true; - } - } - break; case BI.Arrangement.LAYOUT_TYPE.FREE: var clone = this._cloneRegion(); BI.extend(clone[name], { @@ -3462,7 +1538,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { } break; } - this._locationRegion(); this._applyRegion(); return flag; }, @@ -3472,8 +1547,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { var insert, regions = [], cur; if (position.left < 0 || position.top < 0) { switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - break; case BI.Arrangement.LAYOUT_TYPE.FREE: break; case BI.Arrangement.LAYOUT_TYPE.GRID: @@ -3490,54 +1563,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { top: position.top + offset.top }; switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - if (BI.isEmpty(this.regions)) { - if (self._isPositionInBounds(position, { - left: 0, - top: 0, - width: this.element[0].clientWidth, - height: this.element[0].clientHeight - })) { - insert = { - left: 0, - top: 0, - width: this.element[0].clientWidth, - height: this.element[0].clientHeight - }; - } - } else { - if (BI.some(this.regions, function (id, region) { - if (self._isPositionInBounds(position, region)) { - var at = self._positionAt(position, region); - if (!at) { - insert = null; - } else { - insert = at.insert; - regions = at.regions; - } - cur = id; - return true; - } - })) { - } - else { - insert = null; - regions = []; - } - } - if (insert == null) { - this._stop(); - self.position = null; - break; - } - - this.position = { - insert: insert, - regions: regions - }; - this._setArrangeSize(insert); - this._start(cur); - break; case BI.Arrangement.LAYOUT_TYPE.FREE: var insert = { top: position.top < 0 ? 0 : position.top, @@ -3587,8 +1612,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { top: position.top + offset.top }); switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - break; case BI.Arrangement.LAYOUT_TYPE.FREE: BI.extend(this.regions[name], { left: position.left < 0 ? 0 : position.left, @@ -3638,56 +1661,13 @@ BI.Arrangement = BI.inherit(BI.Widget, { } }, - setContainerSize: function (size) { - var self = this, o = this.options; - var occupied = this._getRegionOccupied(); - switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - if (this._isArrangeFine()) { - var width = size.width, height = size.height; - var regions = this._cloneRegion(); - BI.each(regions, function (i, region) { - region.width = region.width / occupied.width * width; - //region.height = region.height / occupied.height * height; - }); - BI.each(regions, function (id, region) { - var lefts = self.locations[id].left; - var tops = self.locations[id].top; - var bottoms = self.locations[id].bottom; - var maxRegion; - if (lefts.length > 0) { - var ids = self._getRegionNames(lefts); - var rs = self._getRegionsByNames(ids); - maxRegion = self._getRegionOccupied(rs); - region.left = maxRegion.left + maxRegion.width / occupied.width * width; - } else { - region.left = 0; - } - if (bottoms.length === 0) { - region.height = height - region.top; - } - //if (tops.length > 0) { - // var ids = self._getRegionNames(tops); - // var rs = self._getRegionsByNames(ids); - // maxRegion = self._getRegionOccupied(rs); - // region.top = maxRegion.top + maxRegion.height / occupied.height * height; - //} - //if (tops.length === 0) { - // region.top = 0; - //} - }); - if (this._test(regions)) { - this._modifyRegion(regions); - this._applyRegion(); - } - } - break; - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - break; + setDropPosition: function (position) { + var self = this; + this.arrangement.setVisible(true); + this._setArrangeSize(position); + return function () { + self.arrangement.setVisible(false); } - this.resize(); }, scrollTo: function (scroll) { @@ -3702,7 +1682,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { } var occupied = this._applyContainer(); switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: case BI.Arrangement.LAYOUT_TYPE.FREE: if (this._isArrangeFine()) { var width = this.getClientWidth(); @@ -3754,51 +1733,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { var self = this, o = this.options; var occupied = this._applyContainer(); switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - if (this._isArrangeFine()) { - var width = this.getClientWidth(), height = this.getClientHeight(); - var isHeightAdjust = height > occupied.height; - var regions = this._cloneRegion(); - BI.each(regions, function (i, region) { - region.width = region.width / occupied.width * width; - //if (isHeightAdjust) { - // region.height = region.height / occupied.height * height; - //} - }); - BI.each(regions, function (id, region) { - var lefts = self.locations[id].left; - var tops = self.locations[id].top; - var bottoms = self.locations[id].bottom; - var maxRegion; - if (lefts.length > 0) { - var ids = self._getRegionNames(lefts); - var rs = self._getRegionsByNames(ids); - maxRegion = self._getRegionOccupied(rs); - region.left = maxRegion.left + maxRegion.width / occupied.width * width; - } else { - region.left = 0; - } - if (tops.length === 0) { - region.top = 0; - } - if (isHeightAdjust && bottoms.length === 0) { - region.height = height - region.top; - } - //if (isHeightAdjust && tops.length > 0) { - // var ids = self._getRegionNames(tops); - // var rs = self._getRegionsByNames(ids); - // maxRegion = self._getRegionOccupied(rs); - // region.top = maxRegion.top + maxRegion.height / occupied.height * height; - //} - }); - if (this._test(regions)) { - this._modifyRegion(regions); - this._applyRegion(); - } - } else { - this.relayout(); - } - break; case BI.Arrangement.LAYOUT_TYPE.FREE: break; case BI.Arrangement.LAYOUT_TYPE.GRID: @@ -3815,15 +1749,15 @@ BI.Arrangement = BI.inherit(BI.Widget, { relayout: function () { var self = this, o = this.options; - if (o.isNeedReLayout === false) { - return; - } - //var occupied = this._applyContainer(); switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: + 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 clone = BI.toArray(this._cloneRegion()); + 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; @@ -3831,97 +1765,50 @@ BI.Arrangement = BI.inherit(BI.Widget, { return r1.top - r2.top; }); var count = clone.length; - var cols = 3, rows = Math.floor((count - 1) / 3 + 1); + 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 / 3), col = i % 3; + var row = Math.floor(i / 4), col = i % 4; BI.extend(region, { - top: row * 380, + top: row * perHeight * 6, left: col * w, width: w, - height: 380 + height: perHeight * 6 }); if (!store[row]) { store[row] = {}; } store[row][col] = region; }); - //非3的倍数 - if (count % 3 !== 0) { - var lasts = store[rows - 1]; - var perWidth = width / (count % 3); - BI.each(lasts, function (i, region) { - BI.extend(region, { - left: BI.parseInt(i) * perWidth, - width: perWidth - }); - }); - } + //非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); - this.resize(); } } else { this.resize(); } break; - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - 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 = 3, rows = Math.floor((count - 1) / 3 + 1); - var w = width / cols, h = height / rows; - var store = {}; - BI.each(clone, function (i, region) { - var row = Math.floor(i / 3), col = i % 3; - BI.extend(region, { - top: row * perHeight * 6, - left: col * w, - width: w, - height: perHeight * 6 - }); - if (!store[row]) { - store[row] = {}; - } - store[row][col] = region; - }); - //非3的倍数 - if (count % 3 !== 0) { - var lasts = store[rows - 1]; - var perWidth = width / (count % 3); - 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); - } - break; } }, _populate: function (items) { this._stop(); this._calculateRegions(items); - this._locationRegion(); this._applyRegion(); }, @@ -3929,9 +1816,7 @@ BI.Arrangement = BI.inherit(BI.Widget, { var self = this; BI.each(this.regions, function (name, region) { self.regions[name].el.setVisible(false); - self.drops[name].el.setVisible(false); delete self.regions[name]; - delete self.drops[name]; }); this._populate(items); this._renderRegion(); @@ -3942,9 +1827,8 @@ BI.extend(BI.Arrangement, { PORTION: 32, H_PORTION: 18, LAYOUT_TYPE: { - ADAPTIVE: 0, - FREE: 1, - GRID: 2 + GRID: 0, + FREE: 1 } }); BI.shortcut('bi.arrangement', BI.Arrangement);/** @@ -7184,9 +5068,7 @@ BI.InteractiveArrangement = BI.inherit(BI.Widget, { return BI.extend(BI.InteractiveArrangement.superclass._defaultConfig.apply(this, arguments), { baseCls: "bi-interactive-arrangement", resizable: true, - isNeedReLayout: true, - isNeedResizeContainer: true, - layoutType: BI.Arrangement.LAYOUT_TYPE.FREE, + layoutType: BI.Arrangement.LAYOUT_TYPE.GRID, items: [] }); }, @@ -7198,8 +5080,6 @@ BI.InteractiveArrangement = BI.inherit(BI.Widget, { type: "bi.adaptive_arrangement", element: this, resizable: o.resizable, - isNeedReLayout: o.isNeedReLayout, - isNeedResizeContainer: o.isNeedResizeContainer, layoutType: o.layoutType, items: o.items }); @@ -7611,7 +5491,6 @@ BI.InteractiveArrangement = BI.inherit(BI.Widget, { var self = this; this.stopDraw(); switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: case BI.Arrangement.LAYOUT_TYPE.FREE: var other = this._getRegionExcept(name); var left = this._leftAlign(position, size, other); @@ -7645,10 +5524,6 @@ BI.InteractiveArrangement = BI.inherit(BI.Widget, { } }, - getDirectRelativeRegions: function (name, direction) { - return this.arrangement.getDirectRelativeRegions(name, direction); - }, - addRegion: function (region, position) { this.stopDraw(); return this.arrangement.addRegion(region, position); @@ -7668,8 +5543,6 @@ BI.InteractiveArrangement = BI.inherit(BI.Widget, { this.stopDraw(); if (position.left > 0 && position.top > 0) { switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - break; case BI.Arrangement.LAYOUT_TYPE.FREE: position = this.getPosition(null, position, size); this.draw(position, size); @@ -7685,8 +5558,6 @@ BI.InteractiveArrangement = BI.inherit(BI.Widget, { setRegionPosition: function (name, position) { if (position.left > 0 && position.top > 0) { switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - break; case BI.Arrangement.LAYOUT_TYPE.FREE: position = this.getPosition(name, position); break; @@ -7697,6 +5568,18 @@ BI.InteractiveArrangement = BI.inherit(BI.Widget, { return this.arrangement.setRegionPosition(name, position); }, + setDropPosition: function (position) { + return this.arrangement.setDropPosition(position); + }, + + scrollInterval: function () { + this.arrangement.scrollInterval.apply(this.arrangement, arguments); + }, + + scrollEnd: function () { + this.arrangement.scrollEnd.apply(this.arrangement, arguments); + }, + scrollTo: function (scroll) { this.arrangement.scrollTo(scroll); }, diff --git a/src/widget/adaptivearrangement/adaptivearrangement.js b/src/widget/adaptivearrangement/adaptivearrangement.js index e446c4ed0..4eabf7e9d 100644 --- a/src/widget/adaptivearrangement/adaptivearrangement.js +++ b/src/widget/adaptivearrangement/adaptivearrangement.js @@ -17,8 +17,6 @@ BI.AdaptiveArrangement = BI.inherit(BI.Widget, { return BI.extend(BI.AdaptiveArrangement.superclass._defaultConfig.apply(this, arguments), { baseCls: "bi-adaptive-arrangement", resizable: true, - isNeedReLayout: true, - isNeedResizeContainer: true, layoutType: BI.Arrangement.LAYOUT_TYPE.FREE, items: [] }); @@ -30,73 +28,18 @@ BI.AdaptiveArrangement = BI.inherit(BI.Widget, { this.arrangement = BI.createWidget({ type: "bi.arrangement", element: this, - isNeedReLayout: o.isNeedReLayout, layoutType: o.layoutType, items: o.items }); this.arrangement.on(BI.Arrangement.EVENT_SCROLL, function () { self.fireEvent(BI.AdaptiveArrangement.EVENT_SCROLL, arguments); }); - if (o.isNeedResizeContainer) { - - var isResizing = false; - var needEnd = false; - var height; - var interval; - var startSize; - var resize = function (e, ui) { - if (isResizing) { - return; - } - isResizing = true; - height = ui.size.height; - interval = setInterval(function () { - height += 40; - self.arrangement.setContainerSize({ - width: ui.size.width, - height: height - }); - self.arrangement.scrollTo({top: height}); - }, 300); - }; - this.arrangement.container.element.resizable({ - handles: "s", - minWidth: 100, - minHeight: 20, - helper: "bi-resizer", - autoHide: true, - start: function (e, ui) { - startSize = BI.clone(ui.size); - }, - resize: function (e, ui) { - if (ui.size.height >= startSize.height - 10) { - resize(e, ui); - } else { - interval && clearInterval(interval); - needEnd = true; - } - }, - stop: function (e, ui) { - var size = ui.size; - if (isResizing && !needEnd) { - size.height = height; - } - self.arrangement.setContainerSize(ui.size); - needEnd = false; - isResizing = false; - startSize = null; - interval && clearInterval(interval); - self.fireEvent(BI.AdaptiveArrangement.EVENT_RESIZE); - } - }); - this._setLayoutType(o.layoutType); - } this.zIndex = 0; BI.each(o.items, function (i, item) { self._initResizable(item.el); }); - this.element.click(function (e) { + this.element.mousedown(function (e) { BI.each(self.getAllRegions(), function (i, region) { if (!region.el.element.__isMouseInBounds__(e)) { region.el.element.removeClass("selected"); @@ -129,159 +72,65 @@ BI.AdaptiveArrangement = BI.inherit(BI.Widget, { item.element.mousedown(function () { self._setSelect(item) }); - o.resizable && item.element.resizable({ - handles: "e, s, se", - minWidth: 20, - minHeight: 20, - autoHide: true, - helper: "bi-resizer", - start: function () { - item.element.css("zIndex", ++self.zIndex); - self.fireEvent(BI.AdaptiveArrangement.EVENT_ELEMENT_START_RESIZE); - }, - resize: function (e, ui) { - // self._resize(item.attr("id"), ui.size); - self._resize(item.attr("id"), ui.size); - self.fireEvent(BI.AdaptiveArrangement.EVENT_ELEMENT_RESIZE, item.attr("id"), ui.size); - }, - stop: function (e, ui) { - self._stopResize(item.attr("id"), ui.size); - self.fireEvent(BI.AdaptiveArrangement.EVENT_ELEMENT_STOP_RESIZE, item.attr("id"), ui.size); - self.fireEvent(BI.AdaptiveArrangement.EVENT_RESIZE); - } - }); + // o.resizable && item.element.resizable({ + // handles: "e, s, se", + // minWidth: 20, + // minHeight: 20, + // autoHide: true, + // helper: "bi-resizer", + // start: function () { + // item.element.css("zIndex", ++self.zIndex); + // self.fireEvent(BI.AdaptiveArrangement.EVENT_ELEMENT_START_RESIZE); + // }, + // resize: function (e, ui) { + // // self._resize(item.attr("id"), ui.size); + // self._resize(item.attr("id"), e, ui.size, ui.position); + // }, + // stop: function (e, ui) { + // self._stopResize(item.attr("id"), ui.size); + // self.fireEvent(BI.AdaptiveArrangement.EVENT_ELEMENT_STOP_RESIZE, item.attr("id"), ui.size); + // self.fireEvent(BI.AdaptiveArrangement.EVENT_RESIZE); + // } + // }); }, - _resize: function (name, size) { - var self = this; - switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - break; - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - this.setRegionSize(name, size); - break; - } - }, - - _stopResize: function (name, size) { - var self = this; - switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - this.setRegionSize(name, { - width: size.width, - height: size.height - }); - break; - case BI.Arrangement.LAYOUT_TYPE.FREE: - this.setRegionSize(name, size); - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - this.setRegionSize(name, size); - break; - } - }, - - //检查宽高是否规范 - _checkRegionSize: function (name, size) { - var self = this; - switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - var newSize = {}; - var leftid, rightid, topid, bottomid; - var region = this.getRegionByName(name); - var rs = this.arrangement._getInDirectRelativeRegions(name, ["right"]).right; - var bs = this.arrangement._getInDirectRelativeRegions(name, ["bottom"]).bottom; - if (rs.left.length > 0) { - topid = BI.first(rs.left).id; - bottomid = BI.last(rs.left).id; - } - if (bs.top.length > 0) { - leftid = BI.first(bs.top).id; - rightid = BI.last(bs.top).id; - } - if (this.arrangement._isEqual(region.width, size.width)) { - topid = name; - bottomid = name; - } - if (this.arrangement._isEqual(region.height, size.height)) { - leftid = name; - rightid = name; - } - var tops = topid ? this.getDirectRelativeRegions(topid, ["top"]).top : []; - var bottoms = bottomid ? this.getDirectRelativeRegions(bottomid, ["bottom"]).bottom : []; - var lefts = leftid ? this.getDirectRelativeRegions(leftid, ["left"]).left : []; - var rights = rightid ? this.getDirectRelativeRegions(rightid, ["right"]).right : []; - if (region.width !== size.width) { - if (rights.length === 0) {//最右边的组件不能调整宽度 - newSize.width = region.width; - } else { - var finded = BI.find(tops.concat(bottoms), function (i, r) { - r = self.getRegionByName(r.id); - return Math.abs(size.width + region.left - (r.left + r.width)) <= 3; - }); - if (finded) { - finded = this.getRegionByName(finded.id); - newSize.width = finded.left + finded.width - region.left; - } else { - newSize.width = size.width; - } - } - } else { - newSize.width = size.width; - } - if (region.height !== size.height) { - if (bottoms.length === 0) { - newSize.height = region.height; - } else { - var finded = BI.find(lefts.concat(rights), function (i, r) { - r = self.getRegionByName(r.id); - return Math.abs(size.height + region.top - (r.top + r.height)) <= 3; - }); - if (finded) { - finded = this.getRegionByName(finded.id); - newSize.height = finded.top + finded.height - region.top; - } else { - newSize.height = size.height; - } - } - } else { - newSize.height = size.height; - } - return newSize; - case BI.Arrangement.LAYOUT_TYPE.FREE: - return size; - case BI.Arrangement.LAYOUT_TYPE.GRID: - return size; - } - }, + // _resize: function (name, e, size, position) { + // var self = this; + // this.scrollInterval(e, false, true, function (changedSize) { + // size.width += changedSize.offsetX; + // size.height += changedSize.offsetY; + // var containerWidth = self.arrangement.container.element.width(); + // var containerHeight = self.arrangement.container.element.height(); + // self.arrangement.container.element.width(containerWidth + changedSize.offsetX); + // self.arrangement.container.element.height(containerHeight + changedSize.offsetY); + // switch (self.getLayoutType()) { + // case BI.Arrangement.LAYOUT_TYPE.FREE: + // break; + // case BI.Arrangement.LAYOUT_TYPE.GRID: + // self.setRegionSize(name, size); + // break; + // } + // self.fireEvent(BI.AdaptiveArrangement.EVENT_ELEMENT_RESIZE, name, size); + // }); + // }, + // + // _stopResize: function (name, size) { + // var self = this; + // this.scrollEnd(); + // switch (this.getLayoutType()) { + // case BI.Arrangement.LAYOUT_TYPE.FREE: + // this.setRegionSize(name, size); + // break; + // case BI.Arrangement.LAYOUT_TYPE.GRID: + // this.setRegionSize(name, size); + // break; + // } + // }, _getScrollOffset: function () { return this.arrangement._getScrollOffset(); }, - _setLayoutType: function (type) { - try { - //BI.nextTick(function () { - switch (type) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - $(">.ui-resizable-s", this.arrangement.container.element).css("zIndex", ""); - break; - case BI.Arrangement.LAYOUT_TYPE.FREE: - $(">.ui-resizable-s", this.arrangement.container.element).css("zIndex", "-1"); - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - $(">.ui-resizable-s", this.arrangement.container.element).css("zIndex", "-1"); - break; - } - this.arrangement.container.element.resizable("option", "disabled", type === BI.Arrangement.LAYOUT_TYPE.FREE); - //}); - } catch (e) { - - } - }, - getClientWidth: function () { return this.arrangement.getClientWidth(); }, @@ -290,97 +139,13 @@ BI.AdaptiveArrangement = BI.inherit(BI.Widget, { return this.arrangement.getClientHeight(); }, - getDirectRelativeRegions: function (name, direction) { - return this.arrangement.getDirectRelativeRegions(name, direction); - }, - addRegion: function (region, position) { this._initResizable(region.el); this._setSelect(region.el); var self = this, flag; var old = this.arrangement.getAllRegions(); - if (BI.isNotNull(this.position)) { - switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - var type = this.position.type; - var current = this.position.region; - switch (type) { - case "top-gap": - var t = this.arrangement._getEquivalentRelativeRegions(current.id, ["top"])[0]; - current = this.getRegionByName(t.id); - break; - case "bottom-gap": - break; - } - var id = BI.UUID(); - var insert = this.position.insert; - if (insert.height > 0) { - var clone = this.arrangement._cloneRegion(); - //找到最下面的组件 - var occupied = this.arrangement._getRegionOccupied(); - var bottomRegions = []; - BI.each(clone, function (i, region) { - if (self.arrangement._isEqual(region.top + region.height, occupied.top + occupied.height)) { - bottomRegions.push(region); - } - }); - var bs = this.arrangement._getInDirectRelativeRegions(current.id, ["bottom"]).bottom; - var seen = [current.id]; - var bottoms = bs.bottom; - var occ = this.arrangement._getRegionOccupied(bottoms); - clone[id] = BI.extend({}, region, { - left: occ.left, - width: occ.width, - top: current.top + current.height, - height: insert.height - }); - while (bottoms.length > 0) { - BI.each(bottoms, function (i, bottom) { - seen.push(bottom.id); - var r = self.getRegionByName(bottom.id); - BI.extend(clone[bottom.id], { - top: r.top + insert.height - }); - }); - var t = []; - BI.each(bottoms, function (i, bottom) { - var n = self.arrangement._getInDirectRelativeRegions(bottom.id, ["bottom"]).bottom; - BI.each(n.top, function (i, region) { - if (!seen.contains(region.id)) { - seen.push(region.id); - var r = self.getRegionByName(region.id); - BI.extend(clone[region.id], { - height: r.height + insert.height - }); - } - }); - t = t.concat(n.bottom); - }); - t = BI.uniq(t, function (i, region) { - return region.id; - }); - bottoms = t; - } - BI.each(bottomRegions, function (i, region) { - if (!seen.contains(region.id)) { - region.height = region.height + insert.height; - } - }); - this.arrangement.populate(BI.toArray(clone)); - this.arrangement.resize(); - flag = true; - } - break; - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - break; - } - this.position = null; - } else { - if (flag = this.arrangement.addRegion(region, position)) { - this._old = old; - } + if (flag = this.arrangement.addRegion(region, position)) { + this._old = old; } return flag; }, @@ -394,13 +159,12 @@ BI.AdaptiveArrangement = BI.inherit(BI.Widget, { this._old = this.getAllRegions(); this.relayout(); } - return true; + return flag; }, setRegionSize: function (name, size) { var flag; var old = this.getAllRegions(); - size = this._checkRegionSize(name, size); if (flag = this.arrangement.setRegionSize(name, size)) { this._old = old; } @@ -409,55 +173,114 @@ BI.AdaptiveArrangement = BI.inherit(BI.Widget, { setPosition: function (position, size) { var self = this; - var at = this.arrangement.setPosition(position, size); - this.position = null; - if (!at) { - switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - if (position.left < 0 || position.top < 0) { - return null; + return this.arrangement.setPosition(position, size); + }, + + setRegionPosition: function (name, position) { + var region = this.getRegionByName(name); + return this.arrangement.setRegionPosition(name, position); + }, + + setDropPosition: function (position) { + return this.arrangement.setDropPosition(position); + }, + + scrollInterval: function (e, isBorderScroll, isOverflowScroll, cb) { + var self = this; + var map = { + top: [-1, 0], + bottom: [1, 0], + left: [0, -1], + right: [0, 1] + }; + var clientSize = this.element.bounds(); + + function scrollTo(direction, callback) { + if (direction === "") { + self.lastActiveRegion = ""; + if (self._scrollInterval) { + clearInterval(self._scrollInterval); + self._scrollInterval = null; + } + return; + } + if (self.lastActiveRegion !== direction) { + self.lastActiveRegion = direction; + if (self._scrollInterval) { + clearInterval(self._scrollInterval); + self._scrollInterval = null; + } + self._scrollInterval = setInterval(function () { + var offset = self._getScrollOffset(); + var t = offset.top + map[direction][0] * 40; + var l = offset.left + map[direction][1] * 40; + if (t < 0 || l < 0) { + return; } - var offset = this.arrangement._getScrollOffset(); - position = { - left: position.left + offset.left, - top: position.top + offset.top - }; - BI.some(this.getAllRegions(), function (id, region) { - if (self.arrangement._isPositionInBounds(position, region)) { - var at = self.arrangement._positionAt(position, region); - if (at.type === "top-gap" || at.type === "bottom-gap") { - self.arrangement._setArrangeSize({ - top: region.top - 8 + (at.type === "bottom-gap" ? region.height : 0), - left: region.left, - width: region.width, - height: 16 - }); - self.position = { - insert: { - height: (size || {}).height - }, - type: at.type, - region: region - }; - self.arrangement._start(); - } - return true; - } + callback({ + offsetX: map[direction][1] * 40, + offsetY: map[direction][0] * 40 + }); + self.scrollTo({ + top: t, + left: l }); - break; - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - break; + }, 300); + } + } + + cb({ + offsetX: 0, + offsetY: 0 + }); + var offset = this.element.offset(); + var p = { + left: e.pageX - offset.left, + top: e.pageY - offset.top + }; + //向上滚 + if (isBorderScroll && p.top >= 0 && p.top <= 30) { + scrollTo("top", cb) + } + //向下滚 + else if (isBorderScroll && p.top >= clientSize.height - 30 && p.top <= clientSize.height) { + scrollTo("bottom", cb) + } + //向左滚 + else if (isBorderScroll && p.left >= 0 && p.left <= 30) { + scrollTo("left", cb) + } + //向右滚 + else if (isBorderScroll && p.left >= clientSize.width - 30 && p.left <= clientSize.width) { + scrollTo("right", cb) + } else { + if (isOverflowScroll === true) { + if (p.top < 0) { + scrollTo("top", cb); + } + else if (p.top > clientSize.height) { + scrollTo("bottom", cb); + } + else if (p.left < 0) { + scrollTo("left", cb); + } + else if (p.left > clientSize.width) { + scrollTo("right", cb); + } else { + scrollTo("", cb); + } + } else { + scrollTo("", cb); } } - return this.position || at; }, - setRegionPosition: function (name, position) { - var region = this.getRegionByName(name); - region.el.element.css("zIndex", ++this.zIndex); - return this.arrangement.setRegionPosition(name, position); + scrollEnd: function () { + this.lastActiveRegion = ""; + if (this._scrollInterval) { + clearInterval(this._scrollInterval); + this._scrollInterval = null; + } }, scrollTo: function (scroll) { @@ -478,7 +301,6 @@ BI.AdaptiveArrangement = BI.inherit(BI.Widget, { setLayoutType: function (type) { var self = this; - this._setLayoutType(type); this.arrangement.setLayoutType(type); }, @@ -514,17 +336,6 @@ BI.AdaptiveArrangement = BI.inherit(BI.Widget, { self._initResizable(item.el); }); this.arrangement.populate(items); - switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - BI.nextTick(function () { - self.arrangement.resize(); - }); - break; - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - break; - } } }); BI.AdaptiveArrangement.EVENT_ELEMENT_START_RESIZE = "AdaptiveArrangement.EVENT_ELEMENT_START_RESIZE"; diff --git a/src/widget/arrangement/arrangement.block.js b/src/widget/arrangement/arrangement.block.js index fc6a43d82..e28d7324b 100644 --- a/src/widget/arrangement/arrangement.block.js +++ b/src/widget/arrangement/arrangement.block.js @@ -11,12 +11,6 @@ BI.ArrangementBlock = BI.inherit(BI.Widget, { return BI.extend(BI.ArrangementBlock.superclass._defaultConfig.apply(this, arguments), { baseCls: "bi-arrangement-block bi-mask" }); - }, - - _init: function () { - BI.ArrangementBlock.superclass._init.apply(this, arguments); - var self = this, o = this.options; - } }); BI.shortcut('bi.arrangement_block', BI.ArrangementBlock); \ No newline at end of file diff --git a/src/widget/arrangement/arrangement.droppable.js b/src/widget/arrangement/arrangement.droppable.js index 9ec33ee0c..13acb6f4e 100644 --- a/src/widget/arrangement/arrangement.droppable.js +++ b/src/widget/arrangement/arrangement.droppable.js @@ -11,12 +11,6 @@ BI.ArrangementDroppable = BI.inherit(BI.Widget, { return BI.extend(BI.ArrangementDroppable.superclass._defaultConfig.apply(this, arguments), { baseCls: "bi-arrangement-droppable bi-resizer" }); - }, - - _init: function () { - BI.ArrangementDroppable.superclass._init.apply(this, arguments); - var self = this, o = this.options; - } }); BI.shortcut('bi.arrangement_droppable', BI.ArrangementDroppable); \ No newline at end of file diff --git a/src/widget/arrangement/arrangement.js b/src/widget/arrangement/arrangement.js index 858acdb4b..c2a7754e4 100644 --- a/src/widget/arrangement/arrangement.js +++ b/src/widget/arrangement/arrangement.js @@ -10,8 +10,7 @@ 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.FREE, - isNeedReLayout: true, + layoutType: BI.Arrangement.LAYOUT_TYPE.GRID, items: [] }); }, @@ -28,20 +27,9 @@ BI.Arrangement = BI.inherit(BI.Widget, { type: "bi.arrangement_block", invisible: true }); - this.droppable = BI.createWidget({ - type: "bi.layout", - cls: "arrangement-drop-container", - invisible: true - }); this.container = BI.createWidget({ type: "bi.absolute", - items: o.items.concat([this.block, this.arrangement, { - el: this.droppable, - left: 0, - right: 0, - top: 0, - bottom: 0 - }]) + items: o.items.concat([this.block, this.arrangement]) }); this.scrollContainer = BI.createWidget({ @@ -66,9 +54,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { items: [this.scrollContainer] }); this.regions = {}; - this.locations = {}; - this.drops = {}; - this.storeDrops = {}; if (o.items.length > 0) { BI.nextTick(function () { self.populate(o.items); @@ -80,48 +65,9 @@ BI.Arrangement = BI.inherit(BI.Widget, { _calculateRegions: function (items) { var self = this, o = this.options; this.regions = {}; - this.drops = {}; BI.each(items, function (i, item) { var region = self._createOneRegion(item); self.regions[region.id] = region; - var drop = self._createOneDrop(region); - self.drops[drop.id] = drop; - self.storeDrops[drop.id] = drop; - }); - }, - - //定方位 - _locationRegion: function () { - var self = this, o = this.options; - this.locations = {}; - var reg = []; - BI.each(this.regions, function (id, region) { - var t = new BI.Region(region.left, region.top, region.width, region.height); - t.id = id; - reg.push(t); - self.locations[id] = {top: [], left: [], right: [], bottom: []}; - }); - BI.each(reg, function (i, dim) { - var topRegion = new BI.Region(dim.x, 0, dim.w, dim.y), - bottomRegion = new BI.Region(dim.x, dim.y + dim.h, dim.w, BI.MAX), - leftRegion = new BI.Region(0, dim.y, dim.x, dim.h), - rightRegion = new BI.Region(dim.x + dim.w, dim.y, BI.MAX, dim.h); - BI.each(reg, function (j, tar) { - if (i !== j) { - if (tar.isIntersects(topRegion) && self._isLessThanEqual(tar.y + tar.h, dim.y)) { - self.locations[dim.id].top.push(self.regions[tar.id]); - } - if (tar.isIntersects(bottomRegion) && self._isMoreThanEqual(tar.y, dim.y + dim.h)) { - self.locations[dim.id].bottom.push(self.regions[tar.id]); - } - if (tar.isIntersects(leftRegion) && self._isLessThanEqual(tar.x + tar.w, dim.x)) { - self.locations[dim.id].left.push(self.regions[tar.id]); - } - if (tar.isIntersects(rightRegion) && self._isMoreThanEqual(tar.x, dim.x + dim.w)) { - self.locations[dim.id].right.push(self.regions[tar.id]); - } - } - }); }); }, @@ -145,371 +91,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { return num1 >= num2 || this._isEqual(num1, num2); }, - ////方法//// - _isPositionInBounds: function (position, bound) { - var region = new BI.Region(bound.left, bound.top, bound.width, bound.height); - return region.isPointInside(position.left, position.top); - }, - - //获取某区域等量相关联的区域 - _getEquivalentRelativeRegions: function (name, direction) { - var self = this; - direction || (direction = ["top", "bottom", "left", "right"]); - var result = []; - var target = this.regions[name]; - var tops = this.locations[name].top; - var bottoms = this.locations[name].bottom; - var lefts = this.locations[name].left; - var rights = this.locations[name].right; - var finded = direction.contains("top") && BI.some(tops, function (i, region) { - if (self._isEqual(region.top + region.height, target.top) && self._isEqual(region.left, target.left) && self._isEqual(region.width, target.width)) { - var clone = BI.clone(region); - clone.height = region.height + target.height; - result.push(clone); - return true; - } - }); - if (!finded) { - finded = direction.contains("bottom") && BI.some(bottoms, function (i, region) { - if (self._isEqual(target.top + target.height, region.top) && self._isEqual(region.left, target.left) && self._isEqual(region.width, target.width)) { - var clone = BI.clone(region); - clone.top = region.top - target.height; - clone.height = region.height + target.height; - result.push(clone); - return true; - } - }); - if (!finded) { - finded = direction.contains("left") && BI.some(lefts, function (i, region) { - if (self._isEqual(region.left + region.width, target.left) && self._isEqual(region.top, target.top) && self._isEqual(region.height, target.height)) { - var clone = BI.clone(region); - clone.width = region.width + target.width; - result.push(clone); - return true; - } - }); - if (!finded) { - finded = direction.contains("right") && BI.some(rights, function (i, region) { - if (self._isEqual(target.left + target.width, region.left) && self._isEqual(region.top, target.top) && self._isEqual(region.height, target.height)) { - var clone = BI.clone(region); - clone.left = region.left - target.width; - clone.width = region.width + target.width; - result.push(clone); - return true; - } - }); - if (!finded) { - var findTopRegions = [], findBottomRegions = []; - direction.contains("top") && BI.each(tops, function (i, region) { - if (self._isEqual(region.top + region.height, target.top) - && self._isMoreThanEqual(region.left, target.left) - && self._isLessThanEqual(region.left + region.width, target.left + target.width)) { - findTopRegions.push(region); - } - }); - direction.contains("bottom") && BI.each(bottoms, function (i, region) { - if (self._isEqual(target.top + target.height, region.top) - && self._isMoreThanEqual(region.left, target.left) - && self._isLessThanEqual(region.left + region.width, target.left + target.width)) { - findBottomRegions.push(region); - } - }); - var topValid = isRegionsValid(findTopRegions, "top"), - bottomValid = isRegionsValid(findBottomRegions, "bottom"); - if (topValid && bottomValid) { - BI.each(findTopRegions, function (i, region) { - var clone = BI.clone(region); - clone.height = region.height + target.height / 2; - result.push(clone); - }); - BI.each(findBottomRegions, function (i, region) { - var clone = BI.clone(region); - clone.top = region.top - target.height / 2; - clone.height = region.height + target.height / 2; - result.push(clone); - }); - } else if (topValid) { - BI.each(findTopRegions, function (i, region) { - var clone = BI.clone(region); - clone.height = region.height + target.height; - result.push(clone); - }); - } else if (bottomValid) { - BI.each(findBottomRegions, function (i, region) { - var clone = BI.clone(region); - clone.top = region.top - target.height; - clone.height = region.height + target.height; - result.push(clone); - }); - } - if (!topValid && !bottomValid) { - var findLeftRegions = [], findRightRegions = []; - direction.contains("left") && BI.each(lefts, function (i, region) { - if (self._isEqual(region.left + region.width, target.left) - && self._isMoreThanEqual(region.top, target.top) - && self._isLessThanEqual(region.top + region.height, target.top + target.height)) { - findLeftRegions.push(region); - } - }); - direction.contains("right") && BI.each(rights, function (i, region) { - if (self._isEqual(target.left + target.width, region.left) - && self._isMoreThanEqual(region.top, target.top) - && self._isLessThanEqual(region.top + region.height, target.top + target.height)) { - findRightRegions.push(region); - } - }); - var leftValid = isRegionsValid(findLeftRegions, "left"), - rightValid = isRegionsValid(findRightRegions, "right"); - if (leftValid && rightValid) { - BI.each(findLeftRegions, function (i, region) { - var clone = BI.clone(region); - clone.width = region.width + target.width / 2; - result.push(clone); - }); - BI.each(findRightRegions, function (i, region) { - var clone = BI.clone(region); - clone.left = region.left - target.width / 2; - clone.width = region.width + target.width / 2; - result.push(clone); - }); - } else if (leftValid) { - BI.each(findLeftRegions, function (i, region) { - var clone = BI.clone(region); - clone.width = region.width + target.width; - result.push(clone); - }); - } else if (rightValid) { - BI.each(findRightRegions, function (i, region) { - var clone = BI.clone(region); - clone.left = region.left - target.width; - clone.width = region.width + target.width; - result.push(clone); - }); - } - - //上下左右都不可行 - if (!leftValid && !rightValid) { - - } - } - } - } - } - } - return result; - function isRegionsValid(regions, dir) { - var occupied = self._getRegionOccupied(regions); - switch (dir) { - case "top": - case "bottom": - return self._isEqual(occupied.left, target.left) && self._isEqual(occupied.width, target.width); - case "left": - case "right": - return self._isEqual(occupied.top, target.top) && self._isEqual(occupied.height, target.height); - } - return false; - } - }, - - //获取某区域直接相关联的区域 - _getDirectRelativeRegions: function (name, direction) { - var self = this; - direction || (direction = ["top", "bottom", "left", "right"]); - var result = []; - var target = this.regions[name]; - var tops = this.locations[name].top; - var bottoms = this.locations[name].bottom; - var lefts = this.locations[name].left; - var rights = this.locations[name].right; - var finded = direction.contains("top") && BI.some(tops, function (i, region) { - if (self._isEqual(region.top + region.height, target.top) - && ((self._isMoreThanEqual(region.left, target.left) && self._isLessThan(region.left, target.left + target.width)) - || (self._isMoreThan(region.left + region.width, target.left) && self._isLessThanEqual(region.left + region.width, target.left + target.width)) - || (self._isLessThan(region.left, target.left) && self._isMoreThan(region.left + region.width, target.left + target.width)))) { - var clone = BI.clone(region); - clone.height = region.height + target.height; - result.push(clone); - } - }); - if (!finded) { - finded = direction.contains("bottom") && BI.some(bottoms, function (i, region) { - if (self._isEqual(target.top + target.height, region.top) - && ((self._isMoreThanEqual(region.left, target.left) && self._isLessThan(region.left, target.left + target.width)) - || (self._isMoreThan(region.left + region.width, target.left) && self._isLessThanEqual(region.left + region.width, target.left + target.width)) - || (self._isLessThan(region.left, target.left) && self._isMoreThan(region.left + region.width, target.left + target.width)))) { - var clone = BI.clone(region); - clone.top = region.top - target.height; - clone.height = region.height + target.height; - result.push(clone); - } - }); - if (!finded) { - finded = direction.contains("left") && BI.some(lefts, function (i, region) { - if (self._isEqual(region.left + region.width, target.left) - && ((self._isMoreThanEqual(region.top, target.top) && self._isLessThan(region.top, target.top + target.height)) - || (self._isMoreThan(region.top + region.height, target.top) && self._isLessThanEqual(region.top + region.height, target.top + target.height)) - || (self._isLessThan(region.top, target.top) && self._isMoreThan(region.top + region.height, target.top + target.height)))) { - var clone = BI.clone(region); - clone.width = region.width + target.width; - result.push(clone); - } - }); - if (!finded) { - finded = direction.contains("right") && BI.some(rights, function (i, region) { - if (self._isEqual(target.left + target.width, region.left) - && ((self._isMoreThanEqual(region.top, target.top) && self._isLessThan(region.top, target.top + target.height)) - || (self._isMoreThan(region.top + region.height, target.top) && self._isLessThanEqual(region.top + region.height, target.top + target.height)) - || (self._isLessThan(region.top, target.top) && self._isMoreThan(region.top + region.height, target.top + target.height)))) { - var clone = BI.clone(region); - clone.left = region.left - target.width; - clone.width = region.width + target.width; - result.push(clone); - } - }); - } - } - } - return result; - }, - - //获取间接相关联的区域,即调整name区域后需要附带调整的所有相关区域(包括自身) - _getInDirectRelativeRegions: function (name, direction) { - var self = this, dict = ["top", "left", "right", "bottom"]; - var result = {}; - direction || (direction = dict); - function recursion(regions, dir, store, cache) { - BI.each(regions, function (i, region) { - if (cache[region.id]) { - return; - } - cache[region.id] = true; - if (!store[dict[3 - dir]]) { - store[dict[3 - dir]] = []; - } - store[dict[3 - dir]].push(region); - recursion(self._getDirectRelativeRegions(region.id, [dict[dir]]), 3 - dir, store, cache); - }) - } - - if (direction.contains("top")) { - var store = {}, cache = {}; - recursion([this.regions[name]], dict.indexOf("top"), store, cache); - store["top"] = BI.sortBy(store["top"], "left"); - store["bottom"] = BI.sortBy(store["bottom"], "left"); - result["top"] = store; - } - if (direction.contains("bottom")) { - var store = {}, cache = {}; - recursion([this.regions[name]], dict.indexOf("bottom"), store, cache); - store["top"] = BI.sortBy(store["top"], "left"); - store["bottom"] = BI.sortBy(store["bottom"], "left"); - result["bottom"] = store; - } - if (direction.contains("left")) { - var store = {}, cache = {}; - recursion([this.regions[name]], dict.indexOf("left"), store, cache); - store["left"] = BI.sortBy(store["left"], "top"); - store["right"] = BI.sortBy(store["right"], "top"); - result["left"] = store; - } - if (direction.contains("right")) { - var store = {}, cache = {}; - recursion([this.regions[name]], dict.indexOf("right"), store, cache); - store["left"] = BI.sortBy(store["left"], "top"); - store["right"] = BI.sortBy(store["right"], "top"); - result["right"] = store; - } - return result; - }, - - _getLeftAlignRegions: function (name) { - var self = this; - var tops = this._getDirectRelativeRegions(name, ["top"]); - var bottoms = this._getDirectRelativeRegions(name, ["bottom"]); - var current = this.regions[name]; - var rtop = [], rbottom = []; - BI.each(tops, function (i, region) { - if (self._isEqual(region.left, current.left)) { - rtop.push(region); - } - }); - BI.each(bottoms, function (i, region) { - if (self._isEqual(region.left, current.left)) { - rbottom.push(region); - } - }); - return { - top: rtop, - bottom: rbottom - } - }, - - _getRightAlignRegions: function (name) { - var self = this; - var tops = this._getDirectRelativeRegions(name, ["top"]); - var bottoms = this._getDirectRelativeRegions(name, ["bottom"]); - var current = this.regions[name]; - var rtop = [], rbottom = []; - BI.each(tops, function (i, region) { - if (self._isEqual(region.left + region.width, current.left + current.width)) { - rtop.push(region); - } - }); - BI.each(bottoms, function (i, region) { - if (self._isEqual(region.left + region.width, current.left + current.width)) { - rbottom.push(region); - } - }); - return { - top: rtop, - bottom: rbottom - } - }, - - _getTopAlignRegions: function (name) { - var self = this; - var lefts = this._getDirectRelativeRegions(name, ["left"]); - var rights = this._getDirectRelativeRegions(name, ["right"]); - var current = this.regions[name]; - var rleft = [], rright = []; - BI.each(lefts, function (i, region) { - if (self._isEqual(region.top, current.top)) { - rleft.push(region); - } - }); - BI.each(rights, function (i, region) { - if (self._isEqual(region.top, current.top)) { - rright.push(region); - } - }); - return { - left: rleft, - right: rright - } - }, - - _getBottomAlignRegions: function (name) { - var self = this; - var lefts = this._getDirectRelativeRegions(name, ["left"]); - var rights = this._getDirectRelativeRegions(name, ["right"]); - var current = this.regions[name]; - var rleft = [], rright = []; - BI.each(lefts, function (i, region) { - if (self._isEqual(region.top + region.height, current.top + current.height)) { - rleft.push(region); - } - }); - BI.each(rights, function (i, region) { - if (self._isEqual(region.top + region.height, current.top + current.height)) { - rright.push(region); - } - }); - return { - left: rleft, - right: rright - } - }, - //获取占有的最大Region _getRegionOccupied: function (regions) { var self = this, o = this.options; @@ -579,1082 +160,92 @@ BI.Arrangement = BI.inherit(BI.Widget, { 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.ADAPTIVE: - if (this._isRegionOverlay()) { - return false; - } - var maxRegion = this._getRegionOccupied(regions); - var area = maxRegion.width * maxRegion.height; - var all = 0; - BI.each(regions || this.regions, function (id, region) { - all += region.width * region.height; - }); - return Math.abs(area - all) < 8; - 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; - } - }) - }, - - //对区域进行划分 - _splitRegions: function (name) { - var result = []; - var tid = BI.UUID(); - var _left = this._getLeftAlignRegions(name); - var _right = this._getRightAlignRegions(name); - var _top = this._getTopAlignRegions(name); - var _bottom = this._getBottomAlignRegions(name); - if (_left.top.length > 0) { - var upid = _left.top[0].id; - var tid = BI.UUID(); - var clone = this._cloneRegion(); - var _cur = clone[name]; - var split = Math.min(clone[name].width, clone[upid].width) / 2;//两个组件中较小宽度的一半 - var left = (clone[name].left + clone[upid].left) / 2;//求平均，减少误差 - var insert = clone[tid] = {//新增的区域 - left: left, - top: clone[upid].top, - width: split, - height: clone[name].height + clone[upid].height - }; - BI.extend(clone[name], { - left: left + split, - width: clone[name].width - split - (left - clone[name].left) - }); - BI.extend(clone[upid], { - left: left + split, - width: clone[upid].width - split - (left - clone[upid].left) - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "left-top", - regions: clone, - insert: insert - }); - } - } - if (_left.bottom.length > 0) { - var bottomid = _left.bottom[0].id; - var tid = BI.UUID(); - var clone = this._cloneRegion(); - var _cur = clone[name]; - var split = Math.min(clone[name].width, clone[bottomid].width) / 2; - var left = (clone[name].left + clone[bottomid].left) / 2; - var insert = clone[tid] = {//新增的区域 - left: left, - top: clone[name].top, - width: split, - height: clone[name].height + clone[bottomid].height - }; - BI.extend(clone[name], { - left: left + split, - width: clone[name].width - split - (left - clone[name].left) - }); - BI.extend(clone[bottomid], { - left: left + split, - width: clone[bottomid].width - split - (left - clone[bottomid].left) - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "bottom-left", - regions: clone, - insert: insert - }); - } - } - if (_right.top.length > 0) { - var upid = _right.top[0].id; - var tid = BI.UUID(); - var clone = this._cloneRegion(); - var _cur = clone[name]; - var split = Math.min(clone[name].width, clone[upid].width) / 2;//两个组件中较小宽度的一半 - var right = (clone[name].left + clone[name].width + clone[upid].left + clone[upid].width) / 2;//求平均，减少误差 - var insert = clone[tid] = {//新增的区域 - left: right - split, - top: clone[upid].top, - width: split, - height: clone[name].height + clone[upid].height - }; - BI.extend(clone[name], { - width: right - clone[name].left - split - }); - BI.extend(clone[upid], { - width: right - clone[upid].left - split - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "top-right", - regions: clone, - insert: insert - }); - } - } - if (_right.bottom.length > 0) { - var bottomid = _right.bottom[0].id; - var tid = BI.UUID(); - var clone = this._cloneRegion(); - var _cur = clone[name]; - var split = Math.min(clone[name].width, clone[bottomid].width) / 2;//两个组件中较小宽度的一半 - var right = (clone[name].left + clone[name].width + clone[bottomid].left + clone[bottomid].width) / 2;//求平均，减少误差 - var insert = clone[tid] = {//新增的区域 - left: right - split, - top: clone[name].top, - width: split, - height: clone[name].height + clone[bottomid].height - }; - BI.extend(clone[name], { - width: right - clone[name].left - split - }); - BI.extend(clone[bottomid], { - width: right - clone[bottomid].left - split - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "bottom-right", - regions: clone, - insert: insert - }); - } - } - if (_top.left.length > 0) { - var leftid = _top.left[0].id; - var tid = BI.UUID(); - var clone = this._cloneRegion(); - var _cur = clone[name]; - var split = Math.min(clone[name].height, clone[leftid].height) / 2;//两个组件中较小高度的一半 - var top = (clone[name].top + clone[leftid].top) / 2;//求平均，减少误差 - var insert = clone[tid] = {//新增的区域 - top: top, - left: clone[leftid].left, - height: split, - width: clone[name].width + clone[leftid].width - }; - BI.extend(clone[name], { - top: top + split, - height: clone[name].height - split - (top - clone[name].top) - }); - BI.extend(clone[leftid], { - top: top + split, - height: clone[leftid].height - split - (top - clone[leftid].top) - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "top-left", - regions: clone, - insert: insert - }); - } - } - if (_top.right.length > 0) { - var rightid = _top.right[0].id; - var tid = BI.UUID(); - var clone = this._cloneRegion(); - var _cur = clone[name]; - var split = Math.min(clone[name].height, clone[rightid].height) / 2;//两个组件中较小高度的一半 - var top = (clone[name].top + clone[rightid].top) / 2;//求平均，减少误差 - var insert = clone[tid] = {//新增的区域 - top: top, - left: clone[name].left, - height: split, - width: clone[name].width + clone[rightid].width - }; - BI.extend(clone[name], { - top: top + split, - height: clone[name].height - split - (top - clone[name].top) - }); - BI.extend(clone[rightid], { - top: top + split, - height: clone[rightid].height - split - (top - clone[rightid].top) - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "top-right-second", - regions: clone, - insert: insert - }); - } - } - if (_bottom.left.length > 0) { - var leftid = _bottom.left[0].id; - var tid = BI.UUID(); - var clone = this._cloneRegion(); - var _cur = clone[name]; - var split = Math.min(clone[name].height, clone[leftid].height) / 2;//两个组件中较小高度的一半 - var bottom = (clone[name].top + clone[name].height + clone[leftid].top + clone[leftid].height) / 2;//求平均，减少误差 - var insert = clone[tid] = {//新增的区域 - left: clone[leftid].left, - top: bottom - split, - height: split, - width: clone[name].width + clone[leftid].width - }; - BI.extend(clone[name], { - height: bottom - clone[name].top - split - }); - BI.extend(clone[leftid], { - height: bottom - clone[leftid].top - split - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "bottom-left-second", - regions: clone, - insert: insert - }); - } - } - if (_bottom.right.length > 0) { - var rightid = _bottom.right[0].id; - var tid = BI.UUID(); - var clone = this._cloneRegion(); - var _cur = clone[name]; - var split = Math.min(clone[name].height, clone[rightid].height) / 2;//两个组件中较小高度的一半 - var bottom = (clone[name].top + clone[name].height + clone[rightid].top + clone[rightid].height) / 2;//求平均，减少误差 - var insert = clone[tid] = {//新增的区域 - left: clone[name].left, - top: bottom - split, - height: split, - width: clone[name].width + clone[rightid].width - }; - BI.extend(clone[name], { - height: bottom - clone[name].top - split - }); - BI.extend(clone[rightid], { - height: bottom - clone[rightid].top - split - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "bottom-right-second", - regions: clone, - insert: insert - }); - } - } - //有上方居中drop - var lefts = _top.left, rights = _top.right; - if (lefts.length > 0 && rights.length > 0) { - var count = 0; - var store = [this.regions[name]]; - while (lefts.length > 0 || rights.length > 0) { - var clone = this._cloneRegion(); - if (lefts.length > 0) { - store.push(this.regions[lefts[0].id]); - } - if (rights.length > 0) { - store.push(this.regions[rights[0].id]); - } - count++; - var top = BI.average(store, function (i, r) {//求平均，减少误差 - return r.top; - }); - var occupied = this._getRegionOccupied(store); - - var split = BI.min(store, function (i, r) { - return r.height; - }).height / 2; - var insert = clone[tid] = { - left: occupied.left, - width: occupied.width, - top: top, - height: split - }; - BI.each(store, function (i, region) { - BI.extend(clone[region.id], { - top: top + split, - height: region.height - split - (top - region.top) - }); - }); - if (this._test(store)) { - delete clone[tid]; - result.push({ - type: "top-center" + count, - regions: clone, - insert: insert - }); - } else { - break; - } - - if (lefts.length > 0) { - lefts = this._getTopAlignRegions(lefts[0].id).left; - } - if (rights.length > 0) { - rights = this._getTopAlignRegions(rights[0].id).right; - } - } - } - //有下方居中drop - var lefts = _bottom.left, rights = _bottom.right; - if (lefts.length > 0 && rights.length > 0) { - var count = 0; - var store = [this.regions[name]]; - while (lefts.length > 0 || rights.length > 0) { - var clone = this._cloneRegion(); - if (lefts.length > 0) { - store.push(this.regions[lefts[0].id]); - } - if (rights.length > 0) { - store.push(this.regions[rights[0].id]); - } - count++; - var bottom = BI.average(store, function (i, r) {//求平均，减少误差 - return r.top + r.height; - }); - var occupied = this._getRegionOccupied(store); - - var split = BI.min(store, function (i, r) { - return r.height; - }).height / 2; - var insert = clone[tid] = { - left: occupied.left, - width: occupied.width, - top: bottom - split, - height: split - }; - BI.each(store, function (i, region) { - BI.extend(clone[region.id], { - height: bottom - region.top - split - }); - }); - if (this._test(store)) { - delete clone[tid]; - result.push({ - type: "bottom-center" + count, - regions: clone, - insert: insert - }); - } else { - break; - } - - if (lefts.length > 0) { - lefts = this._getBottomAlignRegions(lefts[0].id).left; - } - if (rights.length > 0) { - rights = this._getBottomAlignRegions(rights[0].id).right; - } - } - } - //有左方居中drop - var tops = _left.top, bottoms = _left.bottom; - if (tops.length > 0 && bottoms.length > 0) { - var count = 0; - var store = [this.regions[name]]; - while (tops.length > 0 || bottoms.length > 0) { - var clone = this._cloneRegion(); - if (tops.length > 0) { - store.push(this.regions[tops[0].id]); - } - if (bottoms.length > 0) { - store.push(this.regions[bottoms[0].id]); - } - count++; - var left = BI.average(store, function (i, r) {//求平均，减少误差 - return r.left; - }); - var occupied = this._getRegionOccupied(store); - - var split = BI.min(store, function (i, r) { - return r.width; - }).width / 2; - var insert = clone[tid] = { - left: left, - width: split, - top: occupied.top, - height: occupied.height - }; - BI.each(store, function (i, region) { - BI.extend(clone[region.id], { - left: left + split, - width: region.width - split - (left - region.left) - }); - }); - if (this._test(store)) { - delete clone[tid]; - result.push({ - type: "left-center" + count, - regions: clone, - insert: insert - }); - } else { - break; - } - - if (tops.length > 0) { - tops = this._getLeftAlignRegions(tops[0].id).top; - } - if (bottoms.length > 0) { - bottoms = this._getLeftAlignRegions(bottoms[0].id).bottom; - } - } - } - //有右方居中drop - var tops = _right.top, bottoms = _right.bottom; - if (tops.length > 0 && bottoms.length > 0) { - var count = 0; - var store = [this.regions[name]]; - while (tops.length > 0 || bottoms.length > 0) { - var clone = this._cloneRegion(); - if (tops.length > 0) { - store.push(this.regions[tops[0].id]); - } - if (bottoms.length > 0) { - store.push(this.regions[bottoms[0].id]); - } - count++; - var right = BI.average(store, function (i, r) {//求平均，减少误差 - return r.left + r.width; - }); - var occupied = this._getRegionOccupied(store); - - var split = BI.min(store, function (i, r) { - return r.width; - }).width / 2; - var insert = clone[tid] = { - left: right - split, - width: split, - top: occupied.top, - height: occupied.height - }; - BI.each(store, function (i, region) { - BI.extend(clone[region.id], { - width: right - region.left - split - }); - }); - if (this._test(store)) { - delete clone[tid]; - result.push({ - type: "right-center" + count, - regions: clone, - insert: insert - }); - } else { - break; - } - - if (tops.length > 0) { - tops = this._getRightAlignRegions(tops[0].id).top; - } - if (bottoms.length > 0) { - bottoms = this._getRightAlignRegions(bottoms[0].id).bottom; - } - } - } - var lefts = this._getEquivalentRelativeRegions(name, ["left"]); - if (lefts.length === 1) { - var clone = this._cloneRegion(); - var _cur = clone[name]; - var left = this.regions[lefts[0].id]; - var width = left.width; - var all = left.width + _cur.width; - var ratio = width / all; - var split = all / 3; - var lleft = width - split * ratio, rleft = _cur.width - split * (1 - ratio); - var insert = false; - if (lleft <= 21) { - rleft = _cur.width - split; - if (rleft <= 21) { - - } else { - insert = clone[tid] = { - top: _cur.top, - height: _cur.height, - left: _cur.left, - width: split, - }; - BI.extend(clone[name], { - top: _cur.top, - height: _cur.height, - left: _cur.left + split, - width: _cur.width - split - }); - } - } else if (rleft <= 21) { - lleft = width - split; - if (lleft <= 21) { - } else { - insert = clone[tid] = { - top: _cur.top, - height: _cur.height, - left: _cur.left - split, - width: split, - }; - BI.extend(clone[left.id], { - top: left.top, - height: left.height, - left: left.left, - width: left.width - split - }); - } - } else { - insert = clone[tid] = { - top: _cur.top, - height: _cur.height, - left: left.left + lleft, - width: split, - }; - BI.extend(clone[name], { - top: _cur.top, - height: _cur.height, - left: _cur.left + _cur.width - rleft, - width: rleft - }); - BI.extend(clone[left.id], { - top: left.top, - height: left.height, - left: left.left, - width: lleft - }); - } - if (insert !== false) { - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "left-line", - regions: clone, - insert: insert - }) - } - } - } - var rights = this._getEquivalentRelativeRegions(name, ["right"]); - if (rights.length === 1) { - var clone = this._cloneRegion(); - var _cur = clone[name]; - var right = this.regions[rights[0].id]; - var width = right.width; - var all = right.width + _cur.width; - var ratio = width / all; - var split = all / 3; - var lleft = _cur.width - split * (1 - ratio), rleft = width - split * ratio; - var insert = false; - if (lleft <= 21) { - rleft = width - split; - if (rleft <= 21) { - } else { - insert = clone[tid] = { - top: right.top, - height: right.height, - left: right.left, - width: split - }; - BI.extend(clone[right.id], { - top: right.top, - height: right.height, - left: right.left + split, - width: right.width - split - }) - } - } else if (rleft <= 21) { - lleft = _cur.width - split; - if (lleft <= 21) { - } else { - insert = clone[tid] = { - top: _cur.top, - height: _cur.height, - left: _cur.left + lleft, - width: split - }; - BI.extend(clone[name], { - top: _cur.top, - height: _cur.height, - left: _cur.left, - width: _cur.width - split - }) - } - } else { - insert = clone[tid] = { - top: _cur.top, - height: _cur.height, - left: _cur.left + lleft, - width: split - }; - BI.extend(clone[name], { - top: _cur.top, - height: _cur.height, - left: _cur.left, - width: lleft - }); - BI.extend(clone[right.id], { - top: right.top, - height: right.height, - left: right.left + right.width - rleft, - width: rleft - }); - } - if (insert !== false) { - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "right-line", - regions: clone, - insert: insert - }) - } - } - } - var tops = this._getEquivalentRelativeRegions(name, ["top"]); - if (tops.length === 1) { - var clone = this._cloneRegion(); - var _cur = clone[name]; - var top = this.regions[tops[0].id]; - var height = top.height; - var all = top.height + _cur.height; - var ratio = height / all; - var split = all / 3; - var tleft = height - split * ratio, bleft = _cur.height - split * (1 - ratio); - var insert = false; - if (tleft <= 21) { - bleft = _cur.height - split; - if (bleft <= 21) { - } else { - insert = clone[tid] = { - top: _cur.top, - width: _cur.width, - left: _cur.left, - height: split - }; - BI.extend(clone[name], { - top: _cur.top + split, - height: _cur.height - split, - left: _cur.left, - width: _cur.width - }); - } - } - if (bleft <= 21) { - tleft = height - split; - if (tleft <= 21) { - } else { - insert = clone[tid] = { - top: _cur.top - split, - height: split, - left: _cur.left, - width: _cur.width - }; - BI.extend(clone[top.id], { - top: top.top, - height: top.height - split, - left: top.left, - width: top.width - }); - } - } else { - insert = clone[tid] = { - top: top.top + tleft, - height: split, - left: _cur.left, - width: _cur.width - }; - BI.extend(clone[name], { - top: _cur.top + _cur.height - bleft, - height: bleft, - left: _cur.left, - width: _cur.width - }); - BI.extend(clone[top.id], { - top: top.top, - height: tleft, - left: top.left, - width: top.width - }); - } - if (insert !== false) { - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "top-line", - regions: clone, - insert: insert - }) - } - } - } - var bottoms = this._getEquivalentRelativeRegions(name, ["bottom"]); - if (bottoms.length === 1) { - var clone = this._cloneRegion(); - var _cur = clone[name]; - var bottom = this.regions[bottoms[0].id]; - var height = bottom.height; - var all = bottom.height + _cur.height; - var ratio = height / all; - var split = all / 3; - var tleft = _cur.height - split * (1 - ratio), bleft = height - split * ratio; - var insert = false; - if (tleft <= 21) { - bleft = height - split; - if (bleft <= 21) { - } else { - insert = clone[tid] = { - top: bottom.top, - height: bottom.height, - left: bottom.left, - width: split - }; - BI.extend(clone[bottom.id], { - top: bottom.top + split, - height: bottom.height - split, - left: bottom.left, - width: bottom.width - }); - } - } else if (bleft <= 21) { - tleft = _cur.height - split; - if (tleft <= 21) { - } else { - insert = clone[tid] = { - top: _cur.top + tleft, - height: split, - left: _cur.left, - width: _cur.width - }; - BI.extend(clone[name], { - top: _cur.top, - height: _cur.height - split, - left: _cur.left, - width: _cur.width - }); - } - } else { - insert = clone[tid] = { - top: _cur.top + tleft, - height: split, - left: _cur.left, - width: _cur.width, - }; - BI.extend(clone[name], { - top: _cur.top, - height: tleft, - left: _cur.left, - width: _cur.width - }); - BI.extend(clone[bottom.id], { - top: bottom.top + bottom.height - bleft, - height: bleft, - left: bottom.left, - width: bottom.width - }); - } - if (insert !== false) { - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "bottom-line", - regions: clone, - insert: insert - }) - } - } - } - if (tops.length >= 1) { - result.push({ - type: "top-gap" - }); - } - if (bottoms.length >= 1) { - result.push({ - type: "bottom-gap" - }); - } - //上 - var clone = this._cloneRegion(); - var _cur = clone[name]; - var insert = clone[tid] = { - top: _cur.top, - left: _cur.left, - width: _cur.width, - height: _cur.height / 2, - }; - BI.extend(clone[name], { - top: _cur.top + _cur.height / 2, - left: _cur.left, - width: _cur.width, - height: _cur.height / 2 - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "top", - regions: clone, - insert: insert - }) - } - //下 - var clone = this._cloneRegion(); - var _cur = clone[name]; - var insert = clone[tid] = { - top: _cur.top + _cur.height / 2, - left: _cur.left, - width: _cur.width, - height: _cur.height / 2 - }; - BI.extend(clone[name], { - top: _cur.top, - left: _cur.left, - width: _cur.width, - height: _cur.height / 2 - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "bottom", - regions: clone, - insert: insert - }) - } - //左 - var clone = this._cloneRegion(); - var _cur = clone[name]; - var insert = clone[tid] = { - top: _cur.top, - left: _cur.left, - width: _cur.width / 2, - height: _cur.height - }; - BI.extend(clone[name], { - top: _cur.top, - left: _cur.left + _cur.width / 2, - width: _cur.width / 2, - height: _cur.height - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "left", - regions: clone, - insert: insert - }) - } - //右 - var clone = this._cloneRegion(); - var _cur = clone[name]; - var insert = clone[tid] = { - top: _cur.top, - left: _cur.left + _cur.width / 2, - width: _cur.width / 2, - height: _cur.height - }; - BI.extend(clone[name], { - top: _cur.top, - left: _cur.left, - width: _cur.width / 2, - height: _cur.height - }); - if (this._test(clone)) { - delete clone[tid]; - result.push({ - type: "right", - regions: clone, - insert: insert - }) - } - return result; - }, - - _positionAt: function (position, bound) { - var left = position.left - bound.left, top = position.top - bound.top; - var right = bound.width - left, bottom = bound.height - top; - var halfW = bound.width / 2, halfH = bound.height / 2; - if (left < 0 || top < 0 || right < 0 || bottom < 0) { - return; - } - var devides = this._splitRegions(bound.id); - var types = []; - var result = {}; - var topcenterCount = 0, bottomcenterCount = 0, leftcenterCount = 0, rightcenterCount = 0; - BI.each(devides, function (i, devide) { - if (devide.type.indexOf("top-center") > -1) { - topcenterCount++; - } else if (devide.type.indexOf("bottom-center") > -1) { - bottomcenterCount++; - } else if (devide.type.indexOf("left-center") > -1) { - leftcenterCount++; - } else if (devide.type.indexOf("right-center") > -1) { - rightcenterCount++; - } - types.push(devide.type); - result[devide.type] = devide; - }); - //drop - if (top >= 5 && top <= 15 && left >= 5 && left <= 15 && types.contains("left-top")) { - return result["left-top"]; - } - if (top >= 5 && top <= 15 && right >= 5 && right <= 15 && types.contains("top-right")) { - return result["top-right"]; - } - if (bottom >= 5 && bottom <= 15 && left >= 5 && left <= 15 && types.contains("bottom-left")) { - return result["bottom-left"]; - } - if (bottom >= 5 && bottom <= 15 && right >= 5 && right <= 15 && types.contains("bottom-right")) { - return result["bottom-right"]; - } - - if (top >= 5 && top <= 15 && left >= 25 && left <= 35 && types.contains("top-left")) { - return result["top-left"]; - } - if (top >= 5 && top <= 15 && right >= 25 && right <= 35 && types.contains("top-right-second")) { - return result["top-right-second"]; - } - if (bottom >= 5 && bottom <= 15 && left >= 25 && left <= 35 && types.contains("bottom-left-second")) { - return result["bottom-left-second"]; - } - if (bottom >= 5 && bottom <= 15 && right >= 25 && right <= 35 && types.contains("bottom-right-second")) { - return result["bottom-right-second"]; - } - - //topcenter或bottomcenter - if (left >= halfW - 10 && left <= halfW + 10 && (topcenterCount > 0 || bottomcenterCount > 0)) { - for (var i = 1; i <= topcenterCount; i++) { - var s = (topcenterCount - i) * 20 + 5, e = s + 10; - if (top >= s && top <= e) { - return result["top-center" + i]; - } - } - for (var i = 1; i <= bottomcenterCount; i++) { - var s = (bottomcenterCount - i) * 20 + 5, e = s + 10; - if (bottom >= s && bottom <= e) { - return result["bottom-center" + i]; + }); + 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; } } } - //leftcenter或rightcenter - if (top >= halfH - 10 && top <= halfH + 10 && (leftcenterCount > 0 || rightcenterCount > 0)) { - for (var i = 1; i <= leftcenterCount; i++) { - var s = (leftcenterCount - i) * 20 + 5, e = s + 10; - if (left >= s && left <= e) { - return result["left-center" + i]; - } - } - for (var i = 1; i <= rightcenterCount; i++) { - var s = (rightcenterCount - i) * 20 + 5, e = s + 10; - if (right >= s && right <= e) { - return result["right-center" + i]; + 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; + }, - //缝隙 - if (top <= 8 && types.contains("top-gap")) { - return result["top-gap"]; - } - if (bottom <= 8 && types.contains("bottom-gap")) { - return result["bottom-gap"]; - } + _getRegionNames: function (regions) { + var names = []; + BI.each(regions || this.regions, function (i, region) { + names.push(region.id || region.attr("id")); + }); + return names; + }, - //三分 - if (top <= 15 && left >= 15 && right >= 15 && types.contains("top-line")) { - return result["top-line"]; - } - if (left <= 15 && top >= 15 && bottom >= 15 && types.contains("left-line")) { - return result["left-line"]; - } - if (right <= 15 && top >= 15 && bottom >= 15 && types.contains("right-line")) { - return result["right-line"]; - } - if (bottom <= 15 && left >= 15 && right >= 15 && types.contains("bottom-line")) { - return result["bottom-line"]; + _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; + }, - //平分 - if (top <= 1 / 4 * bound.height && types.contains("top")) { - return result["top"]; - } - if (top >= 3 / 4 * bound.height && types.contains("bottom")) { - return result["bottom"]; - } - if (left <= bound.width / 2 && types.contains("left")) { - return result["left"]; - } - return result["right"]; + _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 { @@ -1677,215 +268,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { } }, - _createOneDrop: function (region) { - if (this.storeDrops[region.id]) { - var drop = this.storeDrops[region.id].el; - drop.setVisible(true); - } else { - var drop = BI.createWidget({ - type: "bi.layout", - cls: "arrangement-drop-region", - widgetName: region.id - }); - } - return { - id: region.id, - left: region.left, - top: region.top, - width: region.width, - height: region.height, - el: drop - } - }, - - _calculateDrops: function () { - var self = this; - BI.each(this.drops, function (id, drop) { - drop.el.empty(); - var devides = self._splitRegions(id); - var topcenterCount = 0, bottomcenterCount = 0, leftcenterCount = 0, rightcenterCount = 0; - var absolutes = []; - var horizontals = []; - var verticals = []; - BI.each(devides, function (i, devide) { - if (devide.type.indexOf("top-center") > -1) { - topcenterCount++; - } else if (devide.type.indexOf("bottom-center") > -1) { - bottomcenterCount++; - } else if (devide.type.indexOf("left-center") > -1) { - leftcenterCount++; - } else if (devide.type.indexOf("right-center") > -1) { - rightcenterCount++; - } - }); - BI.each(devides, function (i, devide) { - switch (devide.type) { - case "left-top": - absolutes.push({ - el: { - type: "bi.layout", - width: 10, - height: 10, - cls: "drop-devider" - }, - left: 5, - top: 5 - }); - break; - case "top-right": - absolutes.push({ - el: { - type: "bi.layout", - width: 10, - height: 10, - cls: "drop-devider" - }, - right: 5, - top: 5 - }); - break; - case "bottom-left": - absolutes.push({ - el: { - type: "bi.layout", - width: 10, - height: 10, - cls: "drop-devider" - }, - left: 5, - bottom: 5 - }); - break; - case "bottom-right": - absolutes.push({ - el: { - type: "bi.layout", - width: 10, - height: 10, - cls: "drop-devider" - }, - right: 5, - bottom: 5 - }); - break; - case "top-left": - absolutes.push({ - el: { - type: "bi.layout", - width: 10, - height: 10, - cls: "drop-devider" - }, - left: 25, - top: 5 - }); - break; - case "top-right-second": - absolutes.push({ - el: { - type: "bi.layout", - width: 10, - height: 10, - cls: "drop-devider" - }, - right: 25, - top: 5 - }); - break; - case "bottom-left-second": - absolutes.push({ - el: { - type: "bi.layout", - width: 10, - height: 10, - cls: "drop-devider" - }, - left: 25, - bottom: 5 - }); - break; - case "bottom-right-second": - absolutes.push({ - el: { - type: "bi.layout", - width: 10, - height: 10, - cls: "drop-devider" - }, - right: 25, - bottom: 5 - }); - break; - default: - if (devide.type.indexOf("top-center") > -1) { - var num = devide.type.split("top-center")[1]; - horizontals.push({ - el: { - type: "bi.layout", - width: 20, - height: 10, - cls: "drop-devider" - }, - tgap: 20 * (topcenterCount - BI.parseInt(num)) + 5 - }) - } else if (devide.type.indexOf("bottom-center") > -1) { - var num = devide.type.split("bottom-center")[1]; - horizontals.push({ - el: { - type: "bi.layout", - width: 20, - height: 10, - cls: "drop-devider" - }, - bgap: 20 * (bottomcenterCount - BI.parseInt(num)) + 5 - }) - } else if (devide.type.indexOf("left-center") > -1) { - var num = devide.type.split("left-center")[1]; - verticals.push({ - el: { - type: "bi.layout", - width: 10, - height: 20, - cls: "drop-devider" - }, - lgap: 20 * (leftcenterCount - BI.parseInt(num)) + 5 - }) - } else if (devide.type.indexOf("right-center") > -1) { - var num = devide.type.split("right-center")[1]; - verticals.push({ - el: { - type: "bi.layout", - width: 10, - height: 20, - cls: "drop-devider" - }, - rgap: 20 * (rightcenterCount - BI.parseInt(num)) + 5 - }) - } - break; - } - - }); - BI.createWidget({ - type: "bi.absolute", - element: drop.el, - items: absolutes - }); - - BI.createWidget({ - type: "bi.absolute_horizontal_adapt", - element: drop.el, - items: horizontals - }); - - BI.createWidget({ - type: "bi.absolute_vertical_adapt", - element: drop.el, - items: verticals - }); - }); - }, - _applyRegion: function (regions) { var self = this, o = this.options; BI.each(regions || this.regions, function (i, region) { @@ -1895,21 +277,8 @@ BI.Arrangement = BI.inherit(BI.Widget, { width: region.width, height: region.height }); - self.drops[region.id].left = region.left; - self.drops[region.id].top = region.top; - self.drops[region.id].width = region.width; - self.drops[region.id].height = region.height; - }); - BI.each(this.drops, function (i, region) { - region.el.element.css({ - left: region.left, - top: region.top, - width: region.width, - height: region.height - }); }); this._applyContainer(); - this._calculateDrops(); this.ratio = this.getLayoutRatio(); }, @@ -1920,11 +289,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { element: this.container, items: BI.toArray(this.regions) }); - BI.createWidget({ - type: "bi.absolute", - element: this.droppable, - items: BI.toArray(this.drops) - }); }, getClientWidth: function () { @@ -1935,6 +299,14 @@ BI.Arrangement = BI.inherit(BI.Widget, { 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"); @@ -1953,41 +325,21 @@ BI.Arrangement = BI.inherit(BI.Widget, { region.height = regions[id].height; } }); - BI.each(this.drops, 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; - var drop = this._createOneDrop(region); - this.drops[drop.id] = drop; - this.storeDrops[drop.id] = drop; - this._locationRegion(); BI.createWidget({ type: "bi.absolute", element: this.container, items: [region] }); - BI.createWidget({ - type: "bi.absolute", - element: this.droppable, - items: [drop] - }) }, _deleteRegionByName: function (name) { this.regions[name].el.setVisible(false); - this.drops[name].el.setVisible(false); delete this.regions[name]; - delete this.drops[name]; - this._locationRegion(); }, _setArrangeSize: function (size) { @@ -2014,15 +366,15 @@ BI.Arrangement = BI.inherit(BI.Widget, { 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 (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; } @@ -2269,46 +621,24 @@ BI.Arrangement = BI.inherit(BI.Widget, { return helper; }, - _start: function (cur) { + _start: function () { this.arrangement.setVisible(true); - this.droppable.setVisible(true); if (this.options.layoutType === BI.Arrangement.LAYOUT_TYPE.GRID) { this.block.setVisible(true); } - BI.each(this.drops, function (i, drop) { - drop.el.setVisible(false); - }); - if (cur) { - if (this.drops[cur]) { - this.drops[cur].el.setVisible(true); - } - } }, _stop: function () { this.arrangement.setVisible(false); - this.droppable.setVisible(false); this.block.setVisible(false); }, - getDirectRelativeRegions: function (name, direction) { - direction || (direction = ["top", "bottom", "left", "right"]); - var self = this, result = {}; - BI.each(direction, function (i, dir) { - result[dir] = self._getDirectRelativeRegions(name, [dir]); - }); - return result; - }, - ////公有操作//// setLayoutType: function (type) { var self = this, o = this.options; if (type !== o.layoutType) { o.layoutType = type; switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - this.relayout(); - break; case BI.Arrangement.LAYOUT_TYPE.FREE: break; case BI.Arrangement.LAYOUT_TYPE.GRID: @@ -2371,18 +701,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { } var self = this, o = this.options; switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - var clone = this._cloneRegion(); - var regions = this._getEquivalentRelativeRegions(name); - if (regions.length > 0) { - BI.each(regions, function (i, region) { - BI.extend(clone[region.id], region); - }); - this._modifyRegion(clone); - } - this._deleteRegionByName(name); - this._populate(this.getAllRegions()); - return true; case BI.Arrangement.LAYOUT_TYPE.FREE: this._deleteRegionByName(name); this._populate(this.getAllRegions()); @@ -2400,47 +718,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { var self = this, o = this.options; var flag = false; switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - var current = this.regions[name]; - if (size.width !== current.width) { - var regions = this._getInDirectRelativeRegions(name, ["right"]).right; - var lefts = regions.left || [], rights = regions.right || []; - var offset = size.width - current.width; - var cloned = this._cloneRegion(); - BI.some(lefts, function (i, left) { - var region = cloned[left.id]; - region.width = region.width + offset; - }); - BI.some(rights, function (i, right) { - var region = cloned[right.id]; - region.width = region.width - offset; - region.left = region.left + offset; - }); - if (this._test(cloned) && this._isArrangeFine(cloned)) { - this._modifyRegion(cloned); - flag = true; - } - } - if (size.height !== current.height) { - var regions = this._getInDirectRelativeRegions(name, ["bottom"]).bottom; - var tops = regions.top || [], bottoms = regions.bottom || []; - var offset = size.height - current.height; - var cloned = this._cloneRegion(); - BI.some(tops, function (i, top) { - var region = cloned[top.id]; - region.height = region.height + offset; - }); - BI.some(bottoms, function (i, bottom) { - var region = cloned[bottom.id]; - region.height = region.height - offset; - region.top = region.top + offset; - }); - if (this._test(cloned) && this._isArrangeFine(cloned)) { - this._modifyRegion(cloned); - flag = true; - } - } - break; case BI.Arrangement.LAYOUT_TYPE.FREE: var clone = this._cloneRegion(); BI.extend(clone[name], { @@ -2467,7 +744,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { } break; } - this._locationRegion(); this._applyRegion(); return flag; }, @@ -2477,8 +753,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { var insert, regions = [], cur; if (position.left < 0 || position.top < 0) { switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - break; case BI.Arrangement.LAYOUT_TYPE.FREE: break; case BI.Arrangement.LAYOUT_TYPE.GRID: @@ -2495,54 +769,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { top: position.top + offset.top }; switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - if (BI.isEmpty(this.regions)) { - if (self._isPositionInBounds(position, { - left: 0, - top: 0, - width: this.element[0].clientWidth, - height: this.element[0].clientHeight - })) { - insert = { - left: 0, - top: 0, - width: this.element[0].clientWidth, - height: this.element[0].clientHeight - }; - } - } else { - if (BI.some(this.regions, function (id, region) { - if (self._isPositionInBounds(position, region)) { - var at = self._positionAt(position, region); - if (!at) { - insert = null; - } else { - insert = at.insert; - regions = at.regions; - } - cur = id; - return true; - } - })) { - } - else { - insert = null; - regions = []; - } - } - if (insert == null) { - this._stop(); - self.position = null; - break; - } - - this.position = { - insert: insert, - regions: regions - }; - this._setArrangeSize(insert); - this._start(cur); - break; case BI.Arrangement.LAYOUT_TYPE.FREE: var insert = { top: position.top < 0 ? 0 : position.top, @@ -2592,8 +818,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { top: position.top + offset.top }); switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - break; case BI.Arrangement.LAYOUT_TYPE.FREE: BI.extend(this.regions[name], { left: position.left < 0 ? 0 : position.left, @@ -2643,56 +867,13 @@ BI.Arrangement = BI.inherit(BI.Widget, { } }, - setContainerSize: function (size) { - var self = this, o = this.options; - var occupied = this._getRegionOccupied(); - switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - if (this._isArrangeFine()) { - var width = size.width, height = size.height; - var regions = this._cloneRegion(); - BI.each(regions, function (i, region) { - region.width = region.width / occupied.width * width; - //region.height = region.height / occupied.height * height; - }); - BI.each(regions, function (id, region) { - var lefts = self.locations[id].left; - var tops = self.locations[id].top; - var bottoms = self.locations[id].bottom; - var maxRegion; - if (lefts.length > 0) { - var ids = self._getRegionNames(lefts); - var rs = self._getRegionsByNames(ids); - maxRegion = self._getRegionOccupied(rs); - region.left = maxRegion.left + maxRegion.width / occupied.width * width; - } else { - region.left = 0; - } - if (bottoms.length === 0) { - region.height = height - region.top; - } - //if (tops.length > 0) { - // var ids = self._getRegionNames(tops); - // var rs = self._getRegionsByNames(ids); - // maxRegion = self._getRegionOccupied(rs); - // region.top = maxRegion.top + maxRegion.height / occupied.height * height; - //} - //if (tops.length === 0) { - // region.top = 0; - //} - }); - if (this._test(regions)) { - this._modifyRegion(regions); - this._applyRegion(); - } - } - break; - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - break; + setDropPosition: function (position) { + var self = this; + this.arrangement.setVisible(true); + this._setArrangeSize(position); + return function () { + self.arrangement.setVisible(false); } - this.resize(); }, scrollTo: function (scroll) { @@ -2707,7 +888,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { } var occupied = this._applyContainer(); switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: case BI.Arrangement.LAYOUT_TYPE.FREE: if (this._isArrangeFine()) { var width = this.getClientWidth(); @@ -2759,51 +939,6 @@ BI.Arrangement = BI.inherit(BI.Widget, { var self = this, o = this.options; var occupied = this._applyContainer(); switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - if (this._isArrangeFine()) { - var width = this.getClientWidth(), height = this.getClientHeight(); - var isHeightAdjust = height > occupied.height; - var regions = this._cloneRegion(); - BI.each(regions, function (i, region) { - region.width = region.width / occupied.width * width; - //if (isHeightAdjust) { - // region.height = region.height / occupied.height * height; - //} - }); - BI.each(regions, function (id, region) { - var lefts = self.locations[id].left; - var tops = self.locations[id].top; - var bottoms = self.locations[id].bottom; - var maxRegion; - if (lefts.length > 0) { - var ids = self._getRegionNames(lefts); - var rs = self._getRegionsByNames(ids); - maxRegion = self._getRegionOccupied(rs); - region.left = maxRegion.left + maxRegion.width / occupied.width * width; - } else { - region.left = 0; - } - if (tops.length === 0) { - region.top = 0; - } - if (isHeightAdjust && bottoms.length === 0) { - region.height = height - region.top; - } - //if (isHeightAdjust && tops.length > 0) { - // var ids = self._getRegionNames(tops); - // var rs = self._getRegionsByNames(ids); - // maxRegion = self._getRegionOccupied(rs); - // region.top = maxRegion.top + maxRegion.height / occupied.height * height; - //} - }); - if (this._test(regions)) { - this._modifyRegion(regions); - this._applyRegion(); - } - } else { - this.relayout(); - } - break; case BI.Arrangement.LAYOUT_TYPE.FREE: break; case BI.Arrangement.LAYOUT_TYPE.GRID: @@ -2820,15 +955,15 @@ BI.Arrangement = BI.inherit(BI.Widget, { relayout: function () { var self = this, o = this.options; - if (o.isNeedReLayout === false) { - return; - } - //var occupied = this._applyContainer(); switch (o.layoutType) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: + 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 clone = BI.toArray(this._cloneRegion()); + 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; @@ -2836,97 +971,50 @@ BI.Arrangement = BI.inherit(BI.Widget, { return r1.top - r2.top; }); var count = clone.length; - var cols = 3, rows = Math.floor((count - 1) / 3 + 1); + 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 / 3), col = i % 3; + var row = Math.floor(i / 4), col = i % 4; BI.extend(region, { - top: row * 380, + top: row * perHeight * 6, left: col * w, width: w, - height: 380 + height: perHeight * 6 }); if (!store[row]) { store[row] = {}; } store[row][col] = region; }); - //非3的倍数 - if (count % 3 !== 0) { - var lasts = store[rows - 1]; - var perWidth = width / (count % 3); - BI.each(lasts, function (i, region) { - BI.extend(region, { - left: BI.parseInt(i) * perWidth, - width: perWidth - }); - }); - } + //非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); - this.resize(); } } else { this.resize(); } break; - case BI.Arrangement.LAYOUT_TYPE.FREE: - break; - case BI.Arrangement.LAYOUT_TYPE.GRID: - 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 = 3, rows = Math.floor((count - 1) / 3 + 1); - var w = width / cols, h = height / rows; - var store = {}; - BI.each(clone, function (i, region) { - var row = Math.floor(i / 3), col = i % 3; - BI.extend(region, { - top: row * perHeight * 6, - left: col * w, - width: w, - height: perHeight * 6 - }); - if (!store[row]) { - store[row] = {}; - } - store[row][col] = region; - }); - //非3的倍数 - if (count % 3 !== 0) { - var lasts = store[rows - 1]; - var perWidth = width / (count % 3); - 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); - } - break; } }, _populate: function (items) { this._stop(); this._calculateRegions(items); - this._locationRegion(); this._applyRegion(); }, @@ -2934,9 +1022,7 @@ BI.Arrangement = BI.inherit(BI.Widget, { var self = this; BI.each(this.regions, function (name, region) { self.regions[name].el.setVisible(false); - self.drops[name].el.setVisible(false); delete self.regions[name]; - delete self.drops[name]; }); this._populate(items); this._renderRegion(); @@ -2947,9 +1033,8 @@ BI.extend(BI.Arrangement, { PORTION: 32, H_PORTION: 18, LAYOUT_TYPE: { - ADAPTIVE: 0, - FREE: 1, - GRID: 2 + GRID: 0, + FREE: 1 } }); BI.shortcut('bi.arrangement', BI.Arrangement); \ No newline at end of file diff --git a/src/widget/interactivearrangement/interactivearrangement.js b/src/widget/interactivearrangement/interactivearrangement.js index f6d815d82..ad702ad4a 100644 --- a/src/widget/interactivearrangement/interactivearrangement.js +++ b/src/widget/interactivearrangement/interactivearrangement.js @@ -12,9 +12,7 @@ BI.InteractiveArrangement = BI.inherit(BI.Widget, { return BI.extend(BI.InteractiveArrangement.superclass._defaultConfig.apply(this, arguments), { baseCls: "bi-interactive-arrangement", resizable: true, - isNeedReLayout: true, - isNeedResizeContainer: true, - layoutType: BI.Arrangement.LAYOUT_TYPE.FREE, + layoutType: BI.Arrangement.LAYOUT_TYPE.GRID, items: [] }); }, @@ -26,8 +24,6 @@ BI.InteractiveArrangement = BI.inherit(BI.Widget, { type: "bi.adaptive_arrangement", element: this, resizable: o.resizable, - isNeedReLayout: o.isNeedReLayout, - isNeedResizeContainer: o.isNeedResizeContainer, layoutType: o.layoutType, items: o.items }); @@ -439,7 +435,6 @@ BI.InteractiveArrangement = BI.inherit(BI.Widget, { var self = this; this.stopDraw(); switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: case BI.Arrangement.LAYOUT_TYPE.FREE: var other = this._getRegionExcept(name); var left = this._leftAlign(position, size, other); @@ -473,10 +468,6 @@ BI.InteractiveArrangement = BI.inherit(BI.Widget, { } }, - getDirectRelativeRegions: function (name, direction) { - return this.arrangement.getDirectRelativeRegions(name, direction); - }, - addRegion: function (region, position) { this.stopDraw(); return this.arrangement.addRegion(region, position); @@ -496,8 +487,6 @@ BI.InteractiveArrangement = BI.inherit(BI.Widget, { this.stopDraw(); if (position.left > 0 && position.top > 0) { switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - break; case BI.Arrangement.LAYOUT_TYPE.FREE: position = this.getPosition(null, position, size); this.draw(position, size); @@ -513,8 +502,6 @@ BI.InteractiveArrangement = BI.inherit(BI.Widget, { setRegionPosition: function (name, position) { if (position.left > 0 && position.top > 0) { switch (this.getLayoutType()) { - case BI.Arrangement.LAYOUT_TYPE.ADAPTIVE: - break; case BI.Arrangement.LAYOUT_TYPE.FREE: position = this.getPosition(name, position); break; @@ -525,6 +512,18 @@ BI.InteractiveArrangement = BI.inherit(BI.Widget, { return this.arrangement.setRegionPosition(name, position); }, + setDropPosition: function (position) { + return this.arrangement.setDropPosition(position); + }, + + scrollInterval: function () { + this.arrangement.scrollInterval.apply(this.arrangement, arguments); + }, + + scrollEnd: function () { + this.arrangement.scrollEnd.apply(this.arrangement, arguments); + }, + scrollTo: function (scroll) { this.arrangement.scrollTo(scroll); },