frame3D.js 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104
  1. this.initialize = function () {
  2. if (Object.getPrototypeOf(this).id.includes('frame3D.vwf')) {
  3. this.createVisual();
  4. } else {
  5. console.log("Initialize proto..", this.id);
  6. }
  7. }
  8. this.createVisual = function () {
  9. let parent = this.parent;
  10. let visNode = {
  11. "extends": "proxy/aframe/aentity.vwf",
  12. "properties": {},
  13. "children": {
  14. "rotatePlane": {
  15. "extends": "proxy/aframe/aplane.vwf",
  16. "properties": {
  17. "count": 0,
  18. "height": 0.4,
  19. "width": 3,
  20. "class": "clickable intersectable"
  21. },
  22. "children": {
  23. "material": {
  24. "extends": "proxy/aframe/aMaterialComponent.vwf",
  25. "type": "component",
  26. "properties": {
  27. "color": "white",
  28. "side": "double"
  29. //"transparent": true,
  30. //"opacity": 0.6
  31. }
  32. },
  33. "cursor-listener": {
  34. "extends": "proxy/aframe/app-cursor-listener-component.vwf",
  35. "type": "component"
  36. },
  37. "raycaster-listener": {
  38. "extends": "proxy/aframe/app-raycaster-listener-component.vwf",
  39. "type": "component"
  40. }
  41. },
  42. "methods":{
  43. "moveAction":{
  44. "parameters":["point"],
  45. "type": "application/javascript",
  46. "body": `
  47. let contentsID = this.parent.parent.contentsID;
  48. console.log('Start: ', this.dragStart, ' x: ', point.x);
  49. if(contentsID){
  50. let scene = this.getScene();
  51. let contents = scene.findNode(contentsID);
  52. let rotation = contents.rotation.clone();
  53. let offset = this.dragStart ? (point.x - this.dragStart.x)*10 : 0
  54. contents.rotation = [rotation.x, rotation.y+offset, rotation.z]
  55. //contents.rotateBy([0,point.x, 0]);
  56. }
  57. `
  58. },
  59. "triggerdownAction":{
  60. "body": `
  61. this.material.color = 'blue';
  62. this.dragStart = point;
  63. `,
  64. parameters:["point"],
  65. "type": "application/javascript"
  66. },
  67. "triggerupAction":{
  68. "body": `
  69. this.material.color = 'grey';
  70. this.dragStart = {x:0, y:0, z:0};
  71. `,
  72. parameters:["point"],
  73. "type": "application/javascript"
  74. }
  75. }
  76. }
  77. }
  78. }
  79. this.children.create("visualNode", visNode);
  80. }
  81. // this.intersectEventMethod = function () {
  82. // }
  83. // this.clearIntersectEventMethod = function () {
  84. // }