aframe.js 50 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379
  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. 'depth', 'height', 'segments-depth',
  87. 'segments-height', 'segments-width',
  88. 'width'],
  89. 'A-SPHERE': [
  90. 'phi-length', 'phi-start', 'radius',
  91. 'segments-depth',
  92. 'segments-height', 'segments-width',
  93. 'theta-length', 'theta-start'
  94. ],
  95. 'A-CYLINDER': [
  96. 'height', 'radius',
  97. 'open-ended', 'radius-bottom', 'radius-top',
  98. 'segments-height', 'segments-radial',
  99. 'theta-length', 'theta-start'
  100. ],
  101. 'A-CONE': [
  102. 'height',
  103. 'open-ended', 'radius-bottom', 'radius-top',
  104. 'segments-height', 'segments-radial',
  105. 'theta-length', 'theta-start'
  106. ],
  107. 'A-PLANE': [
  108. 'height', 'segments-height', 'segments-width','width'
  109. ],
  110. 'A-TEXT': [
  111. 'align', 'alpha-test', 'anchor',
  112. 'baseline', 'color', 'font',
  113. 'font-image', 'height',
  114. 'letter-spacing', 'line-height',
  115. 'opacity', 'shader',
  116. 'side', 'tab-size',
  117. 'transparent', 'value',
  118. 'white-space', 'width',
  119. 'wrap-count', 'wrap-pixels',
  120. 'z-offset'
  121. ],
  122. 'A-SKY': [
  123. 'phi-length', 'phi-start', 'radius','segments-height',
  124. 'segments-width',
  125. 'theta-length', 'theta-start',
  126. ],
  127. 'A-LIGHT': [
  128. 'angle', 'color', 'decay', 'distance',
  129. 'ground-color', 'intensity', 'penumbra',
  130. 'type', 'target'
  131. ]
  132. }
  133. },
  134. // == Model API ============================================================================
  135. // -- creatingNode -------------------------------------------------------------------------
  136. creatingNode: function (nodeID, childID, childExtendsID, childImplementsIDs,
  137. childSource, childType, childIndex, childName, callback /* ( ready ) */) {
  138. // If the parent nodeID is 0, this node is attached directly to the root and is therefore either
  139. // the scene or a prototype. In either of those cases, save the uri of the new node
  140. var childURI = (nodeID === 0 ? childIndex : undefined);
  141. var appID = this.kernel.application();
  142. // If the node being created is a prototype, construct it and add it to the array of prototypes,
  143. // and then return
  144. var prototypeID = utility.ifPrototypeGetId(appID, this.state.prototypes, nodeID, childID);
  145. if (prototypeID !== undefined) {
  146. this.state.prototypes[prototypeID] = {
  147. parentID: nodeID,
  148. ID: childID,
  149. extendsID: childExtendsID,
  150. implementsID: childImplementsIDs,
  151. source: childSource,
  152. type: childType,
  153. name: childName
  154. };
  155. return;
  156. }
  157. var protos = getPrototypes(this.kernel, childExtendsID);
  158. //var kernel = this.kernel.kernel.kernel;
  159. var node;
  160. if (this.state.isAFrameComponent(protos)) {
  161. // Create the local copy of the node properties
  162. if (this.state.nodes[childID] === undefined) {
  163. this.state.nodes[childID] = this.state.createLocalNode(nodeID, childID, childExtendsID, childImplementsIDs,
  164. childSource, childType, childIndex, childName, callback);
  165. }
  166. node = this.state.nodes[childID];
  167. node.prototypes = protos;
  168. // if (childType == "component") {
  169. // if (nodeID !== undefined) {
  170. // node.aframeObj = setAFrameObjectComponents(node);
  171. // addNodeToHierarchy(node);
  172. // }
  173. // } else {
  174. node.aframeObj = createAFrameObject(node);
  175. addNodeToHierarchy(node);
  176. //notifyDriverOfPrototypeAndBehaviorProps();
  177. // }
  178. //addNodeToHierarchy(node);
  179. }
  180. },
  181. // initializingNode: function( nodeID, childID, childExtendsID, childImplementsIDs,
  182. // childSource, childType, childIndex, childName ) {
  183. // var node = this.state.nodes[childID];
  184. // if ( node && childType == "component" ) {
  185. // }
  186. // },
  187. // -- initializingProperty -----------------------------------------------------------------
  188. initializingProperty: function (nodeID, propertyName, propertyValue) {
  189. var value = undefined;
  190. var node = this.state.nodes[nodeID];
  191. if (node !== undefined) {
  192. value = this.settingProperty(nodeID, propertyName, propertyValue);
  193. }
  194. return value;
  195. },
  196. // -- creatingProperty ---------------------------------------------------------------------
  197. creatingProperty: function (nodeID, propertyName, propertyValue) {
  198. return this.initializingProperty(nodeID, propertyName, propertyValue);
  199. },
  200. // -- callingMethod ------------------------------------------------------------------------
  201. callingMethod: function( nodeID, methodName, methodParameters ) {
  202. var node = this.state.nodes[nodeID];
  203. if(!node) return;
  204. if (node && node.aframeObj ) {
  205. if (methodName == 'lookAt') {
  206. console.log('lookAt: ' + methodParameters[0]);
  207. let target = methodParameters[0];
  208. node.aframeObj.object3D.lookAt(new THREE.Vector3(target.x, target.y, target.z));
  209. let newRotation = node.aframeObj.getAttribute('rotation');
  210. self.kernel.setProperty(nodeID, "rotation", {x: 0, y: newRotation.y, z: 0});
  211. }
  212. }
  213. },
  214. // -- deletingNode -------------------------------------------------------------------------
  215. //deletingNode: function( nodeID ) {
  216. //},
  217. // -- deletingNode -------------------------------------------------------------------------
  218. deletingNode: function (nodeID) {
  219. if (nodeID) {
  220. var childNode = this.state.nodes[nodeID];
  221. if (!childNode) return;
  222. if (childNode !== undefined) {
  223. if (childNode.children) {
  224. for (var i = 0; i < childNode.children.length; i++) {
  225. this.deletingNode(childNode.children[i]);
  226. }
  227. }
  228. if (childNode.aframeObj !== undefined) {
  229. // removes and destroys object
  230. childNode.aframeObj.parentNode.removeChild(childNode.aframeObj);
  231. childNode.aframeObj = undefined;
  232. }
  233. delete this.state.nodes[nodeID];
  234. }
  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-CYLINDER") {
  491. value = propertyValue;
  492. self.aframeDef['A-CYLINDER'].forEach(element => {
  493. element == propertyName ? aframeObject.setAttribute(element, propertyValue) :
  494. value = undefined;
  495. })
  496. }
  497. if (value === undefined && aframeObject.nodeName == "A-CONE") {
  498. value = propertyValue;
  499. self.aframeDef['A-CONE'].forEach(element => {
  500. element == propertyName ? aframeObject.setAttribute(element, propertyValue) :
  501. value = undefined;
  502. })
  503. }
  504. if (value === undefined && aframeObject.nodeName == "A-ANIMATION") {
  505. value = propertyValue;
  506. switch (propertyName) {
  507. // attribute:
  508. // dur:
  509. // from:
  510. // to:
  511. // repeat:
  512. case "dur":
  513. aframeObject.setAttribute('dur', propertyValue);
  514. break;
  515. case "from":
  516. aframeObject.setAttribute('from', propertyValue);
  517. break;
  518. case "to":
  519. aframeObject.setAttribute('to', propertyValue);
  520. break;
  521. case "repeat":
  522. aframeObject.setAttribute('repeat', propertyValue);
  523. break;
  524. case "attribute":
  525. aframeObject.setAttribute('attribute', propertyValue);
  526. break;
  527. case "begin":
  528. aframeObject.setAttribute('begin', propertyValue);
  529. break;
  530. default:
  531. value = undefined;
  532. break;
  533. }
  534. }
  535. if (value === undefined && aframeObject.nodeName == "A-CAMERA") {
  536. value = propertyValue;
  537. switch (propertyName) {
  538. case "user-height":
  539. aframeObject.setAttribute('user-height', propertyValue);
  540. break;
  541. case "look-controls-enabled":
  542. aframeObject.setAttribute('look-controls-enabled', propertyValue);
  543. break;
  544. case "wasd-controls-enabled":
  545. aframeObject.setAttribute('wasd-controls-enabled', propertyValue);
  546. break;
  547. // case "active":
  548. // aframeObject.setAttribute('camera', 'active', propertyValue);
  549. // break;
  550. default:
  551. value = undefined;
  552. break;
  553. }
  554. }
  555. if (value === undefined && aframeObject.nodeName == "A-SUN-SKY") {
  556. value = propertyValue;
  557. switch (propertyName) {
  558. case "sunPosition":
  559. aframeObject.setAttribute('material', 'sunPosition', propertyValue);
  560. break;
  561. // case "active":
  562. // aframeObject.setAttribute('camera', 'active', propertyValue);
  563. // break;
  564. default:
  565. value = undefined;
  566. break;
  567. }
  568. }
  569. }
  570. return value;
  571. },
  572. // -- gettingProperty ----------------------------------------------------------------------
  573. gettingProperty: function (nodeID, propertyName, propertyValue) {
  574. var node = this.state.nodes[nodeID];
  575. var value = undefined;
  576. if (node && node.aframeObj) {
  577. var aframeObject = node.aframeObj;
  578. if (isNodeDefinition(node.prototypes)) {
  579. switch (propertyName) {
  580. }
  581. }
  582. if (value === undefined && isAEntityDefinition(node.prototypes)) {
  583. switch (propertyName) {
  584. case "worldPosition":
  585. var pos = aframeObject.object3D.getWorldPosition();
  586. if (pos !== undefined) {
  587. value = pos;
  588. }
  589. break;
  590. case "position":
  591. var pos = aframeObject.getAttribute('position');
  592. if (pos !== undefined) {
  593. value = pos//[pos.x, pos.y, pos.z]//AFRAME.utils.coordinates.stringify(pos);
  594. }
  595. break;
  596. case "scale":
  597. var scale = aframeObject.getAttribute('scale');
  598. if (scale !== undefined) {
  599. value = scale//AFRAME.utils.coordinates.stringify(scale);
  600. }
  601. break;
  602. case "rotation":
  603. var rot = aframeObject.getAttribute('rotation');
  604. if (rot !== undefined) {
  605. value = rot//AFRAME.utils.coordinates.stringify(rot);
  606. }
  607. break;
  608. case "clickable":
  609. value = node.events.clickable;
  610. break;
  611. // case "look-controls-enabled":
  612. // var look = aframeObject.getAttribute('look-controls-enabled');
  613. // if (look !== null && look !== undefined) {
  614. // value = aframeObject.getAttribute('look-controls').enabled;
  615. // }
  616. // break;
  617. // case "wasd-controls":
  618. // var wasd = aframeObject.getAttribute('wasd-controls');
  619. // if (wasd !== null && wasd !== undefined) {
  620. // value = aframeObject.getAttribute('wasd-controls').enabled;
  621. // }
  622. // break;
  623. case "visible":
  624. value = aframeObject.getAttribute('visible');
  625. break;
  626. }
  627. }
  628. if (value === undefined && aframeObject.nodeName == "A-ASSET-ITEM") {
  629. switch (propertyName) {
  630. case "itemID":
  631. value = aframeObject.getAttribute('id');
  632. break;
  633. case "itemSrc":
  634. value = aframeObject.getAttribute('src');
  635. break;
  636. }
  637. }
  638. if (value === undefined && aframeObject.nodeName == "IMG") {
  639. switch (propertyName) {
  640. case "itemID":
  641. value = aframeObject.getAttribute('id');
  642. break;
  643. case "itemSrc":
  644. value = aframeObject.getAttribute('src');
  645. break;
  646. }
  647. }
  648. if (value === undefined && aframeObject.nodeName == "AUDIO") {
  649. switch (propertyName) {
  650. case "itemID":
  651. value = aframeObject.getAttribute('id');
  652. break;
  653. case "itemSrc":
  654. value = aframeObject.getAttribute('src');
  655. break;
  656. }
  657. }
  658. if (value === undefined && aframeObject.nodeName == "A-SCENE") {
  659. switch (propertyName) {
  660. // case "fog":
  661. // value = aframeObject.getAttribute('fog');
  662. // break;
  663. case "color":
  664. if (aframeObject.getAttribute('background')) {
  665. value = aframeObject.getAttribute('background').color;
  666. }
  667. break;
  668. case "transparent":
  669. if (aframeObject.getAttribute('background')) {
  670. value = aframeObject.getAttribute('background').transparent;
  671. }
  672. break;
  673. }
  674. }
  675. if (value === undefined && aframeObject.nodeName == "A-SKY") {
  676. self.aframeDef['A-SKY'].forEach(element => {
  677. if (element == propertyName) {
  678. value = aframeObject.getAttribute(element);
  679. }
  680. })
  681. }
  682. if (value === undefined && aframeObject.nodeName == "A-LIGHT") {
  683. self.aframeDef['A-LIGHT'].forEach(element => {
  684. if (element == propertyName) {
  685. value = aframeObject.getAttribute(element);
  686. }
  687. })
  688. switch (propertyName) {
  689. case "castShadow":
  690. value = aframeObject.getAttribute('light').castShadow;
  691. break;
  692. case "shadowCameraVisible":
  693. value = aframeObject.getAttribute('light').shadowCameraVisible;
  694. break;
  695. }
  696. }
  697. if (value === undefined && aframeObject.nodeName == "A-BOX") {
  698. self.aframeDef['A-BOX'].forEach(element => {
  699. if (element == propertyName) {
  700. value = aframeObject.getAttribute(element);
  701. }
  702. })
  703. }
  704. if (value === undefined && aframeObject.nodeName == "A-PLANE") {
  705. self.aframeDef['A-PLANE'].forEach(element => {
  706. if (element == propertyName) {
  707. value = aframeObject.getAttribute(element);
  708. }
  709. })
  710. }
  711. if (value === undefined && aframeObject.nodeName == "A-SPHERE") {
  712. self.aframeDef['A-SPHERE'].forEach(element => {
  713. if (element == propertyName) {
  714. value = aframeObject.getAttribute(element);
  715. }
  716. })
  717. }
  718. if (value === undefined && aframeObject.nodeName == "A-CYLINDER") {
  719. self.aframeDef['A-CYLINDER'].forEach(element => {
  720. if (element == propertyName) {
  721. value = aframeObject.getAttribute(element);
  722. }
  723. })
  724. }
  725. if (value === undefined && aframeObject.nodeName == "A-CONE") {
  726. self.aframeDef['A-CONE'].forEach(element => {
  727. if (element == propertyName) {
  728. value = aframeObject.getAttribute(element);
  729. }
  730. })
  731. }
  732. if (value === undefined && aframeObject.nodeName == "A-TEXT") {
  733. self.aframeDef['A-TEXT'].forEach(element => {
  734. if (element == propertyName) {
  735. value = aframeObject.getAttribute(element);
  736. }
  737. })
  738. }
  739. if (value === undefined && aframeObject.nodeName == "A-ANIMATION") {
  740. switch (propertyName) {
  741. case "attribute":
  742. value = aframeObject.getAttribute('attribute');
  743. break;
  744. case "dur":
  745. value = aframeObject.getAttribute('dur');
  746. break;
  747. case "from":
  748. value = aframeObject.getAttribute('from');
  749. break;
  750. case "to":
  751. value = aframeObject.getAttribute('to');
  752. break;
  753. case "repeat":
  754. value = aframeObject.getAttribute('repeat');
  755. break;
  756. case "begin":
  757. value = aframeObject.getAttribute('begin');
  758. break;
  759. }
  760. }
  761. if (value === undefined && aframeObject.nodeName == "A-CAMERA") {
  762. switch (propertyName) {
  763. case "user-height":
  764. value = aframeObject.getAttribute('user-height');
  765. break;
  766. case "look-controls-enabled":
  767. value = aframeObject.getAttribute('look-controls-enabled');
  768. break;
  769. case "wasd-controls-enabled":
  770. value = aframeObject.getAttribute('wasd-controls-enabled');
  771. break;
  772. }
  773. // switch (propertyName) {
  774. // case "active":
  775. // value = aframeObject.getAttribute('camera').active;
  776. // break;
  777. // }
  778. }
  779. if (value === undefined && aframeObject.nodeName == "A-SUN-SKY") {
  780. switch (propertyName) {
  781. case "sunPosition":
  782. value = aframeObject.getAttribute('material').sunPosition;
  783. break;
  784. }
  785. // switch (propertyName) {
  786. // case "active":
  787. // value = aframeObject.getAttribute('camera').active;
  788. // break;
  789. // }
  790. }
  791. if (value === undefined && aframeObject.nodeName == "A-COLLADA-MODEL") {
  792. switch (propertyName) {
  793. case "src":
  794. value = aframeObject.getAttribute('src');
  795. break;
  796. }
  797. }
  798. if (value === undefined && aframeObject.nodeName == "A-OBJ-MODEL") {
  799. switch (propertyName) {
  800. case "src":
  801. value = aframeObject.getAttribute('src');
  802. break;
  803. case "mtl":
  804. value = aframeObject.getAttribute('mtl');
  805. break;
  806. }
  807. }
  808. if (value === undefined && aframeObject.nodeName == "A-SOUND") {
  809. switch (propertyName) {
  810. case "src":
  811. value = aframeObject.getAttribute('src');
  812. break;
  813. case "on":
  814. value = aframeObject.getAttribute('on');
  815. break;
  816. case "autoplay":
  817. value = aframeObject.getAttribute('autoplay');
  818. break;
  819. }
  820. }
  821. if (value === undefined && aframeObject.nodeName == "A-GLTF-MODEL") {
  822. switch (propertyName) {
  823. case "src":
  824. value = aframeObject.getAttribute('src');
  825. break;
  826. }
  827. }
  828. }
  829. if (value !== undefined) {
  830. propertyValue = value;
  831. }
  832. return value;
  833. }
  834. });
  835. function createAFrameObject(node, config) {
  836. var protos = node.prototypes;
  837. var aframeObj = undefined;
  838. if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/ascene.vwf")) {
  839. aframeObj = document.createElement('a-scene');
  840. let assetsElement = document.createElement('a-assets');
  841. aframeObj.appendChild(assetsElement);
  842. self.state.scenes[node.ID] = aframeObj;
  843. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/a-asset-item.vwf")) {
  844. let assets = document.querySelector('a-assets');
  845. if (assets){
  846. aframeObj = document.createElement('a-asset-item');
  847. aframeObj.setAttribute('id', "item-"+GUID());
  848. aframeObj.setAttribute('src', "");
  849. aframeObj.setAttribute('crossorigin', "anonymous");
  850. assets.appendChild(aframeObj);
  851. }
  852. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/a-asset-image-item.vwf")) {
  853. let assets = document.querySelector('a-assets');
  854. if (assets){
  855. aframeObj = document.createElement('img');
  856. aframeObj.setAttribute('id', "item-"+GUID());
  857. aframeObj.setAttribute('src', "");
  858. aframeObj.setAttribute('crossorigin', "anonymous");
  859. assets.appendChild(aframeObj);
  860. }
  861. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/a-asset-audio-item.vwf")) {
  862. let assets = document.querySelector('a-assets');
  863. if (assets){
  864. aframeObj = document.createElement('audio');
  865. aframeObj.setAttribute('id', "item-"+GUID());
  866. aframeObj.setAttribute('src', "");
  867. aframeObj.setAttribute('crossorigin', "anonymous");
  868. assets.appendChild(aframeObj);
  869. }
  870. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/asky.vwf")) {
  871. aframeObj = document.createElement('a-sky');
  872. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/acamera.vwf")) {
  873. aframeObj = document.createElement('a-camera');
  874. aframeObj.setAttribute('camera', 'active', false);
  875. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/alight.vwf")) {
  876. aframeObj = document.createElement('a-light');
  877. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/acursor.vwf")) {
  878. aframeObj = document.createElement('a-cursor');
  879. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/a-sun-sky.vwf")) {
  880. aframeObj = document.createElement('a-sun-sky');
  881. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/abox.vwf")) {
  882. aframeObj = document.createElement('a-box');
  883. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/aplane.vwf")) {
  884. aframeObj = document.createElement('a-plane');
  885. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/acylinder.vwf")) {
  886. aframeObj = document.createElement('a-cylinder');
  887. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/acone.vwf")) {
  888. aframeObj = document.createElement('a-cone');
  889. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/atext.vwf")) {
  890. aframeObj = document.createElement('a-text');
  891. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/acolladamodel.vwf")) {
  892. aframeObj = document.createElement('a-collada-model');
  893. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/aobjmodel.vwf")) {
  894. aframeObj = document.createElement('a-obj-model');
  895. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/asound.vwf")) {
  896. aframeObj = document.createElement('a-sound');
  897. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/agltfmodel.vwf")) {
  898. aframeObj = document.createElement('a-gltf-model');
  899. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/asphere.vwf")) {
  900. aframeObj = document.createElement('a-sphere');
  901. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/aanimation.vwf")) {
  902. aframeObj = document.createElement('a-animation');
  903. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/aentity.vwf")) {
  904. aframeObj = document.createElement('a-entity');
  905. }
  906. if (aframeObj.nodeName !== "A-ASSET-ITEM" && aframeObj.nodeName !== "IMG" && aframeObj.nodeName !== "AUIDO"){
  907. aframeObj.setAttribute('id', node.ID);
  908. }
  909. return aframeObj;
  910. }
  911. function addNodeToHierarchy(node) {
  912. if (node.aframeObj) {
  913. if (self.state.nodes[node.parentID] !== undefined) {
  914. var parent = self.state.nodes[node.parentID];
  915. if (parent.aframeObj) {
  916. if (parent.children === undefined) {
  917. parent.children = [];
  918. }
  919. parent.children.push(node.ID);
  920. //console.info( "Adding child: " + childID + " to " + nodeID );
  921. if (node.aframeObj.nodeName !== "A-ASSET-ITEM" && node.aframeObj.nodeName !== "IMG" && node.aframeObj.nodeName !== "AUIDO"){
  922. parent.aframeObj.appendChild(node.aframeObj);
  923. }
  924. }
  925. }
  926. if (node.aframeObj.nodeName !== "A-SCENE") {
  927. node.scene = self.state.scenes[self.kernel.application()];
  928. }
  929. }
  930. }
  931. function getPrototypes(kernel, extendsID) {
  932. var prototypes = [];
  933. var id = extendsID;
  934. while (id !== undefined) {
  935. prototypes.push(id);
  936. id = kernel.prototype(id);
  937. }
  938. return prototypes;
  939. }
  940. function isNodeDefinition(prototypes) {
  941. var found = false;
  942. if (prototypes) {
  943. for (var i = 0; i < prototypes.length && !found; i++) {
  944. found = (prototypes[i] == "http://vwf.example.com/aframe/node.vwf");
  945. }
  946. }
  947. return found;
  948. }
  949. function isAEntityDefinition(prototypes) {
  950. var found = false;
  951. if (prototypes) {
  952. for (var i = 0; i < prototypes.length && !found; i++) {
  953. found = (prototypes[i] == "http://vwf.example.com/aframe/aentity.vwf");
  954. }
  955. }
  956. return found;
  957. }
  958. // Changing this function significantly from the GLGE code
  959. // Will search hierarchy down until encountering a matching child
  960. // Will look into nodes that don't match.... this might not be desirable
  961. function FindChildByName(obj, childName, childType, recursive) {
  962. var child = undefined;
  963. if (recursive) {
  964. // TODO: If the obj itself has the child name, the object will be returned by this function
  965. // I don't think this this desirable.
  966. if (nameTest.call(this, obj, childName)) {
  967. child = obj;
  968. } else if (obj.children && obj.children.length > 0) {
  969. for (var i = 0; i < obj.children.length && child === undefined; i++) {
  970. child = FindChildByName(obj.children[i], childName, childType, true);
  971. }
  972. }
  973. } else {
  974. if (obj.children) {
  975. for (var i = 0; i < obj.children.length && child === undefined; i++) {
  976. if (nameTest.call(this, obj.children[i], childName)) {
  977. child = obj.children[i];
  978. }
  979. }
  980. }
  981. }
  982. return child;
  983. }
  984. function nameTest(obj, name) {
  985. if (obj.name == "") {
  986. return (obj.parent.name + "Child" == name);
  987. } else {
  988. return (obj.name == name || obj.id == name || obj.vwfID == name);
  989. }
  990. }
  991. function httpGet(url) {
  992. return new Promise(function (resolve, reject) {
  993. // do the usual Http request
  994. let request = new XMLHttpRequest();
  995. request.open('GET', url);
  996. request.onload = function () {
  997. if (request.status == 200) {
  998. resolve(request.response);
  999. } else {
  1000. reject(Error(request.statusText));
  1001. }
  1002. };
  1003. request.onerror = function () {
  1004. reject(Error('Network Error'));
  1005. };
  1006. request.send();
  1007. });
  1008. }
  1009. async function httpGetJson(url) {
  1010. // check if the URL looks like a JSON file and call httpGet.
  1011. let regex = /\.(json)$/i;
  1012. if (regex.test(url)) {
  1013. // call the async function, wait for the result
  1014. return await httpGet(url);
  1015. } else {
  1016. throw Error('Bad Url Format');
  1017. }
  1018. }
  1019. function GUID() {
  1020. var S4 = function () {
  1021. return Math.floor(
  1022. Math.random() * 0x10000 /* 65536 */
  1023. ).toString(16);
  1024. };
  1025. return (
  1026. S4() + S4() + "-" +
  1027. S4() + "-" +
  1028. S4() + "-" +
  1029. S4() + "-" +
  1030. S4() + S4() + S4()
  1031. );
  1032. }
  1033. });