fix WEBM

for compatibility

game/game.ink

@@ -13,7 +13,7 @@ LIST Inventory = (none), remover
 LIST OffOn = off, on
 LIST SeenUnseen = unseen, seen
 
-+ [Start] -> intro
+-> intro
 
 // Global actions. The entry point is the parameter.
 === global_actions(-> back) ===

src/Character.js

@@ -1,6 +1,5 @@
 /* @flow */
 import { Container } from '@svgdotjs/svg.js'
-import * as jQuery from "jquery";
 
 // TODO mouth position? or eyes, mouth, body structure
 enum Position {
@@ -46,9 +45,8 @@ export default class Character {
       console.error("pose is not defined");
       return;
     };
-    const char_width = this.poses[pose]['width'];
     const pos = Position.Center;
-    const top = this.getTop(pos, scene, pose, canvasWidth);
+    //const top = this.getTop(pos, scene, pose, canvasWidth);
     // TODO track characters on the scene:
     // first character takes center position
     // second character moves the first to the left and takes right position

src/Chernava.js

@@ -1,7 +1,6 @@
 /* @flow */
 import Character from "./Character";
 import { SVG } from '@svgdotjs/svg.js'
-import * as jQuery from "jquery";
 
 export default class Chernava extends Character {
   folder: string = 'mermaid';
@@ -21,14 +20,16 @@ export default class Chernava extends Character {
     // It's fine to start with a webm as default eyes.
     const eyes = draw.foreignObject(62,35)
     eyes.id(this.folder+"_eyes")
-    eyes.add(SVG('<div xmlns="http://www.w3.org/1999/xhtml"><video height=35 autoplay=true loop=true playsinline=true> <source type="video/webm" src="images/characters/'+this.folder+'/eyes/01.webm" /></video></div>'))
+    eyes.add(SVG('<div xmlns="http://www.w3.org/1999/xhtml"><video height=35 autoplay=true loop=true playsinline=true> <source type="video/webm" src="images/characters/'+this.folder+'/eyes/01.webm" /></video></div>', true))
     eyes.move(108, 50)
+    console.log(document.querySelector("#"+this.folder+"_eyes video"));
 
     // Not fine to put webm as the default mouth because it's the speaking loop
     // but good for testing
     const mouth = draw.foreignObject(62,20)
     mouth.id(this.folder+"_mouth")
-    mouth.add(SVG('<div xmlns="http://www.w3.org/1999/xhtml"><video height=10 autoplay=true loop=true playsinline=true> <source type="video/webm" src="images/characters/'+this.folder+'/mouth01.webm" /></video></div>'))
+    mouth.add(SVG('<div xmlns="http://www.w3.org/1999/xhtml"><video height=10 autoplay=true loop=true playsinline=true> <source type="video/webm" src="images/characters/'+this.folder+'/mouth01.webm" /></video></div>', true))
     mouth.move(129, 80)
+    document.querySelector("#"+this.folder+"_mouth video").play();
   }
 }