ascene.js 29 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135
  1. this.initialize = function () {
  2. this.future(3).clientWatch();
  3. };
  4. this.clientWatch = function () {
  5. var self = this;
  6. if (this.children.length !== 0) {
  7. var clients = this.find("doc('http://vwf.example.com/clients.vwf')")[0];
  8. if (clients !== undefined) {
  9. //console.log(clients.children);
  10. let clientsArray = [];
  11. clients.children.forEach(function (element) {
  12. clientsArray.push(element.name);
  13. });
  14. this.children.forEach(function (node) {
  15. if (node.id.indexOf('avatar-') != -1) {
  16. if (clientsArray.includes(node.id.slice(7))) {
  17. //console.log(node.id + 'is here!');
  18. } else {
  19. //console.log(node.id + " needed to delete!");
  20. self.children.delete(self.children[node.id]);
  21. //'gearvr-'
  22. let controllerVR = self.children['gearvr-' + node.id.slice(7)];
  23. if (controllerVR) {
  24. self.children.delete(controllerVR);
  25. }
  26. let wmrvR = self.children['wmrvr-right-' + node.id.slice(7)];
  27. if (wmrvR) {
  28. self.children.delete(wmrvR);
  29. }
  30. let wmrvL = self.children['wmrvr-left-' + node.id.slice(7)];
  31. if (wmrvL) {
  32. self.children.delete(wmrvL);
  33. }
  34. }
  35. }
  36. });
  37. }
  38. }
  39. this.future(5).clientWatch();
  40. };
  41. this.sphereProto = function () {
  42. let node = {
  43. "extends": "http://vwf.example.com/aframe/asphere.vwf",
  44. "properties": {
  45. "displayName": "sphere",
  46. "radius": 1,
  47. "class": "intersectable"
  48. },
  49. children: {
  50. "material": {
  51. "extends": "http://vwf.example.com/aframe/aMaterialComponent.vwf",
  52. "type": "component",
  53. "properties":{
  54. "color": "white"
  55. }
  56. },
  57. "interpolation":
  58. {
  59. "extends": "http://vwf.example.com/aframe/interpolation-component.vwf",
  60. "type": "component",
  61. "properties": {
  62. "enabled": true
  63. }
  64. },
  65. "cursor-listener": {
  66. "extends": "http://vwf.example.com/aframe/app-cursor-listener-component.vwf",
  67. "type": "component"
  68. }
  69. },
  70. events: {
  71. "clickEvent": {
  72. "body": ""
  73. }
  74. }
  75. }
  76. return node
  77. }
  78. this.cylinderProto = function () {
  79. let node = {
  80. "extends": "http://vwf.example.com/aframe/acylinder.vwf",
  81. "properties": {
  82. "displayName": "cylinder",
  83. "radius": 1,
  84. "height": 1,
  85. "class": "clickable"
  86. },
  87. children: {
  88. "material": {
  89. "extends": "http://vwf.example.com/aframe/aMaterialComponent.vwf",
  90. "type": "component",
  91. "properties":{
  92. "color": "white"
  93. }
  94. },
  95. "interpolation":
  96. {
  97. "extends": "http://vwf.example.com/aframe/interpolation-component.vwf",
  98. "type": "component",
  99. "properties": {
  100. "enabled": true
  101. }
  102. },
  103. "cursor-listener": {
  104. "extends": "http://vwf.example.com/aframe/app-cursor-listener-component.vwf",
  105. "type": "component"
  106. }
  107. },
  108. events: {
  109. "clickEvent": {
  110. "body": ""
  111. }
  112. }
  113. }
  114. return node
  115. }
  116. this.coneProto = function () {
  117. let node = {
  118. "extends": "http://vwf.example.com/aframe/acone.vwf",
  119. "properties": {
  120. "displayName": "cone",
  121. "radius-bottom": 1,
  122. "radius-top": 0.01,
  123. "height": 1,
  124. "class": "clickable"
  125. },
  126. children: {
  127. "material": {
  128. "extends": "http://vwf.example.com/aframe/aMaterialComponent.vwf",
  129. "type": "component",
  130. "properties":{
  131. "color": "white"
  132. }
  133. },
  134. "interpolation":
  135. {
  136. "extends": "http://vwf.example.com/aframe/interpolation-component.vwf",
  137. "type": "component",
  138. "properties": {
  139. "enabled": true
  140. }
  141. },
  142. "cursor-listener": {
  143. "extends": "http://vwf.example.com/aframe/app-cursor-listener-component.vwf",
  144. "type": "component"
  145. }
  146. },
  147. events: {
  148. "clickEvent": {
  149. "body": ""
  150. }
  151. }
  152. }
  153. return node
  154. }
  155. this.textProto = function () {
  156. let node = {
  157. "extends": "http://vwf.example.com/aframe/atext.vwf",
  158. "properties": {
  159. "displayName": "text",
  160. "color": "white",
  161. "value": "Text",
  162. "side": "double",
  163. "class": "clickable",
  164. "font": "/vwf/model/aframe/fonts/custom-msdf.json",
  165. "negate": false
  166. },
  167. children: {
  168. "interpolation":
  169. {
  170. "extends": "http://vwf.example.com/aframe/interpolation-component.vwf",
  171. "type": "component",
  172. "properties": {
  173. "enabled": true
  174. }
  175. },
  176. "cursor-listener": {
  177. "extends": "http://vwf.example.com/aframe/app-cursor-listener-component.vwf",
  178. "type": "component"
  179. }
  180. },
  181. events: {
  182. "clickEvent": {
  183. "body": ""
  184. }
  185. }
  186. }
  187. return node
  188. }
  189. this.cubeProto = function () {
  190. let node = {
  191. "extends": "http://vwf.example.com/aframe/abox.vwf",
  192. "properties": {
  193. "displayName": "cube",
  194. "height": 1,
  195. "width": 1,
  196. "depth": 1,
  197. "class": "clickable"
  198. },
  199. children: {
  200. "interpolation":
  201. {
  202. "extends": "http://vwf.example.com/aframe/interpolation-component.vwf",
  203. "type": "component",
  204. "properties": {
  205. "enabled": true
  206. }
  207. },
  208. "cursor-listener": {
  209. "extends": "http://vwf.example.com/aframe/app-cursor-listener-component.vwf",
  210. "type": "component"
  211. },
  212. "material": {
  213. "extends": "http://vwf.example.com/aframe/aMaterialComponent.vwf",
  214. "type": "component",
  215. "properties":{
  216. "color": "white"
  217. }
  218. }
  219. },
  220. events: {
  221. "clickEvent": {
  222. "body": ""
  223. }
  224. }
  225. }
  226. return node
  227. }
  228. this.lightProto = function (lightType) {
  229. var newLightType = lightType
  230. if (!newLightType){
  231. newLightType = "directional"
  232. }
  233. let node = {
  234. "extends": "http://vwf.example.com/aframe/alight.vwf",
  235. "properties": {
  236. "displayName": newLightType,
  237. "type": newLightType,
  238. "class": "clickable"
  239. },
  240. children: {
  241. "interpolation":
  242. {
  243. "extends": "http://vwf.example.com/aframe/interpolation-component.vwf",
  244. "type": "component",
  245. "properties": {
  246. "enabled": true
  247. }
  248. },
  249. "cursor-listener": {
  250. "extends": "http://vwf.example.com/aframe/app-cursor-listener-component.vwf",
  251. "type": "component"
  252. }
  253. },
  254. events: {
  255. "clickEvent": {
  256. "body": ""
  257. }
  258. }
  259. }
  260. return node
  261. }
  262. this.mirrorProto = function () {
  263. let newNode = this.cubeProto();
  264. newNode.properties.width = 3;
  265. newNode.properties.height = 4;
  266. newNode.properties.depth= 0.1;
  267. newNode.children.material.properties.color = "white";
  268. newNode.children.mirrorComponent = {
  269. "extends": "http://vwf.example.com/aframe/a-mirror-component.vwf",
  270. "type": "component",
  271. "properties": {
  272. "camera": "avatarControl"
  273. }
  274. }
  275. return newNode
  276. }
  277. this.cameraProto = function () {
  278. let newNode = this.cubeProto();
  279. newNode.properties.width = 0.3;
  280. newNode.properties.height = 0.3;
  281. newNode.properties.depth= 0.5;
  282. newNode.children.material.properties.opacity = 0.5;
  283. newNode.children.material.properties.color = "red";
  284. newNode.children.camera = {
  285. "extends": "http://vwf.example.com/aframe/acamera.vwf",
  286. "properties": {
  287. "look-controls-enabled": false,
  288. "wasd-controls-enabled": false,
  289. "user-height": 0
  290. }
  291. }
  292. return newNode
  293. }
  294. this.cameraProtoWithOffset = function () {
  295. let newNode = this.cubeProto();
  296. newNode.properties.width = 0.3;
  297. newNode.properties.height = 0.3;
  298. newNode.properties.depth= 0.5;
  299. newNode.children.material.properties.opacity = 0.5;
  300. newNode.children.material.properties.color = "red";
  301. newNode.children.camera = {
  302. "extends": "http://vwf.example.com/aframe/acamera.vwf",
  303. "properties": {
  304. "look-controls-enabled": false,
  305. "wasd-controls-enabled": false,
  306. "user-height": 0
  307. },
  308. children: {
  309. viewoffset: {
  310. extends: "http://vwf.example.com/aframe/viewOffsetCamera-component.vwf",
  311. properties: {
  312. }
  313. }
  314. }
  315. }
  316. return newNode
  317. }
  318. this.planeProto = function () {
  319. let node = {
  320. "extends": "http://vwf.example.com/aframe/aplane.vwf",
  321. "properties": {
  322. "displayName": "plane",
  323. "height": 1,
  324. "width": 1,
  325. "class": "clickable"
  326. },
  327. children: {
  328. "material": {
  329. "extends": "http://vwf.example.com/aframe/aMaterialComponent.vwf",
  330. "type": "component",
  331. "properties": {
  332. "side": "double",
  333. "color": "white"
  334. }
  335. },
  336. "interpolation":
  337. {
  338. "extends": "http://vwf.example.com/aframe/interpolation-component.vwf",
  339. "type": "component",
  340. "properties": {
  341. "enabled": true
  342. }
  343. },
  344. "cursor-listener": {
  345. "extends": "http://vwf.example.com/aframe/app-cursor-listener-component.vwf",
  346. "type": "component"
  347. }
  348. },
  349. events: {
  350. "clickEvent": {
  351. "body": ""
  352. }
  353. }
  354. }
  355. return node
  356. }
  357. this.createModelObj = function (mtlSrc, objSrc, name, avatar) {
  358. var self = this;
  359. var position = "0 0 0";
  360. var nodeName = this.GUID();
  361. if (avatar) {
  362. let myAvatar = this.children[avatar];
  363. let cursorNode = myAvatar.avatarNode.myHead.myCursor.vis;
  364. if (cursorNode) {
  365. position = cursorNode.worldPosition();
  366. //console.log(position);
  367. }
  368. }
  369. let modelNode = {
  370. "extends": "http://vwf.example.com/aframe/aobjmodel.vwf",
  371. "properties": {
  372. "src": '#' + objSrc,
  373. "mtl": '#' + mtlSrc,
  374. "position": position
  375. },
  376. children:{
  377. "interpolation":
  378. {
  379. "extends": "http://vwf.example.com/aframe/interpolation-component.vwf",
  380. "type": "component",
  381. "properties": {
  382. "enabled": true
  383. }
  384. }
  385. }
  386. }
  387. if (name) {
  388. modelNode.properties.displayName = name;
  389. }
  390. self.children.create(nodeName, modelNode, function( child ) {
  391. if (avatar) child.lookAt(self.children[avatar].worldPosition())
  392. });
  393. }
  394. this.createModel = function (modelType, modelSrc, avatar) {
  395. var self = this;
  396. let tagName = modelType + '-ASSET-'+ this.GUID();
  397. let tagNode = {
  398. "extends": "http://vwf.example.com/aframe/a-asset-item.vwf",
  399. "properties": {
  400. "itemID": tagName,
  401. "itemSrc": modelSrc
  402. }
  403. }
  404. this.children.create(tagName, tagNode, function( child ) {
  405. let nodeName = modelType + '-MODEL-'+self.GUID();
  406. var position = "0 0 0";
  407. if (avatar) {
  408. let myAvatar = self.children[avatar];
  409. let cursorNode = myAvatar.avatarNode.myHead.myCursor.vis;
  410. if (cursorNode) {
  411. position = cursorNode.worldPosition();
  412. //console.log(position);
  413. }
  414. }
  415. const protos = {
  416. DAE: "http://vwf.example.com/aframe/acolladamodel.vwf",
  417. OBJ: "http://vwf.example.com/aframe/aobjmodel.vwf",
  418. GLTF: "http://vwf.example.com/aframe/agltfmodel.vwf"
  419. }
  420. let extendsName = Object.entries(protos).filter(el => el[0] == modelType)[0];
  421. let modelNode = {
  422. "extends": extendsName[1],
  423. "properties": {
  424. "src": '#' + child.itemID,
  425. "position": position
  426. },
  427. children:{
  428. "interpolation":
  429. {
  430. "extends": "http://vwf.example.com/aframe/interpolation-component.vwf",
  431. "type": "component",
  432. "properties": {
  433. "enabled": true
  434. }
  435. }
  436. }
  437. }
  438. self.children.create(nodeName, modelNode, function( child ) {
  439. if (avatar) child.lookAt(self.children[avatar].worldPosition())
  440. });
  441. });
  442. }
  443. this.createAssetResource = function(resType, resSrc){
  444. var self = this;
  445. const protos = {
  446. IMG: "http://vwf.example.com/aframe/a-asset-image-item.vwf",
  447. AUDIO: "http://vwf.example.com/aframe/a-asset-audio-item.vwf",
  448. VIDEO: "http://vwf.example.com/aframe/a-asset-video-item.vwf",
  449. ITEM: "http://vwf.example.com/aframe/a-asset-item.vwf"
  450. };
  451. let extendsName = Object.entries(protos).filter(el => el[0] == resType)[0];
  452. let tagName = resType + '-ASSET-'+ this.GUID();
  453. let tagNode = {
  454. "extends": extendsName[1],
  455. "properties": {
  456. "itemID": tagName,
  457. "itemSrc": resSrc
  458. }
  459. }
  460. this.children.create(tagName, tagNode);
  461. }
  462. this.createPrimitive = function (type, params, name, node, avatar) {
  463. var position = "0 0 0";
  464. var displayName = name;
  465. let nodeName = this.GUID();
  466. // if (!nodeName) {
  467. // nodeName = this.GUID();
  468. // }
  469. if (avatar) {
  470. let myAvatar = this.children[avatar];
  471. let cursorNode = myAvatar.avatarNode.myHead.myCursor.vis;
  472. if (cursorNode) {
  473. position = cursorNode.worldPosition();
  474. //console.log(position);
  475. }
  476. }
  477. var newNode = {};
  478. switch (type) {
  479. case "cube":
  480. newNode = this.cubeProto();
  481. break;
  482. case "sphere":
  483. newNode = this.sphereProto();
  484. break;
  485. case "plane":
  486. newNode = this.planeProto();
  487. break;
  488. case "light":
  489. newNode = this.lightProto(params);
  490. break;
  491. case "text":
  492. newNode = this.textProto(params);
  493. break;
  494. case "cylinder":
  495. newNode = this.cylinderProto();
  496. break;
  497. case "cone":
  498. newNode = this.coneProto();
  499. break;
  500. default:
  501. newNode = undefined;
  502. break;
  503. }
  504. var self = this;
  505. if (newNode) {
  506. newNode.properties.position = position;
  507. if (displayName) {
  508. newNode.properties.displayName = displayName;
  509. }
  510. this.children.create(nodeName, newNode, function( child ) {
  511. if (avatar) child.lookAt(self.children[avatar].worldPosition());
  512. });
  513. }
  514. }
  515. this.createMirror = function (name, node, avatar) {
  516. var position = "0 0 0";
  517. var nodeName = name;
  518. if (!nodeName) {
  519. nodeName = this.GUID();
  520. }
  521. if (avatar) {
  522. let myAvatar = this.children[avatar];
  523. let cursorNode = myAvatar.avatarNode.myHead.myCursor.vis;
  524. if (cursorNode) {
  525. position = cursorNode.worldPosition();
  526. //console.log(position);
  527. }
  528. }
  529. var newNode = this.mirrorProto();
  530. newNode.properties.displayName = "mirror";
  531. var self = this;
  532. if (newNode) {
  533. newNode.properties.position = position;
  534. this.children.create(nodeName, newNode, function( child ) {
  535. if (avatar) child.lookAt(self.children[avatar].worldPosition());
  536. });
  537. }
  538. }
  539. this.createCamera = function (name, node, avatar) {
  540. var position = "0 0 0";
  541. var nodeName = name;
  542. if (!nodeName) {
  543. nodeName = this.GUID();
  544. }
  545. if (avatar) {
  546. let myAvatar = this.children[avatar];
  547. let cursorNode = myAvatar.avatarNode.myHead.myCursor.vis;
  548. if (cursorNode) {
  549. position = cursorNode.worldPosition();
  550. //console.log(position);
  551. }
  552. }
  553. var newNode = this.cameraProto();
  554. newNode.properties.displayName = "camera";
  555. var self = this;
  556. if (newNode) {
  557. newNode.properties.position = position;
  558. this.children.create(nodeName, newNode, function( child ) {
  559. if (avatar) child.lookAt(self.children[avatar].worldPosition());
  560. });
  561. }
  562. }
  563. this.createCameraWithOffset = function (name, node, avatar) {
  564. var position = "0 0 0";
  565. var nodeName = name;
  566. if (!nodeName) {
  567. nodeName = this.GUID();
  568. }
  569. if (avatar) {
  570. let myAvatar = this.children[avatar];
  571. let cursorNode = myAvatar.avatarNode.myHead.myCursor.vis;
  572. if (cursorNode) {
  573. position = cursorNode.worldPosition();
  574. //console.log(position);
  575. }
  576. }
  577. var newNode = this.cameraProtoWithOffset();
  578. newNode.properties.displayName = "cameraWithOffset";
  579. var self = this;
  580. if (newNode) {
  581. newNode.properties.position = position;
  582. this.children.create(nodeName, newNode, function( child ) {
  583. if (avatar) child.lookAt(self.children[avatar].worldPosition());
  584. });
  585. }
  586. }
  587. this.createImage = function (imgSrc, name, node, avatar) {
  588. var self = this;
  589. var position = "0 0 0";
  590. var nodeName = name;
  591. if (!nodeName) {
  592. nodeName = this.GUID();
  593. }
  594. if (avatar) {
  595. let myAvatar = this.children[avatar];
  596. let cursorNode = myAvatar.avatarNode.myHead.myCursor.vis;
  597. if (cursorNode) {
  598. position = cursorNode.worldPosition();
  599. //console.log(position);
  600. }
  601. }
  602. let tagName = 'IMG-ASSET-'+ this.GUID();
  603. let tagNode = {
  604. "extends": "http://vwf.example.com/aframe/a-asset-image-item.vwf",
  605. "properties": {
  606. "itemID": tagName,
  607. "itemSrc": imgSrc
  608. }
  609. }
  610. this.children.create(tagName, tagNode, function( child ) {
  611. var nodeName = 'IMAGE-'+self.GUID();
  612. var position = "0 0 0";
  613. if (avatar) {
  614. let myAvatar = self.children[avatar];
  615. let cursorNode = myAvatar.avatarNode.myHead.myCursor.vis;
  616. if (cursorNode) {
  617. position = cursorNode.worldPosition();
  618. //console.log(position);
  619. }
  620. }
  621. let newNode = self.planeProto();
  622. newNode.properties.displayName = "image";
  623. newNode.children.material.properties.src = '#' + child.itemID;
  624. newNode.properties.position = position;
  625. newNode.properties.scale = [0.003, 0.003, 0.003];
  626. if(child.width && child.height){
  627. newNode.properties.width = child.width;
  628. newNode.properties.height = child.height;
  629. self.children.create(nodeName, newNode, function( child ) {
  630. if (avatar) child.lookAt(self.children[avatar].worldPosition())
  631. });
  632. } else {
  633. let allNodes = vwf.models["vwf/model/aframe"].model.state.nodes;
  634. let imgAssetNode = allNodes[child.id];
  635. imgAssetNode.aframeObj.onload = function(){
  636. // console.log(imgAssetNode);
  637. newNode.properties.width = child.width;
  638. newNode.properties.height = child.height;
  639. self.children.create(nodeName, newNode, function( child ) {
  640. if (avatar) child.lookAt(self.children[avatar].worldPosition())
  641. });
  642. }
  643. }
  644. });
  645. }
  646. this.createVideo = function (vidSrc, name, node, avatar) {
  647. var self = this;
  648. var position = "0 0 0";
  649. var nodeName = name;
  650. if (!nodeName) {
  651. nodeName = this.GUID();
  652. }
  653. if (avatar) {
  654. let myAvatar = this.children[avatar];
  655. let cursorNode = myAvatar.avatarNode.myHead.myCursor.vis;
  656. if (cursorNode) {
  657. position = cursorNode.worldPosition();
  658. //console.log(position);
  659. }
  660. }
  661. let tagName = 'VIDEO-ASSET-'+ this.GUID();
  662. let tagNode = {
  663. "extends": "http://vwf.example.com/aframe/a-asset-video-item.vwf",
  664. "properties": {
  665. "itemID": tagName,
  666. "itemSrc": vidSrc
  667. }
  668. }
  669. this.children.create(tagName, tagNode, function( child ) {
  670. let nodeName = 'VIDEO-'+self.GUID();
  671. var position = "0 0 0";
  672. if (avatar) {
  673. let myAvatar = self.children[avatar];
  674. let cursorNode = myAvatar.avatarNode.myHead.myCursor.vis;
  675. if (cursorNode) {
  676. position = cursorNode.worldPosition();
  677. //console.log(position);
  678. }
  679. }
  680. let newNode = self.planeProto();
  681. newNode.properties.displayName = "video";
  682. newNode.children.material.properties.src = '#' + child.itemID;
  683. newNode.properties.position = position;
  684. // newNode.properties.width = 3;
  685. // newNode.properties.height = 1.75;
  686. newNode.properties.scale = [0.003, 0.003, 0.003];
  687. if (child.videoWidth && child.videoHeight) {
  688. newNode.properties.width = child.videoWidth;
  689. newNode.properties.height = child.videoHeight;
  690. self.children.create(nodeName, newNode, function( child ) {
  691. if (avatar) child.lookAt(self.children[avatar].worldPosition())
  692. });
  693. } else {
  694. let allNodes = vwf.models["vwf/model/aframe"].model.state.nodes;
  695. let imgAssetNode = allNodes[child.id];
  696. imgAssetNode.aframeObj.onloadeddata = function(){
  697. newNode.properties.width = child.videoWidth;
  698. newNode.properties.height = child.videoHeight;
  699. self.children.create(nodeName, newNode, function( child ) {
  700. if (avatar) child.lookAt(self.children[avatar].worldPosition())
  701. });
  702. }
  703. }
  704. });
  705. }
  706. this.createAudio = function (itemSrc, name, node, avatar) {
  707. var self = this;
  708. var position = "0 0 0";
  709. var nodeName = name;
  710. if (!nodeName) {
  711. nodeName = this.GUID();
  712. }
  713. if (avatar) {
  714. let myAvatar = this.children[avatar];
  715. let cursorNode = myAvatar.avatarNode.myHead.myCursor.vis;
  716. if (cursorNode) {
  717. position = cursorNode.worldPosition();
  718. //console.log(position);
  719. }
  720. }
  721. let tagName = 'AUDIO-ASSET-'+ this.GUID();
  722. let tagNode = {
  723. "extends": "http://vwf.example.com/aframe/a-asset-audio-item.vwf",
  724. "properties": {
  725. "itemID": tagName,
  726. "itemSrc": itemSrc
  727. }
  728. }
  729. this.children.create(tagName, tagNode, function( child ) {
  730. // let allNodes = vwf.models["vwf/model/aframe"].model.state.nodes;
  731. // let itemAssetNode = allNodes[child.id];
  732. // itemAssetNode.aframeObj.onload = function(){
  733. // console.log(itemAssetNode);
  734. let nodeName = 'AUDIO-'+self.GUID();
  735. var position = "0 0 0";
  736. if (avatar) {
  737. let myAvatar = self.children[avatar];
  738. let cursorNode = myAvatar.avatarNode.myHead.myCursor.vis;
  739. if (cursorNode) {
  740. position = cursorNode.worldPosition();
  741. //console.log(position);
  742. }
  743. }
  744. let newNode = self.cubeProto();
  745. newNode.properties.displayName = "audio";
  746. newNode.properties.position = position;
  747. newNode.properties.width = 0.3;
  748. newNode.properties.height = 0.3;
  749. newNode.properties.depth= 0.3;
  750. newNode.children.material.properties.opacity = 0.5;
  751. newNode.children.material.properties.color = "yellow";
  752. newNode.children.sound = {
  753. "extends": "http://vwf.example.com/aframe/a-sound-component.vwf",
  754. "type": "component",
  755. "properties": {
  756. "autoplay": false,
  757. "loop": true,
  758. "isPlaying": false,
  759. "src": '#' + child.itemID
  760. }
  761. };
  762. self.children.create(nodeName, newNode, function( child ) {
  763. if (avatar) child.lookAt(self.children[avatar].worldPosition())
  764. });
  765. // }
  766. });
  767. }
  768. this.createGooglePoly = function(polyID, name, node, avatar){
  769. // all done in aframe view driver
  770. let params = [polyID, name, node, avatar];
  771. this.loadGooglePolyAsset(params)
  772. }
  773. this.loadGooglePolyAsset = function( params ) {
  774. var self = this;
  775. const API_KEY = "AIzaSyCGx2_idlUJ88yW5GBkOllIkyxJyKbEgDk";
  776. const id = params[0];
  777. const avatarID = params[3];
  778. var url = `https://poly.googleapis.com/v1/assets/${id}/?key=${API_KEY}`;
  779. var request = new XMLHttpRequest();
  780. request.open( 'GET', url, true );
  781. request.addEventListener( 'load', function ( event ) {
  782. var asset = JSON.parse( event.target.response );
  783. // asset_name.textContent = asset.displayName;
  784. // asset_author.textContent = asset.authorName;
  785. var format = asset.formats.find( format => { return format.formatType === 'OBJ'; } );
  786. if ( format !== undefined ) {
  787. var obj = format.root;
  788. var mtl = format.resources.find( resource => { return resource.url.endsWith( 'mtl' ) } );
  789. var path = obj.url.slice( 0, obj.url.indexOf( obj.relativePath ) );
  790. //const createOnNodeID = vwf.application();
  791. let mtlName = 'MTL-ASSET-'+ self.GUID();
  792. let mtlNode = {
  793. "extends": "http://vwf.example.com/aframe/a-asset-item.vwf",
  794. "properties": {
  795. "itemID": mtlName,
  796. "itemSrc": mtl.url
  797. }
  798. }
  799. self.children.create(mtlName, mtlNode, function( mtlChild ) {
  800. let objName = 'OBJ-ASSET-'+ self.GUID();
  801. let objNode = {
  802. "extends": "http://vwf.example.com/aframe/a-asset-item.vwf",
  803. "properties": {
  804. "itemID": objName,
  805. "itemSrc": obj.url
  806. }
  807. }
  808. self.children.create(objName, objNode, function( objChild ) {
  809. self.createModelObj(mtlChild.itemID, objChild.itemID, asset.displayName, avatarID);
  810. })
  811. })
  812. }
  813. } );
  814. request.send( null );
  815. }
  816. this.GUID = function () {
  817. var self = this;
  818. var S4 = function () {
  819. return Math.floor(
  820. self.random() * 0x10000 /* 65536 */
  821. ).toString(16);
  822. };
  823. return (
  824. S4() + S4() + "-" +
  825. S4() + "-" +
  826. S4() + "-" +
  827. S4() + "-" +
  828. S4() + S4() + S4()
  829. );
  830. }
  831. this.smallRandomId = function() {
  832. return '_' + this.random().toString(36).substr(2, 9);
  833. }
  834. this.assetImgProto = function () {
  835. let node = {
  836. "extends": "http://vwf.example.com/aframe/a-asset-image-item.vwf",
  837. "properties": {
  838. },
  839. }
  840. return node
  841. }
  842. this.createAssetItemImg = function(){
  843. console.log("create new asset item for img");
  844. let nodeName = "asset-item-img-" + this.smallRandomId();
  845. let newNode = {
  846. "extends": "http://vwf.example.com/aframe/a-asset-image-item.vwf",
  847. "properties": {
  848. itemID: nodeName,
  849. itemSrc: ""
  850. }
  851. }
  852. this.children.create(nodeName, newNode);
  853. }
  854. this.deleteNode = function(nodeName){
  855. let node = this.children[nodeName];
  856. if (node) this.children.delete(node);
  857. }
  858. this.enterVR = function(){
  859. console.log("ENTER VR");
  860. }
  861. this.exitVR = function(){
  862. console.log("EXIT VR");
  863. }