create cameras from the editor

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

@@ -262,7 +262,7 @@ define(["module", "vwf/model", "vwf/utility"], function (module, model, utility)
                     let target = methodParameters[0];
                     node.aframeObj.object3D.lookAt(new THREE.Vector3(target.x, target.y, target.z));
                     let newRotation = node.aframeObj.getAttribute('rotation');
-                    self.kernel.setProperty(nodeID, "rotation", {x: 0, y: newRotation.y, z: 0});
+                    self.kernel.setProperty(nodeID, "rotation", {x: 0, y: newRotation.y, z: 0}); 
                 }
             }
 

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

@@ -409,7 +409,12 @@ define(["module", "vwf/view"], function (module, view) {
                 if (methodName == "setCameraToActive"){
                     if (methodParameters[0] == vwf.moniker_){
                     console.log("set active");
-                    node.aframeObj.setAttribute('camera', 'active', true)
+                    let offsetComp = node.aframeObj.getAttribute('viewoffset');
+                    if (offsetComp) {
+                        let offsetCompID = vwf.find(nodeID, 'viewoffset');
+                        self.kernel.callMethod(offsetCompID, "setParams", []);
+                    }
+                    node.aframeObj.setAttribute('camera', 'active', true);
                 }
             }
         }

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

@@ -256,15 +256,24 @@ define([
                                                 title: 'Camera',
                                                 styleClass: "createListItem",
                                                 onclickfunc: function(){
+                                                    let avatarID = 'avatar-' + vwf.moniker_;
                                                     //let cubeName = self.GUID();
+                                                    vwf_view.kernel.callMethod(vwf.application(), "createCamera", [null, null, avatarID])
+                                                     //let cubeName = self.GUID();
                                                    // vwf_view.kernel.callMethod(vwf.application(), "createFloor")
                                                 }
+                                               
+                                                   
+                                                
                                             }),
                                             self.widgets.gridListItem({
                                                 imgSrc: "vwf/view/lib/images/ui/icons/camera_offset.png",
                                                 title: 'Camera with view offset',
                                                 styleClass: "createListItem",
                                                 onclickfunc: function(){
+                                                    let avatarID = 'avatar-' + vwf.moniker_;
+                                                    //let cubeName = self.GUID();
+                                                    vwf_view.kernel.callMethod(vwf.application(), "createCameraWithOffset", [null, null, avatarID])
                                                     //let cubeName = self.GUID();
                                                    // vwf_view.kernel.callMethod(vwf.application(), "createFloor")
                                                 }
@@ -1312,7 +1321,7 @@ define([
         var continuousSlider = new mdc.slider.MDCSlider(myEl);
         this._comp = continuousSlider;
         continuousSlider.listen('MDCSlider:input', function(e) {
-            console.log(continuousSlider.value)
+           // console.log(continuousSlider.value)
             let myEl = e.currentTarget;
            // let prop = myEl._prop.body;
             //document.querySelector('#propAceEditor').env.editor.setValue(prop);
@@ -1321,7 +1330,7 @@ define([
          
         });
         continuousSlider.listen('MDCSlider:change', function(e) {
-          console.log(continuousSlider.value);
+          //console.log(continuousSlider.value);
           let myEl = e.currentTarget;
          // let prop = myEl._prop.body;
           //document.querySelector('#propAceEditor').env.editor.setValue(prop);

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

@@ -290,6 +290,56 @@ this.lightProto = function (lightType) {
     return node
 }
 
+this.cameraProto = function () {
+
+    let newNode = this.cubeProto();
+    newNode.properties.width = 0.3;
+    newNode.properties.height = 0.3;
+    newNode.properties.depth= 0.5;
+    newNode.children.material.properties.opacity = 0.5;
+    newNode.children.material.properties.color = "red";
+
+    newNode.children.camera = {
+        "extends": "http://vwf.example.com/aframe/acamera.vwf",
+        "properties": {
+            "look-controls-enabled": false,
+            "wasd-controls-enabled": false,
+            "user-height": 0
+        }
+    }
+
+    return newNode
+}
+
+this.cameraProtoWithOffset = function () {
+
+    let newNode = this.cubeProto();
+    newNode.properties.width = 0.3;
+    newNode.properties.height = 0.3;
+    newNode.properties.depth= 0.5;
+    newNode.children.material.properties.opacity = 0.5;
+    newNode.children.material.properties.color = "red";
+
+    newNode.children.camera = {
+        "extends": "http://vwf.example.com/aframe/acamera.vwf",
+        "properties": {
+            "look-controls-enabled": false,
+            "wasd-controls-enabled": false,
+            "user-height": 0
+        },
+        children: {
+            viewoffset: {
+                extends: "http://vwf.example.com/aframe/viewOffsetCamera-component.vwf",
+                properties: {
+                }
+            }
+           
+        }
+}
+
+    return newNode
+}
+
 this.planeProto = function () {
 
     let node = {
@@ -537,12 +587,83 @@ this.createPrimitive = function (type, params, name, node, avatar) {
     if (newNode) {
         newNode.properties.position = position;
         this.children.create(nodeName, newNode, function( child ) {
-            if (avatar)child.lookAt(self.children[avatar].worldPosition)
+            if (avatar) child.lookAt(self.children[avatar].worldPosition);
           });
     }
 
 }
 
+this.createCamera = function (name, node, avatar) {
+
+    var position = "0 0 0";
+
+    var nodeName = name;
+    if (!nodeName) {
+        nodeName = this.GUID();
+    }
+
+    if (avatar) {
+
+        let myAvatar = this.children[avatar];
+        let cursorNode = myAvatar.avatarNode.myHead.myCursor.vis;
+
+        if (cursorNode) {
+            position = cursorNode.worldPosition;
+            //console.log(position);
+        }
+
+    }
+
+    var newNode = this.cameraProto();
+    newNode.properties.displayName = "camera";
+
+    var self = this;
+
+    if (newNode) {
+        newNode.properties.position = position;
+        this.children.create(nodeName, newNode, function( child ) {
+            if (avatar) child.lookAt(self.children[avatar].worldPosition);
+          });
+    }
+
+}
+
+this.createCameraWithOffset = function (name, node, avatar) {
+
+    var position = "0 0 0";
+
+    var nodeName = name;
+    if (!nodeName) {
+        nodeName = this.GUID();
+    }
+
+    if (avatar) {
+
+        let myAvatar = this.children[avatar];
+        let cursorNode = myAvatar.avatarNode.myHead.myCursor.vis;
+
+        if (cursorNode) {
+            position = cursorNode.worldPosition;
+            //console.log(position);
+        }
+
+    }
+
+    var newNode = this.cameraProtoWithOffset();
+    newNode.properties.displayName = "cameraWithOffset";
+
+    var self = this;
+
+    if (newNode) {
+        newNode.properties.position = position;
+        this.children.create(nodeName, newNode, function( child ) {
+            if (avatar) child.lookAt(self.children[avatar].worldPosition);
+          });
+    }
+
+}
+
+
 this.createImage = function (imgSrc, name, node, avatar) {
 
     var self = this;

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

@@ -65,6 +65,16 @@ methods:
       - name
       - node
       - avatar
+  createCamera:
+    parameters:
+      - name
+      - node
+      - avatar
+  createCameraWithOffset:
+    parameters:
+      - name
+      - node
+      - avatar
   deleteNode:
     parameters:
       - nodeName