new avatar camera

public/aframe/index.vwf.yaml

@@ -73,19 +73,6 @@ children:
     extends: http://vwf.example.com/aframe/asky.vwf
     properties:
       color: "#ECECEC"
-  camentity:
-    extends: http://vwf.example.com/aframe/aentity.vwf
-    properties:
-      position: [0, 0, 0]
-    children:
-      camera:
-        extends: http://vwf.example.com/aframe/acamera.vwf
-        properties:
-          look-controls-enabled: true
-          forAvatar: true
-        children:
-          cursor:
-            extends: http://vwf.example.com/aframe/acursor.vwf
 methods:
   initialize:
     body: |

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

@@ -71,6 +71,24 @@ define(["module", "vwf/model", "vwf/utility"], function (module, model, utility)
                         }
                     }
                     return found;
+                },
+                 isAEntityComponent: function (prototypes) {
+                    var found = false;
+                    if (prototypes) {
+                        for (var i = 0; i < prototypes.length && !found; i++) {
+                            found = (prototypes[i] === "http://vwf.example.com/aframe/aentityComponent.vwf");
+                        }
+                    }
+                    return found;
+                },
+                 isAFrameEntityComponent: function (prototypes) {
+                    var found = false;
+                    if (prototypes) {
+                        for (var i = 0; i < prototypes.length && !found; i++) {
+                            found = (prototypes[i] === "http://vwf.example.com/aframe/aentityComponent.vwf");
+                        }
+                    }
+                    return found;
                 }
             };
 
@@ -110,7 +128,7 @@ define(["module", "vwf/model", "vwf/utility"], function (module, model, utility)
             //var kernel = this.kernel.kernel.kernel;
             var node;
 
-            if (this.state.isAFrameComponent(protos)) {
+            if (this.state.isAFrameComponent(protos) || this.state.isAEntityComponent(protos)) {
 
                 // Create the local copy of the node properties
                 if (this.state.nodes[childID] === undefined) {
@@ -121,14 +139,20 @@ define(["module", "vwf/model", "vwf/utility"], function (module, model, utility)
                 node = this.state.nodes[childID];
                 node.prototypes = protos;
 
+                 if ( childType == "component" ){
+                       if ( nodeID !== undefined ) {
+                        setAFrameObjectComponents(node);
+                    } 
+                } else {
+
                 node.aframeObj = createAFrameObject(node);
                 addNodeToHierarchy(node);
                 //notifyDriverOfPrototypeAndBehaviorProps();
+                }
             }
 
 
 
-
         },
 
         // -- initializingProperty -----------------------------------------------------------------
@@ -198,6 +222,40 @@ define(["module", "vwf/model", "vwf/utility"], function (module, model, utility)
                     
                 }
 
+                var componentName = "wasd-controls";
+                 if ( value === undefined && aframeObject.attributes.hasOwnProperty(componentName)) {
+                    value = propertyValue;
+                    
+                    switch ( propertyName ) { 
+
+                         case "enabled":
+                            aframeObject.setAttribute(componentName, 'enabled', propertyValue);
+
+                            if (propertyValue){
+                            //  aframeObject.addEventListener('componentchanged', function (evt) {
+
+                                                // if (evt.detail.name === 'position') {
+                                                //     self.kernel.fireEvent(node.parentID, "setPosition", evt.detail.newData);
+
+                                                // }
+                                                // if (evt.detail.name === 'rotation') {
+                                                //     self.kernel.fireEvent(node.ID, "setRotation", evt.detail.newData);
+                                                
+                                                // }
+                                        //    });
+                            }
+
+                                break;
+
+                        default:
+                            value = undefined;
+                            break; 
+
+
+                    }
+
+                 }
+
                  if ( value === undefined && isAEntityDefinition( node.prototypes ) ) {
 
                     value = propertyValue;
@@ -255,6 +313,14 @@ define(["module", "vwf/model", "vwf/utility"], function (module, model, utility)
                                     aframeObject.setAttribute('repeat', propertyValue);
                                     break;
 
+
+                                  case "look-controls-enabled":
+                                        aframeObject.setAttribute('look-controls', 'enabled', propertyValue);
+                                        break;
+                                 case "wasd-controls":
+                                        aframeObject.setAttribute('wasd-controls', 'enabled', propertyValue);
+                                        break;
+
                         default:
                             value = undefined;
                             break; 
@@ -424,23 +490,23 @@ define(["module", "vwf/model", "vwf/utility"], function (module, model, utility)
                          value = propertyValue;
                           switch (propertyName) {
 
-                                    case "look-controls-enabled":
-                                        aframeObject.setAttribute('look-controls', 'enabled', propertyValue);
-                                        break;
+                                    case "activeForAvatar":
+                                       console.log("set active camera to view");
+                                       break;
 
                                     case "forAvatar":
                                         if (propertyValue) {
-                                            aframeObject.addEventListener('componentchanged', function (evt) {
+                                            // aframeObject.addEventListener('componentchanged', function (evt) {
 
-                                                if (evt.detail.name === 'position') {
-                                                    self.kernel.fireEvent(node.ID, "setAvatarPosition", evt.detail.newData);
+                                            //     if (evt.detail.name === 'position') {
+                                            //         self.kernel.fireEvent(node.ID, "setAvatarPosition", evt.detail.newData);
 
-                                                }
-                                                if (evt.detail.name === 'rotation') {
-                                                    self.kernel.fireEvent(node.ID, "setAvatarRotation", evt.detail.newData);
-                                                    //console.log('Entity has moved from', evt.detail.oldData, 'to', evt.detail.newData, '!');
-                                                }
-                                            });
+                                            //     }
+                                            //     if (evt.detail.name === 'rotation') {
+                                            //         self.kernel.fireEvent(node.ID, "setAvatarRotation", evt.detail.newData);
+                                                
+                                            //     }
+                                            // });
                                         }
                                         break;
                     
@@ -478,6 +544,22 @@ define(["module", "vwf/model", "vwf/utility"], function (module, model, utility)
                          }
                 }
 
+
+                if ( value === undefined && aframeObject.attributes.hasOwnProperty("wasd-controls")) {
+                    value = propertyValue;
+                    
+                    switch ( propertyName ) { 
+
+                         case "enabled":
+                                        aframeObject.setAttribute('wasd-controls', 'enabled', propertyValue);
+                                        break;
+
+                    }
+
+                 }
+
+
+
                 if ( value === undefined && isAEntityDefinition( node.prototypes ) ) {
                     
                     switch ( propertyName ) { 
@@ -537,6 +619,19 @@ define(["module", "vwf/model", "vwf/utility"], function (module, model, utility)
                             case "repeat":
                                 value = aframeObject.getAttribute('repeat');
 
+                             case "look-controls-enabled":
+                                 var look = aframeObject.getAttribute('look-controls-enabled');
+                            if (look !== null && look !== undefined) {
+                                    value = aframeObject.getAttribute('look-controls').enabled;
+                            }
+                                    break;
+                            case "wasd-controls":
+                              var wasd = aframeObject.getAttribute('wasd-controls');
+                            if (wasd !== null && wasd !== undefined) {
+                                    value = aframeObject.getAttribute('wasd-controls').enabled;
+                            }
+                                    break;
+
                     }
                 }
 
@@ -623,9 +718,7 @@ define(["module", "vwf/model", "vwf/utility"], function (module, model, utility)
                  if ( value === undefined && aframeObject.nodeName == "A-CAMERA" ) {
         
                            switch (propertyName) {
-                                case "look-controls-enabled":
-                                    value = aframeObject.getAttribute('look-controls').enabled;
-                                    break;
+                               
                                 }
                 }
 
@@ -648,6 +741,17 @@ define(["module", "vwf/model", "vwf/utility"], function (module, model, utility)
         }
     });
 
+function setAFrameObjectComponents(node, config) {
+    let protos = node.prototypes;
+    let parentNode = self.state.nodes[node.parentID];
+
+    if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/wasd-controls.vwf")) {
+        parentNode.aframeObj.setAttribute('wasd-controls', {});
+    }
+
+    node.aframeObj = parentNode.aframeObj;
+}
+
 function createAFrameObject(node, config) {
     var protos = node.prototypes;
     var aframeObj = undefined;
@@ -678,7 +782,7 @@ function createAFrameObject(node, config) {
     } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/aentity.vwf")) {
         aframeObj = document.createElement('a-entity');
     }
-
+    aframeObj.setAttribute('id', node.ID);
     return aframeObj;
 }
 

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

@@ -54,10 +54,18 @@ define(["module", "vwf/view", "jquery", "jquery-ui"], function (module, view, $)
             }
 
             if (this.state.scenes[childID]) {
-                document.body.append(this.state.scenes[childID]);
+                let scene = this.state.scenes[childID];
+                document.body.append(scene);
                 createAvatar(childID);
+                createAvatarControl(scene);
             }
 
+            //  let avatarCameraID = 'camera-avatar-' + self.kernel.moniker();
+            // if (childID == avatarCameraID && ) {
+            //     let avatarCameraEl = document.querySelector('#'+ avatarCameraID);
+            //      avatarCameraEl.setAttribute('camera', 'active', true);
+            // }
+
 
         },
 
@@ -80,6 +88,19 @@ define(["module", "vwf/view", "jquery", "jquery-ui"], function (module, view, $)
 
             var aframeObject = node.aframeObj;
             switch (propertyName) {
+
+                case "activeForAvatar":
+                    console.log("sat to active!");
+                     //let avatarCameraID = 'camera-avatar-' + self.kernel.moniker();
+                    //node.aframeObj.setAttribute('camera', 'active', propertyValue);
+                     let avatarCameraEl = document.querySelector('#camera-avatar-'+ self.kernel.moniker());
+                        avatarCameraEl.setAttribute('camera', 'active', false);
+                        avatarCameraEl.setAttribute('camera', 'userHeight', 0.0);
+                        document.querySelector('#avatarControl').setAttribute('camera', 'active', true);
+
+
+                    break;
+
                 case "clickable":
                     if (propertyValue) {
                         aframeObject.addEventListener('click', function (evt) {
@@ -92,6 +113,7 @@ define(["module", "vwf/view", "jquery", "jquery-ui"], function (module, view, $)
 
         firedEvent: function (nodeID, eventName, eventParameters) {
             //var avatarID = vwf_view.kernel.find("", avatarName)
+
             var avatarName = 'avatar-' + self.kernel.moniker();
             if (eventName == "setAvatarPosition") {
                 vwf_view.kernel.setProperty(avatarName, "position", [eventParameters.x, eventParameters.y, eventParameters.z]);
@@ -99,6 +121,11 @@ define(["module", "vwf/view", "jquery", "jquery-ui"], function (module, view, $)
             if (eventName == "setAvatarRotation") {
                 vwf_view.kernel.setProperty(avatarName, "rotation", [eventParameters.x, eventParameters.y, eventParameters.z]);
             }
+
+             if (eventName == "setPosition") {
+                vwf_view.kernel.setProperty(avatarName, "position", [eventParameters.x, eventParameters.y, eventParameters.z]);
+            }
+
         },
 
         // ticked: function (vwfTime) {
@@ -106,6 +133,42 @@ define(["module", "vwf/view", "jquery", "jquery-ui"], function (module, view, $)
 
     });
 
+    function createAvatarControl(aScene) {
+
+        let avatarName = 'avatar-' + self.kernel.moniker();
+
+        let controlEl = document.createElement('a-camera');
+        controlEl.setAttribute('id', 'avatarControl');
+        controlEl.setAttribute('wasd-controls', {});
+        controlEl.setAttribute('look-controls', {});
+        aScene.appendChild(controlEl);
+        console.log(document.querySelector('#avatarControl').components);
+
+        controlEl.addEventListener('componentchanged', function (evt) {
+
+        if (evt.detail.name === 'position') {
+            var eventParameters = evt.detail.newData;
+             vwf_view.kernel.setProperty(avatarName, "position", [eventParameters.x, eventParameters.y, eventParameters.z]);
+            //self.kernel.fireEvent(node.parentID, "setPosition", evt.detail.newData);
+
+        }
+
+         if (evt.detail.name === 'rotation') {
+            var eventParameters = evt.detail.newData;
+               vwf_view.kernel.setProperty(avatarName, "rotation", [eventParameters.x, eventParameters.y, eventParameters.z]);
+            //self.kernel.fireEvent(node.parentID, "setPosition", evt.detail.newData);
+
+        }
+
+    });
+
+        vwf_view.kernel.setProperty('camera-'+avatarName, "activeForAvatar", true);
+
+        //let avatarCameraEl = document.querySelector('#camera-'+ avatarName);
+       // avatarCameraEl.setAttribute('active', true);
+
+    }
+
     function createAvatar(nodeID) {
 
         let avatarID = self.kernel.moniker();
@@ -115,6 +178,23 @@ define(["module", "vwf/view", "jquery", "jquery-ui"], function (module, view, $)
             "id": nodeName,
             "uri": nodeName,
             "extends": "http://vwf.example.com/aframe/avatar.vwf",
+            "children": {
+                  "cursor": {
+                            "extends": "http://vwf.example.com/aframe/acursor.vwf"
+                        },
+                "camera": {
+                    "id": 'camera-' + nodeName,
+                    "extends": "http://vwf.example.com/aframe/acamera.vwf",
+                    "properties": {
+                        "forAvatar": true,
+                        "look-controls-enabled": false,
+                        "wasd-controls": false
+                    },
+                    "children": {
+                      
+                    }
+                }
+            }
         }
 
         vwf_view.kernel.createChild(nodeID, nodeName, newNode);

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

@@ -3,5 +3,5 @@
 extends: http://vwf.example.com/aframe/aentity.vwf
 type: "a-camera"
 properties:
-  look-controls-enabled:
-  forAvatar:
+  forAvatar:
+  activeForAvatar:

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

@@ -0,0 +1,3 @@
+--- 
+extends: http://vwf.example.com/node.vwf
+properties:

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

@@ -12,7 +12,7 @@ methods:
                 "extends": "http://vwf.example.com/aframe/abox.vwf",
                 "properties": {
                     "color": myColor,
-                    "position": [0, 0, 0.5]
+                    "position": [0, 0, 0]
                 },
               "children": {
                 "avatarNameNode": {
@@ -25,6 +25,7 @@ methods:
                         "position": [0, 1, 0.5]
                     }
                   }
+               
                 } 
               };
               this.position = [0, 0, 0];

support/proxy/vwf.example.com/aframe/wasd-controls.vwf.yaml

@@ -0,0 +1,7 @@
+# https://aframe.io/docs/master/components/wasd-controls.html#properties_enabled
+---
+extends: http://vwf.example.com/aframe/aentityComponent.vwf
+type: "component"
+properties:
+  acceleration:
+  enabled: