ascene.js 30 KB

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