main.bk.js 19KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710
  1. /**
  2. *
  3. * @authors Eric Hsiao
  4. *
  5. */
  6. var popAniRoot;
  7. main = function () {
  8. //private menbers
  9. var introAniRoot;
  10. var gameAniRoot;
  11. var isDrawing = false;
  12. var isStore = false;
  13. var drawCount;
  14. var myScore = 0;
  15. var currentScore = 0;
  16. var currentCheckinGp = 0;
  17. var scoreList = [66, 1, 3, 6, 8, 0, 9, 0];
  18. var dailyList = [1, 1, 1, 2, 2, 2, 3];
  19. var currentDaily = 0;
  20. var checkins = [];
  21. var userInfo;
  22. var LINEID;
  23. var name;
  24. var liffInitComplete = false;
  25. var testLINEID = 'Ud2534d6e1eed9cee2c919a993443352b';
  26. var testName = 'noh';
  27. var isComplete = false;
  28. var isLogin = false;
  29. var isCheck = false;
  30. var isCoupon = false;
  31. var errorMsg = '';
  32. var popoutClickHandle = function () { };
  33. //private methods
  34. function init() {
  35. if (getParameterByName('test') == 1) {
  36. var vConsole = new VConsole();
  37. }
  38. console.log('main is loaded. v1005');
  39. initLiff();
  40. TweenMax.to('.page__overlayer', 0.3, { delay: 1.2, autoAlpha: 0 })
  41. var _myAnimate = new createAnimate();
  42. _myAnimate.load($('.intro__content'), 'intro',
  43. function (_exportRoot) {
  44. introAniRoot = _exportRoot;
  45. setTimeout(function () {
  46. introAniRoot.play();
  47. }, 500);
  48. });
  49. var image = new Image();
  50. image.onload = function () {
  51. // ... 在圖片載入後要進行的操作 ...
  52. console.log('gameAni image onload.');
  53. _myAnimate.load($('.main__game'), 'gameAni',
  54. function (_exportRoot) {
  55. gameAniRoot = _exportRoot;
  56. setTimeout(function () {
  57. introAniRoot.isComplete = true;
  58. }, 500);
  59. gameAniRoot.stop();
  60. initGame();
  61. });
  62. }
  63. image.src = 'images/gameAni/gameAni_atlas_1.png';
  64. $('.main__pop').hide();
  65. _myAnimate.load($('.main__pop'), 'popAni',
  66. function (_exportRoot) {
  67. popAniRoot = _exportRoot;
  68. popAniRoot.stop();
  69. //修正字體
  70. popAniRoot.get_btn.score_txt.textBaseline = "alphabetic";
  71. popAniRoot.get_btn.score_txt.y = 77;
  72. popAniRoot.content_mc.a_icon.content_txt.textBaseline = "alphabetic";
  73. popAniRoot.content_mc.b_icon.content_txt.textBaseline = "alphabetic";
  74. popAniRoot.content_mc.a_icon.content_txt.y = 80;
  75. popAniRoot.content_mc.b_icon.content_txt.y = 80;
  76. });
  77. $('.game__popout__close').click(function (e) {
  78. e.preventDefault();
  79. TweenMax.to('.game__popout', 0.3, { autoAlpha: 0 });
  80. });
  81. $('.game__popout__submit').click(function (e) {
  82. e.preventDefault();
  83. popoutClickHandle();
  84. });
  85. onResize();
  86. $(window).resize(function () {
  87. onResize();
  88. });
  89. }
  90. function initLiff() {
  91. console.log('liff.init');
  92. liff.init({
  93. liffId: URL__LIFF__ID //test
  94. })
  95. .then(() => {
  96. if (!liff.isLoggedIn()) {// 如果沒有登入LINE,就登入
  97. liff.login();
  98. }
  99. })
  100. .catch((err) => {
  101. // Error happens during initialization
  102. console.log(err.code, err.message);
  103. showError('LINE系統連線錯誤:<br>' + err.message);
  104. });
  105. }
  106. function onResize() {
  107. var _h = $(window).height();
  108. var _d = $(window).height() / 1138;
  109. if (_d > 1) _d = 1;
  110. TweenMax.set('.game__fixed', { scale: _d });
  111. }
  112. function gameInto() {
  113. // initLiff();
  114. // console.log('initLiff');
  115. liff.getProfile().then(function (e) {
  116. LINEID = e.userId;
  117. name = e.displayName;
  118. // if (getParameterByName('test') == 1) {
  119. // LINEID = testLINEID;
  120. // name = testName;
  121. // }
  122. console.log("LINEID : " + LINEID + ' , name : ' + name);
  123. updateUserData();
  124. });
  125. }
  126. function initGame() {
  127. gameAniRoot.luckydraw_mc.mainCTA_mc.addEventListener("click", handleCTAClick);
  128. function handleCTAClick(event) {
  129. if (isComplete) {
  130. // showError('今天已經轉過,歡迎明天再來!');
  131. showError('<span style="font-size:0.8em">今天已經轉過,<br>歡迎明天再來!<br>別忘了振興五倍券,<br>綁台灣Pay超優惠~</span>');
  132. } else {
  133. if (!isDrawing) {
  134. isDrawing = true;
  135. //set drawCount
  136. //按下按鈕即開始轉動
  137. // gameAniRoot.luckydraw_mc.mainSpin_mc.gotoAndPlay('rolling');
  138. gameAniRoot.luckydraw_mc.mainCTA_mc.gotoAndPlay('rolling');
  139. gameAniRoot.luckydraw_mc.mainARR_mc.gotoAndPlay('rolling');
  140. gameAniRoot.luckydraw_mc.mainEffect_mc.flag_mc.gotoAndPlay('rolling');
  141. //讀取結果
  142. getGameGp(function (_res) {
  143. //顯示結果
  144. luckydrawStart();
  145. });
  146. }
  147. }
  148. }
  149. popAniRoot.addEventListener("click", handleGetClick);
  150. function handleGetClick(event) {
  151. $('.main__pop').hide();
  152. $('.main__pop__overlayer').hide();
  153. popAniRoot.gotoAndStop(0);
  154. // gameAniRoot.luckydraw_mc.mainCTA_mc.gotoAndPlay('stand');
  155. //更新分數
  156. // addScore(currentScore);
  157. updateScore();
  158. //取得Server data
  159. updateUserData();
  160. gameAniRoot.luckydraw_mc.store_mc.gotoAndPlay('complete');
  161. //更新打卡
  162. for (let index = 0; index < checkins.length; index++) {
  163. gameAniRoot.luckydraw_mc.dalylogin_mc['checkin_mc_' + index].alpha = 1;
  164. }
  165. // gameAniRoot.luckydraw_mc.dalylogin_mc['checkin_mc_' + (currentDaily - 1)].alpha = 1;
  166. }
  167. gameAniRoot.luckydraw_mc.store_mc.addEventListener("click", handleStoreClick);
  168. function handleStoreClick(event) {
  169. if (!isDrawing && !isStore) {
  170. isStore = true;
  171. gameAniRoot.luckydraw_mc.gotoAndPlay('storeInto');
  172. //每次進商店前就更新
  173. updateUserData();
  174. }
  175. }
  176. gameAniRoot.luckydraw_mc.storeClose_btn.addEventListener("click", handleStoreCloseClick);
  177. function handleStoreCloseClick(event) {
  178. gameAniRoot.luckydraw_mc.gotoAndPlay('storeClose');
  179. $('.game__store').hide();
  180. }
  181. }
  182. function updateGameContent() {
  183. //更新打卡
  184. console.log('========== updateGameContent ========');
  185. for (let index = 0; index < checkins.length; index++) {
  186. console.log('index = ' + index);
  187. gameAniRoot.luckydraw_mc.dalylogin_mc['checkin_mc_' + index].alpha = 1;
  188. //更新轉盤狀態
  189. if (userInfo.roundinfo.today == checkins[index].date) {
  190. isCheck = true;
  191. console.log('今日已簽到');
  192. }
  193. }
  194. //更新商店按鈕
  195. if (myScore > 0) {
  196. gameAniRoot.luckydraw_mc.store_mc.gotoAndPlay('complete');
  197. }
  198. //皆無庫存
  199. var selloutCount = 0;
  200. for (let index = 0; index < userInfo.goodinfo.length; index++) {
  201. if (userInfo.goodinfo[index].issoldout) {
  202. selloutCount++;
  203. console.log('selloutCount = ' + selloutCount);
  204. }
  205. }
  206. /*if (selloutCount >= userInfo.goodinfo.length) {
  207. $('.game__popout__content .content').hide();
  208. $('.game__popout__submit').hide();
  209. $('.game__popout__content .content__result').show();
  210. $('.game__popout__content .content__result__text').html('<p>活動已結束<br>感謝您的參與!​</p>');
  211. showPopout();
  212. }*/
  213. //更新Coupon
  214. updateCoupon();
  215. }
  216. function updateLogin() {
  217. if (isLogin) {
  218. setTimeout(function () {
  219. gameAniRoot.play();
  220. introAniRoot.gotoAndPlay('intoGame');
  221. }, 1000);
  222. //初始化分數
  223. setTimeout(function () {
  224. updateScore();
  225. updateGameContent();
  226. }, 2500);
  227. setTimeout(function () {
  228. showError('<span style="font-size:0.8em">轉盤內優惠公告訊息,<br>為台灣Pay振興五倍券專屬優惠,<br>詳情洽台灣Pay官方網站。</span>');
  229. }, 2800);
  230. } else {
  231. if (errorMsg == '請先加入 LINE 好友') {
  232. setTimeout(function () {
  233. alert('請先完成註冊,再重新進入遊戲');
  234. liff.openWindow({
  235. url: URL__REGISTER,
  236. external: false
  237. });
  238. }, 300);
  239. } else {
  240. showError('系統訊息:<br>' + errorMsg);
  241. $('.game__popout__close').click(function (e) {
  242. liff.closeWindow();
  243. });
  244. }
  245. }
  246. }
  247. function updateUserData() {
  248. console.log('================== updateUserData ===================');
  249. $.ajax({
  250. type: "GET",
  251. url: API__DOMAIN + "api2021/info/" + LINEID,
  252. data: {
  253. // LINEID: LINEID
  254. },
  255. dataType: "json",
  256. success: function (response) {
  257. if (response.succ) {
  258. userInfo = response.info;
  259. checkins = userInfo.roundinfo.checkins;
  260. myScore = userInfo.playerinfo.gp;
  261. if (!isLogin) {
  262. isLogin = true;
  263. updateLogin();
  264. } else {
  265. // if (!isCoupon) initCoupon();
  266. updateGameContent();
  267. }
  268. if (!isCoupon) initCoupon();
  269. console.log(userInfo);
  270. } else {
  271. /*if (response.err == '請先加入 LINE 好友') {
  272. isLogin = false;
  273. } else {
  274. showError(response.err);
  275. }*/
  276. isLogin = false;
  277. errorMsg = response.err;
  278. updateLogin();
  279. }
  280. },
  281. error: function (XMLHttpRequest, textStatus, errorThrown) {
  282. console.log("Status: " + textStatus + ", Error: " + errorThrown);
  283. showError('使用者資料連線錯誤:<br>' + "Status: " + textStatus + ", Error: " + errorThrown);
  284. TweenMax.to('.loading', 0.3, { autoAlpha: 0 });
  285. }
  286. });
  287. }
  288. function getGameGp(_callback) {
  289. // drawCount = Math.floor(Math.random() * 8);
  290. // _callback();
  291. $.ajax({
  292. type: "POST",
  293. url: API__DOMAIN + "api2021/game/" + LINEID,
  294. data: {
  295. name: name
  296. },
  297. dataType: "json",
  298. success: function (response) {
  299. console.log('================== response ===================');
  300. console.log(response);
  301. if (response.succ) {
  302. currentScore = response.currentGameGp;
  303. currentCheckinGp = response.currentCheckinGp;
  304. myScore = response.gpAll;
  305. console.log('本次轉盤點數為 : ' + response.currentGameGp);
  306. console.log('本次簽到點數為 : ' + response.currentCheckinGp);
  307. if (response.currentGameGp == -1) isComplete = false;
  308. switch (currentScore) {
  309. case 66:
  310. drawCount = 0;
  311. break;
  312. case 1:
  313. drawCount = 1;
  314. break;
  315. case 3:
  316. drawCount = 2;
  317. break;
  318. case 6:
  319. drawCount = 3;
  320. break;
  321. case 8:
  322. drawCount = 4;
  323. break;
  324. case 0:
  325. drawCount = 5;
  326. break;
  327. case 9:
  328. drawCount = 6;
  329. break;
  330. case -1:
  331. drawCount = 7;
  332. break;
  333. }
  334. _callback();
  335. } else {
  336. showError('<span style="font-size:0.8em">今天已經轉過,<br>歡迎明天再來!<br>別忘了振興五倍券,<br>綁台灣Pay超優惠~</span>');
  337. isDrawing = false;
  338. gameAniRoot.luckydraw_mc.mainSpin_mc.gotoAndPlay('stand');
  339. // gameAniRoot.luckydraw_mc.mainCTA_mc.gotoAndPlay('stand');
  340. gameAniRoot.luckydraw_mc.mainARR_mc.gotoAndPlay('stand');
  341. gameAniRoot.luckydraw_mc.mainEffect_mc.flag_mc.gotoAndPlay('stand');
  342. isComplete = true;
  343. }
  344. },
  345. error: function (XMLHttpRequest, textStatus, errorThrown) {
  346. console.log("Status: " + textStatus + ", Error: " + errorThrown);
  347. // alert('很抱歉,資料讀取錯誤 請稍後再試。');
  348. showError('資料庫連線錯誤:<br>' + "Status: " + textStatus + ", Error: " + errorThrown);
  349. TweenMax.to('.loading', 0.3, { autoAlpha: 0 });
  350. }
  351. });
  352. }
  353. function luckydrawStart() {
  354. console.log('drawCount = ' + drawCount);
  355. isDrawing = true;
  356. // gameAniRoot.luckydraw_mc.mainSpin_mc.gotoAndPlay('rolling');
  357. // gameAniRoot.luckydraw_mc.mainCTA_mc.gotoAndPlay('rolling');
  358. // gameAniRoot.luckydraw_mc.mainARR_mc.gotoAndPlay('rolling');
  359. // gameAniRoot.luckydraw_mc.mainEffect_mc.flag_mc.gotoAndPlay('rolling');
  360. gameAniRoot.luckydraw_mc.mainSpin_mc.gotoAndPlay('rolling');
  361. gameAniRoot.luckydraw_mc.mainSpin_mc.wheel_mc.isComplete = false;
  362. setTimeout(function () {
  363. gameAniRoot.luckydraw_mc.mainSpin_mc.wheel_mc.setComplete(drawCount);
  364. }, 500);
  365. // gameAniRoot.luckydraw_mc.mainSpin_mc.wheel_mc.setComplete(drawCount);
  366. }
  367. function luckydrawComplete() {
  368. // isComplete = true;
  369. gameAniRoot.luckydraw_mc.mainTitle_mc.gotoAndPlay('complete');
  370. gameAniRoot.luckydraw_mc.mainSpin_mc.gotoAndPlay('complete');
  371. gameAniRoot.luckydraw_mc.mainARR_mc.gotoAndPlay('complete');
  372. gameAniRoot.luckydraw_mc.mainEffect_mc.flag_mc.gotoAndPlay('complete');
  373. gameAniRoot.luckydraw_mc.mainCTA_mc.gotoAndPlay('complete');
  374. if (drawCount == 7) {
  375. //再轉一次
  376. setTimeout(function () {
  377. // luckydrawStart();
  378. setTimeout(function () {
  379. isComplete = false;
  380. isDrawing = false;
  381. gameAniRoot.luckydraw_mc.mainCTA_mc.gotoAndPlay('stand');
  382. }, 1000);
  383. if (currentCheckinGp !== 0) {
  384. $('.main__pop').show();
  385. $('.main__pop__overlayer').show();
  386. popAniRoot.gotoAndPlay('into');
  387. console.log('再轉一次');
  388. popAniRoot.content_mc.a_icon.content_txt.text = 0;
  389. popAniRoot.content_mc.b_icon.content_txt.text = currentCheckinGp;
  390. // currentDaily++;
  391. if (!isCheck) {
  392. isCheck = true;
  393. gameAniRoot.luckydraw_mc.dalylogin_mc['checkin_mc_' + checkins.length].alpha = 1;
  394. }
  395. popAniRoot.get_btn.score_txt.text = currentCheckinGp;
  396. }
  397. }, 300);
  398. } else {
  399. isDrawing = false;
  400. $('.main__pop').show();
  401. $('.main__pop__overlayer').show();
  402. popAniRoot.gotoAndPlay('into');
  403. popAniRoot.content_mc.a_icon.content_txt.text = currentScore;
  404. popAniRoot.content_mc.b_icon.content_txt.text = currentCheckinGp;
  405. currentScore += currentCheckinGp;
  406. // currentDaily++;
  407. if (!isCheck) {
  408. isCheck = true;
  409. gameAniRoot.luckydraw_mc.dalylogin_mc['checkin_mc_' + checkins.length].alpha = 1;
  410. }
  411. popAniRoot.get_btn.score_txt.text = currentScore;
  412. isComplete = true;
  413. }
  414. }
  415. function addScore(_number) {
  416. myScore += _number;
  417. updateScore();
  418. }
  419. function updateScore() {
  420. $('.game__myScore').text(myScore);
  421. }
  422. function storeIntoComplete() {
  423. // $('.game__store').show();
  424. $('.game__store').show();
  425. //init loadStore
  426. TweenMax.set('.game__store', { autoAlpha: 0 });
  427. TweenMax.to('.game__store', 0.3, { autoAlpha: 1 });
  428. }
  429. function initCoupon() {
  430. isCoupon = true;
  431. $('.video__close').click(function (e) {
  432. e.preventDefault();
  433. TweenMax.to('.video__popout', 0.3, { autoAlpha: 0 });
  434. // $('.video__content').html('');
  435. player.stopVideo();
  436. });
  437. //updateCoupon
  438. updateCoupon();
  439. }
  440. function updateCoupon() {
  441. console.log('============== updateCoupon ==============');
  442. // console.log(userInfo.goodinfo);
  443. $('.game__store__coupon').html('');
  444. if(userInfo.goodinfo == ''){
  445. console.log('goodinfo 初始狀態');
  446. }
  447. for (let index = 0; index < userInfo.goodinfo.length; index++) {
  448. var _coupon;
  449. if (userInfo.goodinfo[index].lp < 5) {
  450. _coupon = new couponItem(index, userInfo.goodinfo[index]);
  451. } else {
  452. var _isLock;
  453. if ($.cookie('luckydraw.isVideoUnlock')) {
  454. _isLock = false;
  455. } else {
  456. _isLock = true;
  457. }
  458. console.log('luckydraw.isVideoUnlock = ' + $.cookie('luckydraw.isVideoUnlock'));
  459. //YOUTUBE LINK
  460. _coupon = new couponItem(index, $.extend(userInfo.goodinfo[index], { lock: _isLock, video: 'mDD48KKCqYw' }));
  461. }
  462. }
  463. }
  464. function showPopout() {
  465. $('.game__popout').show();
  466. TweenMax.set('.game__popout', { autoAlpha: 0 });
  467. TweenMax.to('.game__popout', 0.5, { autoAlpha: 1 });
  468. }
  469. /* function useCoupon(_number, _callback) {
  470. var _tempScore = myScore;
  471. if (_tempScore + _number < 0) {
  472. alert('很抱歉,吉點不足。');
  473. } else {
  474. addScore(_number);
  475. TweenMax.to('.game__popout', 0.3, { autoAlpha: 0 });
  476. //call 打點API
  477. //讀取Coupon新Data
  478. setTimeout(function () {
  479. //顯示成功與否
  480. $('.game__popout__content .content').hide();
  481. $('.game__popout__submit').hide();
  482. $('.game__popout__content .content__result').show();
  483. $('.game__popout__content .content__result__text').html('<p>兌換完成<br>請至LINE錢包<br>查看點數</p>');
  484. TweenMax.to('.game__popout', 0.5, { autoAlpha: 1 });
  485. //Coupon更新自己狀態
  486. _callback();
  487. }, 500);
  488. }
  489. }*/
  490. function useCoupon(_id, _number, _callback) {
  491. addScore(_number);
  492. TweenMax.to('.game__popout', 0.3, { autoAlpha: 0 });
  493. $.ajax({
  494. type: "POST",
  495. url: API__DOMAIN + "api2021/redeem/" + LINEID + '/' + _id,
  496. data: {
  497. name: name
  498. },
  499. dataType: "json",
  500. success: function (response) {
  501. console.log('================== response ===================');
  502. console.log(response);
  503. if (response.succ) {
  504. //顯示成功與否
  505. $('.game__popout__content .content').hide();
  506. $('.game__popout__submit').hide();
  507. $('.game__popout__content .content__result').show();
  508. $('.game__popout__content .content__result__text').html('<p>兌換完成<br>請至LINE錢包<br>查看點數</p>');
  509. showPopout();
  510. //Coupon更新自己狀態
  511. _callback();
  512. updateUserData();
  513. } else {
  514. showError("兌換錯誤:<br>" + response.err);
  515. }
  516. },
  517. error: function (XMLHttpRequest, textStatus, errorThrown) {
  518. console.log("Status: " + textStatus + ", Error: " + errorThrown);
  519. // alert('很抱歉,資料讀取錯誤 請稍後再試。');
  520. showError("連線錯誤:<br>" + "Status: " + textStatus + ", Error: " + errorThrown);
  521. TweenMax.to('.loading', 0.3, { autoAlpha: 0 });
  522. }
  523. });
  524. }
  525. function showLoading() {
  526. }
  527. function showError(_msg) {
  528. //顯示成功與否
  529. $('.game__popout__content .content').hide();
  530. $('.game__popout__submit').hide();
  531. $('.game__popout__content .content__result').show();
  532. $('.game__popout__content .content__result__text').html('<p>系統忙碌中<br>請稍後再試</p>');
  533. showPopout();
  534. if (_msg != undefined) {
  535. $('.game__popout__content .content__result__text').html('<p>' + _msg + '</p>');
  536. }
  537. }
  538. //constructor
  539. {
  540. $(document).ready(function () {
  541. init();
  542. });
  543. }
  544. //public
  545. return {
  546. gameInto: function () {
  547. console.log('gameInto');
  548. gameInto();
  549. },
  550. luckydrawComplete: function () {
  551. luckydrawComplete();
  552. },
  553. storeIntoComplete: function () {
  554. storeIntoComplete();
  555. },
  556. storeCloseComplete: function () {
  557. isStore = false;
  558. },
  559. showPopout: function (_clickHandle) {
  560. showPopout();
  561. popoutClickHandle = _clickHandle;
  562. },
  563. useCoupon: function (_id, _number, _callback) {
  564. useCoupon(_id, _number, _callback);
  565. },
  566. }
  567. };
  568. var main = new main();