full animation for one scene

app/director.js

@@ -15,7 +15,9 @@
 
         let scene = new Scene(this.script.scenes.vaginal, this.canvas);
 
-        scene.play();
+        scene.play()
+            .then(() => console.log('done'))
+            .catch((e) => console.error(e));
 
     };
 

app/scene.js

@@ -2,6 +2,8 @@
 
     'use strict';
 
+    const _ = require('lodash');
+
     let Scene = function(scene, canvas) {
 
         this.frames = scene.frames;
@@ -21,7 +23,65 @@
     };
 
     Scene.prototype.play = function() {
-        this.drawFrame('vaginal_initial');
+
+        /* transform a scene roll array into a flat array of simple
+         * scene objects ({ name, duration }), repeating as needed  */
+        let expand = (roll) => {
+
+            /* recursively expand repeats */
+            let expanded = roll.map((scene) => {
+
+                if (scene.hasOwnProperty('repeat')) {
+
+                    let roll = [];
+
+                    for (let i = 0; i < scene.repeat; i++) {
+                        roll = roll.concat(scene.roll);
+                    }
+
+                    return expand(roll);
+                }
+
+                return scene;
+
+            });
+
+            return _.flattenDeep(expanded);
+
+        };
+
+        /* transform the expanded array into an array of asynchronous
+         * functions that can be called one after another, and so render
+         * the scene */
+        let functionalize = (expanded) => {
+
+            let functionalized = expanded.map((frame) => {
+
+                return () => new Promise((resolve, reject) => {
+
+                    this.drawFrame(frame.name);
+                    setTimeout(() => {
+                        return resolve();
+                    }, frame.duration);
+
+                });
+            });
+
+            return functionalized;
+
+        };
+
+        let expanded = expand(this.roll);
+        let functionalized = functionalize(expanded);
+
+        console.log(functionalized);
+        let promise = functionalized[0]();
+        for (let i = 1; i < functionalized.length; i++) {
+            promise = promise.then(functionalized[i]);
+        }
+        return promise;
+
+
     };
 
     module.exports = Scene;

app/script.json

@@ -19,40 +19,40 @@
             },
             "roll": [
                 {
-                    "frame": "vaginal_initial",
+                    "name": "vaginal_initial",
                     "duration": 750
                 },
-                [
-                    {
-                        "repeat": 19
-                    },
-                    {
-                        "frame": "vaginal_frame1",
-                        "duration": 750
-                    },
-                    {
-                        "frame": "vaginal_frame2",
-                        "duration": 750
-                    }
-                ],
                 {
-                    "frame": "vaginal_balloon_venho"
+                    "repeat": 19,
+                    "roll": [
+                        {
+                            "name": "vaginal_frame1",
+                            "duration": 250
+                        },
+                        {
+                            "name": "vaginal_frame2",
+                            "duration": 250
+                        }
+                    ]
                 },
-                [
-                    {
-                        "repeat": 6
-                    },
-                    {
-                        "frame": "vaginal_frame1",
-                        "duration": 750
-                    },
-                    {
-                        "frame": "vaginal_frame2",
-                        "duration": 750
-                    }
-                ],
                 {
-                    "frame": "vaginal_initial",
+                    "name": "vaginal_balloon_venho"
+                },
+                {
+                    "repeat": 6,
+                    "roll": [
+                        {
+                            "name": "vaginal_frame1",
+                            "duration": 750
+                        },
+                        {
+                            "name": "vaginal_frame2",
+                            "duration": 750
+                        }
+                    ]
+                },
+                {
+                    "name": "vaginal_initial",
                     "duration": 2500
                 }
             ]