templates/frontend/default/api.html.twig line 1

Open in your IDE?
  1. <script>
  2. $( document ).ready(function() {
  3. {% if env == 'game' %}
  4. loginCallback();
  5. {% else %}
  6. prompt("cmhk://epg/login?return=loginCallback");
  7. {% endif %}
  8. })
  9. var missionData = [];
  10. var monthlyRemind = true;
  11. function loginCallback(res){
  12. {% if env == 'game' %}
  13. res = {
  14. "code": 200,
  15. "message":"登录成功",
  16. "info":{
  17. "userId":"xxx",
  18. "userToken":"test",
  19. "userName":"xxx",
  20. "userHeadImg":"xxx",
  21. "userTel":"66627172",
  22. "platformCode":"xxx",
  23. "mac":"xxx"
  24. }
  25. }
  26. {% endif %}
  27. console.log("login call back");
  28. console.log(res)
  30. let data;
  31. if (res && res.info)
  32. {
  33. $('#entryRequirements .userPhone span').html(res.info.userTel);
  34. $.post("{{ path('api_get_user', {'language': app.request.locale}) }}", { "data": res.info },
  35. function (data, status) {
  36. if (data.code == '200') {
  37. jwt = data.jwt;
  38. localStorage.setItem('{{ localStorage_name }}', jwt);
  39. // enable/disable entryRequirement
  40. if(data.validUser){
  41. $('.validUser').show();
  42. $('#entryRequirements .success').show();
  43. $('#entryRequirements .fail').hide();
  44. if(data.startGame){
  45. $('#entryRequirements .success').css('background-image', "url('{{ asset('images/entry_bg_success_start.png') }}')");
  46. if(!data.firstLogin){
  47. var expirationDateTop = $('#expirationDate').offset().top;
  48. var headerOffset = 0; // Adjust this value based on your header height
  49. $('html, body').animate({
  50. scrollTop: expirationDateTop - headerOffset
  51. }, 1000);
  52. }
  53. monthlyRemind = data.monthlyRemind;
  54. getCurrentMonthMission();
  55. }else{
  56. $('#entryRequirements .success').css('background-image', "url('{{ asset('images/entry_bg_success_nonstart.png') }}')");
  57. $('#mission').hide();
  58. $('#missionStatus').hide();
  59. $('.bgbox').css('height','auto');
  60. if ($(window).width() >= 700) {
  61. $('header').css('height', '195vw');
  62. } else {
  63. $('header').css('height', '260vw'); // 或根據需要設置其他值
  64. }
  65. }
  66. const currentDate = new Date();
  67. // Get the current year and month
  68. const currentYear = currentDate.getFullYear();
  69. const currentMonth = currentDate.getMonth();
  71. // Create a new date object for the first day of the next month
  72. const firstDayNextMonth = new Date(currentYear, currentMonth + 1, 1);
  74. // Subtract one day to get the last day of the current month
  75. const lastDateOfCurrentMonth = new Date(firstDayNextMonth - 1);
  77. $('div.missionDuration span').html(`${lastDateOfCurrentMonth.getMonth() + 1} 月 1 至 ${lastDateOfCurrentMonth.getDate()} 日`);
  78. $('#expirationDate p').html(`2026 年 ${data.userExpirationMonth} 月 ${data.userExpirationDate} 日`);
  80. }else{
  81. if ($(window).width() >= 700) {
  82. $('header').css('height', '195vw');
  83. } else {
  84. $('header').css('height', '260vw'); // 或根據需要設置其他值
  85. }
  86. $('.bgbox').css('height','auto');
  87. $('#entryRequirements .fail').show();
  88. $('#entryRequirements .success').hide();
  89. }
  90. }
  91. else if (data.code == '400') {
  92. $("#modal_message_success").html(data.message);
  93. $('#myModal_success').modal('show');
  94. }
  95. });
  96. }
  97. else
  98. {
  99. $("#modal_message_success").html('{{ "error.user" | trans }}');
  100. $('#myModal_success').modal('show');
  101. }
  102. }
  104. function getCurrentMonthMission(){
  105. let jwt = localStorage.getItem('{{ localStorage_name }}');
  106. $.post("{{ path('api_get_current_month_mission', {'language': app.request.locale}) }}", { "jwt": jwt },
  107. function (data, status){
  108. data.weekly_mission.forEach(function(dates) {
  109. let jsonParams = {
  110. pageIndex: 0,
  111. pageSize: 10,
  112. startTime: dates[0],
  113. endTime: dates[1],
  114. };
  115. {% if env == 'game' %}
  116. historyCallback();
  117. {% else %}
  118. prompt("cmhk://epg/history?jsonParam=" + encodeURIComponent(JSON.stringify(jsonParams)) + "&return=historyCallback");
  119. {% endif %}
  120. });
  121. setTimeout(function () {
  122. $.post("{{ path('api_get_mission_status', {'language': app.request.locale}) }}", { "data": JSON.stringify(missionData), 'jwt': jwt },
  123. function (data, status){
  124. let totalMissionCount = Object.values(data.data).length;
  125. let nonFinishMissionCount = 0;
  126. let finishMissionCount = 0;
  127. let statusData = data.data;
  128. $('#expirationDate p').html(data.exp_date);
  129. Object.keys(statusData).forEach((key,index) => {
  130. if(statusData[key] =="Done"){
  131. finishMissionCount++;
  132. }else if(statusData[key] == "fail"){
  133. nonFinishMissionCount++;
  134. }
  135. const container = document.getElementById('missionList');
  136. const containerBouns = document.getElementById('missionBonus');
  137. let missionHTML = renderMissionTemplate(key, statusData[key],index);
  138. if(key == 'bonus'){
  139. containerBouns.insertAdjacentHTML('beforeend', missionHTML);
  140. }else{
  141. container.insertAdjacentHTML('beforeend', missionHTML);
  142. }
  143. });
  144. if(finishMissionCount >= 3){
  145. if(!data.has_redeem){
  146. $('#myModal_mission_success').modal('show');
  147. }
  148. $('#missionStatus').css('background-image',"url('{{ asset('images/mission_status_done.png') }}')")
  149. }else if(totalMissionCount - nonFinishMissionCount < 3){
  150. $('#missionStatus').css('background-image',"url('{{ asset('images/mission_status_fail.png') }}')")
  151. }else{
  152. $('#missionStatus').css('background-image',"url('{{ asset('images/mission_status_wait.png') }}')")
  153. }
  154. }
  155. )
  156. }, 1000);
  157. }
  158. );
  159. }
  160. function historyCallback(res) {
  161. {% if env == 'game' %}
  162. res = {
  163. "code": 200,
  164. "message":"获取成功",
  165. "info":{
  166. "data":[
  167. {
  168. "historyId":"1",
  169. "historyName":"xxx1",
  170. "historyTime":"1767339023000",
  171. },
  172. {
  173. "historyId":"2",
  174. "historyName":"xxx2",
  175. "historyTime":"1767857423000",
  176. },
  177. {
  178. "historyId":"3",
  179. "historyName":"xxx2",
  180. "historyTime":"1768375823",
  181. }
  182. ]
  183. }
  184. }
  185. {% endif %}
  186. //console.log("history call back");
  187. //console.log(res);
  189. if (res && res.info && res.info.data){
  190. res.info.data.forEach(function(data) {
  191. missionData.push(data);
  192. })
  193. }
  194. }
  196. function renderMissionTemplate(date, status, index) {
  197. let imgSrc;
  198. switch(status){
  199. case 'fail':
  200. imgSrc = 'images/fail_btn.png';
  201. break;
  202. case 'non-start':
  203. imgSrc = 'images/non_start_btn.png';
  204. break;
  205. case 'non-finish':
  206. imgSrc = 'images/goto_btn.png';
  207. break;
  208. case 'CanSign':
  209. imgSrc = 'images/goto_btn.png';
  210. break;
  211. case 'Done':
  212. imgSrc = 'images/done_btn.png';
  213. break;
  214. case 'notQualified':
  215. imgSrc = 'images/notQualified_btn.png';
  216. break;
  217. default:
  218. imgSrc = 'images/goto_login.png';
  219. break;
  220. }
  223. return `
  224. <div class="missionItem">
  225. ${date === "bonus" ? `
  226. <p class="col-3 bonus-date" >補簽機會</p>
  227. <p class="col-5 bonus-body" >完整觀看指定影片即完成 1 次補簽</p>
  228. <div class="col-3 bonus-btn" ${status == 'Done' ? 'style="pointer-events: none;"' : "id='bonusBtn' data-toggle='modal' data-target='#myModal_video' onclick='embedVideo()'"}>
  229. <img class='missionBtn' src="{{ asset('${imgSrc}') }}">
  230. </div>
  231. ` : `
  232. <p class="col-3 mission-date">第 ${index} 周</p>
  233. <p class="col-5 mission-body">${date}</p>
  234. <button class="col-3 mission-btn" ${monthlyRemind == false ? 'onclick="monthlyReMind()"':'onclick="gotoPage()"'} ${status !== 'non-finish' ? 'style="pointer-events: none;"' : ''}>
  235. <img class='missionBtn' src="{{ asset('${imgSrc}') }}">
  236. </button>
  237. `}
  238. </div>
  239. `;
  240. }
  241. </script>