aframe.js 49 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326
  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 (this.state.nodes[nodeID] !== undefined) {
  228. var node = this.state.nodes[nodeID];
  229. if (node.aframeObj !== undefined) {
  230. // removes and destroys object
  231. node.aframeObj.parentNode.removeChild(node.aframeObj);
  232. node.aframeObj = undefined;
  233. }
  234. delete this.state.nodes[nodeID];
  235. }
  236. },
  237. // -- settingProperty ----------------------------------------------------------------------
  238. settingProperty: function (nodeID, propertyName, propertyValue) {
  239. var node = this.state.nodes[nodeID];
  240. var value = undefined;
  241. // if (node.componentName == 'line') {
  242. // console.log(node.aframeObj);
  243. // }
  244. if (node && node.aframeObj && utility.validObject(propertyValue)) {
  245. var aframeObject = node.aframeObj;
  246. if (isNodeDefinition(node.prototypes)) {
  247. // 'id' will be set to the nodeID
  248. value = propertyValue;
  249. switch (propertyName) {
  250. default:
  251. value = undefined;
  252. break;
  253. }
  254. }
  255. if (value === undefined && isAEntityDefinition(node.prototypes)) {
  256. value = propertyValue;
  257. switch (propertyName) {
  258. case "worldPosition":
  259. break;
  260. case "position":
  261. this.state.setAFrameProperty('position', propertyValue, aframeObject);
  262. break;
  263. case "rotation":
  264. this.state.setAFrameProperty('rotation', propertyValue, aframeObject);
  265. break;
  266. case "scale":
  267. this.state.setAFrameProperty('scale', propertyValue, aframeObject);
  268. break;
  269. case "clickable":
  270. if (propertyValue) {
  271. aframeObject.setAttribute('class', 'intersectable');
  272. } else {
  273. aframeObject.setAttribute('class', 'nonintersectable');
  274. }
  275. node.events.clickable = propertyValue;
  276. break;
  277. case "visible":
  278. aframeObject.setAttribute('visible', propertyValue);
  279. break;
  280. // case "clickable":
  281. // console.log("set clickable!");
  282. // value = propertyValue;
  283. // break;
  284. // case "clickable":
  285. // if (propertyValue) {
  286. // aframeObject.addEventListener('click', function (evt) {
  287. // console.log("click!");
  288. // vwf_view.kernel.fireEvent(node.ID, "clickEvent",evt.detail.cursorEl.id);
  289. // });
  290. // }
  291. // break;
  292. // case "look-controls-enabled":
  293. // aframeObject.setAttribute('look-controls', 'enabled', propertyValue);
  294. // break;
  295. case "wasd-controls":
  296. aframeObject.setAttribute('wasd-controls', 'enabled', propertyValue);
  297. break;
  298. default:
  299. value = undefined;
  300. break;
  301. }
  302. }
  303. if (value === undefined && aframeObject.nodeName == "A-ASSET-ITEM") {
  304. value = propertyValue;
  305. switch (propertyName) {
  306. case "itemID":
  307. aframeObject.setAttribute('id', propertyValue);
  308. break;
  309. case "itemSrc":
  310. aframeObject.setAttribute('src', propertyValue);
  311. break;
  312. default:
  313. value = undefined;
  314. break;
  315. }
  316. }
  317. if (value === undefined && aframeObject.nodeName == "IMG") {
  318. value = propertyValue;
  319. switch (propertyName) {
  320. case "itemID":
  321. aframeObject.setAttribute('id', propertyValue);
  322. break;
  323. case "itemSrc":
  324. aframeObject.setAttribute('src', propertyValue);
  325. break;
  326. default:
  327. value = undefined;
  328. break;
  329. }
  330. }
  331. if (value === undefined && aframeObject.nodeName == "AUDIO") {
  332. value = propertyValue;
  333. switch (propertyName) {
  334. case "itemID":
  335. aframeObject.setAttribute('id', propertyValue);
  336. break;
  337. case "itemSrc":
  338. aframeObject.setAttribute('src', propertyValue);
  339. break;
  340. default:
  341. value = undefined;
  342. break;
  343. }
  344. }
  345. if (value === undefined && aframeObject.nodeName == "A-SKY") {
  346. value = propertyValue;
  347. self.aframeDef['A-SKY'].forEach(element => {
  348. element == propertyName ? aframeObject.setAttribute(element, propertyValue) :
  349. value = undefined;
  350. })
  351. }
  352. if (value === undefined && aframeObject.nodeName == "A-TEXT") {
  353. value = propertyValue;
  354. self.aframeDef['A-TEXT'].forEach(element => {
  355. element == propertyName ? aframeObject.setAttribute(element, propertyValue) :
  356. value = undefined;
  357. })
  358. }
  359. if (value === undefined && aframeObject.nodeName == "A-SCENE") {
  360. value = propertyValue;
  361. switch (propertyName) {
  362. case "color":
  363. aframeObject.setAttribute('background', {'color': propertyValue} );
  364. break;
  365. case "transparent":
  366. aframeObject.setAttribute('background', {'transparent': propertyValue} );
  367. break;
  368. // case "fog":
  369. // aframeObject.setAttribute('fog', propertyValue);
  370. // break;
  371. case "assets":
  372. let assetsEl = document.querySelector('a-assets');
  373. if (!assetsEl) {
  374. let newAssetsEl = document.createElement('a-assets');
  375. aframeObject.appendChild(newAssetsEl);
  376. }
  377. var assetsElement = document.querySelector('a-assets');
  378. if (propertyValue) {
  379. httpGetJson(propertyValue).then(function (response) {
  380. console.log(JSON.parse(response));
  381. let assets = JSON.parse(response);
  382. for (var prop in assets) {
  383. var elm = document.createElement(assets[prop].tag);
  384. elm.setAttribute('id', prop);
  385. elm.setAttribute('src', assets[prop].src);
  386. assetsElement.appendChild(elm);
  387. }
  388. }).catch(function (error) {
  389. console.log(error);
  390. });
  391. }
  392. break;
  393. default:
  394. value = undefined;
  395. break;
  396. }
  397. }
  398. if (value === undefined && aframeObject.nodeName == "A-BOX") {
  399. value = propertyValue;
  400. self.aframeDef['A-BOX'].forEach(element => {
  401. element == propertyName ? aframeObject.setAttribute(element, propertyValue) :
  402. value = undefined;
  403. })
  404. }
  405. if (value === undefined && aframeObject.nodeName == "A-LIGHT") {
  406. value = propertyValue;
  407. self.aframeDef['A-LIGHT'].forEach(element => {
  408. element == propertyName ? aframeObject.setAttribute(element, propertyValue) :
  409. value = undefined;
  410. })
  411. switch (propertyName) {
  412. case "castShadow":
  413. aframeObject.setAttribute('light', 'castShadow', propertyValue);
  414. break;
  415. case "shadowCameraVisible":
  416. aframeObject.setAttribute('light', 'shadowCameraVisible', propertyValue);
  417. break;
  418. default:
  419. value = undefined;
  420. break;
  421. }
  422. }
  423. if (value === undefined && aframeObject.nodeName == "A-GLTF-MODEL") {
  424. value = propertyValue;
  425. switch (propertyName) {
  426. case "src":
  427. aframeObject.setAttribute('src', propertyValue);
  428. break;
  429. default:
  430. value = undefined;
  431. break;
  432. }
  433. }
  434. if (value === undefined && aframeObject.nodeName == "A-COLLADA-MODEL") {
  435. value = propertyValue;
  436. switch (propertyName) {
  437. case "src":
  438. aframeObject.setAttribute('src', propertyValue);
  439. break;
  440. default:
  441. value = undefined;
  442. break;
  443. }
  444. }
  445. if (value === undefined && aframeObject.nodeName == "A-OBJ-MODEL") {
  446. value = propertyValue;
  447. switch (propertyName) {
  448. case "src":
  449. aframeObject.setAttribute('src', propertyValue);
  450. break;
  451. case "mtl":
  452. aframeObject.setAttribute('mtl', propertyValue);
  453. break;
  454. default:
  455. value = undefined;
  456. break;
  457. }
  458. }
  459. if (value === undefined && aframeObject.nodeName == "A-SOUND") {
  460. value = propertyValue;
  461. switch (propertyName) {
  462. case "src":
  463. aframeObject.setAttribute('src', propertyValue);
  464. break;
  465. case "on":
  466. aframeObject.setAttribute('on', propertyValue);
  467. break;
  468. case "autoplay":
  469. aframeObject.setAttribute('autoplay', propertyValue);
  470. break;
  471. default:
  472. value = undefined;
  473. break;
  474. }
  475. }
  476. if (value === undefined && aframeObject.nodeName == "A-PLANE") {
  477. value = propertyValue;
  478. self.aframeDef['A-PLANE'].forEach(element => {
  479. element == propertyName ? aframeObject.setAttribute(element, propertyValue) :
  480. value = undefined;
  481. })
  482. }
  483. if (value === undefined && aframeObject.nodeName == "A-SPHERE") {
  484. value = propertyValue;
  485. self.aframeDef['A-SPHERE'].forEach(element => {
  486. element == propertyName ? aframeObject.setAttribute(element, propertyValue) :
  487. value = undefined;
  488. })
  489. }
  490. if (value === undefined && aframeObject.nodeName == "A-ANIMATION") {
  491. value = propertyValue;
  492. switch (propertyName) {
  493. // attribute:
  494. // dur:
  495. // from:
  496. // to:
  497. // repeat:
  498. case "dur":
  499. aframeObject.setAttribute('dur', propertyValue);
  500. break;
  501. case "from":
  502. aframeObject.setAttribute('from', propertyValue);
  503. break;
  504. case "to":
  505. aframeObject.setAttribute('to', propertyValue);
  506. break;
  507. case "repeat":
  508. aframeObject.setAttribute('repeat', propertyValue);
  509. break;
  510. case "attribute":
  511. aframeObject.setAttribute('attribute', propertyValue);
  512. break;
  513. case "begin":
  514. aframeObject.setAttribute('begin', propertyValue);
  515. break;
  516. default:
  517. value = undefined;
  518. break;
  519. }
  520. }
  521. if (value === undefined && aframeObject.nodeName == "A-CAMERA") {
  522. value = propertyValue;
  523. switch (propertyName) {
  524. case "user-height":
  525. aframeObject.setAttribute('user-height', propertyValue);
  526. break;
  527. case "look-controls-enabled":
  528. aframeObject.setAttribute('look-controls-enabled', propertyValue);
  529. break;
  530. case "wasd-controls-enabled":
  531. aframeObject.setAttribute('wasd-controls-enabled', propertyValue);
  532. break;
  533. // case "active":
  534. // aframeObject.setAttribute('camera', 'active', propertyValue);
  535. // break;
  536. default:
  537. value = undefined;
  538. break;
  539. }
  540. }
  541. if (value === undefined && aframeObject.nodeName == "A-SUN-SKY") {
  542. value = propertyValue;
  543. switch (propertyName) {
  544. case "sunPosition":
  545. aframeObject.setAttribute('material', 'sunPosition', propertyValue);
  546. break;
  547. // case "active":
  548. // aframeObject.setAttribute('camera', 'active', propertyValue);
  549. // break;
  550. default:
  551. value = undefined;
  552. break;
  553. }
  554. }
  555. }
  556. return value;
  557. },
  558. // -- gettingProperty ----------------------------------------------------------------------
  559. gettingProperty: function (nodeID, propertyName, propertyValue) {
  560. var node = this.state.nodes[nodeID];
  561. var value = undefined;
  562. if (node && node.aframeObj) {
  563. var aframeObject = node.aframeObj;
  564. if (isNodeDefinition(node.prototypes)) {
  565. switch (propertyName) {
  566. }
  567. }
  568. if (value === undefined && isAEntityDefinition(node.prototypes)) {
  569. switch (propertyName) {
  570. case "worldPosition":
  571. var pos = aframeObject.object3D.getWorldPosition();
  572. if (pos !== undefined) {
  573. value = pos;
  574. }
  575. break;
  576. case "position":
  577. var pos = aframeObject.getAttribute('position');
  578. if (pos !== undefined) {
  579. value = pos//[pos.x, pos.y, pos.z]//AFRAME.utils.coordinates.stringify(pos);
  580. }
  581. break;
  582. case "scale":
  583. var scale = aframeObject.getAttribute('scale');
  584. if (scale !== undefined) {
  585. value = scale//AFRAME.utils.coordinates.stringify(scale);
  586. }
  587. break;
  588. case "rotation":
  589. var rot = aframeObject.getAttribute('rotation');
  590. if (rot !== undefined) {
  591. value = rot//AFRAME.utils.coordinates.stringify(rot);
  592. }
  593. break;
  594. case "clickable":
  595. value = node.events.clickable;
  596. break;
  597. // case "look-controls-enabled":
  598. // var look = aframeObject.getAttribute('look-controls-enabled');
  599. // if (look !== null && look !== undefined) {
  600. // value = aframeObject.getAttribute('look-controls').enabled;
  601. // }
  602. // break;
  603. // case "wasd-controls":
  604. // var wasd = aframeObject.getAttribute('wasd-controls');
  605. // if (wasd !== null && wasd !== undefined) {
  606. // value = aframeObject.getAttribute('wasd-controls').enabled;
  607. // }
  608. // break;
  609. case "visible":
  610. value = aframeObject.getAttribute('visible');
  611. break;
  612. }
  613. }
  614. if (value === undefined && aframeObject.nodeName == "A-ASSET-ITEM") {
  615. switch (propertyName) {
  616. case "itemID":
  617. value = aframeObject.getAttribute('id');
  618. break;
  619. case "itemSrc":
  620. value = aframeObject.getAttribute('src');
  621. break;
  622. }
  623. }
  624. if (value === undefined && aframeObject.nodeName == "IMG") {
  625. switch (propertyName) {
  626. case "itemID":
  627. value = aframeObject.getAttribute('id');
  628. break;
  629. case "itemSrc":
  630. value = aframeObject.getAttribute('src');
  631. break;
  632. }
  633. }
  634. if (value === undefined && aframeObject.nodeName == "AUDIO") {
  635. switch (propertyName) {
  636. case "itemID":
  637. value = aframeObject.getAttribute('id');
  638. break;
  639. case "itemSrc":
  640. value = aframeObject.getAttribute('src');
  641. break;
  642. }
  643. }
  644. if (value === undefined && aframeObject.nodeName == "A-SCENE") {
  645. switch (propertyName) {
  646. // case "fog":
  647. // value = aframeObject.getAttribute('fog');
  648. // break;
  649. case "color":
  650. if (aframeObject.getAttribute('background')) {
  651. value = aframeObject.getAttribute('background').color;
  652. }
  653. break;
  654. case "transparent":
  655. if (aframeObject.getAttribute('background')) {
  656. value = aframeObject.getAttribute('background').transparent;
  657. }
  658. break;
  659. }
  660. }
  661. if (value === undefined && aframeObject.nodeName == "A-SKY") {
  662. self.aframeDef['A-SKY'].forEach(element => {
  663. if (element == propertyName) {
  664. value = aframeObject.getAttribute(element);
  665. }
  666. })
  667. }
  668. if (value === undefined && aframeObject.nodeName == "A-LIGHT") {
  669. self.aframeDef['A-LIGHT'].forEach(element => {
  670. if (element == propertyName) {
  671. value = aframeObject.getAttribute(element);
  672. }
  673. })
  674. switch (propertyName) {
  675. case "castShadow":
  676. value = aframeObject.getAttribute('light').castShadow;
  677. break;
  678. case "shadowCameraVisible":
  679. value = aframeObject.getAttribute('light').shadowCameraVisible;
  680. break;
  681. }
  682. }
  683. if (value === undefined && aframeObject.nodeName == "A-BOX") {
  684. self.aframeDef['A-BOX'].forEach(element => {
  685. if (element == propertyName) {
  686. value = aframeObject.getAttribute(element);
  687. }
  688. })
  689. }
  690. if (value === undefined && aframeObject.nodeName == "A-PLANE") {
  691. self.aframeDef['A-PLANE'].forEach(element => {
  692. if (element == propertyName) {
  693. value = aframeObject.getAttribute(element);
  694. }
  695. })
  696. }
  697. if (value === undefined && aframeObject.nodeName == "A-SPHERE") {
  698. self.aframeDef['A-SPHERE'].forEach(element => {
  699. if (element == propertyName) {
  700. value = aframeObject.getAttribute(element);
  701. }
  702. })
  703. }
  704. if (value === undefined && aframeObject.nodeName == "A-TEXT") {
  705. self.aframeDef['A-TEXT'].forEach(element => {
  706. if (element == propertyName) {
  707. value = aframeObject.getAttribute(element);
  708. }
  709. })
  710. }
  711. if (value === undefined && aframeObject.nodeName == "A-ANIMATION") {
  712. switch (propertyName) {
  713. case "attribute":
  714. value = aframeObject.getAttribute('attribute');
  715. break;
  716. case "dur":
  717. value = aframeObject.getAttribute('dur');
  718. break;
  719. case "from":
  720. value = aframeObject.getAttribute('from');
  721. break;
  722. case "to":
  723. value = aframeObject.getAttribute('to');
  724. break;
  725. case "repeat":
  726. value = aframeObject.getAttribute('repeat');
  727. break;
  728. case "begin":
  729. value = aframeObject.getAttribute('begin');
  730. break;
  731. }
  732. }
  733. if (value === undefined && aframeObject.nodeName == "A-CAMERA") {
  734. switch (propertyName) {
  735. case "user-height":
  736. value = aframeObject.getAttribute('user-height');
  737. break;
  738. case "look-controls-enabled":
  739. value = aframeObject.getAttribute('look-controls-enabled');
  740. break;
  741. case "wasd-controls-enabled":
  742. value = aframeObject.getAttribute('wasd-controls-enabled');
  743. break;
  744. }
  745. // switch (propertyName) {
  746. // case "active":
  747. // value = aframeObject.getAttribute('camera').active;
  748. // break;
  749. // }
  750. }
  751. if (value === undefined && aframeObject.nodeName == "A-SUN-SKY") {
  752. switch (propertyName) {
  753. case "sunPosition":
  754. value = aframeObject.getAttribute('material').sunPosition;
  755. break;
  756. }
  757. // switch (propertyName) {
  758. // case "active":
  759. // value = aframeObject.getAttribute('camera').active;
  760. // break;
  761. // }
  762. }
  763. if (value === undefined && aframeObject.nodeName == "A-COLLADA-MODEL") {
  764. switch (propertyName) {
  765. case "src":
  766. value = aframeObject.getAttribute('src');
  767. break;
  768. }
  769. }
  770. if (value === undefined && aframeObject.nodeName == "A-OBJ-MODEL") {
  771. switch (propertyName) {
  772. case "src":
  773. value = aframeObject.getAttribute('src');
  774. break;
  775. case "mtl":
  776. value = aframeObject.getAttribute('mtl');
  777. break;
  778. }
  779. }
  780. if (value === undefined && aframeObject.nodeName == "A-SOUND") {
  781. switch (propertyName) {
  782. case "src":
  783. value = aframeObject.getAttribute('src');
  784. break;
  785. case "on":
  786. value = aframeObject.getAttribute('on');
  787. break;
  788. case "autoplay":
  789. value = aframeObject.getAttribute('autoplay');
  790. break;
  791. }
  792. }
  793. if (value === undefined && aframeObject.nodeName == "A-GLTF-MODEL") {
  794. switch (propertyName) {
  795. case "src":
  796. value = aframeObject.getAttribute('src');
  797. break;
  798. }
  799. }
  800. }
  801. if (value !== undefined) {
  802. propertyValue = value;
  803. }
  804. return value;
  805. }
  806. });
  807. function createAFrameObject(node, config) {
  808. var protos = node.prototypes;
  809. var aframeObj = undefined;
  810. if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/ascene.vwf")) {
  811. aframeObj = document.createElement('a-scene');
  812. let assetsElement = document.createElement('a-assets');
  813. aframeObj.appendChild(assetsElement);
  814. self.state.scenes[node.ID] = aframeObj;
  815. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/a-asset-item.vwf")) {
  816. let assets = document.querySelector('a-assets');
  817. if (assets){
  818. aframeObj = document.createElement('a-asset-item');
  819. aframeObj.setAttribute('id', "item-"+GUID());
  820. aframeObj.setAttribute('src', "");
  821. aframeObj.setAttribute('crossorigin', "anonymous");
  822. assets.appendChild(aframeObj);
  823. }
  824. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/a-asset-image-item.vwf")) {
  825. let assets = document.querySelector('a-assets');
  826. if (assets){
  827. aframeObj = document.createElement('img');
  828. aframeObj.setAttribute('id', "item-"+GUID());
  829. aframeObj.setAttribute('src', "");
  830. aframeObj.setAttribute('crossorigin', "anonymous");
  831. assets.appendChild(aframeObj);
  832. }
  833. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/a-asset-audio-item.vwf")) {
  834. let assets = document.querySelector('a-assets');
  835. if (assets){
  836. aframeObj = document.createElement('audio');
  837. aframeObj.setAttribute('id', "item-"+GUID());
  838. aframeObj.setAttribute('src', "");
  839. aframeObj.setAttribute('crossorigin', "anonymous");
  840. assets.appendChild(aframeObj);
  841. }
  842. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/asky.vwf")) {
  843. aframeObj = document.createElement('a-sky');
  844. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/acamera.vwf")) {
  845. aframeObj = document.createElement('a-camera');
  846. aframeObj.setAttribute('camera', 'active', false);
  847. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/alight.vwf")) {
  848. aframeObj = document.createElement('a-light');
  849. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/acursor.vwf")) {
  850. aframeObj = document.createElement('a-cursor');
  851. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/a-sun-sky.vwf")) {
  852. aframeObj = document.createElement('a-sun-sky');
  853. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/abox.vwf")) {
  854. aframeObj = document.createElement('a-box');
  855. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/aplane.vwf")) {
  856. aframeObj = document.createElement('a-plane');
  857. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/atext.vwf")) {
  858. aframeObj = document.createElement('a-text');
  859. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/acolladamodel.vwf")) {
  860. aframeObj = document.createElement('a-collada-model');
  861. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/aobjmodel.vwf")) {
  862. aframeObj = document.createElement('a-obj-model');
  863. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/asound.vwf")) {
  864. aframeObj = document.createElement('a-sound');
  865. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/agltfmodel.vwf")) {
  866. aframeObj = document.createElement('a-gltf-model');
  867. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/asphere.vwf")) {
  868. aframeObj = document.createElement('a-sphere');
  869. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/aanimation.vwf")) {
  870. aframeObj = document.createElement('a-animation');
  871. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/aentity.vwf")) {
  872. aframeObj = document.createElement('a-entity');
  873. }
  874. if (aframeObj.nodeName !== "A-ASSET-ITEM" && aframeObj.nodeName !== "IMG" && aframeObj.nodeName !== "AUIDO"){
  875. aframeObj.setAttribute('id', node.ID);
  876. }
  877. return aframeObj;
  878. }
  879. function addNodeToHierarchy(node) {
  880. if (node.aframeObj) {
  881. if (self.state.nodes[node.parentID] !== undefined) {
  882. var parent = self.state.nodes[node.parentID];
  883. if (parent.aframeObj) {
  884. if (parent.children === undefined) {
  885. parent.children = [];
  886. }
  887. parent.children.push(node.ID);
  888. //console.info( "Adding child: " + childID + " to " + nodeID );
  889. if (node.aframeObj.nodeName !== "A-ASSET-ITEM" && node.aframeObj.nodeName !== "IMG" && node.aframeObj.nodeName !== "AUIDO"){
  890. parent.aframeObj.appendChild(node.aframeObj);
  891. }
  892. }
  893. }
  894. if (node.aframeObj.nodeName !== "A-SCENE") {
  895. node.scene = self.state.scenes[self.kernel.application()];
  896. }
  897. }
  898. }
  899. function getPrototypes(kernel, extendsID) {
  900. var prototypes = [];
  901. var id = extendsID;
  902. while (id !== undefined) {
  903. prototypes.push(id);
  904. id = kernel.prototype(id);
  905. }
  906. return prototypes;
  907. }
  908. function isNodeDefinition(prototypes) {
  909. var found = false;
  910. if (prototypes) {
  911. for (var i = 0; i < prototypes.length && !found; i++) {
  912. found = (prototypes[i] == "http://vwf.example.com/aframe/node.vwf");
  913. }
  914. }
  915. return found;
  916. }
  917. function isAEntityDefinition(prototypes) {
  918. var found = false;
  919. if (prototypes) {
  920. for (var i = 0; i < prototypes.length && !found; i++) {
  921. found = (prototypes[i] == "http://vwf.example.com/aframe/aentity.vwf");
  922. }
  923. }
  924. return found;
  925. }
  926. // Changing this function significantly from the GLGE code
  927. // Will search hierarchy down until encountering a matching child
  928. // Will look into nodes that don't match.... this might not be desirable
  929. function FindChildByName(obj, childName, childType, recursive) {
  930. var child = undefined;
  931. if (recursive) {
  932. // TODO: If the obj itself has the child name, the object will be returned by this function
  933. // I don't think this this desirable.
  934. if (nameTest.call(this, obj, childName)) {
  935. child = obj;
  936. } else if (obj.children && obj.children.length > 0) {
  937. for (var i = 0; i < obj.children.length && child === undefined; i++) {
  938. child = FindChildByName(obj.children[i], childName, childType, true);
  939. }
  940. }
  941. } else {
  942. if (obj.children) {
  943. for (var i = 0; i < obj.children.length && child === undefined; i++) {
  944. if (nameTest.call(this, obj.children[i], childName)) {
  945. child = obj.children[i];
  946. }
  947. }
  948. }
  949. }
  950. return child;
  951. }
  952. function nameTest(obj, name) {
  953. if (obj.name == "") {
  954. return (obj.parent.name + "Child" == name);
  955. } else {
  956. return (obj.name == name || obj.id == name || obj.vwfID == name);
  957. }
  958. }
  959. function httpGet(url) {
  960. return new Promise(function (resolve, reject) {
  961. // do the usual Http request
  962. let request = new XMLHttpRequest();
  963. request.open('GET', url);
  964. request.onload = function () {
  965. if (request.status == 200) {
  966. resolve(request.response);
  967. } else {
  968. reject(Error(request.statusText));
  969. }
  970. };
  971. request.onerror = function () {
  972. reject(Error('Network Error'));
  973. };
  974. request.send();
  975. });
  976. }
  977. async function httpGetJson(url) {
  978. // check if the URL looks like a JSON file and call httpGet.
  979. let regex = /\.(json)$/i;
  980. if (regex.test(url)) {
  981. // call the async function, wait for the result
  982. return await httpGet(url);
  983. } else {
  984. throw Error('Bad Url Format');
  985. }
  986. }
  987. function GUID() {
  988. var S4 = function () {
  989. return Math.floor(
  990. Math.random() * 0x10000 /* 65536 */
  991. ).toString(16);
  992. };
  993. return (
  994. S4() + S4() + "-" +
  995. S4() + "-" +
  996. S4() + "-" +
  997. S4() + "-" +
  998. S4() + S4() + S4()
  999. );
  1000. }
  1001. });