梁美英 / programming · Commits

Commit 982c84f754a8b2f567ec4e01c132fb6c46dfb61e

Authored by ykxie
1 parent 4cdd5450

新建多文件目录v1.1

Inline Side-by-side
Showing 4 changed files with 333 additions and 333 deletions
src/index.html
  View file @982c84f
... ... @@ -15,20 +15,16 @@
15 15 <link href="css/layout.css" rel="stylesheet">
16 16 <link href="css/main.css" rel="stylesheet">
17 17 <link href="css/recording.css" rel="stylesheet">
18   - <!-- <link href="http://lab.hakim.se/ladda/dist/ladda.min.css" rel="stylesheet"> -->
19   - <link rel="stylesheet" href="js/zTree_v3-3.5.27/css/zTreeStyle/zTreeStyle.css">
20 18  
21 19 <script>
22   - // var gxb_api = "https://restful1.gaoxiaobang.com";
23   - var gxb_api = "http://192.168.80.223:8080"
  20 + var gxb_api = "https://restful1.gaoxiaobang.com";
  21 + // var gxb_api = "http://192.168.80.236:8080"
24 22  
25 23 </script>
26 24  
27 25 <script src="js/jquery-1.7.1.js"></script>
28 26 <script src="js/bootstrap.js"></script>
29 27  
30   - <script src="js/humps-2.0.0/humps.js"></script>
31   -
32 28 <script src="js/util/util.js"></script>
33 29 <script src="js/util/Hourglass.js"></script>
34 30  
... ... @@ -45,15 +41,15 @@
45 41  
46 42 <script src="js/05-util.js"></script>
47 43 <script src="js/03-http.js"></script>
48   -
  44 + <script src="js/jquery.iframe-transport.js"></script>
  45 + <script src="js/jquery.ui.widget.js"></script>
  46 + <script src="js/jquery.fileupload.js"></script>
  47 +
49 48 <script src="js/jquery.validationEngine.js"></script>
50 49 <script src="js/jquery.validationEngine-zh.js"></script>
51 50 <script src="js/jquery.isotope.js"></script>
52 51  
53   - <link rel="stylesheet" href="css/demo.css">
54   - <script type="text/javascript" src="js/zTree_v3-3.5.27/js/jquery.ztree.core.js"></script>
55   - <script src="js/gb.js"></script>
56   - <!-- <script src="js/gbreplayer.js"></script> -->
  52 + <script src="js/gbreplayer.js"></script>
57 53  
58 54 <script src="js/gbdebug/mode/xml/xml.js"></script>
59 55 <script src="js/gbdebug/mode/javascript/javascript.js"></script>
... ... @@ -62,68 +58,78 @@
62 58 <script src="js/gbdebug/mode/clike/clike.js"></script>
63 59 <script src="js/gbdebug/mode/php/php.js"></script>
64 60 <script src="js/gbdebug/mode/python/python.js"></script>
65   - <style type="text/css">
66   - #recordzone,
67   - #replayzone{
68   - display: none;
69   - }
70   - #recordzone.active,
71   - #replayzone.active{
72   - display: block;
73   - }
74   - </style>
  61 +
75 62 </head>
76 63 <body>
77   - <div id="app" class="wrapper">
78   - <div id="appContainer">
79   - <div id="appLeft">
80   - <div class="tree-header">目录</div>
81   - <ul id="folder" class="ztree"></ul>
82   - <div id="handleLM"></div>
83   - </div>
84   - <div id="appMian">
85   - <div id="appMainHeader">
86   - <ul id="recordertab" class="nav nav-tabs pull-left">
87   - <li class="active"><a href="#recordzone" data-toggle="tab"><i class="icon iconfont icon-suspend"></i>课程录制区</a></li>
88   - <li><a href="#replayzone" data-toggle="tab"><i class="icon iconfont icon-yulan"></i>课程预览区</a></li>
89   - </ul>
90   - <div id="editorwrapper" class="pull-right">
91   - <div class="btn-group">
92   - <div id="htmlbutton" class="btn btn-default btn-sm" data-toggle="tooltip" data-placement="bottom" data-original-title="当前课程环境：Java" data-editorname="html">JAVA</div>
93   - <div class="btn btn-default btn-sm" data-toggle="tooltip" data-placement="bottom" data-original-title="JDK版本">JDK 7</div>
  64 + <div class="real-program-content recording-page">
  65 + <div class="row">
  66 + <div class="col-md-8" id="editorpanel">
  67 + <div id="" class="recording-wrap">
  68 + <div class="recording-header">
  69 + <ul class="nav nav-tabs pull-left" id="recordertab">
  70 + <li class="active" style="margin-left: 34px;">
  71 + <a href="#recordzone" data-toggle="tab"><i class="icon iconfont icon-suspend"></i><p class="pull-right">&nbsp;课程录制区</p></a>
  72 + </li>
  73 + <li class="line"></li>
  74 + <li>
  75 + <a href="#replayzone" data-toggle="tab"><i class="icon iconfont icon-yulan"></i><p class="pull-right">&nbsp;课程预览区</p></a>
  76 + </li>
  77 + </ul>
  78 + <div id="editorwrapper">
  79 + <button type="button" class="lang btn btn-default btn-primary pull-right" id="htmlbutton" title="" data-editorname="html"></button>
  80 + </div>
  81 + </div>
  82 +
  83 + <div id="recordpanel" class="recording-content">
  84 + <div class="panel-body">
  85 + <input type="hidden" class="audio-url" value="">
  86 + <div class="tab-content" style="position:relative;">
  87 + <div class="tab-pane active" id="recordzone">
  88 + <textarea id="HTMLeditor" title="HTML"></textarea>
  89 + <textarea id="CSSeditor" title="CSS" style="display: none;"></textarea>
  90 + <textarea id="JSeditor" title="Javascript" style="display: none;"></textarea>
  91 + </div>
  92 + <div class="tab-pane" id="replayzone">
  93 + <textarea id="HTMLplayer"></textarea>
  94 + <textarea id="CSSplayer"></textarea>
  95 + <textarea id="JSplayer"></textarea>
  96 + </div>
  97 + </div>
94 98 </div>
95 99 </div>
96 100 </div>
97   - <div id="textarea">
98   - <div id="recordzone" class="active"></div>
99   - <div id="replayzone"></div>
100   - </div>
101   - <div id="handleMR"></div>
102   - </div>
103   - <div id="appRight">
104   - <div id="resultpanel" class="panel panel-default editor-result">
105   - <div class="panel-heading result-header">
106   - <div class="pull-left">
107   - <div id="compileBtnGroup" class="btn-group"></div>
  101 + <div class="pause-shodow hidden">
  102 + <div class="compile-loading">
  103 + <img src="img/loading.png" alt="">
  104 + </div>
  105 + <div class="compile-reslut" style="display: none;">
  106 + <div class="tip-header">
  107 + <span>成功获取编译运行结果</span>
108 108 </div>
109   - <div class="pull-right">
110   - <a id="full-screen" href="javascript:;" data-toggle="tooltip" data-placement="left" data-original-title="全屏录制" class="btn btn-link"><i class="icon iconfont icon-fangda"></i></a>
  109 + <div class="tip-content">
  110 + <p>保存编译结果后，播放到此处会在运行区域直接显示结果。需要保存结果后继续录制吗?</p>
111 111 </div>
  112 + <div class="tip-footer">
  113 + <button class="btn btn-success btn-sm" id="save_compile">保存并继续录制</button>
  114 + <button class="btn btn-danger btn-sm" id="cancel_compile">不保存继续录制</button>
  115 + </div>
  116 + </div>
  117 + </div>
  118 + </div>
  119 +
  120 + <div class="col-md-4" id="previewpanel">
  121 + <div id="resultpanel" class="panel panel-default">
  122 + <div class="panel-heading">
112 123 <div class="btn-group">
113 124 <button type="button" class="btn btn-success" id="play" data-status="0" title="" style="display: none;"><</button>
114   - <!-- <p id="replay">预览录制</p> -->
  125 + <p id="replay">预览录制</p>
115 126 </div>
116   - <!-- <div class="btn-group pull-right" id="fontendrun">
117   - <button id="autorun" type="button" class="btn" title="切换自动/手动运行代码" data-placement="bottom" data-autorun="1"></button>
118   - <button id="runnow" type="button" class="btn" title="手动运行代码" data-placement="bottom" disabled="disabled">
119   - 自动运行
120   - </button>
121   - </div> -->
  127 + <div class="btn-group pull-right" id="comprunbtngrp"></div>
122 128 </div>
123 129 <div class="panel-body hidden" id="cmprun-output">
124 130 <div id="resultoutput">
125 131 <!-- Nav tabs -->
126   - <ul class="nav nav-tabs result-tabs" role="tablist" id="cmprun-tabs">
  132 + <ul class="nav nav-tabs" role="tablist" id="cmprun-tabs">
127 133 <li class="active"><a href="#stdin" role="tab" data-toggle="tab" class="text-warning">标准</a></li>
128 134 <li><a href="#cmpinfo" role="tab" data-toggle="tab" class="text-warning">编译</a></li>
129 135 <li><a href="#stderr" role="tab" data-toggle="tab" class="text-danger">错误</a></li>
... ... @@ -132,7 +138,7 @@
132 138 <!-- Tab panes -->
133 139 <div class="tab-content">
134 140 <div class="tab-pane active padall15" id="stdin">
135   - <input type="text" class="form-control" id="runtimeArgus" placeholder="标准输入">
  141 + <input type="text" class="form-control" id="input" placeholder="标准输入">
136 142 </div>
137 143 <div class="tab-pane padall15" id="cmpinfo"></div>
138 144 <div class="tab-pane padall15" id="stderr"></div>
... ... @@ -145,32 +151,32 @@
145 151 </div>
146 152 </div>
147 153 </div>
  154 +
148 155 </div>
149   - <div id="appFooter">
150   - <!-- 录音控制条 -->
151   - <div class="recording-ctrl-bar">
152   - <button id="start-recording" class="btn new-recording" type="button" data="1" title="开始录制"></button>
153   - <button id="re-recoding" class="btn new-recording" type="button" data="1" title="重新录制" style="display: none;"></button>
154   - <button class="btn pause-recording hidden" id="pause" data-status='0' title="录制暂停中">
155   - <img src="img/pause.svg" alt="">
156   - </button>
157   -
158   - <button class="audio-play hidden" title="播放预览" data="1">
159   - <i class="icon iconfont icon-play"></i>
160   - </button>
161   - <div class="recording-time" id="timer" value="">00:00:00</div>
162   - <div class="audio-view" style="display: none;">
163   - <audio id="audio" autoplay></audio>
164   - </div>
165   - <div class="save-wrap">
166   - <input type="button" id="upload" class="upload-teach" disabled="disabled" value="保存 - upload">
167   - <input type="button" id="savecorde" class="upload-stud" style="display: none;" disabled="disabled" value="保存 - savecorde">
168   - <input type="button" id="cancel" value="关闭 - cancel">
169   - </div>
170   - </div>
  156 + </div>
  157 +
  158 + <!-- 录音控制条 -->
  159 + <div class="recording-ctrl-bar">
  160 + <button id="start-recording" class="btn new-recording" type="button" data="1" title="开始录制"></button>
  161 + <button id="re-recoding" class="btn new-recording" type="button" data="1" title="重新录制" style="display: none;"></button>
  162 + <button class="btn pause-recording hidden" id="pause" data-status='0' title="录制暂停中">
  163 + <img src="img/pause.svg" alt="">
  164 + </button>
  165 +
  166 + <button class="audio-play hidden" title="播放预览" data="1">
  167 + <i class="icon iconfont icon-play"></i>
  168 + </button>
  169 + <div class="recording-time" id="timer" value="">00:00:00</div>
  170 + <div class="audio-view" style="display: none;">
  171 + <audio id="audio" autoplay></audio>
  172 + </div>
  173 + <div class="save-wrap">
  174 + <input type="button" id="upload" class="upload-teach" disabled="disabled" value="保存">
  175 + <input type="button" id="savecorde" class="upload-stud" style="display: none;" disabled="disabled" value="保存">
  176 + <input type="button" id="cancel" value="关闭">
171 177 </div>
172 178 </div>
173   - <!-- -->
  179 +
174 180 <div class="upload-tip" style="display: none;">
175 181 <img src="img/upload_tip.png" alt="">
176 182 </div>
... ... @@ -202,9 +208,6 @@
202 208 <script src="js/recording/recording.js"></script>
203 209  
204 210 <script>
205   - $(function () {
206   - $('[data-toggle="tooltip"]').tooltip()
207   - })
208 211 var recorder;
209 212 var _role = getQuery('role');
210 213 var _chapterId = getQuery('chapterId');
... ... @@ -216,8 +219,7 @@
216 219  
217 220 // 结束播放事件
218 221 audio.addEventListener("ended", function() {
219   - console.info('audio.addEventListener("ended"');
220   - console.log('audio 播放结束');
  222 + console.log('结束播放事件');
221 223 Hourglass.stopTimer();
222 224 $('.audio-play').attr('data', '1')
223 225 $('.audio-play').prop('disabled', false);
... ... @@ -228,9 +230,8 @@
228 230 })
229 231  
230 232 function uploadAudio(ob) {
231   - // $('.upload-tip').show();
232   - // recorder.upload();
233   - $('#savecorde').trigger('click');
  233 + $('.upload-tip').show();
  234 + recorder.upload();
234 235 }
235 236 </script>
236 237 </body>
... ...
src/indexs.html deleted 100644 → 0
  View file @4cdd545
1   -<!DOCTYPE html>
2   -<html lang="en">
3   -<head>
4   - <meta charset="UTF-8">
5   - <title>互动编程</title>
6   - <link rel="stylesheet" href="css/reset.css">
7   - <link rel="stylesheet" href="css/responsive/css/bootstrap.min.css">
8   - <link href="css/validationEngine.jquery.css" rel="stylesheet">
9   - <link href="css/codemirror.css" rel="stylesheet">
10   - <link href="css/cm-theme/gbtags.css" rel="stylesheet">
11   - <link href="css/cm-theme/eclipse.css" rel="stylesheet">
12   - <link href="css/cm-theme/gbtags-dark.css" rel="stylesheet">
13   - <link href="css/font/iconfont.css" rel="stylesheet">
14   - <link href="css/font_all/iconfont.css" rel="stylesheet">
15   - <link href="css/layout.css" rel="stylesheet">
16   - <link href="css/main.css" rel="stylesheet">
17   - <link href="css/recording.css" rel="stylesheet">
18   -
19   - <script>
20   - var gxb_api = "https://restful1.gaoxiaobang.com";
21   - // var gxb_api = "http://192.168.80.236:8080"
22   -
23   - </script>
24   -
25   - <script src="js/jquery-1.7.1.js"></script>
26   - <script src="js/bootstrap.js"></script>
27   -
28   - <script src="js/util/util.js"></script>
29   - <script src="js/util/Hourglass.js"></script>
30   -
31   -
32   - <script src="js/spin.js"></script>
33   - <script src="js/ladda.js"></script>
34   -
35   - <script src="js/jquery-ui-1.8.20.custom.js"></script>
36   - <script src="js/codemirror.js"></script>
37   - <!-- <script src="js/handlebars-1.3.js"></script> -->
38   - <script src="js/emmet.js"></script>
39   - <script src="js/jshint-2.6.min.js"></script>
40   - <script src="js/jstorage.js"></script>
41   -
42   - <script src="js/05-util.js"></script>
43   - <script src="js/03-http.js"></script>
44   - <script src="js/jquery.iframe-transport.js"></script>
45   - <script src="js/jquery.ui.widget.js"></script>
46   - <script src="js/jquery.fileupload.js"></script>
47   -
48   - <script src="js/jquery.validationEngine.js"></script>
49   - <script src="js/jquery.validationEngine-zh.js"></script>
50   - <script src="js/jquery.isotope.js"></script>
51   -
52   - <script src="js/gbreplayer.js"></script>
53   -
54   - <script src="js/gbdebug/mode/xml/xml.js"></script>
55   - <script src="js/gbdebug/mode/javascript/javascript.js"></script>
56   - <script src="js/gbdebug/mode/css/css.js"></script>
57   - <script src="js/gbdebug/mode/htmlmixed/htmlmixed.js"></script>
58   - <script src="js/gbdebug/mode/clike/clike.js"></script>
59   - <script src="js/gbdebug/mode/php/php.js"></script>
60   - <script src="js/gbdebug/mode/python/python.js"></script>
61   -
62   -</head>
63   -<body>
64   - <div class="real-program-content recording-page">
65   - <div class="row">
66   - <div class="col-md-8" id="editorpanel">
67   - <div id="" class="recording-wrap">
68   - <div class="recording-header">
69   - <ul class="nav nav-tabs pull-left" id="recordertab">
70   - <li class="active" style="margin-left: 34px;">
71   - <a href="#recordzone" data-toggle="tab"><i class="icon iconfont icon-suspend"></i><p class="pull-right">&nbsp;课程录制区</p></a>
72   - </li>
73   - <li class="line"></li>
74   - <li>
75   - <a href="#replayzone" data-toggle="tab"><i class="icon iconfont icon-yulan"></i><p class="pull-right">&nbsp;课程预览区</p></a>
76   - </li>
77   - </ul>
78   - <div id="editorwrapper">
79   - <button type="button" class="lang btn btn-default btn-primary pull-right" id="htmlbutton" title="" data-editorname="html"></button>
80   - </div>
81   - </div>
82   -
83   - <div id="recordpanel" class="recording-content">
84   - <div class="panel-body">
85   - <input type="hidden" class="audio-url" value="">
86   - <div class="tab-content" style="position:relative;">
87   - <div class="tab-pane active" id="recordzone">
88   - <textarea id="HTMLeditor" title="HTML"></textarea>
89   - <textarea id="CSSeditor" title="CSS" style="display: none;"></textarea>
90   - <textarea id="JSeditor" title="Javascript" style="display: none;"></textarea>
91   - </div>
92   - <div class="tab-pane" id="replayzone">
93   - <textarea id="HTMLplayer"></textarea>
94   - <textarea id="CSSplayer"></textarea>
95   - <textarea id="JSplayer"></textarea>
96   - </div>
97   - </div>
98   - </div>
99   - </div>
100   - </div>
101   - <div class="pause-shodow hidden">
102   - <div class="compile-loading">
103   - <img src="img/loading.png" alt="">
104   - </div>
105   - <div class="compile-reslut" style="display: none;">
106   - <div class="tip-header">
107   - <span>成功获取编译运行结果</span>
108   - </div>
109   - <div class="tip-content">
110   - <p>保存编译结果后，播放到此处会在运行区域直接显示结果。需要保存结果后继续录制吗?</p>
111   - </div>
112   - <div class="tip-footer">
113   - <button class="btn btn-success btn-sm" id="save_compile">保存并继续录制</button>
114   - <button class="btn btn-danger btn-sm" id="cancel_compile">不保存继续录制</button>
115   - </div>
116   - </div>
117   - </div>
118   - </div>
119   -
120   - <div class="col-md-4" id="previewpanel">
121   - <div id="resultpanel" class="panel panel-default">
122   - <div class="panel-heading">
123   - <div class="btn-group">
124   - <button type="button" class="btn btn-success" id="play" data-status="0" title="" style="display: none;"><</button>
125   - <p id="replay">预览录制</p>
126   - </div>
127   - <div class="btn-group pull-right" id="comprunbtngrp"></div>
128   - </div>
129   - <div class="panel-body hidden" id="cmprun-output">
130   - <div id="resultoutput">
131   - <!-- Nav tabs -->
132   - <ul class="nav nav-tabs" role="tablist" id="cmprun-tabs">
133   - <li class="active"><a href="#stdin" role="tab" data-toggle="tab" class="text-warning">标准</a></li>
134   - <li><a href="#cmpinfo" role="tab" data-toggle="tab" class="text-warning">编译</a></li>
135   - <li><a href="#stderr" role="tab" data-toggle="tab" class="text-danger">错误</a></li>
136   - <li><a href="#output" role="tab" data-toggle="tab" class="text-success">结果</a></li>
137   - </ul>
138   - <!-- Tab panes -->
139   - <div class="tab-content">
140   - <div class="tab-pane active padall15" id="stdin">
141   - <input type="text" class="form-control" id="input" placeholder="标准输入">
142   - </div>
143   - <div class="tab-pane padall15" id="cmpinfo"></div>
144   - <div class="tab-pane padall15" id="stderr"></div>
145   - <div class="tab-pane padall15" id="output"></div>
146   - </div>
147   - </div>
148   - </div>
149   - <div class="panel-body" id="ifrcontainer">
150   - <iframe id="resultiframe" frameBorder="0" width="100%"></iframe>
151   - </div>
152   - </div>
153   - </div>
154   -
155   - </div>
156   - </div>
157   -
158   - <!-- 录音控制条 -->
159   - <div class="recording-ctrl-bar">
160   - <button id="start-recording" class="btn new-recording" type="button" data="1" title="开始录制"></button>
161   - <button id="re-recoding" class="btn new-recording" type="button" data="1" title="重新录制" style="display: none;"></button>
162   - <button class="btn pause-recording hidden" id="pause" data-status='0' title="录制暂停中">
163   - <img src="img/pause.svg" alt="">
164   - </button>
165   -
166   - <button class="audio-play hidden" title="播放预览" data="1">
167   - <i class="icon iconfont icon-play"></i>
168   - </button>
169   - <div class="recording-time" id="timer" value="">00:00:00</div>
170   - <div class="audio-view" style="display: none;">
171   - <audio id="audio" autoplay></audio>
172   - </div>
173   - <div class="save-wrap">
174   - <input type="button" id="upload" class="upload-teach" disabled="disabled" value="保存">
175   - <input type="button" id="savecorde" class="upload-stud" style="display: none;" disabled="disabled" value="保存">
176   - <input type="button" id="cancel" value="关闭">
177   - </div>
178   - </div>
179   -
180   - <div class="upload-tip" style="display: none;">
181   - <img src="img/upload_tip.png" alt="">
182   - </div>
183   -
184   -
185   - <!-- 准备开始 -->
186   - <div id="countdown" style="display: none;">
187   - <img src="" alt="">
188   - </div>
189   -
190   - <!-- 重新开始 -->
191   - <div class="re-tips" style="display: none;">
192   - <div class="re-reslut">
193   - <div class="tip-header">
194   - <span>提示</span>
195   - </div>
196   - <div class="tip-content">
197   - <p>你确定要重新录制吗?</p>
198   - </div>
199   - <div class="tip-footer">
200   - <button class="btn btn-success btn-sm" id="re-sure">确定</button>
201   - <button class="btn btn-danger btn-sm" id="re-cancel">取消</button>
202   - </div>
203   - </div>
204   - </div>
205   -
206   -
207   - <script src="js/recorder/Myna.js"></script>
208   - <script src="js/recording/recording.js"></script>
209   -
210   - <script>
211   - var recorder;
212   - var _role = getQuery('role');
213   - var _chapterId = getQuery('chapterId');
214   - var userId = getQuery('userId');
215   -
216   - var audio = document.querySelector('audio');
217   - var saveAudio = document.getElementById("save");
218   -
219   -
220   - // 结束播放事件
221   - audio.addEventListener("ended", function() {
222   - console.log('结束播放事件');
223   - Hourglass.stopTimer();
224   - $('.audio-play').attr('data', '1')
225   - $('.audio-play').prop('disabled', false);
226   - }, false);
227   -
228   - $('#upload').click(function(){
229   - uploadAudio()
230   - })
231   -
232   - function uploadAudio(ob) {
233   - $('.upload-tip').show();
234   - recorder.upload();
235   - }
236   - </script>
237   -</body>
238   -</html>
239   -
240   -
241   -
src/js/gb.js
  View file @982c84f
... ... @@ -1803,7 +1803,7 @@ $(function() {
1803 1803 // 动态获取目录结构
1804 1804 $.ajax({
1805 1805 type: "GET",
1806   - url: "js/tree.json",
  1806 + url: "../js/tree.json",
1807 1807 dataType: "json",
1808 1808 contentType: "application/json",
1809 1809 success: function(res) {
... ...
src/v1.1/index.html 0 → 100644
  View file @982c84f
  1 +<!DOCTYPE html>
  2 +<html lang="en">
  3 +<head>
  4 + <meta charset="UTF-8">
  5 + <title>互动编程</title>
  6 + <link rel="stylesheet" href="../css/reset.css">
  7 + <link rel="stylesheet" href="../css/responsive/css/bootstrap.min.css">
  8 + <link href="../css/validationEngine.jquery.css" rel="stylesheet">
  9 + <link href="../css/codemirror.css" rel="stylesheet">
  10 + <link href="../css/cm-theme/gbtags.css" rel="stylesheet">
  11 + <link href="../css/cm-theme/eclipse.css" rel="stylesheet">
  12 + <link href="../css/cm-theme/gbtags-dark.css" rel="stylesheet">
  13 + <link href="../css/font/iconfont.css" rel="stylesheet">
  14 + <link href="../css/font_all/iconfont.css" rel="stylesheet">
  15 + <link href="../css/layout.css" rel="stylesheet">
  16 + <link href="../css/main.css" rel="stylesheet">
  17 + <link href="../css/recording.css" rel="stylesheet">
  18 + <!-- <link href="http://lab.hakim.se/ladda/dist/ladda.min.css" rel="stylesheet"> -->
  19 + <link rel="stylesheet" href="../js/zTree_v3-3.5.27/css/zTreeStyle/zTreeStyle.css">
  20 +
  21 + <script>
  22 + var gxb_api = "https://restful1.gaoxiaobang.com";
  23 + // var gxb_api = "http://192.168.80.223:8080"
  24 +
  25 + </script>
  26 +
  27 + <script src="../js/jquery-1.7.1.js"></script>
  28 + <script src="../js/bootstrap.js"></script>
  29 +
  30 + <script src="../js/humps-2.0.0/humps.js"></script>
  31 +
  32 + <script src="../js/util/util.js"></script>
  33 + <script src="../js/util/Hourglass.js"></script>
  34 +
  35 +
  36 + <script src="../js/spin.js"></script>
  37 + <script src="../js/ladda.js"></script>
  38 +
  39 + <script src="../js/jquery-ui-1.8.20.custom.js"></script>
  40 + <script src="../js/codemirror.js"></script>
  41 + <!-- <script src="../js/handlebars-1.3.js"></script> -->
  42 + <script src="../js/emmet.js"></script>
  43 + <script src="../js/jshint-2.6.min.js"></script>
  44 + <script src="../js/jstorage.js"></script>
  45 +
  46 + <script src="../js/05-util.js"></script>
  47 + <script src="../js/03-http.js"></script>
  48 +
  49 + <script src="../js/jquery.validationEngine.js"></script>
  50 + <script src="../js/jquery.validationEngine-zh.js"></script>
  51 + <script src="../js/jquery.isotope.js"></script>
  52 +
  53 + <link rel="stylesheet" href="../css/demo.css">
  54 + <script type="text/javascript" src="../js/zTree_v3-3.5.27/js/jquery.ztree.core.js"></script>
  55 + <script src="../js/gb.js"></script>
  56 + <!-- <script src="../js/gbreplayer.js"></script> -->
  57 +
  58 + <script src="../js/gbdebug/mode/xml/xml.js"></script>
  59 + <script src="../js/gbdebug/mode/javascript/javascript.js"></script>
  60 + <script src="../js/gbdebug/mode/css/css.js"></script>
  61 + <script src="../js/gbdebug/mode/htmlmixed/htmlmixed.js"></script>
  62 + <script src="../js/gbdebug/mode/clike/clike.js"></script>
  63 + <script src="../js/gbdebug/mode/php/php.js"></script>
  64 + <script src="../js/gbdebug/mode/python/python.js"></script>
  65 + <style type="text/css">
  66 + #recordzone,
  67 + #replayzone{
  68 + display: none;
  69 + }
  70 + #recordzone.active,
  71 + #replayzone.active{
  72 + display: block;
  73 + }
  74 + </style>
  75 +</head>
  76 +<body>
  77 + <div id="app" class="wrapper">
  78 + <div id="appContainer">
  79 + <div id="appLeft">
  80 + <div class="tree-header">目录</div>
  81 + <ul id="folder" class="ztree"></ul>
  82 + <div id="handleLM"></div>
  83 + </div>
  84 + <div id="appMian">
  85 + <div id="appMainHeader">
  86 + <ul id="recordertab" class="nav nav-tabs pull-left">
  87 + <li class="active"><a href="#recordzone" data-toggle="tab"><i class="icon iconfont icon-suspend"></i>课程录制区</a></li>
  88 + <li><a href="#replayzone" data-toggle="tab"><i class="icon iconfont icon-yulan"></i>课程预览区</a></li>
  89 + </ul>
  90 + <div id="editorwrapper" class="pull-right">
  91 + <div class="btn-group">
  92 + <div id="htmlbutton" class="btn btn-default btn-sm" data-toggle="tooltip" data-placement="bottom" data-original-title="当前课程环境：Java" data-editorname="html">JAVA</div>
  93 + <div class="btn btn-default btn-sm" data-toggle="tooltip" data-placement="bottom" data-original-title="JDK版本">JDK 7</div>
  94 + </div>
  95 + </div>
  96 + </div>
  97 + <div id="textarea">
  98 + <div id="recordzone" class="active"></div>
  99 + <div id="replayzone"></div>
  100 + </div>
  101 + <div id="handleMR"></div>
  102 + </div>
  103 + <div id="appRight">
  104 + <div id="resultpanel" class="panel panel-default editor-result">
  105 + <div class="panel-heading result-header">
  106 + <div class="pull-left">
  107 + <div id="compileBtnGroup" class="btn-group"></div>
  108 + </div>
  109 + <div class="pull-right">
  110 + <a id="full-screen" href="javascript:;" data-toggle="tooltip" data-placement="left" data-original-title="全屏录制" class="btn btn-link"><i class="icon iconfont icon-fangda"></i></a>
  111 + </div>
  112 + <div class="btn-group">
  113 + <button type="button" class="btn btn-success" id="play" data-status="0" title="" style="display: none;"><</button>
  114 + <!-- <p id="replay">预览录制</p> -->
  115 + </div>
  116 + <!-- <div class="btn-group pull-right" id="fontendrun">
  117 + <button id="autorun" type="button" class="btn" title="切换自动/手动运行代码" data-placement="bottom" data-autorun="1"></button>
  118 + <button id="runnow" type="button" class="btn" title="手动运行代码" data-placement="bottom" disabled="disabled">
  119 + 自动运行
  120 + </button>
  121 + </div> -->
  122 + </div>
  123 + <div class="panel-body hidden" id="cmprun-output">
  124 + <div id="resultoutput">
  125 + <!-- Nav tabs -->
  126 + <ul class="nav nav-tabs result-tabs" role="tablist" id="cmprun-tabs">
  127 + <li class="active"><a href="#stdin" role="tab" data-toggle="tab" class="text-warning">标准</a></li>
  128 + <li><a href="#cmpinfo" role="tab" data-toggle="tab" class="text-warning">编译</a></li>
  129 + <li><a href="#stderr" role="tab" data-toggle="tab" class="text-danger">错误</a></li>
  130 + <li><a href="#output" role="tab" data-toggle="tab" class="text-success">结果</a></li>
  131 + </ul>
  132 + <!-- Tab panes -->
  133 + <div class="tab-content">
  134 + <div class="tab-pane active padall15" id="stdin">
  135 + <input type="text" class="form-control" id="runtimeArgus" placeholder="标准输入">
  136 + </div>
  137 + <div class="tab-pane padall15" id="cmpinfo"></div>
  138 + <div class="tab-pane padall15" id="stderr"></div>
  139 + <div class="tab-pane padall15" id="output"></div>
  140 + </div>
  141 + </div>
  142 + </div>
  143 + <div class="panel-body" id="ifrcontainer">
  144 + <iframe id="resultiframe" frameBorder="0" width="100%"></iframe>
  145 + </div>
  146 + </div>
  147 + </div>
  148 + </div>
  149 + <div id="appFooter">
  150 + <!-- 录音控制条 -->
  151 + <div class="recording-ctrl-bar">
  152 + <button id="start-recording" class="btn new-recording" type="button" data="1" title="开始录制"></button>
  153 + <button id="re-recoding" class="btn new-recording" type="button" data="1" title="重新录制" style="display: none;"></button>
  154 + <button class="btn pause-recording hidden" id="pause" data-status='0' title="录制暂停中">
  155 + <img src="../img/pause.svg" alt="">
  156 + </button>
  157 +
  158 + <button class="audio-play hidden" title="播放预览" data="1">
  159 + <i class="icon iconfont icon-play"></i>
  160 + </button>
  161 + <div class="recording-time" id="timer" value="">00:00:00</div>
  162 + <div class="audio-view" style="display: none;">
  163 + <audio id="audio" autoplay></audio>
  164 + </div>
  165 + <div class="save-wrap">
  166 + <input type="button" id="upload" class="upload-teach" disabled="disabled" value="保存 - upload">
  167 + <input type="button" id="savecorde" class="upload-stud" style="display: none;" disabled="disabled" value="保存 - savecorde">
  168 + <input type="button" id="cancel" value="关闭 - cancel">
  169 + </div>
  170 + </div>
  171 + </div>
  172 + </div>
  173 + <!-- -->
  174 + <div class="upload-tip" style="display: none;">
  175 + <img src="../img/upload_tip.png" alt="">
  176 + </div>
  177 +
  178 +
  179 + <!-- 准备开始 -->
  180 + <div id="countdown" style="display: none;">
  181 + <img src="" alt="">
  182 + </div>
  183 +
  184 + <!-- 重新开始 -->
  185 + <div class="re-tips" style="display: none;">
  186 + <div class="re-reslut">
  187 + <div class="tip-header">
  188 + <span>提示</span>
  189 + </div>
  190 + <div class="tip-content">
  191 + <p>你确定要重新录制吗?</p>
  192 + </div>
  193 + <div class="tip-footer">
  194 + <button class="btn btn-success btn-sm" id="re-sure">确定</button>
  195 + <button class="btn btn-danger btn-sm" id="re-cancel">取消</button>
  196 + </div>
  197 + </div>
  198 + </div>
  199 +
  200 +
  201 + <script src="../js/recorder/Myna.js"></script>
  202 + <script src="../js/recording/recording.js"></script>
  203 +
  204 + <script>
  205 + $(function () {
  206 + $('[data-toggle="tooltip"]').tooltip()
  207 + })
  208 + var recorder;
  209 + var _role = getQuery('role');
  210 + var _chapterId = getQuery('chapterId');
  211 + var userId = getQuery('userId');
  212 +
  213 + var audio = document.querySelector('audio');
  214 + var saveAudio = document.getElementById("save");
  215 +
  216 +
  217 + // 结束播放事件
  218 + audio.addEventListener("ended", function() {
  219 + console.info('audio.addEventListener("ended"');
  220 + console.log('audio 播放结束');
  221 + Hourglass.stopTimer();
  222 + $('.audio-play').attr('data', '1')
  223 + $('.audio-play').prop('disabled', false);
  224 + }, false);
  225 +
  226 + $('#upload').click(function(){
  227 + uploadAudio()
  228 + })
  229 +
  230 + function uploadAudio(ob) {
  231 + // $('.upload-tip').show();
  232 + // recorder.upload();
  233 + $('#savecorde').trigger('click');
  234 + }
  235 + </script>
  236 +</body>
  237 +</html>
  238 +
  239 +
  240 +
... ...