Correct version number

.vscode/launch.json

@@ -0,0 +1,26 @@
+{
+    // Use IntelliSense to learn about possible attributes.
+    // Hover to view descriptions of existing attributes.
+    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+    "version": "0.2.0",
+    "configurations": [
+        {
+            "type": "node",
+            "request": "launch",
+            "name": "Launch Program",
+            "program": "${workspaceFolder}\\index.js"
+        },
+        {
+            "type": "node",
+            "request": "launch",
+            "name": "testrunner",
+            "program": "${workspaceFolder}\\bin\\testrunner.js"
+        },
+        {
+            "type": "node",
+            "request": "launch",
+            "name": "single",
+            "program": "${workspaceFolder}\\bin\\singleshot.js"
+        }
+    ]
+}

README.md

@@ -47,4 +47,4 @@ Afterwards you can view the documentation here:
 ## List of 3<sup>rd</sup> party libraries included
 
 - [PixiJS](http://www.pixijs.com)
-- [Greensock](https://greensock.com) with TweenLite
+- [Greensock](https://greensock.com) with TweenMax and TimelineMax

bin/README.md

@@ -0,0 +1,23 @@
+Testrunner prerequisites
+========================
+
+npm install puppeteer
+
+
+testrunner.js
+-------------
+start from iwmlib directory with node testrunner
+
+defined in package.json
+"testrunner": "node bin/testrunner.js"
+
+or in vscode, defined in launch.json like
+{
+    "type": "node",
+    "request": "launch",
+    "name": "testrunner",
+    "program": "${workspaceFolder}\\bin\\testrunner.js"
+}
+
+iterates all doctest.html files that are listed in index.html
+create a screenshot of all pages

bin/singleshot.js

@@ -0,0 +1,70 @@
+/**
+ * test one single page, make a screenshot and log errors to 
+ * console
+ * (c) 2019 - Leibniz-Insitut für Wissensmedien
+ * 
+ */
+const puppeteer = require('puppeteer');
+const fs = require("fs")
+const path = require("path")
+const start_dir = process.cwd()
+
+
+// const start_file = path.join(start_dir,"lib","frames.html")
+const start_file = path.join(start_dir,"lib","pixi","badge.html")
+
+function sleep(ms) {
+    return new Promise(resolve => setTimeout(resolve, ms));
+  }
+
+const events = ["error","pageerror"]
+function logPageEvent(event){
+    if(event !== undefined){
+         console.log(event.message)
+    }
+}
+
+async function makeScreenshot(href){
+    
+    const browser = await puppeteer.launch({
+        // headless: false,
+        // loglevel : 0,
+        args : [
+        '–allow-file-access-from-files',
+      ],});
+    const page = await browser.newPage();
+    
+    await page.setViewport({width: 1024,height : 624})
+    for (var i = 0; i < events.length; i++) {
+        page.on(events[i],logPageEvent)
+    }
+    page.once("load",logPageEvent)
+
+    // await Promise.all([ page.coverage.startJSCoverage() ]);
+    await page.goto(href)
+    // const jsCoverage = await Promise.all([ page.coverage.stopJSCoverage() ]);
+
+    const fname = path.parse(href).name
+
+    if (fname != "index"){
+        image_url = href.replace(fname + ".html" ,"thumbnails/" + fname + ".png")
+    }
+    else{
+        image_url = href.replace(fname + ".html" ,"thumbnail.png")
+    }
+    image_url = image_url.replace("file:///","")
+    console.log(image_url)
+    // console.log(jsCoverage)
+    
+    page.removeAllListeners()
+    
+    await page.screenshot({path: image_url});
+    await browser.close();
+}
+
+
+(async function(){
+
+        await makeScreenshot(start_file)
+    }
+)()

bin/testrunner.js

@@ -0,0 +1,109 @@
+/**
+ * 
+ * make screenshots and log errors to 
+ * console
+ * (c) 2019 - Leibniz-Insitut für Wissensmedien
+ * 
+ */
+
+const puppeteer = require('puppeteer');
+const fs = require("fs")
+const path = require("path")
+const start_dir = process.cwd()
+const start_file = path.join(start_dir,"lib","index.html")
+
+const start_file_uri = path.join("file:///", start_file )
+
+// define events and log them
+const events = ["error","pageerror"]
+function logPageEvent(event){
+    if (event !== undefined){
+     console.log(event.toString())
+    }
+}
+
+async function makeScreenshot(href){
+    
+    const browser = await puppeteer.launch({args: [
+        '–allow-file-access-from-files',
+      ],});
+
+    const page = await browser.newPage();
+    
+    await page.setViewport({width: 1024,height : 624})
+
+    // register events
+    for (var i = 0; i < events.length; i++) {
+        page.on(events[i],logPageEvent)
+    }
+    page.once("load",logPageEvent)
+
+    await page.goto(href)
+    const fname = path.parse(href).name
+
+    if (fname != "index"){
+        image_url = href.replace(fname + ".html" ,"thumbnails/" + fname + ".png")
+    }
+    else{
+        image_url = href.replace(fname + ".html" ,"thumbnail.png")
+    }
+    image_url = image_url.replace("file:///","")
+    
+    page.removeAllListeners()
+    
+    await page.screenshot({path: image_url});
+    await browser.close();
+}
+
+/**
+ * 
+ * collect all navigational links in all documents
+ *  
+ * */ 
+
+async function collectLinks(href,reflist)
+{
+    const browser = await puppeteer.launch();
+    const page = await browser.newPage();
+
+
+    await page.goto(href)
+    let hrefs = await page.$$('a.wrapper')
+    
+    for (var i=0; i < hrefs.length; i++) {
+        let hrefValue = await hrefs[i].getProperty('href')
+        let linkText = await hrefValue.jsonValue();
+        if (!linkText.startsWith("file:"))
+        { 
+            continue;
+        }
+        if(linkText.endsWith("#")) continue;
+        if(linkText.endsWith("index.html")){
+            await collectLinks(linkText,reflist)
+        }
+        reflist.push(linkText)
+    }
+
+    await browser.close()
+}
+
+(async function(){
+    var reflist = []
+    let linkText = "file:///" + start_file.replace(/\\/g,"/")
+    reflist.push(linkText)
+    await collectLinks(start_file_uri,reflist)
+
+    // sort by path length to get depth first
+    reflist.sort(function(a,b){
+        let al = a.split("/").length
+        let bl = b.split("/").length
+
+        if (al < bl)  {return  1 }
+        if (al > bl)  {return -1 }
+        if (al == bl) {return  0 }
+    })
+    for (var i=0;i<reflist.length; i++) {
+        await makeScreenshot(reflist[i])
+        console.log(i,reflist[i])
+    }
+})()

dist/iwmlib.js

@@ -1687,12 +1687,23 @@
     }
 
     class InteractionDelta {
-        constructor(x, y, zoom, rotate, about) {
+        /**
+         *Creates an instance of InteractionDelta.
+         * @param {*} x
+         * @param {*} y
+         * @param {*} zoom
+         * @param {*} rotate
+         * @param {*} about
+         * @param {*} number - number of involved pointer
+         * @memberof InteractionDelta
+         */
+        constructor(x, y, zoom, rotate, about, number) {
             this.x = x;
             this.y = y;
             this.zoom = zoom;
             this.rotate = rotate;
             this.about = about;
+            this.number = number;
         }
 
         toString() {
@@ -1766,16 +1777,13 @@
                 let p1 = this.previous.get(c1.key);
                 let p2 = this.previous.get(c2.key);
 
-                //let p1 = previous[0]
-                //let p2 = previous[1]
-
                 let d1 = Points.subtract(c1, p1);
                 let d2 = Points.subtract(c2, p2);
                 let cm = Points.mean(c1, c2);
-                //let pm = Points.mean(p1, p2)
-                // UO: Using the mean lead to jumps between time slices with 3 and 2 fingers
+                
+                // Using the mean leads to jumps between time slices with 3 and 2 fingers
                 // We use the mean of deltas instead
-                let delta = Points.mean(d1, d2); //Points.subtract(cm, pm)
+                let delta = Points.mean(d1, d2); 
                 let zoom = 1.0;
                 let distance1 = Points.distance(p1, p2);
                 let distance2 = Points.distance(c1, c2);
@@ -1785,13 +1793,14 @@
                 let currentAngle = Points.angle(c1, c2);
                 let previousAngle = Points.angle(p1, p2);
                 let alpha = this.diffAngle(currentAngle, previousAngle);
-                return new InteractionDelta(delta.x, delta.y, zoom, alpha, cm)
+                return new InteractionDelta(delta.x, delta.y, zoom, alpha, cm, csize)
             } else if (csize == 1 && psize == 1 && this.current.firstKey() == this.previous.firstKey()) {
-                // We need to ensure that the keys are the same
+                // We need to ensure that the keys are the same, since single points with different keys
+                // can jump
                 let current = this.current.first();
                 let previous = this.previous.first();
                 let delta = Points.subtract(current, previous);
-                return new InteractionDelta(delta.x, delta.y, 1.0, 0.0, current)
+                return new InteractionDelta(delta.x, delta.y, 1.0, 0.0, current, csize)
             }
             return null
         }
@@ -2940,7 +2949,9 @@
             this.lastframe = t;
             if (dt > 0) {
                 // Avoid division by zero errors later on
-                let velocity = { t: t, dt: dt, dx: delta.x, dy: delta.y };
+                // and consider the number of involved pointers sind addVelocity will be called by the
+                // onMove events
+                let velocity = { t: t, dt: dt, dx: delta.x / delta.number, dy: delta.y / delta.number};
                 this.velocities.push(velocity);
                 while (this.velocities.length > buffer) {
                     this.velocities.shift();
@@ -2949,7 +2960,7 @@
         }
 
         meanVelocity(milliseconds = 30) {
-            this.addVelocity({ x: 0, y: 0 });
+            this.addVelocity({ x: 0, y: 0, number: 1 });
             let sum = { x: 0, y: 0 };
             let count = 0;
             let t = 0;
@@ -3221,7 +3232,9 @@
 
         keepOnStage(velocity, collision = 0.5) {
             let stagePolygon = this.containerPolygon;
-            if (!stagePolygon) return
+            // UO: since keepOnStage is called in nextVelocity we need to 
+            // ensure a return value
+            if (!stagePolygon) return { x: 0, y: 0}
             let polygon = this.polygon;
             let bounced = this.bouncing();
             if (bounced) {
@@ -4945,11 +4958,13 @@
                 //console.log("iconSrc", iconSrc)
                 if (iconSrc.endsWith('index.png')) {
                     icon.src = iconSrc.replace('index.png', 'thumbnail.png');
-                } else if (iconSrc.endsWith('test.png')) {
-                    icon.src = iconSrc.replace('test.png', 'thumbnail.test.png');
-                } else {
+                } 
+                else {
                     icon.src = 'thumbnails/' + iconSrc;
                 }
+
+                // icon.src = 'thumbnails/' + iconSrc
+                // console.log(iconSrc)
                 wrapper.href = src;
                 let titleDiv = wrapper.querySelector('.title');
                 titleDiv.innerText = title;

dist/iwmlib.pixi.js

@@ -4851,12 +4851,23 @@
     }
 
     class InteractionDelta {
-        constructor(x, y, zoom, rotate, about) {
+        /**
+         *Creates an instance of InteractionDelta.
+         * @param {*} x
+         * @param {*} y
+         * @param {*} zoom
+         * @param {*} rotate
+         * @param {*} about
+         * @param {*} number - number of involved pointer
+         * @memberof InteractionDelta
+         */
+        constructor(x, y, zoom, rotate, about, number) {
             this.x = x;
             this.y = y;
             this.zoom = zoom;
             this.rotate = rotate;
             this.about = about;
+            this.number = number;
         }
 
         toString() {
@@ -4930,16 +4941,13 @@
                 let p1 = this.previous.get(c1.key);
                 let p2 = this.previous.get(c2.key);
 
-                //let p1 = previous[0]
-                //let p2 = previous[1]
-
                 let d1 = Points.subtract(c1, p1);
                 let d2 = Points.subtract(c2, p2);
                 let cm = Points.mean(c1, c2);
-                //let pm = Points.mean(p1, p2)
-                // UO: Using the mean lead to jumps between time slices with 3 and 2 fingers
+                
+                // Using the mean leads to jumps between time slices with 3 and 2 fingers
                 // We use the mean of deltas instead
-                let delta = Points.mean(d1, d2); //Points.subtract(cm, pm)
+                let delta = Points.mean(d1, d2); 
                 let zoom = 1.0;
                 let distance1 = Points.distance(p1, p2);
                 let distance2 = Points.distance(c1, c2);
@@ -4949,13 +4957,14 @@
                 let currentAngle = Points.angle(c1, c2);
                 let previousAngle = Points.angle(p1, p2);
                 let alpha = this.diffAngle(currentAngle, previousAngle);
-                return new InteractionDelta(delta.x, delta.y, zoom, alpha, cm)
+                return new InteractionDelta(delta.x, delta.y, zoom, alpha, cm, csize)
             } else if (csize == 1 && psize == 1 && this.current.firstKey() == this.previous.firstKey()) {
-                // We need to ensure that the keys are the same
+                // We need to ensure that the keys are the same, since single points with different keys
+                // can jump
                 let current = this.current.first();
                 let previous = this.previous.first();
                 let delta = Points.subtract(current, previous);
-                return new InteractionDelta(delta.x, delta.y, 1.0, 0.0, current)
+                return new InteractionDelta(delta.x, delta.y, 1.0, 0.0, current, csize)
             }
             return null
         }
@@ -6104,7 +6113,9 @@
             this.lastframe = t;
             if (dt > 0) {
                 // Avoid division by zero errors later on
-                let velocity = { t: t, dt: dt, dx: delta.x, dy: delta.y };
+                // and consider the number of involved pointers sind addVelocity will be called by the
+                // onMove events
+                let velocity = { t: t, dt: dt, dx: delta.x / delta.number, dy: delta.y / delta.number};
                 this.velocities.push(velocity);
                 while (this.velocities.length > buffer) {
                     this.velocities.shift();
@@ -6113,7 +6124,7 @@
         }
 
         meanVelocity(milliseconds = 30) {
-            this.addVelocity({ x: 0, y: 0 });
+            this.addVelocity({ x: 0, y: 0, number: 1 });
             let sum = { x: 0, y: 0 };
             let count = 0;
             let t = 0;
@@ -6385,7 +6396,9 @@
 
         keepOnStage(velocity, collision = 0.5) {
             let stagePolygon = this.containerPolygon;
-            if (!stagePolygon) return
+            // UO: since keepOnStage is called in nextVelocity we need to 
+            // ensure a return value
+            if (!stagePolygon) return { x: 0, y: 0}
             let polygon = this.polygon;
             let bounced = this.bouncing();
             if (bounced) {
@@ -7843,7 +7856,6 @@
          * @memberof Tile
          */
         destroy(options, debug = false) {
-            if (this.parent != null) ;
             let count = this.unregister();
             if (count <= 0) {
                 let opts = { children: true, texture: true, baseTexture: true };
@@ -7855,6 +7867,11 @@
                 if (debug) console.log("Tile.destroy", deepZoomTileCache.size, opts);
                 super.destroy(opts);
             }
+            if (this.parent != null) {
+                // UO: Emit warning and remove
+                console.warn("Destroying tile with parent. Hiding instead");
+                this.visible = false;
+            }
         }
     }
 
@@ -7920,9 +7937,14 @@
                 console.warn("Tile already loaded");
                 tile.unregister();
             }
+            try {
                 tile = new Tile(texture, url);
                 this.loaded.set(url, tile);
                 this.tiles.tileAvailable(tile, col, row, url);
+            } catch (error) {
+                console.warn("Tile loading error", error);
+            }
+            
         }
     }
 
@@ -9113,7 +9135,7 @@
         }
 
         worldBounds() {
-            let viewBounds = this.app.scene.bounds;
+            let viewBounds = this.app.scene.getBounds();
             // Using getBounds extends visible scope after loading tiles and leads
             // to excessive loading
             if (this.world != null) {
@@ -9924,7 +9946,7 @@
          * @param {boolean} [opts.shadow=false] - Should be a shadow been display during the animation?
          * @param {numer} [opts.eulerX=0] - The shift of the x-axis during the animation.
          * @param {numer} [opts.eulerY=0] - The shift of the y-axis during the animation.
-         * @param {GSAP.Ease} [opts.eulerEase=Sine.easeOut] - The ease of the shift.
+         * @param {GSAP.Ease} [opts.eulerEase=Power1.easeOut] - The ease of the shift.
          * @param {boolean} [opts.useBackTransforms=false] - When set to true, the flip animation also animates to the transform parameters of the back-object.
          * @param {GSAP.Ease} [opts.transformEase=Power2.easeOut] - The ease of the transform.
          * @param {numer} [opts.focus=800] - The value of the focus of the 3D camera (see pixi-projection).
@@ -9948,7 +9970,7 @@
                 shadow: false,
                 eulerX: 0,
                 eulerY: 0,
-                eulerEase: Sine.easeOut,
+                eulerEase: Power1.easeOut,
                 useBackTransforms: false,
                 transformEase: Power2.easeOut,
                 focus: 800,

gulpfile.js

@@ -15,7 +15,8 @@ function vendors() {
         './node_modules/pixi-filters/dist/pixi-filters.js',
         './node_modules/pixi-particles/dist/pixi-particles.js',
         './node_modules/pixi-projection/dist/pixi-projection.js',
-        './node_modules/gsap/src/uncompressed/TweenLite.js',
+        './node_modules/gsap/src/uncompressed/TweenMax.js',
+        './node_modules/gsap/src/uncompressed/TimelineMax.js',
         './lib/3rdparty/pixi-ease.js',
         './lib/3rdparty/pixi-viewport.js',
         './lib/3rdparty/convertPointFromPageToNode.js'
@@ -30,7 +31,7 @@ function vendors() {
 
 function preload() {
     return src([
-        './node_modules/gsap/src/uncompressed/TweenLite.js',
+        './node_modules/gsap/src/uncompressed/TweenMax.js',
         './lib/3rdparty/convertPointFromPageToNode.js',
     ], {sourcemaps: false})
         .pipe(concat('iwmlib.3rdparty.preload.js'))

lib/doctest.html

@@ -6,7 +6,7 @@
 	<link rel="stylesheet" href="./3rdparty/highlight/styles/default.css">
 	<link rel="stylesheet" href="../css/doctest.css">
 	<script src="./3rdparty/highlight/highlight.pack.js"></script>
-	<script src="./3rdparty/all.js"></script>
+    <script src="../dist/iwmlib.3rdparty.js"></script>
     <script src="../dist/iwmlib.js"></script>
 </head>
 <body onload="Doctest.run()">

lib/examples/multitouch.html

@@ -50,9 +50,9 @@
         }
     </style>
 
-    <script type="text/javascript" src=".././3rdparty/all.js"></script>
-    <script type="text/javascript" src="../../lib/pixi/all.js"></script>
-    <script type="text/javascript" src="../../lib/all.js"></script>
+<script src="../../dist/iwmlib.3rdparty.js"></script>
+<script src="../../dist/iwmlib.js"></script>
+<script src="../../dist/iwmlib.pixi.js"></script>
 </head>
 
 <body class="site" onload="loaded()">

lib/index.js

@@ -30,11 +30,13 @@ export default class Index {
             //console.log("iconSrc", iconSrc)
             if (iconSrc.endsWith('index.png')) {
                 icon.src = iconSrc.replace('index.png', 'thumbnail.png')
-            } else if (iconSrc.endsWith('test.png')) {
-                icon.src = iconSrc.replace('test.png', 'thumbnail.test.png')
-            } else {
+            } 
+            else {
                 icon.src = 'thumbnails/' + iconSrc
             }
+
+            // icon.src = 'thumbnails/' + iconSrc
+            // console.log(iconSrc)
             wrapper.href = src
             let titleDiv = wrapper.querySelector('.title')
             titleDiv.innerText = title

lib/interaction.js

@@ -122,12 +122,23 @@ export class PointMap extends MapProxy {
 }
 
 export class InteractionDelta {
-    constructor(x, y, zoom, rotate, about) {
+    /**
+     *Creates an instance of InteractionDelta.
+     * @param {*} x
+     * @param {*} y
+     * @param {*} zoom
+     * @param {*} rotate
+     * @param {*} about
+     * @param {*} number - number of involved pointer
+     * @memberof InteractionDelta
+     */
+    constructor(x, y, zoom, rotate, about, number) {
         this.x = x
         this.y = y
         this.zoom = zoom
         this.rotate = rotate
         this.about = about
+        this.number = number
     }
 
     toString() {
@@ -201,16 +212,13 @@ export class InteractionPoints {
             let p1 = this.previous.get(c1.key)
             let p2 = this.previous.get(c2.key)
 
-            //let p1 = previous[0]
-            //let p2 = previous[1]
-
             let d1 = Points.subtract(c1, p1)
             let d2 = Points.subtract(c2, p2)
             let cm = Points.mean(c1, c2)
-            //let pm = Points.mean(p1, p2)
-            // UO: Using the mean lead to jumps between time slices with 3 and 2 fingers
+            
+            // Using the mean leads to jumps between time slices with 3 and 2 fingers
             // We use the mean of deltas instead
-            let delta = Points.mean(d1, d2) //Points.subtract(cm, pm)
+            let delta = Points.mean(d1, d2) 
             let zoom = 1.0
             let distance1 = Points.distance(p1, p2)
             let distance2 = Points.distance(c1, c2)
@@ -220,13 +228,14 @@ export class InteractionPoints {
             let currentAngle = Points.angle(c1, c2)
             let previousAngle = Points.angle(p1, p2)
             let alpha = this.diffAngle(currentAngle, previousAngle)
-            return new InteractionDelta(delta.x, delta.y, zoom, alpha, cm)
+            return new InteractionDelta(delta.x, delta.y, zoom, alpha, cm, csize)
         } else if (csize == 1 && psize == 1 && this.current.firstKey() == this.previous.firstKey()) {
-            // We need to ensure that the keys are the same
+            // We need to ensure that the keys are the same, since single points with different keys
+            // can jump
             let current = this.current.first()
             let previous = this.previous.first()
             let delta = Points.subtract(current, previous)
-            return new InteractionDelta(delta.x, delta.y, 1.0, 0.0, current)
+            return new InteractionDelta(delta.x, delta.y, 1.0, 0.0, current, csize)
         }
         return null
     }

lib/pixi/deepzoom/image.js

@@ -645,7 +645,7 @@ export class DeepZoomImage extends PIXI.Container {
     }
 
     worldBounds() {
-        let viewBounds = this.app.scene.bounds
+        let viewBounds = this.app.scene.getBounds()
         // Using getBounds extends visible scope after loading tiles and leads
         // to excessive loading
         if (this.world != null) {

lib/pixi/deepzoom/index.html

@@ -22,8 +22,9 @@
     </template>
 </head>
 <body>
-<div id="container" class="container">
-</div>
+    <div id="container" class="container">
+        <a style="position: absolute; left: 22px; top: 12px;" target="_blank" href="http://www.iwm-tuebingen.de">IWM</a>
+    </div>
 <script>
 const index = new Index(itemTemplate, [
         ['Deepzoom', 'deepzoom.html'],

lib/pixi/deepzoom/loader.js

@@ -62,9 +62,14 @@ export class TileLoader {
             console.warn("Tile already loaded")
             tile.unregister()
         }
+        try {
             tile = new Tile(texture, url)
             this.loaded.set(url, tile)
             this.tiles.tileAvailable(tile, col, row, url)
+        } catch (error) {
+            console.warn("Tile loading error", error)
+        }
+        
     }
 }
 

lib/pixi/deepzoom/tile.js

@@ -59,9 +59,6 @@ export class Tile extends PIXI.Sprite {
      * @memberof Tile
      */
     destroy(options, debug = false) {
-        if (this.parent != null) {
-
-        }
         let count = this.unregister()
         if (count <= 0) {
             let opts = { children: true, texture: true, baseTexture: true }
@@ -73,5 +70,10 @@ export class Tile extends PIXI.Sprite {
             if (debug) console.log("Tile.destroy", deepZoomTileCache.size, opts)
             super.destroy(opts)
         }
+        if (this.parent != null) {
+            // UO: Emit warning and remove
+            console.warn("Destroying tile with parent. Hiding instead")
+            this.visible = false
+        }
     }
 }

lib/pixi/flippable.html

@@ -13,6 +13,8 @@
 
     <script src="../../dist/iwmlib.js"></script>
     <script src="../../dist/iwmlib.pixi.js"></script>
+
+    <script src="../3rdparty/gsap/src/minified/TweenMax.min.js"></script>
 </head>
 <body onload="Doctest.run()">
     <h1>Flippable</h1>

lib/pixi/flippable.js

@@ -56,7 +56,7 @@ export default class Flippable extends PIXI.projection.Camera3d {
      * @param {boolean} [opts.shadow=false] - Should be a shadow been display during the animation?
      * @param {numer} [opts.eulerX=0] - The shift of the x-axis during the animation.
      * @param {numer} [opts.eulerY=0] - The shift of the y-axis during the animation.
-     * @param {GSAP.Ease} [opts.eulerEase=Sine.easeOut] - The ease of the shift.
+     * @param {GSAP.Ease} [opts.eulerEase=Power1.easeOut] - The ease of the shift.
      * @param {boolean} [opts.useBackTransforms=false] - When set to true, the flip animation also animates to the transform parameters of the back-object.
      * @param {GSAP.Ease} [opts.transformEase=Power2.easeOut] - The ease of the transform.
      * @param {numer} [opts.focus=800] - The value of the focus of the 3D camera (see pixi-projection).
@@ -80,7 +80,7 @@ export default class Flippable extends PIXI.projection.Camera3d {
             shadow: false,
             eulerX: 0,
             eulerY: 0,
-            eulerEase: Sine.easeOut,
+            eulerEase: Power1.easeOut,
             useBackTransforms: false,
             transformEase: Power2.easeOut,
             focus: 800,

lib/pixi/index.html

@@ -12,7 +12,7 @@
             <div class="preview">
                 <div class="thumbnail-container">
                     <div class="thumbnail">
-                        <img class="icon" >
+                        <img class="icon" src="thumbnails/notfound.png">
                         <!-- <iframe src="" frameborder="0"></iframe> -->
                      </div>
                 </div>
@@ -22,8 +22,9 @@
     </template>
 </head>
 <body>
-<div id="container" class="container">
-</div>
+    <div id="container" class="container">
+        <a style="position: absolute; left: 22px; top: 12px;" target="_blank" href="http://www.iwm-tuebingen.de">IWM</a>
+    </div>
 <script>
 const index = new Index(itemTemplate, [
         ['PIXI.Application', 'application.html'],
@@ -33,7 +34,6 @@ const index = new Index(itemTemplate, [
         ['ButtonGroup', 'buttongroup.html'],
         ['Coordinates', 'coordinates.html'],
         ['DeepZoom', 'deepzoom/index.html'],
-        // ['DeepZoomImage', 'deepzoomimage.html'],
         ['Flippable', 'flippable.html'],
         ['LabeledGraphics', 'labeledgraphics.html'],
         ['List', 'list.html'],

lib/pixi/modal.html

@@ -10,7 +10,6 @@
 
     <script src="../3rdparty/highlight/highlight.pack.js"></script>
     <script src="../../dist/iwmlib.3rdparty.js"></script>
-
     <script src="../../dist/iwmlib.js"></script>
     <script src="../../dist/iwmlib.pixi.js"></script>
 </head>

lib/pixi/text.html

@@ -13,6 +13,8 @@
 
     <script src="../../dist/iwmlib.js"></script>
     <script src="../../dist/iwmlib.pixi.js"></script>
+
+    <script src="../3rdparty/d3.min.js"></script>
 </head>
 <body onload="Doctest.run()">
     <h1>Text</h1>

lib/scatter.js

@@ -127,7 +127,9 @@ class Throwable {
         this.lastframe = t
         if (dt > 0) {
             // Avoid division by zero errors later on
-            let velocity = { t: t, dt: dt, dx: delta.x, dy: delta.y }
+            // and consider the number of involved pointers sind addVelocity will be called by the
+            // onMove events
+            let velocity = { t: t, dt: dt, dx: delta.x / delta.number, dy: delta.y / delta.number}
             this.velocities.push(velocity)
             while (this.velocities.length > buffer) {
                 this.velocities.shift()
@@ -136,7 +138,7 @@ class Throwable {
     }
 
     meanVelocity(milliseconds = 30) {
-        this.addVelocity({ x: 0, y: 0 })
+        this.addVelocity({ x: 0, y: 0, number: 1 })
         let sum = { x: 0, y: 0 }
         let count = 0
         let t = 0
@@ -408,7 +410,9 @@ export class AbstractScatter extends Throwable {
 
     keepOnStage(velocity, collision = 0.5) {
         let stagePolygon = this.containerPolygon
-        if (!stagePolygon) return
+        // UO: since keepOnStage is called in nextVelocity we need to 
+        // ensure a return value
+        if (!stagePolygon) return { x: 0, y: 0}
         let polygon = this.polygon
         let bounced = this.bouncing()
         if (bounced) {

package.json

@@ -1,13 +1,13 @@
 {
     "name": "iwmlib",
-    "version": "1.0.7",
+    "version": "1.0.9",
     "description": "An Open Source library for multi-touch, WebGL powered applications.",
     "main": "index.js",
     "directories": {
         "example": "examples"
     },
     "scripts": {
-        "test": "echo \"Error: no test specified\" && exit 1",
+        "test": "node bin/testrunner.js",
         "build": "rollup --config ./rollup.config.js",
         "watch": "rollup --watch --config ./rollup.config.js",
         "3rdparty": "gulp",
@@ -36,6 +36,7 @@
         "pixi-particles": "^4.1.0",
         "pixi-projection": "^0.2.7",
         "pixi.js": "^4.8.7",
-        "propagating-hammerjs": "^1.4.6"
+        "propagating-hammerjs": "^1.4.6",
+        "puppeteer": "^1.16.0"
     }
 }