zumo_2.0_android/app/src/main/assets/on_boarding/new/app.js

var FlexibleScreen, Main_Page, Main_Page_Lock, SpinLoader, Title, Tuto_Page, all, appPlay, bgReset, 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.enable();

// Framer.Extras.Preloader.setLogo("framer/images/VC_120_T.png");

Screen.backgroundColor = "white";

FlexibleScreen = require("FlexibleScreen").FlexibleScreen;

SpinLoader = require("SpinLoader").SpinLoader;

blockEvent = new Layer({
  size: Screen.size,
  backgroundColor: "",
  visible: false
});

blockEvent.onTap(function() {});

all = new FlexibleScreen({
  backgroundColor: "white",
  width: 1242,
  height: 2208,
  _blockEvent: blockEvent
});

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);

Main_Page.addPage(Last);

tutoArr = [tutoTxt0, tutoTxt1, tutoTxt2, tutoTxt3, tutoTxt4];

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;

skip.style.cursor = "pointer";

skip.onTap(function() {
  return Main_Page.snapToPage(Last);
});

bt_arrow.style.cursor = "pointer";

bt_arrow.onTap(function() {
  return Main_Page.snapToPage(Tuto_Page);
});

__layer_0__.onTap(function() {
  return window.HybridApp.onClickJoin();
});

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;
    TweenMax.delayedCall(.5, bgReset);
    if (Tuto_Page.currentPage === pArr[pArr.length - 1]) {
      this.scrollHorizontal = true;
    }
  } else {
    this.scrollHorizontal = true;
  }
  if (this.currentPage === Last) {
    TweenMax.to(lastTxt0, 1, {
      y: 22,
      ease: Quint.easeOut,
      delay: .3
    });
    TweenMax.to(lastTxt1, 1, {
      y: 28,
      ease: Quint.easeOut,
      delay: .2 + .3
    });
    return bg.animate({
      properties: {
        scale: 1.2
      },
      curve: Bezier.ease,
      time: 20
    });
  }
});

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);
  }
});

bgReset = function() {
  bg.animateStop();
  bg.scale = 1;
  TweenMax.killTweensOf(lastTxt0);
  TweenMax.killTweensOf(lastTxt1);
  lastTxt0.y = lastTxt0.parent.height;
  return lastTxt1.y = lastTxt1.parent.height;
};

cateBg.parent = Tuto_Page;

cateBg.opacity = 0;

cateArr = [cate0, cate1, cate2, cate3, cate4];

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 === 4) {
    cateBg.y = 740;
  } else {
    cateBg.y = 463;
  }
  if (num === 3) {
    cateBg.children[1].opacity = 0;
    cateBg.children[0].opacity = 1;
  } else {
    cateBg.children[1].opacity = 1;
    cateBg.children[0].opacity = 0;
  }
  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: 61,
    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: -2970
        },
        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();

vinylc_loading = function(options) {
  var ixdSrc, loadingImgSize, spin;
  if (options == null) {
    options = {
      vcSize: 60 * 3,
      spinSize: 140 * 3
    };
  }
  ixdSrc = "framer/images/";
  loadingImgSize = options.vcSize;
  this.loadingLayer = new Layer({
    name: "loadingLayer",
    parent: all,
    size: all.size,
    backgroundColor: "white",
    opacity: 0.95
  });
  this.loadingLayer.states["delete"] = {
    opacity: 0,
    options: {
      curve: Bezier.easeOut,
      time: 0.1
    }
  };
  this.loadingLayer.onAnimationEnd(function() {
    if (this.opacity === 0) {
      return this.destroy();
    }
  });
  spin = new SpinLoader({
    parent: this.loadingLayer,
    size: options.spinSize,
    thickness: 3,
    color: "#7e00ff",
    changeColor: true
  });
  spin.center();
  return spin.start();
};

vinylc_loading();

appPlay = function() {
  switch (document.readyState) {
    case 'loading':
      break;
    case 'interactive':
      break;
    case 'complete':
      clearInterval(loadInterval);
      return Utils.delay(1, function() {
        this.loadingLayer.animate("delete");
        return Utils.delay(0.5, function() {
          return fisrt_ani();
        });
      });
  }
};

loadInterval = Utils.interval(0.1, function() {
  return appPlay();
});