add new worlds

.gitignore

@@ -21,4 +21,7 @@ config.json
 
 npm-debug.log
 error.log
-combined.log
+combined.log
+
+public/defaults/assets/test
+public/defaults/assets/concert

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "livecodingspace",
-  "version": "0.7.2",
+  "version": "0.8.1",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "livecodingspace",
-      "version": "0.7.2",
+      "version": "0.8.1",
       "license": "MIT",
       "dependencies": {
         "body-parser": "^1.19.0",
@@ -681,10 +681,6 @@
       "resolved": "https://registry.npmjs.org/gun/-/gun-0.2020.520.tgz",
       "integrity": "sha512-hMDmj4QQnejweZEy4njbyNlll+GO7H8XIq/SdQ23kFV29B6HqA0+bQmhLCxWKLwQvfRXx9SgSXG/ImGrER/CqQ==",
       "dependencies": {
-        "@peculiar/webcrypto": "^1.1.1",
-        "buffer": "^5.4.3",
-        "emailjs": "^2.2.0",
-        "text-encoding": "^0.7.0",
         "ws": "^7.2.1"
       },
       "engines": {

public/defaults/worlds/concert/appui.js

@@ -0,0 +1,15 @@
+//-----App ui-----
+
+function createApp() {
+    
+        let self = this
+    
+        return {
+            $cell: true,
+            $type: "div",
+            class: "propGrid max-width mdc-layout-grid mdc-layout-grid--align-left",
+            $components: []
+        }
+
+    }
+    

public/defaults/worlds/concert/concert.js

@@ -0,0 +1,566 @@
+this.initialize = function () {
+
+    if (Object.getPrototypeOf(this).id.includes('scene.vwf')) {
+        console.log("Initialize of Scene...", this.id);
+
+        this.watchPerformance();
+        //this.globalTransport.init();
+
+        this.back.back1.mask = "filter1";
+        this.back.back2.mask = "filter2";
+        this.back.back3.mask = "filter3";
+        //this.back.back1.rectangle.fill = "https://localhost:3007/defaults/assets/test/test.mp4";
+
+        //this.back.back1.rectangle.playVideo();
+
+
+        this.back.back1.rectangle.setVideoState(true, null, 0);
+        this.back.back1.rectangle.syncVideoState();
+        this.back.back3.rectangle.setVideoState(false, null, 0);
+
+
+        // this.tuning.syncStart();
+        this.toneTransport.setTransportState(false, null, 0);
+
+        this.filter1.el2.step();
+
+        //this.toneGUI.toneText.step();
+
+    } else {
+        console.log("Initialize proto Scene..", this.id);
+    }
+
+}
+
+this.setStartTime = function () {
+
+    this.tuning.startTime = this.toneTransport.position;
+}
+
+this.watchPerformance = function () {
+    let fixedTime = Number.parseFloat(this.time).toFixed();
+    //this.timeText.text = fixedTime.toString();
+
+    let secondsN = fixedTime//Math.floor(this.time/2);
+    let minutesN = Math.floor(secondsN / 60);
+    let hoursN = Math.floor(minutesN / 60);
+
+    let seconds = Number.parseFloat(secondsN % 60).toFixed();
+    let minutes = minutesN % 60;
+    let hours = hoursN % 12;
+
+    this.timeText.text = (hours ? (hours > 9 ? hours : "0" + hours) : "00") + ":" + (minutes ? (minutes > 9 ? minutes : "0" + minutes) : "00") + ":" + (seconds > 9 ? seconds : "0" + seconds);
+
+    if (fixedTime == 45) {
+        if (this.part2 !== "started") {
+            this.part1 = "finished";
+            this.back.back1.rectangle.fill = "black";
+            if (this.toneTransport) {
+                this.toneTransport.syncTransportState();
+                this.toneTransport.toggleTransport();
+                this.future(2).setStartTime();
+                //this.tuning.future(2).syncStart(this.tuning.startTime);
+                this.tuning.volume = -15;
+            }
+            this.part2 = "started";
+
+            let tuningText = {
+                "extends": "proxy/two/text.vwf",
+                "properties": {
+                    "size": 150,
+                    "fill": "white",
+                    "text": "",
+                    "stroke": "normal",
+                    "linewidth": 4,
+                    "translation": [500, 300]
+                }
+            }
+            this.children.create("tuningText", tuningText, function (child) { });
+
+        }
+        //84 - tuning
+    }
+
+    if (fixedTime == 99) {
+
+        this.back.back2.logo_text.text = "";
+        this.tuningText.text = 'what is this?'
+    }
+
+    if (fixedTime == 105) {
+        this.tuningText.text = ''
+    }
+
+    if (fixedTime == 110) {
+        this.tuningText.text = 'I don\'t know'
+    }
+
+    if (fixedTime == 115) {
+        this.tuningText.text = ''
+    }
+
+    if (fixedTime == 126) {
+        this.tuningText.text = ' toi toi toi'
+    }
+
+
+    if (fixedTime == 129) { //129
+
+        if (this.part3 !== "started") {
+            this.part2 = "finished";
+            this.tuningText.text = ''
+
+            if (this.toneTransport) {
+                this.toneTransport.syncTransportState();
+                this.toneTransport.toggleTransport();
+            }
+
+            this.back.back1.rectangle.fill = "black";
+            this.back.back1.rectangle.playVideo();
+            this.back.back1.visible = false;
+            this.filter1.visible = false;
+            this.filter2.visible = false;
+            this.filter1.el1.drag = false;
+            this.filter1.el2.drag = false;
+            this.filter2.el2.drag = false;
+            this.filter2.visible = false;
+
+
+            //this.back.back3.rectangle.setVideoState(true, null, 0);
+            //this.back.back3.rectangle.unmute();
+            this.startPart3();
+
+            this.part3 = "started"
+        }
+
+    }
+
+    if (fixedTime == 202) { //205
+        if (this.part4 !== "started") {
+            this.part3 = "finished";
+            this.back.back3.rectangle.playVideo();
+            //this.back.back3.rectangle.fill = "black";
+            this.back.back3.visible = false;
+            this.body.visible = false;
+            this.tuningText.text = "";
+            this.tuningText.opacity = 0.3;
+            this.tuningText.fill = "grey";
+
+            this.startPart4();
+
+            this.part4 = "started"
+        }
+
+    }
+
+    this.future(1).watchPerformance();
+
+}
+
+this.resize = function () {
+
+}
+
+this.startPart4 = function () {
+
+    let self = this;
+
+    let applause2 = {
+        "extends": "proxy/two/ellipse.vwf",
+        "properties": {
+            "width": 200,
+            "height": 200,
+            "fill": "/defaults/assets/concert/hands.png",
+            x: 220,
+            y: 630,
+            "drag": true,
+            linewidth: 0,
+            stroke: "transparent",
+            opacity: 0.7,
+            scale: 0.4
+        }
+    }
+
+    let applause3 = {
+        "extends": "proxy/two/ellipse.vwf",
+        "properties": {
+            "width": 200,
+            "height": 200,
+            "fill": "/defaults/assets/concert/hands.png",
+            x: 460,
+            y: 560,
+            "drag": true,
+            linewidth: 0,
+            stroke: "transparent",
+            opacity: 0.7,
+            scale: 0.7
+        }
+    }
+    let applause4 = {
+        "extends": "proxy/two/ellipse.vwf",
+        "properties": {
+            "width": 200,
+            "height": 200,
+            "fill": "/defaults/assets/concert/hands.png",
+            x: 740,
+            y: 600,
+            "drag": true,
+            linewidth: 0,
+            stroke: "transparent",
+            opacity: 0.7,
+            scale: 1
+        }
+    }
+
+    let clapping2 = {
+        "extends": "proxy/tonejs/player.vwf",
+        "properties": {
+            "url": "/defaults/assets/concert/clapping2.mp3",
+            "volume": -10
+        }
+    }
+
+    let clapping3 = {
+        "extends": "proxy/tonejs/player.vwf",
+        "properties": {
+            "url": "/defaults/assets/concert/clapping3.mp3",
+            "volume": -10
+        }
+    }
+    let clapping4 = {
+        "extends": "proxy/tonejs/player.vwf",
+        "properties": {
+            "url": "/defaults/assets/concert/clapping4.mp3",
+            "volume": -10
+        }
+    }
+
+    this.children.create("clapping2", clapping2);
+    this.children.create("clapping3", clapping3);
+    this.children.create("clapping4", clapping4);
+
+
+    this.children.create("applause2", applause2, function (child) {
+
+        child.mousedownEvent = function () {
+            this.parent.clapping2.start();
+        }
+
+        child.mouseupEvent = function () {
+            this.parent.clapping2.stop();
+        }
+    });
+
+    this.children.create("applause3", applause3, function (child) {
+
+        child.mousedownEvent = function () {
+            this.parent.clapping3.start();
+        }
+
+        child.mouseupEvent = function () {
+            this.parent.clapping3.stop();
+        }
+    });
+
+    this.children.create("applause4", applause4, function (child) {
+
+        child.mousedownEvent = function () {
+            this.parent.clapping4.start();
+        }
+
+        child.mouseupEvent = function () {
+            this.parent.clapping4.stop();
+        }
+    });
+
+}
+
+this.startPart3 = function () {
+
+    //
+    if (this.body.children.length == 0)
+        this.createBody();
+
+    //this.back.back3.rectangle.setVideoState(true, null, 0);
+    this.back.back3.rectangle.syncVideoState();
+
+    //this.back.back3.rectangle.syncVideoState();
+    //this.back.back3.rectangle.isPlaying = true;
+    this.back.back3.opacity = 1;
+    this.filter3.el1.opacity = 0.35;
+    this.filter3.el2.opacity = 0.35;
+
+    this.filter3.el1.drag = true;
+    this.filter3.el2.drag = true;
+
+    this.back.back3.rectangle.playVideo();
+
+    //this.back.back3.rectangle.unmute();
+
+
+    //this.body.playBodyMotion("https://localhost:3007/defaults/assets/concert/motion.json");
+}
+
+
+this.playBodyMotion = function () {
+
+    let initPose = this.body.getJointsAtTime(0);
+    initPose.forEach((e, i) => {
+
+        this.body.children["joint" + i].x = e.x * 1000;
+        this.body.children["joint" + i].y = e.y * 1000;
+    })
+
+
+}
+
+this.createBody = function () {
+    let self = this;
+
+    // let body = {
+    //     "extends": "proxy/two/group.vwf",
+    //     "properties": {
+    //     "drag": false,
+    //       "x": 239,
+    //       "y": -57,
+    //       "motionData": "https://localhost:3007/defaults/assets/concert/motion.json"
+    //     },
+    //     "methods":{
+    //         "applyBodyMotion":{
+    //             "parameters":["data"]
+    //         },
+    //         "getJointAtTime":{},
+    //         "getJointsAtTime":{}
+    //     }
+    //   }
+
+    let child = this.body;
+    child.motionData = "/defaults/assets/concert/motion.json";
+
+    //this.children.create("body", body, function( child ) {
+
+    let hands = [18, 20, 22, 21, 19, 17, 15, 16];
+    let face = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
+
+    let topArr = [16, 14, 12, 11, 13, 15, 24, 23];
+    let botArr = [24, 23];
+
+    //let faceArr = [10,8,6,4,1,3,7,9]
+
+    Array.from({ length: 25 }, (x, i) => {
+
+        let d = 20;
+
+        let joint = {
+            "extends": "proxy/two/ellipse.vwf",
+            "properties": {
+                "width": d,
+                "height": d,
+                "fill": "yellow"
+            }
+        }
+
+        if (face.includes(i)) {
+            joint.properties.width = 5;
+            joint.properties.height = 5;
+            joint.properties.fill = "grey";
+            joint.properties.opacity = 0.2;
+        }
+
+        if (hands.includes(i)) {
+            joint.properties.width = 10;
+            joint.properties.height = 10;
+            joint.properties.fill = "grey";
+            joint.properties.opacity = 0.5;
+        }
+
+        if (topArr.includes(i)) {
+            joint.properties.opacity = 0.2;
+        }
+
+        if (botArr.includes(i)) {
+            joint.properties.opacity = 0;
+        }
+
+        child.children.create("joint" + i, joint);
+    });
+
+    //16-14-12-11-13-15 - topline
+    //12-24-23-11 - bottomline
+
+    //18,16,20 - rh // 16,22
+    //17,15,19 - lh // 15,21
+
+    let rh = {
+        "extends": "proxy/two/curve.vwf",
+        "properties": {
+            "vertices": [{ x: 0, y: 0 }, { x: 0, y: 0 }, { x: 0, y: 0 }],
+            "fill": "transparent",
+            "linewidth": 1,
+            "curved": true
+        }
+    }
+    let rh2 = {
+        "extends": "proxy/two/curve.vwf",
+        "properties": {
+            "vertices": [{ x: 0, y: 0 }, { x: 0, y: 0 }],
+            "fill": "transparent",
+            "linewidth": 1,
+            "curved": true
+        }
+    }
+
+    let lh = {
+        "extends": "proxy/two/curve.vwf",
+        "properties": {
+            "vertices": [{ x: 0, y: 0 }, { x: 0, y: 0 }, { x: 0, y: 0 }],
+            "fill": "transparent",
+            "linewidth": 1,
+            "curved": true
+        }
+    }
+
+    let lh2 = {
+        "extends": "proxy/two/curve.vwf",
+        "properties": {
+            "vertices": [{ x: 0, y: 0 }, { x: 0, y: 0 }],
+            "fill": "transparent",
+            "linewidth": 1,
+            "curved": true
+        }
+    }
+
+    let topline = {
+        "extends": "proxy/two/curve.vwf",
+        "properties": {
+            "vertices": [{ x: 0, y: 0 }, { x: 0, y: 0 }, { x: 0, y: 0 }, { x: 0, y: 0 }, { x: 0, y: 0 }, { x: 0, y: 0 }],
+            "fill": "transparent",
+            "linewidth": 3,
+            "curved": true
+        }
+    }
+
+    let bottomline = {
+        "extends": "proxy/two/curve.vwf",
+        "properties": {
+            "vertices": [{ x: 0, y: 0 }, { x: 0, y: 0 }, { x: 0, y: 0 }, { x: 0, y: 0 }], //
+            "fill": "transparent",
+            "linewidth": 3,
+            "curved": true
+        }
+    }
+
+    let faceline = {
+        "extends": "proxy/two/curve.vwf",
+        "properties": {
+            "vertices": [{ x: 0, y: 0 }, { x: 0, y: 0 }, { x: 0, y: 0 }, { x: 0, y: 0 },
+            { x: 0, y: 0 }, { x: 0, y: 0 }, { x: 0, y: 0 }, { x: 0, y: 0 }, { x: 0, y: 0 }], //
+            "fill": "transparent",
+            "linewidth": 1.5,
+            "curved": true
+        }
+    }
+
+    child.children.create("topline", topline);
+    child.children.create("bottomline", bottomline);
+    child.children.create("rhand", rh);
+    child.children.create("lhand", lh);
+    child.children.create("rhand2", rh2);
+    child.children.create("lhand2", lh2);
+    child.children.create("faceline", faceline);
+
+
+    child.applyBodyMotion = function (data) {
+        console.log(data);
+    }
+
+    //child.setScale(-1,1);
+
+    self.back.back3.rectangle.bodyTrack = true;
+    self.back.back3.rectangle.bodyNode = "body";
+    //self.future(2).playBodyMotion();
+
+    //});
+}
+
+
+this.filter2.el2.mousedownEvent = function () {
+
+    this.fill = this.getRandomColor();
+    console.log('CLICK ', this.id);
+}
+
+
+this.filter3.el1.overstartEvent = function (avatarID) {
+    let scene = this.getScene();
+    if (scene.part3 == "started") {
+        let nodeName = this.parent.maskedNode;
+        if (nodeName) {
+            let node = scene.findNode(nodeName).rectangle;
+            this.viewTroughFilter(node.id, false);
+            //node.visible = true;
+        }
+    }
+}
+
+this.filter3.el1.overendEvent = function (avatarID) {
+    let scene = this.getScene();
+    if (scene.part3 == "started") {
+        let nodeName = this.parent.maskedNode;
+        if (nodeName) {
+            let node = scene.findNode(nodeName).rectangle;
+            this.viewTroughFilter(node.id, true);
+            //node.visible = false;
+        }
+    }
+}
+
+this.filter1.el2.do = function () {
+    this.rotation = this.rotation + 0.001;
+}
+
+this.filter3.el2.overstartEvent = function (avatarID) {
+    let scene = this.getScene();
+    if (scene.part3 == "started") {
+        let nodeName = this.parent.maskedNode;
+        if (nodeName) {
+            let node = scene.findNode(nodeName).rectangle;
+            this.viewTroughFilter(node.id, false);
+            //node.visible = true;
+        }
+    }
+}
+
+
+this.filter3.el2.overendEvent = function (avatarID) {
+    let scene = this.getScene();
+    if (scene.part3 == "started") {
+        let nodeName = this.parent.maskedNode;
+        if (nodeName) {
+            let node = scene.findNode(nodeName).rectangle;
+            this.viewTroughFilter(node.id, true);
+            //node.visible = false;
+        }
+    }
+}
+
+this.filter1.el2.overstartEvent = function (avatarID) {
+    // let nodeName = this.parent.maskedNode;
+    // if (nodeName) {
+    //     let node = this.getScene().findNode(nodeName);
+    //     //this.viewTroughFilter(node.id, true);
+    //     //node.visible = true;
+    // }
+}
+
+
+this.filter1.el2.overendEvent = function (avatarID) {
+
+    // let nodeName = this.parent.maskedNode;
+    // if (nodeName) {
+    //     let node = this.getScene().findNode(nodeName);
+    //     //this.viewTroughFilter(node.id, false);
+    //     //node.visible = false;
+    // }
+
+}

public/defaults/worlds/concert/index.vwf.config.json

@@ -0,0 +1,13 @@
+{
+  "info":{
+    "title": "Concert"
+  },
+  "model": {
+    "/drivers/model/two": null,
+    "/drivers/model/tone": null
+  },
+  "view": {
+    "/drivers/view/two": null,
+    "/drivers/view/tone": null
+  }
+}

public/defaults/worlds/concert/index.vwf.json

@@ -0,0 +1,230 @@
+{
+  "extends": "proxy/two/scene.vwf",
+  "properties": {
+    "part1": "notstarted",
+    "part2": "notstarted",
+    "part3": "notstarted",
+    "part4": "notstarted"
+  },
+  "methods":{
+    "initialize": {},
+    "watchPerformance": {},
+    "createBody":{},
+    "startPart3":{},
+    "startPart4":{},
+    "playBodyMotion":{},
+    "setStartTime":{}
+  },
+  "children":{
+    "timeText":{
+      "extends": "proxy/two/text.vwf",
+      "properties": {
+        "text": "",
+        "translation": [50,25],
+        "fill": "grey",
+        "opacity": 0.4,
+        "size": 22
+      }
+    },
+    "back":{
+      "extends": "proxy/two/group.vwf",
+      "properties":{
+        "x": 700,
+        "y": 400
+      },
+      "children":{
+        "back1":{
+          "extends": "proxy/two/group.vwf",
+          "properties":{
+            "displayName": "back1"
+          },
+          "children":{
+            "rectangle":{
+              "extends": "proxy/two/rectangle.vwf",
+              "properties": {
+                "width": 1280,
+                "height": 720,
+                "fill": "/defaults/assets/concert/bowing.mp4"
+              }
+            }
+          }
+        },
+        "back2":{
+          "extends": "proxy/two/group.vwf",
+          "properties":{
+            "displayName": "back2"
+          },
+          "children":{
+            "logo_text":{
+              "extends": "proxy/two/text.vwf",
+              "properties": {
+                "size": 70,
+                "fill": "white",
+                "text": "THIS IS NOT A CONCERT",
+                "translation": [-150, -100]
+              }
+            }
+
+          }
+        },
+        "back3":{
+          "extends": "proxy/two/group.vwf",
+          "properties":{
+            "displayName": "back3",
+            "opacity": 0
+          },
+          "children":{
+            "rectangle":{
+              "extends": "proxy/two/rectangle.vwf",
+              "properties": {
+                "stroke": "white",
+                "linewidth": 0,
+                "width": 1280,
+                "height": 720,
+                "fill": "/defaults/assets/concert/playing.mp4",
+                "bodyTrack": false,
+                "bodyNode": null
+              }
+            }
+          }
+        }
+      }
+    },
+    "filter1":{
+      "extends":"proxy/two/group.vwf",
+      "properties":{
+        "x":700,
+        "y":300,
+        "drag": false
+      },
+      "children":
+      { 
+        "el1":{
+        "extends": "proxy/two/ellipse.vwf",
+        "properties": {
+          "width": 400,
+          "height": 400,
+          "fill": "#ccc",
+          "opacity":0.2,
+          "drag": true,
+          "x": 64,
+          "y": -20
+        }
+      },
+      "el2":{
+        "extends": "proxy/two/rectangle.vwf",
+        "properties": {
+          "width": 350,
+          "height": 350,
+          "x": -400,
+          "y": -20,
+          "fill": "#ccc",
+          "opacity":0.2,
+          "drag": true,
+          "stepping": true,
+          "stepTime": 0.01
+        }
+      }
+    }
+    },
+    "filter2":{
+      "extends":"proxy/two/group.vwf",
+      "properties":{
+        "x":700,
+        "y":300,
+        "drag": false
+      },
+      "children":
+      { 
+      "el2":{
+        "extends": "proxy/two/rectangle.vwf",
+        "properties": {
+          "width": 880,
+          "height": 150,
+          "x": -145,
+          "y": 0,
+          "fill": "white",
+          "opacity":0.2,
+          "drag": true
+        }
+      }
+    }
+    },
+    "filter3":{
+      "extends":"proxy/two/group.vwf",
+      "properties":{
+        "x":700,
+        "y":300,
+        "drag": false
+      },
+      "children":
+      { 
+        "el1":{
+        "extends": "proxy/two/ellipse.vwf",
+        "properties": {
+          "width": 350,
+          "height": 350,
+          "fill": "white",
+          "opacity":0,
+          "drag": false,
+          "x": -205,
+          "y": -15,
+          "stroke": "white",
+          "linewidth": 1
+        }
+      },
+      "el2":{
+        "extends": "proxy/two/rectangle.vwf",
+        "properties": {
+          "width": 350,
+          "height": 600,
+          "x": 136,
+          "y": 370,
+          "fill": "white",
+          "opacity":0,
+          "drag": false,
+          "stroke": "white",
+          "linewidth": 1
+        }
+      }
+    }
+    },
+    "toneTransport":{
+      "extends": "proxy/tonejs/transport.vwf",
+      "properties": {
+        "bpm": 100,
+        "loopStart": 0,
+        "loopEnd":  90,
+        "duration": 90,
+        "loop": true
+      }
+    },
+    "tuning":{
+      "extends": "proxy/tonejs/player.vwf",
+      "properties": {
+        "url": "/defaults/assets/concert/tuning.mp3",
+        "volume": -15,
+        "autostart": false
+      }
+    },
+    "body": {
+      "extends": "proxy/two/group.vwf",
+      "properties": {
+      "drag": false,
+        "x": 239,
+        "y": -57,
+        "motionData": null
+      },
+      "methods":{
+          "applyBodyMotion":{
+              "parameters":["data"]
+          },
+          "getJointAtTime":{},
+          "getJointsAtTime":{}
+      }
+    }
+  },
+  "scripts":{
+    "source": "concert.js"
+  }
+}

public/defaults/worlds/concert/info.json

@@ -0,0 +1,14 @@
+{
+    "info": {
+        "en": {
+            "title": "THIS IS NOT A CONCERT",
+            "imgUrl": "/defaults/worlds/concert/webimg.jpg",
+            "text": "BROWSER 2021 | A Festival of Web-based Music | June 11th-13th"
+        },
+        "ru": {
+            "title": "ЭТО НЕ КОНЦЕРТ",
+            "imgUrl": "/defaults/worlds/concert/webimg.jpg",
+            "text": "BROWSER 2021 | A Festival of Web-based Music | June 11th-13th"
+        }
+    }
+}

public/defaults/worlds/pts/appui.js

@@ -0,0 +1,15 @@
+//-----App ui-----
+
+function createApp() {
+    
+        let self = this
+    
+        return {
+            $cell: true,
+            $type: "div",
+            class: "propGrid max-width mdc-layout-grid mdc-layout-grid--align-left",
+            $components: []
+        }
+
+    }
+    

public/defaults/worlds/pts/canvas.js

@@ -0,0 +1,3 @@
+this.initialize = function () {
+
+}

public/defaults/worlds/pts/index.vwf.config.json

@@ -0,0 +1,12 @@
+{
+  "info":{
+    "title": "2D App"
+  },
+  "model": {
+    "/drivers/model/pts": null
+  },
+  "view": {
+    "/drivers/view/pts": null,
+    "/drivers/view/editor": null
+  }
+}

public/defaults/worlds/pts/index.vwf.json

@@ -0,0 +1,11 @@
+{
+  "extends": "proxy/pts/scene.vwf",
+  "properties": {
+  },
+  "methods":{
+    "initialize": {}
+  },
+  "scripts":{
+    "source": "canvas.js"
+  }
+}

public/defaults/worlds/pts/info.json

@@ -0,0 +1,14 @@
+{
+    "info": {
+        "en": {
+            "title": "2D Canvas PTS.js app",
+            "imgUrl": "/defaults/worlds/pts/webimg.jpg",
+            "text": "Example application of VWF & PTS.js"
+        },
+        "ru": {
+            "title": "2D Canvas PTS.js app",
+            "imgUrl": "/defaults/worlds/pts/webimg.jpg",
+            "text": "Example application of VWF & PTS.js"
+        }
+    }
+}

public/defaults/worlds/rubik/robot.js

@@ -57,26 +57,26 @@ this.rotateFace = function(faceID){
         'd': {
             'robot': 'left',
             'motor': 'C',
-            'dutyCycle': 100,
+            'dutyCycle': 80,
             'direction': -1*direction
         },
         'b': {
             'robot': 'back',
             'motor': 'A',
-            'dutyCycle': 70,
+            'dutyCycle': 60,
             'direction': direction
         },
         'r': {
             'robot': 'right',
             'motor': 'A',
-            'dutyCycle': 70,
+            'dutyCycle': 60,
             'direction': direction
         },
         'u': {
             'robot': 'back',
             'motor': 'C',
-            'dutyCycle': 100,
-            'direction': direction
+            'dutyCycle': 60,
+            'direction': -1*direction
         },
         'f': {
             'robot': 'front',

public/defaults/worlds/tone/generate.js

@@ -1,5 +1,5 @@
 this.clickEventMethod = function() {
-   this.synth.triggerAttackRelease(['C4'], ['8n'], 0.3);
+   this.synth.triggerAttackRelease(['C4'], ['8n'], null, 0.3);
 }
 
 this.doButtonTriggerdownAction = function(buttonID){
@@ -43,7 +43,7 @@ this.onGlobalBeat = function (obj) {
     //     { beat: 15, msg: "C0" }];
     drumSeq.forEach(el => {
         if (el.beat / rate == obj.beat) {
-            this.synth.triggerAttackRelease([el.msg], ['16n']);
+            this.synth.triggerAttackRelease([el.msg], ['16n'], null);
         }
     })
 

public/defaults/worlds/tone/info.json

@@ -6,9 +6,9 @@
             "text": "Example app with Tone JS"
         },
         "ru":{
-            "title": "Music App",
+            "title": "Музыкальная программа",
             "imgUrl": "/defaults/worlds/tone/webimg.jpg",
-            "text": "Example app with Tone JS"
+            "text": "Пример программы с Tone JS"
         }
        
     }

public/defaults/worlds/tone/instrument.js

@@ -1,5 +1,5 @@
 this.clickEventMethod = function() {
-   this.synth.triggerAttackRelease(['C4'], ['8n'], 0.3);
+   this.synth.triggerAttackRelease(['C4'], ['8n'], null, 0.3);
 }
 
 this.doButtonTriggerdownAction = function(buttonID){

public/defaults/worlds/tone/transportLine.js

@@ -24,7 +24,7 @@ this.fromhitstartEventMethod = function(value){
     if(notes.length == 1){
         let note = notes[0];
         //synth.triggerAttack(note.freq, note.velocity);
-        synth.triggerAttackRelease([note.freq], [note.duration], note.velocity);
+        synth.triggerAttackRelease([note.freq], [note.duration], null, note.velocity);
     } else if (notes.length > 0){
         let chord = notes.map(el=>{
             return el.freq
@@ -34,7 +34,7 @@ this.fromhitstartEventMethod = function(value){
         })
 
          let velocity = notes[0].velocity;
-         synth.triggerAttackRelease(chord, durations, velocity);
+         synth.triggerAttackRelease(chord, durations, null, velocity);
         // synth.triggerAttack(chord, velocity); //, durations
     }
 

public/defaults/worlds/two/2d.js

@@ -0,0 +1,185 @@
+this.initialize = function () {
+
+    if (Object.getPrototypeOf(this).id.includes('scene.vwf')) {
+        console.log("Initialize of Scene...", this.id);
+
+        this.globalTransport.init();
+
+        this.back.back2.mask = "filter2";
+        this.back.back1.mask = "filter1";
+        //this.back.back1.rectangle.fill = "https://localhost:3007/defaults/assets/test/test.mp4";
+
+        //this.back.back1.rectangle.playVideo();
+
+        this.back.back1.rectangle.setVideoState(false, null, 0);
+
+
+
+
+        this.synth.sync();
+
+        this.future(1).setStartTime();
+        this.tuning.syncStart();
+
+
+        //this.synth.scheduleRepeat();
+        this.synth.triggerAttackRelease(["A3"], "32n", "4n", 0.8);
+        this.synth.triggerAttackRelease(["E3"], "32n", "8n", 0.8);
+
+        this.toneTransport.setTransportState(false, null, 0);
+
+
+        this.toneGUI.toneText.step();
+
+    } else {
+        console.log("Initialize proto Scene..", this.id);
+    }
+
+}
+
+this.resize = function () {
+
+}
+
+this.setStartTime = function () {
+
+    this.tuning.startTime = this.toneTransport.position;
+}
+
+this.toneGUI.toneText.do = function () {
+    let scene = this.getScene();
+
+    if (scene && scene.toneTransport) {
+        this.text = scene.toneTransport.position;
+    }
+
+
+}
+
+this.toneGUI.tonePlay.mousedownEvent = function () {
+    let scene = this.getScene();
+    if (scene.toneTransport) {
+
+
+        //scene.tuning.startTime = scene.toneTransport.position;
+        //scene.future(1).setStartTime();
+        //scene.tuning.startTime = scene.toneTransport.position;
+        scene.toneTransport.syncTransportState();
+        scene.toneTransport.toggleTransport();
+
+    }
+
+
+    // let scene = this.getScene();
+    // if(!scene.toneTransport.state || scene.toneTransport.state  == "stopped"){
+    //     scene.toneTransport.start();
+    //     scene.toneTransport.state = "started";
+    //     console.log("START Transport")
+    // } else if(scene.toneTransport.state == "started"){
+    //     scene.toneTransport.stop();
+    //     scene.toneTransport.state = "stopped";
+    //     console.log("STOP Transport")
+    // } else if(scene.toneTransport.state == "paused"){
+    //     scene.toneTransport.state = "paused";
+    // }
+
+
+
+}
+
+this.audio.mousedownEvent = function () {
+
+    this.parent.back.back1.rectangle.unmute();
+}
+
+this.play.mousedownEvent = function () {
+
+    //this.parent.back.back1.rectangle.setVideoState(true, 0, 0);
+    //this.parent.back.back1.rectangle.setVideoState(this.isPlaying, this.startOffset, this.pausedTime);
+    this.parent.back.back1.rectangle.syncVideoState();
+    this.parent.back.back1.rectangle.playVideo();
+}
+
+this.ellipse.clickEvent = function () {
+
+    this.fill = this.getRandomColor();
+    console.log('CLICK ', this.id);
+}
+
+this.ellipse.mousedownEvent = function () {
+
+    this.fill = this.getRandomColor();
+    console.log('Mouse Down ', this.id);
+}
+
+this.ellipse.mouseupEvent = function () {
+
+    this.fill = this.getRandomColor();
+    console.log('Mouse Up ', this.id);
+}
+
+this.ellipse.overstartEvent = function (avatarID) {
+    this.fill = "#e3dd24"
+}
+
+this.ellipse.overendEvent = function (avatarID) {
+    this.fill = "white"
+}
+
+
+this.filter2.el2.overstartEvent = function (avatarID) {
+    let nodeName = this.parent.maskedNode;
+    if (nodeName) {
+        let node = this.getScene().findNode(nodeName);
+        this.viewTroughFilter(node.id, true);
+        //node.visible = true;
+    }
+}
+
+
+this.filter2.el2.overendEvent = function (avatarID) {
+    let nodeName = this.parent.maskedNode;
+    if (nodeName) {
+        let node = this.getScene().findNode(nodeName);
+        this.viewTroughFilter(node.id, false);
+        //node.visible = false;
+    }
+}
+
+this.filter1.el1.overstartEvent = function (avatarID) {
+    let nodeName = this.parent.maskedNode;
+    if (nodeName) {
+        let node = this.getScene().findNode(nodeName);
+        //this.viewTroughFilter(node.id, true);
+        //node.visible = true;
+    }
+}
+
+
+this.filter1.el1.overendEvent = function (avatarID) {
+    let nodeName = this.parent.maskedNode;
+    if (nodeName) {
+        let node = this.getScene().findNode(nodeName);
+        //this.viewTroughFilter(node.id, false);
+        //node.visible = false;
+    }
+}
+
+this.filter1.el2.overstartEvent = function (avatarID) {
+    let nodeName = this.parent.maskedNode;
+    if (nodeName) {
+        let node = this.getScene().findNode(nodeName);
+        //this.viewTroughFilter(node.id, true);
+        //node.visible = true;
+    }
+}
+
+
+this.filter1.el2.overendEvent = function (avatarID) {
+    let nodeName = this.parent.maskedNode;
+    if (nodeName) {
+        let node = this.getScene().findNode(nodeName);
+        //this.viewTroughFilter(node.id, false);
+        //node.visible = false;
+    }
+}

public/defaults/worlds/two/appui.js

@@ -0,0 +1,15 @@
+//-----App ui-----
+
+function createApp() {
+    
+        let self = this
+    
+        return {
+            $cell: true,
+            $type: "div",
+            class: "propGrid max-width mdc-layout-grid mdc-layout-grid--align-left",
+            $components: []
+        }
+
+    }
+    

public/defaults/worlds/two/index.vwf.config.json

@@ -0,0 +1,14 @@
+{
+  "info":{
+    "title": "2D App"
+  },
+  "model": {
+    "/drivers/model/two": null,
+    "/drivers/model/tone": null
+  },
+  "view": {
+    "/drivers/view/two": null,
+    "/drivers/view/tone": null,
+    "/drivers/view/editor": null
+  }
+}

public/defaults/worlds/two/index.vwf.json

@@ -0,0 +1,210 @@
+{
+  "extends": "proxy/two/scene.vwf",
+  "properties": {
+  },
+  "methods":{
+    "initialize": {},
+    "setStartTime":{}
+  },
+  "children":{
+    "play":{
+      "extends": "proxy/two/rectangle.vwf",
+      "properties": {
+        "width": 50,
+        "height": 50,
+        "fill": "#aaa",
+        "x": 1000,
+        "y": 200
+      }
+    },
+    "audio":{
+      "extends": "proxy/two/ellipse.vwf",
+      "properties": {
+        "width": 50,
+        "height": 50,
+        "fill": "#aaa",
+        "x": 1100,
+        "y": 200
+      }
+    },
+    
+    "logo":{
+      "extends": "proxy/two/text.vwf",
+      "properties": {
+        "text": "PROTOTYPE",
+        "translation": [150,110],
+        "fill": "#ddd",
+        "size": 28
+      }
+    },
+    "back":{
+      "extends": "proxy/two/group.vwf",
+      "properties":{
+        "x": 500,
+        "y": 400
+      },
+      "children":{
+        "back1":{
+          "extends": "proxy/two/group.vwf",
+          "properties":{
+            "displayName": "back1"
+          },
+          "children":{
+            "rectangle":{
+              "extends": "proxy/two/rectangle.vwf",
+              "properties": {
+                "width": 800,
+                "height": 500,
+                "fill": "/defaults/assets/test/test.mp4"
+              }
+            }
+          }
+        },
+        "back2":{
+          "extends": "proxy/two/group.vwf",
+          "properties":{
+            "displayName": "back2"
+          },
+          "children":{
+            "rectangle2":{
+              "extends": "proxy/two/rectangle.vwf",
+              "properties": {
+                "width": 600,
+                "height": 40,
+                "fill": "#ddd",
+                "linewidth": 3
+              }
+            }
+          }
+        }
+ 
+      
+      }
+    },
+    "filter1":{
+      "extends":"proxy/two/group.vwf",
+      "properties":{
+        "x":350,
+        "y":800,
+        "drag": false
+      },
+      "children":
+      { 
+        "el1":{
+        "extends": "proxy/two/ellipse.vwf",
+        "properties": {
+          "width": 200,
+          "height": 200,
+          "fill": "#ccc",
+          "opacity":0.2,
+          "drag": true
+        }
+      },
+      "el2":{
+        "extends": "proxy/two/rectangle.vwf",
+        "properties": {
+          "width": 200,
+          "height": 200,
+          "x": 250,
+          "fill": "#ddd",
+          "opacity":0.5,
+          "drag": true
+        }
+      }
+    }
+    },
+    "filter2":{
+      "extends":"proxy/two/group.vwf",
+      "properties":{
+        "x":350,
+        "y":800,
+        "drag": false
+      },
+      "children":
+      { 
+      "el2":{
+        "extends": "proxy/two/rectangle.vwf",
+        "properties": {
+          "width": 200,
+          "height": 200,
+          "x": 250,
+          "fill": "white",
+          "opacity":0.3,
+          "drag": true
+        }
+      }
+    }
+    },
+    "ellipse":{
+      "extends": "proxy/two/ellipse.vwf",
+      "properties": {
+        "width": 100,
+        "height": 100,
+        "fill": "#ccc",
+        "x": 140,
+        "y": 800,
+        "drag": true
+      }
+    },
+    "globalTransport":{
+      "extends": "proxy/two/objects/transport.vwf",
+      "properties": {
+        "x": 50,
+        "y": 170,
+        "drag": false
+      }
+    },
+    "toneGUI":{
+      "extends":"proxy/two/group.vwf",
+      "properties": {
+        "x": 1100,
+        "y": 400
+      },
+      "children":{
+        "tonePlay":{
+          "extends": "proxy/two/ellipse.vwf",
+          "properties": {
+            "width": 50,
+            "height": 50,
+            "fill": "#eee"
+          }
+        },
+        "toneText":{
+          "extends": "proxy/two/text.vwf",
+          "properties": {
+            "size": 28,
+            "fill": "#aaa",
+            "text": "transport",
+            "stepping": true,
+            "stepTime": 0.5,
+            "translation": [0,-100]
+          }
+        }
+      }
+    },
+    "synth":{
+      "extends": "proxy/tonejs/synth.vwf",
+      "properties": {}
+    },
+    "toneTransport":{
+      "extends": "proxy/tonejs/transport.vwf",
+      "properties": {
+        "bpm": 120,
+        "loopStart": "0",
+        "loopEnd":  "60",
+        "duration": "60",
+        "loop": true
+      }
+    },
+    "tuning":{
+      "extends": "proxy/tonejs/player.vwf",
+      "properties": {
+        "url": "/defaults/assets/test/test.mp3",
+        "autostart": false
+      }
+    }
+  },
+  "scripts":{
+    "source": "2d.js"
+  }
+}

public/defaults/worlds/two/info.json

@@ -0,0 +1,14 @@
+{
+    "info": {
+        "en": {
+            "title": "2D Canvas app",
+            "imgUrl": "/defaults/worlds/two/webimg.jpg",
+            "text": "Example application showing Virtual World Framework & TWO.JS framework integration"
+        },
+        "ru": {
+            "title": "2D Холст",
+            "imgUrl": "/defaults/worlds/two/webimg.jpg",
+            "text": "Пример приложения Virtual World Framework & TWO.JS"
+        }
+    }
+}

public/web/standalone.js

@@ -107,7 +107,7 @@ class Standalone {
         }, [
             h("img", {
                 slot: "image",
-                src: "/defaults/assets/concert/webimg.jpg",
+                src: "/defaults/worlds/concert/webimg.jpg",
                 alt: ""
             }),
             h("strong", "THIS IS NOT A CONCERT"),