learning-theory.js 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381
  1. window.history.forward();
  2. $(document).ready(function () {
  3. updateProcess();
  4. });
  5. function updateProcess() {
  6. var total = parseInt($(".theory-data-list").attr('total'));
  7. var indexCur = parseInt($(".theory-data-list .theory-data-item.item-current").attr('index'));
  8. $(".theory-data-paginate .paginate-number.paginate-active").removeClass('paginate-active');
  9. $(".theory-data-paginate .paginate-item.paginate-current .paginate-number[index='" + indexCur + "']").addClass('paginate-active');
  10. $(".theory-data-list .theory-data-item.item-current").css('display', 'block');
  11. $(".theory-data-paginate .paginate-item.paginate-current").css('display', 'block');
  12. if (total > 0) {
  13. $(".theory-process .theory-process-bar").width((indexCur + 1) * 100 / total + '%');
  14. }
  15. if ($(".theory-data-list .theory-data-item.item-current .icon-sound").length > 0) {
  16. setTimeout(function () {
  17. playSound($(".theory-data-list .theory-data-item.item-current .icon-sound"));
  18. }, 700);
  19. }
  20. }
  21. $(document).on('click', '.icon-sound', function () {
  22. playSound($(this), cache_fcComplete);
  23. });
  24. var cache_fcComplete = function () { };
  25. var checkLoadAudio;
  26. function playSound(element, fcComplete = function () { }) {
  27. // Set function callback to function temp
  28. cache_fcComplete = fcComplete;
  29. stopSound();
  30. // Get link audio and element audio
  31. var src = $(element).attr('sound_url');
  32. var speaker = $('.speaker-audio-1')[0];
  33. if (src != undefined && src != "") {
  34. $(".exe-icon-sound").removeClass('sound-active');
  35. // Load audio
  36. $(speaker).attr('src', src);
  37. speaker.load();
  38. // Check audio load after 3s
  39. checkLoadAudio = setTimeout(function () {
  40. // Run callback
  41. fcComplete();
  42. // Remove function callback temp
  43. cache_fcComplete = function () { };
  44. }, 3000);
  45. // If audoo load success
  46. speaker.onloadeddata = function () {
  47. // Remove timeout
  48. clearTimeout(checkLoadAudio);
  49. // Play audio
  50. speaker.play();
  51. element.addClass('sound-active');
  52. // End audio
  53. speaker.onended = function () {
  54. element.removeClass('sound-active');
  55. // Run callback
  56. fcComplete();
  57. // Remove function callback temp
  58. cache_fcComplete = function () { };
  59. };
  60. };
  61. }
  62. }
  63. function stopSound() {
  64. $('.icon-sound.sound-active').removeClass('sound-active');
  65. ($('.speaker-audio-1')[0]).pause();
  66. clearTimeout(checkLoadAudio);
  67. }
  68. var checkClickNext = 1;
  69. // Button NEXT
  70. $(document).on('click', '.theory-bottom .button.button-next', function () {
  71. stopSound();
  72. if (checkClickNext == 1) {
  73. checkClickNext = 0;
  74. var divCurrent = $(".theory-data-item.item-current");
  75. var indexCur = parseInt($(divCurrent).attr('index'));
  76. var indexNext = indexCur + 1;
  77. console.log(indexNext);
  78. changeQuestion(divCurrent, indexNext);
  79. }
  80. });
  81. // Button PREV
  82. $(document).on('click', '.theory-bottom .button.button-prev', function () {
  83. stopSound();
  84. if (checkClickNext == 1) {
  85. checkClickNext = 0;
  86. var divCurrent = $(".theory-data-item.item-current");
  87. var indexCur = parseInt($(divCurrent).attr('index'));
  88. var indexPrev = indexCur - 1;
  89. changeQuestion(divCurrent, indexPrev);
  90. }
  91. });
  92. function changeQuestion(divCurrent, indexNext) {
  93. var total = parseInt($(".theory-data-list").attr('total'));
  94. var indexCur = parseInt($(divCurrent).attr('index'));
  95. if (indexNext >= 0 && indexNext < total && indexNext != indexCur) {
  96. var divShow = $(".theory-data-item[index='" + indexNext + "']");
  97. //if(divShow.length > 0){
  98. $(divShow).addClass('item-current');
  99. $(divCurrent).removeClass('item-current');
  100. var isPrev = 0;
  101. if (indexNext < indexCur) {
  102. isPrev = 1;
  103. }
  104. if (isPrev == 0) {
  105. $(divShow).removeClass('theory-hide-question prev');
  106. $(divCurrent).removeClass('theory-show-question prev');
  107. $(divShow).addClass('theory-show-question');
  108. $(divCurrent).addClass('theory-hide-question');
  109. } else {
  110. $(divShow).removeClass('theory-hide-question prev');
  111. $(divCurrent).removeClass('theory-show-question prev');
  112. $(divCurrent).addClass('theory-hide-question prev');
  113. $(divShow).addClass('theory-show-question prev');
  114. }
  115. // Show number paginate
  116. var typeDataNext = parseInt($(divShow).attr('typeData'));
  117. var paginateItemNext = $('.theory-data-paginate .paginate-item[typeData="' + typeDataNext + '"]');
  118. var paginateItemCur = $('.theory-data-paginate .paginate-item.paginate-current');
  119. var typeDataCur = parseInt($(paginateItemCur).attr('typeData'));
  120. if (typeDataNext != typeDataCur) {
  121. $(paginateItemNext).addClass('paginate-current');
  122. $(paginateItemCur).removeClass('paginate-current');
  123. if (isPrev == 0) {
  124. $(paginateItemNext).find('.paginate-item-cover').removeClass('theory-hide-question prev');
  125. $(paginateItemCur).find('.paginate-item-cover').removeClass('theory-show-question prev');
  126. $(paginateItemNext).find('.paginate-item-cover').addClass('theory-show-question');
  127. $(paginateItemCur).find('.paginate-item-cover').addClass('theory-hide-question');
  128. } else {
  129. $(paginateItemNext).find('.paginate-item-cover').removeClass('theory-hide-question prev');
  130. $(paginateItemCur).find('.paginate-item-cover').removeClass('theory-show-question prev');
  131. $(paginateItemCur).find('.paginate-item-cover').addClass('theory-hide-question prev');
  132. $(paginateItemNext).find('.paginate-item-cover').addClass('theory-show-question prev');
  133. }
  134. }
  135. setTimeout(function () {
  136. $(divCurrent).hide();
  137. if (typeDataNext != typeDataCur) {
  138. $(paginateItemCur).hide();
  139. }
  140. checkClickNext = 1;
  141. }, 600);
  142. updateProcess();
  143. //}else{
  144. // getDataTheory(indexNext, function(result){
  145. // if(result.length == 2){
  146. // if(result[0] == 'true'){
  147. // $(".theory-data-list").append(result[1]);
  148. // changeQuestion(divCurrent, indexNext);
  149. // }else if(result[0] == 'false'){
  150. // window.location.href = result[1];
  151. // }
  152. // }
  153. // });
  154. //}
  155. } else if (indexNext >= total) {
  156. window.location.href = $("#learning-theory-complete").val();
  157. } else {
  158. checkClickNext = 1;
  159. }
  160. }
  161. function getDataTheory(indexNext, fcGetdata) {
  162. $.ajaxSetup({
  163. headers: {
  164. 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
  165. }
  166. });
  167. $.ajax({
  168. url: $("#learning-theory-data").val(),
  169. type: "POST",
  170. data: {
  171. index: indexNext
  172. },
  173. success: function (result) {
  174. console.log(result);
  175. fcGetdata(result);
  176. }
  177. });
  178. }
  179. $(document).on('click', '.theory-data-paginate .paginate-number,.bullet-item ', function () {
  180. stopSound();
  181. if (checkClickNext == 1) {
  182. checkClickNext = 0;
  183. var divCurrent = $(".theory-data-item.item-current");
  184. var indexNext = parseInt($(this).attr('index'));
  185. changeQuestion(divCurrent, indexNext);
  186. }
  187. });
  188. $(document).ready(function () {
  189. //feedback
  190. //click feedback cancel button
  191. $('.cancel-fault').click(function () {
  192. $('.txt-fault').val('');
  193. $('#feedback-fault').modal('hide');
  194. });
  195. var checkOption = 1;
  196. $('.slt-fault').click(function (e) {
  197. checkOption = 0;
  198. $('.slt-fault-option').slideToggle();
  199. setTimeout(function () {
  200. checkOption = 1;
  201. }, 500);
  202. });
  203. $('#feedback-fault .modal-body').click(function () {
  204. if (checkOption == 1) {
  205. $('.slt-fault-option').slideUp();
  206. }
  207. });
  208. $('.slt-item').click(function () {
  209. var val = $(this).attr('value');
  210. $('.slt-fault span').attr('value', val);
  211. $('.slt-fault span').text($(this).text());
  212. });
  213. //feedback fault
  214. $('.send-fault').click(function () {
  215. var contentFault = $('.txt-fault').val();
  216. var fault = $('.slt-fault span').attr('value');
  217. var url = $(this).attr('link');
  218. if (contentFault.trim() == "") {
  219. return;
  220. }
  221. $('.txt-fault').val('');
  222. $.ajaxSetup({
  223. headers: {
  224. 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
  225. }
  226. });
  227. $.ajax({
  228. url: url,
  229. type: "POST",
  230. data: {
  231. 'fault_id': fault,
  232. 'content': contentFault
  233. },
  234. success: function (result) {
  235. if (result == 1) {
  236. $('.modal-content-feedback').css('display', 'none');
  237. $('.modal-content-thanks').css('display', 'block');
  238. $('.txt-fault').val('');
  239. setTimeout(function () {
  240. $('#feedback-fault').modal('hide')
  241. $('.modal-content-thanks').css('display', 'none');
  242. $('.modal-content-feedback').css('display', 'block');
  243. }, 3000);
  244. }
  245. }
  246. });
  247. });
  248. });
  249. // MORE SAMPLE
  250. //$(document).on('click', '.theory-data-content .data-button-more', function () {
  251. // var index = $(this).attr('index');
  252. // var link = $('#learning-theory-more-sample').val();
  253. // var modal = $("#more-sample-modal");
  254. // var modalIndex = $(modal).attr('index');
  255. // if (modalIndex == index) {
  256. // $("#more-sample-modal").modal();
  257. // } else {
  258. // $(modal).attr('index', index);
  259. // $.ajaxSetup({
  260. // headers: {
  261. // 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
  262. // }
  263. // });
  264. // $.ajax({
  265. // url: link,
  266. // type: "POST",
  267. // data: {
  268. // 'index': index
  269. // },
  270. // success: function (result) {
  271. // console.log(result);
  272. // if (result[0] == 'true') {
  273. // $(modal).html(result[1]);
  274. // modal.modal();
  275. // } else if (result[0] == 'false') {
  276. // window.location.href = result[1];
  277. // }
  278. // }
  279. // });
  280. // }
  281. //});