Test.html 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  5. <title>主体课文</title>
  6. <meta charset="utf-8" />
  7. <script src="Scripts/jquery.js"></script>
  8. <link href="Common/mtm_passage.css" rel="stylesheet" type="text/css" />
  9. <link href="Common/tasklib_book.css" rel="stylesheet" type="text/css" />
  10. <script src="Common/mtm_temp.js"></script>
  11. <script src="Common/tasklib_book.js"></script>
  12. </head>
  13. <body>
  14. <div class="scroll-view">
  15. <button id="load-text">加载听说课文</button>
  16. <button id="showhide-answer" data-status="1">隐藏习题答案</button>
  17. <button id="handle-answer" data-status="1">处理作答区域</button>
  18. <button id="submit-answer">提交习题答案</button>
  19. <button id="backup-answer">回显习题答案</button>
  20. <button id="update-answer">修改习题答案</button>
  21. <button id="backup-review">回填评阅数据</button>
  22. <button id="scroll-review">定位滚动数据</button>
  23. <button id="test-ui">测试UI效果</button>
  24. <button id="wordStyleID">单词</button>
  25. <button id="phraseStyleID">短语</button>
  26. <button id="sentenceStyleID">句型</button>
  27. <button id="ShowID">全显示</button>
  28. <button id="HiddenID">隐藏</button>
  29. </div>
  30. <!--<input type="text" style="border:0px; border-bottom:solid #fbfbfb 1px; border-radius: 3px;padding-left:5px; color:#6ab7ff;" value="测试的" />-->
  31. <!--<div class="btn-play"><img src="play.png" /><span>作答音频(20s)</span></div>-->
  32. <!--<div class="btn-play"><img src="play.png" /><span>作答音频(20s)</span></div>
  33. <p class="test-p">1、</p>
  34. <p class="test-p1">2、</p>-->
  35. <!--<u style="">ss</u>-->
  36. <!--<button class="answertext btn-bgimg">点击作答</button>-->
  37. <div id="data"></div>
  38. <script type="text/javascript">
  39. var answerjson = "";//作答信息
  40. var reviewjson = "";//评阅信息
  41. //加载数据
  42. window.onload = function () {
  43. //加载听说课文
  44. answerjson = $.ajax({ url: "AnsText/GCZD.json", async: false }).responseText;
  45. reviewjson = $.ajax({ url: "AnsText/anstext.txt", async: false }).responseText;
  46. hightcodejson = JSON.parse($.ajax({ url: "HightCode/data202116P.json", async: false }).responseText);
  47. for (var i = 0; i < JSON.parse($.ajax({ url: "HightCode/data202116S.json", async: false }).responseText).length; i++) {
  48. hightcodejson.push(JSON.parse($.ajax({ url: "HightCode/data202116S.json", async: false }).responseText)[i]);
  49. }
  50. for (var i = 0; i < JSON.parse($.ajax({ url: "HightCode/data202116W.json", async: false }).responseText).length; i++) {
  51. hightcodejson.push(JSON.parse($.ajax({ url: "HightCode/data202116W.json", async: false }).responseText)[i]);
  52. }
  53. }
  54. //加载听说课文
  55. $("#load-text").on("click", function () {
  56. var data = $.ajax({ url: "lghp/data202116.lghp", async: false }).responseText;
  57. //var data = $.ajax({ url: "lghp/22216.lghp", async: false }).responseText;
  58. $("#data").html(data);
  59. bindEventYS();
  60. Fill(hightcodejson);
  61. //showHideAnswerEx(true, false);
  62. //bindCoursewareEvent();
  63. var ResInfo = {
  64. answerPointImgUrl: "Images/update-answer.png",
  65. yaoshiShowImgUrl: "Images/yaoshi-show.png",
  66. yaoshiHideImgUrl: "Images/yaoshi-hide.png",
  67. KouYuTagImgUrl: "Images/KY.png",
  68. recordPlayImgUrl: "Images/play.png",
  69. recordPauseImgUrl: "Images/pause.png",
  70. audioPlayImgUrl: "Images/dynaiselaba.gif",
  71. audioPauseImgUrl: "Images/dynaiselaba.png"
  72. }
  73. //调用查看图标
  74. $.each($(".yaoshi"), function (index, item) {
  75. $(item).attr("src", ResInfo.yaoshiShowImgUrl);//移动端要根据本地 喇叭 路径替换
  76. });
  77. $.each($(".audioImg"), function (index, item) {
  78. $(item).attr("src", ResInfo.audioPauseImgUrl);//移动端要根据本地 喇叭 路径替换
  79. });
  80. $.each($(".oralLanguageImg"), function (index, item) {
  81. $(item).attr("src", ResInfo.KouYuTagImgUrl);//移动端要根据本地 喇叭 路径替换
  82. });
  83. });
  84. //显示/隐藏习题答案
  85. $("#showhide-answer").on("click", function () {
  86. if ($(this).data("status") == "0") {
  87. this.innerText = "隐藏习题答案";
  88. $(this).data("status", "1");
  89. //showHideAnswer(true);
  90. showHideAnswerEx(true, true);
  91. //$(".underlineContent").show();
  92. }
  93. else {
  94. this.innerText = "显示习题答案";
  95. $(this).data("status", "0");
  96. //showHideAnswer(false);
  97. showHideAnswerEx(true, false);
  98. //$(".underlineContent").hide();
  99. }
  100. });
  101. //处理作答区域
  102. $("#handle-answer").on("click", function () {
  103. handleAnswerRange();
  104. });
  105. //提交习题答案
  106. $("#submit-answer").on("click", function () {
  107. getAllAnswer();
  108. });
  109. //回显习题答案
  110. $("#backup-answer").on("click", function () {
  111. backupAllAnswer(answerjson, 2);
  112. //var answerJson = "{\"AudioLength\":3,\"AudioUrl\":\"http://172.16.41.241:10103/http_TBookEditor51/exerciseAnswerAudio/2020-11-06_09-31-19.wav\",\"Id\":\"18\",\"Text\":\"\",\"Type\":3}";
  113. //reviewAnswer(answerJson);
  114. });
  115. //修改习题答案
  116. $("#update-answer").on("click", function () {
  117. //backupAllAnswer(answerjson, false);
  118. //var answerJson = "{\"AudioLength\":0,\"AudioUrl\":\"\",\"Id\":\"1\",\"Text\":\"sdasd\",\"Type\":1}";
  119. //var answerJson = "{\"AudioLength\":5,\"AudioUrl\":\"http://172.16.41.241:10103/Web_AITeachCloudV10/Files/UpLoad/zxstu155/2020/11/25/8a5d785d626748bbaa027895568d1bc3.wav\",\"Comment\":\"\",\"Id\":\"10\",\"PicUrl\":\"\",\"Score\":\"\",\"Text\":\"Good .\",\"Type\":3}";
  120. //测试数据
  121. //answerJson = "{\"AudioLength\":0,\"Id\":\"0\",\"Text\":\"i am how i know\",\"Type\":1}";
  122. answerJson = "{\"AudioLength\":3,\"AudioUrl\":\"http://172.16.41.241:10103/http_TBookEditor51/exerciseAnswerAudio/2020-11-06_09-31-19.wav\",\"Id\":\"4\",\"Text\":\"i know how i know \",\"Type\":3}";
  123. //var answerJson = "{\"AudioLength\":5,\"AudioUrl\":\"http://172.16.41.241:10103/Web_AITeachCloudV10/Files/UpLoad/zxstu155/2020/11/25/8a5d785d626748bbaa027895568d1bc3.wav\",\"Comment\":\"\",\"Id\":\"10\",\"PicUrl\":\"\",\"Score\":\"\",\"Text\":\"Good .\",\"Type\":3}";
  124. reviewAnswer(answerJson);
  125. });
  126. //回填评阅数据
  127. $("#backup-review").on("click", function () {
  128. backupAllReview(reviewjson);
  129. });
  130. //定位滚动数据
  131. $("#scroll-review").on("click", function () {
  132. scrollAnswer(randomNum(0,answerData.length-1));
  133. //scrollAnswer(91);
  134. });
  135. //测试UI效果
  136. $("#test-ui").on("click", function () {
  137. var clonediv = $(".btn-play").prop("outerHTML");
  138. $(".test-p").html($(".test-p").html() + clonediv);
  139. });
  140. var wordStyleFlag = true;
  141. var phraseStyleFlag = true;
  142. var sentenceStyleFlag = true;
  143. $("#wordStyleID").on("click", function () {
  144. wordStyleFlag = !wordStyleFlag;
  145. hightcodejson = null;
  146. hightcodejson = [];
  147. if (phraseStyleFlag) {
  148. for (var i = 0; i < JSON.parse($.ajax({ url: "HightCode/data202116P.json", async: false }).responseText).length; i++) {
  149. hightcodejson.push(JSON.parse($.ajax({ url: "HightCode/data202116P.json", async: false }).responseText)[i]);
  150. }
  151. }
  152. if (wordStyleFlag) {
  153. for (var i = 0; i < JSON.parse($.ajax({ url: "HightCode/data202116W.json", async: false }).responseText).length; i++) {
  154. hightcodejson.push(JSON.parse($.ajax({ url: "HightCode/data202116W.json", async: false }).responseText)[i]);
  155. }
  156. }
  157. if (sentenceStyleFlag) {
  158. for (var i = 0; i < JSON.parse($.ajax({ url: "HightCode/data202116S.json", async: false }).responseText).length; i++) {
  159. hightcodejson.push(JSON.parse($.ajax({ url: "HightCode/data202116S.json", async: false }).responseText)[i]);
  160. }
  161. }
  162. console.log(hightcodejson);
  163. Fill(hightcodejson);
  164. showGLWorld(wordStyleFlag, phraseStyleFlag, sentenceStyleFlag);
  165. });
  166. $("#phraseStyleID").on("click", function () {
  167. phraseStyleFlag = !phraseStyleFlag;
  168. hightcodejson = null;
  169. hightcodejson = [];
  170. if (phraseStyleFlag) {
  171. for (var i = 0; i < JSON.parse($.ajax({ url: "HightCode/data202116P.json", async: false }).responseText).length; i++) {
  172. hightcodejson.push(JSON.parse($.ajax({ url: "HightCode/data202116P.json", async: false }).responseText)[i]);
  173. }
  174. }
  175. if (wordStyleFlag) {
  176. for (var i = 0; i < JSON.parse($.ajax({ url: "HightCode/data202116W.json", async: false }).responseText).length; i++) {
  177. hightcodejson.push(JSON.parse($.ajax({ url: "HightCode/data202116W.json", async: false }).responseText)[i]);
  178. }
  179. }
  180. if (sentenceStyleFlag) {
  181. for (var i = 0; i < JSON.parse($.ajax({ url: "HightCode/data202116S.json", async: false }).responseText).length; i++) {
  182. hightcodejson.push(JSON.parse($.ajax({ url: "HightCode/data202116S.json", async: false }).responseText)[i]);
  183. }
  184. }
  185. console.log(hightcodejson);
  186. Fill(hightcodejson);
  187. showGLWorld(wordStyleFlag, phraseStyleFlag, sentenceStyleFlag);
  188. });
  189. $("#sentenceStyleID").on("click", function () {
  190. sentenceStyleFlag = !sentenceStyleFlag;
  191. hightcodejson = null;
  192. hightcodejson = [];
  193. if (phraseStyleFlag) {
  194. for (var i = 0; i < JSON.parse($.ajax({ url: "HightCode/data202116P.json", async: false }).responseText).length; i++) {
  195. hightcodejson.push(JSON.parse($.ajax({ url: "HightCode/data202116P.json", async: false }).responseText)[i]);
  196. }
  197. }
  198. if (wordStyleFlag) {
  199. for (var i = 0; i < JSON.parse($.ajax({ url: "HightCode/data202116W.json", async: false }).responseText).length; i++) {
  200. hightcodejson.push(JSON.parse($.ajax({ url: "HightCode/data202116W.json", async: false }).responseText)[i]);
  201. }
  202. }
  203. if (sentenceStyleFlag) {
  204. for (var i = 0; i < JSON.parse($.ajax({ url: "HightCode/data202116S.json", async: false }).responseText).length; i++) {
  205. hightcodejson.push(JSON.parse($.ajax({ url: "HightCode/data202116S.json", async: false }).responseText)[i]);
  206. }
  207. }
  208. console.log(hightcodejson);
  209. Fill(hightcodejson);
  210. showGLWorld(wordStyleFlag, phraseStyleFlag, sentenceStyleFlag);
  211. });
  212. $("#ShowID").on("click", function () {
  213. showGLWorld(true, true, true);
  214. });
  215. $("#HiddenID").on("click", function () {
  216. showGLWorld(false, false, false);
  217. });
  218. //生成从minNum到maxNum的随机数
  219. function randomNum(minNum, maxNum) {
  220. switch (arguments.length) {
  221. case 1:
  222. return parseInt(Math.random() * minNum + 1, 10);
  223. break;
  224. case 2:
  225. return parseInt(Math.random() * (maxNum - minNum + 1) + minNum, 10);
  226. break;
  227. default:
  228. return 0;
  229. break;
  230. }
  231. }
  232. </script>
  233. </body>
  234. </html>