aframe.js 49 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338
  1. "use strict";
  2. // VWF & A-Frame model driver
  3. // Copyright 2017 Krestianstvo.org project
  4. //
  5. // Copyright 2012 United States Government, as represented by the Secretary of Defense, Under
  6. // Secretary of Defense (Personnel & Readiness).
  7. //
  8. // Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except
  9. // in compliance with the License. You may obtain a copy of the License at
  10. //
  11. // http://www.apache.org/licenses/LICENSE-2.0
  12. //
  13. // Unless required by applicable law or agreed to in writing, software distributed under the License
  14. // is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
  15. // or implied. See the License for the specific language governing permissions and limitations under
  16. // the License.
  17. /// vwf/model/scenejs.js is a placeholder for a 3-D scene manager.
  18. ///
  19. /// @module vwf/model/aframe
  20. /// @requires vwf/model
  21. define(["module", "vwf/model", "vwf/utility"], function (module, model, utility) {
  22. var self;
  23. return model.load(module, {
  24. // == Module Definition ====================================================================
  25. // -- initialize ---------------------------------------------------------------------------
  26. initialize: function () {
  27. self = this;
  28. this.state = {
  29. nodes: {},
  30. scenes: {},
  31. prototypes: {},
  32. createLocalNode: function (nodeID, childID, childExtendsID, childImplementsIDs,
  33. childSource, childType, childIndex, childName, callback) {
  34. return {
  35. "parentID": nodeID,
  36. "ID": childID,
  37. "extendsID": childExtendsID,
  38. "implementsIDs": childImplementsIDs,
  39. "source": childSource,
  40. "type": childType,
  41. "name": childName,
  42. "prototypes": undefined,
  43. "aframeObj": undefined,
  44. "scene": undefined,
  45. "componentName": undefined,
  46. "events": {
  47. "clickable": false
  48. }
  49. };
  50. },
  51. isAFrameClass: function (prototypes, classID) {
  52. if (prototypes) {
  53. for (var i = 0; i < prototypes.length; i++) {
  54. if (prototypes[i] === classID) {
  55. //console.info( "prototypes[ i ]: " + prototypes[ i ] );
  56. return true;
  57. }
  58. }
  59. }
  60. return false;
  61. },
  62. isAFrameComponent: function (prototypes) {
  63. var found = false;
  64. if (prototypes) {
  65. for (var i = 0; i < prototypes.length && !found; i++) {
  66. found = (prototypes[i] === "http://vwf.example.com/aframe/node.vwf");
  67. }
  68. }
  69. return found;
  70. },
  71. setAFrameProperty: function (propertyName, propertyValue, aframeObject) {
  72. //console.log(propertyValue);
  73. if (propertyValue.hasOwnProperty('x')) {
  74. aframeObject.setAttribute(propertyName, propertyValue)
  75. } else
  76. if (Array.isArray(propertyValue)) {
  77. aframeObject.setAttribute(propertyName, { x: propertyValue[0], y: propertyValue[1], z: propertyValue[2] })
  78. } else if (typeof propertyValue === 'string') {
  79. aframeObject.setAttribute(propertyName, AFRAME.utils.coordinates.parse(propertyValue))
  80. }
  81. }
  82. };
  83. this.state.kernel = this.kernel.kernel.kernel;
  84. this.aframeDef = {
  85. 'A-BOX': [
  86. 'ambient-occlusion-map', 'ambient-occlusion-map-intensity',
  87. 'ambient-occlusion-texture-offset', 'ambient-occlusion-texture-repeat',
  88. 'color', 'depth', 'displacement-bias', 'displacement-map',
  89. 'displacement-scale', 'displacement-texture-offset',
  90. 'displacement-texture-repeat', 'env-map',
  91. 'fog', 'height', 'metalness',
  92. 'normal-map', 'normal-scale',
  93. 'normal-texture-offset', 'normal-texture-repeat',
  94. 'repeat', 'roughness', 'segments-depth',
  95. 'segments-height', 'segments-width',
  96. 'spherical-env-map', 'src', 'width',
  97. 'wireframe', 'wireframe-linewidth'],
  98. 'A-SPHERE': [
  99. 'ambient-occlusion-map', 'ambient-occlusion-map-intensity',
  100. 'ambient-occlusion-texture-offset', 'ambient-occlusion-texture-repeat',
  101. 'color', 'displacement-bias', 'displacement-map',
  102. 'displacement-scale', 'displacement-texture-offset',
  103. 'displacement-texture-repeat', 'env-map',
  104. 'fog', 'height', 'metalness',
  105. 'normal-map', 'normal-scale',
  106. 'normal-texture-offset', 'normal-texture-repeat',
  107. 'phi-length', 'phi-start', 'radius',
  108. 'repeat', 'roughness', 'segments-depth',
  109. 'segments-height', 'segments-width',
  110. 'spherical-env-map', 'src',
  111. 'theta-length', 'theta-start',
  112. 'width', 'wireframe', 'wireframe-linewidth'
  113. ],
  114. 'A-PLANE': [
  115. 'ambient-occlusion-map', 'ambient-occlusion-map-intensity',
  116. 'ambient-occlusion-texture-offset', 'ambient-occlusion-texture-repeat',
  117. 'color', 'displacement-bias', 'displacement-map',
  118. 'displacement-scale', 'displacement-texture-offset',
  119. 'displacement-texture-repeat', 'env-map',
  120. 'fog', 'height', 'metalness',
  121. 'normal-map', 'normal-scale',
  122. 'normal-texture-offset', 'normal-texture-repeat',
  123. 'repeat', 'roughness',
  124. 'segments-height', 'segments-width',
  125. 'spherical-env-map', 'src', 'width',
  126. 'wireframe', 'wireframe-linewidth'
  127. ],
  128. 'A-TEXT': [
  129. 'align', 'alpha-test', 'anchor',
  130. 'baseline', 'color', 'font',
  131. 'font-image', 'height',
  132. 'letter-spacing', 'line-height',
  133. 'opacity', 'shader',
  134. 'side', 'tab-size',
  135. 'transparent', 'value',
  136. 'white-space', 'width',
  137. 'wrap-count', 'wrap-pixels',
  138. 'z-offset'
  139. ],
  140. 'A-SKY': [
  141. 'color', 'metalness', 'opacity',
  142. 'phi-length', 'phi-start', 'radius',
  143. 'repeat', 'roughness', 'segments-height',
  144. 'segments-width', 'shader',
  145. 'side', 'src',
  146. 'theta-length', 'theta-start',
  147. 'transparent'
  148. ],
  149. 'A-LIGHT': [
  150. 'angle', 'color', 'decay', 'distance',
  151. 'ground-color', 'intensity', 'penumbra',
  152. 'type', 'target'
  153. ]
  154. }
  155. },
  156. // == Model API ============================================================================
  157. // -- creatingNode -------------------------------------------------------------------------
  158. creatingNode: function (nodeID, childID, childExtendsID, childImplementsIDs,
  159. childSource, childType, childIndex, childName, callback /* ( ready ) */) {
  160. // If the parent nodeID is 0, this node is attached directly to the root and is therefore either
  161. // the scene or a prototype. In either of those cases, save the uri of the new node
  162. var childURI = (nodeID === 0 ? childIndex : undefined);
  163. var appID = this.kernel.application();
  164. // If the node being created is a prototype, construct it and add it to the array of prototypes,
  165. // and then return
  166. var prototypeID = utility.ifPrototypeGetId(appID, this.state.prototypes, nodeID, childID);
  167. if (prototypeID !== undefined) {
  168. this.state.prototypes[prototypeID] = {
  169. parentID: nodeID,
  170. ID: childID,
  171. extendsID: childExtendsID,
  172. implementsID: childImplementsIDs,
  173. source: childSource,
  174. type: childType,
  175. name: childName
  176. };
  177. return;
  178. }
  179. var protos = getPrototypes(this.kernel, childExtendsID);
  180. //var kernel = this.kernel.kernel.kernel;
  181. var node;
  182. if (this.state.isAFrameComponent(protos)) {
  183. // Create the local copy of the node properties
  184. if (this.state.nodes[childID] === undefined) {
  185. this.state.nodes[childID] = this.state.createLocalNode(nodeID, childID, childExtendsID, childImplementsIDs,
  186. childSource, childType, childIndex, childName, callback);
  187. }
  188. node = this.state.nodes[childID];
  189. node.prototypes = protos;
  190. // if (childType == "component") {
  191. // if (nodeID !== undefined) {
  192. // node.aframeObj = setAFrameObjectComponents(node);
  193. // addNodeToHierarchy(node);
  194. // }
  195. // } else {
  196. node.aframeObj = createAFrameObject(node);
  197. addNodeToHierarchy(node);
  198. //notifyDriverOfPrototypeAndBehaviorProps();
  199. // }
  200. //addNodeToHierarchy(node);
  201. }
  202. },
  203. // initializingNode: function( nodeID, childID, childExtendsID, childImplementsIDs,
  204. // childSource, childType, childIndex, childName ) {
  205. // var node = this.state.nodes[childID];
  206. // if ( node && childType == "component" ) {
  207. // }
  208. // },
  209. // -- initializingProperty -----------------------------------------------------------------
  210. initializingProperty: function (nodeID, propertyName, propertyValue) {
  211. var value = undefined;
  212. var node = this.state.nodes[nodeID];
  213. if (node !== undefined) {
  214. value = this.settingProperty(nodeID, propertyName, propertyValue);
  215. }
  216. return value;
  217. },
  218. // -- creatingProperty ---------------------------------------------------------------------
  219. creatingProperty: function (nodeID, propertyName, propertyValue) {
  220. return this.initializingProperty(nodeID, propertyName, propertyValue);
  221. },
  222. // -- deletingNode -------------------------------------------------------------------------
  223. //deletingNode: function( nodeID ) {
  224. //},
  225. // -- deletingNode -------------------------------------------------------------------------
  226. deletingNode: function (nodeID) {
  227. if (nodeID) {
  228. var childNode = this.state.nodes[nodeID];
  229. if (!childNode) return;
  230. if (childNode !== undefined) {
  231. if (childNode.children) {
  232. for (var i = 0; i < childNode.children.length; i++) {
  233. this.deletingNode(childNode.children[i]);
  234. }
  235. }
  236. if (childNode.aframeObj !== undefined) {
  237. // removes and destroys object
  238. childNode.aframeObj.parentNode.removeChild(childNode.aframeObj);
  239. childNode.aframeObj = undefined;
  240. }
  241. delete this.state.nodes[nodeID];
  242. }
  243. }
  244. },
  245. // -- settingProperty ----------------------------------------------------------------------
  246. settingProperty: function (nodeID, propertyName, propertyValue) {
  247. var node = this.state.nodes[nodeID];
  248. var value = undefined;
  249. // if (node.componentName == 'line') {
  250. // console.log(node.aframeObj);
  251. // }
  252. if (node && node.aframeObj && utility.validObject(propertyValue)) {
  253. var aframeObject = node.aframeObj;
  254. if (isNodeDefinition(node.prototypes)) {
  255. // 'id' will be set to the nodeID
  256. value = propertyValue;
  257. switch (propertyName) {
  258. default:
  259. value = undefined;
  260. break;
  261. }
  262. }
  263. if (value === undefined && isAEntityDefinition(node.prototypes)) {
  264. value = propertyValue;
  265. switch (propertyName) {
  266. case "worldPosition":
  267. break;
  268. case "position":
  269. this.state.setAFrameProperty('position', propertyValue, aframeObject);
  270. break;
  271. case "rotation":
  272. this.state.setAFrameProperty('rotation', propertyValue, aframeObject);
  273. break;
  274. case "scale":
  275. this.state.setAFrameProperty('scale', propertyValue, aframeObject);
  276. break;
  277. case "clickable":
  278. if (propertyValue) {
  279. aframeObject.setAttribute('class', 'intersectable');
  280. } else {
  281. aframeObject.setAttribute('class', 'nonintersectable');
  282. }
  283. node.events.clickable = propertyValue;
  284. break;
  285. case "visible":
  286. aframeObject.setAttribute('visible', propertyValue);
  287. break;
  288. // case "clickable":
  289. // console.log("set clickable!");
  290. // value = propertyValue;
  291. // break;
  292. // case "clickable":
  293. // if (propertyValue) {
  294. // aframeObject.addEventListener('click', function (evt) {
  295. // console.log("click!");
  296. // vwf_view.kernel.fireEvent(node.ID, "clickEvent",evt.detail.cursorEl.id);
  297. // });
  298. // }
  299. // break;
  300. // case "look-controls-enabled":
  301. // aframeObject.setAttribute('look-controls', 'enabled', propertyValue);
  302. // break;
  303. case "wasd-controls":
  304. aframeObject.setAttribute('wasd-controls', 'enabled', propertyValue);
  305. break;
  306. default:
  307. value = undefined;
  308. break;
  309. }
  310. }
  311. if (value === undefined && aframeObject.nodeName == "A-ASSET-ITEM") {
  312. value = propertyValue;
  313. switch (propertyName) {
  314. case "itemID":
  315. aframeObject.setAttribute('id', propertyValue);
  316. break;
  317. case "itemSrc":
  318. aframeObject.setAttribute('src', propertyValue);
  319. break;
  320. default:
  321. value = undefined;
  322. break;
  323. }
  324. }
  325. if (value === undefined && aframeObject.nodeName == "IMG") {
  326. value = propertyValue;
  327. switch (propertyName) {
  328. case "itemID":
  329. aframeObject.setAttribute('id', propertyValue);
  330. break;
  331. case "itemSrc":
  332. aframeObject.setAttribute('src', propertyValue);
  333. break;
  334. default:
  335. value = undefined;
  336. break;
  337. }
  338. }
  339. if (value === undefined && aframeObject.nodeName == "AUDIO") {
  340. value = propertyValue;
  341. switch (propertyName) {
  342. case "itemID":
  343. aframeObject.setAttribute('id', propertyValue);
  344. break;
  345. case "itemSrc":
  346. aframeObject.setAttribute('src', propertyValue);
  347. break;
  348. default:
  349. value = undefined;
  350. break;
  351. }
  352. }
  353. if (value === undefined && aframeObject.nodeName == "A-SKY") {
  354. value = propertyValue;
  355. self.aframeDef['A-SKY'].forEach(element => {
  356. element == propertyName ? aframeObject.setAttribute(element, propertyValue) :
  357. value = undefined;
  358. })
  359. }
  360. if (value === undefined && aframeObject.nodeName == "A-TEXT") {
  361. value = propertyValue;
  362. self.aframeDef['A-TEXT'].forEach(element => {
  363. element == propertyName ? aframeObject.setAttribute(element, propertyValue) :
  364. value = undefined;
  365. })
  366. }
  367. if (value === undefined && aframeObject.nodeName == "A-SCENE") {
  368. value = propertyValue;
  369. switch (propertyName) {
  370. case "color":
  371. aframeObject.setAttribute('background', {'color': propertyValue} );
  372. break;
  373. case "transparent":
  374. aframeObject.setAttribute('background', {'transparent': propertyValue} );
  375. break;
  376. // case "fog":
  377. // aframeObject.setAttribute('fog', propertyValue);
  378. // break;
  379. case "assets":
  380. let assetsEl = document.querySelector('a-assets');
  381. if (!assetsEl) {
  382. let newAssetsEl = document.createElement('a-assets');
  383. aframeObject.appendChild(newAssetsEl);
  384. }
  385. var assetsElement = document.querySelector('a-assets');
  386. if (propertyValue) {
  387. httpGetJson(propertyValue).then(function (response) {
  388. console.log(JSON.parse(response));
  389. let assets = JSON.parse(response);
  390. for (var prop in assets) {
  391. var elm = document.createElement(assets[prop].tag);
  392. elm.setAttribute('id', prop);
  393. elm.setAttribute('src', assets[prop].src);
  394. assetsElement.appendChild(elm);
  395. }
  396. }).catch(function (error) {
  397. console.log(error);
  398. });
  399. }
  400. break;
  401. default:
  402. value = undefined;
  403. break;
  404. }
  405. }
  406. if (value === undefined && aframeObject.nodeName == "A-BOX") {
  407. value = propertyValue;
  408. self.aframeDef['A-BOX'].forEach(element => {
  409. element == propertyName ? aframeObject.setAttribute(element, propertyValue) :
  410. value = undefined;
  411. })
  412. }
  413. if (value === undefined && aframeObject.nodeName == "A-LIGHT") {
  414. value = propertyValue;
  415. self.aframeDef['A-LIGHT'].forEach(element => {
  416. element == propertyName ? aframeObject.setAttribute(element, propertyValue) :
  417. value = undefined;
  418. })
  419. switch (propertyName) {
  420. case "castShadow":
  421. aframeObject.setAttribute('light', 'castShadow', propertyValue);
  422. break;
  423. case "shadowCameraVisible":
  424. aframeObject.setAttribute('light', 'shadowCameraVisible', propertyValue);
  425. break;
  426. default:
  427. value = undefined;
  428. break;
  429. }
  430. }
  431. if (value === undefined && aframeObject.nodeName == "A-GLTF-MODEL") {
  432. value = propertyValue;
  433. switch (propertyName) {
  434. case "src":
  435. aframeObject.setAttribute('src', propertyValue);
  436. break;
  437. default:
  438. value = undefined;
  439. break;
  440. }
  441. }
  442. if (value === undefined && aframeObject.nodeName == "A-COLLADA-MODEL") {
  443. value = propertyValue;
  444. switch (propertyName) {
  445. case "src":
  446. aframeObject.setAttribute('src', propertyValue);
  447. break;
  448. default:
  449. value = undefined;
  450. break;
  451. }
  452. }
  453. if (value === undefined && aframeObject.nodeName == "A-OBJ-MODEL") {
  454. value = propertyValue;
  455. switch (propertyName) {
  456. case "src":
  457. aframeObject.setAttribute('src', propertyValue);
  458. break;
  459. case "mtl":
  460. aframeObject.setAttribute('mtl', propertyValue);
  461. break;
  462. default:
  463. value = undefined;
  464. break;
  465. }
  466. }
  467. if (value === undefined && aframeObject.nodeName == "A-SOUND") {
  468. value = propertyValue;
  469. switch (propertyName) {
  470. case "src":
  471. aframeObject.setAttribute('src', propertyValue);
  472. break;
  473. case "on":
  474. aframeObject.setAttribute('on', propertyValue);
  475. break;
  476. case "autoplay":
  477. aframeObject.setAttribute('autoplay', propertyValue);
  478. break;
  479. default:
  480. value = undefined;
  481. break;
  482. }
  483. }
  484. if (value === undefined && aframeObject.nodeName == "A-PLANE") {
  485. value = propertyValue;
  486. self.aframeDef['A-PLANE'].forEach(element => {
  487. element == propertyName ? aframeObject.setAttribute(element, propertyValue) :
  488. value = undefined;
  489. })
  490. }
  491. if (value === undefined && aframeObject.nodeName == "A-SPHERE") {
  492. value = propertyValue;
  493. self.aframeDef['A-SPHERE'].forEach(element => {
  494. element == propertyName ? aframeObject.setAttribute(element, propertyValue) :
  495. value = undefined;
  496. })
  497. }
  498. if (value === undefined && aframeObject.nodeName == "A-ANIMATION") {
  499. value = propertyValue;
  500. switch (propertyName) {
  501. // attribute:
  502. // dur:
  503. // from:
  504. // to:
  505. // repeat:
  506. case "dur":
  507. aframeObject.setAttribute('dur', propertyValue);
  508. break;
  509. case "from":
  510. aframeObject.setAttribute('from', propertyValue);
  511. break;
  512. case "to":
  513. aframeObject.setAttribute('to', propertyValue);
  514. break;
  515. case "repeat":
  516. aframeObject.setAttribute('repeat', propertyValue);
  517. break;
  518. case "attribute":
  519. aframeObject.setAttribute('attribute', propertyValue);
  520. break;
  521. case "begin":
  522. aframeObject.setAttribute('begin', propertyValue);
  523. break;
  524. default:
  525. value = undefined;
  526. break;
  527. }
  528. }
  529. if (value === undefined && aframeObject.nodeName == "A-CAMERA") {
  530. value = propertyValue;
  531. switch (propertyName) {
  532. case "user-height":
  533. aframeObject.setAttribute('user-height', propertyValue);
  534. break;
  535. case "look-controls-enabled":
  536. aframeObject.setAttribute('look-controls-enabled', propertyValue);
  537. break;
  538. case "wasd-controls-enabled":
  539. aframeObject.setAttribute('wasd-controls-enabled', propertyValue);
  540. break;
  541. // case "active":
  542. // aframeObject.setAttribute('camera', 'active', propertyValue);
  543. // break;
  544. default:
  545. value = undefined;
  546. break;
  547. }
  548. }
  549. if (value === undefined && aframeObject.nodeName == "A-SUN-SKY") {
  550. value = propertyValue;
  551. switch (propertyName) {
  552. case "sunPosition":
  553. aframeObject.setAttribute('material', 'sunPosition', propertyValue);
  554. break;
  555. // case "active":
  556. // aframeObject.setAttribute('camera', 'active', propertyValue);
  557. // break;
  558. default:
  559. value = undefined;
  560. break;
  561. }
  562. }
  563. }
  564. return value;
  565. },
  566. // -- gettingProperty ----------------------------------------------------------------------
  567. gettingProperty: function (nodeID, propertyName, propertyValue) {
  568. var node = this.state.nodes[nodeID];
  569. var value = undefined;
  570. if (node && node.aframeObj) {
  571. var aframeObject = node.aframeObj;
  572. if (isNodeDefinition(node.prototypes)) {
  573. switch (propertyName) {
  574. }
  575. }
  576. if (value === undefined && isAEntityDefinition(node.prototypes)) {
  577. switch (propertyName) {
  578. case "worldPosition":
  579. var pos = aframeObject.object3D.getWorldPosition();
  580. if (pos !== undefined) {
  581. value = pos;
  582. }
  583. break;
  584. case "position":
  585. var pos = aframeObject.getAttribute('position');
  586. if (pos !== undefined) {
  587. value = pos//[pos.x, pos.y, pos.z]//AFRAME.utils.coordinates.stringify(pos);
  588. }
  589. break;
  590. case "scale":
  591. var scale = aframeObject.getAttribute('scale');
  592. if (scale !== undefined) {
  593. value = scale//AFRAME.utils.coordinates.stringify(scale);
  594. }
  595. break;
  596. case "rotation":
  597. var rot = aframeObject.getAttribute('rotation');
  598. if (rot !== undefined) {
  599. value = rot//AFRAME.utils.coordinates.stringify(rot);
  600. }
  601. break;
  602. case "clickable":
  603. value = node.events.clickable;
  604. break;
  605. // case "look-controls-enabled":
  606. // var look = aframeObject.getAttribute('look-controls-enabled');
  607. // if (look !== null && look !== undefined) {
  608. // value = aframeObject.getAttribute('look-controls').enabled;
  609. // }
  610. // break;
  611. // case "wasd-controls":
  612. // var wasd = aframeObject.getAttribute('wasd-controls');
  613. // if (wasd !== null && wasd !== undefined) {
  614. // value = aframeObject.getAttribute('wasd-controls').enabled;
  615. // }
  616. // break;
  617. case "visible":
  618. value = aframeObject.getAttribute('visible');
  619. break;
  620. }
  621. }
  622. if (value === undefined && aframeObject.nodeName == "A-ASSET-ITEM") {
  623. switch (propertyName) {
  624. case "itemID":
  625. value = aframeObject.getAttribute('id');
  626. break;
  627. case "itemSrc":
  628. value = aframeObject.getAttribute('src');
  629. break;
  630. }
  631. }
  632. if (value === undefined && aframeObject.nodeName == "IMG") {
  633. switch (propertyName) {
  634. case "itemID":
  635. value = aframeObject.getAttribute('id');
  636. break;
  637. case "itemSrc":
  638. value = aframeObject.getAttribute('src');
  639. break;
  640. }
  641. }
  642. if (value === undefined && aframeObject.nodeName == "AUDIO") {
  643. switch (propertyName) {
  644. case "itemID":
  645. value = aframeObject.getAttribute('id');
  646. break;
  647. case "itemSrc":
  648. value = aframeObject.getAttribute('src');
  649. break;
  650. }
  651. }
  652. if (value === undefined && aframeObject.nodeName == "A-SCENE") {
  653. switch (propertyName) {
  654. // case "fog":
  655. // value = aframeObject.getAttribute('fog');
  656. // break;
  657. case "color":
  658. if (aframeObject.getAttribute('background')) {
  659. value = aframeObject.getAttribute('background').color;
  660. }
  661. break;
  662. case "transparent":
  663. if (aframeObject.getAttribute('background')) {
  664. value = aframeObject.getAttribute('background').transparent;
  665. }
  666. break;
  667. }
  668. }
  669. if (value === undefined && aframeObject.nodeName == "A-SKY") {
  670. self.aframeDef['A-SKY'].forEach(element => {
  671. if (element == propertyName) {
  672. value = aframeObject.getAttribute(element);
  673. }
  674. })
  675. }
  676. if (value === undefined && aframeObject.nodeName == "A-LIGHT") {
  677. self.aframeDef['A-LIGHT'].forEach(element => {
  678. if (element == propertyName) {
  679. value = aframeObject.getAttribute(element);
  680. }
  681. })
  682. switch (propertyName) {
  683. case "castShadow":
  684. value = aframeObject.getAttribute('light').castShadow;
  685. break;
  686. case "shadowCameraVisible":
  687. value = aframeObject.getAttribute('light').shadowCameraVisible;
  688. break;
  689. }
  690. }
  691. if (value === undefined && aframeObject.nodeName == "A-BOX") {
  692. self.aframeDef['A-BOX'].forEach(element => {
  693. if (element == propertyName) {
  694. value = aframeObject.getAttribute(element);
  695. }
  696. })
  697. }
  698. if (value === undefined && aframeObject.nodeName == "A-PLANE") {
  699. self.aframeDef['A-PLANE'].forEach(element => {
  700. if (element == propertyName) {
  701. value = aframeObject.getAttribute(element);
  702. }
  703. })
  704. }
  705. if (value === undefined && aframeObject.nodeName == "A-SPHERE") {
  706. self.aframeDef['A-SPHERE'].forEach(element => {
  707. if (element == propertyName) {
  708. value = aframeObject.getAttribute(element);
  709. }
  710. })
  711. }
  712. if (value === undefined && aframeObject.nodeName == "A-TEXT") {
  713. self.aframeDef['A-TEXT'].forEach(element => {
  714. if (element == propertyName) {
  715. value = aframeObject.getAttribute(element);
  716. }
  717. })
  718. }
  719. if (value === undefined && aframeObject.nodeName == "A-ANIMATION") {
  720. switch (propertyName) {
  721. case "attribute":
  722. value = aframeObject.getAttribute('attribute');
  723. break;
  724. case "dur":
  725. value = aframeObject.getAttribute('dur');
  726. break;
  727. case "from":
  728. value = aframeObject.getAttribute('from');
  729. break;
  730. case "to":
  731. value = aframeObject.getAttribute('to');
  732. break;
  733. case "repeat":
  734. value = aframeObject.getAttribute('repeat');
  735. break;
  736. case "begin":
  737. value = aframeObject.getAttribute('begin');
  738. break;
  739. }
  740. }
  741. if (value === undefined && aframeObject.nodeName == "A-CAMERA") {
  742. switch (propertyName) {
  743. case "user-height":
  744. value = aframeObject.getAttribute('user-height');
  745. break;
  746. case "look-controls-enabled":
  747. value = aframeObject.getAttribute('look-controls-enabled');
  748. break;
  749. case "wasd-controls-enabled":
  750. value = aframeObject.getAttribute('wasd-controls-enabled');
  751. break;
  752. }
  753. // switch (propertyName) {
  754. // case "active":
  755. // value = aframeObject.getAttribute('camera').active;
  756. // break;
  757. // }
  758. }
  759. if (value === undefined && aframeObject.nodeName == "A-SUN-SKY") {
  760. switch (propertyName) {
  761. case "sunPosition":
  762. value = aframeObject.getAttribute('material').sunPosition;
  763. break;
  764. }
  765. // switch (propertyName) {
  766. // case "active":
  767. // value = aframeObject.getAttribute('camera').active;
  768. // break;
  769. // }
  770. }
  771. if (value === undefined && aframeObject.nodeName == "A-COLLADA-MODEL") {
  772. switch (propertyName) {
  773. case "src":
  774. value = aframeObject.getAttribute('src');
  775. break;
  776. }
  777. }
  778. if (value === undefined && aframeObject.nodeName == "A-OBJ-MODEL") {
  779. switch (propertyName) {
  780. case "src":
  781. value = aframeObject.getAttribute('src');
  782. break;
  783. case "mtl":
  784. value = aframeObject.getAttribute('mtl');
  785. break;
  786. }
  787. }
  788. if (value === undefined && aframeObject.nodeName == "A-SOUND") {
  789. switch (propertyName) {
  790. case "src":
  791. value = aframeObject.getAttribute('src');
  792. break;
  793. case "on":
  794. value = aframeObject.getAttribute('on');
  795. break;
  796. case "autoplay":
  797. value = aframeObject.getAttribute('autoplay');
  798. break;
  799. }
  800. }
  801. if (value === undefined && aframeObject.nodeName == "A-GLTF-MODEL") {
  802. switch (propertyName) {
  803. case "src":
  804. value = aframeObject.getAttribute('src');
  805. break;
  806. }
  807. }
  808. }
  809. if (value !== undefined) {
  810. propertyValue = value;
  811. }
  812. return value;
  813. }
  814. });
  815. function createAFrameObject(node, config) {
  816. var protos = node.prototypes;
  817. var aframeObj = undefined;
  818. if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/ascene.vwf")) {
  819. aframeObj = document.createElement('a-scene');
  820. let assetsElement = document.createElement('a-assets');
  821. aframeObj.appendChild(assetsElement);
  822. self.state.scenes[node.ID] = aframeObj;
  823. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/a-asset-item.vwf")) {
  824. let assets = document.querySelector('a-assets');
  825. if (assets){
  826. aframeObj = document.createElement('a-asset-item');
  827. aframeObj.setAttribute('id', "item-"+GUID());
  828. aframeObj.setAttribute('src', "");
  829. aframeObj.setAttribute('crossorigin', "anonymous");
  830. assets.appendChild(aframeObj);
  831. }
  832. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/a-asset-image-item.vwf")) {
  833. let assets = document.querySelector('a-assets');
  834. if (assets){
  835. aframeObj = document.createElement('img');
  836. aframeObj.setAttribute('id', "item-"+GUID());
  837. aframeObj.setAttribute('src', "");
  838. aframeObj.setAttribute('crossorigin', "anonymous");
  839. assets.appendChild(aframeObj);
  840. }
  841. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/a-asset-audio-item.vwf")) {
  842. let assets = document.querySelector('a-assets');
  843. if (assets){
  844. aframeObj = document.createElement('audio');
  845. aframeObj.setAttribute('id', "item-"+GUID());
  846. aframeObj.setAttribute('src', "");
  847. aframeObj.setAttribute('crossorigin', "anonymous");
  848. assets.appendChild(aframeObj);
  849. }
  850. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/asky.vwf")) {
  851. aframeObj = document.createElement('a-sky');
  852. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/acamera.vwf")) {
  853. aframeObj = document.createElement('a-camera');
  854. aframeObj.setAttribute('camera', 'active', false);
  855. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/alight.vwf")) {
  856. aframeObj = document.createElement('a-light');
  857. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/acursor.vwf")) {
  858. aframeObj = document.createElement('a-cursor');
  859. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/a-sun-sky.vwf")) {
  860. aframeObj = document.createElement('a-sun-sky');
  861. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/abox.vwf")) {
  862. aframeObj = document.createElement('a-box');
  863. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/aplane.vwf")) {
  864. aframeObj = document.createElement('a-plane');
  865. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/atext.vwf")) {
  866. aframeObj = document.createElement('a-text');
  867. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/acolladamodel.vwf")) {
  868. aframeObj = document.createElement('a-collada-model');
  869. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/aobjmodel.vwf")) {
  870. aframeObj = document.createElement('a-obj-model');
  871. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/asound.vwf")) {
  872. aframeObj = document.createElement('a-sound');
  873. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/agltfmodel.vwf")) {
  874. aframeObj = document.createElement('a-gltf-model');
  875. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/asphere.vwf")) {
  876. aframeObj = document.createElement('a-sphere');
  877. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/aanimation.vwf")) {
  878. aframeObj = document.createElement('a-animation');
  879. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/aentity.vwf")) {
  880. aframeObj = document.createElement('a-entity');
  881. }
  882. if (aframeObj.nodeName !== "A-ASSET-ITEM" && aframeObj.nodeName !== "IMG" && aframeObj.nodeName !== "AUIDO"){
  883. aframeObj.setAttribute('id', node.ID);
  884. }
  885. return aframeObj;
  886. }
  887. function addNodeToHierarchy(node) {
  888. if (node.aframeObj) {
  889. if (self.state.nodes[node.parentID] !== undefined) {
  890. var parent = self.state.nodes[node.parentID];
  891. if (parent.aframeObj) {
  892. if (parent.children === undefined) {
  893. parent.children = [];
  894. }
  895. parent.children.push(node.ID);
  896. //console.info( "Adding child: " + childID + " to " + nodeID );
  897. if (node.aframeObj.nodeName !== "A-ASSET-ITEM" && node.aframeObj.nodeName !== "IMG" && node.aframeObj.nodeName !== "AUIDO"){
  898. parent.aframeObj.appendChild(node.aframeObj);
  899. }
  900. }
  901. }
  902. if (node.aframeObj.nodeName !== "A-SCENE") {
  903. node.scene = self.state.scenes[self.kernel.application()];
  904. }
  905. }
  906. }
  907. function getPrototypes(kernel, extendsID) {
  908. var prototypes = [];
  909. var id = extendsID;
  910. while (id !== undefined) {
  911. prototypes.push(id);
  912. id = kernel.prototype(id);
  913. }
  914. return prototypes;
  915. }
  916. function isNodeDefinition(prototypes) {
  917. var found = false;
  918. if (prototypes) {
  919. for (var i = 0; i < prototypes.length && !found; i++) {
  920. found = (prototypes[i] == "http://vwf.example.com/aframe/node.vwf");
  921. }
  922. }
  923. return found;
  924. }
  925. function isAEntityDefinition(prototypes) {
  926. var found = false;
  927. if (prototypes) {
  928. for (var i = 0; i < prototypes.length && !found; i++) {
  929. found = (prototypes[i] == "http://vwf.example.com/aframe/aentity.vwf");
  930. }
  931. }
  932. return found;
  933. }
  934. // Changing this function significantly from the GLGE code
  935. // Will search hierarchy down until encountering a matching child
  936. // Will look into nodes that don't match.... this might not be desirable
  937. function FindChildByName(obj, childName, childType, recursive) {
  938. var child = undefined;
  939. if (recursive) {
  940. // TODO: If the obj itself has the child name, the object will be returned by this function
  941. // I don't think this this desirable.
  942. if (nameTest.call(this, obj, childName)) {
  943. child = obj;
  944. } else if (obj.children && obj.children.length > 0) {
  945. for (var i = 0; i < obj.children.length && child === undefined; i++) {
  946. child = FindChildByName(obj.children[i], childName, childType, true);
  947. }
  948. }
  949. } else {
  950. if (obj.children) {
  951. for (var i = 0; i < obj.children.length && child === undefined; i++) {
  952. if (nameTest.call(this, obj.children[i], childName)) {
  953. child = obj.children[i];
  954. }
  955. }
  956. }
  957. }
  958. return child;
  959. }
  960. function nameTest(obj, name) {
  961. if (obj.name == "") {
  962. return (obj.parent.name + "Child" == name);
  963. } else {
  964. return (obj.name == name || obj.id == name || obj.vwfID == name);
  965. }
  966. }
  967. function httpGet(url) {
  968. return new Promise(function (resolve, reject) {
  969. // do the usual Http request
  970. let request = new XMLHttpRequest();
  971. request.open('GET', url);
  972. request.onload = function () {
  973. if (request.status == 200) {
  974. resolve(request.response);
  975. } else {
  976. reject(Error(request.statusText));
  977. }
  978. };
  979. request.onerror = function () {
  980. reject(Error('Network Error'));
  981. };
  982. request.send();
  983. });
  984. }
  985. async function httpGetJson(url) {
  986. // check if the URL looks like a JSON file and call httpGet.
  987. let regex = /\.(json)$/i;
  988. if (regex.test(url)) {
  989. // call the async function, wait for the result
  990. return await httpGet(url);
  991. } else {
  992. throw Error('Bad Url Format');
  993. }
  994. }
  995. function GUID() {
  996. var S4 = function () {
  997. return Math.floor(
  998. Math.random() * 0x10000 /* 65536 */
  999. ).toString(16);
  1000. };
  1001. return (
  1002. S4() + S4() + "-" +
  1003. S4() + "-" +
  1004. S4() + "-" +
  1005. S4() + "-" +
  1006. S4() + S4() + S4()
  1007. );
  1008. }
  1009. });