var FlexibleScreen, Main_Page, Main_Page_Lock, Tuto_Page, all, appPlay, blockEvent, c, cateArr, cateBg_hide, cateBg_show, firstSetting, fisrt_ani, i, indicator_Fn, j, k, l, len, len1, loadInterval, motion_Fn, pArr, ref, screenLanding, t, titleAni, titleArr, tutoArr, vinylc_loading; Framer.Extras.Hints.disable(); Framer.Extras.Preloader.disable(); Screen.backgroundColor = "white"; FlexibleScreen = require("FlexibleScreen").FlexibleScreen; blockEvent = new Layer({ size: Screen.size, backgroundColor: "", visible: false }); blockEvent.onTap(function() {}); all = new FlexibleScreen({ backgroundColor: "white", width: 1242, height: 2208, _blockEvent: blockEvent, shadowSetting: false }); Main_Page = new PageComponent({ parent: all, size: all.size, scrollVertical: false }); Main_Page.content.draggable.overdrag = false; Tuto_Page = new PageComponent({ size: all.size, scrollVertical: false }); Tuto_Page.content.draggable.overdrag = false; Main_Page.addPage(Title); Main_Page.addPage(Tuto_Page); tutoArr = [tutoTxt0, tutoTxt1, tutoTxt2, tutoTxt3]; pArr = []; for (i = j = 0, ref = tutoArr.length; 0 <= ref ? j < ref : j > ref; i = 0 <= ref ? ++j : --j) { pArr.push(new Layer({ name: "pArr" + i, size: all.size, backgroundColor: "" })); Tuto_Page.addPage(pArr[i]); tutoArr[i].props = { midX: all.width / 2, y: 1717, parent: pArr[i] }; } indicator.props = { parent: Tuto_Page, midX: all.width / 2, y: 2069 }; indicator_Fn = function(num) { var k, ref1, results; results = []; for (i = k = 0, ref1 = tutoArr.length; 0 <= ref1 ? k <= ref1 : k >= ref1; i = 0 <= ref1 ? ++k : --k) { if (i === num) { results.push(indicator.children[i].opacity = cateIndi.children[i].opacity = 1); } else { if (i < indicator.children.length) { indicator.children[i].opacity = 0.3; } if (i < cateIndi.children.length) { results.push(cateIndi.children[i].opacity = 0); } else { results.push(void 0); } } } return results; }; indicator_Fn(0); skip.parent = Tuto_Page; phone.parent = Tuto_Page; bt_arrow.style.cursor = "pointer"; bt_arrow.onTap(function() { return Main_Page.snapToPage(Tuto_Page); }); skip.onTap(function() { return window.HybridApp.onClickSkip(); }); Main_Page_Lock = false; Main_Page.on("change:currentPage", function() { if (this.currentPage === Tuto_Page && !Main_Page_Lock) { Utils.delay(.5, function() { return Main_Page_Lock = true; }); motion_Fn(0, true); screenLanding(); } if (this.currentPage === Tuto_Page) { this.scrollHorizontal = false; if (Tuto_Page.currentPage === pArr[pArr.length - 1]) { return this.scrollHorizontal = true; } } else { return this.scrollHorizontal = true; } }); Main_Page.content.on("change:x", function() { if (Main_Page_Lock) { if (this.x > -all.width) { return this.x = -all.width; } } }); Main_Page.content.onAnimationEnd(function() { if (Utils.round(this.x) === -all.width * 2) { return Tuto_Page.snapToPage(pArr[pArr.length - 1], false); } }); cateBg.parent = Tuto_Page; cateBg.opacity = 0; cateArr = [cate0, cate1, cate2, cate3]; for (i = k = 0, len = cateArr.length; k < len; i = ++k) { c = cateArr[i]; if (i > 0) { c.props = { parent: cateBg, midX: cate0.midX, y: cate0.y, opacity: 0 }; } } cateBg_show = function(num) { var l, len1; for (i = l = 0, len1 = cateArr.length; l < len1; i = ++l) { c = cateArr[i]; if (i === num) { c.opacity = 1; } else { c.opacity = 0; } } cateBg.animateStop(); cateBg.scale = 0; cateBg.opacity = 1; if (num === 3) { cateBg.y = 740; } else { cateBg.y = 463; } return cateBg.animate({ scale: 1, options: { curve: Spring({ damping: .5 }), time: .7 } }); }; cateBg_hide = function() { cateBg.animateStop(); return cateBg.animate({ properties: { opacity: 0 }, time: .2 }); }; Tuto_Page.on("change:currentPage", function() { var num; num = this.horizontalPageIndex(this.currentPage); indicator_Fn(num); cateBg_hide(); TweenMax.killDelayedCallsTo(cateBg_show); return motion_Fn(num); }); Tuto_Page.content.on("change:x", function() { if (Utils.round(this.x) <= -all.width * (pArr.length - 1)) { return Main_Page.scrollHorizontal = true; } else { return Main_Page.scrollHorizontal = false; } }); screenLanding = function() { var FF; FF = function() { contentImg.animate({ properties: { y: 180 }, curve: Bezier(0.4, 0, 0.2, 1), time: .5 }); topArea.animate({ properties: { y: -40 }, curve: Bezier(0.4, 0, 0.2, 1), time: .5 }); return TweenMax.delayedCall(.15, cateBg_show, [0]); }; TweenMax.to(topArea, 1, { y: 63, ease: Quint.easeOut, delay: .5 }); TweenMax.to(contentImg, 1, { y: 679, ease: Quint.easeOut, delay: .5, onComplete: FF }); TweenMax.to(cateIndi, 1, { opacity: 1, ease: Quint.easeOut, delay: .5 }); TweenMax.to(icon, 1, { opacity: 1, ease: Quint.easeOut, delay: .5 }); TweenMax.to(txt0, 1, { y: 9, ease: Quint.easeOut, delay: .5 }); TweenMax.to(txt1, 1, { y: 9, ease: Quint.easeOut, delay: .5 }); return icon.animate({ properties: { rotation: 60 }, curve: Bezier.linear, time: 3 }); }; motion_Fn = function(num, first) { if (first === void 0) { first = false; } if (num === 0) { if (first === false) { TweenMax.delayedCall(.5, cateBg_show, [0]); } return Dummy.animate({ properties: { y: 0 }, curve: "spring(500,50,0)" }); } else { TweenMax.delayedCall(.5, cateBg_show, [num]); if (num === pArr.length - 1) { return Dummy.animate({ properties: { y: -1970 - 180 }, curve: "spring(500,50,0)" }); } else { return Dummy.animate({ properties: { y: -810 * num }, curve: "spring(500,50,0)" }); } } }; contentImg.on("change:y", function() { return infoArea.y = Utils.modulate(this.y, [679, 679 - 478], [139, 139 - 478], true); }); firstSetting = function() { topArea.y = -40; contentImg.y = 1139; cateIndi.opacity = icon.opacity = 0; txt0.y = txt0.parent.height; txt1.y = txt1.parent.height; return bt_arrow.opacity = 0; }; logo.opacity = 0; titleArr = [title0, title1, title2]; for (l = 0, len1 = titleArr.length; l < len1; l++) { t = titleArr[l]; t.dy = t.y; t.y = t.parent.height; } titleAni = function() { var len2, m, results; logo.animate({ properties: { opacity: 1 }, curve: Bezier.ease, time: .5 }); bt_arrow.animate({ properties: { opacity: 1 }, curve: Bezier.ease, time: .5 }); results = []; for (i = m = 0, len2 = titleArr.length; m < len2; i = ++m) { t = titleArr[i]; results.push(t.animate({ y: t.dy, options: { curve: Bezier(0, 0, 0, 1), time: 1, delay: .5 + i * .15 } })); } return results; }; fisrt_ani = function() { return titleAni(); }; firstSetting(); appPlay = function() { switch (document.readyState) { case 'loading': break; case 'interactive': break; case 'complete': clearInterval(loadInterval); return Utils.delay(0.5, function() { return fisrt_ani(); }); } }; loadInterval = Utils.interval(0.1, function() { return appPlay(); });