Browse Source

增加活动和专题的模板

ChenLiang 4 years ago
parent
commit
000d7eaf3f

+ 72 - 0
专题模板/css/index.css

@@ -0,0 +1,72 @@
+/*初始化*/
+* {
+  margin: 0;
+  padding: 0;
+}
+html {
+  -webkit-text-size-adjust: 100%;
+  -ms-text-size-adjust: 100%;
+  font-size: 20px;
+  width: 1280px;
+  height: 720px;
+}
+body {
+  width: 1280px;
+  height: 720px;
+  background: transparent;
+  background-size: 1280px 720px;
+  font-size: 0.14rem;
+  font-family: 'Microsoft Yahei;Arial';
+  white-space: normal;
+  table-layout: fixed;
+  word-wrap: break-word;
+  -webkit-overflow-scrolling: touch;
+}
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+em,
+b,
+i {
+  font-style: normal;
+}
+ol,
+ul,
+li {
+  list-style: none;
+}
+fieldset,
+img,
+abbr,
+acronym {
+  border: 0;
+}
+input,
+select {
+  vertical-align: middle;
+  -webkit-appearance: none;
+}
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-weight: normal;
+}
+q:before,
+q:after {
+  content: '';
+}
+a,
+a:hover {
+  text-decoration: none;
+}
+.container {
+  position: relative;
+  width: 1280px;
+  height: 720px;
+  background: url('../img/bg.png') no-repeat;
+  background-size: 100%;
+}

+ 84 - 0
专题模板/css/index.less

@@ -0,0 +1,84 @@
+/*初始化*/
+* {
+    margin: 0;
+    padding: 0;
+}
+
+html {
+    -webkit-text-size-adjust: 100%;
+    -ms-text-size-adjust: 100%;
+    font-size: 20px;
+    width: 1280px;
+    height: 720px;
+}
+
+body {
+    width: 1280px;
+    height: 720px;
+    background: transparent;
+    background-size: 1280px 720px;
+    font-size: .14rem;
+    font-family: 'Microsoft Yahei;Arial';
+    white-space: normal;
+    table-layout: fixed;
+    word-wrap: break-word;
+    -webkit-overflow-scrolling: touch;
+}
+
+table {
+    border-collapse: collapse;
+    border-spacing: 0;
+}
+
+em,
+b,
+i {
+    font-style: normal;
+}
+
+ol,
+ul,
+li {
+    list-style: none;
+}
+
+fieldset,
+img,
+abbr,
+acronym {
+    border: 0;
+}
+
+input,
+select {
+    vertical-align: middle;
+    -webkit-appearance: none;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+    font-weight: normal;
+}
+
+q:before,
+q:after {
+    content: '';
+}
+
+a,
+a:hover {
+    text-decoration: none;
+}
+
+.container {
+    position: relative;
+    width: 1280px;
+    height: 720px;
+    background: url('../img/bg.png') no-repeat;
+    background-size: 100%;
+    
+}

+ 52 - 0
专题模板/index.html

@@ -0,0 +1,52 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="utf-8">
+    <meta name="page-view-size" content="1280*720" />
+    <link rel="stylesheet" type="text/css" href="css/index.css" />
+    <title>专题题目</title>
+</head>
+
+<body>
+    <!-- 首页 -->
+    <div class="container">
+
+    </div>
+
+</body>
+<!-- 各地区需要引入的js -->
+
+<!-- 本活动用js -->
+<script type="text/javascript" src="js/tvSysBtnBind.v2.1.js"></script>
+<script type="text/javascript" src="js/common.js"></script>
+<script>
+    // 焦点移动插件的配置
+    tsConfig = {
+        className: '',
+        currentIndex: 0,
+        rules: {
+
+        },
+        onEnterPress: function () {
+
+        },
+        onBack: function () {
+            backRule()
+        },
+        onPress: function () {
+
+        }
+    }
+    
+   
+    // 返回方法
+    function backRule() {
+
+    }
+
+    btn = new tvSysBtnBind(tsConfig)
+    window.onBackEvent = backRule
+</script>
+
+</html>

File diff suppressed because it is too large
+ 832 - 0
专题模板/js/common.js


+ 877 - 0
专题模板/js/tvSysBtnBind.v2.1.js

@@ -0,0 +1,877 @@
+try {
+    (function(arr) {
+        arr.forEach(function(item) {
+            if (item.hasOwnProperty('remove')) {
+                return
+            }
+            Object.defineProperty(item, 'remove', {
+                configurable: true,
+                enumerable: true,
+                writable: true,
+                value: function remove() {
+                    this.parentNode.removeChild(this)
+                }
+            })
+        })
+    })([Element.prototype, CharacterData.prototype, DocumentType.prototype]);
+    if (!("classList" in document.documentElement)) {
+        Object.defineProperty(HTMLElement.prototype, 'classList', {
+            get: function() {
+                var self = this;
+
+                function update(fn) {
+                    return function(value) {
+                        var classes = self.className.split(/\s+/g),
+                            index = classes.indexOf(value);
+                        fn(classes, index, value);
+                        self.className = classes.join(" ")
+                    }
+                }
+                return {
+                    add: update(function(classes, index, value) {
+                        if (!~index) classes.push(value)
+                    }),
+                    remove: update(function(classes, index) {
+                        if (~index) classes.splice(index, 1)
+                    }),
+                    toggle: update(function(classes, index, value) {
+                        if (~index) classes.splice(index, 1);
+                        else classes.push(value)
+                    }),
+                    contains: function(value) {
+                        return !!~self.className.split(/\s+/g).indexOf(value)
+                    },
+                    item: function(i) {
+                        return self.className.split(/\s+/g)[i] || null
+                    }
+                }
+            }
+        })
+    }
+    function fireKeyEvent(el, evtType, keyCode) {
+        var doc = el.ownerDocument,
+            win = doc.defaultView || doc.parentWindow,
+            evtObj;
+        if (doc.createEvent) {
+            if (win.KeyEvent) {
+                evtObj = doc.createEvent('KeyEvents');
+                evtObj.initKeyEvent(evtType, true, true, win, false, false, false, false, keyCode, 0)
+            } else {
+                evtObj = doc.createEvent('UIEvents');
+                Object.defineProperty(evtObj, 'keyCode', {
+                    get: function() {
+                        return this.keyCodeVal
+                    }
+                });
+                Object.defineProperty(evtObj, 'which', {
+                    get: function() {
+                        return this.keyCodeVal
+                    }
+                });
+                evtObj.initUIEvent(evtType, true, true, win, 1);
+                evtObj.keyCodeVal = keyCode;
+                if (evtObj.keyCode !== keyCode) {}
+            }
+            el.dispatchEvent(evtObj)
+        } else if (doc.createEventObject) {
+            evtObj = doc.createEventObject();
+            evtObj.keyCode = keyCode;
+            el.fireEvent('on' + evtType, evtObj)
+        }
+    }
+} catch (e) {}
+function addClass(ele, cls) {
+    if (ele.classList) {
+        ele.classList.add(cls)
+    } else {
+        if (!this.hasClass(ele, cls)) ele.className += " " + cls
+    }
+}
+function arrIndexOf(arr, v) {
+    for (var i = 0; i < arr.length; i++) {
+        if (arr[i] == v) {
+            return i
+        }
+    }
+    return -1
+}
+function removeClass(ele, cls) {
+    if (ele.classList) {
+        ele.classList.remove(cls)
+    } else {
+        if (ele.className != '' && hasClass(ele, cls)) {
+            var arrClassName = ele.className.split(' ');
+            var classIndex = arrIndexOf(arrClassName, cls);
+            if (classIndex !== -1) {
+                arrClassName.splice(classIndex, 1);
+                ele.className = arrClassName.join(' ')
+            }
+        }
+    }
+}
+function toggleClass(ele, cls) {
+    if (hasClass(ele, cls)) {
+        removeClass(ele, cls)
+    } else {
+        addClass(ele, cls)
+    }
+}
+function hasClass(element, cls) {
+    return (' ' + element.className + ' ').indexOf(' ' + cls + ' ') > -1
+}
+function getClassNames(classStr, target, tagName) {
+    target = target ? target : document;
+    tagName = tagName ? tagName : "*";
+    if (document.getElementsByClassName) {
+        return target.getElementsByClassName(classStr)
+    } else {
+        var nodes = target.getElementsByTagName(tagName),
+            ret = [];
+        for (i = 0; i < nodes.length; i++) {
+            if (hasClass(nodes[i], classStr)) {
+                ret.push(nodes[i])
+            }
+        }
+        return ret
+    }
+}
+function getElementLeft(ele) {
+    var actualLeft = ele.offsetLeft;
+    var current = ele.offsetParent;
+    while (current !== null) {
+        actualLeft += current.offsetLeft;
+        current = current.offsetParent
+    }
+    return actualLeft
+}
+function getElementTop(ele) {
+    var actualTop = ele.offsetTop;
+    var current = ele.offsetParent;
+    while (current !== null) {
+        actualTop += current.offsetTop;
+        current = current.offsetParent
+    }
+    return actualTop
+}
+var contains = document.documentElement.contains ? function(parent, node) { 
+        if(parent){
+            return parent !== node && parent.contains(node)
+        }
+        
+      } : function(parent, node) {
+        if(parent){
+            while (node && (node = node.parentNode))
+          if (node === parent) return true
+            return false
+        }
+        
+      }
+function getBoundingClientRect(ele) {
+    var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
+    var scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft;
+    if (ele.getBoundingClientRect) {
+        if (typeof arguments.callee.offset !== 'number') {
+            var temp = document.createElement('div');
+            temp.style.cssText = "position:absolute;top:0;left:0";
+            document.body.appendChild(temp);
+            arguments.callee.offset = -temp.getBoundingClientRect().top - scrollTop;
+            document.body.removeChild(temp);
+            temp = null
+        }
+        var rect = ele.getBoundingClientRect();
+        var offset = arguments.callee.offset;
+        return {
+            left: rect.left + offset,
+            right: rect.right + offset,
+            top: rect.top + offset,
+            bottom: rect.bottom + offset,
+            width: (rect.right + offset) - (rect.left + offset),
+            height: (rect.bottom + offset) - (rect.top + offset)
+        }
+    } else {
+        var actualLeft = getElementLeft(ele);
+        var actualTop = getElementTop(ele);
+        var offsetWidth = ele.offsetWidth;
+        var offsetHeight = ele.offsetHeight;
+        return {
+            left: actualLeft - scrollLeft,
+            right: actualLeft + offsetWidth - scrollLeft,
+            top: actualTop - scrollTop,
+            bottom: actualTop + offsetHeight - scrollTop,
+            width: (actualLeft + offsetWidth - scrollLeft) - (actualLeft - scrollLeft),
+            height: (actualTop + offsetHeight - scrollTop) - (actualTop - scrollTop)
+        }
+    }
+}
+
+(function(window) {
+    var tvSysBtnBind = function(init) {
+            var _this = this,
+                _self = self;
+            var id = init.id ? init.id : null,
+                keyRemoveDefault = typeof init.keyRemoveDefault == "undefined" ? false : init.keyRemoveDefault,
+                currentIndex = init.currentIndex ? parseInt(init.currentIndex) : 0,
+                btnLeft = init.btnLeft ? init.btnLeft : 37,
+                btnUp = init.btnUp ? init.btnUp : 38,
+                btnRight = init.btnRight ? init.btnRight : 39,
+                btnDown = init.btnDown ? init.btnDown : 40,
+                btnEnter = init.btnEnter ? init.btnEnter : 13,
+                btnBack = init.btnBack ? init.btnBack : 27,
+                history = typeof init.history == "undefined" ? true : init.history,
+                doublePress = typeof init.doublePress == "undefined" ? false : init.doublePress,
+                isFloatLast = typeof init.isFloatLast == "undefined" ? false : init.isFloatLast,
+                isCentered = typeof init.isCentered == "undefined" ? true : init.isCentered,
+                currentClass = init.currentClass ? init.currentClass : "current",
+                effect = init.effect ? init.effect : "slide1",
+                element = new Array(),
+                rules = init.rules?init.rules:{hotbutton:{}},
+                direction = "y";
+            _this.className = init.className ? init.className : "hotbutton";
+            this.event = {};
+            var _tempElem;
+            this.currentIndex = parseInt(currentIndex);
+            this.defaultIndex = parseInt(currentIndex);
+            this.currentClass = currentClass;
+            this.historyFocus = {};
+            if (!window.focusobj) window.focusobj = document.createElement("span");
+            (typeof init.onLoad) == "function" ? init.onLoad : init.onLoad = function() {};
+            (typeof init.onBack) == "function" ? init.onLoad : init.onBack = function() {};
+            (typeof init.onCommPress) == "function" ? init.onCommPress : init.onCommPress = function() {};
+            this.onLoad = function() {
+                focusobj.innerHTML = '<div class="cssbk"><b class="lt"></b><b class="t"></b><b class="rt"></b><b class="r"></b><b class="rb"></b><b class="b"></b><b class="lb"></b> <b class="l"></b></div>';
+                addClass(focusobj, "focusobj");
+                addClass(focusobj, "current");
+                focusobj.style.display = "none";
+                _this.target = init.id ? document.getElementById(init.id) : document.body;
+                _this.defaultTarget = _this.target;
+                _this.currentId = init.id ? init.id : "Jdoc";
+                self.getCurRule();
+                _this.reLoad();
+                self.onPressFn = _this.onPressRules
+                _this.sourceClassName = _this.className;
+                _this.sourceLength = element.length;
+                _this.prev = element[currentIndex];
+                _this.prevIndex = currentIndex;
+                _this.current = element[currentIndex];
+                _this.currentIndex = currentIndex;
+                _this.target.appendChild(focusobj);
+                init.onLoad.call(_this);
+                window.focus();
+            }
+            self.getCurRule = function(item) {
+                var obj = {};
+                if (rules) {
+                    obj = rules["#" + _this.currentId + ">." + _this.className];
+                    if (typeof obj == "undefined") {
+                        if (rules[_this.className]) {
+                            obj = rules[_this.className]
+                        }
+                    }
+                    if (item && typeof rules[item] == "undefined") {
+                       // rules[item]={};
+                    }
+                }
+                return obj
+            }
+            this.reSetClass = function(item, index, curClass) {
+                var obj = _self.getCurRule(item);
+                if (!obj) {
+                    console.log("初始化" + _this.className + "失败");
+                    return
+                }
+                if (typeof obj["history"] == "undefined") obj["history"] = history;
+                if (obj["history"]) _this.historyFocus[_this.currentId + _this.className] = _this.currentIndex;
+                _this.prevCurrentClass = _this.currentClass;
+                if (curClass) {
+                    _this.currentClass = curClass
+                }
+                var arr = item.split(">");
+                for (var i = 0; i < arr.length; i++) {
+                    if (arr[i] == "") arr.splice(i)
+                }
+                for (var i = 0; i < arr.length; i++) {
+                    if (arr[i].indexOf("#") != -1) {
+                        _this.currentId = arr[i].replace("#", "");
+                        if (document.getElementById(_this.currentId)) _this.target = document.getElementById(_this.currentId)
+                    }
+                    if (arr[i].indexOf(".") != -1) {
+                        item = arr[i].replace(".", "")
+                    }
+                    if (arr[i].indexOf(".") == -1 && arr[i].indexOf("#") == -1) {
+                        item = arr[i]
+                    }
+                }
+                if (getClassNames(item, _this.target).length > 0) {
+                    _self.newItem(item, index)
+                } else {
+                    _this.target = _this.defaultTarget;
+                    if (getClassNames(item, _this.target).length > 0) _self.newItem(item, index)
+                }
+            }
+            this.onCommPress = function(e) {
+                init.onCommPress.call(_this)
+            }
+            this.tsClose = function () {
+                self.onPressFn = function(e){
+                    e.preventDefault()
+                    return
+                }
+            }
+            this.tsOpen = function () {
+                self.onPressFn = this.onPressRules
+            }
+            self.newItem = function(item, index) {
+                var obj = _self.getCurRule();
+                if (_this.prev) removeClass(_this.prev, _this.currentClass);
+                if (typeof _this.historyFocus[_this.currentId + item] == "undefined") _this.historyFocus[_this.currentId + item] = 0;
+                _this.className = item;
+                var idx = obj["savelastIndex"] ? _this.currentIndex : 0;
+                index = index > getClassNames(item, _this.target).length - 1 ? getClassNames(item, _this.target).length - 1 : index;
+                idx = _this.historyFocus[_this.currentId + item] ? _this.historyFocus[_this.currentId + item] : idx;
+                _this.currentIndex = typeof index != "undefined" ? index : idx;
+                _this.prevIndex = _this.currentIndex;
+                _this.reLoad()
+            }
+            self.readFn = function() {
+                if ((typeof init.onEnterPress) == "function") {
+                    init.onEnterPress
+                } else {
+                    init.onEnterPress = function() {}
+                }
+                if ((typeof init.onPress) == "function") {
+                    init.onPress
+                } else {
+                    init.onPress = function() {}
+                }
+            }
+            this.reLoad = function() {
+                self.readFn();
+                element = getClassNames(_this.className, _this.target);
+                if (element.length <= 0) {
+                    console.log("初始化" + _this.className + "失败");
+                    return
+                }
+                this.hotbtn = element;
+                if (element.length <= 0) return false;
+                if (_this.currentIndex || _this.currentIndex == 0) {
+                    _this.currentIndex = parseInt(_this.currentIndex)
+                } else {
+                    _this.currentIndex = parseInt(init.currentIndex)
+                }
+                if (isload >= 2 && _this.sourceClass == _this.className && _this.sourceLength != element.length && !isSet) {
+                    if (hasClass(_this.prev, _this.className) && _this.sourceLength > element.length) {
+                        _this.currentIndex = _this.currentIndex - (_this.sourceLength - element.length);
+                        _this.prevIndex = _this.prevIndex - (_this.sourceLength - element.length);
+                        _this.sourceLength = element.length
+                    } else if (hasClass(_this.prev, _this.className) && _this.sourceLength < element.length) {
+                        _this.currentIndex = _this.currentIndex + (element.length - _this.sourceLength);
+                        _this.prevIndex = _this.prevIndex + (element.length - _this.sourceLength);
+                        _this.sourceLength = element.length
+                    }
+                }
+                isSet = false;
+                self.overIndex();
+                _this.current = element[_this.currentIndex];
+                _this.currentIndex = _this.currentIndex;
+                _self.render(_this.currentIndex);
+                for (var i = 0; i < this.hotbtn.length; i++) {
+                    this.hotbtn[i].setAttribute("data-id", i)
+                }
+            }
+            function keydefault(e) {
+                try {
+                    e.preventDefault()
+                } catch (e) {}
+            }
+            var isSet = false;
+            this.setCurrentIndex = function(index) {
+                isSet = true;
+                index = parseInt(index);
+                _this.currentIndex = index;
+                _this.current = element[index]
+            }
+            this.pageScroll = function(ele, Scroll, direction) {
+                if (!ele["data-sum"]) ele["data-sum"] = 0;
+                if (!ele["data-sumx"]) ele["data-sumx"] = 0;
+                ele.style.position = "relative";
+                ele.children[0].style.position = "absolute";
+                if (direction == "up") {
+                    if (ele["data-sum"] - Scroll > 0) {
+                        ele["data-sum"] = parseInt(ele["data-sum"]) - Scroll
+                    } else {
+                        ele["data-sum"] = 0
+                    }
+                    ele.children[0].style.left = "0";
+                    ele.children[0].style.top = "-" + ele["data-sum"] + "px"
+                } else if (direction == "down") {
+                    var clientHeight = ele.children[0].clientHeight;
+                    if (ele["data-sum"] + Scroll < clientHeight - ele.clientHeight / 2) {
+                        ele["data-sum"] = parseInt(ele["data-sum"]) + Scroll
+                    } else {
+                        ele["data-sum"] = clientHeight - ele.clientHeight 
+                    }
+                    ele.children[0].style.left = "0";
+                    ele.children[0].style.top = "-" + ele["data-sum"] + "px"
+                } else if (direction == "left") {
+                    if (ele["data-sumx"] - Scroll > 0) {
+                        ele["data-sumx"] = parseInt(ele["data-sumx"]) - Scroll
+                    } else {
+                        ele["data-sumx"] = clientWidth - ele.clientWidth 
+                    }
+                    ele.children[0].style.top = "0";
+                    ele.children[0].style.left = "-" + ele["data-sumx"] + "px"
+                } else if (direction == "right") {
+                    var clientWidth = ele.children[0].clientWidth;
+                    if (ele["data-sumx"] + Scroll < clientWidth - ele.clientWidth / 2) {
+                        ele["data-sumx"] = parseInt(ele["data-sum"]) + Scroll
+                    } else {
+                        ele["data-sumx"] = 0;
+                    }
+                    ele.children[0].style.top = "0";
+                    ele.children[0].style.left = "-" + ele["data-sumx"] + "px"
+                }
+            }
+            this.viewScrollY = function(y, view) {
+                var maxTop = view.children[0].clientHeight - view.clientHeight;
+                var obj = self.getCurRule();
+                var sumtop = view.children[0]["ScrollY"] ? view.children[0]["ScrollY"] : 0;
+                var top = sumtop + y;
+                middle = getBoundingClientRect(view).height / 2 - getBoundingClientRect(_this.current).height / 2;
+                top = top + middle;
+                if (top > 0 || maxTop < 0) top = 0;
+                else if (Math.abs(top) > Math.abs(maxTop)){
+                      top = -maxTop; 
+                      //view.children[0]["ScrollY"] == 0 这个句忘记干嘛的了 留着
+                }
+                top = obj["customTop"] != undefined ? obj["customTop"] : top;
+                view.children[0].style.top = top + "px";
+                view.children[0]["ScrollY"] = top
+            }
+            var maxLeft = 0;
+            this.viewScrollX = function(x, view, viewWidth) {
+                var maxLeft = viewWidth - view.clientWidth;
+                var obj = self.getCurRule();
+                var sumleft = view.children[0]["ScrollX"] ? view.children[0]["ScrollX"] : 0;
+                var left = sumleft + x;
+                middle = getBoundingClientRect(view).width / 2 - getBoundingClientRect(_this.current).width / 2;
+                left = left + middle;
+                if (left > 0 || maxLeft < 0) left = 0;
+                else if (Math.abs(left) > Math.abs(maxLeft)){
+                     left = -maxLeft;
+                }
+                left = obj["customLeft"] != undefined ? obj["customLeft"] : left;
+                view.children[0].style.left = left + "px";
+                view.children[0]["ScrollX"] = left
+            }
+            this.onPress = function(e) {
+                init.onPress.call(_this)
+            }
+            this.onEnterPress = function() {
+                init.onEnterPress.call(_this)
+            }
+            this.onBack = function() {
+                init.onBack.call(_this)
+            }
+            self.getScrollTop = function() {
+                var scrollTop = 0;
+                if (document.documentElement && document.documentElement.scrollTop) {
+                    scrollTop = document.documentElement.scrollTop
+                } else if (document.body) {
+                    scrollTop = document.body.scrollTop
+                }
+                return scrollTop
+            }
+            this.scroll = function(view,direction) {
+                var obj = self.getCurRule();
+                if (obj == undefined || !obj["direction"]) return;
+                 
+                direction=direction?direction:obj["direction"];
+                var viewX=view?view:obj["directionParentX"]?obj["directionParentX"]:obj["directionParent"]?obj["directionParent"]:_this.current.parentNode.parentNode;
+                var viewY=view?view:obj["directionParentY"]?obj["directionParentY"]:obj["directionParent"]?obj["directionParent"]:_this.current.parentNode.parentNode;
+                var sum = 0;
+                    if (direction.indexOf("x") > -1) {
+                        if(viewX instanceof Array){
+                            for (var i = 0; i < viewX.length; i++) {
+                                
+                                    if(contains(viewX[i],_this.current)){
+                                        viewX=viewX[i];
+                                    }
+                                }
+                        }
+                        
+                    if(viewX instanceof Array||!contains(viewX,_this.current))return;
+                    for (var i = 0; i < _this.hotbtn.length; i++) {
+                        sum = getBoundingClientRect(_this.hotbtn[i]).width + sum
+                    }
+                    if (_this.hotbtn.length > 1) {
+                        if(!obj["scrollWidth"])
+                        sum = sum + Math.ceil(getBoundingClientRect(_this.hotbtn[1]).left - getBoundingClientRect(_this.hotbtn[0]).right) * (_this.hotbtn.length);
+                        else{
+                            sum = _this.hotbtn.length*obj["scrollWidth"];//因为样式多样性,宽度获取并不准确 所以可以自定义
+                        }
+
+                    } else {
+                        sum = sum;
+                    }
+                    viewX.style.position = "relative";
+                    viewX.children[0].style.position = "absolute";
+                    viewX.children[0].style.width = (sum) + "px";
+                    _this.viewScrollX(-(getBoundingClientRect(_this.current).left - getBoundingClientRect(viewX).left), viewX, sum)
+                }
+                if (direction.indexOf("y") > -1) {
+                    if(viewY instanceof Array ){
+                            for (var i = 0; i < viewY.length; i++) {
+                                  
+                                    if(contains(viewY[i],_this.current)){
+                                        viewY=viewY[i];
+                                    }
+                                }
+                        }
+                     if(viewY instanceof Array||!contains(viewY,_this.current))return;
+                    viewY.style.position = "relative";
+                    viewY.children[0].style.position = "absolute";
+                    
+                    _this.viewScrollY(-(getBoundingClientRect(_this.current).top - getBoundingClientRect(viewY).top), viewY)
+                }
+            }
+            var isload = 0;
+            self.render = function(index) {
+                if (_this.renderType == "self") return;
+                isload = isload + 1;
+                if (isload == 2) {
+                    _this.sourceLength = element.length
+                }
+                if (_this.prevCurrentClass) {
+                    var ele = getClassNames(_this.prevCurrentClass, _this.target);
+                    for (var i = 0; i < ele.length; i++) {
+                        if (hasClass(ele[i], _this.prevCurrentClass)) {
+                            removeClass(ele[i], _this.prevCurrentClass)
+                        }
+                    }
+                }
+                if (element[index]) addClass(element[index], _this.currentClass);
+                else return;
+                for (var i = 0; i < element.length; i++) {
+                    if (i != index && hasClass(element[i], _this.currentClass)) {
+                        removeClass(element[i], _this.currentClass)
+                    }
+                }
+                _this.scroll();
+                var effect = element[index].getAttribute("data-effect");
+                if (effect) {
+                    focusobj.setAttribute("style", "  position: fixed; z-index: 19;width:" + (getBoundingClientRect(element[index]).width) + "px ;height:" + (getBoundingClientRect(element[index]).height) + "px; left:" + getBoundingClientRect(element[index]).left + "px;top:" + getBoundingClientRect(element[index]).top + "px;");
+                    focusobj.setAttribute("class", "focusobj current " + effect);
+                    focusobj.style.display = "list-item"
+                } else {
+                    focusobj.setAttribute("style", "");
+                    focusobj.style.display = "none"
+                }
+            }
+            self.EventUtil = {
+                add: function(obj, callback) {
+                    if (typeof(obj.onkeypress) == "null") {
+                        obj.onkeypress = function(e) {
+                            callback && callback(e)
+                        }
+                    } else {
+                        obj.onkeydown = function(e) {
+                            callback && callback(e)
+                        }
+                    }
+                }
+            }
+            var _t,sum=0;
+            EventUtil.add(document, function(e) {
+                _this.renderType = "self";
+                if(doublePress){
+                    if(sum<2)
+                     clearTimeout(_t);
+                      sum++;
+                     _t =setTimeout(function(){
+                        _self.onPressFn(e)
+                        sum=0;
+                    },100)
+                 }else{
+                    _self.onPressFn(e);
+                 }
+                
+                
+            });
+            self.overIndex = function() {
+                if (_this.currentIndex >= element.length - 1) {
+                    _this.currentIndex = element.length - 1
+                }
+                if (_this.currentIndex < 0) {
+                    _this.currentIndex = 0
+                }
+            }
+            self.isNumber = function(val) {
+                var regPos = /^\d+(\.\d+)?$/;
+                var regNeg = /^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$/;
+                if (regPos.test(val) || regNeg.test(val)) {
+                    return true
+                } else {
+                    return false
+                }
+            }
+            var distance = function(pointA, pointB, type) {
+                    var P1 = getBoundingClientRect(pointA),
+                        P2 = getBoundingClientRect(pointB);
+                    var dist = 0;
+                    switch (type) {
+                        case "AA":
+                            dist = Math.sqrt(((P1.left - P2.left) * (P1.left - P2.left)) + ((P1.top - P2.top) * (P1.top - P2.top)))
+                             break;
+                        case "AB":
+                            dist = Math.sqrt(((P1.left - P2.right) * (P1.left - P2.right)) + ((P1.top - P2.top) * (P1.top - P2.top)))
+                             break;
+                        case "AC":
+                            dist = Math.sqrt(((P1.left - P2.right) * (P1.left - P2.right)) + ((P1.top - P2.bottom) * (P1.top - P2.bottom)))
+                             break;
+                        case "AD":
+                            dist = Math.sqrt(((P1.left - P2.left) * (P1.left - P2.left)) + ((P1.top - P2.bottom) * (P1.top - P2.bottom)))
+                             break;
+                        case "BA":
+                            dist = Math.sqrt(((P1.right - P2.left) * (P1.right - P2.left)) + ((P1.top - P2.top) * (P1.top - P2.top)))
+                             break;
+                        case "BB":
+                            dist = Math.sqrt(((P1.right - P2.right) * (P1.right - P2.right)) + ((P1.top - P2.top) * (P1.top - P2.top)))
+                             break;
+                        case "BC":
+                            dist = Math.sqrt(((P1.right - P2.right) * (P1.right - P2.right)) + ((P1.top - P2.bottom) * (P1.top - P2.bottom)))
+                             break;
+                        case "BD":
+                            dist = Math.sqrt(((P1.right - P2.left) * (P1.right - P2.left)) + ((P1.top - P2.bottom) * (P1.top - P2.bottom)))
+                             break;
+                        case "CA":
+                            dist = Math.sqrt(((P1.left - P2.left) * (P1.left - P2.left)) + ((P1.bottom - P2.top) * (P1.bottom - P2.top)))
+                             break;
+                        case "CB":
+                            dist = Math.sqrt(((P1.left - P2.right) * (P1.left - P2.right)) + ((P1.bottom - P2.top) * (P1.bottom - P2.top)))
+                             break;
+                        case "CC":
+                            dist = Math.sqrt(((P1.left - P2.left) * (P1.left - P2.left)) + ((P1.bottom - P2.bottom) * (P1.bottom - P2.bottom)))
+                             break;
+                        case "CD":
+                            dist = Math.sqrt(((P1.right - P2.left) * (P1.right - P2.left)) + ((P1.bottom - P2.bottom) * (P1.bottom - P2.bottom)))
+                             break;
+                        case "DA":
+                            dist = Math.sqrt(((P1.left - P2.left) * (P1.left - P2.left)) + ((P1.bottom - P2.top) * (P1.bottom - P2.top)))
+                             break;
+                        case "DB":
+                            dist = Math.sqrt(((P1.right - P2.right) * (P1.right - P2.right)) + ((P1.bottom - P2.top) * (P1.bottom - P2.top)))
+                             break;
+                        case "DC":
+                            dist = Math.sqrt(((P1.right - P2.left) * (P1.right - P2.left)) + ((P1.bottom - P2.bottom) * (P1.bottom - P2.bottom)))
+                             break;
+                        case "DD":
+                            dist = Math.sqrt(((P1.right - P2.right) * (P1.right - P2.right)) + ((P1.bottom - P2.bottom) * (P1.bottom - P2.bottom)))
+                             break
+                    }
+                    return dist
+                }
+            self.ruleFn = function(index, direction) {
+                var obj = {};
+                if (rules) {
+                    obj = _self.getCurRule()
+                }
+                if (obj && typeof obj == "object" && typeof obj["line"] != "undefined") {
+                    var line = obj["line"]
+                } else {
+                    var line = _this.hotbtn.length
+                }
+                line = parseInt(line);
+                if (obj && typeof obj == "object" && typeof obj[_this.currentIndex] != "undefined" && typeof obj[_this.currentIndex][index] != "undefined") {
+                    var objRules = obj[_this.currentIndex];
+                    if (self.isNumber(objRules[index])) {
+                        _this.currentIndex = parseInt(_this.currentIndex) + parseInt(objRules[index])
+                    } else if (Array.isArray(objRules[index])) {
+                        _this.reSetClass(objRules[index][0], objRules[index][1], objRules[index][2])
+                    } else if (typeof objRules[index] == "function") {
+                        objRules[index].call(_this)
+                    } else if (typeof obj["line"] != "undefined") {
+                        _this.currentIndex = _this.currentIndex + line
+                    }
+                } else {
+                    var jump = element[_this.currentIndex].getAttribute("data-" + direction);
+                    jump = parseInt(jump);
+                    var max=Math.sqrt(window.screen.width*window.screen.width+window.screen.height*window.screen.height);
+                    if (direction == "up") {
+                        if (_this.currentIndex > line - 1&&!obj["autoMove"]) _this.currentIndex = jump ? _this.currentIndex - jump : _this.currentIndex - line;
+                        else if (obj && typeof obj["up"] == "object") _this.reSetClass(obj["up"][0], obj["up"][1], obj["up"][2]);
+                        else if (obj && typeof obj["up"] == "function") obj["up"].call(_this)
+                        else {
+                            var min1 = max,min2 = max,
+                                curIndex = _this.currentIndex, curIndex2 = _this.currentIndex;
+                            for (var i = 0; i < _this.hotbtn.length; i++) {
+                                var cur1 = distance(_this.current, _this.hotbtn[i], "AD");
+                                var cur2 = distance(_this.current, _this.hotbtn[i], "BC");
+                                if (cur1 < min1 && cur1 > 0 && getBoundingClientRect(_this.current).top > getBoundingClientRect(_this.hotbtn[i]).top && _this.currentIndex > i) {
+                                    min1 = cur1;
+                                    curIndex = i;
+                                }
+
+                                if (cur2 < min2 && cur2 > 0 && getBoundingClientRect(_this.current).top > getBoundingClientRect(_this.hotbtn[i]).top  && _this.currentIndex > i) {
+                                    min2 = cur2;
+                                    curIndex2 = i;
+                                }
+                            }
+                            curIndex=min1<min2?curIndex:curIndex2;
+                            _this.currentIndex = curIndex;
+                        }
+                    } else if (direction == "left") {
+                        if ((_this.currentIndex) % line != 0&&!obj["autoMove"]) _this.currentIndex = jump ? _this.currentIndex - jump : _this.currentIndex - 1;
+                        else if (obj && typeof obj["left"] == "object") _this.reSetClass(obj["left"][0], obj["left"][1], obj["left"][2]);
+                        else if (obj && typeof obj["left"] == "function") obj["left"].call(_this)
+                        else {
+                            var min1 = max,min2 = max
+                                curIndex = _this.currentIndex,curIndex2 = _this.currentIndex;
+                            for (var i = 0; i < _this.hotbtn.length; i++) {
+                                var cur1 = distance(_this.current, _this.hotbtn[i], "AB");
+                                var cur2 = distance(_this.current, _this.hotbtn[i], "DC");
+                                if (cur1 < min1 && cur1 > 0 && getBoundingClientRect(_this.current).left > getBoundingClientRect(_this.hotbtn[i]).left  && _this.currentIndex > i) {
+                                    min1 = cur1;
+                                    curIndex = i;
+                                }
+
+                                if (cur2 < min2 && cur2 > 0 && getBoundingClientRect(_this.current).left > getBoundingClientRect(_this.hotbtn[i]).left  && _this.currentIndex > i) {
+                                    min2 = cur2;
+                                    curIndex2 = i;
+                                }
+                            }
+                            curIndex=min1<min2?curIndex:curIndex2;
+                            _this.currentIndex = curIndex
+                        }
+                    } else if (direction == "right") {
+                        if ((_this.currentIndex + 1) % line != 0&&!obj["autoMove"]) _this.currentIndex = jump ? _this.currentIndex + jump : _this.currentIndex + 1;
+                        else if (obj && typeof obj["right"] == "object") _this.reSetClass(obj["right"][0], obj["right"][1], obj["right"][2]);
+                        else if (obj && typeof obj["right"] == "function") obj["right"].call(_this)
+                        else {
+                            var min1 = max,min2 = max,
+                                curIndex = _this.currentIndex,curIndex2 = _this.currentIndex;
+                            for (var i = 0; i < _this.hotbtn.length; i++) {
+                                var cur1 = distance(_this.current, _this.hotbtn[i], "BA");
+                                var cur2 = distance(_this.current, _this.hotbtn[i], "CD");
+
+                                if (cur1 < min1 && cur1 > 0 && getBoundingClientRect(_this.current).right< getBoundingClientRect(_this.hotbtn[i]).right  && _this.currentIndex < i) {
+                                    min1 = cur1;
+                                     curIndex = i;
+                                }
+
+                                if (cur2 < min2 && cur2 > 0 && getBoundingClientRect(_this.current).right < getBoundingClientRect(_this.hotbtn[i]).right  && _this.currentIndex < i) {
+                                    min2 = cur2;
+                                    
+                                    curIndex2 = i;
+                                }
+                            }
+                            curIndex=min1<min2?curIndex:curIndex2;
+                            _this.currentIndex = curIndex;
+                        }
+                    } else if (direction == "down") {
+                        if (_this.hotbtn.length - line > _this.currentIndex&&!obj["autoMove"]) _this.currentIndex = jump ? _this.currentIndex + jump : _this.currentIndex + line;
+                        else if (obj && typeof obj["down"] == "object") _this.reSetClass(obj["down"][0], obj["down"][1], obj["down"][2]);
+                        else if (obj && typeof obj["down"] == "function") obj["down"].call(_this);
+                        else if (_this.currentIndex + line > _this.hotbtn.length - 1 && _this.currentIndex + line <= (line - _this.hotbtn.length % line) + _this.hotbtn.length - 1 && _this.hotbtn.length % line != 0 && isFloatLast) {
+                            _this.currentIndex = _this.currentIndex + line;
+                            self.overIndex()
+                        } else {
+                            var min1 = max,min2=max,
+                                curIndex = _this.currentIndex,curIndex2=_this.currentIndex;
+                            for (var i = 0; i < _this.hotbtn.length; i++) {
+                                var cur1 = distance(_this.current, _this.hotbtn[i], "DA");
+                                var cur2 = distance(_this.current, _this.hotbtn[i], "CB");
+                                if (cur1 < min1 && cur1>0&&getBoundingClientRect(_this.current).bottom < getBoundingClientRect(_this.hotbtn[i]).bottom&&_this.currentIndex < i) {
+                                    min1 = cur1;
+                                    curIndex = i;
+                                }
+                                if (cur2 < min2 &&cur2>0&& getBoundingClientRect(_this.current).bottom < getBoundingClientRect(_this.hotbtn[i]).bottom&&_this.currentIndex < i) {
+                                    min2 = cur2;
+                                    curIndex2 = i;
+                                }
+                            }
+                            
+                             curIndex=min1<min2?curIndex:curIndex2;
+                            _this.currentIndex = curIndex;
+                        }
+                    }
+                }
+            }
+            self.rule = function(keyCode) {
+                if (element.length <= 0) {
+                    console.log("初始化" + _this.className + "失败");
+                    return
+                }
+                self.overIndex();
+                if (keyCode == btnLeft) {
+                    self.ruleFn(0, "left")
+                } else if (keyCode == btnRight) {
+                    self.ruleFn(2, "right")
+                } else if (keyCode == btnUp) {
+                    self.ruleFn(1, "up")
+                } else if (keyCode == btnDown) {
+                    self.ruleFn(3, "down")
+                }
+                self.overIndex()
+            }
+            this.BACK = function() {
+                self.onPressFn("back")
+            }
+            this.LEFT = function() {
+                self.onPressFn("left")
+            }
+            this.RIGHT = function() {
+                self.onPressFn("right")
+            }
+            this.UP = function() {
+                self.onPressFn("up")
+            }
+            this.DOWN = function() {
+                self.onPressFn("down")
+            }
+            this.onPressRules = function(e) {
+                var keyCode = "";
+                if (typeof e == "object") {
+                    keyCode = e.keyCode
+                } else {
+                    if (e == "left") {
+                        keyCode = btnLeft
+                    } else if (e == "right") {
+                        keyCode = btnRight
+                    } else if (e == "up") {
+                        keyCode = btnUp
+                    } else if (e == "down") {
+                        keyCode = btnDown
+                    } else if (e == "back") {
+                        keyCode = btnBack
+                    }
+                }
+                _this.event = e;
+                _this.currentIndex = _this.currentIndex >= element.length - 1 ? element.length - 1 : _this.currentIndex;
+                _this.prev = element[_this.currentIndex];
+                _this.prevIndex = _this.currentIndex;
+                self.rule(keyCode);
+                _this.current = element[_this.currentIndex];
+                _this.currentIndex = _this.currentIndex;
+                _this.className = _this.className;
+                _this.onCommPress.call(_this);
+                if (keyCode == 8 || keyCode == btnBack) {
+                    if (rules["#" + _this.currentId + ">." + _this.className] && (typeof rules["#" + _this.currentId + ">." + _this.className]["onBack"]) == "function") rules["#" + _this.currentId + ">." + _this.className]["onBack"].call(_this);
+                    else if (rules[_this.className] && (typeof rules[_this.className]["onBack"]) == "function") rules[_this.className]["onBack"].call(_this);
+                    else _this.onBack.call(_this)
+                }
+                if (rules && rules["#" + _this.currentId + ">." + _this.className] && (typeof rules["#" + _this.currentId + ">." + _this.className]["onPress"]) == "function") init.rules["#" + _this.currentId + ">." + _this.className]["onPress"].call(_this);
+                else if (rules && rules[_this.className] && (typeof rules[_this.className]["onPress"]) == "function") init.rules[_this.className]["onPress"].call(_this);
+                else _this.onPress.call(_this);
+                if (keyCode == btnEnter) {
+                    if (rules["#" + _this.currentId + ">." + _this.className] && (typeof rules["#" + _this.currentId + ">." + _this.className]["onEnterPress"]) == "function") rules["#" + _this.currentId + ">." + _this.className]["onEnterPress"].call(_this);
+                    else if (rules[_this.className] && (typeof rules[_this.className]["onEnterPress"]) == "function") rules[_this.className]["onEnterPress"].call(_this);
+                    else _this.onEnterPress.call(_this)
+                }
+                _this.renderType = "";
+                _self.render(_this.currentIndex);
+                keydefault(e)
+            }
+            this.onLoad()
+        }
+    window.tvSysBtnBind = tvSysBtnBind
+})(window)

+ 65 - 0
活动模板/css/index.css

@@ -0,0 +1,65 @@
+/*初始化*/
+* {
+  margin: 0;
+  padding: 0;
+}
+html {
+  -webkit-text-size-adjust: 100%;
+  -ms-text-size-adjust: 100%;
+  font-size: 20px;
+  width: 1280px;
+  height: 720px;
+}
+body {
+  width: 1280px;
+  height: 720px;
+  background: transparent;
+  background-size: 1280px 720px;
+  font-size: 0.14rem;
+  font-family: 'Microsoft Yahei;Arial';
+  white-space: normal;
+  table-layout: fixed;
+  word-wrap: break-word;
+  -webkit-overflow-scrolling: touch;
+}
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+em,
+b,
+i {
+  font-style: normal;
+}
+ol,
+ul,
+li {
+  list-style: none;
+}
+fieldset,
+img,
+abbr,
+acronym {
+  border: 0;
+}
+input,
+select {
+  vertical-align: middle;
+  -webkit-appearance: none;
+}
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-weight: normal;
+}
+q:before,
+q:after {
+  content: '';
+}
+a,
+a:hover {
+  text-decoration: none;
+}

+ 75 - 0
活动模板/css/index.less

@@ -0,0 +1,75 @@
+/*初始化*/
+* {
+    margin: 0;
+    padding: 0;
+}
+
+html {
+    -webkit-text-size-adjust: 100%;
+    -ms-text-size-adjust: 100%;
+    font-size: 20px;
+    width: 1280px;
+    height: 720px;
+}
+
+body {
+    width: 1280px;
+    height: 720px;
+    background: transparent;
+    background-size: 1280px 720px;
+    font-size: .14rem;
+    font-family: 'Microsoft Yahei;Arial';
+    white-space: normal;
+    table-layout: fixed;
+    word-wrap: break-word;
+    -webkit-overflow-scrolling: touch;
+}
+
+table {
+    border-collapse: collapse;
+    border-spacing: 0;
+}
+
+em,
+b,
+i {
+    font-style: normal;
+}
+
+ol,
+ul,
+li {
+    list-style: none;
+}
+
+fieldset,
+img,
+abbr,
+acronym {
+    border: 0;
+}
+
+input,
+select {
+    vertical-align: middle;
+    -webkit-appearance: none;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+    font-weight: normal;
+}
+
+q:before,
+q:after {
+    content: '';
+}
+
+a,
+a:hover {
+    text-decoration: none;
+}

+ 78 - 0
活动模板/index.html

@@ -0,0 +1,78 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="utf-8">
+    <meta name="page-view-size" content="1280*720" />
+    <link rel="stylesheet" type="text/css" href="css/index.css" />
+    <title>活动题目</title>
+</head>
+
+<body>
+    <!-- 首页 -->
+    <div class="home">
+
+    </div>
+
+    <!-- 题目 -->
+    <div class="subjects">
+
+    </div>
+
+    <!-- 各种弹窗 -->
+    <div class="popups">
+
+    </div>
+</body>
+<!-- 各地区需要引入的js -->
+
+<!-- 本活动用js -->
+<script type="text/javascript" src="js/tvSysBtnBind.v2.1.js"></script>
+<script type="text/javascript" src="js/common.js"></script>
+<script type="text/javascript" src="js/api.js"></script>
+<script>
+    // 焦点移动插件的配置
+    tsConfig = {
+        className: '',
+        currentIndex: 0,
+        rules: {
+
+        },
+        onEnterPress: function () {
+
+        },
+        onBack: function () {
+            backRule()
+        },
+        onPress: function () {
+
+        }
+    }
+    
+    // 切换窗口,并指定焦点移动位置,支持关闭所有窗口,支持同时打开另一个界面
+    function changeWindow(id, className, currentIndex, id2) {
+        var popups = document.getElementsByClassName('popup')
+        for (var i = 0; i < popups.length; i++) {
+            popups[i].style.display = 'none'
+        }
+        if (id) {
+            document.getElementById(id).style.display = 'block'
+        }
+        if (id2) {
+            document.getElementById(id2).style.display = 'block'
+        }
+        if (className) {
+            btn.reSetClass(className, currentIndex)
+        }
+    }
+    
+    // 返回方法
+    function backRule() {
+
+    }
+
+    btn = new tvSysBtnBind(tsConfig)
+    window.onBackEvent = backRule
+</script>
+
+</html>

+ 24 - 0
活动模板/js/api.js

@@ -0,0 +1,24 @@
+// 活动请求接口
+var actApi = {
+    data: {
+        act_id: 0,
+        uid: 12138,
+        baseUrl: '', // 公用地址
+        // ↓其他接口的地址
+        
+    },
+
+    portsTemplate: function() {
+        return new MyPromise(function(resolve, reject) {
+            comm.ajax({
+                type: 'GET',
+                url: actApi.data.baseUrl + '',
+                data: {
+
+                },
+                success: function() { resolve() }
+            })
+        })
+    }
+    
+}

File diff suppressed because it is too large
+ 832 - 0
活动模板/js/common.js


+ 877 - 0
活动模板/js/tvSysBtnBind.v2.1.js

@@ -0,0 +1,877 @@
+try {
+    (function(arr) {
+        arr.forEach(function(item) {
+            if (item.hasOwnProperty('remove')) {
+                return
+            }
+            Object.defineProperty(item, 'remove', {
+                configurable: true,
+                enumerable: true,
+                writable: true,
+                value: function remove() {
+                    this.parentNode.removeChild(this)
+                }
+            })
+        })
+    })([Element.prototype, CharacterData.prototype, DocumentType.prototype]);
+    if (!("classList" in document.documentElement)) {
+        Object.defineProperty(HTMLElement.prototype, 'classList', {
+            get: function() {
+                var self = this;
+
+                function update(fn) {
+                    return function(value) {
+                        var classes = self.className.split(/\s+/g),
+                            index = classes.indexOf(value);
+                        fn(classes, index, value);
+                        self.className = classes.join(" ")
+                    }
+                }
+                return {
+                    add: update(function(classes, index, value) {
+                        if (!~index) classes.push(value)
+                    }),
+                    remove: update(function(classes, index) {
+                        if (~index) classes.splice(index, 1)
+                    }),
+                    toggle: update(function(classes, index, value) {
+                        if (~index) classes.splice(index, 1);
+                        else classes.push(value)
+                    }),
+                    contains: function(value) {
+                        return !!~self.className.split(/\s+/g).indexOf(value)
+                    },
+                    item: function(i) {
+                        return self.className.split(/\s+/g)[i] || null
+                    }
+                }
+            }
+        })
+    }
+    function fireKeyEvent(el, evtType, keyCode) {
+        var doc = el.ownerDocument,
+            win = doc.defaultView || doc.parentWindow,
+            evtObj;
+        if (doc.createEvent) {
+            if (win.KeyEvent) {
+                evtObj = doc.createEvent('KeyEvents');
+                evtObj.initKeyEvent(evtType, true, true, win, false, false, false, false, keyCode, 0)
+            } else {
+                evtObj = doc.createEvent('UIEvents');
+                Object.defineProperty(evtObj, 'keyCode', {
+                    get: function() {
+                        return this.keyCodeVal
+                    }
+                });
+                Object.defineProperty(evtObj, 'which', {
+                    get: function() {
+                        return this.keyCodeVal
+                    }
+                });
+                evtObj.initUIEvent(evtType, true, true, win, 1);
+                evtObj.keyCodeVal = keyCode;
+                if (evtObj.keyCode !== keyCode) {}
+            }
+            el.dispatchEvent(evtObj)
+        } else if (doc.createEventObject) {
+            evtObj = doc.createEventObject();
+            evtObj.keyCode = keyCode;
+            el.fireEvent('on' + evtType, evtObj)
+        }
+    }
+} catch (e) {}
+function addClass(ele, cls) {
+    if (ele.classList) {
+        ele.classList.add(cls)
+    } else {
+        if (!this.hasClass(ele, cls)) ele.className += " " + cls
+    }
+}
+function arrIndexOf(arr, v) {
+    for (var i = 0; i < arr.length; i++) {
+        if (arr[i] == v) {
+            return i
+        }
+    }
+    return -1
+}
+function removeClass(ele, cls) {
+    if (ele.classList) {
+        ele.classList.remove(cls)
+    } else {
+        if (ele.className != '' && hasClass(ele, cls)) {
+            var arrClassName = ele.className.split(' ');
+            var classIndex = arrIndexOf(arrClassName, cls);
+            if (classIndex !== -1) {
+                arrClassName.splice(classIndex, 1);
+                ele.className = arrClassName.join(' ')
+            }
+        }
+    }
+}
+function toggleClass(ele, cls) {
+    if (hasClass(ele, cls)) {
+        removeClass(ele, cls)
+    } else {
+        addClass(ele, cls)
+    }
+}
+function hasClass(element, cls) {
+    return (' ' + element.className + ' ').indexOf(' ' + cls + ' ') > -1
+}
+function getClassNames(classStr, target, tagName) {
+    target = target ? target : document;
+    tagName = tagName ? tagName : "*";
+    if (document.getElementsByClassName) {
+        return target.getElementsByClassName(classStr)
+    } else {
+        var nodes = target.getElementsByTagName(tagName),
+            ret = [];
+        for (i = 0; i < nodes.length; i++) {
+            if (hasClass(nodes[i], classStr)) {
+                ret.push(nodes[i])
+            }
+        }
+        return ret
+    }
+}
+function getElementLeft(ele) {
+    var actualLeft = ele.offsetLeft;
+    var current = ele.offsetParent;
+    while (current !== null) {
+        actualLeft += current.offsetLeft;
+        current = current.offsetParent
+    }
+    return actualLeft
+}
+function getElementTop(ele) {
+    var actualTop = ele.offsetTop;
+    var current = ele.offsetParent;
+    while (current !== null) {
+        actualTop += current.offsetTop;
+        current = current.offsetParent
+    }
+    return actualTop
+}
+var contains = document.documentElement.contains ? function(parent, node) { 
+        if(parent){
+            return parent !== node && parent.contains(node)
+        }
+        
+      } : function(parent, node) {
+        if(parent){
+            while (node && (node = node.parentNode))
+          if (node === parent) return true
+            return false
+        }
+        
+      }
+function getBoundingClientRect(ele) {
+    var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
+    var scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft;
+    if (ele.getBoundingClientRect) {
+        if (typeof arguments.callee.offset !== 'number') {
+            var temp = document.createElement('div');
+            temp.style.cssText = "position:absolute;top:0;left:0";
+            document.body.appendChild(temp);
+            arguments.callee.offset = -temp.getBoundingClientRect().top - scrollTop;
+            document.body.removeChild(temp);
+            temp = null
+        }
+        var rect = ele.getBoundingClientRect();
+        var offset = arguments.callee.offset;
+        return {
+            left: rect.left + offset,
+            right: rect.right + offset,
+            top: rect.top + offset,
+            bottom: rect.bottom + offset,
+            width: (rect.right + offset) - (rect.left + offset),
+            height: (rect.bottom + offset) - (rect.top + offset)
+        }
+    } else {
+        var actualLeft = getElementLeft(ele);
+        var actualTop = getElementTop(ele);
+        var offsetWidth = ele.offsetWidth;
+        var offsetHeight = ele.offsetHeight;
+        return {
+            left: actualLeft - scrollLeft,
+            right: actualLeft + offsetWidth - scrollLeft,
+            top: actualTop - scrollTop,
+            bottom: actualTop + offsetHeight - scrollTop,
+            width: (actualLeft + offsetWidth - scrollLeft) - (actualLeft - scrollLeft),
+            height: (actualTop + offsetHeight - scrollTop) - (actualTop - scrollTop)
+        }
+    }
+}
+
+(function(window) {
+    var tvSysBtnBind = function(init) {
+            var _this = this,
+                _self = self;
+            var id = init.id ? init.id : null,
+                keyRemoveDefault = typeof init.keyRemoveDefault == "undefined" ? false : init.keyRemoveDefault,
+                currentIndex = init.currentIndex ? parseInt(init.currentIndex) : 0,
+                btnLeft = init.btnLeft ? init.btnLeft : 37,
+                btnUp = init.btnUp ? init.btnUp : 38,
+                btnRight = init.btnRight ? init.btnRight : 39,
+                btnDown = init.btnDown ? init.btnDown : 40,
+                btnEnter = init.btnEnter ? init.btnEnter : 13,
+                btnBack = init.btnBack ? init.btnBack : 27,
+                history = typeof init.history == "undefined" ? true : init.history,
+                doublePress = typeof init.doublePress == "undefined" ? false : init.doublePress,
+                isFloatLast = typeof init.isFloatLast == "undefined" ? false : init.isFloatLast,
+                isCentered = typeof init.isCentered == "undefined" ? true : init.isCentered,
+                currentClass = init.currentClass ? init.currentClass : "current",
+                effect = init.effect ? init.effect : "slide1",
+                element = new Array(),
+                rules = init.rules?init.rules:{hotbutton:{}},
+                direction = "y";
+            _this.className = init.className ? init.className : "hotbutton";
+            this.event = {};
+            var _tempElem;
+            this.currentIndex = parseInt(currentIndex);
+            this.defaultIndex = parseInt(currentIndex);
+            this.currentClass = currentClass;
+            this.historyFocus = {};
+            if (!window.focusobj) window.focusobj = document.createElement("span");
+            (typeof init.onLoad) == "function" ? init.onLoad : init.onLoad = function() {};
+            (typeof init.onBack) == "function" ? init.onLoad : init.onBack = function() {};
+            (typeof init.onCommPress) == "function" ? init.onCommPress : init.onCommPress = function() {};
+            this.onLoad = function() {
+                focusobj.innerHTML = '<div class="cssbk"><b class="lt"></b><b class="t"></b><b class="rt"></b><b class="r"></b><b class="rb"></b><b class="b"></b><b class="lb"></b> <b class="l"></b></div>';
+                addClass(focusobj, "focusobj");
+                addClass(focusobj, "current");
+                focusobj.style.display = "none";
+                _this.target = init.id ? document.getElementById(init.id) : document.body;
+                _this.defaultTarget = _this.target;
+                _this.currentId = init.id ? init.id : "Jdoc";
+                self.getCurRule();
+                _this.reLoad();
+                self.onPressFn = _this.onPressRules
+                _this.sourceClassName = _this.className;
+                _this.sourceLength = element.length;
+                _this.prev = element[currentIndex];
+                _this.prevIndex = currentIndex;
+                _this.current = element[currentIndex];
+                _this.currentIndex = currentIndex;
+                _this.target.appendChild(focusobj);
+                init.onLoad.call(_this);
+                window.focus();
+            }
+            self.getCurRule = function(item) {
+                var obj = {};
+                if (rules) {
+                    obj = rules["#" + _this.currentId + ">." + _this.className];
+                    if (typeof obj == "undefined") {
+                        if (rules[_this.className]) {
+                            obj = rules[_this.className]
+                        }
+                    }
+                    if (item && typeof rules[item] == "undefined") {
+                       // rules[item]={};
+                    }
+                }
+                return obj
+            }
+            this.reSetClass = function(item, index, curClass) {
+                var obj = _self.getCurRule(item);
+                if (!obj) {
+                    console.log("初始化" + _this.className + "失败");
+                    return
+                }
+                if (typeof obj["history"] == "undefined") obj["history"] = history;
+                if (obj["history"]) _this.historyFocus[_this.currentId + _this.className] = _this.currentIndex;
+                _this.prevCurrentClass = _this.currentClass;
+                if (curClass) {
+                    _this.currentClass = curClass
+                }
+                var arr = item.split(">");
+                for (var i = 0; i < arr.length; i++) {
+                    if (arr[i] == "") arr.splice(i)
+                }
+                for (var i = 0; i < arr.length; i++) {
+                    if (arr[i].indexOf("#") != -1) {
+                        _this.currentId = arr[i].replace("#", "");
+                        if (document.getElementById(_this.currentId)) _this.target = document.getElementById(_this.currentId)
+                    }
+                    if (arr[i].indexOf(".") != -1) {
+                        item = arr[i].replace(".", "")
+                    }
+                    if (arr[i].indexOf(".") == -1 && arr[i].indexOf("#") == -1) {
+                        item = arr[i]
+                    }
+                }
+                if (getClassNames(item, _this.target).length > 0) {
+                    _self.newItem(item, index)
+                } else {
+                    _this.target = _this.defaultTarget;
+                    if (getClassNames(item, _this.target).length > 0) _self.newItem(item, index)
+                }
+            }
+            this.onCommPress = function(e) {
+                init.onCommPress.call(_this)
+            }
+            this.tsClose = function () {
+                self.onPressFn = function(e){
+                    e.preventDefault()
+                    return
+                }
+            }
+            this.tsOpen = function () {
+                self.onPressFn = this.onPressRules
+            }
+            self.newItem = function(item, index) {
+                var obj = _self.getCurRule();
+                if (_this.prev) removeClass(_this.prev, _this.currentClass);
+                if (typeof _this.historyFocus[_this.currentId + item] == "undefined") _this.historyFocus[_this.currentId + item] = 0;
+                _this.className = item;
+                var idx = obj["savelastIndex"] ? _this.currentIndex : 0;
+                index = index > getClassNames(item, _this.target).length - 1 ? getClassNames(item, _this.target).length - 1 : index;
+                idx = _this.historyFocus[_this.currentId + item] ? _this.historyFocus[_this.currentId + item] : idx;
+                _this.currentIndex = typeof index != "undefined" ? index : idx;
+                _this.prevIndex = _this.currentIndex;
+                _this.reLoad()
+            }
+            self.readFn = function() {
+                if ((typeof init.onEnterPress) == "function") {
+                    init.onEnterPress
+                } else {
+                    init.onEnterPress = function() {}
+                }
+                if ((typeof init.onPress) == "function") {
+                    init.onPress
+                } else {
+                    init.onPress = function() {}
+                }
+            }
+            this.reLoad = function() {
+                self.readFn();
+                element = getClassNames(_this.className, _this.target);
+                if (element.length <= 0) {
+                    console.log("初始化" + _this.className + "失败");
+                    return
+                }
+                this.hotbtn = element;
+                if (element.length <= 0) return false;
+                if (_this.currentIndex || _this.currentIndex == 0) {
+                    _this.currentIndex = parseInt(_this.currentIndex)
+                } else {
+                    _this.currentIndex = parseInt(init.currentIndex)
+                }
+                if (isload >= 2 && _this.sourceClass == _this.className && _this.sourceLength != element.length && !isSet) {
+                    if (hasClass(_this.prev, _this.className) && _this.sourceLength > element.length) {
+                        _this.currentIndex = _this.currentIndex - (_this.sourceLength - element.length);
+                        _this.prevIndex = _this.prevIndex - (_this.sourceLength - element.length);
+                        _this.sourceLength = element.length
+                    } else if (hasClass(_this.prev, _this.className) && _this.sourceLength < element.length) {
+                        _this.currentIndex = _this.currentIndex + (element.length - _this.sourceLength);
+                        _this.prevIndex = _this.prevIndex + (element.length - _this.sourceLength);
+                        _this.sourceLength = element.length
+                    }
+                }
+                isSet = false;
+                self.overIndex();
+                _this.current = element[_this.currentIndex];
+                _this.currentIndex = _this.currentIndex;
+                _self.render(_this.currentIndex);
+                for (var i = 0; i < this.hotbtn.length; i++) {
+                    this.hotbtn[i].setAttribute("data-id", i)
+                }
+            }
+            function keydefault(e) {
+                try {
+                    e.preventDefault()
+                } catch (e) {}
+            }
+            var isSet = false;
+            this.setCurrentIndex = function(index) {
+                isSet = true;
+                index = parseInt(index);
+                _this.currentIndex = index;
+                _this.current = element[index]
+            }
+            this.pageScroll = function(ele, Scroll, direction) {
+                if (!ele["data-sum"]) ele["data-sum"] = 0;
+                if (!ele["data-sumx"]) ele["data-sumx"] = 0;
+                ele.style.position = "relative";
+                ele.children[0].style.position = "absolute";
+                if (direction == "up") {
+                    if (ele["data-sum"] - Scroll > 0) {
+                        ele["data-sum"] = parseInt(ele["data-sum"]) - Scroll
+                    } else {
+                        ele["data-sum"] = 0
+                    }
+                    ele.children[0].style.left = "0";
+                    ele.children[0].style.top = "-" + ele["data-sum"] + "px"
+                } else if (direction == "down") {
+                    var clientHeight = ele.children[0].clientHeight;
+                    if (ele["data-sum"] + Scroll < clientHeight - ele.clientHeight / 2) {
+                        ele["data-sum"] = parseInt(ele["data-sum"]) + Scroll
+                    } else {
+                        ele["data-sum"] = clientHeight - ele.clientHeight 
+                    }
+                    ele.children[0].style.left = "0";
+                    ele.children[0].style.top = "-" + ele["data-sum"] + "px"
+                } else if (direction == "left") {
+                    if (ele["data-sumx"] - Scroll > 0) {
+                        ele["data-sumx"] = parseInt(ele["data-sumx"]) - Scroll
+                    } else {
+                        ele["data-sumx"] = clientWidth - ele.clientWidth 
+                    }
+                    ele.children[0].style.top = "0";
+                    ele.children[0].style.left = "-" + ele["data-sumx"] + "px"
+                } else if (direction == "right") {
+                    var clientWidth = ele.children[0].clientWidth;
+                    if (ele["data-sumx"] + Scroll < clientWidth - ele.clientWidth / 2) {
+                        ele["data-sumx"] = parseInt(ele["data-sum"]) + Scroll
+                    } else {
+                        ele["data-sumx"] = 0;
+                    }
+                    ele.children[0].style.top = "0";
+                    ele.children[0].style.left = "-" + ele["data-sumx"] + "px"
+                }
+            }
+            this.viewScrollY = function(y, view) {
+                var maxTop = view.children[0].clientHeight - view.clientHeight;
+                var obj = self.getCurRule();
+                var sumtop = view.children[0]["ScrollY"] ? view.children[0]["ScrollY"] : 0;
+                var top = sumtop + y;
+                middle = getBoundingClientRect(view).height / 2 - getBoundingClientRect(_this.current).height / 2;
+                top = top + middle;
+                if (top > 0 || maxTop < 0) top = 0;
+                else if (Math.abs(top) > Math.abs(maxTop)){
+                      top = -maxTop; 
+                      //view.children[0]["ScrollY"] == 0 这个句忘记干嘛的了 留着
+                }
+                top = obj["customTop"] != undefined ? obj["customTop"] : top;
+                view.children[0].style.top = top + "px";
+                view.children[0]["ScrollY"] = top
+            }
+            var maxLeft = 0;
+            this.viewScrollX = function(x, view, viewWidth) {
+                var maxLeft = viewWidth - view.clientWidth;
+                var obj = self.getCurRule();
+                var sumleft = view.children[0]["ScrollX"] ? view.children[0]["ScrollX"] : 0;
+                var left = sumleft + x;
+                middle = getBoundingClientRect(view).width / 2 - getBoundingClientRect(_this.current).width / 2;
+                left = left + middle;
+                if (left > 0 || maxLeft < 0) left = 0;
+                else if (Math.abs(left) > Math.abs(maxLeft)){
+                     left = -maxLeft;
+                }
+                left = obj["customLeft"] != undefined ? obj["customLeft"] : left;
+                view.children[0].style.left = left + "px";
+                view.children[0]["ScrollX"] = left
+            }
+            this.onPress = function(e) {
+                init.onPress.call(_this)
+            }
+            this.onEnterPress = function() {
+                init.onEnterPress.call(_this)
+            }
+            this.onBack = function() {
+                init.onBack.call(_this)
+            }
+            self.getScrollTop = function() {
+                var scrollTop = 0;
+                if (document.documentElement && document.documentElement.scrollTop) {
+                    scrollTop = document.documentElement.scrollTop
+                } else if (document.body) {
+                    scrollTop = document.body.scrollTop
+                }
+                return scrollTop
+            }
+            this.scroll = function(view,direction) {
+                var obj = self.getCurRule();
+                if (obj == undefined || !obj["direction"]) return;
+                 
+                direction=direction?direction:obj["direction"];
+                var viewX=view?view:obj["directionParentX"]?obj["directionParentX"]:obj["directionParent"]?obj["directionParent"]:_this.current.parentNode.parentNode;
+                var viewY=view?view:obj["directionParentY"]?obj["directionParentY"]:obj["directionParent"]?obj["directionParent"]:_this.current.parentNode.parentNode;
+                var sum = 0;
+                    if (direction.indexOf("x") > -1) {
+                        if(viewX instanceof Array){
+                            for (var i = 0; i < viewX.length; i++) {
+                                
+                                    if(contains(viewX[i],_this.current)){
+                                        viewX=viewX[i];
+                                    }
+                                }
+                        }
+                        
+                    if(viewX instanceof Array||!contains(viewX,_this.current))return;
+                    for (var i = 0; i < _this.hotbtn.length; i++) {
+                        sum = getBoundingClientRect(_this.hotbtn[i]).width + sum
+                    }
+                    if (_this.hotbtn.length > 1) {
+                        if(!obj["scrollWidth"])
+                        sum = sum + Math.ceil(getBoundingClientRect(_this.hotbtn[1]).left - getBoundingClientRect(_this.hotbtn[0]).right) * (_this.hotbtn.length);
+                        else{
+                            sum = _this.hotbtn.length*obj["scrollWidth"];//因为样式多样性,宽度获取并不准确 所以可以自定义
+                        }
+
+                    } else {
+                        sum = sum;
+                    }
+                    viewX.style.position = "relative";
+                    viewX.children[0].style.position = "absolute";
+                    viewX.children[0].style.width = (sum) + "px";
+                    _this.viewScrollX(-(getBoundingClientRect(_this.current).left - getBoundingClientRect(viewX).left), viewX, sum)
+                }
+                if (direction.indexOf("y") > -1) {
+                    if(viewY instanceof Array ){
+                            for (var i = 0; i < viewY.length; i++) {
+                                  
+                                    if(contains(viewY[i],_this.current)){
+                                        viewY=viewY[i];
+                                    }
+                                }
+                        }
+                     if(viewY instanceof Array||!contains(viewY,_this.current))return;
+                    viewY.style.position = "relative";
+                    viewY.children[0].style.position = "absolute";
+                    
+                    _this.viewScrollY(-(getBoundingClientRect(_this.current).top - getBoundingClientRect(viewY).top), viewY)
+                }
+            }
+            var isload = 0;
+            self.render = function(index) {
+                if (_this.renderType == "self") return;
+                isload = isload + 1;
+                if (isload == 2) {
+                    _this.sourceLength = element.length
+                }
+                if (_this.prevCurrentClass) {
+                    var ele = getClassNames(_this.prevCurrentClass, _this.target);
+                    for (var i = 0; i < ele.length; i++) {
+                        if (hasClass(ele[i], _this.prevCurrentClass)) {
+                            removeClass(ele[i], _this.prevCurrentClass)
+                        }
+                    }
+                }
+                if (element[index]) addClass(element[index], _this.currentClass);
+                else return;
+                for (var i = 0; i < element.length; i++) {
+                    if (i != index && hasClass(element[i], _this.currentClass)) {
+                        removeClass(element[i], _this.currentClass)
+                    }
+                }
+                _this.scroll();
+                var effect = element[index].getAttribute("data-effect");
+                if (effect) {
+                    focusobj.setAttribute("style", "  position: fixed; z-index: 19;width:" + (getBoundingClientRect(element[index]).width) + "px ;height:" + (getBoundingClientRect(element[index]).height) + "px; left:" + getBoundingClientRect(element[index]).left + "px;top:" + getBoundingClientRect(element[index]).top + "px;");
+                    focusobj.setAttribute("class", "focusobj current " + effect);
+                    focusobj.style.display = "list-item"
+                } else {
+                    focusobj.setAttribute("style", "");
+                    focusobj.style.display = "none"
+                }
+            }
+            self.EventUtil = {
+                add: function(obj, callback) {
+                    if (typeof(obj.onkeypress) == "null") {
+                        obj.onkeypress = function(e) {
+                            callback && callback(e)
+                        }
+                    } else {
+                        obj.onkeydown = function(e) {
+                            callback && callback(e)
+                        }
+                    }
+                }
+            }
+            var _t,sum=0;
+            EventUtil.add(document, function(e) {
+                _this.renderType = "self";
+                if(doublePress){
+                    if(sum<2)
+                     clearTimeout(_t);
+                      sum++;
+                     _t =setTimeout(function(){
+                        _self.onPressFn(e)
+                        sum=0;
+                    },100)
+                 }else{
+                    _self.onPressFn(e);
+                 }
+                
+                
+            });
+            self.overIndex = function() {
+                if (_this.currentIndex >= element.length - 1) {
+                    _this.currentIndex = element.length - 1
+                }
+                if (_this.currentIndex < 0) {
+                    _this.currentIndex = 0
+                }
+            }
+            self.isNumber = function(val) {
+                var regPos = /^\d+(\.\d+)?$/;
+                var regNeg = /^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$/;
+                if (regPos.test(val) || regNeg.test(val)) {
+                    return true
+                } else {
+                    return false
+                }
+            }
+            var distance = function(pointA, pointB, type) {
+                    var P1 = getBoundingClientRect(pointA),
+                        P2 = getBoundingClientRect(pointB);
+                    var dist = 0;
+                    switch (type) {
+                        case "AA":
+                            dist = Math.sqrt(((P1.left - P2.left) * (P1.left - P2.left)) + ((P1.top - P2.top) * (P1.top - P2.top)))
+                             break;
+                        case "AB":
+                            dist = Math.sqrt(((P1.left - P2.right) * (P1.left - P2.right)) + ((P1.top - P2.top) * (P1.top - P2.top)))
+                             break;
+                        case "AC":
+                            dist = Math.sqrt(((P1.left - P2.right) * (P1.left - P2.right)) + ((P1.top - P2.bottom) * (P1.top - P2.bottom)))
+                             break;
+                        case "AD":
+                            dist = Math.sqrt(((P1.left - P2.left) * (P1.left - P2.left)) + ((P1.top - P2.bottom) * (P1.top - P2.bottom)))
+                             break;
+                        case "BA":
+                            dist = Math.sqrt(((P1.right - P2.left) * (P1.right - P2.left)) + ((P1.top - P2.top) * (P1.top - P2.top)))
+                             break;
+                        case "BB":
+                            dist = Math.sqrt(((P1.right - P2.right) * (P1.right - P2.right)) + ((P1.top - P2.top) * (P1.top - P2.top)))
+                             break;
+                        case "BC":
+                            dist = Math.sqrt(((P1.right - P2.right) * (P1.right - P2.right)) + ((P1.top - P2.bottom) * (P1.top - P2.bottom)))
+                             break;
+                        case "BD":
+                            dist = Math.sqrt(((P1.right - P2.left) * (P1.right - P2.left)) + ((P1.top - P2.bottom) * (P1.top - P2.bottom)))
+                             break;
+                        case "CA":
+                            dist = Math.sqrt(((P1.left - P2.left) * (P1.left - P2.left)) + ((P1.bottom - P2.top) * (P1.bottom - P2.top)))
+                             break;
+                        case "CB":
+                            dist = Math.sqrt(((P1.left - P2.right) * (P1.left - P2.right)) + ((P1.bottom - P2.top) * (P1.bottom - P2.top)))
+                             break;
+                        case "CC":
+                            dist = Math.sqrt(((P1.left - P2.left) * (P1.left - P2.left)) + ((P1.bottom - P2.bottom) * (P1.bottom - P2.bottom)))
+                             break;
+                        case "CD":
+                            dist = Math.sqrt(((P1.right - P2.left) * (P1.right - P2.left)) + ((P1.bottom - P2.bottom) * (P1.bottom - P2.bottom)))
+                             break;
+                        case "DA":
+                            dist = Math.sqrt(((P1.left - P2.left) * (P1.left - P2.left)) + ((P1.bottom - P2.top) * (P1.bottom - P2.top)))
+                             break;
+                        case "DB":
+                            dist = Math.sqrt(((P1.right - P2.right) * (P1.right - P2.right)) + ((P1.bottom - P2.top) * (P1.bottom - P2.top)))
+                             break;
+                        case "DC":
+                            dist = Math.sqrt(((P1.right - P2.left) * (P1.right - P2.left)) + ((P1.bottom - P2.bottom) * (P1.bottom - P2.bottom)))
+                             break;
+                        case "DD":
+                            dist = Math.sqrt(((P1.right - P2.right) * (P1.right - P2.right)) + ((P1.bottom - P2.bottom) * (P1.bottom - P2.bottom)))
+                             break
+                    }
+                    return dist
+                }
+            self.ruleFn = function(index, direction) {
+                var obj = {};
+                if (rules) {
+                    obj = _self.getCurRule()
+                }
+                if (obj && typeof obj == "object" && typeof obj["line"] != "undefined") {
+                    var line = obj["line"]
+                } else {
+                    var line = _this.hotbtn.length
+                }
+                line = parseInt(line);
+                if (obj && typeof obj == "object" && typeof obj[_this.currentIndex] != "undefined" && typeof obj[_this.currentIndex][index] != "undefined") {
+                    var objRules = obj[_this.currentIndex];
+                    if (self.isNumber(objRules[index])) {
+                        _this.currentIndex = parseInt(_this.currentIndex) + parseInt(objRules[index])
+                    } else if (Array.isArray(objRules[index])) {
+                        _this.reSetClass(objRules[index][0], objRules[index][1], objRules[index][2])
+                    } else if (typeof objRules[index] == "function") {
+                        objRules[index].call(_this)
+                    } else if (typeof obj["line"] != "undefined") {
+                        _this.currentIndex = _this.currentIndex + line
+                    }
+                } else {
+                    var jump = element[_this.currentIndex].getAttribute("data-" + direction);
+                    jump = parseInt(jump);
+                    var max=Math.sqrt(window.screen.width*window.screen.width+window.screen.height*window.screen.height);
+                    if (direction == "up") {
+                        if (_this.currentIndex > line - 1&&!obj["autoMove"]) _this.currentIndex = jump ? _this.currentIndex - jump : _this.currentIndex - line;
+                        else if (obj && typeof obj["up"] == "object") _this.reSetClass(obj["up"][0], obj["up"][1], obj["up"][2]);
+                        else if (obj && typeof obj["up"] == "function") obj["up"].call(_this)
+                        else {
+                            var min1 = max,min2 = max,
+                                curIndex = _this.currentIndex, curIndex2 = _this.currentIndex;
+                            for (var i = 0; i < _this.hotbtn.length; i++) {
+                                var cur1 = distance(_this.current, _this.hotbtn[i], "AD");
+                                var cur2 = distance(_this.current, _this.hotbtn[i], "BC");
+                                if (cur1 < min1 && cur1 > 0 && getBoundingClientRect(_this.current).top > getBoundingClientRect(_this.hotbtn[i]).top && _this.currentIndex > i) {
+                                    min1 = cur1;
+                                    curIndex = i;
+                                }
+
+                                if (cur2 < min2 && cur2 > 0 && getBoundingClientRect(_this.current).top > getBoundingClientRect(_this.hotbtn[i]).top  && _this.currentIndex > i) {
+                                    min2 = cur2;
+                                    curIndex2 = i;
+                                }
+                            }
+                            curIndex=min1<min2?curIndex:curIndex2;
+                            _this.currentIndex = curIndex;
+                        }
+                    } else if (direction == "left") {
+                        if ((_this.currentIndex) % line != 0&&!obj["autoMove"]) _this.currentIndex = jump ? _this.currentIndex - jump : _this.currentIndex - 1;
+                        else if (obj && typeof obj["left"] == "object") _this.reSetClass(obj["left"][0], obj["left"][1], obj["left"][2]);
+                        else if (obj && typeof obj["left"] == "function") obj["left"].call(_this)
+                        else {
+                            var min1 = max,min2 = max
+                                curIndex = _this.currentIndex,curIndex2 = _this.currentIndex;
+                            for (var i = 0; i < _this.hotbtn.length; i++) {
+                                var cur1 = distance(_this.current, _this.hotbtn[i], "AB");
+                                var cur2 = distance(_this.current, _this.hotbtn[i], "DC");
+                                if (cur1 < min1 && cur1 > 0 && getBoundingClientRect(_this.current).left > getBoundingClientRect(_this.hotbtn[i]).left  && _this.currentIndex > i) {
+                                    min1 = cur1;
+                                    curIndex = i;
+                                }
+
+                                if (cur2 < min2 && cur2 > 0 && getBoundingClientRect(_this.current).left > getBoundingClientRect(_this.hotbtn[i]).left  && _this.currentIndex > i) {
+                                    min2 = cur2;
+                                    curIndex2 = i;
+                                }
+                            }
+                            curIndex=min1<min2?curIndex:curIndex2;
+                            _this.currentIndex = curIndex
+                        }
+                    } else if (direction == "right") {
+                        if ((_this.currentIndex + 1) % line != 0&&!obj["autoMove"]) _this.currentIndex = jump ? _this.currentIndex + jump : _this.currentIndex + 1;
+                        else if (obj && typeof obj["right"] == "object") _this.reSetClass(obj["right"][0], obj["right"][1], obj["right"][2]);
+                        else if (obj && typeof obj["right"] == "function") obj["right"].call(_this)
+                        else {
+                            var min1 = max,min2 = max,
+                                curIndex = _this.currentIndex,curIndex2 = _this.currentIndex;
+                            for (var i = 0; i < _this.hotbtn.length; i++) {
+                                var cur1 = distance(_this.current, _this.hotbtn[i], "BA");
+                                var cur2 = distance(_this.current, _this.hotbtn[i], "CD");
+
+                                if (cur1 < min1 && cur1 > 0 && getBoundingClientRect(_this.current).right< getBoundingClientRect(_this.hotbtn[i]).right  && _this.currentIndex < i) {
+                                    min1 = cur1;
+                                     curIndex = i;
+                                }
+
+                                if (cur2 < min2 && cur2 > 0 && getBoundingClientRect(_this.current).right < getBoundingClientRect(_this.hotbtn[i]).right  && _this.currentIndex < i) {
+                                    min2 = cur2;
+                                    
+                                    curIndex2 = i;
+                                }
+                            }
+                            curIndex=min1<min2?curIndex:curIndex2;
+                            _this.currentIndex = curIndex;
+                        }
+                    } else if (direction == "down") {
+                        if (_this.hotbtn.length - line > _this.currentIndex&&!obj["autoMove"]) _this.currentIndex = jump ? _this.currentIndex + jump : _this.currentIndex + line;
+                        else if (obj && typeof obj["down"] == "object") _this.reSetClass(obj["down"][0], obj["down"][1], obj["down"][2]);
+                        else if (obj && typeof obj["down"] == "function") obj["down"].call(_this);
+                        else if (_this.currentIndex + line > _this.hotbtn.length - 1 && _this.currentIndex + line <= (line - _this.hotbtn.length % line) + _this.hotbtn.length - 1 && _this.hotbtn.length % line != 0 && isFloatLast) {
+                            _this.currentIndex = _this.currentIndex + line;
+                            self.overIndex()
+                        } else {
+                            var min1 = max,min2=max,
+                                curIndex = _this.currentIndex,curIndex2=_this.currentIndex;
+                            for (var i = 0; i < _this.hotbtn.length; i++) {
+                                var cur1 = distance(_this.current, _this.hotbtn[i], "DA");
+                                var cur2 = distance(_this.current, _this.hotbtn[i], "CB");
+                                if (cur1 < min1 && cur1>0&&getBoundingClientRect(_this.current).bottom < getBoundingClientRect(_this.hotbtn[i]).bottom&&_this.currentIndex < i) {
+                                    min1 = cur1;
+                                    curIndex = i;
+                                }
+                                if (cur2 < min2 &&cur2>0&& getBoundingClientRect(_this.current).bottom < getBoundingClientRect(_this.hotbtn[i]).bottom&&_this.currentIndex < i) {
+                                    min2 = cur2;
+                                    curIndex2 = i;
+                                }
+                            }
+                            
+                             curIndex=min1<min2?curIndex:curIndex2;
+                            _this.currentIndex = curIndex;
+                        }
+                    }
+                }
+            }
+            self.rule = function(keyCode) {
+                if (element.length <= 0) {
+                    console.log("初始化" + _this.className + "失败");
+                    return
+                }
+                self.overIndex();
+                if (keyCode == btnLeft) {
+                    self.ruleFn(0, "left")
+                } else if (keyCode == btnRight) {
+                    self.ruleFn(2, "right")
+                } else if (keyCode == btnUp) {
+                    self.ruleFn(1, "up")
+                } else if (keyCode == btnDown) {
+                    self.ruleFn(3, "down")
+                }
+                self.overIndex()
+            }
+            this.BACK = function() {
+                self.onPressFn("back")
+            }
+            this.LEFT = function() {
+                self.onPressFn("left")
+            }
+            this.RIGHT = function() {
+                self.onPressFn("right")
+            }
+            this.UP = function() {
+                self.onPressFn("up")
+            }
+            this.DOWN = function() {
+                self.onPressFn("down")
+            }
+            this.onPressRules = function(e) {
+                var keyCode = "";
+                if (typeof e == "object") {
+                    keyCode = e.keyCode
+                } else {
+                    if (e == "left") {
+                        keyCode = btnLeft
+                    } else if (e == "right") {
+                        keyCode = btnRight
+                    } else if (e == "up") {
+                        keyCode = btnUp
+                    } else if (e == "down") {
+                        keyCode = btnDown
+                    } else if (e == "back") {
+                        keyCode = btnBack
+                    }
+                }
+                _this.event = e;
+                _this.currentIndex = _this.currentIndex >= element.length - 1 ? element.length - 1 : _this.currentIndex;
+                _this.prev = element[_this.currentIndex];
+                _this.prevIndex = _this.currentIndex;
+                self.rule(keyCode);
+                _this.current = element[_this.currentIndex];
+                _this.currentIndex = _this.currentIndex;
+                _this.className = _this.className;
+                _this.onCommPress.call(_this);
+                if (keyCode == 8 || keyCode == btnBack) {
+                    if (rules["#" + _this.currentId + ">." + _this.className] && (typeof rules["#" + _this.currentId + ">." + _this.className]["onBack"]) == "function") rules["#" + _this.currentId + ">." + _this.className]["onBack"].call(_this);
+                    else if (rules[_this.className] && (typeof rules[_this.className]["onBack"]) == "function") rules[_this.className]["onBack"].call(_this);
+                    else _this.onBack.call(_this)
+                }
+                if (rules && rules["#" + _this.currentId + ">." + _this.className] && (typeof rules["#" + _this.currentId + ">." + _this.className]["onPress"]) == "function") init.rules["#" + _this.currentId + ">." + _this.className]["onPress"].call(_this);
+                else if (rules && rules[_this.className] && (typeof rules[_this.className]["onPress"]) == "function") init.rules[_this.className]["onPress"].call(_this);
+                else _this.onPress.call(_this);
+                if (keyCode == btnEnter) {
+                    if (rules["#" + _this.currentId + ">." + _this.className] && (typeof rules["#" + _this.currentId + ">." + _this.className]["onEnterPress"]) == "function") rules["#" + _this.currentId + ">." + _this.className]["onEnterPress"].call(_this);
+                    else if (rules[_this.className] && (typeof rules[_this.className]["onEnterPress"]) == "function") rules[_this.className]["onEnterPress"].call(_this);
+                    else _this.onEnterPress.call(_this)
+                }
+                _this.renderType = "";
+                _self.render(_this.currentIndex);
+                keydefault(e)
+            }
+            this.onLoad()
+        }
+    window.tvSysBtnBind = tvSysBtnBind
+})(window)