<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="LearnContent.aspx.cs" Inherits="RM.Web.Training.Learn.LearnContent" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title><%=csname %>_<%=RM.Common.DotNetConfig.LanguageHelper.GetKey("Courseware_SfenModel")%></title>
    <link href="../../Themes/Styles/Site.css" rel="stylesheet" type="text/css" />
    <link href="m/Learn.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
        h1 { font-size: 18px; color: #434242; margin: 10px; font-weight: normal; }
        h1 span { color: Blue; }
        .left_win { position: absolute; top: 0; left: 0; width: 250px; height: 100%; background-color: #f4f4f4; border-right: 1px #dcdcdc solid; }
        .left_winvideo { text-align: left; position: relative; background-color: #020301; background-image: url('m/learnplay_bg.gif'); background-position: center; background-repeat: no-repeat; height: 200px; z-index: 999; }
        .zhangjie { margin: 10px; padding: 0; }
        .zhangjie li { margin: 3px 0; padding: 0; list-style: none; text-align: center; padding: 3px; margin-right: 5px; color: #434242; background-color: White; border: 1px #dcdcdc solid; }
        .zhangjie li:hover { background-color: #04d204; }
        .zhangjie li:hover a { color: White; }
        .zhangjie .hover { background-color: #04d204; }
        .zhangjie .hover a { color: White; }
        .zhangjie .old { background-color: #f4f4f4; }
        .zhangjie .old a { color: #999; }
        .center_win { padding-left: 250px; padding-right: 40px; }
        .right_win { position: absolute; right: 0; background-color: #f4f4f4; width: 40px; height: 100%; border-left: 1px #dcdcdc solid; text-align: center; }
        .right_win a { display: block; height: 35px; border-bottom: 1px #dcdcdc solid; padding-top: 5px; }
        .right_win a:hover { background-color: #e9e9e9; }
        .right_win .hover { background-color: #e9e9e9; width: 41px; }
    </style>
</head>
<body>
    <!----------------------------左侧视频与章节互动----------------------------------->
    <div class="left_win" id="">
        <div class="left_winvideo">
            <div id="video">
                <div id="a1">
                </div>
            </div>
        </div>
        <div class="zhangjie">
            <%=ziyuan %>
        </div>
    </div>
    <!----------------------------左侧结束----------------------------------->
    <div class="right_win" id="left_menu">
        <a href="#" class="hover">
            <img alt='<%=RM.Common.DotNetConfig.LanguageHelper.GetKey("Courseware_wendang")%>' src="../../Themes/Images/16/projection-screen-presentation.png" /><br />
            <%=RM.Common.DotNetConfig.LanguageHelper.GetKey("Courseware_wendang")%></a>
    </div>
    <!----------------------------右侧菜单结束----------------------------------->
    <!----------------------------主体讲义开始----------------------------------->
    <div class="center_win">
        <div id="video2">
            <div id="a2">
            </div>
        </div>
         <h1>
            <%=csname %><span id="cstitle"><%=RM.Common.DotNetConfig.LanguageHelper.GetKey("Learn_firstjie")%></span></h1>            
    </div>
    <!----------------------------主体讲义结束----------------------------------->
    <script src="/Themes/Scripts/jquery-1.8.2.min.js" type="text/javascript"></script>
    <script src="/Themes/Scripts/FunctionJS.js" type="text/javascript"></script>
    <script type="text/javascript" src="/Training/Learn/m/ckplayer/ckplayer.js" charset="utf-8"></script>
    <script type="text/javascript">
    var playTime = 0;  //全局变量，当前视频播放时间,单位秒
    var playVodieId = "";
    var dqbh = 0; //当前应该播放的视频索引，默认是0
    var flvurl = new Array(); //视频地址组
    var API = "NOTSCRIPT";
    <%=varstring %>
     playerstop(); //默认页面加载的时候先运行一次播放当前索引为0的视频
     $(function () {
        iframeresize(); //自动调整页面自适应尺寸
        setInterval(Setlearntime, 10000); //统计学习时间,10秒统计1次，越小统计精度越大
    });
     //视频高度自适应
     function iframeresize() {
            resizeU();
            $(window).resize(resizeU);
            function resizeU() {
                var divkuangH = $(window).height();
                $("#left_menu").css("height", divkuangH);
            }
     }
     function playerstop(obj) {
         //这是点击视频名称的动作，把要播放的视频索引赋给当前要播放的视频索引然后调用播放类（也就是视频结束类）
        CKobject._K_('video').innerHTML = '<div id="a1"></div>';
        $("#interMain").html("<center style=\"color: #999;\"><%=RM.Common.DotNetConfig.LanguageHelper.GetKey("Learn_notfayan")%></center>");        
        if (obj == undefined || obj == null) {
            //设置当前播放的列表样式
            for (var i = 0; i < flvurl.length; i++) {
                if (i == dqbh) {
                    //alert("2");
                    CKobject._K_('list_' + i).className = 'hover'; //设置新的样式
                    $("#cstitle").html($("#list_" + i).find("a").text());
                    playVodieId = $("#list_" + i).find("a").attr("id"); //得到现在播放的ID
                }
            }
        } else {
            $(obj).parent().removeClass("old").addClass("hover");
            $("#cstitle").html($(obj).text());
            playVodieId = $(obj).attr("id"); //得到现在播放的ID
        }

        //设置列表样式结束
        var flashvars = {
            f: flvurl[dqbh],
            c: 0,
            b: 0,
            p: 0,
            e: 0
        };
        var params = { bgcolor: '#000', allowFullScreen: true, allowScriptAccess: 'always', wmode: 'opaque' };
        CKobject.embedSWF('/Training/Learn/m/ckplayer/ckplayer.swf', 'a1', 'ckplayer_a1', '100%', '200', flashvars, params);


        //当为MP4格式时调用HTML5
    var houzhui = flvurl[dqbh].substring(flvurl[dqbh].lastIndexOf(".") + 1);



        //将讲义也同步加载进来
        var flashjy = {
            f: flvurl[dqbh].replace("."+houzhui,"_cz.flv"),
            c: 0,
            b: 0,
            p: 0,
            e: 0
        };
        CKobject.embedSWF('/Training/Learn/m/ckplayer/ckplayer.swf', 'a2', 'ckplayer_a2', '100%', '600', flashjy, params);
        

    
    if (!CKobject.Flash()['f']) {//当系统不支持FLASH时
        if (browser.versions.android) {//安卓建议安装flash, 这样才能支持横屏
            $("#noflash").html("<a href=\"http://www.newstartsoft.com/flashplayer.apk\"  target=\"_blank\" style=\"color:red\"><%=RM.Common.DotNetConfig.LanguageHelper.GetKey("Learn_anzhuangflash")%></a>");
            document.getElementById("noflash").style.display = "block";
        }
        else {
            if (houzhui == "mp4") {
                var video = [flvurl[dqbh] + '->video/mp4'];
                var support = ['iPad', 'iPhone', 'ios', 'android', 'msie10+false', 'webKit', 'IEMobile'];
                CKobject.embedHTML5('video', 'ckplayer_a1', '100%', '200', video, flashvars, support);
            }
        }
     }
     dqbh = dqbh + 1; //把正在播放的视频的索引+1得到下个视频的索引用来做循环播放
     if (dqbh >= flvurl.length) {
            //全部视频都播放完成后，目前回到第一个视频，也可以对用户进行提示
            dqbh = 0;
     }
    }
    function playload(obj, str) {
        dqbh = str;
        playerstop(obj);
    }
    //更新统计学习时间
    function Setlearntime() {
        $.get("/Training/Learn/Interacts.ashx?Key=" + QueryString("Key") + "&t=" + zanting);
    }
    //视频播放
    function playstart() {
        
    }
    //播放状态监控
    var zanting = 1;
    function ckplayer_status(str) {
        //103暂停，102开始播放，101播放结束，105全屏，108加载结束（准备就绪）
        
        var nowtime = str.substring(0, 5);
        if (nowtime == "time:") {
            playTime = str.substr(5); //当前播放时间
            zanting = 1;
            Tongbu();
        }
    }
    function Tongbu()
    {
        try{
        var a1status = CKobject.getObjectById('ckplayer_a1').getStatus();
        var a2status = CKobject.getObjectById('ckplayer_a2').getStatus();
        if(a2status != null && a2status != undefined)
        {
            if(a2status.play)
            {
               CKobject.getObjectById('ckplayer_a1').videoPlay();
            }
            else
            {
               CKobject.getObjectById('ckplayer_a1').videoPause();
            }
        }
        }
        catch(e){alert(e)}
    }
    </script>
</body>
</html>
