add select mode

support/client/lib/vwf/model/aframe/addon/aframe-components.js

@@ -131,7 +131,7 @@ AFRAME.registerComponent('cursor-listener', {
             console.log('I was clicked at: ', evt.detail.intersection.point);
             let cursorID = 'cursor-avatar-' + vwf_view.kernel.moniker();
             if (evt.detail.cursorEl.id.includes(vwf_view.kernel.moniker())) {
-                vwf_view.kernel.fireEvent(evt.detail.intersection.object.el.id, "clickEvent")
+                vwf_view.kernel.fireEvent(evt.detail.intersection.object.el.id, "clickEvent", [vwf_view.kernel.moniker()])
             }
 
             //vwf_view.kernel.fireEvent(evt.detail.target.id, "clickEvent")

support/client/lib/vwf/view/aframe.js

@@ -188,7 +188,8 @@ define(["module", "vwf/view"], function (module, view) {
                         "localUrl": '',
                         "remoteUrl": '',
                         "displayName": 'Avatar '+ randId(),
-                        "sharing": { audio: true, video: true }
+                        "sharing": { audio: true, video: true },
+                        "selectMode": false
                     }
                 }
 
@@ -209,6 +210,34 @@ define(["module", "vwf/view"], function (module, view) {
             //  if (eventName == "setAvatarPosition") {
             //     vwf_view.kernel.setProperty(avatarName, "position", [eventParameters.x, eventParameters.y, eventParameters.z]);
             // }
+
+            if (eventName == "clickEvent") {
+
+               if (self.kernel.moniker() == eventParameters[0]){
+
+                    let avatar = self.nodes[avatarName];
+                    let mode = vwf.getProperty(avatarName, 'selectMode');
+
+                    if(mode) {
+                        console.log("allow to click!!!")
+                        vwf_view.kernel.setProperty(avatarName, 'selectMode', false);
+
+                        let editorDriver = vwf.views["vwf/view/editor-new"];
+                        if (editorDriver){
+                            let selectSwitch = document.querySelector('#selectNodeSwitch');
+                            const selectSwitchComp = new mdc.iconToggle.MDCIconToggle(selectSwitch); //new mdc.select.MDCIconToggle
+                            selectSwitchComp.on = false;
+
+                            let currentNodeDIV = document.querySelector('#currentNode');
+                            if (currentNodeDIV) currentNodeDIV._setNode(nodeID);
+                            
+
+                        }
+                    }
+               }
+                
+
+            }
         },
 
         ticked: function (vwfTime) {

support/client/lib/vwf/view/editor-new.js

@@ -3015,7 +3015,37 @@ define([
                                     ]
                                 }
                             ]
-                        }
+                        },
+                        widgets.icontoggle({
+                            'id': "selectNodeSwitch",
+                            'label': 'select',
+                            'on': JSON.stringify({"content": "radio_button_checked", "label": "Select"}),
+                            'off': JSON.stringify({"content": "radio_button_unchecked", "label": "Unselect"}),
+                            'state': false,
+                            'init': function(){
+                        
+                                this.addEventListener('MDCIconToggle:change', (e) => {
+                                    
+                                    let avatarID = 'avatar-'+ vwf.moniker_;
+                                    let avatarNode = self.nodes['avatar-'+ vwf.moniker_];
+                                    let mode = JSON.parse(avatarNode.properties.selectMode.getValue());
+
+                                    if (mode) {
+
+                                        console.log("unselect");
+                                        vwf_view.kernel.setProperty(avatarID, "selectMode", false);
+
+                                    } else {
+
+                                        console.log("select")
+                                        vwf_view.kernel.setProperty(avatarID, "selectMode", true);
+                                    }
+
+                                  });
+                                
+                            }
+                        })
+                       
                     ]
                 },
                 {

support/proxy/vwf.example.com/aframe/ascene.js

@@ -1,4 +1,4 @@
-this.initialize = function() {
+this.initialize = function () {
     this.future(0).clientWatch();
 };
 
@@ -28,54 +28,64 @@ this.clientWatch = function () {
                         //console.log(node.id + " needed to delete!");
                         self.children.delete(self.children[node.id]);
                         //'gearvr-'
-                        let controllerVR = self.children['gearvr-'+ node.id.slice(7)];
-                        if (controllerVR){
+                        let controllerVR = self.children['gearvr-' + node.id.slice(7)];
+                        if (controllerVR) {
                             self.children.delete(controllerVR);
                         }
 
-                        let wmrvR = self.children['wmrvr-right-'+ node.id.slice(7)];
-                        if (wmrvR){
+                        let wmrvR = self.children['wmrvr-right-' + node.id.slice(7)];
+                        if (wmrvR) {
                             self.children.delete(wmrvR);
                         }
-                        
-                        let wmrvL = self.children['wmrvr-left-'+ node.id.slice(7)];
-                        if (wmrvL){
+
+                        let wmrvL = self.children['wmrvr-left-' + node.id.slice(7)];
+                        if (wmrvL) {
                             self.children.delete(wmrvL);
                         }
-                        
+
                     }
                 }
             });
-     }
+        }
     }
-    this.future(5).clientWatch(); 
+    this.future(5).clientWatch();
 };
 
-this.sphereProto = function(){
+this.sphereProto = function () {
 
     let node = {
         "extends": "http://vwf.example.com/aframe/asphere.vwf",
         "properties": {
             "displayName": "sphere",
             "color": "white",
-            "radius": 1
+            "radius": 1,
+            "clickable": true
         },
         children: {
             "interpolation":
-            {
-                "extends": "http://vwf.example.com/aframe/interpolation-component.vwf",
-                "type": "component",
-                "properties": {
-                    "enabled": true
-                }
+                {
+                    "extends": "http://vwf.example.com/aframe/interpolation-component.vwf",
+                    "type": "component",
+                    "properties": {
+                        "enabled": true
+                    }
+                },
+            "cursor-listener": {
+                "extends": "http://vwf.example.com/aframe/app-cursor-listener-component.vwf",
+                "type": "component"
             }
+        },
+        events: {
+            "clickEvent": {
+                "body": ""
+            }
+        }
     }
-}
 
     return node
 }
 
-this.cubeProto = function(){
+this.cubeProto = function () {
 
     let node = {
         "extends": "http://vwf.example.com/aframe/abox.vwf",
@@ -84,37 +94,47 @@ this.cubeProto = function(){
             "color": "white",
             "height": 1,
             "width": 1,
-            "depth": 1
+            "depth": 1,
+            "clickable": true
         },
         children: {
             "interpolation":
-            {
-                "extends": "http://vwf.example.com/aframe/interpolation-component.vwf",
-                "type": "component",
-                "properties": {
-                    "enabled": true
-                }
+                {
+                    "extends": "http://vwf.example.com/aframe/interpolation-component.vwf",
+                    "type": "component",
+                    "properties": {
+                        "enabled": true
+                    }
+                },
+            "cursor-listener": {
+                "extends": "http://vwf.example.com/aframe/app-cursor-listener-component.vwf",
+                "type": "component"
             }
+        },
+        events: {
+            "clickEvent": {
+                "body": ""
+            }
+        }
     }
-}
 
     return node
 }
 
-this.createPrimitive = function(type, avatar, name, node){
+this.createPrimitive = function (type, avatar, name, node) {
 
     var position = "0 0 0";
     var nodeName = name;
-    
+
 
     let myAvatar = this.children[avatar];
     let cursorNode = myAvatar.avatarNode.myHead.myCursor.vis;
-    
-    if (cursorNode){
+
+    if (cursorNode) {
         position = cursorNode.worldPosition;
         //console.log(position);
     }
-   
+
     if (!name) {
         nodeName = this.GUID();
     }
@@ -124,7 +144,7 @@ this.createPrimitive = function(type, avatar, name, node){
     switch (type) {
 
         case "cube":
-             newNode = this.cubeProto();
+            newNode = this.cubeProto();
             break;
 
         case "sphere":
@@ -135,12 +155,12 @@ this.createPrimitive = function(type, avatar, name, node){
             newNode = undefined;
             break;
     }
-   
+
     if (newNode) {
-    newNode.properties.position = position;
-    this.children.create(nodeName, newNode);
+        newNode.properties.position = position;
+        this.children.create(nodeName, newNode);
     }
-    
+
 }
 
 

support/proxy/vwf.example.com/aframe/avatar.vwf.yaml

@@ -10,6 +10,7 @@ properties:
     sharing: { audio: true, video: true }
 methods:
     initialize:
+    selectMode:
     updateAvatar:
     showHideAvatar:
         parameters: