import { tween } from 'shifty';
import Orb from './orb';
import viewer from './viewer';
import props from './props';
import * as SDFText from './sdftext';
import * as THREE from './lib/three';
import { offsetFrom } from './utils/three';

// Scene storage
const transitionScene = new THREE.Scene();
let mainScene;

// Set up stage
const textCreator = SDFText.creator();
const text = textCreator.create('', {
  wrapWidth: 2000,
  scale: 15,
  align: 'center',
  color: 0xffff07,
});

transitionScene.add(text);
transitionScene.add(props.grid);

let time = 0;
let floatingOrb;
const tick = dt => {
  time += dt;
  floatingOrb.mesh.position.y = Math.sin(time * 2) / 4 + 2;
};

const fadeOut = callback => {
  tween({
    from: { far: 25 },
    to: { far: 0 },
    duration: 2000,
    easing: 'easeOutCubic',
    step: ({ far }) => {
      viewer.scene.fog.far = far;
    },
  }).then(callback);
};

const fadeIn = (maxFogDistance, callback) => {
  tween({
    from: { far: 0 },
    to: { far: maxFogDistance },
    duration: 2000,
    easing: 'easeOutCubic',
    step: ({ far }) => {
      viewer.scene.fog.far = far;
    },
  }).then(() => {
    if (callback) callback();
  });
};

export default {
  enter(param, callback) {
    // welcome to callback hell
    fadeOut(() => {
      // Flip the scenes
      mainScene = viewer.scene;
      viewer.scene = transitionScene;
      viewer.scene.fog = new THREE.Fog(0x000000, 0, 0);

      floatingOrb = new Orb();
      floatingOrb.fadeIn();
      viewer.events.on('tick', tick);
      text.updateLabel(param.text);
      text.position.copy(offsetFrom(viewer.camera, -5, 2, -10));
      text.lookAt(viewer.camera.position);
      floatingOrb.mesh.position.copy(offsetFrom(viewer.camera, 2, 0, -8));
      floatingOrb.mesh.scale.set(4, 4, 4);

      fadeIn(25, () => {
        setTimeout(() => {
          fadeOut(() => {
            // Flip the scenes again
            floatingOrb.destroy();
            viewer.scene = mainScene;
            callback();
          });
        }, param.duration);
      });
    });
  },
  exit(callback) {
    fadeIn(300, callback);
  },
};

@@ -686,24 +686,24 @@
 t = 
-callback
+async ()
  =%3E %7B%0A  
 twee
@@ -690,32 +690,38 @@
 async () =%3E %7B%0A  
+await 
 tween(%7B%0A    from
@@ -877,23 +877,8 @@
   %7D)
-.then(callback)
 ;%0A%7D;
@@ -894,17 +894,22 @@
 adeIn = 
-(
+async 
 maxFogDi
@@ -914,27 +914,16 @@
 Distance
-, callback)
  =%3E %7B%0A  
@@ -1103,56 +1103,8 @@
  %7D,%0A
-  %7D).then(() =%3E %7B%0A    if (callback) callback();%0A
   %7D)
@@ -1128,16 +1128,22 @@
 ult %7B%0A  
+async 
 enter(pa
@@ -1167,83 +1167,25 @@
     
-// welcome to callback hell%0A    fadeOut(() =%3E %7B%0A      // Flip the scenes%0A  
+await fadeOut();%0A
     
@@ -1206,34 +1206,32 @@
 ewer.scene;%0A    
-  
 viewer.scene = t
@@ -1242,26 +1242,24 @@
 itionScene;%0A
-  
     viewer.s
@@ -1301,26 +1301,24 @@
 0, 0);%0A%0A    
-  
 floatingOrb 
@@ -1326,26 +1326,24 @@
  new Orb();%0A
-  
     floating
@@ -1356,26 +1356,24 @@
 deIn();%0A    
-  
 viewer.event
@@ -1392,18 +1392,16 @@
  tick);%0A
-  
     text
@@ -1426,26 +1426,24 @@
 .text);%0A    
-  
 text.positio
@@ -1485,26 +1485,24 @@
 , 2, -10));%0A
-  
     text.loo
@@ -1530,26 +1530,24 @@
 ition);%0A    
-  
 floatingOrb.
@@ -1603,26 +1603,24 @@
 , -8));%0A    
-  
 floatingOrb.
@@ -1645,25 +1645,29 @@
 4, 4);%0A%0A    
- 
+await
  fadeIn(25, 
@@ -1668,22 +1668,12 @@
 n(25
-, () =%3E %7B%0A    
+);%0A%0A
     
@@ -1683,16 +1683,22 @@
 Timeout(
+async 
 () =%3E %7B%0A
@@ -1703,19 +1703,21 @@
 %7B%0A      
-   
+await
  fadeOut
@@ -1717,30 +1717,19 @@
 fadeOut(
-() =%3E %7B%0A      
+);%0A
       //
@@ -1757,22 +1757,16 @@
 n%0A      
-      
 floating
@@ -1776,30 +1776,24 @@
 .destroy();%0A
-      
       viewer
@@ -1818,22 +1818,16 @@
 ;%0A      
-      
 callback
@@ -1834,26 +1834,8 @@
 ();%0A
-          %7D);%0A    
     
@@ -1858,32 +1858,20 @@
 n);%0A
-    
   %7D
-);%0A    %7D);%0A  %7D,%0A 
+,%0A  async
  exi
@@ -1898,17 +1898,22 @@
 deIn(300
-,
+);%0A   
  callbac
@@ -1913,16 +1913,17 @@
 callback
+(
 );%0A  %7D,%0A

Switch callback waterfall to async/await