<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <script type="text/javascript">

        if (/Android (\d+\.\d+)/.test(navigator.userAgent)) {
            var version = parseFloat(RegExp.$1);
            if (version > 2.3) {
                var phoneScale = parseInt(window.screen.width) / 640;
                document.write('<meta name="viewport" content="width=640, minimum-scale = ' + phoneScale + ', maximum-scale = ' + phoneScale + ', target-densitydpi=device-dpi">');
            } else {
                document.write('<meta name="viewport" content="width=640, target-densitydpi=device-dpi">');
            }
        } else {
            document.write('<meta name="viewport" content="width=640, user-scalable=no, target-densitydpi=device-dpi">');
        }
    </script>
    <meta name="format-detection" content="telephone=no"/>
    <meta name="apple-mobile-web-app-capable" content="yes">
    <title>新年好口福，17喜刷刷</title>

    <link href="__CDN__/css/main.css?t=1" rel="stylesheet">
    <link href="__CDN__/css/swiper.min.css" rel="stylesheet">
    <style>
    </style>
</head>
<body>
<div id="container">
    <input type="hidden" id="share_type" name="share_id"
           value="0"/>
    <div id="page_loading" class="page page_loading" style="display: block">

        <div class="loading_word"></div>
        <div class="progres">

        </div>
        <img class="progres" src="__CDN__/images/j-d.png">
    </div>
    <div class="swiper-container" style="display: none">
        <div class="swiper-wrapper">
            <div id="page_one" class="page page_one swiper-slide" style="display: block">

            </div>
            <div id="page_two" class="page page_two swiper-slide" style="display: block">

            </div>
            <div id="page_three" class="page page_three swiper-slide" style="display: block">

            </div>

            <div id="page_photo" class="page page_photo swiper-slide swiper-no-swiping" style="display: block">


                <div class="photo_bj_two" style="display: none"></div>
                <div id="photo" style="display: none">
                    <canvas width="0" height="0" ></canvas>
                    <div id="action" style="width:100%;height:100%;position: absolute;top:0px;left:0px"></div>
                </div>
                <input type="file" name="image" accept="image/*" capture="camera" style="display: none;">
                <div class="map" style="display: block"></div>
                <div class="left" style="display: none"></div>
                <div class="right" style="display: none"></div>
                <div class="btn_custom" style="display: block"></div>
            </div>

        </div>
    </div>

    <div id="page_bj_two" class="page page_bj_two" style="display: none">
        <img class="photo_map" src="__CDN__/images/three.jpg">
        <div class="btn_heavy"></div>
        <div class="btn_build"></div>

    </div>
    <div class="page page_checking" style="display: none">
        <div class="checking" style="display: block;z-index: 99">
            <div class="checkShow">
                <div></div>
            </div>
            <div class="text_" style="color: white">
                生成海报中，<br>莫捉急～
            </div>
        </div>
    </div>
    <div id="page_end" class="page page_end" style="display: none">
        <img class="photo" src="">
        <img class="photo_two" src="/Public/static/images/end_bj_t.jpg" style="display: none">
        <div class="map_l"></div>
        <div class="btn_share"></div>
    </div>

</div>

<script type="text/javascript"
src="http://api2.izhida.cn/wechat_js_config?app_id=wx4c3c856ab83a946b&v=1.2.1&api_list=all&app_stat_key=FhDnDjEF8Zjw52Xk"></script>
<script type="text/javascript" src="__CDN__/js/jquery-2.1.3.min.js"></script>
<script src="__CDN__/js/swiper.min.js"></script>
<script type="text/javascript" src="__CDN__/js/fastclick.min.js"></script>
<script type="text/javascript" src="__CDN__/js/hammer.min.js"></script>
<script type="text/javascript" src="__CDN__/js/exif.js"></script>
<script type="text/javascript" src="__CDN__/js/jquery.lazylinepainter-1.5.1.min.js"></script>
<script type="text/javascript" src="__CDN__/js/lrz.mobile.min.js"></script>
<script type="text/javascript" src="__CDN__/js/index.js?t=7"></script>
<link href="__CDN__/css/notify.css" rel="stylesheet">
<script type="text/javascript" src="__CDN__/js/jquery-notify.js"></script>
<script>
    $( function(){
        var image_arr = {:$image};
        var loading = $('.page_loading'), loading_text = $(".loading_word");
        var loading_resource = function () {
            var resource = image_arr;
            var img_total = resource.length, loaded_count = 0;
            var do_load = function (url) {
                var img = new Image();
                img.onload = function () {
                    ++loaded_count;
                    loading_text.text(parseInt((loaded_count / img_total) * 100) + "%");
                    $('.progres').css('width',(loaded_count / img_total) * 100 *0.38 + '%');
                };
                img.src = url;
            };
            for (var i = 0; i < img_total; ++i) {
                do_load(resource[i]);
            }
            var check_time = 60;
            var plush_page = function () {};
            var check = function () {
                if (0 >= check_time) {
                    if (loaded_count / img_total > .5) {
                        plush_page();
                    } else {
                        alert('加载图片失败，请返回刷新尝试!');
                    }
                } else {
                    check_time -= .5;
                    if (loaded_count == img_total) {
                        plush_page();
                    } else {
                        setTimeout(check, 1000);
                    }
                }
            };
            return function (cb) {
                if (typeof(cb) == 'function')plush_page = cb;
                check();
            }
        }();
        loading_resource(function () {
            loading.remove();
            $('.swiper-container').show();
            var swiper = new Swiper('.swiper-container', {
                pagination: '.swiper-pagination',
                paginationClickable: true,
                autoplay : 1400,
                speed:1500,
                autoplayDisableOnInteraction : false,
                autoplayStopOnLast : true,
                onReachEnd: function(swiper){
                  $('.left').show();
                    $('.right').show();
                    setTimeout(function () {
                        $('.left').hide();
                        $('.right').hide();
                    }, 3000);
                }
            });

        });
    } );
</script>

</body>
</html>