<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge" charset="utf-8" />
<title>学点云课堂</title>
<link rel="stylesheet" type="text/css" href="css/amazeui.min.css">
<link rel="stylesheet" type="text/css" href="css/main.css">
<script type="text/javascript" src="src/xdyVideo.js"></script>
<!--拖拽工具条-->
<script type="text/javascript" src="js/xdyEvent.js"></script>
<script type="text/javascript" src="js/drag.js"></script>
<script type="text/javascript" src="js/McuClient.js?v=1.0.227.20"></script>
<!--<script type="text/javascript" src="http://192.168.1.140/McuClient/McuClient.js?7299033236"></script>-->
<script type="text/javascript" src="js/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="src/main.js"></script>
<!--<!–白板–>-->
<script type="text/javascript" src="js/index.js"></script>
<script src="js/draw.js"></script>
<script type="text/javascript" src="js/pdf.js"></script>
<script type="text/javascript" src="js/pdf.worker.js"></script>
<script type="text/javascript" src="src/videoWithFlash.js"></script>
<!--<script type="text/javascript" src="src/nativeVideo.js"></script>-->
</head>
<body>
<!--弹出框-->
<button
type="button"
class="am-btn am-btn-primary pop"
data-am-modal="{target: '#my-alert'}">
Alert
</button>
<div class="am-modal am-modal-alert am-modal-active popheight" tabindex="-1" id="my-alert">
<div class="am-modal-dialog ">
<div class="am-modal-bd">
error1:失败了!请重新点击!
</div>
<div class="am-modal-footer">
<span class="am-modal-btn popBtn">确定</span>
</div>
</div>
</div>
<!--loading-->
<div class="loading-index">
<div class="loadEffect">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
</div>
</div>
<!--1v1互动课堂-->
<div class="box">
<!--头部-->
<div class="header clear">
<li class="cur-status">
<span id="no-start" class="no-start iconfont"></span>
<div id='live' class="live active">
<i></i>
<i></i>
<i></i>
<i></i>
</div>
<a id="a-status" href="javascript: void(0)">未开始</a></li>
<li class="classroom"><a href="javascript: void(0)">[少儿英语口语]第四节</a></li>
<!--设置-->
<div class="am-dropdown" data-am-dropdown>
<button id="openCamera" class="setting am-btn am-btn-primary am-dropdown-toggle "
data-am-modal="{target: '#setting-modal-1', closeViaDimmer: 0, width: 405, height: 400}"
data-am-dropdown-toggle><span class="span-setting iconfont"></span>设置
</button>
</div>
<!--设置弹出层-->
<!--<div class="am-modal am-modal-no-btn" tabindex="-1" id="setting-modal-1">-->
<!--<div class="am-modal-dialog">-->
<!--<div class="setting-headline">设置-->
<!--<a href="javascript: void(0)" class="iconfont" data-am-modal-close><img id="close-cam" src="images/close.png"></a>-->
<!--</div>-->
<!--<ul class="am-modal-bd-setting">-->
<!--<li class="clear">-->
<!--<span>摄像头</span>-->
<!--<select id="selectListVideo" class="SelectList">-->
<!--<option></option>-->
<!--</select>-->
<!--</li>-->
<!--<li>-->
<!--<video id="webcam" autoplay></video>-->
<!--</li>-->
<!--<li>-->
<!--<span>麦克风</span>-->
<!--<select id="selectListAudio" class="SelectList">-->
<!--<option></option>-->
<!--</select>-->
<!--</li>-->
<!--<li>-->
<!--<span >0</span>-->
<!--<span>%</span>-->
<!--<div class="scrollBar">-->
<!--<div class="scroll_Track"></div>-->
<!--<div class="scroll_Thumb"></div>-->
<!--</div>-->
<!--<span class="setScrollBar-min"></span>-->
<!--<span>%</span>-->
<!--</li>-->
<!--<li>-->
<!--<p></p>-->
<!--<div id="set-voice-progress" class="set-voice-progress">-->
<!--<span id="set-loader1" class="set-voice-progress-span-1"></span>-->
<!--<span id="set-loader2" class="set-voice-progress-span-2"></span>-->
<!--<span id="set-loader3" class="set-voice-progress-span-3"></span>-->
<!--<span id="set-loader4" class="set-voice-progress-span-4"></span>-->
<!--<span id="set-loader5" class="set-voice-progress-span-5"></span>-->
<!--<span id="set-loader6" class="set-voice-progress-span-6"></span>-->
<!--<span id="set-loader7" class="set-voice-progress-span-7"></span>-->
<!--<span id="set-loader8" class="set-voice-progress-span-8"></span>-->
<!--<span id="set-loader9" class="set-voice-progress-span-9"></span>-->
<!--<span id="set-loader10" class="set-voice-progress-span-10"></span>-->
<!--<span id="set-loader11" class="set-voice-progress-span-11"></span>-->
<!--<span id="set-loader12" class="set-voice-progress-span-12"></span>-->
<!--</div>-->
<!--</li>-->
<!--</ul>-->
<!--</div>-->
<!--</div>-->
<!--帮助-->
<div class="am-dropdown" data-am-dropdown>
<a href="javascript: void(0)"><button class="am-btn am-btn-primary am-dropdown-toggle " data-am-dropdown-toggle><span
class="span-help iconfont"></span>帮助
</button></a>
</div>
<!--右侧未开始-->
<div class="am-dropdown" data-am-dropdown>
<button type="button" class="am-btn am-btn-primary am-dropdown-toggle " data-am-dropdown-toggle><span
id="span-iconfont" class="span-classes iconfont"></span><span id="class-now">未开始</span>
</button>
<ul class="am-dropdown-content">
<li><span id="am-dropdown-content-span-1" class="am-dropdown-content-span iconfont"></span>
<button id="classes-status-1" type="button"
class="am-btn am-btn-primary am-dropdown-content-button"
data-am-modal="{target: '#begin-classes', closeViaDimmer: 0, width: 340, height: 172}"
href="#">开始上课
</button>
</li>
<li><span class="am-dropdown-content-span iconfont"></span>
<button id="classes-status-2" type="button"
class="am-btn am-btn-primary am-dropdown-content-button"
data-am-modal="{target: '#end-classes', closeViaDimmer: 0, width: 340, height: 172}"
href="#">结束课堂
</button>
</li>
</ul>
</div>
<!--弹出层-正在上课-->
<div class="am-modal am-modal-no-btn" tabindex="-1" id="begin-classes">
<div class="am-modal-dialog">
<p id="p-text" class="p-text">确定开始录制吗?</p>
<div class="am-modal-confirm-cancel">
<button id="confirm" class="confirm" data-am-modal-close>确定</button>
<button class="cancel" data-am-modal-close>取消</button>
</div>
</div>
</div>
<!--弹出层-结束课堂-->
<div class="am-modal am-modal-no-btn" tabindex="-1" id="end-classes">
<div class="am-modal-dialog">
<p id="p-text-1" class="p-text">确定停止录制吗?</p>
<div class="am-modal-confirm-cancel">
<button id="confirm-1" data-am-modal-close type="button"
class="confirm am-btn am-btn-primary"
data-am-modal="{target: '#end-classes-1', closeViaDimmer: 0, width: 340, height: 172}">确定
</button>
<button class="cancel" data-am-modal-close>取消</button>
</div>
</div>
</div>
<!--弹出层-正在上课-->
<div class="am-modal am-modal-no-btn" tabindex="-1" id="end-classes-1">
<div class="am-modal-dialog">
<p class="p-text">确定要退出当前课堂吗?</p>
<div class="am-modal-confirm-cancel">
<button id="end" class="confirm" data-am-modal-close>结束课堂</button>
<button id="end-no-exit" class="cancel-1" data-am-modal-close>退出，不结束课堂</button>
</div>
</div>
</div>
</div>
<!--内容-->
<div class="content clear">
<!--左侧-->
<div id="left" class="left">
<!--<div class="am-tabs" data-am-tabs>-->
<!--<div id="tab-box" class="am-tabs-bd">-->
<!--<div class="am-tab-panel am-fade am-in am-active" id="tab1">-->
<!--引入canvas画板-->
<div id="draw" class="clear">
<div class="canvas_container">
<canvas id="canvas">
浏览器不支持
</canvas>
<!--<div id="docOuter" class="docOuter">-->
<img class="showImg" id="showImg"/>
<!--文档层-->
<img id="docImage" class="docImage">
</img>
<canvas id="canvas_bak"></canvas>
<!--</div>-->
</div>
<!--画板的工具栏-->
<div id="tool" class="tool">
<ul class="draw_controller cf">
<li class=" showColor" id="chooseColor" title="选择颜色">
<!--颜色板-->
<div id="tool-color" class="tool-color">
<ul class="draw_controller cf">
<li id="li-Color1" class="Color1" title="#4fbd92" value="#4fbd92"
onclick="choose(1)"></li>
<li id="li-Color2" class="Color2" title="#0071bc" value="#0071bc"
onclick="choose(2)"></li>
<li id="li-Color3" class="Color3" title="#6a0db2" value="#6a0db2"
onclick="choose(3)"></li>
<li id="li-Color4" class="Color4" title="#fae81b" value="#fae81b"
onclick="choose(4)"></li>
<li id="li-Color5" class="Color5" title="#f7751e" value="#f7751e"
onclick="choose(5)"></li>
<li id="li-Color6" class="Color6" title="#b8242a" value="#b8242a"
onclick="choose(6)"></li>
<li id="li-Color7" class="Color7" title="#4fbd92" value="#4fbd92"
onclick="choose(7)"></li>
</ul>
</div>
</li>
<li class=" pencil" title="铅笔"></li>
<li class="rescind" title="撤销上一步操作"></li>
<!--<li class="square" title="方形"></li>-->
<!--<li class="drawLine" title="画直线"></li>-->
<!--<li class="circle" title="圆"></li>-->
<!--<li class="laserPen" title="激光笔"></li>-->
<!--<li class="canvasText" title="文字"></li>-->
<!--<li class=" rubber" title="橡皮擦"></li>-->
<li class="clearContext" title="清屏"></li>
</ul>
</div>
</div>
<!--</div>-->
<!--</div>-->
<!--</div>-->
<!--文档上传的列表-->
<div class="am-modal am-modal-no-btn" tabindex="-1" id="doc-modal-1">
<div class="am-modal-dialog">
<div class="doc-headline">文档列表
<a href="javascript: void(0)" class="iconfont" data-am-modal-close></a>
</div>
<div class="am-modal-bd-file">
<div id="pushFile" class="push-file clear">
<span class="iconfont"></span>
<a>上传文件</a>
</div>
<a><input type="file" id="file" onchange="importFile();"></a>
<ul id="fileUl" class="file-ul">
</ul>
</div>
</div>
</div>
<!--文档和视频切换,视频控制区域-->
<div class="control">
<ul class="clear">
<!--<li class="voice-on-off iconfont"></li>-->
<!--<li class="voice-progress">-->
<!--<div id="Demo">-->
<!--<div id="Main">-->
<!--<div id="scrollBar">-->
<!--<div id="scroll_Track"></div>-->
<!--<div id="scroll_Thumb"></div>-->
<!--</div>-->
<!--</div>-->
<!--</div>-->
<!--</li>-->
<li class="fileUpload iconfont" data-am-modal="{target: '#doc-modal-1', closeViaDimmer: 0, width: 398, height: 288}"></li>
<li class="next-page "><a id="nextPage" href="javascript:void(0)"></a></li>
<li class="total-page"><span id="totalPageNum">0</span></li>
<li class="bias">/</li>
<li class="cur-page"><span id="curPageNum">0</span></li>
<li class="prev"><a id="prevPage" href="javascript:void(0)"></a></li>
</ul>
</div>
</div>
<!--右侧-->
<div id="right" class="right">
<div class="studentVideo">
<img>
<div id="stuVideo-video" class="stuVideo-video iconfont"></div>
<div id="stuVideo-voice" class="stuVideo-voice iconfont"></div>
<!--<span>lucy</span>-->
</div>
<div class="teacherVideo">
<div class="publish" style="position:absolute;top: 0; width:240px;height:180px">
<div id="publish"></div>
</div>
<div class="play" style="position:absolute;top: 0; width:240px;height:180px">
<div id="play"></div>
</div>
<img class="teacherVideoBg"/>
<div id="teacherVideo-video" class="teacherVideo-video iconfont"></div>
<div id="teacherVideo-voice" class="teacherVideo-voice iconfont"></div>
</div>
<!--聊天区域-->
<div class="chat">
<div class="msg-border">
<div id="panel_message" class="msg clear">
<!--<div class="teacher-msg "><img src="images/teacher-photo.png" alt="老师头像">-->
<!--<p class="left">哇哦。。。。。。</p></div>-->
<!--<div class="student-msg"><img src="images/student-photo.png" alt="学生头像">-->
<!--<p class="right">哇哦。。。。。。</p></div>-->
</div>
</div>
<div class="input-send clear">
<button id="btn_send" class="send" type="submit">发送</button>
<div class="input-face">
<input id="txt_message" maxlength="20" type="text"/>
<span id="face" class="face iconfont"></span>
</div>
</div>
</div>
<!--表情列表-->
<div id="facelist" class="swiper-container">
<div class="inner-slide" id="inner-slide">
<div id="slide1" class="swiper-slide">
<ul>
<li><img src="images/face/aimu.gif" data-type="aimu">
</li>
<li><img src="images/face/daxiao.gif" data-type="daxiao">
</li>
<li><img src="images/face/huaixiao.gif" data-type="huaixiao">
</li>
<li><img src="images/face/liuhan.gif" data-type="liuhan">
</li>
<li><img src="images/face/shuijiao.gif" data-type="shuijiao">
</li>
<li><img src="images/face/yiwen.gif" data-type="yiwen">
</li>
<li><img src="images/face/aoman.gif" data-type="aoman">
</li>
<li><img src="images/face/jiew.gif" data-type="jiew">
</li>
<li><img src="images/face/liulei.gif" data-type="liulei">
</li>
<li><img src="images/face/sun.gif" data-type="sun">
</li>
<li><img src="images/face/youhh.gif" data-type="youhh">
</li>
<li><img src="images/face/baiyan.gif" data-type="baiyan">
</li>
<li><img src="images/face/fadai.gif" data-type="fadai">
</li>
<li><img src="images/face/jingkong.gif" data-type="jingkong">
</li>
<li><img src="images/face/meiyan.gif" data-type="meiyan">
</li>
<li><img src="images/face/tiaoxie.gif" data-type="tiaoxie">
</li>
<li><img src="images/face/yue.gif" data-type="yue">
</li>
<li><img src="images/face/baoquan.gif" data-type="baoquan">
</li>
<li><img src="images/face/fanu.gif" data-type="fanu">
</li>
<li><img src="images/face/jingya.gif" data-type="jingya">
</li>
<li><img src="images/face/mojing.gif" data-type="mojing">
</li>
<li><img src="images/face/touxiao.gif" data-type="touxiao">
</li>
<li><img src="images/face/yumen.gif" data-type="yumen">
</li>
<li><img src="images/face/bishi.gif" data-type="bishi">
</li>
<li><img src="images/face/fendou.gif" data-type="fendou">
</li>
<li><img src="images/face/kafei.gif" data-type="kafei">
</li>
<li><img src="images/face/piezui.gif" data-type="piezui">
</li>
<li><img src="images/face/tu.gif" data-type="tu">
</li>
<li><img src="images/face/yun.gif" data-type="yun">
</li>
<li><img src="images/face/bizui.gif" data-type="bizui">
</li>
<li><img src="images/face/ganga.gif" data-type="ganga">
</li>
<li><img src="images/face/kelian.gif" data-type="kelian">
</li>
</ul>
</div>
<div id="slide2" class="swiper-slide">
<ul>
<li><img src="images/face/pijiu.gif" data-type="pijiu">
</li>
<li><img src="images/face/weiqu.gif" data-type="weiqu">
</li>
<li><img src="images/face/zaijian.gif" data-type="zaijian">
</li>
<li><img src="images/face/cahan.gif" data-type="cahan">
</li>
<li><img src="images/face/guai.gif" data-type="guai">
</li>
<li><img src="images/face/koubi.gif" data-type="koubi">
</li>
<li><img src="images/face/qiang.gif" data-type="qiang">
</li>
<li><img src="images/face/weixiao.gif" data-type="weixiao">
</li>
<li><img src="images/face/zancheng.gif" data-type="zancheng">
</li>
<li><img src="images/face/cool.gif" data-type="cool">
</li>
<li><img src="images/face/guzhang.gif" data-type="guzhang">
</li>
<li><img src="images/face/kuaikl.gif" data-type="kuaikl">
</li>
<li><img src="images/face/qinqin.gif" data-type="qinqin">
</li>
<li><img src="images/face/woshou.gif" data-type="woshou">
</li>
<li><img src="images/face/zhemo.gif" data-type="zhemo">
</li>
<li><img src="images/face/dabing.gif" data-type="dabing">
</li>
<li><img src="images/face/hanxiao.gif" data-type="hanxiao">
</li>
<li><img src="images/face/kulou.gif" data-type="kulou">
</li>
<li><img src="images/face/qiu.gif" data-type="qiu">
</li>
<li><img src="images/face/xigua.gif" data-type="xigua">
</li>
<li><img src="images/face/zhouma.gif" data-type="zhouma">
</li>
<li><img src="images/face/daku.gif" data-type="daku">
</li>
<li><img src="images/face/haqi.gif" data-type="haqi">
</li>
<li><img src="images/face/kun.gif" data-type="kun">
</li>
<li><img src="images/face/ruo.gif" data-type="ruo">
</li>
<li><img src="images/face/xin.gif" data-type="xin">
</li>
<li><img src="images/face/zuohh.gif" data-type="zuohh">
</li>
<li><img src="images/face/dangao.gif" data-type="dangao">
</li>
<li><img src="images/face/hua.gif" data-type="hua">
</li>
<li><img src="images/face/lianhong.gif" data-type="lianhong">
</li>
<li><img src="images/face/shuai.gif" data-type="shuai">
</li>
<li><img src="images/face/yinxian.gif" data-type="yinxian">
</li>
</ul>
</div>
</div>
<ul class="tiplist" id="tiplist">
<li class="bg"></li>
<li></li>
</ul>
</div>
</div>
</div>
</div>
<!--输入4个参数的页面-->
<div class="fourParamsOut">
<ul class="fourParams clear">
<li><span>classId:</span><input class="classId" type="text" value="2028061409"></li>
<!--<li><span>userRole:</span><input class="userRole" type="text" value=""></li>-->
<!--<li><span>portal:</span><input class="portal" type="text" value=""></li>-->
<li><span>userId:</span><input class="userId" type="text" value=""></li>
<li>
<button id="btnFourParam">确定</button>
</li>
</ul>
<div class="permission">
<div class="permissionIn">
<input id="host" type="radio" name="userRole" value="host" onclick="getValue(this.value)"><label for="host">老师</label>
<input id="normal" type="radio" name="userRole" value="normal" onclick="getValue(this.value)"><label
for="normal">学生</label>
<button id="btn-per">确定</button>
</div>
</div>
</div>
<!--<!–登录页面终极版–>-->
<div class="loginBg">
<ul class="loginContent">
<li></li>
<li class="userNameLi">
<div class="userNameBg"></div>
<input value="xdykt" class="userNameInput" type="text" placeholder="请输入用户名" maxlength="20" onkeyup="this.value=this.value.replace(/^ +| +$/g,'')">
</li>
<li>
<p class="userTip"></p>
</li>
<li class="passWordLi">
<div class="passWordBg"></div>
<input value="111111" class="passWordInput" type="text" placeholder="请输入课堂密码">
</li>
<li>
<p class="passWordTip"></p>
</li>
<li class="btnLoginLi">
<button id="btnLogin">登录</button>
</li>
</ul>
</div>
<script type="text/javascript" src="js/amazeui.min.js"></script>
<!--<!–白板–>-->
<!--<script type="text/javascript" src="js/index.js"></script>-->
<!--拖动-->
<script type="text/javascript">
var tabBox = document.getElementById("draw");
var tool = document.getElementById("tool");
xdyEvent.on(tool, "mousedown", down);
</script>
<!--进度条-->
<script type="text/javascript">
$(document).ready(function (e) {
//设置最大值
ScrollBar.maxValue = 100;
//初始化
ScrollBar.Initialize();
});
var ScrollBar = {
value: 20,
maxValue: 100,
step: 1,
currentX: 0,
Initialize: function () {
if (this.value > this.maxValue) {
alert("给定当前值大于了最大值");
return;
}
this.GetValue();
$("#scroll_Track").css("width", this.currentX + 2 + "px");
$("#scroll_Thumb").css("margin-left", this.currentX + "px");
this.Value();
$("#scrollBarTxt").html(ScrollBar.value + "/" + ScrollBar.maxValue);
},
Value: function () {
var valite = false;
var currentValue;
$("#scroll_Thumb").mousedown(function () {
valite = true;
$(document.body).mousemove(function (event) {
if (valite == false) return;
var changeX = event.clientX - ScrollBar.currentX;
currentValue = changeX - ScrollBar.currentX - $("#Demo").offset().left;
$("#scroll_Thumb").css("margin-left", currentValue + "px");
$("#scroll_Track").css("width", currentValue + 2 + "px");
if ((currentValue + 25) >= $("#scrollBar").width()) {
$("#scroll_Thumb").css("margin-left", $("#scrollBar").width() - 5 + "px");
$("#scroll_Track").css("width", $("#scrollBar").width() + 2 + "px");
ScrollBar.value = ScrollBar.maxValue;
} else if (currentValue <= 0) {
$("#scroll_Thumb").css("margin-left", "0px");
$("#scroll_Track").css("width", "0px");
} else {
ScrollBar.value = Math.round(100 * (currentValue / $("#scrollBar").width()));
}
$("#scrollBarTxt").html(ScrollBar.value + "/" + ScrollBar.maxValue);
});
});
$(document.body).mouseup(function () {
ScrollBar.value = Math.round(100 * (currentValue / $("#scrollBar").width()));
valite = false;
if (ScrollBar.value >= ScrollBar.maxValue) ScrollBar.value = ScrollBar.maxValue;
if (ScrollBar.value <= 0) ScrollBar.value = 0;
$("#scrollBarTxt").html(ScrollBar.value + "/" + ScrollBar.maxValue);
});
},
GetValue: function () {
this.currentX = $("#scrollBar").width() * (this.value / this.maxValue);
}
}
</script>
<!--设置中的进度条-->
<script type="text/javascript">
$(document).ready(function(e) {
//设置最大值
setScrollBar.maxValue=100;
//初始化
setScrollBar.Initialize();
//设置最大值
setProgressBar.maxValue=100;
//设置当前刻度
var index=0;
var mProgressTimer=setInterval(function(){
index+=2;
setProgressBar.SetValue(index);
},100);
});
var setScrollBar = {
value: 1,
maxValue: 100,
step: 1,
currentX: 0,
Initialize: function() {
if (this.value > this.maxValue) {
alert("给定当前值大于了最大值");
return;
}
this.GetValue();
$(".scroll_Track").css("width", this.currentX + 2 + "px");
$(".scroll_Thumb").css("margin-left", this.currentX + "px");
this.Value();
$(".setScrollBar-min").html(setScrollBar.value);
$(".setScrollBar-max").html(setScrollBar.maxValue);
},
Value: function() {
var valite = false;
var currentValue;
$(".scroll_Thumb").mousedown(function() {
valite = true;
$(document.body).mousemove(function(event) {
if (valite == false) return;
var changeX = event.clientX - setScrollBar.currentX;
currentValue = changeX - setScrollBar.currentX-$(".scrollBar").offset().left;
$(".scroll_Thumb").css("margin-left", currentValue + "px");
$(".scroll_Track").css("width", currentValue + 2 + "px");
if ((currentValue + 9) >= $(".scrollBar").width()) {
$(".scroll_Thumb").css("margin-left", $(".scrollBar").width() - 9 + "px");
$(".scroll_Track").css("width", $(".scrollBar").width() + 2 + "px");
setScrollBar.value = setScrollBar.maxValue;
} else if (currentValue <= 0) {
$(".scroll_Thumb").css("margin-left", "0px");
$(".scroll_Track").css("width", "0px");
} else {
setScrollBar.value = Math.round(100 * (currentValue / $(".scrollBar").width()));
}
$(".setScrollBar-min").html(setScrollBar.value);
$(".setScrollBar-max").html(setScrollBar.maxValue);
});
});
$(document.body).mouseup(function() {
setScrollBar.value = Math.round(100 * (currentValue / $(".scrollBar").width()));
valite = false;
if (setScrollBar.value >= setScrollBar.maxValue) setScrollBar.value = setScrollBar.maxValue;
if (setScrollBar.value <= 0) setScrollBar.value = 0;
$(".setScrollBar-min").html(setScrollBar.value);
$(".setScrollBar-max").html(setScrollBar.maxValue);
});
},
GetValue: function() {
this.currentX = $(".scrollBar").width() * (this.value / this.maxValue);
}
}
var setProgressBar = {
maxValue: 100,
value: 20,
SetValue: function(aValue) {
this.value=aValue;
if (this.value >= this.maxValue) this.value = this.maxValue;
if (this.value <= 0) this.value = 0;
var mWidth=this.value/this.maxValue*$(".progressBar").width()+"px";
$(".progressBar_Track").css("width",mWidth);
$(".setScrollBar-min").html(setScrollBar.value);
$(".setScrollBar-max").html(setScrollBar.maxValue);
}
}
</script>
<!--开始上课/正在录制-->
<script type="text/javascript">
var flag = 0;
// 正在上课
var classnow = document.getElementById('class-now');
//弹出层上的文字
var ptext = document.getElementById('p-text');
var ptext1 = document.getElementById('p-text-1');
// 确定按钮
var confirm = document.getElementById('confirm');
var confirm1 = document.getElementById('confirm-1');
// 正在上课前的iconfont
var spaniconfont = document.getElementById('span-iconfont');
// 左侧 未开始 直播中
var aStatus = document.getElementById('a-status');
// 左侧跳动
var oLive = document.getElementById('live');
// 左侧的iconfont
var noStart = document.getElementById('no-start');
var end = document.getElementById('end');
var endNoexit = document.getElementById('end-no-exit');
// 第一个下拉的第一个
var classesStatus1 = document.getElementById('classes-status-1');
// 第一个下拉的第二个
var classesStatus2 = document.getElementById('classes-status-2');
var amDrospanIcon = document.getElementById('am-dropdown-content-span-1');
confirm.onclick = function changeStatus() {
if (flag == '0') {
flag++;
console.log(flag);
spaniconfont.innerHTML = '';
classnow.innerHTML = '直播中';
aStatus.innerHTML = '直播中';
aStatus.style.color = '#d95136';
ptext.innerHTML = '确定暂停录制吗'
noStart.style.display = 'none';
oLive.style.display = 'block';
amDrospanIcon.innerHTML = "";
classesStatus1.innerHTML = '课间休息';
console.log(classesStatus1.innerHTML);
classesStatus2.innerHTML = '结束课堂';
console.log(classesStatus2.innerHTML);
}
else if (flag == '1') {
console.log(flag);
ptext.innerHTML = '确定继续上课吗'
spaniconfont.innerHTML = '';
classnow.innerHTML = '休息';
aStatus.innerHTML = '休息';
aStatus.style.color = '#333333';
noStart.style.display = 'block';
oLive.style.display = 'none';
amDrospanIcon.innerHTML = "";
classesStatus1.innerHTML = '继续上课';
console.log(classesStatus1.innerHTML);
classesStatus2.innerHTML = '结束课堂';
console.log(classesStatus2.innerHTML);
flag--;
}
}
end.onclick = function endStatus() {
spaniconfont.innerHTML = '';
classnow.innerHTML = '结束';
aStatus.innerHTML = '结束';
oLive.style.display = 'none';
spaniconfont.innerHTML = '';
noStart.innerHTML = "";
noStart.style.display = 'block';
aStatus.style.color = '#333333';
}
</script>
<!--色板-->
<script type="text/javascript">
var tool = document.getElementById('tool');
var toolColor = document.getElementById('tool-color');
var chooseColor = document.getElementById('chooseColor');
var liColor1 = document.getElementById('li-Color1');
var liColor2 = document.getElementById('li-Color2');
var liColor3 = document.getElementById('li-Color3');
var liColor4 = document.getElementById('li-Color4');
var liColor5 = document.getElementById('li-Color5');
var liColor6 = document.getElementById('li-Color6');
var liColor7 = document.getElementById('li-Color7');
chooseColor.onmouseenter = function () {
toolColor.style.display = "block";
};
chooseColor.onmouseleave = function () {
toolColor.style.display = "none";
};
/* for(var i=0;i<oLis.length;i++){
oLis[i].index=i;
oLis[i].onlick=function () {
oLis[this.index].style.width="";
}
}*/
function choose(agrs) {
switch (agrs) {
case 1:
liColor1.style.width = '34px';
liColor1.style.height = '34px';
liColor1.style.background = 'url("images/color1-p.png") no-repeat';
liColor1.style.margin = "3px 4px 0 8px";
chooseColor.style.background = 'url("images/color1-n.png") no-repeat';
chooseColor.title = "#4fbd92";
break;
case 2:
liColor2.style.width = '34px';
liColor2.style.height = '34px';
liColor2.style.background = 'url("images/color2-p.png") no-repeat';
liColor2.style.margin = "3px 4px 0 8px";
chooseColor.style.background = 'url("images/color2-n.png") no-repeat';
chooseColor.title = "#0071bc";
break;
case 3:
liColor3.style.width = '34px';
liColor3.style.height = '34px';
liColor3.style.background = 'url("images/color3-p.png") no-repeat';
liColor3.style.margin = "3px 4px 0 8px";
chooseColor.style.background = 'url("images/color3-n.png") no-repeat';
chooseColor.title = "#6a0db2";
break;
case 4:
liColor4.style.width = '34px';
liColor4.style.height = '34px';
liColor4.style.background = 'url("images/color4-p.png") no-repeat';
liColor4.style.margin = "3px 4px 0 8px";
chooseColor.style.background = 'url("images/color4-n.png") no-repeat';
chooseColor.title = "#fae81b";
break;
case 5:
liColor5.style.width = '34px';
liColor5.style.height = '34px';
liColor5.style.background = 'url("images/color5-p.png") no-repeat';
liColor5.style.margin = "3px 4px 0 8px";
chooseColor.style.background = 'url("images/color5-n.png") no-repeat';
chooseColor.title = "#f7751e";
break;
case 6:
liColor6.style.width = '34px';
liColor6.style.height = '34px';
liColor6.style.background = 'url("images/color6-p.png") no-repeat';
liColor6.style.margin = "3px 4px 0 8px";
chooseColor.style.background = 'url("images/color6-n.png") no-repeat';
chooseColor.title = "#b8242a";
break;
case 7:
liColor7.style.width = '34px';
liColor7.style.height = '34px';
liColor7.style.background = 'url("images/color1-p.png") no-repeat';
liColor7.style.margin = "3px 4px 0 8px";
chooseColor.style.background = 'url("images/color1-n.png") no-repeat';
chooseColor.title = "#4fbd92";
break;
}
}
</script>
</body>
</html>