appui.js 7.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208
  1. function createApp() {
  2. let self = this
  3. function makeSetter(val) {
  4. let setstr = 'this.' + val + '= value; this.redrawEvent();'
  5. return setstr
  6. }
  7. function getNewPosition() {
  8. //let allChild = vwf.find("","/*")
  9. let cursorVisID = vwf.find("myCursor-avatar-" + vwf.moniker_, "./vis")[0]
  10. let avPos = AFRAME.utils.coordinates.parse(vwf.callMethod(cursorVisID, 'worldPosition'));
  11. let newPos = [avPos.x, avPos.y, avPos.z]
  12. return newPos
  13. }
  14. return {
  15. $cell: true,
  16. $type: "div",
  17. class: "propGrid max-width mdc-layout-grid mdc-layout-grid--align-left",
  18. $components: [
  19. {
  20. $cell: true,
  21. $type: "div",
  22. class: "mdc-layout-grid__inner",
  23. $components: [
  24. {
  25. $cell: true,
  26. $type: "div",
  27. class: "mdc-layout-grid__cell mdc-layout-grid__cell--span-12",
  28. $components: [
  29. // {
  30. // $cell: true,
  31. // $type: "button",
  32. // class: "mdc-button mdc-button--raised",
  33. // $text: "Draw L-System",
  34. // onclick: function (e) {
  35. // let sceneID = vwf.find("","/")[0];
  36. // vwf_view.kernel.callMethod(sceneID, "drawLSys1");
  37. // }
  38. // },
  39. {
  40. $cell: true,
  41. $type: "button",
  42. class: "mdc-button mdc-button--raised",
  43. $text: "Create new turtle",
  44. onclick: function (e) {
  45. let sceneID = vwf.find("", "/")[0];
  46. let turtleID = vwf.find("", "/turtle")[0];
  47. console.log("create new turtle");
  48. let newTurtle = _app.helpers.getNodeDef(turtleID);//vwf.getNode(turtleID, true);
  49. newTurtle.properties.position = getNewPosition();
  50. let randomName = "turtle-new-" + _app.helpers.GUID();
  51. vwf_view.kernel.createChild(sceneID, randomName, newTurtle);
  52. }
  53. }
  54. ]
  55. },
  56. {
  57. $cell: true,
  58. $type: "div",
  59. class: "mdc-layout-grid__cell mdc-layout-grid__cell--span-6",
  60. $components: [
  61. {
  62. $type: "img",
  63. src: "/defaults/assets/lsys/Koch.jpg",
  64. class: "mdc-elevation--z2",
  65. style: "width: 150px",
  66. onclick: function (evt) {
  67. let turtleID = vwf.find("", "/turtle")[0];
  68. let params = {
  69. "angle": 60,
  70. "iteration": 3,
  71. "stepLength": 0.3,
  72. "rule": 'F++F++F',
  73. "axiomF": 'F-F++F-F',
  74. "axiomG": ''
  75. }
  76. vwf_view.kernel.callMethod(turtleID, 'setTurtleParams', [Object.entries(params)])
  77. }
  78. }
  79. ]
  80. },
  81. {
  82. $cell: true,
  83. $type: "div",
  84. class: "mdc-layout-grid__cell mdc-layout-grid__cell--span-6",
  85. $components: [
  86. {
  87. $type: "img",
  88. src: "/defaults/assets/lsys/dragon.jpg",
  89. class: "mdc-elevation--z2",
  90. style: "width: 150px",
  91. onclick: function (evt) {
  92. let turtleID = vwf.find("", "/turtle")[0];
  93. let params = {
  94. "angle": 90,
  95. "iteration": 10,
  96. "stepLength": 0.3,
  97. "rule": 'F',
  98. "axiomF": 'F+G+',
  99. "axiomG": '-F-G'
  100. }
  101. vwf_view.kernel.callMethod(turtleID, 'setTurtleParams', [Object.entries(params)])
  102. }
  103. }
  104. ]
  105. },
  106. {
  107. $cell: true,
  108. $type: "div",
  109. class: "mdc-layout-grid__cell mdc-layout-grid__cell--span-6",
  110. $components: [
  111. {
  112. $type: "img",
  113. src: "/defaults/assets/lsys/SierpinskiCurve.jpg",
  114. class: "mdc-elevation--z2",
  115. style: "width: 150px",
  116. onclick: function (evt) {
  117. let turtleID = vwf.find("", "/turtle")[0];
  118. let params = {
  119. "angle": 60,
  120. "iteration": 5,
  121. "stepLength": 0.3,
  122. "rule": 'F',
  123. "axiomF": 'G-F-G',
  124. "axiomG": 'F+G+F'
  125. }
  126. vwf_view.kernel.callMethod(turtleID, 'setTurtleParams', [Object.entries(params)])
  127. }
  128. }
  129. ]
  130. },
  131. {
  132. $cell: true,
  133. $type: "div",
  134. class: "mdc-layout-grid__cell mdc-layout-grid__cell--span-6",
  135. $components: [
  136. {
  137. $type: "img",
  138. src: "/defaults/assets/lsys/SierpinskiTriangle.jpg",
  139. class: "mdc-elevation--z2",
  140. style: "width: 150px",
  141. onclick: function (evt) {
  142. let turtleID = vwf.find("", "/turtle")[0];
  143. let params = {
  144. "angle": 120,
  145. "iteration": 5,
  146. "stepLength": 0.3,
  147. "rule": 'F--F--F',
  148. "axiomF": 'F--F--F--G',
  149. "axiomG": 'GG'
  150. }
  151. vwf_view.kernel.callMethod(turtleID, 'setTurtleParams', [Object.entries(params)])
  152. }
  153. }
  154. ]
  155. }
  156. ]
  157. }
  158. ]
  159. }
  160. }