ascene.js 29 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139
  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. if (type == "text"){
  513. child.properties.font = "/vwf/model/aframe/fonts/custom-msdf.json"
  514. }
  515. });
  516. }
  517. }
  518. this.createMirror = function (name, node, avatar) {
  519. var position = "0 0 0";
  520. var nodeName = name;
  521. if (!nodeName) {
  522. nodeName = this.GUID();
  523. }
  524. if (avatar) {
  525. let myAvatar = this.children[avatar];
  526. let cursorNode = myAvatar.avatarNode.myHead.myCursor.vis;
  527. if (cursorNode) {
  528. position = cursorNode.worldPosition();
  529. //console.log(position);
  530. }
  531. }
  532. var newNode = this.mirrorProto();
  533. newNode.properties.displayName = "mirror";
  534. var self = this;
  535. if (newNode) {
  536. newNode.properties.position = position;
  537. this.children.create(nodeName, newNode, function( child ) {
  538. if (avatar) child.lookAt(self.children[avatar].worldPosition());
  539. });
  540. }
  541. }
  542. this.createCamera = function (name, node, avatar) {
  543. var position = "0 0 0";
  544. var nodeName = name;
  545. if (!nodeName) {
  546. nodeName = this.GUID();
  547. }
  548. if (avatar) {
  549. let myAvatar = this.children[avatar];
  550. let cursorNode = myAvatar.avatarNode.myHead.myCursor.vis;
  551. if (cursorNode) {
  552. position = cursorNode.worldPosition();
  553. //console.log(position);
  554. }
  555. }
  556. var newNode = this.cameraProto();
  557. newNode.properties.displayName = "camera";
  558. var self = this;
  559. if (newNode) {
  560. newNode.properties.position = position;
  561. this.children.create(nodeName, newNode, function( child ) {
  562. if (avatar) child.lookAt(self.children[avatar].worldPosition());
  563. });
  564. }
  565. }
  566. this.createCameraWithOffset = function (name, node, avatar) {
  567. var position = "0 0 0";
  568. var nodeName = name;
  569. if (!nodeName) {
  570. nodeName = this.GUID();
  571. }
  572. if (avatar) {
  573. let myAvatar = this.children[avatar];
  574. let cursorNode = myAvatar.avatarNode.myHead.myCursor.vis;
  575. if (cursorNode) {
  576. position = cursorNode.worldPosition();
  577. //console.log(position);
  578. }
  579. }
  580. var newNode = this.cameraProtoWithOffset();
  581. newNode.properties.displayName = "cameraWithOffset";
  582. var self = this;
  583. if (newNode) {
  584. newNode.properties.position = position;
  585. this.children.create(nodeName, newNode, function( child ) {
  586. if (avatar) child.lookAt(self.children[avatar].worldPosition());
  587. });
  588. }
  589. }
  590. this.createImage = function (imgSrc, name, node, avatar) {
  591. var self = this;
  592. var position = "0 0 0";
  593. var nodeName = name;
  594. if (!nodeName) {
  595. nodeName = this.GUID();
  596. }
  597. if (avatar) {
  598. let myAvatar = this.children[avatar];
  599. let cursorNode = myAvatar.avatarNode.myHead.myCursor.vis;
  600. if (cursorNode) {
  601. position = cursorNode.worldPosition();
  602. //console.log(position);
  603. }
  604. }
  605. let tagName = 'IMG-ASSET-'+ this.GUID();
  606. let tagNode = {
  607. "extends": "http://vwf.example.com/aframe/a-asset-image-item.vwf",
  608. "properties": {
  609. "itemID": tagName,
  610. "itemSrc": imgSrc
  611. }
  612. }
  613. this.children.create(tagName, tagNode, function( child ) {
  614. var nodeName = 'IMAGE-'+self.GUID();
  615. var position = "0 0 0";
  616. if (avatar) {
  617. let myAvatar = self.children[avatar];
  618. let cursorNode = myAvatar.avatarNode.myHead.myCursor.vis;
  619. if (cursorNode) {
  620. position = cursorNode.worldPosition();
  621. //console.log(position);
  622. }
  623. }
  624. let newNode = self.planeProto();
  625. newNode.properties.displayName = "image";
  626. newNode.children.material.properties.src = '#' + child.itemID;
  627. newNode.properties.position = position;
  628. newNode.properties.scale = [0.003, 0.003, 0.003];
  629. if(child.width && child.height){
  630. newNode.properties.width = child.width;
  631. newNode.properties.height = child.height;
  632. self.children.create(nodeName, newNode, function( child ) {
  633. if (avatar) child.lookAt(self.children[avatar].worldPosition())
  634. });
  635. } else {
  636. let allNodes = vwf.models["vwf/model/aframe"].model.state.nodes;
  637. let imgAssetNode = allNodes[child.id];
  638. imgAssetNode.aframeObj.onload = function(){
  639. // console.log(imgAssetNode);
  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. }
  646. }
  647. });
  648. }
  649. this.createVideo = function (vidSrc, name, node, avatar) {
  650. var self = this;
  651. var position = "0 0 0";
  652. var nodeName = name;
  653. if (!nodeName) {
  654. nodeName = this.GUID();
  655. }
  656. if (avatar) {
  657. let myAvatar = this.children[avatar];
  658. let cursorNode = myAvatar.avatarNode.myHead.myCursor.vis;
  659. if (cursorNode) {
  660. position = cursorNode.worldPosition();
  661. //console.log(position);
  662. }
  663. }
  664. let tagName = 'VIDEO-ASSET-'+ this.GUID();
  665. let tagNode = {
  666. "extends": "http://vwf.example.com/aframe/a-asset-video-item.vwf",
  667. "properties": {
  668. "itemID": tagName,
  669. "itemSrc": vidSrc
  670. }
  671. }
  672. this.children.create(tagName, tagNode, function( child ) {
  673. let nodeName = 'VIDEO-'+self.GUID();
  674. var position = "0 0 0";
  675. if (avatar) {
  676. let myAvatar = self.children[avatar];
  677. let cursorNode = myAvatar.avatarNode.myHead.myCursor.vis;
  678. if (cursorNode) {
  679. position = cursorNode.worldPosition();
  680. //console.log(position);
  681. }
  682. }
  683. let newNode = self.planeProto();
  684. newNode.properties.displayName = "video";
  685. newNode.children.material.properties.src = '#' + child.itemID;
  686. newNode.properties.position = position;
  687. // newNode.properties.width = 3;
  688. // newNode.properties.height = 1.75;
  689. newNode.properties.scale = [0.003, 0.003, 0.003];
  690. if (child.videoWidth && child.videoHeight) {
  691. newNode.properties.width = child.videoWidth;
  692. newNode.properties.height = child.videoHeight;
  693. self.children.create(nodeName, newNode, function( child ) {
  694. if (avatar) child.lookAt(self.children[avatar].worldPosition())
  695. });
  696. } else {
  697. let allNodes = vwf.models["vwf/model/aframe"].model.state.nodes;
  698. let imgAssetNode = allNodes[child.id];
  699. imgAssetNode.aframeObj.onloadeddata = function(){
  700. newNode.properties.width = child.videoWidth;
  701. newNode.properties.height = child.videoHeight;
  702. self.children.create(nodeName, newNode, function( child ) {
  703. if (avatar) child.lookAt(self.children[avatar].worldPosition())
  704. });
  705. }
  706. }
  707. });
  708. }
  709. this.createAudio = function (itemSrc, name, node, avatar) {
  710. var self = this;
  711. var position = "0 0 0";
  712. var nodeName = name;
  713. if (!nodeName) {
  714. nodeName = this.GUID();
  715. }
  716. if (avatar) {
  717. let myAvatar = this.children[avatar];
  718. let cursorNode = myAvatar.avatarNode.myHead.myCursor.vis;
  719. if (cursorNode) {
  720. position = cursorNode.worldPosition();
  721. //console.log(position);
  722. }
  723. }
  724. let tagName = 'AUDIO-ASSET-'+ this.GUID();
  725. let tagNode = {
  726. "extends": "http://vwf.example.com/aframe/a-asset-audio-item.vwf",
  727. "properties": {
  728. "itemID": tagName,
  729. "itemSrc": itemSrc
  730. }
  731. }
  732. this.children.create(tagName, tagNode, function( child ) {
  733. // let allNodes = vwf.models["vwf/model/aframe"].model.state.nodes;
  734. // let itemAssetNode = allNodes[child.id];
  735. // itemAssetNode.aframeObj.onload = function(){
  736. // console.log(itemAssetNode);
  737. let nodeName = 'AUDIO-'+self.GUID();
  738. var position = "0 0 0";
  739. if (avatar) {
  740. let myAvatar = self.children[avatar];
  741. let cursorNode = myAvatar.avatarNode.myHead.myCursor.vis;
  742. if (cursorNode) {
  743. position = cursorNode.worldPosition();
  744. //console.log(position);
  745. }
  746. }
  747. let newNode = self.cubeProto();
  748. newNode.properties.displayName = "audio";
  749. newNode.properties.position = position;
  750. newNode.properties.width = 0.3;
  751. newNode.properties.height = 0.3;
  752. newNode.properties.depth= 0.3;
  753. newNode.children.material.properties.opacity = 0.5;
  754. newNode.children.material.properties.color = "yellow";
  755. newNode.children.sound = {
  756. "extends": "http://vwf.example.com/aframe/a-sound-component.vwf",
  757. "type": "component",
  758. "properties": {
  759. "autoplay": false,
  760. "loop": true,
  761. "isPlaying": false,
  762. "src": '#' + child.itemID
  763. }
  764. };
  765. self.children.create(nodeName, newNode, function( child ) {
  766. if (avatar) child.lookAt(self.children[avatar].worldPosition())
  767. });
  768. // }
  769. });
  770. }
  771. this.createGooglePoly = function(polyID, name, node, avatar){
  772. // all done in aframe view driver
  773. let params = [polyID, name, node, avatar];
  774. this.loadGooglePolyAsset(params)
  775. }
  776. this.loadGooglePolyAsset = function( params ) {
  777. var self = this;
  778. const API_KEY = "AIzaSyCGx2_idlUJ88yW5GBkOllIkyxJyKbEgDk";
  779. const id = params[0];
  780. const avatarID = params[3];
  781. var url = `https://poly.googleapis.com/v1/assets/${id}/?key=${API_KEY}`;
  782. var request = new XMLHttpRequest();
  783. request.open( 'GET', url, true );
  784. request.addEventListener( 'load', function ( event ) {
  785. var asset = JSON.parse( event.target.response );
  786. // asset_name.textContent = asset.displayName;
  787. // asset_author.textContent = asset.authorName;
  788. var format = asset.formats.find( format => { return format.formatType === 'OBJ'; } );
  789. if ( format !== undefined ) {
  790. var obj = format.root;
  791. var mtl = format.resources.find( resource => { return resource.url.endsWith( 'mtl' ) } );
  792. var path = obj.url.slice( 0, obj.url.indexOf( obj.relativePath ) );
  793. //const createOnNodeID = vwf.application();
  794. let mtlName = 'MTL-ASSET-'+ self.GUID();
  795. let mtlNode = {
  796. "extends": "http://vwf.example.com/aframe/a-asset-item.vwf",
  797. "properties": {
  798. "itemID": mtlName,
  799. "itemSrc": mtl.url
  800. }
  801. }
  802. self.children.create(mtlName, mtlNode, function( mtlChild ) {
  803. let objName = 'OBJ-ASSET-'+ self.GUID();
  804. let objNode = {
  805. "extends": "http://vwf.example.com/aframe/a-asset-item.vwf",
  806. "properties": {
  807. "itemID": objName,
  808. "itemSrc": obj.url
  809. }
  810. }
  811. self.children.create(objName, objNode, function( objChild ) {
  812. self.createModelObj(mtlChild.itemID, objChild.itemID, asset.displayName, avatarID);
  813. })
  814. })
  815. }
  816. } );
  817. request.send( null );
  818. }
  819. this.GUID = function () {
  820. var self = this;
  821. var S4 = function () {
  822. return Math.floor(
  823. self.random() * 0x10000 /* 65536 */
  824. ).toString(16);
  825. };
  826. return (
  827. S4() + S4() + "-" +
  828. S4() + "-" +
  829. S4() + "-" +
  830. S4() + "-" +
  831. S4() + S4() + S4()
  832. );
  833. }
  834. this.smallRandomId = function() {
  835. return '_' + this.random().toString(36).substr(2, 9);
  836. }
  837. this.assetImgProto = function () {
  838. let node = {
  839. "extends": "http://vwf.example.com/aframe/a-asset-image-item.vwf",
  840. "properties": {
  841. },
  842. }
  843. return node
  844. }
  845. this.createAssetItemImg = function(){
  846. console.log("create new asset item for img");
  847. let nodeName = "asset-item-img-" + this.smallRandomId();
  848. let newNode = {
  849. "extends": "http://vwf.example.com/aframe/a-asset-image-item.vwf",
  850. "properties": {
  851. itemID: nodeName,
  852. itemSrc: ""
  853. }
  854. }
  855. this.children.create(nodeName, newNode);
  856. }
  857. this.deleteNode = function(nodeName){
  858. let node = this.children[nodeName];
  859. if (node) this.children.delete(node);
  860. }
  861. this.enterVR = function(){
  862. console.log("ENTER VR");
  863. }
  864. this.exitVR = function(){
  865. console.log("EXIT VR");
  866. }