/*
 * @Author: ly 
 * @Date: 2018-10-22 16:20:42 
 * @Last Modified by: ly
 * @Last Modified time: 2019-11-13 15:25:25
 */
//Number、String、Boolean） 用new
//Object、Array、Function 不用
//
console.log('%c非常开心亲爱的您喜提彩蛋！\n这里是超酷的 <蜀美> plus <酷要> 团队 {SHUWON + cooyo} \n问我们可以做什么？\n1. 精美酷网站\n2. 购物中心微信会员运营开发\n3. 年度H5互动小游戏\n4. 数字化运营服务\n😊\n我们团队很单纯与热情，就像honolulu！只想要的与众不同！ \n联系噜噜：18602845267', 'line-height:1.8;')
console.log('%c http://www.shuwon.com  ❤️❤️❤️ 蜀美网络', 'padding:20px 0;color:red');
(function (global, factory) {
    // typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() : //是否引用在node
    //     typeof define === 'function' && define.amd ? define(factory) : //是否支持amd
    (global.util = factory());
}(this, (function () {
    // 'use strict'; ie9不支持
    if (!util) {
        var util = {
            /************************************************************************
             * ui
             ************************************************************************/
            /**
             *对话提示框
             *
             * @param {*} [string=''] 显示的文案
             * @param {*} [type='normal'] '默认半透明,success 绿色,error 红色, warning 黄色'
             */
            toast: function (config) {
                if (Object.assign != undefined) {
                    config = Object.assign({
                        string: '',
                        type: 'normal',
                    }, config);
                }
                var $toast = document.getElementsByClassName('_toast')[0]
                util.addClass($toast, 'active')
                util.removeClass($toast, 'success')
                $toast.childNodes[0].childNodes[0].innerHTML = config.string
                switch (config.type) {
                    case 'normal':
                        break;
                    case 'success':
                        util.addClass($toast, 'success')
                        break;
                    case 'error':
                        util.addClass($toast, 'error')
                        break;
                    case 'warning':
                        util.addClass($toast, 'warning')
                        break;
                    default:
                        break;
                }
                setTimeout(function () {
                    $toast.className = '_toast'
                }, 1500)
            },
            /**
             * 光标
             * @param {*} $cursor //光标
             * @param {*} $must //光标范围
             */
            cursor: function (config) {
                if (Object.assign != undefined) {
                    config = Object.assign({
                        $cursor: '',
                        $must: '',
                    }, config);
                }
                var position = {
                        x: 0,
                        y: 0
                    },
                    show = false,
                    dragg = false;
                ani()

                function ani(param) {
                    requestAnimationFrame(ani)
                    render()
                }

                function render() {
                    if (show) {
                        /** @type {HTMLElement} */
                        config.$cursor.classList.add('show-pointer')
                        TweenMax.to(config.$cursor, .25, {
                            left: position.x + 'px',
                            top: position.y + 'px'
                        })
                    } else {
                        config.$cursor.classList.remove('show-pointer')
                    }
                }
                config.$must.addEventListener('mousemove', function (e) {
                    position.x = e.clientX
                    position.y = e.clientY
                }, false)
                config.$must.addEventListener('mousedown', function (e) {
                    console.log('?')
                    util.addClass(config.$cursor, 'active')
                }, false)
                config.$must.addEventListener('mouseup', function (e) {
                    util.removeClass(config.$cursor, 'active')
                }, false)
                config.$must.addEventListener('mouseleave', function (e) {
                    show = false
                    // console.log('leave')
                }, false)
                config.$must.addEventListener('mouseenter', function (e) {
                    show = true

                    // console.log('in')
                }, false)

            },
            /**
             *点击看大图
                *
                * @param {*} $objUl //列表父级
                * @param {String} objClass //选中的图的Class
                
                */
            Album: function ($objUl, objClass) {
                var div = document.createElement('div');
                div.innerHTML = '<div class="infobar"></div><div class="_photo"><div class="_pic"><img src="" alt="" id="_photoImg"></div></div><div class="_swiperBtn _SBL _templateIcon">&#xe628;</span></div><div class="_swiperBtn _SBR _templateIcon">&#xed22;</div><div class="_swiperBtnOff _templateIcon">&#xe62e;</div></div>';
                div.className = "_AlbumPictures";
                var bo = document.body;
                bo.insertBefore(div, bo.lastChild);
                var $Album = document.getElementsByClassName('_AlbumPictures')[0],
                    $photoImg = document.getElementById('_photoImg'),
                    $SBL = document.getElementsByClassName('_SBL')[0],
                    $SBR = document.getElementsByClassName('_SBR')[0];
                $infobar = document.getElementsByClassName('infobar')[0];
                var liIndex = 0,
                    lilenght = $objUl.children.length - 1,
                    parentLi;
                //看大图
                for (var i = 0; i <= lilenght; i++) {
                    $objUl.children[i].onclick = function (e) {
                        $SBL.style = "display: block;"
                        $SBR.style = "display: block;"
                        parentLi = this


                        $Album.className = '_AlbumPictures active';
                        $photoImg.src = parentLi.getAttribute('data-url')
                        liIndex = Array.prototype.indexOf.call(parentLi.parentNode.children, parentLi);
                        $infobar.innerHTML = (liIndex + 1) + '/' + (lilenght + 1)
                        if (liIndex == lilenght) {
                            $SBR.style = "display: none;"
                        } else if (liIndex == 0) {
                            $SBL.style = "display: none;"
                        }
                        e.stopPropagation();
                    }
                }
                var $swiperBtnOff = document.getElementsByClassName('_swiperBtnOff')[0];
                //关闭
                $swiperBtnOff.addEventListener('click', function (e) {
                    $Album.className = '_AlbumPictures';
                });
                //左切换
                $SBL.addEventListener('click', function (e) {
                    liIndex <= 0 ? liIndex = 0 : liIndex--;
                    if (liIndex == 0) {
                        $SBL.style = "display: none;";
                    } else {
                        $SBR.style = "display: block;";
                    }
                    $photoImg.style = 'transform: translate(0%,-50%);opacity: 0;transition: ease .5s;'
                    $photoImg.addEventListener('transitionend', fnOut, false)
                    e.stopPropagation();
                })
                //右切换
                $SBR.addEventListener('click', function (e) {
                    liIndex == lilenght ? liIndex = lilenght : liIndex++;
                    if (liIndex == lilenght) {
                        $SBR.style = "display: none;";
                    } else {
                        $SBL.style = "display: block;";
                    }

                    $photoImg.style = 'transform: translate(-100%,-50%);opacity: 0;transition: ease .5s'
                    $photoImg.addEventListener('transitionend', fnOut, false)
                    e.stopPropagation();
                })

                function fnOut(e) {
                    $photoImg.style = 'transform: translate(-50%,-50%);opacity:1;transition:opacity ease .5s;'
                    $photoImg.src = parentLi.parentNode.children[liIndex].getAttribute('data-url')
                    $infobar.innerHTML = (liIndex + 1) + '/' + (lilenght + 1)
                    e.stopPropagation();
                }
            },
            /**
             *加载事物的百分比(无法判断背景)
             *
             * @param {*} $obj 接收加载进度
             * @param {*} $Loader 加载事物
             * @return {*} callback
             */
            LoadPercentage: function (config, callback) {
                if (Object.assign != undefined) {
                    config = Object.assign({
                        obj: null,
                        Loader: null,
                        timer: 1000
                    }, config);
                }
                var $Loader, len = 0;
                var $Loader = util.ifIDorClass(config.Loader)
                var $obj = util.ifIDorClass(config.obj)
                //console.log( util.ifIDorClass(config.out))
                if (($Loader == null) || ($obj == null)) return
                for (var i = 0; i < $Loader.length; i++) {
                    (function (i) {
                        if ($Loader[i].tagName == 'VIDEO') {
                            $Loader[i].oncanplaythrough
                            len++
                            doIt(len)
                            //oncanplaythrough
                        } else if ($Loader[i].tagName == 'IMG') {
                            $Loader[i].src=$Loader[i].getAttribute('minsrc-data')
                            if ($Loader[i].complete) {
                                len++;
                                doIt(len)
                            } else {
                                $Loader[i].onload = function () {
                                    len++;
                                    doIt(len)
                                }
                            }
                        }
                    })(i);
                }

                function doIt(len) {
                    var num = Math.round(len * 100 / $Loader.length)
                    $obj[0].innerHTML = Math.round(len * 100 / $Loader.length) + '%';
                    if (len == $Loader.length) {
                        var deadLine = false;
                        onLoad()
                        setTimeout(function () {
                            deadLine = true;
                        }, config.timer); //最小展示时间，示例为7秒

                        function onLoad() {
                            if (deadLine) {
                                isCallback() && (callback(num))
                            } else {
                                setTimeout(onLoad, 1000); // 还没有到最小展示时间，1秒后重试
                            }
                        }

                    }
                }
                //isCallback 是否有返回值
                function isCallback() {
                    return callback == undefined ? false : true
                }
            },
            /**
             * 新建toast提示框
             *
             */
            toastInit: function () {
                var $body = document.getElementsByTagName('body')[0];
                var toastHTML = document.createElement('div');
                toastHTML.innerHTML = '<p><span></span></p>';
                toastHTML.className = "_toast";
                $body.appendChild(toastHTML);
            },

            /**
             *基础版banner
             *
             * @param {*} $banner banner 初始
             * @param {*} $btnR 按钮R
             * @param {*} $btnL 按钮L
             * @param {*} $pagination  分页器小点
             * @param {Number} timer 自动切换时间 默认5s
             * @param {string} effect  切换效果
             * @param {Booleans} autoplay  自动切换，默认关闭
             * @param {Booleans} bannerBtnLR  banner 左右两版切换，默认关闭
             * @param {Booleans} progressBar 是否进度条,最好在自动播放开启时在开启progressBar
             * @param {Booleans} loop 是否循环，默认关闭
             * @return {*} callback
             */
            banner: function (config, callback) {
                if (Object.assign != undefined) {
                    config = Object.assign({
                        $banner: null,
                        $btnR: null,
                        $btnL: null,
                        $pagination: null,
                        speed: 3,
                        timer: 5,
                        effect: '',
                        autoplay: false,
                        bannerBtnLR: false,
                        progressBar: false,
                        loop: false,
                    }, config);
                }
                var AnimationEnd = true
                var callbackData = {
                    bannerIndex: 0
                }
                var _w = document.body.clientWidth,
                    _h = window.innerHeight
                var $li = config.$banner.children[0].children,
                    bannerLen = $li.length - 1;
                var indexAll = {
                    index: 0,
                    nextIndex: 1,
                    prevIndex: bannerLen
                }
                if (bannerLen == 0) {
                    return
                }
                //isCallback 是否有返回值
                function isCallback() {
                    return callback == undefined ? false : true
                }
                config.$pagination && InitPagination(config);
                config.progressBar && InitProgressBar(config);
                util.addClass($li[indexAll.index], 'active')
                util.addClass($li[1], 'activeNext')
                var bannerInterval
                config.autoplay && foo(config, indexAll)
                effectInit(config, indexAll)
                bannerSwBtn(config)
                loopInit(config)

                //循环
                function loopInit(config) {

                }
                //banner 切换点
                function InitPagination(param) {
                    var objAble = '';
                    for (var i = 0; i <= bannerLen; i++) {
                        objAble += '<span></span>'
                    }
                    config.$pagination.innerHTML = objAble, util.addClass(config.$pagination.children[0], 'active')
                }
                //进度条
                function InitProgressBar(config) {
                    var objProgressBar = document.createElement('div');
                    objProgressBar.className = "_progressBar";
                    config.$banner.appendChild(objProgressBar)
                }
                //进度条动画
                function AnimProgressBar(config, status) {
                    var $progressBar = document.getElementsByClassName('_progressBar')[0];
                    if (status == 'start') {
                        util.addClass($progressBar, 'active')
                        TweenMax.to($progressBar, config.timer, {
                            width: 100 + '%',
                            onComplete: function (e) {

                            }
                        });
                    } else {
                        util.removeClass($progressBar, 'active')
                        TweenMax.set($progressBar, {
                            width: 0,
                            onComplete: function (e) {

                            }
                        });
                    }
                }
                // 正常循环切换banner
                function foo(config, indexAll) {
                    if (AnimationEnd) {
                        clearInterval(bannerInterval)
                        config.progressBar && AnimProgressBar(config, 'start')
                        bannerInterval = setTimeout(function () {
                            Object.keys($li).forEach(function (i, item) {
                                util.removeClass($li[i], 'active')
                                util.removeClass($li[i], 'activeNext')
                                util.removeClass($li[i], 'activePrev')
                                config.$pagination && (util.removeClass(config.$pagination.children[i], 'active'))

                            })
                            indexAll.index >= bannerLen ? indexAll.index = 0 : indexAll.index++
                            callbackData.bannerIndex = indexAll.index
                            indexAll.prevIndex = (indexAll.index - 1) < 0 ? (bannerLen) : (indexAll.index - 1)
                            indexAll.nextIndex = (indexAll.index + 1) > bannerLen ? 0 : indexAll.index + 1

                            if (config.effect == 'mask') {
                                $li[indexAll.prevIndex].style = 'z-index:1'
                            }
                            effectF(config, indexAll, 'R')
                            isCallback() && (callback(callbackData))

                            util.addClass($li[indexAll.index], 'active')
                            util.addClass($li[indexAll.nextIndex], 'activeNext')
                            util.addClass($li[indexAll.prevIndex], 'activePrev')

                            config.$pagination && (util.addClass(config.$pagination.children[indexAll.index], 'active'))
                            foo(config, indexAll)
                        }, (config.timer * 1000));
                    }
                }
                //事件执行后切换banner，后执行foo 正常切换
                function fooC(config, indexAll, BtnLRtype) {
                    config.progressBar && AnimProgressBar(config, 'end')
                    isCallback() && (callback(callbackData))
                    Object.keys($li).forEach(function (i, item) {
                        util.removeClass($li[i], 'active')
                        util.removeClass($li[i], 'activeNext')
                        util.removeClass($li[i], 'activePrev')
                        config.$pagination && (util.removeClass(config.$pagination.children[i], 'active'))
                    })
                    indexAll.prevIndex = (indexAll.index - 1) < 0 ? (bannerLen) : (indexAll.index - 1)
                    indexAll.nextIndex = (indexAll.index + 1) > bannerLen ? 0 : indexAll.index + 1

                    effectF(config, indexAll, BtnLRtype)
                    util.addClass($li[indexAll.index], 'active')
                    util.addClass($li[indexAll.nextIndex], 'activeNext')
                    util.addClass($li[indexAll.prevIndex], 'activePrev')
                    config.$pagination && (util.addClass(config.$pagination.children[indexAll.index], 'active'))
                }
                //自定义效果初始化
                function effectInit(config, indexAll) {
                    if (config.effect == 'brush') {
                        util.addClass(config.$banner.children[0], 'brush')
                        //util.addClass(config.$banner.children[0], '_h100vh')
                        config.$banner.children[0].children[0].style = 'width:100%';
                        for (var i = 0; i <= bannerLen; i++) {
                            config.$banner.children[0].children[i].children[0].style.width = _w + 'px'
                        }
                    } else if (config.effect == '??') {
                        for (var i = 0; i <= bannerLen; i++) {
                            config.$banner.children[0].children[i].style.transform = "translate3d(" + (-i * config.$banner.clientWidth) + "px, 0px, 0px)"
                        }
                    } else if (config.effect == 'mask') {
                        util.addClass(config.$banner.children[0], 'mask')
                        for (var i = 0; i <= bannerLen; i++) {
                            var liHtml = config.$banner.children[0].children[i].innerHTML
                            config.$banner.children[0].children[i].innerHTML = '<div class="MaskPic">' + liHtml + '</div>';
                            $li[i].children[0].style = 'clip-path:polygon(0% 40%,0% 40%,0% 60%,0 60%)'
                        }
                        $li[0].children[0].style = 'clip-path:polygon(0% 0%,100% 0%,100% 100%,0 100%)'
                        config.$btnR && config.$btnL && (
                            config.$btnL.onmouseenter = function () {
                                $li[indexAll.index].style = 'z-index:1'
                                TweenMax.to($li[indexAll.prevIndex].children[0], .6, {
                                    autoCSS: false,
                                    startAt: {
                                        'clip-path': 'polygon(0% 40%,0% 40%,0% 60%,0 60%)',
                                    },
                                    css: {
                                        'clip-path': 'polygon(0% 40%,10% 40%,10% 60%,0 60%)',
                                    },
                                    onComplete: function (e) {

                                    }
                                });
                            },
                            config.$btnL.onmouseleave = function () {

                                TweenMax.to($li[indexAll.prevIndex].children[0], .3, {
                                    autoCSS: false,
                                    css: {
                                        'clip-path': 'polygon(0% 40%,0% 40%,0% 60%,0 60%)',
                                    },
                                    onComplete: function (e) {
                                        $li[indexAll.index].style = 'z-index:2'
                                    }
                                });
                            },
                            config.$btnR.onmouseenter = function (e) {
                                $li[indexAll.index].style = 'z-index:1'
                                TweenMax.to($li[indexAll.nextIndex].children[0], .6, {
                                    autoCSS: false,
                                    startAt: {
                                        'clip-path': 'polygon(100% 40%,100% 40%,100% 60%,100% 60%)',
                                        //'z-index':'9'
                                    },
                                    css: {
                                        'clip-path': 'polygon(90% 40%,100% 40%,100% 60%,90% 60%)',
                                    },
                                    onComplete: function (e) {

                                    }
                                });

                            },
                            config.$btnR.onmouseleave = function (e) {

                                TweenMax.to($li[indexAll.nextIndex].children[0], .3, {
                                    autoCSS: false,
                                    css: {
                                        'clip-path': 'polygon(100% 40%,100% 40%,100% 60%,100% 60%)',
                                    },
                                    onComplete: function (e) {
                                        $li[indexAll.index].style = 'z-index:2'
                                    }
                                });
                            }
                        )
                    }
                }
                //效果切换
                function effectF(config, indexAll, BtnLRtype) {
                    if (config.effect == '') {
                        AnimationEnd = false
                        TweenMax.to(config.$banner.children[0], config.speed, {
                            x: (-indexAll.index * config.$banner.clientWidth),
                            onComplete: function (e) {
                                AnimationEnd = true
                                config.autoplay && foo(config, indexAll)
                                config.progressBar && AnimProgressBar(config, 'end')
                            }
                        });
                        //config.$banner.children[0].style.transform = ""
                    } else if (config.effect == 'brush') {
                        AnimationEnd = false
                        TweenMax.to(config.$banner.children[0].children[indexAll.index], config.speed, {
                            autoCSS: false,
                            css: {
                                width: _w,
                            },
                            onComplete: function (e) {
                                AnimationEnd = true
                                config.autoplay && foo(config, indexAll)
                                config.progressBar && AnimProgressBar(config, 'end')
                            }
                        });
                        for (var i = 0; i <= bannerLen; i++) {
                            if (i != indexAll.index) {
                                TweenMax.to(config.$banner.children[0].children[i], config.speed, {
                                    autoCSS: false,
                                    css: {
                                        width: 0,
                                    },

                                });
                            }
                        }
                    } else if (config.effect == 'mask') {
                        if (BtnLRtype == 'R') {
                            $li[indexAll.prevIndex].style.zIndex = '1'
                            TweenMax.to($li[indexAll.index].children[0], .6, {
                                autoCSS: false,
                                startAt: {
                                    'clip-path': 'polygon(90% 40%,100% 40%,100% 60%,90% 60%)',
                                },
                                css: {
                                    'clip-path': 'polygon(0% 40%,100% 40%,100% 60%,0% 60%)',
                                },
                                onComplete: function (e) {
                                    TweenMax.to($li[indexAll.index].children[0], .6, {
                                        startAt: {
                                            'clip-path': 'polygon(0% 40%,100% 40%,100% 60%,0% 60%)',
                                        },
                                        css: {
                                            'clip-path': 'polygon(0% 0%,100% 0%,100% 100%,0% 100%)',
                                        },
                                        onComplete: function (e) {
                                            $li[indexAll.prevIndex].style = 'z-index:2';
                                            $li[indexAll.nextIndex].style = 'z-index:2';
                                            $li[indexAll.index].style = 'z-index:2';
                                            $li[indexAll.prevIndex].children[0].style = 'clip-path:polygon(0% 40%,0% 40%,0% 60%,0 60%)'
                                            $li[indexAll.nextIndex].children[0].style = 'clip-path:polygon(0% 40%,0% 40%,0% 60%,0 60%)';
                                            config.autoplay && foo(config, indexAll)
                                        }
                                    })
                                }
                            });
                        } else {
                            $li[indexAll.nextIndex].style.zIndex = '1'
                            TweenMax.to($li[indexAll.index].children[0], .6, {
                                autoCSS: false,
                                css: {
                                    'clip-path': 'polygon(0% 40%,100% 40%,100% 60%,0% 60%)',
                                },
                                onComplete: function (e) {
                                    TweenMax.to($li[indexAll.index].children[0], .6, {
                                        startAt: {
                                            'clip-path': 'polygon(0% 40%,100% 40%,100% 60%,0% 60%)',
                                        },
                                        css: {
                                            'clip-path': 'polygon(0% 0%,100% 0%,100% 100%,0% 100%)',
                                        },
                                        onComplete: function (e) {
                                            $li[indexAll.prevIndex].style = 'z-index:2';
                                            $li[indexAll.nextIndex].style = 'z-index:2';
                                            $li[indexAll.index].style = 'z-index:2';
                                            $li[indexAll.prevIndex].children[0].style = 'clip-path:polygon(0% 40%,0% 40%,0% 60%,0 60%)'
                                            $li[indexAll.nextIndex].children[0].style = 'clip-path:polygon(0% 40%,0% 40%,0% 60%,0 60%)'
                                            config.autoplay && foo(config, indexAll)
                                        }
                                    })
                                }
                            });
                        }

                    }
                }
                //banner 左右两版面切换
                function bannerSwBtn(config) {
                    if (config.bannerBtnLR) {
                        //config.$banner.innerHTML=''
                        var $swiperPrer = document.createElement('div'),
                            $swiperNext = document.createElement('div');
                        $swiperPrer.className = "_swiperPrer bannerSwBtn";
                        $swiperNext.className = "_swiperNext bannerSwBtn";
                        config.$banner.appendChild($swiperPrer);
                        config.$banner.appendChild($swiperNext);
                        $swiperPrer.addEventListener('click', bannerBtnL)
                        $swiperNext.addEventListener('click', bannerBtnR)
                    }
                }
                //左右按钮切换
                function bannerBtnL() {
                    if (AnimationEnd) {
                        clearInterval(bannerInterval)
                        indexAll.index = callbackData.bannerIndex
                        indexAll.index <= 0 ? indexAll.index = bannerLen : indexAll.index--
                        callbackData.bannerIndex = indexAll.index
                        fooC(config, indexAll, 'L')
                    }
                }

                function bannerBtnR() {
                    if (AnimationEnd) {
                        clearInterval(bannerInterval)
                        indexAll.index = callbackData.bannerIndex
                        indexAll.index >= bannerLen ? indexAll.index = 0 : indexAll.index++
                        callbackData.bannerIndex = indexAll.index
                        fooC(config, indexAll, 'R')
                    }
                }
                // 切换banner
                config.$btnR && config.$btnL && (
                    config.$btnR.addEventListener('click', bannerBtnR),
                    config.$btnL.addEventListener('click', bannerBtnL)
                )
                config.$pagination && (
                    config.$pagination.addEventListener('click', function (e) {
                        var event = e || window.event;
                        var target = event.target || event.srcElement;
                        if (AnimationEnd) {
                            var lists = Array.from(config.$pagination.querySelectorAll('span'));
                            indexAll.index = lists.indexOf(target)
                            if (indexAll.index != -1) {
                                callbackData.index = indexAll.index
                                clearInterval(bannerInterval)
                                fooC(config, indexAll)
                            }
                        }
                    })
                )
            },

            shineText: function (config) {
                if (Object.assign != undefined) {
                    config = Object.assign({
                        $obj: null,
                    }, config);
                }
                var _textContent = config.$obj.getAttribute('data-text'),
                    $body = document.getElementsByTagName('body')[0];
                //shine-wrapper
                config.$obj.innerHTML = '<div class="_shineWrapper"><span class="_shineWord"></span><span class="_shineMask"></span></div>'
                var FontSpan = '',
                    $shineWord = document.getElementsByClassName('_shineWord')[0],
                    $shineMask = document.getElementsByClassName('_shineMask')[0]
                var Mouse = {
                        x: 0,
                        y: 0
                    },
                    textXy = []
                for (var i = 0; i <= _textContent.length - 1; i++) {
                    FontSpan += '<span class="anim_emt" style="">' + _textContent[i] + '</span>'
                }
                $shineWord.innerHTML = FontSpan
                $shineMask.innerHTML = FontSpan



                // init()
                // function init() {  
                //     requestAnimationFrame(render)
                // }
                // function render() {  

                //     for (var i = 0; i <= _textContent.length - 1; i++) {
                //         //$shineWord.children[i]
                //     }

                //     init()
                // }
                // $body.onmousemove = function (event) {
                //     var e = event || window.event
                //     //获取鼠标的坐标
                //     Mouse.x = e.clientX 
                //     Mouse.y = e.clientY

                //     for (var o = [], r = 0; r < config.numSteps; r++) {
                //         var a = r / config.numSteps
                //           , s = Math.pow(a, config.opacityPow)
                //           , l = Math.pow(a, config.offsetPow)
                //           , c = Math.pow(a, config.blurPow)
                //           , u =  e.Math.max(0, config.opacity * (1 - s))
                //           , d = -config.offset * Mouse.x * l
                //           , p = -config.offset * Mouse.y * l
                //           , f = i * config.blur * c / 512
                //           , m = getShadow(config.shadowRGB, u, d, p, f);
                //         o.push(m)
                //         //console.log(o)
                //         //$shineWord.childNodes[a].style=o[r]
                //     }
                //     //console.log(o)
                //     //drawShadows(o)
                // }

                function getShadow(e, t, n, i, o) {
                    return "rgba(" + 0 + ", " + 0 + ", " + 0 + ", " + t + ") " + n + "px " + i + "px " + Math.round(o) + "px"
                }

                function drawShadows(o) {
                    for (var i = 0; i <= _textContent.length - 1; i++) {
                        // $shineWord.childNodes[i].style=o[i].join(", ")
                    }

                }
            },
            /**
             *创造合成图片
             *
             * @param {*} $cntElem 创造后显示路径
             * @param {*} $CreationSrc 创造后显示路径
             */
            createImg: function (config, callback) {
                if (Object.assign != undefined) {
                    config = Object.assign({
                        $cntElem: null,
                    }, config);
                }

                // 进行canvas生成
                var shareContent = config.$cntElem; //需要截图的包裹的（原生的）DOM 对象
                var width = shareContent.offsetWidth; //获取dom 宽度
                var height = shareContent.offsetHeight; //获取dom 高度
                var canvas = document.createElement("canvas"); //创建一个canvas节点
                var scale = 2; //定义任意放大倍数 支持小数
                canvas.width = width * scale; //定义canvas 宽度 * 缩放
                canvas.height = height * scale; //定义canvas高度 *缩放
                canvas.getContext("2d").scale(scale, scale); //获取context,设置scale 
                var opts = {
                    scale: scale, // 添加的scale 参数
                    canvas: canvas, //自定义 canvas
                    // logging: true, //日志开关，便于查看html2canvas的内部执行流程
                    width: width, //dom 原始宽度
                    height: height,
                    useCORS: true // 【重要】开启跨域配置
                };
                html2canvas(shareContent, opts).then(function (canvas) {
                    var context = canvas.getContext('2d');
                    // 【重要】关闭抗锯齿
                    context.mozImageSmoothingEnabled = true;
                    context.webkitImageSmoothingEnabled = true;
                    context.msImageSmoothingEnabled = true;
                    context.imageSmoothingEnabled = true;

                    // 【重要】默认转化的格式为png,也可设置为其他格式
                    var img = Canvas2Image.convertToJPEG(canvas, canvas.width, canvas.height);
                    var IMG = img.src
                    isCallback() && (callback(IMG))

                });
                //isCallback 是否有返回值
                function isCallback() {
                    return callback == undefined ? false : true
                }
            },
            /**
             *页面跳转
             * @param {*} obj 翻页父级div
             * @param {Number} page 当前页数
             * @param {Number} PageSize 一页条数
             * @param {Number} count 总条数
             * @param {*} php php写法链接  green_140.html?page=
             */
            PageTurningNumber: function (config) {
                if (Object.assign != undefined) {
                    config = Object.assign({
                        obj: null,
                        page: 1,
                        pageSize: 4,
                        count: 100,
                        php: util.truncate(0, window.location.pathname, window.location.pathname.length - 5)
                    }, config);
                }
                config.page = Number(config.page)
                config.obj.innerHTML = '<a href="' + config.php + '_' + 1 + '.html">首页</a><span class="pageNumber"></span><a href="' + config.php + '_' + Total(config.count) + '.html">尾页</a><span class="_JumpNumber" data-count="<?=$count?>">跳转到:<input type="text" class="_Incoming" >页<a class="_btnJump" href="javascript:void(0)">确定</a>共' + Total(config.count) + '页</span>'
                var $pageNumber = document.getElementsByClassName('pageNumber')[0],
                    $btnJump = document.getElementsByClassName('_btnJump')[0],
                    $Incoming = document.getElementsByClassName('_Incoming')[0]
                var liet = '',
                    initial = 1,
                    last = Total(config.count)
                config.page - 2 <= 1 ? initial = 1 : initial = config.page - 2
                config.page + 2 >= last ? last = Total(config.count) : last = config.page + 2
                for (i = initial; i <= last; i++) {
                    liet += '<a class="' + active(i) + '" href="' + config.php + '_' + i + '.html">' + i + '</a>'
                }
                $pageNumber.innerHTML = liet
                function Total(n) {
                    return Math.ceil(n / config.pageSize)
                }
                function active(i) {
                    return config.page == i ? 'active' : ''
                }
                $btnJump.addEventListener('click', function (e) {
                    if ($Incoming.value > Total(config.count) || (!util.regNumber($Incoming.value))) {
                        return
                    }
                    window.location.href = config.php + '_' + $Incoming.value + '.html'
                })
            },
            PageTurningNumberEn: function (config) {
                if (Object.assign != undefined) {
                    config = Object.assign({
                        obj: null,
                        page: 1,
                        pageSize: 4,
                        count: 100,
                        php: util.truncate(0, window.location.pathname, window.location.pathname.length - 5)
                    }, config);
                }
                config.page = Number(config.page)
                config.obj.innerHTML = '<a href="' + config.php + '_' + 1 + '.html">Home page</a><span class="pageNumber"></span><a href="' + config.php + '_' + Total(config.count) + '.html">The Trailer Page</a><span class="_JumpNumber" data-count="<?=$count?>">Jump to the:<input type="text" class="_Incoming" >page<a class="_btnJump" href="javascript:void(0)">Confirm</a>' + Total(config.count) + 'Pages in total</span>'
                var $pageNumber = document.getElementsByClassName('pageNumber')[0],
                    $btnJump = document.getElementsByClassName('_btnJump')[0],
                    $Incoming = document.getElementsByClassName('_Incoming')[0]
                var liet = '',
                    initial = 1,
                    last = Total(config.count)
                config.page - 2 <= 1 ? initial = 1 : initial = config.page - 2
                config.page + 2 >= last ? last = Total(config.count) : last = config.page + 2
                for (i = initial; i <= last; i++) {
                    liet += '<a class="' + active(i) + '" href="' + config.php + '_' + i + '.html">' + i + '</a>'
                }
                $pageNumber.innerHTML = liet
                function Total(n) {
                    return Math.ceil(n / config.pageSize)
                }
                function active(i) {
                    return config.page == i ? 'active' : ''
                }
                $btnJump.addEventListener('click', function (e) {
                    if ($Incoming.value > Total(config.count) || (!util.regNumber($Incoming.value))) {
                        return
                    }
                    window.location.href = config.php + '_' + $Incoming.value + '.html'
                })
            },
            /**
             * 返回顶部 调用 scrollToTop
             */
            backTop: function () {
                var offset = 300,
                    offset_opacity = 200,
                    scroll_top_duration = 500
                var $body = document.getElementsByTagName('body')[0],
                    $backTop = document.createElement('div');
                $backTop.className = "backTop animate _templateIcon";
                $backTop.innerHTML = '&#xe635;'
                $body.appendChild($backTop);
                $backTop.addEventListener("click", function (e) {
                    util.scrollToTop()
                })
                window.onscroll = function () {
                    //变量t是滚动条滚动时，距离顶部的距离
                    var t = document.documentElement.scrollTop || document.body.scrollTop;
                    var scrollup = document.getElementById('scrollup');
                    //当滚动到距离顶部200px时，返回顶部的锚点显示
                    if (t >= offset_opacity) {
                        util.addClass($backTop, 'active')
                    } else { //恢复正常
                        util.removeClass($backTop, 'active')
                    }
                }
            },
            scrollToTop: function () {
                var c = document.documentElement.scrollTop || document.body.scrollTop;
                if (c > 0) {
                    if (!window.requestAnimationFrame) {
                        window.scrollTo(0, c - c / 8);
                        util.scrollToTop()
                    } else {
                        window.requestAnimationFrame(util.scrollToTop);
                        window.scrollTo(0, c - c / 8);
                    }
                }
            },
            /**
             *分享
             *
             * @param {*} bdText 标题
             * @param {*} bdDesc 简介
             * @param {*} bdUrl 分享的链接
             */
            share: function (config) {
                if (Object.assign != undefined) {
                    config = Object.assign({
                        obj: null,
                        shareTitle: '',
                        shareSummary: '',
                        shareUrl: location.href,
                        sharePic: '',
                        shareSelect: ['']
                    }, config);
                }
                var wecnatInfo = {
                        wechatQrcodeTitle: "微信扫一扫：分享",
                        wechatQrcodeHelper: "<p>微信里点“发现”，扫一下</p><p>二维码便可将本文分享至朋友圈。</p>",
                        wechatQrcodeSize: 100,
                    },
                    select = {
                        qzone: "http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=" + config.shareUrl + "&title=" + config.shareTitle + "&summary=" + config.shareSummary + "&pics=" + config.sharePic,
                        qq: "http://connect.qq.com/widget/shareqq/index.html?url=" + config.shareUrl + "&title=" + config.shareTitle + "&summary=" + config.shareSummary + "&pics=" + config.sharePic,
                        weibo: "http://service.weibo.com/share/share.php?url=" + config.shareUrl + "&title=" + config.shareTitle + "&summary=" + config.shareSummary + "&pic=" + config.sharePic,
                        wechat: 'javascript:void(0)'
                    },
                    iconList = {
                        wechat: '&#xe604;',
                        weibo: '&#xe614;',
                        qzone: '&#xe631;',
                        qq: '&#xe709;',
                    }
                var $obj = config.obj,
                    shareLi = ''
                for (var i in config.shareSelect) {
                    if (config.shareSelect[i] == 'wechat') {
                        shareLi += '<a target="_blank" href="' + select[config.shareSelect[i]] + '" class="_templateIcon ' + config.shareSelect[i] + '" data-cmd="' + config.shareSelect[i] + '">' + iconList[config.shareSelect[i]] + '<div class="_wechatqrcode"><h4>微信扫一扫：分享</h4><div id="qrcode"></div><div class="help"><p>微信里点“发现”，扫一下</p><p>二维码便可将本文分享至朋友圈。</p></div></div></a>'
                    } else {
                        shareLi += '<a target="_blank" href="' + select[config.shareSelect[i]] + '" class="_templateIcon ' + config.shareSelect[i] + '" data-cmd="' + config.shareSelect[i] + '">' + iconList[config.shareSelect[i]] + '</a>'
                    }
                }
                $obj.innerHTML = shareLi
                new QRCode(document.getElementById("qrcode"), config.shareUrl);
                //http://service.weibo.com/share/share.php?url={url}&title={title}&pic={pic}&searchPic=false';
                console.log(select.qzone)
            },
            /**
             *瀑布流
             * @param {*} $ul 列表父级
             * @param {Number} row 几列
             * @param {Number} border 边距
             */
            waterfall: function (config) {
                if (Object.assign != undefined) {
                    config = Object.assign({
                        $ul: '',
                        row: 4,
                        border: 20,
                    }, config);
                }
                var li_bottom = config.border
                var $li = config.$ul.children;
                var max_H = 0

                function ul_begin(row) {
                    var h = [];
                    var li_W = (config.$ul.offsetWidth - (config.border * (row - 1))) / row;
                    var li_WB = (config.$ul.offsetWidth - (config.border * (row - 1))) / row + config.border;
                    for (var i = 0; i < $li.length; i++) {
                        config.$ul.children[i].style.width = li_W + 'px'
                        li_H = $li[i].offsetHeight + li_bottom;
                        if (i < row) {
                            h[i] = li_H;
                            $li[i].style.top = 0;
                            $li[i].style.left = i * li_W + 'px';
                            if ($li[i].offsetLeft != 0) {
                                $li[i].style.left = i * li_WB + 'px';
                            }
                        } else {
                            min_H = Math.min.apply(null, h);
                            minKey = getarraykey(h, min_H);
                            h[minKey] += li_H;
                            $li[i].style.top = min_H + 'px';
                            $li[i].style.left = minKey * li_W + 'px';
                            if ($li[i].offsetLeft != 0) {
                                //$li[i].style.left = i * li_WB + 'px';
                                $li[i].style.left = minKey * li_WB + 'px';
                            }
                        }
                        max_H = Math.max.apply(null, h);

                    }
                    config.$ul.style.height = max_H + 'px'
                }

                function getarraykey(s, v) {
                    for (k in s) {
                        if (s[k] == v) {
                            return k;
                        }
                    }
                }
                ul_begin(config.row);
                window.onresize = function () {
                    if (document.body.clientWidth <= 1024 && document.body.clientWidth >= 768) {
                        row = 2
                    } else if (document.body.clientWidth < 768) {
                        row = 1
                    } else {
                        row = config.row
                    }
                    ul_begin(row);
                };
            },
            /************************************************************************
             * 表单判定
             ************************************************************************/
            /**
             * 验证手机号码
             * 
             * @param {Number}  传入的手机号码
             * @return        true||false
             */
            regPhone: function (phone) {
                reg = /^(13|15|17|18|19|14)[0-9]{9}$/;
                return reg.test(phone);
            },
            /**
             *验证数字
             *
             * @param {Number} number 数字
             * @return        true||false
             */
            regNumber: function (number) {
                reg = /^[0-9]*$/;
                return reg.test(number);
            },
            /**
             * 姓名 || 只能输入中英文
             * @param {String}   名字
             * @return          true||false
             */
            regName: function (name) {
                reg = /^[\u4E00-\u9FA5A-Za-z]+$/;
                return reg.test(name);
            },
            /**
             *
             *判断身份证号码是否符合要求
             * @param {Number} IDcard 身份证
             * @return      true||false
             */
            regID: function (IDcard) {
                reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
                return reg.test(IDcard);
            },
            /**
             *
             *判断邮箱符合要求
             * @param {Number} IDcard 身份证
             * @return      true||false
             */
            regEmail: function (Email) {
                reg = /^\w+\@+[0-9a-zA-Z]+\.(com|com.cn|edu|hk|cn|net)$/;
                return reg.test(Email);
            },
            /**
             *判定是否空或者空格
             *
             * @param {*} Null
             */
            regNull: function (Null) {
                if (Null == "") return true;
                var regu = "^[ ]+$";
                var re = new RegExp(regu);
                return re.test(Null);
            },
            /************************************************************************
             * DOMs 节点
             ************************************************************************/
            /**
             *判断是class 还是id
             * @param {*} ele 判定的dom
             * @returns 返回对应的预备定义
             */
            ifIDorClass: function (ele) {
                if (ele == null) {
                    return false
                } else if (ele.indexOf('.') == 0) {
                    return document.getElementsByClassName(ele.substr(1))
                } else if (ele.indexOf('#') == 0) {
                    return document.getElementById(ele.substr(1))
                }
            },
            /**
             *判定是否有class
             *
             * @param {*} ele 判定的dom
             * @param {String} cls 判定的class
             * @return          true||false
             */
            hasClass: function (ele, cls) {
                return ele.className.match(new RegExp("(\\s|^)" + cls + "(\\s|$)"));
            },
            /**
             *为指定的dom元素添加样式
             *
             * @param {*} ele 指定的dom
             * @param {String} cls 添加的class
             */
            addClass: function (ele, cls) {
                if (!util.hasClass(ele, cls)) ele.className += " " + cls;
            },
            /**
             *删除指定dom元素的样式
             *
             * @param {*} ele 指定的dom
             * @param {String} cls 删除的class
             */
            removeClass: function (ele, cls) {
                if (util.hasClass(ele, cls)) {
                    var reg = new RegExp("(\\s|^)" + cls + "(\\s|$)");
                    ele.className = ele.className.replace(reg, "");
                }
            },
            /**
             *指定dom添加和删除相同class
             *
             * @param {*} ele
             * @param {*} cls
             */
            toggleClass: function (ele, cls) {
                if (util.hasClass(ele, cls)) {
                    util.removeClass(ele, cls);
                } else {
                    util.addClass(ele, cls);
                }
            },

            /************************************************************************
             * browser浏览器
             ************************************************************************/
            /**
             * // 获取 url 中的参数值
             *
             * @param {*} name 需要获取的参数名
             * @returns 值 || null
             */
            getSearch: function (name) {
                var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
                var r = window.location.search.substr(1).match(reg);
                return r ? decodeURIComponent(r[2]) : null;
            },

            /**
             * 判定访问类型是电脑还是移动端
             * @returns 返回访问类型
             */
            userAgent: function (e) {
                if ((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i))) {
                    /*window.location.href="你的手机版地址";*/
                    return 'Mobile'
                } else {
                    /*window.location.href="你的电脑版地址";    */
                    return 'pc'
                }
            },
            /************************************************************************
             * 日期类
             ************************************************************************/
            /**
             *时间戳
             *
             * @param {Number} timestamp 时间戳
             * @returns 转换成的时间
             * 
             * Conversion[] 转变后的时间
             * Remaining[] 转变后到实际
             */
            CountdownNumber: function (timestamp) {
                var timeBox = {
                    Conversion: [],
                    Remaining: []
                }
                var difference = 0
                var currentTimer = Math.floor(new Date().getTime() / 1000);
                var dd_ = 0,
                    hh_ = 0,
                    mm_ = 0,
                    ss_ = 0;
                difference = timestamp - currentTimer;
                dd_ = Math.floor(difference / (60 * 60 * 24)); //计算剩余的天数
                hh_ = Math.floor(difference / (60 * 60)) - (dd_ * 24) //计算剩余的小时数
                mm_ = Math.floor(difference / 60) - (dd_ * 24 * 60) - (hh_ * 60) //计算剩余的分钟数
                ss_ = Math.floor(difference) - (dd_ * 24 * 60 * 60) - (hh_ * 60 * 60) - (mm_ * 60) //计算剩余的秒数
                if (hh_ <= 9) hh_ = '0' + hh_;
                if (mm_ <= 9) mm_ = '0' + mm_;
                if (ss_ <= 9) ss_ = '0' + ss_;
                var time = new Date(timestamp * 1000)
                timeBox.Conversion.Year = time.getFullYear()
                timeBox.Conversion.Month = time.getMonth()
                timeBox.Conversion.Date = time.getDate()
                timeBox.Conversion.Hours = time.getHours()
                timeBox.Conversion.Minutes = time.getMinutes()
                timeBox.Remaining.day = dd_
                timeBox.Remaining.Hours = hh_
                timeBox.Remaining.Minutes = mm_
                timeBox.Remaining.second = ss_
                return timeBox
            },
            /************************************************************************
             * 字符串类
             ************************************************************************/
            // 截取给定长度的字符串
            truncate: function (str, string, len) {
                if (string.length > len) {
                    string = string.substring(str, len);
                }
                return string;
            },
            /************************************************************************
             * 移动端问题
             ************************************************************************/

            /**
             * 表单抖动  
             *
             * @param {*} e
             * @retyrbs 用于全屏表单，键盘弹出后，退出导致input错位
             */
            inputShakeIos: function (e) {
                document.body.addEventListener('focusin', function () {
                    //软键盘弹出的事件处理
                    isReset = false;
                });
                document.body.addEventListener('focusout', function () {
                    //软键盘收起的事件处理
                    isReset = true;
                    setTimeout(function () {
                        //当焦点在弹出层的输入框之间切换时先不归位
                        if (isReset) {
                            window.scroll(0, 0); //失焦后强制让页面归位
                        }
                    }, 300);
                });
            },
            /**
             * 表单抖动  
             *
             * @param {*} e
             * @retyrbs 用于全屏表单，键盘弹出后，退出导致input错位
             */
            inputShakeAndroid: function (e) {
                window.onresize = function () {
                    //键盘弹起与隐藏都会引起窗口的高度发生变化
                    var resizeHeight = document.documentElement.clientHeight || document.body.clientHeight;

                    if (resizeHeight < h) {
                        //当软键盘弹起，在此处操作
                        isReset = false;
                    } else {
                        //当软键盘收起，在此处操作
                        isReset = true;
                        setTimeout(function () {
                            if (isReset) {
                                window.scroll(0, 0); //失焦后强制让页面归位
                            }
                        }, 300);
                    }
                };
            },
            /************************************************************************
             * 其他
             ************************************************************************/
            /**
             *防止iframe嵌套
             *
             */
            isTop: function () {
                var isInTest = false
                if (sessionStorage || window.sessionStorage) {
                    if (window.location.search) {
                        if (window.location.search.indexOf('isInTest') !== -1) {
                            sessionStorage.setItem('isInTest', true)
                        }
                    }
                    isInTest = Boolean(sessionStorage.getItem('isInTest'))
                }
                if (window.self !== window.top && !isInTest) {
                    window.location.href = 'http://www.shuwon.com'
                }
            },
            /**
             * 蜀美项目监控 
             */
            shuwonProject: function () {
                if (/shuwon/.test(location.search) || sessionStorage.getItem('debugger') == '12345677') {
                    sessionStorage.setItem("debugger", "12345677");
                } else {
                    $.post("http://project.shuwon.cn/api/project/stop", {
                        url: location.origin
                    }, function (data) {
                        if (data.result) window.location.href = "http://www.shuwon.com/over/";
                    })
                }
            },

        }
    }
    return util;
    //}
})));