重构slide切换

@@ -52,12 +52,16 @@
         {{> index/girl-recommend}} 
     {{/ recommend}}
     
+    {{! 手风琴}}
+    {{# accordion}}
+        {{> index/slide-accordion}} 
+    {{/ accordion}}
+
     {{! 单品/广告}}  
     {{# singlehot}}
         {{> index/girl-singlehot}} 
     {{/ singlehot}}
 
-
     {{! 新品上架}}
     {{# newArrivls}}
         {{> index/commodity}}

@@ -16,6 +16,11 @@
         {{> index/category-floor}}   
     {{/ category}}
 
+    {{! 手风琴}}
+    {{# accordion}}
+        {{> index/slide-accordion}} 
+    {{/ accordion}}
+    
     {{! 单品/广告}}  
     {{# singlehot}}
         {{> index/girl-singlehot}} 

+{{> index/floor-header}}
+<div class="slide-accordion">
+    <div class="slide-list">
+        <ul>
+            {{#each slide}}
+                <li><a title="{{name}}" href="{{href}}"><img class="lazy" data-original="{{img}}"/></a></li>
+            {{/each}}
+        </ul>
+    </div>
+</div>
+

+var Slide = require('./yohoui/YH.slide');
+var $ = require('yoho.jquery');
+
+var $contain = $('.slide-list','.slide-accordion');
+var $item = $contain.find('li');
+
+var $width = 650;
+var slide;
+
+function switchfun(to){
+    $item.each(function(index){
+    
+        if(index<=to){
+            $(this).stop().animate({
+                "left":index*(120+5)
+            });
+        }else{
+            $(this).stop().animate({
+                "left":(to)*(120+5)+$width+(120+5)*(index-to-1)
+            });
+        }
+    });
+}
+
+switchfun(0);
+
+slide=new Slide({ length: 5, loop: false, auto: false, timeout: 2,index: 3});
+
+slide.on('change', function (data) {
+    switchfun(data.to);
+});
+
+$item.mouseover(function () {
+    slide.go($(this).index());
+});
+
+slide.init();
\ No newline at end of file

+var classtype = {
+        "[object Array]": "array",
+        "[object Boolean]": "boolean",
+        "[object Date]": "date",
+        "[object Function]": "function",
+        "[object Number]": "number",
+        "[object Object]": "object",
+        "[object RegExp]": "regexp",
+        "[object String]": "string"
+    };
+var me = {
+    __Index: 0,
+    list: new Array(),
+    get: function(id) {
+        return id === undefined ? this.list : this.list[id];
+    },
+    fn: new Function(),
+    inherit: function(childClass, parentClass) {
+        
+        var Constructor = new Function();
+        Constructor.prototype = parentClass.prototype;
+        
+        childClass.prototype = new Constructor();
+        childClass.prototype.constructor = childClass;
+        childClass.superclass = parentClass.prototype;
+
+        if (childClass.prototype.constructor == Object.prototype.constructor) {
+            childClass.prototype.constructor = parentClass;
+        }
+    },
+    extend: function(obj, newProperties) {
+        var key;
+        
+        for (key in newProperties) {
+
+            if (newProperties.hasOwnProperty(key)) {
+                obj[key] = newProperties[key];
+            }
+        }
+        return obj;
+    },
+    copy: function(targetClass, obj, newProperties) {
+        
+        if (typeof obj !== 'object') {
+            return obj;
+        }
+        var value = obj.valueOf();
+        
+        if (obj != value) {
+            return new obj.constructor(value);
+        }
+
+        var o;
+        
+        if (obj instanceof obj.constructor && obj.constructor !== Object) {
+            if (targetClass) {
+                o = new targetClass();
+            } else {
+                o = me.clone(obj.constructor.prototype);
+            }
+
+            for (var key in obj) {
+                if (targetClass || obj.hasOwnProperty(key)) {
+                    o[key] = obj[key];
+                }
+            }
+        } else {
+            o = {};
+            for (var key in obj) {
+                o[key] = obj[key];
+            }
+        }
+
+        if (newProperties) {
+            for (var key in newProperties) {
+                o[key] = newProperties[key];
+            }
+        }
+
+        return o;
+    },
+    clone: function(obj) {
+        me.__cloneFunc.prototype = obj;
+        return new me.__cloneFunc();
+    },
+    __cloneFunc: function() {
+    },
+    delegate: function(func, scope) {
+        scope = scope || window;
+        
+        if (arguments.length > 2) {
+            var args = Array.prototype.slice.call(arguments, 2);
+            return function() {
+                return func.apply(scope, args);
+            }
+        } else {
+            return function() {
+                return func.call(scope);
+            }
+        }
+    },
+    dom: function($select, classCss) {
+        var wrap = $select;
+        var name, DOM = {
+            wrap: $(wrap)
+        },
+            els = wrap[0].getElementsByTagName("*"),
+            elsLen = els.length;
+        
+        for (var i = 0; i < elsLen; i++) {
+            name = els[i].className;
+            if (name.indexOf(classCss) > -1) {
+                name = name.split(classCss)[1];
+            }
+            if (name) {
+                DOM[name] = $(els[i], wrap)
+            }
+        }
+        return DOM
+    },
+    //模板引擎
+    template: function() {
+        var args = arguments, result;
+        
+        if (args.length > 0) {
+            
+            if (me.isString(args[0])) {
+                result = args[0];
+            
+                if (args.length == 2 && me.isObject(args[1])) {
+            
+                    for (var key in args[1]) {
+            
+                        if (args[1][key] != undefined) {
+                            var reg = new RegExp("({" + key + "})", "g");
+                            result = result.replace(reg, args[1][key]);
+                        }
+                    }
+                } else {
+            
+                    for (var i = 1; i < args.length; i++) {
+            
+                        if (args[i] != undefined) {
+                            var reg = new RegExp("({[" + (i - 1) + "]})", "g");
+                            result = result.replace(reg, args[i]);
+                        }
+                    }
+                }
+            }
+        }
+        return result;
+    },
+    __type: function(obj) {
+        return obj == null ? String(obj) : classtype[Object.prototype.toString.call(obj)] || "object";
+    },
+    isObject: function(obj) {
+        return this.isFunction(obj) || !!(obj && 'object' === typeof obj);
+    },
+    isFunction: function(obj) {
+        return this.__type(obj) === "function";
+    },
+    isArray: Array.isArray || function(obj) {
+        return this.__type(obj) === "array";
+    },
+    isNum: function(obj) {
+        return !isNaN(parseFloat(obj)) && isFinite(obj);
+    },
+    isString: function(obj) {
+        return this.__type(obj) === "string";
+    },
+    each: function(data, callback, args) {
+        var i, len;
+        
+        if (me.isArray(data)) {
+        
+            for (i = 0, len = data.length; i < len; i++) {
+        
+                if (callback.call(data[i], i, data[i], args) === false) {
+                    break;
+                }
+            }
+        } else {
+        
+            for (i in data) {
+        
+                if (callback.call(data[i], i, data[i], args) === false) {
+                    break;
+                }
+            }
+        }
+    },
+    funManager: {
+        __loadList: {},
+        __loadFun: function(item, callback, win) {
+        
+            if (item.methord && me.isFunction(item.methord())) {
+                win = win || window;
+                item.methord()(item, function() {
+                    callback();
+                }, win);
+            }
+        },
+        load: function(fns, statechange, win, __index) {
+            __index = __index || 0;
+        
+            if (fns[__index]) {
+                me.funManager.__loadFun(fns[__index], function() {
+                    me.funManager.load(fns, statechange, win, __index + 1);
+                }, win);
+            }
+            statechange(__index, win);
+        },
+        get: function(id) {
+            return this.__loadList[id];
+        }
+    },
+    log: function(msg) {
+        var console = window.console || { log: function() { } };
+        console.log(msg);
+    },
+    Event: {
+        mousewheel: function(e) {
+            var _eoe = e.originalEvent;
+            var _de = _eoe.detail ? _eoe.detail * -1 : _eoe.wheelDelta / 40;
+            var _direction = _de < 0 ? -1 : 1;
+            return {
+                direction: _direction,
+                unit: _de
+            }
+        },
+        __: function(_e, el, event, handle) {
+        
+            for (var key in _e) {
+        
+                if (win[_e[key].validator]) {
+                    el[_e[key].validator](_e[key].prefix + event, handle, false);
+                    break;
+                }
+            }
+        },
+        add: function(el, event, handle) {
+            var _e = [
+                { validator: 'addEventListener', prefix: '' },
+                { validator: 'attachEvent', prefix: 'on' }
+            ];
+            this.__(_e, el, event, handle);
+        },
+        remove: function(el, event, handle) {
+            var _e = [
+                { validator: 'removeEventListener', prefix: '' },
+                { validator: 'detachEvent', prefix: 'on' }
+            ];
+            this.__(_e, el, event, handle);
+        }
+    },
+    getUid: function(_name) {
+        return me.template("me-{0}{1}-{2}", _name, new Date().getTime(), me.__Index++)
+    },
+    Browser: {
+        isTouch: function() {
+            var msGesture = window.navigator && window.navigator.msPointerEnabled && window.MSGesture;
+            return (("ontouchstart" in window) || msGesture || window.DocumentTouch && document instanceof DocumentTouch) ? true : false;
+        },
+        Prefix: function() {
+            var props = ['perspectiveProperty', 'WebkitPerspective', 'MozPerspective', 'OPerspective', 'msPerspective'];
+            var obj = document.createElement('div');
+        
+            for (var i in props) {
+        
+                if (obj.style[props[i]] !== undefined) {
+                    return me.template("-{0}-", props[i].replace('Perspective', '').toLowerCase());
+                }
+            }
+        },
+        parseURL: function(url) {
+            var a = document.createElement('a');
+            a.href = url;
+            return {
+                source: url,
+                protocol: a.protocol.replace(':', ''),
+                host: a.hostname,
+                port: a.port,
+                query: a.search,
+                params: (function() {
+                    var ret = {},
+                        seg = a.search.replace(/^\?/, '').split('&'),
+                        len = seg.length, i = 0, s;
+                    for (; i < len; i++) {
+                        if (!seg[i]) { continue; }
+                        s = seg[i].split('=');
+                        ret[s[0]] = s[1];
+                    }
+                    return ret;
+                })(),
+                file: (a.pathname.match(/\/([^\/?#]+)$/i) || [, ''])[1],
+                hash: a.hash.replace('#', ''),
+                path: a.pathname.replace(/^([^\/])/, '/$1'),
+                relative: (a.href.match(/tps?:\/\/[^\/]+(.+)/) || [, ''])[1],
+                segments: a.pathname.replace(/^\//, '').split('/')
+            };
+        }
+    },
+    Array: {
+        indexOf: function(array, val) {
+        
+            for (var i = 0; i < array.length; i++) {
+                if (this[i] == val) return i;
+            }
+            return -1;
+        },
+        remove: function(array, val) {
+            var index = this.indexOf(array, val);
+        
+            if (index > -1) {
+                array.splice(index, 1);
+            }
+            return array;
+        }
+    }
+}
+var assembly = function(options) {
+    this.initialized = false;
+    this.registerEvent = {
+        before: [],
+        change: [],
+        after: []
+    };
+    this.options = options;
+
+    this.init(options);
+}
+assembly.output = function() {
+    me.log(me.list);
+}
+assembly.prototype.oninit = me.fn;
+assembly.prototype.init = function(cfg) {
+    this.initialized = true;
+
+    // function _getClassName(_constructor, _constr) {
+    //     var _constr = _constr || "";
+    //     if (_constructor.superclass) {
+    //         var args = /(\w+)\.superclass/.exec(_constructor.arguments.callee);
+    //         if (args != null) {
+    //             _constr += args[1] + "-";
+    //             // return _getClassName(_constructor.superclass.constructor, _constr);
+    //         }
+    //     }
+    //     return _constr;
+    // }
+    this.__Uid = me.getUid('me');
+    this.oninit(cfg);
+    me.list[this.__Uid] = this;
+};
+assembly.prototype.destory = function() {
+    this.initialized = false;
+    delete me.list[this.__Uid];
+};
+assembly.prototype.getUid = function() {
+    return this.__Uid;
+}
+assembly.prototype.getOptions = function() {
+    return this.options;
+}
+assembly.prototype.config = function() {
+    
+    if (arguments.length > 0) {
+    
+        if (typeof (arguments[0]) === "string") {
+    
+            if (arguments.length > 1) {
+                this.options[arguments[0]] = arguments[1];
+            } else {
+                return this.options[name];
+            }
+        }
+    } else {
+        return this.options;
+    }
+};
+assembly.prototype.on = function(name, callback) {
+    var __self = this;
+    var _e = __self.registerEvent[name];
+    
+    if (_e) {
+        _e.push(callback);
+    }
+    return _e;
+};
+assembly.prototype.off = function(name, callback) {
+    var __self = this;
+    var _e = __self.registerEvent[name];
+    var e = [];
+    me.each(_e, function(name, _callback) {
+    
+        if (_callback === callback) {
+            e.push(name);
+        }
+    });
+    me.each(e.reverse(), function(name, _callback) {
+        _e.splice(_callback, 1);
+    });
+};
+me.assembly = assembly;
+
+module.exports =me; 
\ No newline at end of file

+var me = require('./YH.base');
+
+var slide = function (options) {
+    this.__lastTime = null;
+    this.__isStop = false;
+    options = me.extend(this.defaults, options);
+    slide.superclass.constructor.call(this, options);
+}
+
+me.inherit(slide, me.assembly);
+
+slide.prototype.oninit = function () {
+    var __self = this, _o = __self.options;
+    if (_o.auto) {
+        __self.play();
+    }
+    __self.go(_o.index);
+    return this;
+}
+
+slide.prototype.go = function (_to, _from) {
+    var __self = this, _o = __self.options;
+    if (__self.__lastTime) {
+        clearTimeout(__self.__lastTime);
+        __self.__lastTime = null;
+    }
+    _from = "undefined" == typeof _from ? _o.index : _from;
+    var _direction = _to === _from ? 0 : _to > _from ? 1 : -1;
+    var _loop = _o.loop, _index = _o.length - 1, _originalto = _to;
+    if (_loop) {
+        if (_to > _index) {
+            _to = _to - _index - 1;
+        } else {
+            if (0 > _to) {
+                _to = _to + _index + 1;
+            } else {
+                _to = _to;
+            }
+        }
+    } else {
+        if (_to > _index) {
+            _to = _index;
+        } else {
+            if (0 > _to) {
+                _to = 0;
+            } else {
+                _to = _to;
+            }
+        }
+    }
+    var _current = _o.index = _to;
+
+    var o = {
+        from: _from,
+        to: _to,
+        originalto: _originalto,
+        direction: _direction
+    }
+    for (var key in __self.registerEvent) {
+        if (__self.registerEvent[key].length > 0) {
+            for (_e in __self.registerEvent[key]) {
+                __self.registerEvent[key][_e](o);
+            }
+        }
+    }
+
+    if (_current !== _index || _to) {
+        if (!__self.__isStop && _o.auto) {
+            __self.play();
+        }
+    } else {
+        if (__self.__lastTime) {
+            clearTimeout(__self.__lastTime);
+        }
+    }
+}
+
+slide.prototype.play = function () {
+    var __self = this, _o = __self.options;
+    __self.__lastTime = setTimeout(function () {
+        __self.next();
+    }, 1000 * _o.timeout);
+    return this;
+}
+
+slide.prototype.next = function () {
+    var __self = this, _o = __self.options;
+    var _from = _o.index;
+    var _to = _from + _o.step;
+    __self.go(_to, _from);
+}
+
+slide.prototype.prev = function () {
+    var __self = this, _o = __self.options;
+    var _from = _o.index;
+    var _to = _from - _o.step;
+    __self.go(_to, _from);
+}
+
+slide.prototype.pause = function () {
+    var __self = this, _o = __self.options;
+    if (__self.__lastTime) {
+        clearTimeout(__self.__lastTime);
+    }
+    __self.__isStop = true;
+}
+
+slide.prototype.resume = function () {
+    var __self = this, _o = __self.options;
+    __self.__isStop = false;
+    __self.play();
+}
+
+slide.prototype.defaults = {
+    index: 0,
+    timeout: 5,
+    step: 1,
+    per: 1,
+    auto: false,
+    loop: false
+}
+
+module.exports =slide; 
\ No newline at end of file

@@ -13,6 +13,9 @@ var $ = require('yoho.jquery'),
 require('../common/slider');
 require('../common/slider2');
 
+require('../common/accordion');
+
+
 require('../common/new-arrivls')($data.url, {
                 pageCount: $data.pageCount,
                 flag: $data.flag

@@ -82,3 +82,4 @@
         width: 100% !important;
     }
 }
+@import "_slide-accordion";
\ No newline at end of file

@@ -582,7 +582,7 @@
 
     .commodity{
         position: relative;
-        width: 1160px;
+        width: 1150px;
         margin-bottom:80px; 
         .commodity-list{
             margin-left: -10px;
@@ -623,6 +623,7 @@
             }
         }
         .commodity-brands{
+             margin-left: -8px;
             a{
                 float: left;
                 margin-left: 8px;

+.slide-accordion{
+    .slide-list{
+        width: 1150px;
+        height: 400px;
+        overflow: hidden;
+        position: relative;    
+        }
+        ul{
+            position: absolute;
+            left: -5px; 
+        }
+        li{
+            position: absolute;
+            width: 650px;
+            height: 400px;
+            display: block;
+            border-left: 5px solid #fff;
+        }
+}
+

@@ -382,6 +382,19 @@ class GirlsController extends AbstractAction
                 array(
                         'recommend'=>$tpldata
                     ),
+                array(
+                    'accordion'=>array(
+                        'name' => '新品牌入驻 NEW',
+                        'navs' => array(
+                            array(
+                                'id' => '',
+                                'href' => '',
+                                'name' => 'MORE'
+                                )
+                        ),
+                        'slide'=>array( $name_href_img,$name_href_img,$name_href_img,$name_href_img,$name_href_img)
+                        )
+                ),
                  array(
                     'singlehot'=>array(
                         'name' => '单品 HOT',
@@ -439,7 +452,7 @@ class GirlsController extends AbstractAction
                     );
             $result=array(
                 'code'=>200,
-                'commodity'=>array($data,$data,$data,$data,$data)
+                'commodity'=>array($data,$data,$data,$data)
             );
         } while (false);
 

@@ -508,6 +508,19 @@ class LifestyleController extends AbstractAction
                     )
                 ),
                 array(
+                    'accordion'=>array(
+                        'name' => '新品牌入驻 NEW',
+                        'navs' => array(
+                            array(
+                                'id' => '',
+                                'href' => '',
+                                'name' => 'MORE'
+                                )
+                        ),
+                        'slide'=>array( $name_href_img,$name_href_img,$name_href_img,$name_href_img,$name_href_img)
+                        )
+                ),
+                array(
                     'singlehot'=>array(
                         'name' => '人气单品 TOP100',
                         'imgHot' => array( $name_href_name_price_tip,$name_href_name_price_tip,$name_href_name_price_tip,$name_href_img_price,$name_href_img_price,$name_href_img_price,$name_href_img_price,$name_href_img_price,$name_href_img_price,$name_href_img_price,$name_href_img_price,$name_href_img_price),