{% load staticfiles %}

<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="format-detection" content="telephone=no,email=no,address=no">
        <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no">
        <title>课程列表</title>

        <link href="//res.wx.qq.com/open/libs/weui/0.4.3/weui.min.css" rel="stylesheet" type="text/css" />
        <link href="{% static 'page/css/weui.ext.css' %}?v=1" rel="stylesheet" type="text/css" />

        <style>
            .container {
                position: absolute;
                top: 0;
                right: 0;
                bottom: 0;
                left: 0;
                background: #efefef;
            }
            .course_wrapper {
                text-align: center;
                background: white;
                margin-bottom: 20px;
                padding: 15px 0;
            }
            .course_name {
                font-size: 18px;
                font-weight: bold;
                color: #020001;
            }
            .course_time {
                font-size: 12px;
                color: #999;
            }
            .course_cover>img {
                width: 80%;
                border-radius: 5px;
            }
        </style>
    </head>
    <body>
        <div class="container" >
            {% for course in courses %}
                <div class="course_wrapper" data-courseid="{{ course.course_id }}">
                    <div class="course_name">{{ course.course_name }}</div>
                    <div class="course_time">{{ course.course_time }}分钟</div>
                    <div class="course_cover"><img src="{{ course.course_cover_url }}"></div>
                </div>
            {% endfor %}
        </div>

        <script src="//cdn.bootcss.com/zepto/1.1.6/zepto.min.js"></script>
        <script>
            $(function() {
                $('.course_wrapper').click(function () {
                    window.location.href = '{{ domain }}/page/course/info?course_id=' + $(this).attr('data-courseid') + '&{{ params|safe }}';
                })
            });
        </script>
        <script type="text/javascript" src="//res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
        <script type="text/javascript" src="{% static 'course/js/jswe-0.0.1.js' %}"></script>
        <script>
            V.initWxData({
                imgUrl: 'http://pai.ai/static/pai2/img/paiai_96_96.png',
                link: 'http://pai.ai/we/o?redirect_url=http://xfoto.com.cn/api/3rd/or',
                desc: '兰海说成长',
                title: '兰海说成长',
                timeLine: ''
            }, true);
        </script>
    </body>
</html>