aframe.js 31 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804
  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. return model.load(module, {
  23. // == Module Definition ====================================================================
  24. // -- initialize ---------------------------------------------------------------------------
  25. initialize: function () {
  26. self = this;
  27. this.state = {
  28. nodes: {},
  29. scenes: {},
  30. prototypes: {},
  31. createLocalNode: function (nodeID, childID, childExtendsID, childImplementsIDs,
  32. childSource, childType, childIndex, childName, callback) {
  33. return {
  34. "parentID": nodeID,
  35. "ID": childID,
  36. "extendsID": childExtendsID,
  37. "implementsIDs": childImplementsIDs,
  38. "source": childSource,
  39. "type": childType,
  40. "name": childName,
  41. "prototypes": undefined,
  42. "aframeObj": undefined,
  43. "scene": undefined
  44. };
  45. },
  46. isAFrameClass: function (prototypes, classID) {
  47. if (prototypes) {
  48. for (var i = 0; i < prototypes.length; i++) {
  49. if (prototypes[i] === classID) {
  50. //console.info( "prototypes[ i ]: " + prototypes[ i ] );
  51. return true;
  52. }
  53. }
  54. }
  55. return false;
  56. },
  57. isAFrameComponent: function (prototypes) {
  58. var found = false;
  59. if (prototypes) {
  60. for (var i = 0; i < prototypes.length && !found; i++) {
  61. found = (prototypes[i] === "http://vwf.example.com/aframe/node.vwf");
  62. }
  63. }
  64. return found;
  65. }
  66. };
  67. this.state.kernel = this.kernel.kernel.kernel;
  68. },
  69. // == Model API ============================================================================
  70. // -- creatingNode -------------------------------------------------------------------------
  71. creatingNode: function (nodeID, childID, childExtendsID, childImplementsIDs,
  72. childSource, childType, childIndex, childName, callback /* ( ready ) */) {
  73. // If the parent nodeID is 0, this node is attached directly to the root and is therefore either
  74. // the scene or a prototype. In either of those cases, save the uri of the new node
  75. var childURI = (nodeID === 0 ? childIndex : undefined);
  76. var appID = this.kernel.application();
  77. // If the node being created is a prototype, construct it and add it to the array of prototypes,
  78. // and then return
  79. var prototypeID = utility.ifPrototypeGetId(appID, this.state.prototypes, nodeID, childID);
  80. if (prototypeID !== undefined) {
  81. this.state.prototypes[prototypeID] = {
  82. parentID: nodeID,
  83. ID: childID,
  84. extendsID: childExtendsID,
  85. implementsID: childImplementsIDs,
  86. source: childSource,
  87. type: childType,
  88. name: childName
  89. };
  90. return;
  91. }
  92. var protos = getPrototypes(this.kernel, childExtendsID);
  93. //var kernel = this.kernel.kernel.kernel;
  94. var node;
  95. if (this.state.isAFrameComponent(protos)) {
  96. // Create the local copy of the node properties
  97. if (this.state.nodes[childID] === undefined) {
  98. this.state.nodes[childID] = this.state.createLocalNode(nodeID, childID, childExtendsID, childImplementsIDs,
  99. childSource, childType, childIndex, childName, callback);
  100. }
  101. node = this.state.nodes[childID];
  102. node.prototypes = protos;
  103. node.aframeObj = createAFrameObject(node);
  104. addNodeToHierarchy(node);
  105. //notifyDriverOfPrototypeAndBehaviorProps();
  106. }
  107. },
  108. // -- initializingProperty -----------------------------------------------------------------
  109. initializingProperty: function (nodeID, propertyName, propertyValue) {
  110. var value = undefined;
  111. var node = this.state.nodes[nodeID];
  112. if (node !== undefined) {
  113. value = this.settingProperty(nodeID, propertyName, propertyValue);
  114. }
  115. return value;
  116. },
  117. // -- creatingProperty ---------------------------------------------------------------------
  118. creatingProperty: function (nodeID, propertyName, propertyValue) {
  119. return this.initializingProperty(nodeID, propertyName, propertyValue);
  120. },
  121. // -- deletingNode -------------------------------------------------------------------------
  122. //deletingNode: function( nodeID ) {
  123. //},
  124. // -- deletingNode -------------------------------------------------------------------------
  125. deletingNode: function( nodeID ) {
  126. if ( this.state.nodes[ nodeID ] !== undefined ) {
  127. var node = this.state.nodes[ nodeID ];
  128. if ( node.aframeObj !== undefined ) {
  129. // removes and destroys object
  130. node.aframeObj.parentNode.removeChild(node.aframeObj);
  131. node.aframeObj = undefined;
  132. }
  133. delete this.state.nodes[ nodeID ];
  134. }
  135. },
  136. // -- settingProperty ----------------------------------------------------------------------
  137. settingProperty: function (nodeID, propertyName, propertyValue) {
  138. var node = this.state.nodes[nodeID];
  139. var value = undefined;
  140. if (node && node.aframeObj && utility.validObject(propertyValue)) {
  141. var aframeObject = node.aframeObj;
  142. if (isNodeDefinition(node.prototypes)) {
  143. // 'id' will be set to the nodeID
  144. value = propertyValue;
  145. switch (propertyName) {
  146. default:
  147. value = undefined;
  148. break;
  149. }
  150. }
  151. if ( value === undefined && isAEntityDefinition( node.prototypes ) ) {
  152. value = propertyValue;
  153. switch ( propertyName ) {
  154. case "position":
  155. aframeObject.setAttribute('position', { x: propertyValue[0], y: propertyValue[1], z: propertyValue[2] });
  156. break;
  157. case "rotation":
  158. aframeObject.setAttribute('rotation', { x: propertyValue[0], y: propertyValue[1], z: propertyValue[2] });
  159. break;
  160. case "scale":
  161. aframeObject.setAttribute('scale', { x: propertyValue[0], y: propertyValue[1], z: propertyValue[2] });
  162. break;
  163. case "color":
  164. aframeObject.setAttribute('color', propertyValue);
  165. break;
  166. case "fog":
  167. aframeObject.setAttribute('material','fog', propertyValue);
  168. break;
  169. case "wireframe":
  170. aframeObject.setAttribute('wireframe', propertyValue);
  171. break;
  172. case "wireframe-linewidth":
  173. aframeObject.setAttribute('wireframeLinewidth', propertyValue);
  174. break;
  175. // case "clickable":
  176. // value = propertyValue;
  177. // break;
  178. // case "clickable":
  179. // if (propertyValue) {
  180. // aframeObject.addEventListener('click', function (evt) {
  181. // vwf_view.kernel.fireEvent(node.ID, "clickEvent");
  182. // });
  183. // }
  184. // break;
  185. case "src":
  186. aframeObject.setAttribute('src', propertyValue);
  187. break;
  188. case "repeat":
  189. aframeObject.setAttribute('repeat', propertyValue);
  190. break;
  191. default:
  192. value = undefined;
  193. break;
  194. }
  195. }
  196. if ( value === undefined && aframeObject.nodeName == "A-TEXT" ) {
  197. value = propertyValue;
  198. switch ( propertyName ) {
  199. case "value":
  200. aframeObject.setAttribute('value', propertyValue);
  201. break;
  202. case "color":
  203. aframeObject.setAttribute('color', propertyValue);
  204. break;
  205. case "side":
  206. aframeObject.setAttribute('side', propertyValue);
  207. break;
  208. default:
  209. value = undefined;
  210. break;
  211. }
  212. }
  213. if ( value === undefined && aframeObject.nodeName == "A-SCENE" ) {
  214. value = propertyValue;
  215. switch ( propertyName ) {
  216. case "fog":
  217. aframeObject.setAttribute('fog', propertyValue);
  218. break;
  219. case "assets":
  220. var assetsElement = document.createElement('a-assets');
  221. aframeObject.appendChild(assetsElement);
  222. if (propertyValue) {
  223. httpGetJson(propertyValue).then(function (response) {
  224. console.log(JSON.parse(response));
  225. let assets = JSON.parse(response);
  226. for (var prop in assets) {
  227. var elm = document.createElement(assets[prop].tag);
  228. elm.setAttribute('id', prop);
  229. elm.setAttribute('src', assets[prop].src);
  230. assetsElement.appendChild(elm);
  231. }
  232. }).catch(function (error) {
  233. console.log(error);
  234. });
  235. }
  236. break;
  237. default:
  238. value = undefined;
  239. break;
  240. }
  241. }
  242. if ( value === undefined && aframeObject.nodeName == "A-BOX") {
  243. value = propertyValue;
  244. switch ( propertyName ) {
  245. case "depth":
  246. aframeObject.setAttribute('depth', propertyValue);
  247. break;
  248. case "height":
  249. aframeObject.setAttribute('height', propertyValue);
  250. break;
  251. case "width":
  252. aframeObject.setAttribute('width', propertyValue);
  253. break;
  254. default:
  255. value = undefined;
  256. break;
  257. }
  258. }
  259. if ( value === undefined && aframeObject.nodeName == "A-LIGHT" ) {
  260. value = propertyValue;
  261. switch ( propertyName ) {
  262. //"angle", "color", "decay", "distance", "ground-color", "intensity", "penumbra", "type", "target"
  263. case "color":
  264. aframeObject.setAttribute('color', propertyValue);
  265. break;
  266. case "type":
  267. aframeObject.setAttribute('type', propertyValue);
  268. break;
  269. case "intensity":
  270. aframeObject.setAttribute('intensity', propertyValue);
  271. break;
  272. case "distance":
  273. aframeObject.setAttribute('distance', propertyValue);
  274. break;
  275. default:
  276. value = undefined;
  277. break;
  278. }
  279. }
  280. if ( value === undefined && aframeObject.nodeName == "A-COLLADA-MODEL") {
  281. value = propertyValue;
  282. switch ( propertyName ) {
  283. case "src":
  284. aframeObject.setAttribute('src', propertyValue);
  285. break;
  286. default:
  287. value = undefined;
  288. break;
  289. }
  290. }
  291. if ( value === undefined && aframeObject.nodeName == "A-PLANE") {
  292. value = propertyValue;
  293. switch ( propertyName ) {
  294. case "height":
  295. aframeObject.setAttribute('height', propertyValue);
  296. break;
  297. case "width":
  298. aframeObject.setAttribute('width', propertyValue);
  299. break;
  300. default:
  301. value = undefined;
  302. break;
  303. }
  304. }
  305. if (value === undefined && aframeObject.nodeName == "A-SPHERE") {
  306. value = propertyValue;
  307. switch (propertyName) {
  308. case "radius":
  309. aframeObject.setAttribute('radius', propertyValue);
  310. break;
  311. default:
  312. value = undefined;
  313. break;
  314. }
  315. }
  316. if (value === undefined && aframeObject.nodeName == "A-CAMERA") {
  317. value = propertyValue;
  318. switch (propertyName) {
  319. case "look-controls-enabled":
  320. aframeObject.setAttribute('look-controls', 'enabled', propertyValue);
  321. break;
  322. case "forAvatar":
  323. if (propertyValue) {
  324. aframeObject.addEventListener('componentchanged', function (evt) {
  325. if (evt.detail.name === 'position') {
  326. self.kernel.fireEvent(node.ID, "setAvatarPosition", evt.detail.newData);
  327. }
  328. if (evt.detail.name === 'rotation') {
  329. self.kernel.fireEvent(node.ID, "setAvatarRotation", evt.detail.newData);
  330. //console.log('Entity has moved from', evt.detail.oldData, 'to', evt.detail.newData, '!');
  331. }
  332. });
  333. }
  334. break;
  335. default:
  336. value = undefined;
  337. break;
  338. }
  339. }
  340. //if (!aframeObject) return value;
  341. //if (propertyValue !== undefined) {
  342. //self = this;
  343. }
  344. return value;
  345. },
  346. // -- gettingProperty ----------------------------------------------------------------------
  347. gettingProperty: function (nodeID, propertyName, propertyValue) {
  348. var node = this.state.nodes[nodeID];
  349. var value = undefined;
  350. if (node && node.aframeObj) {
  351. var aframeObject = node.aframeObj;
  352. if (isNodeDefinition(node.prototypes)) {
  353. switch ( propertyName ) {
  354. }
  355. }
  356. if ( value === undefined && isAEntityDefinition( node.prototypes ) ) {
  357. switch ( propertyName ) {
  358. case "position":
  359. var pos = aframeObject.getAttribute('position');
  360. if ( pos !== undefined ){
  361. value = [pos.x, pos.y, pos.z];
  362. }
  363. break;
  364. case "scale":
  365. var scale = aframeObject.getAttribute('scale');
  366. if ( scale !== undefined ){
  367. value = [scale.x, scale.y, scale.z];
  368. }
  369. break;
  370. case "rotation":
  371. var rot = aframeObject.getAttribute('rotation');
  372. if ( rot !== undefined ){
  373. value = [rot.x, rot.y, rot.z];
  374. }
  375. break;
  376. case "color":
  377. value = aframeObject.getAttribute('color');
  378. break;
  379. case "fog":
  380. if (aframeObject.getAttribute('material')){
  381. value = aframeObject.getAttribute('material').fog;
  382. }
  383. break;
  384. case "wireframe":
  385. value = aframeObject.getAttribute('wireframe');
  386. break;
  387. case "wireframe-linewidth":
  388. value = aframeObject.getAttribute('wireframeLinewidth');
  389. break;
  390. // case "clickable":
  391. // value = propertyValue;
  392. // break;
  393. case "src":
  394. value = aframeObject.getAttribute('src');
  395. break;
  396. case "repeat":
  397. value = aframeObject.getAttribute('repeat');
  398. }
  399. }
  400. if ( value === undefined && aframeObject.nodeName == "A-SCENE" ) {
  401. switch ( propertyName ) {
  402. case "fog":
  403. value = aframeObject.getAttribute('fog');
  404. break;
  405. }
  406. }
  407. if ( value === undefined && aframeObject.nodeName == "A-BOX" ) {
  408. switch ( propertyName ) {
  409. case "depth":
  410. value = aframeObject.getAttribute('depth');
  411. break;
  412. case "height":
  413. value = aframeObject.getAttribute('height');
  414. break;
  415. case "width":
  416. value = aframeObject.getAttribute('width');
  417. break;
  418. }
  419. }
  420. if ( value === undefined && aframeObject.nodeName == "A-LIGHT" ) {
  421. //"angle", "color", "decay", "distance", "ground-color", "intensity", "penumbra", "type", "target"
  422. switch (propertyName) {
  423. case "color":
  424. value = aframeObject.getAttribute('color');
  425. break;
  426. case "type":
  427. value = aframeObject.getAttribute('type');
  428. break;
  429. case "distance":
  430. value = aframeObject.getAttribute('distance');
  431. break;
  432. case "intensity":
  433. value = aframeObject.getAttribute('intensity');
  434. break;
  435. }
  436. }
  437. if ( value === undefined && aframeObject.nodeName == "A-PLANE" ) {
  438. switch (propertyName) {
  439. case "height":
  440. value = aframeObject.getAttribute('height');
  441. break;
  442. case "width":
  443. value = aframeObject.getAttribute('width');
  444. break;
  445. }
  446. }
  447. if ( value === undefined && aframeObject.nodeName == "A-SPHERE" ) {
  448. switch (propertyName) {
  449. case "radius":
  450. value = aframeObject.getAttribute('radius');
  451. break;
  452. }
  453. }
  454. if ( value === undefined && aframeObject.nodeName == "A-TEXT" ) {
  455. switch (propertyName) {
  456. case "value":
  457. value = aframeObject.getAttribute('value');
  458. break;
  459. case "color":
  460. value = aframeObject.getAttribute('color');
  461. break;
  462. case "side":
  463. value = aframeObject.getAttribute('side');
  464. break;
  465. }
  466. }
  467. if ( value === undefined && aframeObject.nodeName == "A-CAMERA" ) {
  468. switch (propertyName) {
  469. case "look-controls-enabled":
  470. value = aframeObject.getAttribute('look-controls').enabled;
  471. break;
  472. }
  473. }
  474. if ( value === undefined && aframeObject.nodeName == "A-COLLADA-MODEL" ) {
  475. switch (propertyName) {
  476. case "src":
  477. value = aframeObject.getAttribute('src');
  478. break;
  479. }
  480. }
  481. }
  482. if ( value !== undefined ) {
  483. propertyValue = value;
  484. }
  485. return value;
  486. }
  487. });
  488. function createAFrameObject(node, config) {
  489. var protos = node.prototypes;
  490. var aframeObj = undefined;
  491. if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/ascene.vwf")) {
  492. aframeObj = document.createElement('a-scene');
  493. self.state.scenes[node.ID] = aframeObj;
  494. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/acamera.vwf")) {
  495. aframeObj = document.createElement('a-camera');
  496. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/alight.vwf")) {
  497. aframeObj = document.createElement('a-light');
  498. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/acursor.vwf")) {
  499. aframeObj = document.createElement('a-cursor');
  500. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/asky.vwf")) {
  501. aframeObj = document.createElement('a-sky');
  502. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/abox.vwf")) {
  503. aframeObj = document.createElement('a-box');
  504. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/aplane.vwf")) {
  505. aframeObj = document.createElement('a-plane');
  506. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/atext.vwf")) {
  507. aframeObj = document.createElement('a-text');
  508. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/acolladamodel.vwf")) {
  509. aframeObj = document.createElement('a-collada-model');
  510. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/asphere.vwf")) {
  511. aframeObj = document.createElement('a-sphere');
  512. } else if (self.state.isAFrameClass(protos, "http://vwf.example.com/aframe/aentity.vwf")) {
  513. aframeObj = document.createElement('a-entity');
  514. }
  515. return aframeObj;
  516. }
  517. function addNodeToHierarchy(node) {
  518. if (node.aframeObj) {
  519. if (self.state.nodes[node.parentID] !== undefined) {
  520. var parent = self.state.nodes[node.parentID];
  521. if (parent.aframeObj) {
  522. if (parent.children === undefined) {
  523. parent.children = [];
  524. }
  525. parent.children.push(node.ID);
  526. //console.info( "Adding child: " + childID + " to " + nodeID );
  527. parent.aframeObj.appendChild(node.aframeObj);
  528. }
  529. }
  530. if (node.aframeObj.nodeName !== "A-SCENE") {
  531. node.scene = self.state.scenes[self.kernel.application()];
  532. }
  533. }
  534. }
  535. function getPrototypes(kernel, extendsID) {
  536. var prototypes = [];
  537. var id = extendsID;
  538. while (id !== undefined) {
  539. prototypes.push(id);
  540. id = kernel.prototype(id);
  541. }
  542. return prototypes;
  543. }
  544. function isNodeDefinition(prototypes) {
  545. var found = false;
  546. if (prototypes) {
  547. for (var i = 0; i < prototypes.length && !found; i++) {
  548. found = (prototypes[i] == "http://vwf.example.com/aframe/node.vwf");
  549. }
  550. }
  551. return found;
  552. }
  553. function isAEntityDefinition( prototypes ) {
  554. var found = false;
  555. if ( prototypes ) {
  556. for ( var i = 0; i < prototypes.length && !found; i++ ) {
  557. found = ( prototypes[i] == "http://vwf.example.com/aframe/aentity.vwf" );
  558. }
  559. }
  560. return found;
  561. }
  562. // Changing this function significantly from the GLGE code
  563. // Will search hierarchy down until encountering a matching child
  564. // Will look into nodes that don't match.... this might not be desirable
  565. function FindChildByName(obj, childName, childType, recursive) {
  566. var child = undefined;
  567. if (recursive) {
  568. // TODO: If the obj itself has the child name, the object will be returned by this function
  569. // I don't think this this desirable.
  570. if (nameTest.call(this, obj, childName)) {
  571. child = obj;
  572. } else if (obj.children && obj.children.length > 0) {
  573. for (var i = 0; i < obj.children.length && child === undefined; i++) {
  574. child = FindChildByName(obj.children[i], childName, childType, true);
  575. }
  576. }
  577. } else {
  578. if (obj.children) {
  579. for (var i = 0; i < obj.children.length && child === undefined; i++) {
  580. if (nameTest.call(this, obj.children[i], childName)) {
  581. child = obj.children[i];
  582. }
  583. }
  584. }
  585. }
  586. return child;
  587. }
  588. function nameTest(obj, name) {
  589. if (obj.name == "") {
  590. return (obj.parent.name + "Child" == name);
  591. } else {
  592. return (obj.name == name || obj.id == name || obj.vwfID == name);
  593. }
  594. }
  595. function httpGet(url) {
  596. return new Promise(function (resolve, reject) {
  597. // do the usual Http request
  598. let request = new XMLHttpRequest();
  599. request.open('GET', url);
  600. request.onload = function () {
  601. if (request.status == 200) {
  602. resolve(request.response);
  603. } else {
  604. reject(Error(request.statusText));
  605. }
  606. };
  607. request.onerror = function () {
  608. reject(Error('Network Error'));
  609. };
  610. request.send();
  611. });
  612. }
  613. async function httpGetJson(url) {
  614. // check if the URL looks like a JSON file and call httpGet.
  615. let regex = /\.(json)$/i;
  616. if (regex.test(url)) {
  617. // call the async function, wait for the result
  618. return await httpGet(url);
  619. } else {
  620. throw Error('Bad Url Format');
  621. }
  622. }
  623. });