init repo

OfficeWeb/3rdparty/touch/src/layout/Abstract.js

@@ -0,0 +1,34 @@
+/**
+ *
+ */
+Ext.define('Ext.layout.Abstract', {
+    mixins: ['Ext.mixin.Observable'],
+    
+    isLayout: true,
+
+    constructor: function(config) {
+        this.initialConfig = config;
+    },
+
+    setContainer: function(container) {
+        this.container = container;
+
+        this.initConfig(this.initialConfig);
+
+        return this;
+    },
+
+    onItemAdd: function() {},
+
+    onItemRemove: function() {},
+
+    onItemMove: function() {},
+
+    onItemCenteredChange: function() {},
+
+    onItemFloatingChange: function() {},
+
+    onItemDockedChange: function() {},
+
+    onItemInnerStateChange: function() {}
+});

OfficeWeb/3rdparty/touch/src/layout/Box.js

@@ -0,0 +1,40 @@
+/**
+ *
+ */
+Ext.define('Ext.layout.Box', {
+    extend: 'Ext.layout.Default',
+
+    config: {
+        orient: 'horizontal',
+
+        align: 'start',
+
+        pack: 'start'
+    },
+
+    alias: 'layout.tablebox',
+
+    layoutBaseClass: 'x-layout-tablebox',
+
+    itemClass: 'x-layout-tablebox-item',
+
+    setContainer: function(container) {
+        this.callSuper(arguments);
+
+        container.innerElement.addCls(this.layoutBaseClass);
+
+        container.on('flexchange', 'onItemFlexChange', this, {
+            delegate: '> component'
+        });
+    },
+
+    onItemInnerStateChange: function(item, isInner) {
+        this.callSuper(arguments);
+
+        item.toggleCls(this.itemClass, isInner);
+    },
+
+    onItemFlexChange: function() {
+
+    }
+});

OfficeWeb/3rdparty/touch/src/layout/Card.js

@@ -0,0 +1,155 @@
+/**
+ * @aside guide layouts
+ * @aside video layouts
+ *
+ * Sometimes you want to show several screens worth of information but you've only got a small screen to work with.
+ * TabPanels and Carousels both enable you to see one screen of many at a time, and underneath they both use a Card
+ * Layout.
+ *
+ * Card Layout takes the size of the Container it is applied to and sizes the currently active item to fill the
+ * Container completely. It then hides the rest of the items, allowing you to change which one is currently visible but
+ * only showing one at once:
+ *
+ * {@img ../guides/layouts/card.jpg}
+ *
+ *
+ * Here the gray box is our Container, and the blue box inside it is the currently active card. The three other cards
+ * are hidden from view, but can be swapped in later. While it's not too common to create Card layouts directly, you
+ * can do so like this:
+ *
+ *     var panel = Ext.create('Ext.Panel', {
+ *         layout: 'card',
+ *         items: [
+ *             {
+ *                 html: "First Item"
+ *             },
+ *             {
+ *                 html: "Second Item"
+ *             },
+ *             {
+ *                 html: "Third Item"
+ *             },
+ *             {
+ *                 html: "Fourth Item"
+ *             }
+ *         ]
+ *     });
+ *
+ *     panel.{@link Ext.Container#setActiveItem setActiveItem}(1);
+ *
+ * Here we create a Panel with a Card Layout and later set the second item active (the active item index is zero-based,
+ * so 1 corresponds to the second item). Normally you're better off using a {@link Ext.tab.Panel tab panel} or a
+ * {@link Ext.carousel.Carousel carousel}.
+ *
+ * For a more detailed overview of what layouts are and the types of layouts shipped with Sencha Touch 2, check out the
+ * [Layout Guide](#!/guide/layouts).
+ */
+
+
+Ext.define('Ext.layout.Card', {
+    extend: 'Ext.layout.Default',
+
+    alias: 'layout.card',
+
+    isCard: true,
+
+    /**
+     * @event activeitemchange
+     * @preventable doActiveItemChange
+     * Fires when an card is made active
+     * @param {Ext.layout.Card} this The layout instance
+     * @param {Mixed} newActiveItem The new active item
+     * @param {Mixed} oldActiveItem The old active item
+     */
+        
+    layoutClass: 'x-layout-card',
+
+    itemClass: 'x-layout-card-item',
+
+    requires: [
+        'Ext.fx.layout.Card'
+    ],
+
+    /**
+     * @private
+     */
+    applyAnimation: function(animation) {
+        return new Ext.fx.layout.Card(animation);
+    },
+
+    /**
+     * @private
+     */
+    updateAnimation: function(animation, oldAnimation) {
+        if (animation && animation.isAnimation) {
+            animation.setLayout(this);
+        }
+
+        if (oldAnimation) {
+            oldAnimation.destroy();
+        }
+    },
+
+    setContainer: function(container) {
+        this.callSuper(arguments);
+
+        container.innerElement.addCls(this.layoutClass);
+        container.onInitialized('onContainerInitialized', this);
+    },
+
+    onContainerInitialized: function() {
+        var container = this.container,
+            activeItem = container.getActiveItem();
+
+        if (activeItem) {
+            activeItem.show();
+        }
+
+        container.on('activeitemchange', 'onContainerActiveItemChange', this);
+    },
+
+    /**
+     * @private
+     */
+    onContainerActiveItemChange: function(container) {
+        this.relayEvent(arguments, 'doActiveItemChange');
+    },
+
+    onItemInnerStateChange: function(item, isInner, destroying) {
+        this.callSuper(arguments);
+        var container = this.container,
+            activeItem = container.getActiveItem();
+
+        item.toggleCls(this.itemClass, isInner);
+        item.setLayoutSizeFlags(isInner ? container.LAYOUT_BOTH : 0);
+
+        if (isInner) {
+            if (activeItem !== container.innerIndexOf(item) && activeItem !== item && item !== container.pendingActiveItem) {
+                item.hide();
+            }
+        }
+        else {
+            if (!destroying && !item.isDestroyed && item.isDestroying !== true) {
+                item.show();
+            }
+        }
+    },
+
+    /**
+     * @private
+     */
+    doActiveItemChange: function(me, newActiveItem, oldActiveItem) {
+        if (oldActiveItem) {
+            oldActiveItem.hide();
+        }
+
+        if (newActiveItem) {
+            newActiveItem.show();
+        }
+    },
+
+    destroy:  function () {
+        this.callParent(arguments);
+        Ext.destroy(this.getAnimation());
+    }
+});

OfficeWeb/3rdparty/touch/src/layout/Default.js

@@ -0,0 +1,368 @@
+/**
+ *
+ */
+Ext.define('Ext.layout.Default', {
+    extend: 'Ext.layout.Abstract',
+
+    isAuto: true,
+
+    alias: ['layout.default', 'layout.auto'],
+
+    requires: [
+        'Ext.util.Wrapper',
+        'Ext.layout.wrapper.BoxDock',
+        'Ext.layout.wrapper.Inner'
+    ],
+
+    config: {
+        /**
+         * @cfg {Ext.fx.layout.Card} animation Layout animation configuration
+         * Controls how layout transitions are animated.  Currently only available for
+         * Card Layouts.
+         *
+         * Possible values are:
+         *
+         * - cover
+         * - cube
+         * - fade
+         * - flip
+         * - pop
+         * - reveal
+         * - scroll
+         * - slide
+         * @accessor
+         */
+        animation: null
+    },
+
+    centerWrapperClass: 'x-center',
+
+    dockWrapperClass: 'x-dock',
+
+    positionMap: {
+        top: 'start',
+        left: 'start',
+        middle: 'center',
+        bottom: 'end',
+        right: 'end'
+    },
+
+    positionDirectionMap: {
+        top: 'vertical',
+        bottom: 'vertical',
+        left: 'horizontal',
+        right: 'horizontal'
+    },
+
+    setContainer: function(container) {
+        var options = {
+            delegate: '> component'
+        };
+
+        this.dockedItems = [];
+
+        this.callSuper(arguments);
+
+        container.on('centeredchange', 'onItemCenteredChange', this, options, 'before')
+                 .on('floatingchange', 'onItemFloatingChange', this, options, 'before')
+                 .on('dockedchange', 'onBeforeItemDockedChange', this, options, 'before')
+                 .on('dockedchange', 'onAfterItemDockedChange', this, options);
+    },
+
+    monitorSizeStateChange: function() {
+        this.monitorSizeStateChange = Ext.emptyFn;
+        this.container.on('sizestatechange', 'onContainerSizeStateChange', this);
+    },
+
+    monitorSizeFlagsChange: function() {
+        this.monitorSizeFlagsChange = Ext.emptyFn;
+        this.container.on('sizeflagschange', 'onContainerSizeFlagsChange', this);
+    },
+
+    onItemAdd: function(item) {
+        var docked = item.getDocked();
+
+        if (docked !== null) {
+            this.dockItem(item);
+        }
+        else if (item.isCentered()) {
+            this.onItemCenteredChange(item, true);
+        }
+        else if (item.isFloating()) {
+            this.onItemFloatingChange(item, true);
+        }
+        else {
+            this.onItemInnerStateChange(item, true);
+        }
+    },
+
+    /**
+     *
+     * @param item
+     * @param isInner
+     * @param [destroying]
+     */
+    onItemInnerStateChange: function(item, isInner, destroying) {
+        if (isInner) {
+            this.insertInnerItem(item, this.container.innerIndexOf(item));
+        }
+        else {
+            this.removeInnerItem(item);
+        }
+    },
+
+    insertInnerItem: function(item, index) {
+        var container = this.container,
+            containerDom = container.innerElement.dom,
+            itemDom = item.element.dom,
+            nextSibling = container.getInnerAt(index + 1),
+            nextSiblingDom = nextSibling ? nextSibling.element.dom : null;
+
+        containerDom.insertBefore(itemDom, nextSiblingDom);
+
+        return this;
+    },
+
+    insertBodyItem: function(item) {
+        var container = this.container.setUseBodyElement(true),
+            bodyDom = container.bodyElement.dom;
+
+        if (item.getZIndex() === null) {
+            item.setZIndex((container.indexOf(item) + 1) * 2);
+        }
+
+        bodyDom.insertBefore(item.element.dom, bodyDom.firstChild);
+
+        return this;
+    },
+
+    removeInnerItem: function(item) {
+        item.element.detach();
+    },
+
+    removeBodyItem: function(item) {
+        item.setZIndex(null);
+        item.element.detach();
+    },
+
+    onItemRemove: function(item, index, destroying) {
+        var docked = item.getDocked();
+
+        if (docked) {
+            this.undockItem(item);
+        }
+        else if (item.isCentered()) {
+            this.onItemCenteredChange(item, false);
+        }
+        else if (item.isFloating()) {
+            this.onItemFloatingChange(item, false);
+        }
+        else {
+            this.onItemInnerStateChange(item, false, destroying);
+        }
+    },
+
+    onItemMove: function(item, toIndex, fromIndex) {
+        if (item.isCentered() || item.isFloating()) {
+            item.setZIndex((toIndex + 1) * 2);
+        }
+        else if (item.isInnerItem()) {
+            this.insertInnerItem(item, this.container.innerIndexOf(item));
+        }
+        else {
+            this.undockItem(item);
+            this.dockItem(item);
+        }
+    },
+
+    onItemCenteredChange: function(item, centered) {
+        var wrapperName = '$centerWrapper';
+
+        if (centered) {
+            this.insertBodyItem(item);
+            item.link(wrapperName, new Ext.util.Wrapper({
+                className: this.centerWrapperClass
+            }, item.element));
+        }
+        else {
+            item.unlink(wrapperName);
+            this.removeBodyItem(item);
+        }
+    },
+
+    onItemFloatingChange: function(item, floating) {
+        if (floating) {
+            this.insertBodyItem(item);
+        }
+        else {
+            this.removeBodyItem(item);
+        }
+    },
+
+    onBeforeItemDockedChange: function(item, docked, oldDocked) {
+        if (oldDocked) {
+            this.undockItem(item);
+        }
+    },
+
+    onAfterItemDockedChange: function(item, docked, oldDocked) {
+        if (docked) {
+            this.dockItem(item);
+        }
+    },
+
+    onContainerSizeStateChange: function() {
+        var dockWrapper = this.getDockWrapper();
+
+        if (dockWrapper) {
+            dockWrapper.setSizeState(this.container.getSizeState());
+        }
+    },
+
+    onContainerSizeFlagsChange: function() {
+        var items = this.dockedItems,
+            i, ln, item;
+
+        for (i = 0, ln = items.length; i < ln; i++) {
+            item = items[i];
+            this.refreshDockedItemLayoutSizeFlags(item);
+        }
+    },
+
+    refreshDockedItemLayoutSizeFlags: function(item) {
+        var container = this.container,
+            dockedDirection = this.positionDirectionMap[item.getDocked()],
+            binaryMask = (dockedDirection === 'horizontal') ? container.LAYOUT_HEIGHT : container.LAYOUT_WIDTH,
+            flags = (container.getSizeFlags() & binaryMask);
+
+        item.setLayoutSizeFlags(flags);
+    },
+
+    dockItem: function(item) {
+        var DockClass = Ext.layout.wrapper.BoxDock,
+            dockedItems = this.dockedItems,
+            ln = dockedItems.length,
+            container = this.container,
+            itemIndex = container.indexOf(item),
+            positionDirectionMap = this.positionDirectionMap,
+            direction = positionDirectionMap[item.getDocked()],
+            dockInnerWrapper = this.dockInnerWrapper,
+            referenceDirection, i, dockedItem, index, previousItem, slice,
+            referenceItem, referenceDocked, referenceWrapper, newWrapper, nestedWrapper;
+
+        this.monitorSizeStateChange();
+        this.monitorSizeFlagsChange();
+
+        if (!dockInnerWrapper) {
+            dockInnerWrapper = this.link('dockInnerWrapper', new Ext.layout.wrapper.Inner({
+                container: this.container
+            }));
+        }
+
+        if (ln === 0) {
+            dockedItems.push(item);
+
+            newWrapper = new DockClass({
+                container: this.container,
+                direction: direction
+            });
+
+            newWrapper.addItem(item);
+            newWrapper.getElement().replace(dockInnerWrapper.getElement());
+            newWrapper.setInnerWrapper(dockInnerWrapper);
+            container.onInitialized('onContainerSizeStateChange', this);
+        }
+        else {
+            for (i = 0; i < ln; i++) {
+                dockedItem = dockedItems[i];
+                index = container.indexOf(dockedItem);
+
+                if (index > itemIndex) {
+                    referenceItem = previousItem || dockedItems[0];
+                    dockedItems.splice(i, 0, item);
+                    break;
+                }
+
+                previousItem = dockedItem;
+            }
+
+            if (!referenceItem) {
+                referenceItem = dockedItems[ln - 1];
+                dockedItems.push(item);
+            }
+
+            referenceDocked = referenceItem.getDocked();
+            referenceWrapper = referenceItem.$dockWrapper;
+            referenceDirection = positionDirectionMap[referenceDocked];
+
+            if (direction === referenceDirection) {
+                referenceWrapper.addItem(item);
+            }
+            else {
+                slice = referenceWrapper.getItemsSlice(itemIndex);
+
+                newWrapper = new DockClass({
+                    container: this.container,
+                    direction: direction
+                });
+
+                if (slice.length > 0) {
+                    if (slice.length === referenceWrapper.itemsCount) {
+                        nestedWrapper = referenceWrapper;
+                        newWrapper.setSizeState(nestedWrapper.getSizeState());
+                        newWrapper.getElement().replace(nestedWrapper.getElement());
+                    }
+                    else {
+                        nestedWrapper = new DockClass({
+                            container: this.container,
+                            direction: referenceDirection
+                        });
+                        nestedWrapper.setInnerWrapper(referenceWrapper.getInnerWrapper());
+                        nestedWrapper.addItems(slice);
+                        referenceWrapper.setInnerWrapper(newWrapper);
+                    }
+
+                    newWrapper.setInnerWrapper(nestedWrapper);
+                }
+                else {
+                    newWrapper.setInnerWrapper(referenceWrapper.getInnerWrapper());
+                    referenceWrapper.setInnerWrapper(newWrapper);
+                }
+
+                newWrapper.addItem(item);
+            }
+        }
+
+        container.onInitialized('refreshDockedItemLayoutSizeFlags', this, [item]);
+    },
+
+    getDockWrapper: function() {
+        var dockedItems = this.dockedItems;
+
+        if (dockedItems.length > 0) {
+            return dockedItems[0].$dockWrapper;
+        }
+
+        return null;
+    },
+
+    undockItem: function(item) {
+        var dockedItems = this.dockedItems;
+
+        if (item.$dockWrapper) {
+            item.$dockWrapper.removeItem(item);
+        }
+
+        Ext.Array.remove(dockedItems, item);
+
+        item.setLayoutSizeFlags(0);
+    },
+
+    destroy: function() {
+        this.dockedItems.length = 0;
+
+        delete this.dockedItems;
+
+        this.callSuper();
+    }
+});

OfficeWeb/3rdparty/touch/src/layout/Fit.js

@@ -0,0 +1,45 @@
+/**
+ *
+ */
+Ext.define('Ext.layout.Fit', {
+    extend: 'Ext.layout.Default',
+
+    isFit: true,
+
+    alias: 'layout.fit',
+
+    layoutClass: 'x-layout-fit',
+
+    itemClass: 'x-layout-fit-item',
+
+    setContainer: function(container) {
+        this.callSuper(arguments);
+
+        container.innerElement.addCls(this.layoutClass);
+        this.onContainerSizeFlagsChange();
+        this.monitorSizeFlagsChange();
+    },
+
+    onContainerSizeFlagsChange: function() {
+        var container = this.container,
+            sizeFlags = container.getSizeFlags(),
+            stretched = Boolean(sizeFlags & container.LAYOUT_STRETCHED),
+            innerItems = container.innerItems,
+            i, ln, item;
+
+        this.callSuper();
+
+        for (i = 0,ln = innerItems.length; i < ln; i++) {
+            item = innerItems[i];
+            item.setLayoutSizeFlags(sizeFlags);
+        }
+
+        container.innerElement.toggleCls('x-stretched', stretched);
+    },
+
+    onItemInnerStateChange: function(item, isInner) {
+        this.callSuper(arguments);
+        item.toggleCls(this.itemClass, isInner);
+        item.setLayoutSizeFlags(isInner ? this.container.getSizeFlags() : 0);
+    }
+});

OfficeWeb/3rdparty/touch/src/layout/FlexBox.js

@@ -0,0 +1,201 @@
+/**
+ *
+ */
+Ext.define('Ext.layout.FlexBox', {
+    extend: 'Ext.layout.Box',
+
+    alias: 'layout.box',
+
+    config: {
+        align: 'stretch'
+    },
+
+    layoutBaseClass: 'x-layout-box',
+
+    itemClass: 'x-layout-box-item',
+
+    setContainer: function(container) {
+        this.callSuper(arguments);
+
+        this.monitorSizeFlagsChange();
+    },
+
+    applyOrient: function(orient) {
+        //<debug error>
+        if (orient !== 'horizontal' && orient !== 'vertical') {
+            Ext.Logger.error("Invalid box orient of: '" + orient + "', must be either 'horizontal' or 'vertical'");
+        }
+        //</debug>
+
+        return orient;
+    },
+
+    updateOrient: function(orient, oldOrient) {
+        var container = this.container,
+            delegation = {
+                delegate: '> component'
+            };
+
+        if (orient === 'horizontal') {
+            this.sizePropertyName = 'width';
+        }
+        else {
+            this.sizePropertyName = 'height';
+        }
+
+        container.innerElement.swapCls('x-' + orient, 'x-' + oldOrient);
+
+        if (oldOrient) {
+            container.un(oldOrient === 'horizontal' ? 'widthchange' : 'heightchange', 'onItemSizeChange', this, delegation);
+            this.redrawContainer();
+        }
+
+        container.on(orient === 'horizontal' ? 'widthchange' : 'heightchange', 'onItemSizeChange', this, delegation);
+    },
+
+    onItemInnerStateChange: function(item, isInner) {
+        this.callSuper(arguments);
+
+        var flex, size;
+
+        item.toggleCls(this.itemClass, isInner);
+
+        if (isInner) {
+            flex = item.getFlex();
+            size = item.get(this.sizePropertyName);
+
+            if (flex) {
+                this.doItemFlexChange(item, flex);
+            }
+            else if (size) {
+                this.doItemSizeChange(item, size);
+            }
+        }
+
+        this.refreshItemSizeState(item);
+    },
+
+    refreshItemSizeState: function(item) {
+        var isInner = item.isInnerItem(),
+            container = this.container,
+            LAYOUT_HEIGHT = container.LAYOUT_HEIGHT,
+            LAYOUT_WIDTH = container.LAYOUT_WIDTH,
+            dimension = this.sizePropertyName,
+            layoutSizeFlags = 0,
+            containerSizeFlags = container.getSizeFlags();
+
+        if (isInner) {
+            layoutSizeFlags |= container.LAYOUT_STRETCHED;
+
+            if (this.getAlign() === 'stretch') {
+                layoutSizeFlags |= containerSizeFlags & (dimension === 'width' ? LAYOUT_HEIGHT : LAYOUT_WIDTH);
+            }
+
+            if (item.getFlex()) {
+                layoutSizeFlags |= containerSizeFlags & (dimension === 'width' ? LAYOUT_WIDTH : LAYOUT_HEIGHT);
+            }
+        }
+
+        item.setLayoutSizeFlags(layoutSizeFlags);
+    },
+
+    refreshAllItemSizedStates: function() {
+        var innerItems = this.container.innerItems,
+            i, ln, item;
+
+        for (i = 0,ln = innerItems.length; i < ln; i++) {
+            item = innerItems[i];
+            this.refreshItemSizeState(item);
+        }
+    },
+
+    onContainerSizeFlagsChange: function() {
+        this.refreshAllItemSizedStates();
+
+        this.callSuper(arguments);
+    },
+
+    onItemSizeChange: function(item, size) {
+        if (item.isInnerItem()) {
+            this.doItemSizeChange(item, size);
+        }
+    },
+
+    doItemSizeChange: function(item, size) {
+        if (size) {
+            item.setFlex(null);
+            this.redrawContainer();
+        }
+    },
+
+    onItemFlexChange: function(item, flex) {
+        if (item.isInnerItem()) {
+            this.doItemFlexChange(item, flex);
+            this.refreshItemSizeState(item);
+        }
+    },
+
+    doItemFlexChange: function(item, flex) {
+        this.setItemFlex(item, flex);
+
+        if (flex) {
+            item.set(this.sizePropertyName, null);
+        }
+        else {
+            this.redrawContainer();
+        }
+    },
+
+    redrawContainer: function() {
+        var container = this.container,
+            renderedTo = container.element.dom.parentNode;
+
+        if (renderedTo && renderedTo.nodeType !== 11) {
+            container.innerElement.redraw();
+        }
+    },
+
+    /**
+     * Sets the flex of an item in this box layout.
+     * @param {Ext.Component} item The item of this layout which you want to update the flex of.
+     * @param {Number} flex The flex to set on this method
+     */
+    setItemFlex: function(item, flex) {
+        var element = item.element;
+
+        element.toggleCls('x-flexed', !!flex);
+        element.setStyle('-webkit-box-flex', flex);
+    },
+
+    convertPosition: function(position) {
+        var positionMap = this.positionMap;
+
+        if (positionMap.hasOwnProperty(position)) {
+            return positionMap[position];
+        }
+
+        return position;
+    },
+
+    applyAlign: function(align) {
+        return this.convertPosition(align);
+    },
+
+    updateAlign: function(align, oldAlign) {
+        var container = this.container;
+
+        container.innerElement.swapCls(align, oldAlign, true, 'x-align');
+
+        if (oldAlign !== undefined) {
+            this.refreshAllItemSizedStates();
+        }
+    },
+
+    applyPack: function(pack) {
+        return this.convertPosition(pack);
+    },
+
+    updatePack: function(pack, oldPack) {
+        this.container.innerElement.swapCls(pack, oldPack, true, 'x-pack');
+    }
+});

OfficeWeb/3rdparty/touch/src/layout/Float.js

@@ -0,0 +1,33 @@
+/**
+ *
+ */
+Ext.define('Ext.layout.Float', {
+    extend: 'Ext.layout.Default',
+
+    alias: 'layout.float',
+
+    config: {
+        direction: 'left'
+    },
+
+    layoutClass: 'layout-float',
+
+    itemClass: 'layout-float-item',
+
+    setContainer: function(container) {
+        this.callSuper(arguments);
+
+        container.innerElement.addCls(this.layoutClass);
+    },
+
+    onItemInnerStateChange: function(item, isInner) {
+        this.callSuper(arguments);
+        item.toggleCls(this.itemClass, isInner);
+    },
+
+    updateDirection: function(direction, oldDirection) {
+        var prefix = 'direction-';
+
+        this.container.innerElement.swapCls(prefix + direction, prefix + oldDirection);
+    }
+});

OfficeWeb/3rdparty/touch/src/layout/HBox.js

@@ -0,0 +1,8 @@
+/**
+ *
+ */
+Ext.define('Ext.layout.HBox', {
+    extend: 'Ext.layout.FlexBox',
+
+    alias: 'layout.hbox'
+});

OfficeWeb/3rdparty/touch/src/layout/VBox.js

@@ -0,0 +1,12 @@
+/**
+ *
+ */
+Ext.define('Ext.layout.VBox', {
+    extend: 'Ext.layout.FlexBox',
+
+    alias: 'layout.vbox',
+
+    config: {
+        orient: 'vertical'
+    }
+});

OfficeWeb/3rdparty/touch/src/layout/wrapper/BoxDock.js

@@ -0,0 +1,195 @@
+/**
+ *
+ */
+Ext.define('Ext.layout.wrapper.BoxDock', {
+    config: {
+        direction: 'horizontal',
+        element: {
+            className: 'x-dock'
+        },
+        bodyElement: {
+            className: 'x-dock-body'
+        },
+        innerWrapper: null,
+        sizeState: false,
+        container: null
+    },
+
+    positionMap: {
+        top: 'start',
+        left: 'start',
+        bottom: 'end',
+        right: 'end'
+    },
+
+    constructor: function(config) {
+        this.items = {
+            start: [],
+            end: []
+        };
+
+        this.itemsCount = 0;
+
+        this.initConfig(config);
+    },
+
+    addItems: function(items) {
+        var i, ln, item;
+
+        for (i = 0, ln = items.length; i < ln; i++) {
+            item = items[i];
+            this.addItem(item);
+        }
+    },
+
+    addItem: function(item) {
+        var docked = item.getDocked(),
+            position = this.positionMap[docked],
+            wrapper = item.$dockWrapper,
+            container = this.getContainer(),
+            index = container.indexOf(item),
+            element = item.element,
+            items = this.items,
+            sideItems = items[position],
+            i, ln, sibling, referenceElement, siblingIndex;
+
+        if (wrapper) {
+            wrapper.removeItem(item);
+        }
+
+        item.$dockWrapper = this;
+        item.addCls('x-dock-item');
+        item.addCls('x-docked-' + docked);
+
+        for (i = 0, ln = sideItems.length; i < ln; i++) {
+            sibling = sideItems[i];
+            siblingIndex = container.indexOf(sibling);
+
+            if (siblingIndex > index) {
+                referenceElement = sibling.element;
+                sideItems.splice(i, 0, item);
+                break;
+            }
+        }
+
+        if (!referenceElement) {
+            sideItems.push(item);
+            referenceElement = this.getBodyElement();
+        }
+
+        this.itemsCount++;
+
+        if (position === 'start') {
+            element.insertBefore(referenceElement);
+        }
+        else {
+            element.insertAfter(referenceElement);
+        }
+    },
+
+    removeItem: function(item) {
+        var position = item.getDocked(),
+            items = this.items[this.positionMap[position]];
+
+        Ext.Array.remove(items, item);
+        item.element.detach();
+        delete item.$dockWrapper;
+        item.removeCls('x-dock-item');
+        item.removeCls('x-docked-' + position);
+
+        if (--this.itemsCount === 0) {
+            this.destroy();
+        }
+    },
+
+    getItemsSlice: function(index) {
+        var container = this.getContainer(),
+            items = this.items,
+            slice = [],
+            sideItems, i, ln, item;
+
+        for (sideItems = items.start, i = 0, ln = sideItems.length; i < ln; i++) {
+            item = sideItems[i];
+            if (container.indexOf(item) > index) {
+                slice.push(item);
+            }
+        }
+
+        for (sideItems = items.end, i = 0, ln = sideItems.length; i < ln; i++) {
+            item = sideItems[i];
+            if (container.indexOf(item) > index) {
+                slice.push(item);
+            }
+        }
+
+        return slice;
+    },
+
+    applyElement: function(element) {
+        return Ext.Element.create(element);
+    },
+
+    updateElement: function(element) {
+        element.addCls('x-dock-' + this.getDirection());
+    },
+
+    applyBodyElement: function(bodyElement) {
+        return Ext.Element.create(bodyElement);
+    },
+
+    updateBodyElement: function(bodyElement) {
+        this.getElement().append(bodyElement);
+    },
+
+    updateInnerWrapper: function(innerWrapper, oldInnerWrapper) {
+        var bodyElement = this.getBodyElement();
+
+        if (oldInnerWrapper && oldInnerWrapper.$outerWrapper === this) {
+            oldInnerWrapper.getElement().detach();
+            delete oldInnerWrapper.$outerWrapper;
+        }
+
+        if (innerWrapper) {
+            innerWrapper.setSizeState(this.getSizeState());
+            innerWrapper.$outerWrapper = this;
+            bodyElement.append(innerWrapper.getElement());
+        }
+    },
+
+    updateSizeState: function(state) {
+        var innerWrapper = this.getInnerWrapper();
+
+        this.getElement().setSizeState(state);
+
+        if (innerWrapper) {
+            innerWrapper.setSizeState(state);
+        }
+    },
+
+    destroy: function() {
+        var innerWrapper = this.getInnerWrapper(),
+            outerWrapper = this.$outerWrapper,
+            innerWrapperElement;
+
+        if (innerWrapper) {
+            if (outerWrapper) {
+                outerWrapper.setInnerWrapper(innerWrapper);
+            }
+            else {
+                innerWrapperElement = innerWrapper.getElement();
+                if (!innerWrapperElement.isDestroyed) {
+                    innerWrapperElement.replace(this.getElement());
+                }
+                delete innerWrapper.$outerWrapper;
+            }
+        }
+
+        delete this.$outerWrapper;
+
+        this.setInnerWrapper(null);
+
+        this.unlink('_bodyElement', '_element');
+
+        this.callSuper();
+    }
+});

OfficeWeb/3rdparty/touch/src/layout/wrapper/Dock.js

@@ -0,0 +1,200 @@
+/**
+ *
+ */
+Ext.define('Ext.layout.wrapper.Dock', {
+    requires: [
+        'Ext.util.Wrapper'
+    ],
+
+    config: {
+        direction: 'horizontal',
+        element: {
+            className: 'x-dock'
+        },
+        bodyElement: {
+            className: 'x-dock-body'
+        },
+        innerWrapper: null,
+        sizeState: false,
+        container: null
+    },
+
+    positionMap: {
+        top: 'start',
+        left: 'start',
+        bottom: 'end',
+        right: 'end'
+    },
+
+    constructor: function(config) {
+        this.items = {
+            start: [],
+            end: []
+        };
+
+        this.itemsCount = 0;
+
+        this.initConfig(config);
+    },
+
+    addItems: function(items) {
+        var i, ln, item;
+
+        for (i = 0, ln = items.length; i < ln; i++) {
+            item = items[i];
+            this.addItem(item);
+        }
+    },
+
+    addItem: function(item) {
+        var docked = item.getDocked(),
+            position = this.positionMap[docked],
+            wrapper = item.$dockWrapper,
+            container = this.getContainer(),
+            index = container.indexOf(item),
+            items = this.items,
+            sideItems = items[position],
+            itemWrapper, element, i, ln, sibling, referenceElement, siblingIndex;
+
+        if (wrapper) {
+            wrapper.removeItem(item);
+        }
+
+        item.$dockWrapper = this;
+        itemWrapper = item.link('$dockItemWrapper', new Ext.util.Wrapper({
+            className: 'x-dock-item'
+        }));
+        item.addCls('x-docked-' + docked);
+        element = itemWrapper.element;
+
+        for (i = 0, ln = sideItems.length; i < ln; i++) {
+            sibling = sideItems[i];
+            siblingIndex = container.indexOf(sibling);
+
+            if (siblingIndex > index) {
+                referenceElement = sibling.element;
+                sideItems.splice(i, 0, item);
+                break;
+            }
+        }
+
+        if (!referenceElement) {
+            sideItems.push(item);
+            referenceElement = this.getBodyElement();
+        }
+
+        this.itemsCount++;
+
+        if (position === 'start') {
+            element.insertBefore(referenceElement);
+        }
+        else {
+            element.insertAfter(referenceElement);
+        }
+
+        itemWrapper.wrap(item.element);
+        itemWrapper.bindSize(this.getDirection() === 'horizontal' ? 'width' : 'height');
+    },
+
+    removeItem: function(item) {
+        var position = item.getDocked(),
+            items = this.items[this.positionMap[position]];
+
+        item.removeCls('x-docked-' + position);
+        Ext.Array.remove(items, item);
+        item.unlink('$dockItemWrapper');
+        item.element.detach();
+        delete item.$dockWrapper;
+
+        if (--this.itemsCount === 0) {
+            this.destroy();
+        }
+    },
+
+    getItemsSlice: function(index) {
+        var container = this.getContainer(),
+            items = this.items,
+            slice = [],
+            sideItems, i, ln, item;
+
+        for (sideItems = items.start, i = 0, ln = sideItems.length; i < ln; i++) {
+            item = sideItems[i];
+            if (container.indexOf(item) > index) {
+                slice.push(item);
+            }
+        }
+
+        for (sideItems = items.end, i = 0, ln = sideItems.length; i < ln; i++) {
+            item = sideItems[i];
+            if (container.indexOf(item) > index) {
+                slice.push(item);
+            }
+        }
+
+        return slice;
+    },
+
+    applyElement: function(element) {
+        return Ext.Element.create(element);
+    },
+
+    updateElement: function(element) {
+        element.addCls('x-dock-' + this.getDirection());
+    },
+
+    applyBodyElement: function(bodyElement) {
+        return Ext.Element.create(bodyElement);
+    },
+
+    updateBodyElement: function(bodyElement) {
+        this.getElement().append(bodyElement);
+    },
+
+    updateInnerWrapper: function(innerWrapper, oldInnerWrapper) {
+        var innerElement = this.getBodyElement();
+
+        if (oldInnerWrapper && oldInnerWrapper.$outerWrapper === this) {
+            innerElement.remove(oldInnerWrapper.getElement());
+            delete oldInnerWrapper.$outerWrapper;
+        }
+
+        if (innerWrapper) {
+            innerWrapper.setSizeState(this.getSizeState());
+            innerWrapper.$outerWrapper = this;
+            innerElement.append(innerWrapper.getElement());
+        }
+    },
+
+    updateSizeState: function(state) {
+        var innerWrapper = this.getInnerWrapper();
+
+        this.getElement().setSizeState(state);
+
+        if (innerWrapper) {
+            innerWrapper.setSizeState(state);
+        }
+    },
+
+    destroy: function() {
+        var innerWrapper = this.getInnerWrapper(),
+            outerWrapper = this.$outerWrapper;
+
+        if (innerWrapper) {
+            if (outerWrapper) {
+                outerWrapper.setInnerWrapper(innerWrapper);
+            }
+            else {
+                innerWrapper.getElement().replace(this.getElement());
+                delete innerWrapper.$outerWrapper;
+            }
+        }
+
+        delete this.$outerWrapper;
+
+        this.setInnerWrapper(null);
+
+        this.unlink('_bodyElement', '_element');
+
+        this.callSuper();
+    }
+});

OfficeWeb/3rdparty/touch/src/layout/wrapper/Inner.js

@@ -0,0 +1,21 @@
+/**
+ *
+ */
+Ext.define('Ext.layout.wrapper.Inner', {
+    config: {
+        sizeState: null,
+        container: null
+    },
+
+    constructor: function(config) {
+        this.initConfig(config);
+    },
+
+    getElement: function() {
+        return this.getContainer().bodyElement;
+    },
+
+    setInnerWrapper: Ext.emptyFn,
+
+    getInnerWrapper: Ext.emptyFn
+});