jsLibrary.js

以前看犀牛书收藏和组合别人的库。

; (function () {
    'use strict';

    if (!Date.now)
        Date.now = function () { return new Date().getTime(); };

    var vendors = ['webkit', 'moz'];
    for (var i = 0; i < vendors.length && !window.requestAnimationFrame; ++i) {
        var vp = vendors[i];
        window.requestAnimationFrame = window[vp + 'RequestAnimationFrame'];
        window.cancelAnimationFrame = (window[vp + 'CancelAnimationFrame']
                                   || window[vp + 'CancelRequestAnimationFrame']);
    }
    if (/iP(ad|hone|od).*OS 6/.test(window.navigator.userAgent) // iOS6 is buggy
        || !window.requestAnimationFrame || !window.cancelAnimationFrame) {
        var lastTime = 0;
        window.requestAnimationFrame = function (callback) {
            var now = Date.now();
            var nextTime = Math.max(lastTime + 16, now);
            return setTimeout(function () { callback(lastTime = nextTime); },
                              nextTime - now);
        };
        window.cancelAnimationFrame = clearTimeout;
    }
}());

; (function(win, doc) {

     function JSLibrary(arg) {

         //用来保存选中的元素, elements是一个真正的数组, 不是HTMLCollection对象
         this.elements = [];

         switch (typeof arg) {
             case 'function':
                 _methodSets.ready(arg);
                 break;
             case 'string':
                 switch (arg.charAt(0)) {
                     case '#': //ID
                         var obj = doc.querySelector(arg);
                         this.elements.push(obj);
                         break;
                     case '.': //class
                         this.elements = _methodSets.getByClass(doc, arg.substring(1));
                         break;
                     default: //tagName
                         this.elements = _methodSets.convertToArray(doc.getElementsByTagName(arg));
                 }
                 break;
             case 'object':
                 this.elements.push(arg);
         }
     };

    // 用来存放内部调用的方法
     JSLibrary.methodSets = {      

        //文档加载完毕执行js脚本
         ready: (function() {
            var funcs = []; //当获得事件时,要运行的函数
            var bReady = false; //当触发事件处理程序时,切换到true

            //当文档准备就绪时,调用事件处理程序
            function handler(e) {
                //如果已经运行过一次, 只需要返回
                if (bReady) return;

                //如果发生readystatechange事件,但是其状态不是'complete'的话, 那么文档尚未准备好
                if (e.type === 'readystatechange' && doc.readyState !== 'complete') return;

                //运行所有注册函数, 注意每次都要计算funcs.length, 以防止这些函数的调用可能会导致注册更多的函数
                for (var i = 0; i < funcs.length; i++) {
                    funcs[i].call(doc);
                }

                //现在设置ready标识为true, 并移除所有函数
                bReady = true;
                funcs = null;
            }

            //为接收到任何事件注册处理程序
            if (doc.addEventListener) {
                doc.addEventListener('DomContentLoaded', handler, false);
                doc.addEventListener('readystatechange', handler, false);
                win.addEventListener('load', handler, false);

            } else if (doc.attachEvent) {
                doc.attachEvent('onreadystatechange', handler);
                win.attachEvent('onload', handler);
            }

            //返回whenReady()函数
            return function whenReady(f) {
                if (bReady) f.call(doc); //若准备完毕, 只需要运行它
                else funcs.push(f); //否则, 加入列队等候
            }
        })(),

        //把NodeList数组对象转换成数组
        convertToArray: function(nodes) {
            var arrayOfNodes = null;

            try {
                arrayOfNodes = Array.prototype.slice.call(nodes, 0);
            } catch (ex) { //兼容ie8及以前的版本
                arrayOfNodes = new Array();
                for (var i = 0; i < nodes.length; i++) {
                    arrayOfNodes.push(nodes[i]);
                }

            };

            return arrayOfNodes;
        },

         myAddEvent: function(obj, sEv, fn) {
             if (obj.attachEvent) {
                 obj.attachEvent('on' + sEv, function() {
                     if (false == fn.call(obj)) {
                         event.cancelBubble = true;
                         return false;
                     }
                 });
             } else {
                 obj.addEventListener(sEv, function(ev) {
                     if (false == fn.call(obj)) {
                         ev.cancelBubble = true;
                         ev.preventDefault();
                     }
                 }, false);
             }
         },

         getByClass: function(oParent, sClass) {
             var aEle = oParent.getElementsByTagName('*');
             var aResult = [];
             var i = 0;

             for (i = 0; i < aEle.length; i++) {
                 if (aEle[i].className == sClass) {
                     aResult.push(aEle[i]);
                 }
             }

             return aResult;
         },

         getStyle: function(obj, attr) {
             if (obj.currentStyle) {
                 return obj.currentStyle[attr];
             } else {
                 return getComputedStyle(obj, false)[attr];
             }
         }

     };

     var _methodSets = JSLibrary.methodSets;

     /********************* 以下JSLibrary 原型方法   开始 ************************/
     JSLibrary.prototype = {
         constructor: JSLibrary,

        /**
         *  这个点击事件是针对传统pc的
         *  手机端使用tap事件
         */
         click: function(callback) {

             this.elements.forEach(function(item) {
                 _methodSets.myAddEvent(item, 'click', callback);
             });

             return this;
         },

         _setEvent: function(evtName, callback) {

            var oFinger = null, currentDom = null;

            for (var i = 0, len = this.elements.length; i < len; i += 1) {
                currentDom = this.elements[i];
                if (currentDom.oFinger) {

                    currentDom.oFinger.on(evtName, callback);
                } else {

                    oFinger = new jsLib.Finger(currentDom, {});
                    oFinger.on(evtName, callback);
                    currentDom.oFinger = oFinger;
                };
            };
        },

        _removeEvent: function(evtName, callback) {

            var currentDom = null;

            for (var i = 0, len = this.elements.length; i < len; i += 1) {
                currentDom = this.elements[i];
                if (currentDom.oFinger) {
                    currentDom.oFinger.off(evtName, callback);
                };
            };
        },

        /**
         *  移动端事件
         *  @use
         *
            var aLi = jsLib('#ul1').find('li').swipe(swipe);
            function swipe(ev) {
                console.log(ev.direction);
            }
            aLi.tap(tap);
            function tap(ev) {
                console.log('tap');
                jsLib(ev.target).removeSwipe(swipe);
            }
            aLi.doubleTap(doubleTap);
            function doubleTap(ev) {
                console.log('doubleTap');
                jsLib(ev.target).removeTap(tap);
            };
            aLi.longTap(longTap);
            function longTap(ev) {
                console.log('longTap');
                jsLib(ev.target).removeDTap(doubleTap);
            };

            aLi.destroy();    //销毁dom上的一切事件
         */

        tap: function(callback) {

            this._setEvent('tap', callback);

            return this;
        },

        removeTap: function(callback) {

            this._removeEvent('tap', callback);

            return this;
        },

        swipe: function(callback) {
            // console.log(ev.direction);

            this._setEvent('swipe', callback);

            return this;
        },

        removeSwipe: function(callback) {

            this._removeEvent('swipe', callback);

            return this;
        },

        longTap: function(callback) {

            this._setEvent('longTap', callback);

            return this;
        },

        removeLTap: function(callback) {

            this._removeEvent('longTap', callback);

            return this;
        },

        doubleTap: function(callback) {

            this._setEvent('doubleTap', callback);

            return this;
        },

        removeDTap: function(callback) {

            this._removeEvent('doubleTap', callback);

            return this;
        },

        destroy: function() {

            var currentDom = null;

            for (var i = 0, len = this.elements.length; i < len; i += 1) {
                currentDom = this.elements[i];
                if (currentDom.oFinger) {
                    currentDom.oFinger.destroy();
                };
            };

            return this;
        },

        transform: function() {

            for (var i = 0, len = this.elements.length; i < len; i += 1) {
                jsLib.Transform(this.elements[i]);
            };

            return this.toDom();
        },

        /*
         * 据父节点查找其子孩子
         * @param { String } 可以是标签名或.calss名
         */
         find: function(str) {
             var i = 0;
             var aResult = [];

             for (i = 0; i < this.elements.length; i++) {
                 switch (str.charAt(0)) {
                     case '.': //class
                         var aEle = _methodSets.getByClass(this.elements[i], str.substring(1));

                         aResult = aResult.concat(aEle);
                         break;
                     default: //标签
                         var aEle = this.elements[i].getElementsByTagName(str);

                         aResult = _methodSets.convertToArray(aEle);
                 }
             }

             var newJSLib = jsLib();

             newJSLib.elements = aResult;

             return newJSLib;
         },

         /*
          * 获取点击时它在其兄弟节点的索引位置
          */
         index: function() {
             var _this = this;
             return (function(_this) {
                 var obj = _this.elements[0];
                 var aBrother = obj.parentNode.children;
                 var i = 0;

                 for (i = 0; i < aBrother.length; i++) {
                     if (aBrother[i] == obj) {
                         return i;
                     }
                 }
             }(_this));
         },

         /*
          * 获取第几个dom对象(含原型方法)
          * @param { Number } 从0开始
          */
         eq: function(n) {
             return jsLib(this.elements[n]);
         },

         /*
          * 返回元素的length长度
          */
         length: function() {
             return this.elements.length;
         },

         /*
          * 单纯地获取dom对象(不含原型方法)
          * @param { Number } 从0开始
          */
         toDom: function() {
             if (this.elements.length === 1) {
                 return this.elements[0];
             } else {
                 return this.elements;
             }
         },

         show: function() {
             this.elements.forEach(function(item) {
                 item.style.display = 'block';
             });
         },

         hide: function() {
             this.elements.forEach(function(item) {
                 item.style.display = 'none';
             });
         },

         /*
          * 给节点元素添加样式(多个或者单个)
          * @param { Object } {width: '100px', height: '100px', background: '#ccc', opacity: 30}
          * @use: setStyle([oDiv,oDiv2], {width: '100px', height: '100px', background: '#ccc', opacity: 30});
          * @use: setStyle(oDiv, {width: 100, height: 100, background: '#ccc', opacity: 30});
          */
         setStyle: function(json) {
             (function setDomStyle(obj, json) {
                 if (obj.length) { //对象数组

                     // for (var i = 0; i < obj.length; i++) arguments.callee(obj[i], json);
                     for (var i = 0; i < obj.length; i++) setDomStyle(obj[i], json);

                 } else {
                     if (arguments.length == 2) {

                         // for (var attr in json) arguments.callee(obj, attr, json[attr]);
                         for (var attr in json) setDomStyle(obj, attr, json[attr]);

                     } else {
                         switch (arguments[1].toLowerCase()) {
                             case 'opacity':
                                 obj.style.filter = 'alpha(opacity:' + arguments[2] + ')';
                                 obj.style.opacity = arguments[2] / 100;
                                 break;
                             default:
                                 if (typeof arguments[2] == 'number') {
                                     obj.style[arguments[1]] = arguments[2] + 'px';
                                 } else {
                                     obj.style[arguments[1]] = arguments[2];
                                 }
                                 break;
                         }
                     }
                 }
             })(this.elements, json);
         },

        /*
         * 获取/设置dom样式
         * @param { String } 样式名
         * @param { String } 样式值
         */
         css: function(attr, value) {
            if (arguments.length == 2) {    //设置样式
                var i = 0;

                for (i = 0; i < this.elements.length; i++) {
                    this.elements[i].style[attr] = value;
                }
            } else {    //获取样式
                if (typeof attr == 'string') {
                    return _methodSets.getStyle(this.elements[0], attr);
                } else {
                    for (i = 0; i < this.elements.length; i++) {
                        var k = '';

                        for (k in attr) {
                            this.elements[i].style[k] = attr[k];
                        }
                    }
                }
            }

            return this;
         },

         /*
          * 获取/设置dom属性
          * @param { String } dom属性名
          * @param { String } dom属性值
          */
         attr: function(attr, value) {
             if (arguments.length == 2) {
                 var i = 0;

                 for (i = 0; i < this.elements.length; i++) {
                     this.elements[i][attr] = value;
                 }
             } else {
                 return this.elements[0][attr];
             }

             return this;
         },

         removeAttr: function(name) {
             this.elements.forEach(function(item) {
                 item.removeAttribute(name);
             });

             return this;
         },

         /*
          * 给元素节点设置Css3样式
          * @param { String } name 属性名
          * @param { String } value 属性值
          */
         setStyle3: function(name, value) {
             this.elements.forEach(function(item) {
                 item.style['Webkit' + name.charAt(0).toUpperCase() + name.substring(1)] = value;
                 item.style['Moz' + name.charAt(0).toUpperCase() + name.substring(1)] = value;
                 item.style['ms' + name.charAt(0).toUpperCase() + name.substring(1)] = value;
                 item.style['O' + name.charAt(0).toUpperCase() + name.substring(1)] = value;
                 item.style[name] = value;
             });
         },

         /*
          * 给元素节点添加class
          * @param { String } sClass class名
          */
         addClass: function(sClass) {
             var re = new RegExp('\\b' + sClass + '\\b');

            this.elements.forEach(function(item) {
                if (re.test(item.className)) return;
                item.className = (item.className + ' ' + sClass).match(/\S+/g).join(' ');
            });

            return this;
         },

         /*
          * 移除某元素节点的class
          * @param { String } sClass class名
          */
         removeClass: function(sClass) {
             var re = new RegExp('\\b' + sClass + '\\b', 'g');

             this.elements.forEach(function(item) {
                 item.className = item.className.replace(re, '').replace(/^\s+|\s+$/g, '').replace(/\s+/g, ' ');
             });

            return this;
         },

         /*
          * 设置dom文本
          */
         html: function(str) {
            this.elements.forEach(function(item) {
                item.innerHTML = str;
            });
         },

        /*
         * 扩张方法,把一些好的方法扩张到JSLibrary原型上
         * @param { String } 方法名
         * @param { Function } 函数
         */
         extend: function(name, fn) {
             JSLibrary.prototype[name] = fn;
         },

        /**
         * [功能: 返回元素e的第几层祖先元素, 如果不存在此类祖先或祖先不是Element,
         *  则返回NUll]
         * @param  {Object Dom} e 指定的元素
         * @param  {Number} n 第n层祖先元素
         * @return {Object Dom}   返回其祖父元素
         */
        parent: function(n) {
            if (this.elements.length > 1) return;    //多个元素直接返回
            var e = this.elements[0];

            if (n === undefined) n = 1;
            while(n -- && e)
                e = e.parentNode;
            if (!e || e.nodeType !== 1)
                return null;

            // return e;
            return jsLib(e);
        },

        /**
         * [功能: 返回元素e的第几个兄弟元素, n为正,返回后续的第n个兄弟元素,
         *  n为负,返回前面的第n个兄弟元素, n为0, 返回e本身]
         * @param  {Object Dom} e 指定的元素
         * @param  {Number} n 第几个兄弟节点
         * @return {Object Dom}   返回第几个兄弟节点
         */
        sibling: function(n) {
            if (this.elements.length > 1) return;    //多个元素直接返回
            var e = this.elements[0];

            while(e && n !== 0) {    //如果e未定义, 立即返回它

                if (n > 0) {    //查找后续的兄弟元素
                    if (e.nextElementSibling) {
                        e = e.nextElementSibling;
                    } else {
                        for (e = e.nextSibling; e && e.nodeType !== 1; e = e.nextSibling)
                            /* 空循环 */;
                    };
                    n --;
                } else {    //查找前面的兄弟元素
                    if (e.previousElementSibing) {
                        e = e.previousElementSibing;
                    } else {
                        for (e = e.previousSibling; e && e.nodeType !== 1; e = e.previousSibling)
                            /* 空循环 */;
                    };
                    n ++;
                }
            }

            // return e;
            return jsLib(e);
        },

        /**
         * [功能: 返回元素e的第n代子元素,如果不存在则为NUll,
         * 负值n代表从后往前计数. 0表示第一个子元素, -1代表最后一个, -2代表倒数第二个,以此类推.(和children功能一样, 从0开始)]
         * @param  {Object Dom} e 指定的元素
         * @param  {Number} n 第几个
         * @return {Object Dom}   返回第n代子元素
         */
        child: function(n) {
            if (this.elements.length > 1) return;    //多个元素直接返回
            var e = this.elements[0];
            if (!e) return;

            if (e.children) {                   // 如果children数组存在
                if (n < 0)                      // 转换负的n为数组索引
                    n += e.children.length;
                if (n < 0)                      // 如果它仍然为负, 说明没有子元素
                    return null;
                // return e.children[n];           //返回指定的子元素
                return jsLib(e.children[n]);           //返回指定的子元素
            }

            //如果e没有children数组, 找到第一个子元素并向前数, 或找到最后一个子元素并往回数
            if (n >= 0) {
                //找到元素的第一个子元素
                if (e.firstElementChild) {
                    e = e.firstElementChild;
                } else {
                    for (e = e.firstChild; e && e.nodeType !== 1; e = e.nextSibling)
                        /* 空循环 */;
                }
                // return this.sibling(e, n);    //返回第一个子元素的第n个兄弟元素
                return jsLib(this.sibling(e, n));    //返回第一个子元素的第n个兄弟元素
            } else {    // n为负数
                if (e.lastElementChild) {
                    e.lastElementChild;
                } else {
                    for (e = e.lastChild; e && e.nodeType !== 1; e = e.previousSibling)
                        /* 空循环 */;
                }
                // return this.sibling(e, n+1);
                return jsLib(this.sibling(e, n+1));
            }
        }
     };

     /********************* 以上JSLibrary 原型方法   结束 ************************/

     /************** 以下是一些常用的方法挂在到jsLib(类方法)   开始 **************/

     /**
      *  一些实用工具方法挂载到jsLib.utils
      */

     jsLib.utils = {};

    /**
     *  检测一个值是否是NaN
     */
    jsLib.utils.isReallyNaN = function(x) {
        return x !== x;
    };

    /**
     *  检测一个对象是否为空
     */
    jsLib.utils.isEmptyObj = function(obj){
        for(var i in obj){
            if(obj.hasOwnProperty(i)){
                return false;
            }
        }
        return true;
    };

    /**
     *  检测一个对象是否为数组
     */
    jsLib.utils.isArray = function (arr) {
        if (Array.isArray) {
            return Array.isArray(arr);
        } else {
            return Object.prototype.toString.call(arg) === '[object Array]';
        }
    };

    /**
     *
     * @param parent    要拷贝的对象
     * @param child    返回浅拷贝的对象
     *
     * 如果parent对象中属性也是对象或者数组，那么浅拷贝的对象是引用parent这个对象
     */
    jsLib.utils.extend = function(parent, child) {
        var i;
        child = child || {};
        for (i in parent) {
            if (parent.hasOwnProperty(i)) {
                child[i] = parent[i];
            };
        };
        return child;
    };

    /**
     *
     * @param parent
     * @param child
     * 深拷贝以后，parent对象和child对象就不相等了,都是独立的了
     */
    jsLib.utils.extendDeep = function(parent, child) {
        var i,
            toStr = Object.prototype.toString,
            astr = "[object Array]";

        child = child || {};

        for (i in parent) {
            if (parent.hasOwnProperty(i)) {
                if (typeof parent[i] === 'object') {
                    child[i] = (toStr.call(parent[i]) === astr) ? [] : {};
                    this.extendDeep(parent[i], child[i]);
                } else {
                    child[i] = parent[i];
                };
            };
        };
        return child;
    };

    /**
     *  从数组中随机取几个不重复的元素
     */
    jsLib.utils.getArrayItems = function(arr, num) {
        var temp_array = new Array();
        for (var index in arr) {
            temp_array.push(arr[index]);
        }
        var return_array = new Array();
        for (var i = 0; i<num; i++) {
            if (temp_array.length>0) {
                var arrIndex = Math.floor(Math.random()*temp_array.length);
                return_array[i] = temp_array[arrIndex];
                temp_array.splice(arrIndex, 1);
            } else {
                break;
            };
        };
        return return_array;
    }

    /**
     *  判断点在多边形内
     *  eg:  var pointCenter = {x: gV.box_w/2, y: gV.box_h/2};
     *     var polygon = [
     *         {x:aClientLeftPoint[0], y:aClientLeftPoint[1]},
     *         {x:aClientRightPoint[0], y:aClientRightPoint[1]},
     *         {x:aClientRightunderPoint[0], y:aClientRightunderPoint[1]},
     *         {x:aClientLeftunderPoint[0], y:aClientLeftunderPoint[1]},
     *         {x:aClientLeftPoint[0], y:aClientLeftPoint[1]}
     *     ];
     *   jsLib.utils.pointInPolygon(pointCenter, polygon);
     */
    jsLib.utils.pointInPolygon = function(curPoint, points) {
        var counter = 0;
        for (var i = 0, p1, p2; i < points.length; i++) {
            p1 = points[i];
            p2 = points[(i + 1) % points.length];
            if (p1.y == p2.y) {
                continue;
            }
            if (curPoint.y <= Math.min(p1.y, p2.y)) {
                continue;
            }
            if (curPoint.y >= Math.max(p1.y, p2.y)) {
                continue;
            }
            var x = (curPoint.y - p1.y) * (p2.x - p1.x) / (p2.y - p1.y) + p1.x;
            if (x > curPoint.x) counter++;
        };

        if (counter % 2 == 0) {
            return false;
        } else {
            return true;
        };
    };

    /**
     * [功能: 作为一个对象的w和h属性返回视口的尺寸(视口坐标)]
     * @param  {Object} w 指定的窗口
     * @return {Object}   { x: 屏幕的宽度, y: 屏幕的高度 }
     */
    jsLib.utils.getViewportSize = function(w) {
        //使用指定的窗口, 如果不带参数则使用当前窗口
        var w = w || window;

        //出了ie8及更早的版本以外, 其他浏览器都能用
        if (w.innerWidth != null)
            return { w: w.innerWidth, h: w.innerHeight };

        //对标准下的ie (或任何浏览器)
        var d = w.document;
        if (document.compatMode == 'CSS1Compat')
            return {
                w: d.documentElement.clientWidth,
                h: d.documentElement.clientHeight
            };

        //对怪异模式下的浏览器
        return { w: d.body.clientWidth, h: d.body.clientHeight };
    };

    /**
     * [功能: 查询窗口滚动条的位置]
     * @param  {Object} w 指定的窗口
     * @return {Object}   { x: 滚动条的x, y: 滚动条的y }
     */
    jsLib.utils.getScrollOffset = function(w) {
        //使用指定的窗口, 如果不带参数则使用当前窗口
        var w = w || window;

        //除了ie8及更早的版本, 其他浏览器都能用
        if (w.pageXOffset != null)
            return { x: w.pageXOffset, y: w.pageYOffset }

        //对于标准下的ie(或任意浏览器)
        var d = w.document;
        if (document.compatMode == 'CSS1Compat')
            return { x: d.documentElement.scrollLeft, y: d.documentElement.scrollTop }

        //对于怪异模式下的浏览器
        return { x: d.body.scrollLeft, y: d.body.scrollTop }
    };

    /**
     * [功能: 文档如果有滚动条的话,就不行了(文档坐标,含滚动条)]
     * @param  {Object Dom} e dom节点
     * @return {Object}   返回节点坐标(含滚动条)
     */
    jsLib.utils.getElementPosition = function(e) {
        var x = 0,
            y = 0;
        while(e != null) {
            x += e.offsetLeft;
            y += e.offsetTop;
            e = e.offsetParent;
        }

        return { x: x, y: y };
    };

    /**
     * [功能: 增强版(视口坐标)  与 dom.getBoundingClientRect()对象中left和top相等,并且getBoundingClientRect方法效率高]
     * @param  {Object Dom} elt dom节点
     * @return {Object}     返回节点坐标(不含滚动条)
     */
    jsLib.utils.getElementPos = function(elt) {
        var x = 0, y = 0;

        //循环以累加偏移量
        for (var e = elt; e != null; e = e.offsetParent) {
            x += e.offsetLeft;
            y += e.offsetTop;
        }

        //在此循环所有的祖先元素,减去滚动的偏移量
        //这也减去了主滚动条, 并转化为视口坐标
        for (var e = elt.parentNode; e != null && e.nodeType == 1; e = e.parentNode) {
            x -= e.scrollLeft;
            y -= e.scrollTop;
        }

        return { x: x, y: y };
    };

    //函数赋值
    jsLib.utils.getByClass = _methodSets.getByClass;
    jsLib.utils.convertToArray = _methodSets.convertToArray;

     /*
      * 仅仅简单的dom Id选择器
      */
     jsLib.getEle = function(id) {
         return doc.querySelector(id);
     };

    /*  ajax 的封装, 含跨域 jsonp
     *
      *  参数         默认值              描述                  可选值
     *    url             “”                 请求的链接              string
     *    type         get             请求的方法              get,post
     *    data         null             请求的数据              object,string
     *    contentType     “”                 请求头                  string
     *    dataType     “”                 请求的类型              jsonp
     *    async         true             是否异步              blooean
     *    timeOut         undefined         超时时间              number
     *    before         function(){}     发送之前执行的函数      function
     *    error         function(){}     请求报错执行的函数      function
     *    success         function(){}     请求成功的回调函数      function
     *
     *    @use
     *    ajax({
     *        type:"post",
     *        dataType: 'jsonp',
     *        url:"http://wx.indoorun.com/wx/getUnitsOfFloor.html", //添加自己的接口链接
     *        data: {'regionId':'14428254382730015', 'floorId':'14428254382890016'},
     *        timeOut:5000,
     *        before:function(){
     *          console.log("before");
     *        },
     *        success:function(str){
     *            console.log(str);
     *        },
     *        error:function(){
     *            console.log("error");
     *        }
     *    });
      */
     jsLib.ajax = function(options) {
         //编码数据
         function setData() {
             var name, value;
             if (data) {
                 if (typeof data === "string") {
                     data = data.split("&");
                     for (var i = 0, len = data.length; i < len; i++) {
                         name = data[i].split("=")[0];
                         value = data[i].split("=")[1];
                         data[i] = encodeURIComponent(name) + "=" + encodeURIComponent(value);
                     }
                     data = data.replace("/%20/g", "+");
                 } else if (typeof data === "object") {
                     var arr = [];
                     for (var name in data) {
                         if (typeof data[name] !== 'undefined') {
                            var value = data[name].toString();
                            name = encodeURIComponent(name);
                            value = encodeURIComponent(value);
                            arr.push(name + "=" + value);
                        }

                     }
                     data = arr.join("&").replace("/%20/g", "+");
                 }
                 //若是使用get方法或JSONP，则手动添加到URL中
                 if (type === "get" || dataType === "jsonp") {
                     url += url.indexOf("?") > -1 ? (url.indexOf("=")>-1 ? "&"+data : data ): "?" + data;
                 }
             }
         }
         // JSONP
         function createJsonp() {

             var script = document.createElement("script"),
                 timeName = new Date().getTime() + Math.round(Math.random() * 1000),
                 callback = "JSONP_" + timeName;

             window[callback] = function(data) {
                 clearTimeout(timeout_flag);
                 document.body.removeChild(script);
                 success(data);
             }
             script.src = url +  (url.indexOf("?") > -1 ? "&" : "?") + "callback=" + callback;
             script.type = "text/javascript";
             document.body.appendChild(script);
             setTime(callback, script);
         }
         //设置请求超时
         function setTime(callback, script) {
             if (timeOut !== undefined) {
                 timeout_flag = setTimeout(function() {
                     if (dataType === "jsonp") {
                         // delete window[callback];
                         document.body.removeChild(script);

                     } else {
                         timeout_bool = true;
                         xhr && xhr.abort();
                     }
                     console.log("timeout");

                 }, timeOut);
             }
         }
         // XHR
         function createXHR() {
             //由于IE6的XMLHttpRequest对象是通过MSXML库中的一个ActiveX对象实现的。
             //所以创建XHR对象，需要在这里做兼容处理。
             function getXHR() {
                 if (window.XMLHttpRequest) {
                     return new XMLHttpRequest();
                 } else {
                     //遍历IE中不同版本的ActiveX对象
                     var versions = ["Microsoft", "msxm3", "msxml2", "msxml1"];
                     for (var i = 0; i < versions.length; i++) {
                         try {
                             var version = versions[i] + ".XMLHTTP";
                             return new ActiveXObject(version);
                         } catch (e) {}
                     }
                 }
             }
             //创建对象。
             xhr = getXHR();
             xhr.open(type, url, async);
             //设置请求头
             if (type === "post" && !contentType) {
                 //若是post提交，则设置content-Type 为application/x-www-four-urlencoded
                 xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=UTF-8");
             } else if (contentType) {
                 xhr.setRequestHeader("Content-Type", contentType);
             }
             //添加监听
             xhr.onreadystatechange = function() {
                 if (xhr.readyState === 4) {
                     if (timeOut !== undefined) {
                         //由于执行abort()方法后，有可能触发onreadystatechange事件，
                         //所以设置一个timeout_bool标识，来忽略中止触发的事件。
                         if (timeout_bool) {
                             return;
                         }
                         clearTimeout(timeout_flag);
                     }
                     if ((xhr.status >= 200 && xhr.status < 300) || xhr.status == 304) {

                         success(xhr.responseText);
                     } else {
                          error(xhr.status, xhr.statusText);
                     }
                 }
             };
             //发送请求
             xhr.send(type === "get" ? null : data);
             setTime(); //请求超时
         }

         var url = options.url || "", //请求的链接
             type = (options.type || "get").toLowerCase(), //请求的方法,默认为get
             data = options.data || null, //请求的数据
             contentType = options.contentType || "", //请求头
             dataType = options.dataType || "", //请求的类型
             async = options.async === undefined && true, //是否异步，默认为true.
             timeOut = options.timeOut, //超时时间。
             before = options.before || function() {}, //发送之前执行的函数
             error = options.error || function() {}, //错误执行的函数
             success = options.success || function() {}; //请求成功的回调函数
         var timeout_bool = false, //是否请求超时
             timeout_flag = null, //超时标识
             xhr = null; //xhr对角
         setData();
         before();
         if (dataType === "jsonp") {
             createJsonp();
         } else {
             createXHR();
         }
     };

     /*
      * 把url后面的参数放入到一个对象中去
      * 返回这个对象
      */
     jsLib.getQueryString = function() {

         var str = location.search.length > 0 ? location.search.substring(1) : "";
         var items = str.length ? str.split("&") : [];

         var args = {}, item = null, name = null, value = null;

         for (var i = 0, len = items.length; i < len; i++) {
             item = items[i].split("=");
             name = decodeURIComponent(item[0]);
             value = decodeURIComponent(item[1]);
             if (name.length) {
                 args[name] = value;
             }
         };

         return args;
     };

     /*
      * 绑定和解绑事件的方法
      */
     jsLib.EventUtil = {

         //事件绑定  EventUtil.addHandler()
         addHandler: function(element, type, handler) { //要绑定的元素, 事件类型, 发生事件的函数
             if (element.addEventListener) {
                 element.addEventListener(type, handler, false); // false为事件冒泡 (w3c标准下)
             } else if (element.attachEvent) {
                 element.attachEvent('on' + type, handler); //  只有事件冒泡 (ie下)
             } else {
                 element['on' + type] = handler;
             }
         },

         //事件移除
         removeHandler: function(element, type, handler) {
             if (element.removeEventListener) {
                 element.removeEventListener(type, handler, false);
             } else if (element.detachEvent) {
                 element.detachEvent('on' + type, handler);
             } else {
                 element['on' + type] = null;
             }
         },

         //获取事件对象
         getEvent: function(event) {
             return event ? event : win.event;
         },

         //获取事件目标
         getTarget: function(event) {
             var oEvent = jsLib.EventUtil.getEvent(event);
             return oEvent.target || oEvent.srcElement; //标准或ie下
         },

         //取消默认事件
         preventDefault: function(event) {
             var oEvent = jsLib.EventUtil.getEvent(event);
             oEvent.preventDefault ? oEvent.preventDefault() : oEvent.returnValue = false;
         },

         //阻止事件冒泡和事件捕获
         stopPropagation: function(event) {
             var oEvent = jsLib.EventUtil.getEvent(event);
             oEvent.stopPropagation ? oEvent.stopPropagation() : oEvent.cancelBubble = true;
         }
     };

     /************** 以上是一些常用的方法挂在到jsLib(类方法)   结束 **************/

     /************** 以下一些方法(插件)扩展到JSLibrary原型上    开始 **************/

     /*
      * 任意dom节点运动方法
      * @param { Object } 运动的属性
      * @param { Function } 回调函数
      * @user jsLib('#id').animate({left: '200', top: '200', 'opacity': 30});
      */
    jsLib().extend('animate', function(json, fn, time) {

        var time = time || 30;

        this.elements.forEach(function(item, index, array) {
            startMove(item, json, fn);
        });

        function getStyle(obj, attr) {
            if (obj.currentStyle) {
                return obj.currentStyle[attr];
            } else {
                return getComputedStyle(obj, false)[attr];
            }
        }
        //运动
        function startMove(obj, json, fn) {
            clearInterval(obj.timer);
            obj.timer = setInterval(function() {
                var attr = '';
                var iStop = true; //假设所有值都到达了，定时器里一轮的运动结束了
                for (attr in json) {
                    //1.计算当前值
                    var iCurr = 0;
                    if (attr == 'opacity') {
                        iCurr = parseInt(parseFloat(getStyle(obj, attr)) * 100);
                    } else {
                        iCurr = parseInt(getStyle(obj, attr));
                    }
                    //2.计算速度
                    var speed = (json[attr] - iCurr) / 8;
                    speed = speed > 0 ? Math.ceil(speed) : Math.floor(speed);
                    //3.检测停止
                    if (iCurr != json[attr]) {
                        iStop = false;
                    };
                    if (attr == 'opacity') {
                        obj.style.opacity = (iCurr + speed) / 100;
                        obj.style.filter = 'alpha(opacity:' + (iCurr + speed) + ')';
                    } else {
                        obj.style[attr] = iCurr + speed + 'px';
                    };
                };
                if (iStop) { //所有属性都到达了目标，那就关闭定时器
                    clearInterval(obj.timer);
                    fn && fn();
                };
            }, time);
        }
    });

    /**
     * 任意运动, 传入回调函数, 分批执行
     * @return {_stopMove} 可以停止运动
     * 可以单独使用
     * @user
     * var stop = new Move.elastic([0, 1], 800, function(v){
     *     console.log(v);    // v是速度在 0,1之间以各种运动变化, 每变化一次就执行一次函数
     * }
     *
     * stop();  //通过调用,可以立即停止
     */
    ; (function(exports) {

        var PI = Math.PI,
            sin = Math.sin,
            cos = Math.cos,
            pow = Math.pow,
            abs = Math.abs,
            sqrt = Math.sqrt;

        var request = window.requestAnimationFrame,
            stopRequest = window.cancelAnimationFrame;
        var _move, _stopMove;    // 都是函数, 不支持requestAnimationFrame的浏览器就使用定时器

        //初始化运动函数和停止函数
        if (request) {
            _move = function(fn, timer) {    // fn: 匿名函数, timer: 不同的空对象
                var step = function() {
                    if (!fn()) {    // fn函数返回值为假值则调用requestAnimationFrame方法(true代表运动结束)
                        timer.id = request(step);
                    };
                };
                step();    // 函数调用
            };
        } else {
            _move = function(fn, timer) {
                timer.id = setInterval(fn, 16);    // 采用定时器, 时间间隔不能低于16
            };
        };
        if (stopRequest) {
            _stopMove = function(timer) {
                stopRequest(timer.id);    // 停止动画调用
            };
        } else {
            _stopMove = function(timer) {
                clearInterval(timer.id);    // 关闭定时器
            };
        };

        var Move = function() {    // Move构造函数
            this.aCurve = [];    // 曲线动画函数名集合
            this.init();
        };    

        var curve = Move.prototype = {    // Move原型
            // 初始化动画曲线
            init: function() {
                this.extends({
                    //定义域和值域均为[0, 1], 传入自变量x返回对应值y
                    //先加速后减速
                    ease: function(x) {
                        // return -0.5*cos(PI * (2 - x)) + 0.5;
                        if (x <= 0.5) return 2 * x * x;
                        else if (x > 0.5) return -2 * x * x + 4 * x - 1;
                    },

                    // 初速度为0 ,一直加速
                    easeIn: function(x) {
                        return x * x;
                    },

                    //先慢慢加速1/3, 然后突然大提速, 最后减速
                    ease2: function(x) {
                        return x < 1 / 3 ? x * x : -2 * x * x + 4 * x - 1;
                    },

                    //初速度较大, 一直减速, 缓冲动画
                    easeOut: function(x) {
                        return pow(x, 0.8);
                    },

                    //碰撞动画
                    collision: function(x) {
                        var a, b; //a, b代表碰撞点的横坐标
                        for (var i = 1, m = 20; i < m; i++) {
                            a = 1 - (4 / 3) * pow(0.5, i - 1);
                            b = 1 - (4 / 3) * pow(0.5, i);
                            if (x >= a && x <= b) {
                                return pow(3 * (x - (a + b) / 2), 2) + 1 - pow(0.25, i - 1);
                            }
                        }
                    },

                    //弹性动画
                    elastic: function(x) {
                        return -pow(1 / 12, x) * cos(PI * 2.5 * x * x) + 1;
                    },

                    //匀速动画
                    linear: function(x) {
                        return x;
                    },

                    //断断续续加速减速
                    wave: function(x) {
                        return (1 / 12) * sin(5 * PI * x) + x;
                    },

                    //先向反方向移动一小段距离, 然后正方向移动, 并超过终点一小段, 然后回到终点
                    opposite: function(x) {
                        return (sqrt(2) / 2) * sin((3 * PI / 2) * (x - 0.5)) + 0.5;
                    },

                    // 相反的三次贝塞尔
                    reverseEase: function (x) {
                        return 1 - Math.sqrt(1 - x * x);
                    }
                });
            },

            // 随机选择一个动画方法名
            getRd: function () {
                var preItem = null;

                return function () {
                    var arr = this.aCurve;
                    var index = Math.floor(Math.random() * arr.length),
                        item = arr[index],
                        result;

                    if (preItem != item) {
                        preItem = item;
                        result = item;
                    } else {
                        result = this.getRd(arr);
                    };

                    return result;
                };
            }(),

            // 扩张曲线动画
            extends: function(obj) {
                for (var k in obj) {
                    if (k in curve) {
                        console.warn('扩张的方法名' + k + ': 已经存在, 换个方法名吧!' );
                        return;
                    };
                    this.aCurve.push(k);
                    curve[k] = (function(moveType) {    // 给Move原型添加 动画曲线 方法
                        return function() {
                            return _doMove.call(this, arguments, moveType);    // 每个动画曲线方法实际调用_doMove函数
                        };
                    })(obj[k]);
                };
            }
        };

        /**
         * 开始动画函数
         * arg: 用户要传的([0, 1000], 500, function(v){ ... }, fnEnd)
         * moveType: 曲线动画函数
         */
        function _doMove(arg, moveType) {
            var r,    // r => 过渡范围, 例如[0, 1000]   (必须传, 且传数组)
                d,    // d => 过渡时间, ms,             (可不传, 默认500)
                fn,    // fn => 每一帧的回调函数, 传入当前过渡值v   (必须传)
                fnEnd;    // fnEnd => 动画结束时回调               (可不传)    

            // 严格限制传入参数, 且传入的参数可以没有顺序
            for (var i = 0; i < 4; i++) {
                if (typeof arg[i] === 'object' && !r) r = arg[i];
                else if (typeof arg[i] === 'number' && !d) d = arg[i];
                else if (typeof arg[i] === 'function' && !fn) fn = arg[i];
                else if (typeof arg[i] === 'function' && !fnEnd) fnEnd = arg[i];
            };

            if (!r instanceof Array || !fn) return;    // 如果r不是数组或者fn不是函数(真值)就return掉

            d = d || 500;    // 过渡时间默认500ms

            var from = +new Date, //起始时间
                x = 0,
                y,
                a = r[0],    // 过渡范围的起点
                b = r[1];    // 过度范围的终点

            var timer = 't' + Math.random();    // 随机数

            var self = this;    // 存一下Move的实例

            //用于保存定时器ID的对象, requestAnimation递归调用必须传入对象(给实例添加timer属性值为{})
            this[timer] = {};

            // 优先使用requestAnimationFrame否则setInterval定时器
            _move(function() {
                x = (+new Date - from) / d;

                if (x >= 1) {    // 动画结束
                    fn(b);    // 调用外部动画的回调函数且把过度范围的终点值作为参数传过去
                    if (fnEnd) fnEnd();    // 如果有动画结束回调函数就执行回调函数
                    return true;    // 返回真值停止调用requestAnimationFrame方法
                } else {    // 动画进行中
                    y = moveType(x);    // 调用动画曲线中的函数返回运动数字
                    fn(a + (b - a) * y);    // 调用外部动画的回调函数传参为 a + (b - a) * y
                };
            }, self[timer]);

            return function() {
                _stopMove(self[timer]);    // 调用cancelAnimationFrame方法停止动画
                return a + (b - a) * y;    // 返回动画停止后的运动数字
            };
        };

        // 抛出去
        exports.Move = Move;    // Move构造函数抛出去

    })(jsLib);

    ; (function(exports) {
        // 一些要使用的内部工具函数

        // 2点之间的距离 (主要用来算pinch的比例的, 两点之间的距离比值求pinch的scale)
        function getLen(v) {
            return Math.sqrt(v.x * v.x + v.y * v.y);
        };

        // dot和getAngle函数用来算两次手势状态之间的夹角, cross函数用来算方向的, getRotateAngle函数算手势真正的角度的
        function dot(v1, v2) {
            return v1.x * v2.x + v1.y * v2.y;
        };

        // 求两次手势状态之间的夹角
        function getAngle(v1, v2) {
            var mr = getLen(v1) * getLen(v2);
            if (mr === 0) return 0;
            var r = dot(v1, v2) / mr;
            if (r > 1) r = 1;
            return Math.acos(r);
        };

        // 利用cross结果的正负来判断旋转的方向(大于0为逆时针, 小于0为顺时针)
        function cross(v1, v2) {
            return v1.x * v2.y - v2.x * v1.y;
        };

        // 如果cross大于0那就是逆时针对于屏幕是正角,对于第一象限是负角,所以 角度 * -1, 然后角度单位换算
        function getRotateAngle(v1, v2) {
            var angle = getAngle(v1, v2);
            if (cross(v1, v2) > 0) {
                angle *= -1;
            };
            return angle * 180 / Math.PI;
        };

        // HandlerAdmin构造函数
        var HandlerAdmin = function(el) {
            this.handlers = [];    // 手势函数集合
            this.el = el;    // dom元素
        };

        // HandlerAdmin原型方法

        // 把fn添加到实例的 handlers数组中
        HandlerAdmin.prototype.add = function(handler) {
            this.handlers.push(handler);
        };

        // 删除 handlers数组中的函数
        HandlerAdmin.prototype.del = function(handler) {
            if(!handler) this.handlers = [];    // handler为假值,handlers则赋值为[](参数不传undefined,其实不管this.handlers有没有成员函数,都得置空)

            for(var i = this.handlers.length; i >= 0; i--) {
                if(this.handlers[i] === handler) {    // 如果函数一样
                    this.handlers.splice(i, 1);    // 从handler中移除该函数(改变了原数组)
                };
            };
        };

        // 执行用户的回调函数
        HandlerAdmin.prototype.dispatch = function() {
            for(var i=0, len=this.handlers.length; i<len; i++) {
                var handler = this.handlers[i];
                if(typeof handler === 'function') handler.apply(this.el, arguments);    // 执行回调this为dom元素, 把触发的事件对象作为参数传过去了
            };
        };

        function wrapFunc(el, handler) {
            var handlerAdmin = new HandlerAdmin(el);    // 实例化一个对象
            handlerAdmin.add(handler);

            return handlerAdmin;
        };

        // AlloyFinger构造函数
        var AlloyFinger = function (el, option) {    // el: dom元素/id, option: 各种手势的集合对象

            this.element = typeof el == 'string' ? document.querySelector(el) : el;    // 获取dom元素

            // 绑定原型上start, move, end, cancel函数的this对象为 AlloyFinger实例
            this.start = this.start.bind(this);
            this.move = this.move.bind(this);
            this.end = this.end.bind(this);
            this.cancel = this.cancel.bind(this);

            // 给dom元素 绑定原生的 touchstart, touchmove, touchend, touchcancel事件, 默认冒泡
            this.element.addEventListener("touchstart", this.start, false);
            this.element.addEventListener("touchmove", this.move, false);
            this.element.addEventListener("touchend", this.end, false);
            this.element.addEventListener("touchcancel", this.cancel, false);

            this.preV = { x: null, y: null };    // 开始前的坐标
            this.pinchStartLen = null;    // start()方法开始时捏的长度
            this.scale = 1;    // 初始缩放比例为1
            this.isDoubleTap = false;    // 是否双击, 默认为false

            var noop = function () { };    // 空函数(把用户没有绑定手势函数默认赋值此函数)

            // 提供了14种手势函数. 根据option对象, 分别创建一个 HandlerAdmin实例 赋值给相应的this属性
            this.rotate = wrapFunc(this.element, option.rotate || noop);
            this.touchStart = wrapFunc(this.element, option.touchStart || noop);
            this.multipointStart = wrapFunc(this.element, option.multipointStart || noop);
            this.multipointEnd = wrapFunc(this.element, option.multipointEnd || noop);
            this.pinch = wrapFunc(this.element, option.pinch || noop);
            this.swipe = wrapFunc(this.element, option.swipe || noop);
            this.tap = wrapFunc(this.element, option.tap || noop);
            this.doubleTap = wrapFunc(this.element, option.doubleTap || noop);
            this.longTap = wrapFunc(this.element, option.longTap || noop);
            this.singleTap = wrapFunc(this.element, option.singleTap || noop);
            this.pressMove = wrapFunc(this.element, option.pressMove || noop);
            this.touchMove = wrapFunc(this.element, option.touchMove || noop);
            this.touchEnd = wrapFunc(this.element, option.touchEnd || noop);
            this.touchCancel = wrapFunc(this.element, option.touchCancel || noop);

            this.delta = null;    // 差值 变量增量
            this.last = null;    // 最后数值
            this.now = null;    // 开始时的时间戳
            this.tapTimeout = null;    // tap超时
            this.singleTapTimeout = null;    // singleTap超时
            this.longTapTimeout = null;    // longTap超时(定时器的返回值)
            this.swipeTimeout = null;    // swipe超时
            this.x1 = this.x2 = this.y1 = this.y2 = null;    // start()时的坐标x1, y1, move()时的坐标x2, y2 (相对于页面的坐标)
            this.preTapPosition = { x: null, y: null };    // 用来保存start()方法时的手指坐标
        };

        // AlloyFinger原型对象
        AlloyFinger.prototype = {

            start: function (evt) {
                if (!evt.touches) return;    // 如果没有TouchList对象, 直接return掉 (touches: 位于屏幕上的所有手指的列表)

                this.now = Date.now();    // 开始时间戳
                this.x1 = evt.touches[0].pageX;    // 相对于页面的 x1, y1 坐标
                this.y1 = evt.touches[0].pageY;
                this.delta = this.now - (this.last || this.now);    // 时间戳差值

                this.touchStart.dispatch(evt);    // 调用HandlerAdmin实例this.touchStart上的dispatch方法(用户的touchStart回调就在此调用的)

                if (this.preTapPosition.x !== null) {    // 开始前tap的x坐标不为空的话(一次没点的时候必然是null了)
                    this.isDoubleTap = (this.delta > 0 && this.delta <= 250 && Math.abs(this.preTapPosition.x - this.x1) < 30 && Math.abs(this.preTapPosition.y - this.y1) < 30);
                };
                this.preTapPosition.x = this.x1;    // 把相对于页面的 x1, y1 坐标赋值给 this.preTapPosition
                this.preTapPosition.y = this.y1;
                this.last = this.now;    // 把开始时间戳赋给 this.last
                var preV = this.preV,    // 把开始前的坐标赋给 preV变量
                    len = evt.touches.length;    // len: 手指的个数

                if (len > 1) {    // 一根手指以上
                    this._cancelLongTap();    // 取消长按定时器
                    this._cancelSingleTap();    // 取消SingleTap定时器

                    var v = {    // 2个手指坐标的差值
                        x: evt.touches[1].pageX - this.x1,
                        y: evt.touches[1].pageY - this.y1
                    };
                    preV.x = v.x;    // 差值赋值给PreV对象
                    preV.y = v.y;

                    this.pinchStartLen = getLen(preV);    // start()方法中2点之间的距离
                    this.multipointStart.dispatch(evt);    // (用户的multipointStart回调就在此调用的)
                };

                this.longTapTimeout = setTimeout(function () {
                    this.longTap.dispatch(evt);    // (用户的longTap回调就在此调用的)
                }.bind(this), 750);
            },

            move: function (evt) {
                if (!evt.touches) return;    // 如果没有TouchList对象, 直接return掉 (touches: 位于屏幕上的所有手指的列表)

                var preV = this.preV,    // 把start方法保存的2根手指坐标的差值xy赋给preV变量
                    len = evt.touches.length,    // 手指个数
                    currentX = evt.touches[0].pageX,    // 第一根手指的坐标(相对于页面的 x1, y1 坐标)
                    currentY = evt.touches[0].pageY;
                this.isDoubleTap = false;    // 移动过程中不能双击了

                if (len > 1) {    // 2根手指以上(处理捏pinch和旋转rotate手势)

                    var v = {    // 第二根手指和第一根手指坐标的差值
                        x: evt.touches[1].pageX - currentX,
                        y: evt.touches[1].pageY - currentY
                    };

                    if (preV.x !== null) {    // start方法中保存的this.preV的x不为空的话

                        if (this.pinchStartLen > 0) {    // 2点间的距离大于0
                            evt.scale = getLen(v) / this.pinchStartLen;    // move中的2点之间的距离除以start中的2点的距离就是缩放比值
                            this.pinch.dispatch(evt);    // scale挂在到evt对象上 (用户的pinch回调就在此调用的)
                        };

                        evt.angle = getRotateAngle(v, preV);    // 计算angle角度
                        this.rotate.dispatch(evt);    // (用户的pinch回调就在此调用的)
                    };

                    preV.x = v.x;    // 把move中的2根手指中的差值赋值给preV, 当然也改变了this.preV
                    preV.y = v.y;

                } else {    // 一根手指(处理拖动pressMove手势)

                    if (this.x2 !== null) {    // 一根手指第一次必然为空,因为初始化赋值为null, 下面将会用x2, y2保存上一次的结果

                        evt.deltaX = currentX - this.x2;    // 拖动过程中或者手指移动过程中的差值(当前坐标与上一次的坐标)
                        evt.deltaY = currentY - this.y2;

                    } else {
                        evt.deltaX = 0;    // 第一次嘛, 手指刚移动,哪来的差值啊,所以为0呗
                        evt.deltaY = 0;
                    };
                    this.pressMove.dispatch(evt);    // deltaXY挂载到evt对象上,抛给用户(用户的pressMove回调就在此调用的)
                };

                this.touchMove.dispatch(evt);    // evt对象因if语句而不同,挂载不同的属性抛出去给用户 (用户的touchMove回调就在此调用的)

                this._cancelLongTap();    // 取消长按定时器

                this.x2 = currentX;    // 存一下本次的pageXY坐标, 为了下次做差值
                this.y2 = currentY;

                if (len > 1) {    // 2个手指以上就阻止默认事件
                    evt.preventDefault();
                };
            },

            end: function (evt) {
                if (!evt.changedTouches) return;    // 位于该元素上的所有手指的列表, 没有TouchList也直接return掉

                this._cancelLongTap();    // 取消长按定时器

                var self = this;    // 存个实例
                if (evt.touches.length < 2) {    // 手指数量小于2就触发 (用户的多点结束multipointEnd回调函数)
                    this.multipointEnd.dispatch(evt);
                };

                this.touchEnd.dispatch(evt);    // 触发(用户的touchEnd回调函数)

                //swipe 滑动
                if ((this.x2 && Math.abs(this.x1 - this.x2) > 30) || (this.y2 && Math.abs(this.preV.y - this.y2) > 30)) {

                    evt.direction = this._swipeDirection(this.x1, this.x2, this.y1, this.y2);    // 获取上下左右方向中的一个

                    this.swipeTimeout = setTimeout(function () {
                        self.swipe.dispatch(evt);    // 立即触发,加入异步队列(用户的swipe事件的回调函数)
                    }, 0);

                } else {   // 以下是tap, singleTap, doubleTap事件派遣

                    this.tapTimeout = setTimeout(function () {

                        self.tap.dispatch(evt);    // 触发(用户的tap事件的回调函数)
                        // trigger double tap immediately
                        if (self.isDoubleTap) {    // 如果满足双击的话

                            self.doubleTap.dispatch(evt);    // 触发(用户的doubleTap事件的回调函数)
                            clearTimeout(self.singleTapTimeout);    // 清除singleTapTimeout定时器

                            self.isDoubleTap = false;    // 双击条件重置

                        } else {
                            self.singleTapTimeout = setTimeout(function () {
                                self.singleTap.dispatch(evt);    // 触发(用户的singleTap事件的回调函数)
                            }, 250);
                        };

                    }, 0);    // 加入异步队列,主线程完成立马执行
                };

                this.preV.x = 0;    // this.preV, this.scale, this.pinchStartLen, this.x1 x2 y1 y2恢复初始值
                this.preV.y = 0;
                this.scale = 1;
                this.pinchStartLen = null;
                this.x1 = this.x2 = this.y1 = this.y2 = null;
            },

            cancel: function (evt) {
                //清除定时器
                clearTimeout(this.singleTapTimeout);
                clearTimeout(this.tapTimeout);
                clearTimeout(this.longTapTimeout);
                clearTimeout(this.swipeTimeout);
                // 执行用户的touchCancel回调函数,没有就执行一次noop空函数
                this.touchCancel.dispatch(evt);
            },

            _cancelLongTap: function () {    // 取消长按定时器
                clearTimeout(this.longTapTimeout);
            },

            _cancelSingleTap: function () {    // 取消延时SingleTap定时器
                clearTimeout(this.singleTapTimeout);
            },

            // 2点间x与y之间的绝对值的差值作比较,x大的话即为左右滑动,y大即为上下滑动,x的差值大于0即为左滑动,小于0即为右滑动
            _swipeDirection: function (x1, x2, y1, y2) {    // 判断用户到底是从上到下，还是从下到上，或者从左到右、从右到左滑动
                return Math.abs(x1 - x2) >= Math.abs(y1 - y2) ? (x1 - x2 > 0 ? 'Left' : 'Right') : (y1 - y2 > 0 ? 'Up' : 'Down');
            },

            // 给dom添加14种事件中的一种
            on: function(evt, handler) {
                if(this[evt]) {    // 看看有没有相应的事件名
                    this[evt].add(handler);    // HandlerAdmin实例的add方法
                };
            },

            // 移除手势事件对应函数
            off: function(evt, handler) {
                if(this[evt]) {
                    this[evt].del(handler);    // 从数组中删除handler方法
                };
            },

            destroy: function() {

                // 关闭所有定时器
                if(this.singleTapTimeout) clearTimeout(this.singleTapTimeout);
                if(this.tapTimeout) clearTimeout(this.tapTimeout);
                if(this.longTapTimeout) clearTimeout(this.longTapTimeout);
                if(this.swipeTimeout) clearTimeout(this.swipeTimeout);

                // 取消dom上touchstart, touchmove, touchend, touchcancel事件
                this.element.removeEventListener("touchstart", this.start);
                this.element.removeEventListener("touchmove", this.move);
                this.element.removeEventListener("touchend", this.end);
                this.element.removeEventListener("touchcancel", this.cancel);

                // 把14个HandlerAdmin实例的this.handlers置为空数组
                this.rotate.del();
                this.touchStart.del();
                this.multipointStart.del();
                this.multipointEnd.del();
                this.pinch.del();
                this.swipe.del();
                this.tap.del();
                this.doubleTap.del();
                this.longTap.del();
                this.singleTap.del();
                this.pressMove.del();
                this.touchMove.del();
                this.touchEnd.del();
                this.touchCancel.del();

                // 实例成员的变量全部置为null
                this.preV = this.pinchStartLen = this.scale = this.isDoubleTap = this.delta = this.last = this.now = this.tapTimeout = this.singleTapTimeout = this.longTapTimeout = this.swipeTimeout = this.x1 = this.x2 = this.y1 = this.y2 = this.preTapPosition = this.rotate = this.touchStart = this.multipointStart = this.multipointEnd = this.pinch = this.swipe = this.tap = this.doubleTap = this.longTap = this.singleTap = this.pressMove = this.touchMove = this.touchEnd = this.touchCancel = null;

                return null;
            }
        };

        // 抛出去
        exports.Finger = AlloyFinger;

    })(jsLib);

    ; (function(exports) {

        var DEG_TO_RAD =  0.017453292519943295;

        // 三维矩阵
        var Matrix3D = function(n11, n12, n13, n14, n21, n22, n23, n24, n31, n32, n33, n34, n41, n42, n43, n44) {
            this.elements = window.Float32Array ? new Float32Array(16) : [];
            var te = this.elements;
            te[0] = (n11 !== undefined) ? n11 : 1;
            te[1] = n21 || 0;
            te[2] = n31 || 0;
            te[3] = n41 || 0;

            te[4] = n12 || 0;
            te[5] = (n22 !== undefined) ? n22 : 1;
            te[6] = n32 || 0;
            te[7] = n42 || 0;

            te[8] = n13 || 0;
            te[9] = n23 || 0;
            te[10] = (n33 !== undefined) ? n33 : 1;
            te[11] = n43 || 0;

            te[12] = n14 || 0;
            te[13] = n24 || 0;
            te[14] = n34 || 0;
            te[15] = (n44 !== undefined) ? n44 : 1;
        };

        Matrix3D.prototype = {
            constructor: Matrix3D,

            set: function(n11, n12, n13, n14, n21, n22, n23, n24, n31, n32, n33, n34, n41, n42, n43, n44) {
                var te = this.elements;
                te[0] = n11; te[4] = n12; te[8] = n13; te[12] = n14;
                te[1] = n21; te[5] = n22; te[9] = n23; te[13] = n24;
                te[2] = n31; te[6] = n32; te[10] = n33; te[14] = n34;
                te[3] = n41; te[7] = n42; te[11] = n43; te[15] = n44;
                return this;
            },
            identity: function() {
                this.set(
                    1, 0, 0, 0,
                    0, 1, 0, 0,
                    0, 0, 1, 0,
                    0, 0, 0, 1
                );
                return this;
            },
            appendTransform: function(x, y, z, scaleX, scaleY, scaleZ, rotateX, rotateY, rotateZ, skewX, skewY, originX, originY, originZ) {

                var rx = rotateX * DEG_TO_RAD;
                var cosx = this._rounded(Math.cos(rx));
                var sinx = this._rounded(Math.sin(rx));
                var ry = rotateY * DEG_TO_RAD;
                var cosy = this._rounded(Math.cos(ry));
                var siny = this._rounded(Math.sin(ry));
                var rz = rotateZ * DEG_TO_RAD;
                var cosz = this._rounded(Math.cos(rz * -1));
                var sinz = this._rounded(Math.sin(rz * -1));

                this.multiplyMatrices(this, this._arrayWrap([
                    1, 0, 0, x,
                    0, cosx, sinx, y,
                    0, -sinx, cosx, z,
                    0, 0, 0, 1
                ]));

                this.multiplyMatrices(this, this._arrayWrap([
                    cosy, 0, siny, 0,
                    0, 1, 0, 0,
                    -siny, 0, cosy, 0,
                    0, 0, 0, 1
                ]));

                this.multiplyMatrices(this, this._arrayWrap([
                    cosz * scaleX, sinz * scaleY, 0, 0,
                    -sinz * scaleX, cosz * scaleY, 0, 0,
                    0, 0, 1 * scaleZ, 0,
                    0, 0, 0, 1
                ]));

                if (skewX || skewY) {
                    this.multiplyMatrices(this, this._arrayWrap([
                        this._rounded(Math.cos(skewX * DEG_TO_RAD)), this._rounded(Math.sin(skewX * DEG_TO_RAD)), 0, 0,
                        -1 * this._rounded(Math.sin(skewY * DEG_TO_RAD)), this._rounded(Math.cos(skewY * DEG_TO_RAD)), 0, 0,
                        0, 0, 1, 0,
                        0, 0, 0, 1
                    ]));
                };

                if (originX || originY || originZ) {
                    this.elements[12] -= originX * this.elements[0] + originY * this.elements[4] + originZ * this.elements[8];
                    this.elements[13] -= originX * this.elements[1] + originY * this.elements[5] + originZ * this.elements[9];
                    this.elements[14] -= originX * this.elements[2] + originY * this.elements[6] + originZ * this.elements[10];
                };

                return this;
            },
            // 矩阵相乘
            multiplyMatrices: function(a, be) {
                var ae = a.elements;
                var te = this.elements;

                var a11 = ae[0], a12 = ae[4], a13 = ae[8], a14 = ae[12];
                var a21 = ae[1], a22 = ae[5], a23 = ae[9], a24 = ae[13];
                var a31 = ae[2], a32 = ae[6], a33 = ae[10], a34 = ae[14];
                var a41 = ae[3], a42 = ae[7], a43 = ae[11], a44 = ae[15];

                var b11 = be[0], b12 = be[1], b13 = be[2], b14 = be[3];
                var b21 = be[4], b22 = be[5], b23 = be[6], b24 = be[7];
                var b31 = be[8], b32 = be[9], b33 = be[10], b34 = be[11];
                var b41 = be[12], b42 = be[13], b43 = be[14], b44 = be[15];

                te[0] = a11 * b11 + a12 * b21 + a13 * b31 + a14 * b41;
                te[4] = a11 * b12 + a12 * b22 + a13 * b32 + a14 * b42;
                te[8] = a11 * b13 + a12 * b23 + a13 * b33 + a14 * b43;
                te[12] = a11 * b14 + a12 * b24 + a13 * b34 + a14 * b44;

                te[1] = a21 * b11 + a22 * b21 + a23 * b31 + a24 * b41;
                te[5] = a21 * b12 + a22 * b22 + a23 * b32 + a24 * b42;
                te[9] = a21 * b13 + a22 * b23 + a23 * b33 + a24 * b43;
                te[13] = a21 * b14 + a22 * b24 + a23 * b34 + a24 * b44;

                te[2] = a31 * b11 + a32 * b21 + a33 * b31 + a34 * b41;
                te[6] = a31 * b12 + a32 * b22 + a33 * b32 + a34 * b42;
                te[10] = a31 * b13 + a32 * b23 + a33 * b33 + a34 * b43;
                te[14] = a31 * b14 + a32 * b24 + a33 * b34 + a34 * b44;

                te[3] = a41 * b11 + a42 * b21 + a43 * b31 + a44 * b41;
                te[7] = a41 * b12 + a42 * b22 + a43 * b32 + a44 * b42;
                te[11] = a41 * b13 + a42 * b23 + a43 * b33 + a44 * b43;
                te[15] = a41 * b14 + a42 * b24 + a43 * b34 + a44 * b44;

                return this;
            },
            // 解决角度为90的整数倍导致Math.cos得到极小的数，其实是0。导致不渲染
            _rounded: function(value, i) {
                i = Math.pow(10, i || 15);
                return Math.round(value * i) / i;
            },
            _arrayWrap: function(arr) {
                return window.Float32Array ? new Float32Array(arr) : arr;
            }
        };

        // 主入口函数
        function Transform(obj, notPerspective) {
            var observeProps = ['translateX', 'translateY', 'translateZ', 'scaleX', 'scaleY', 'scaleZ', 'rotateX', 'rotateY', 'rotateZ', 'skewX', 'skewY', 'originX', 'originY', 'originZ'],
                objIsElement = isElement(obj);
            if (!notPerspective) {
                observeProps.push('perspective');
            };

            obj.matrix3d = new Matrix3D();
            observe(
                obj,
                observeProps,
                function() {
                    var mtx = obj.matrix3d.identity().appendTransform(obj.translateX, obj.translateY, obj.translateZ, obj.scaleX, obj.scaleY, obj.scaleZ, obj.rotateX, obj.rotateY, obj.rotateZ, obj.skewX, obj.skewY, obj.originX, obj.originY, obj.originZ);
                    var transform = (notPerspective ? '' : 'perspective(' + obj.perspective + 'px) ') + 'matrix3d(' + Array.prototype.slice.call(mtx.elements).join(',') + ')';
                    if (objIsElement) {
                        obj.style.transform = obj.style.msTransform = obj.style.OTransform = obj.style.MozTransform = obj.style.webkitTransform = transform;
                    } else {
                        obj.transform = transform;
                    };
                });

            if (!notPerspective) {
                obj.perspective = 500;    // 景深默认值
            };
            obj.scaleX = obj.scaleY = obj.scaleZ = 1;
            obj.translateX = obj.translateY = obj.translateZ = obj.rotateX = obj.rotateY = obj.rotateZ = obj.skewX = obj.skewY = obj.originX = obj.originY = obj.originZ = 0;
        };

        // 工具函数
        function isElement(obj) {
            return (
                typeof HTMLElement === 'object' ? obj instanceof HTMLElement : //DOM2
                obj && typeof obj === 'object' && obj !== null && obj.nodeType === 1 && typeof obj.nodeName === 'string'
            );
        };

        function observe(target, props, callback) {
            for (var i = 0, len = props.length; i < len; i += 1) {
                var prop = props[i];
                watch(target, prop, callback);
            };
        };

        // 每一次改变那15个属性中的任意一个,都会执行回调
        function watch(target, prop, callback) {
            Object.defineProperty(target, prop, {
                get: function() {
                    return this['_' + prop];
                },
                set: function(value) {
                    if (value !== this['_' + prop]) {
                        this['_' + prop] = value;
                        callback();
                    };
                }
            });
        };

        // 抛出去
        exports.Transform = Transform;

    })(jsLib);

    /************** 上面一些方法(插件)扩展到JSLibrary原型上    结束 **************/

    // 把jsLib抛出去
     function jsLib(arg) {
         return new JSLibrary(arg);
     };

     if (typeof module !== 'undefined' && typeof exports === 'object') {
        module.exports = jsLib;
    } else {
         if (!win.jsLib) win.jsLib = jsLib;
    };
}(window, document));