aframe.js 50 KB

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