hexa-viewer-communicator
Version:
A simple API for <hexa-viewer>
642 lines (640 loc) • 36.8 kB
JavaScript
"use strict";
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
var _viewerCommunicator = require("./viewer-communicator");
var _viewerCommunicator2 = require("./interfaces/viewer-communicator.interface");
function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return e; }; var t, e = {}, r = Object.prototype, n = r.hasOwnProperty, o = Object.defineProperty || function (t, e, r) { t[e] = r.value; }, i = "function" == typeof Symbol ? Symbol : {}, a = i.iterator || "@@iterator", c = i.asyncIterator || "@@asyncIterator", u = i.toStringTag || "@@toStringTag"; function define(t, e, r) { return Object.defineProperty(t, e, { value: r, enumerable: !0, configurable: !0, writable: !0 }), t[e]; } try { define({}, ""); } catch (t) { define = function define(t, e, r) { return t[e] = r; }; } function wrap(t, e, r, n) { var i = e && e.prototype instanceof Generator ? e : Generator, a = Object.create(i.prototype), c = new Context(n || []); return o(a, "_invoke", { value: makeInvokeMethod(t, r, c) }), a; } function tryCatch(t, e, r) { try { return { type: "normal", arg: t.call(e, r) }; } catch (t) { return { type: "throw", arg: t }; } } e.wrap = wrap; var h = "suspendedStart", l = "suspendedYield", f = "executing", s = "completed", y = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var p = {}; define(p, a, function () { return this; }); var d = Object.getPrototypeOf, v = d && d(d(values([]))); v && v !== r && n.call(v, a) && (p = v); var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p); function defineIteratorMethods(t) { ["next", "throw", "return"].forEach(function (e) { define(t, e, function (t) { return this._invoke(e, t); }); }); } function AsyncIterator(t, e) { function invoke(r, o, i, a) { var c = tryCatch(t[r], t, o); if ("throw" !== c.type) { var u = c.arg, h = u.value; return h && "object" == _typeof(h) && n.call(h, "__await") ? e.resolve(h.__await).then(function (t) { invoke("next", t, i, a); }, function (t) { invoke("throw", t, i, a); }) : e.resolve(h).then(function (t) { u.value = t, i(u); }, function (t) { return invoke("throw", t, i, a); }); } a(c.arg); } var r; o(this, "_invoke", { value: function value(t, n) { function callInvokeWithMethodAndArg() { return new e(function (e, r) { invoke(t, n, e, r); }); } return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(e, r, n) { var o = h; return function (i, a) { if (o === f) throw Error("Generator is already running"); if (o === s) { if ("throw" === i) throw a; return { value: t, done: !0 }; } for (n.method = i, n.arg = a;;) { var c = n.delegate; if (c) { var u = maybeInvokeDelegate(c, n); if (u) { if (u === y) continue; return u; } } if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) { if (o === h) throw o = s, n.arg; n.dispatchException(n.arg); } else "return" === n.method && n.abrupt("return", n.arg); o = f; var p = tryCatch(e, r, n); if ("normal" === p.type) { if (o = n.done ? s : l, p.arg === y) continue; return { value: p.arg, done: n.done }; } "throw" === p.type && (o = s, n.method = "throw", n.arg = p.arg); } }; } function maybeInvokeDelegate(e, r) { var n = r.method, o = e.iterator[n]; if (o === t) return r.delegate = null, "throw" === n && e.iterator["return"] && (r.method = "return", r.arg = t, maybeInvokeDelegate(e, r), "throw" === r.method) || "return" !== n && (r.method = "throw", r.arg = new TypeError("The iterator does not provide a '" + n + "' method")), y; var i = tryCatch(o, e.iterator, r.arg); if ("throw" === i.type) return r.method = "throw", r.arg = i.arg, r.delegate = null, y; var a = i.arg; return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, "return" !== r.method && (r.method = "next", r.arg = t), r.delegate = null, y) : a : (r.method = "throw", r.arg = new TypeError("iterator result is not an object"), r.delegate = null, y); } function pushTryEntry(t) { var e = { tryLoc: t[0] }; 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e); } function resetTryEntry(t) { var e = t.completion || {}; e.type = "normal", delete e.arg, t.completion = e; } function Context(t) { this.tryEntries = [{ tryLoc: "root" }], t.forEach(pushTryEntry, this), this.reset(!0); } function values(e) { if (e || "" === e) { var r = e[a]; if (r) return r.call(e); if ("function" == typeof e.next) return e; if (!isNaN(e.length)) { var o = -1, i = function next() { for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next; return next.value = t, next.done = !0, next; }; return i.next = i; } } throw new TypeError(_typeof(e) + " is not iterable"); } return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), o(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, "GeneratorFunction"), e.isGeneratorFunction = function (t) { var e = "function" == typeof t && t.constructor; return !!e && (e === GeneratorFunction || "GeneratorFunction" === (e.displayName || e.name)); }, e.mark = function (t) { return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, "GeneratorFunction")), t.prototype = Object.create(g), t; }, e.awrap = function (t) { return { __await: t }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () { return this; }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) { void 0 === i && (i = Promise); var a = new AsyncIterator(wrap(t, r, n, o), i); return e.isGeneratorFunction(r) ? a : a.next().then(function (t) { return t.done ? t.value : a.next(); }); }, defineIteratorMethods(g), define(g, u, "Generator"), define(g, a, function () { return this; }), define(g, "toString", function () { return "[object Generator]"; }), e.keys = function (t) { var e = Object(t), r = []; for (var n in e) r.push(n); return r.reverse(), function next() { for (; r.length;) { var t = r.pop(); if (t in e) return next.value = t, next.done = !1, next; } return next.done = !0, next; }; }, e.values = values, Context.prototype = { constructor: Context, reset: function reset(e) { if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t); }, stop: function stop() { this.done = !0; var t = this.tryEntries[0].completion; if ("throw" === t.type) throw t.arg; return this.rval; }, dispatchException: function dispatchException(e) { if (this.done) throw e; var r = this; function handle(n, o) { return a.type = "throw", a.arg = e, r.next = n, o && (r.method = "next", r.arg = t), !!o; } for (var o = this.tryEntries.length - 1; o >= 0; --o) { var i = this.tryEntries[o], a = i.completion; if ("root" === i.tryLoc) return handle("end"); if (i.tryLoc <= this.prev) { var c = n.call(i, "catchLoc"), u = n.call(i, "finallyLoc"); if (c && u) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } else if (c) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); } else { if (!u) throw Error("try statement without catch or finally"); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } } } }, abrupt: function abrupt(t, e) { for (var r = this.tryEntries.length - 1; r >= 0; --r) { var o = this.tryEntries[r]; if (o.tryLoc <= this.prev && n.call(o, "finallyLoc") && this.prev < o.finallyLoc) { var i = o; break; } } i && ("break" === t || "continue" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null); var a = i ? i.completion : {}; return a.type = t, a.arg = e, i ? (this.method = "next", this.next = i.finallyLoc, y) : this.complete(a); }, complete: function complete(t, e) { if ("throw" === t.type) throw t.arg; return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && e && (this.next = e), y; }, finish: function finish(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y; } }, "catch": function _catch(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.tryLoc === t) { var n = r.completion; if ("throw" === n.type) { var o = n.arg; resetTryEntry(r); } return o; } } throw Error("illegal catch attempt"); }, delegateYield: function delegateYield(e, r, n) { return this.delegate = { iterator: values(e), resultName: r, nextLoc: n }, "next" === this.method && (this.arg = t), y; } }, e; }
function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n) { return void e(n); } i.done ? t(u) : Promise.resolve(u).then(r, o); }
function _asyncToGenerator(n) { return function () { var t = this, e = arguments; return new Promise(function (r, o) { var a = n.apply(t, e); function _next(n) { asyncGeneratorStep(a, r, o, _next, _throw, "next", n); } function _throw(n) { asyncGeneratorStep(a, r, o, _next, _throw, "throw", n); } _next(void 0); }); }; }
var vc = new _viewerCommunicator.ViewerCommunicator({
hexaViewer: document.querySelector('hexa-viewer')
});
(function () {
var _this = this;
// vc.getCurrentScreenshot().then((s) => {
// console.log(s);
// });
var wireframeState = false,
configState = false,
uvState = false,
matcapState = false,
hideButtom = false;
var materialize = document.getElementById('materialize');
document.getElementById('config-single').addEventListener('click', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
var config;
return _regeneratorRuntime().wrap(function _callee$(_context) {
while (1) switch (_context.prev = _context.next) {
case 0:
config = [{
// color: 'rgb(229, 222, 204)',
thumbnail: 'https://www.tami4.co.il/sites/default/files/2021-04/edge_cream_front_552x820.png',
asset: 'http://localhost:9000/index.html?load=https://cdn.creators3d.com/models/3811692498551105_raw.glb&auto-adjust=1&debug=1&tv=162'
}, {
// color: 'rgb(0, 0, 0)',
thumbnail: 'https://www.tami4.co.il/sites/default/files/2021-04/edge_black_front_552x820.png',
asset: 'https://v.hexa3d.io/index.html?load=%2Fviews%2Fproduction%2Fitem%2F2022427%2F4697126561495946%2F4697126561495946.glb&autorotate=true&json-data=1651045292244&decrypt=1&tv=162&br=true&watermark=1'
}];
config = [config[configState ? 1 : 0]];
configState = !configState;
vc.configurator.setConfigurator(config);
vc.configurator.toggleConfiguratorUI(false);
vc.configurator.selectConfigurator(0);
case 6:
case "end":
return _context.stop();
}
}, _callee);
})));
materialize.addEventListener('click', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
return _regeneratorRuntime().wrap(function _callee2$(_context2) {
while (1) switch (_context2.prev = _context2.next) {
case 0:
applyMaterial({
RGB: [178, 121, 51],
roughness: 0.1,
metalness: 1,
transparent: false,
environment: {
type: 9,
intensity: 1.3,
blur: false
},
exposure: 1
});
case 1:
case "end":
return _context2.stop();
}
}, _callee2);
})), false);
var wireframe = document.getElementById('wireframe');
wireframe.addEventListener('click', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee3() {
return _regeneratorRuntime().wrap(function _callee3$(_context3) {
while (1) switch (_context3.prev = _context3.next) {
case 0:
wireframeState = !wireframeState;
vc.toggleWireframe(wireframeState);
case 2:
case "end":
return _context3.stop();
}
}, _callee3);
})), false);
var uv = document.getElementById('uv');
uv.addEventListener('click', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee4() {
return _regeneratorRuntime().wrap(function _callee4$(_context4) {
while (1) switch (_context4.prev = _context4.next) {
case 0:
uvState = !uvState;
vc.toggleUvMode(uvState);
case 2:
case "end":
return _context4.stop();
}
}, _callee4);
})), false);
var matcap = document.getElementById('matcap');
matcap.addEventListener('click', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee5() {
return _regeneratorRuntime().wrap(function _callee5$(_context5) {
while (1) switch (_context5.prev = _context5.next) {
case 0:
matcapState = !matcapState;
vc.toggleMatcapMode(matcapState, {
color: '#ff0068'
});
case 2:
case "end":
return _context5.stop();
}
}, _callee5);
})), false);
var expotModel = document.getElementById('expotModel');
expotModel.addEventListener('click', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee6() {
var exporderModel;
return _regeneratorRuntime().wrap(function _callee6$(_context6) {
while (1) switch (_context6.prev = _context6.next) {
case 0:
_context6.next = 2;
return vc.expotModel({
compressPNG: false,
downloadFile: false,
type: _viewerCommunicator2.ExportFileType.GLB
});
case 2:
exporderModel = _context6.sent;
console.log(exporderModel);
case 4:
case "end":
return _context6.stop();
}
}, _callee6);
})));
var screenshotsSequence = document.getElementById('screenshotsSequence');
screenshotsSequence.addEventListener('click', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee7() {
var videoBlob, video, vidURL;
return _regeneratorRuntime().wrap(function _callee7$(_context7) {
while (1) switch (_context7.prev = _context7.next) {
case 0:
_context7.next = 2;
return vc.getScreenshotsSequence({
numOfFrames: 96,
format: _viewerCommunicator2.MediaFormat.VIDEO
// codec: 'vp9'
});
case 2:
videoBlob = _context7.sent;
video = document.createElement('video');
video.autoplay = true;
video.muted = true;
video.loop = true;
document.body.appendChild(video);
vidURL = URL.createObjectURL(videoBlob);
video.onended = function () {
URL.revokeObjectURL(vidURL);
};
// const link = document.createElement('a');
// link.setAttribute(
// 'download', 'v.webm');
// link.href = vidURL;
// link.setAttribute('target', '_blank');
// document.body.appendChild(link);
// link.click();
// link.remove();
video.src = vidURL;
case 11:
case "end":
return _context7.stop();
}
}, _callee7);
})), false);
var exportModel = document.getElementById('export');
exportModel.addEventListener('click', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee8() {
var data;
return _regeneratorRuntime().wrap(function _callee8$(_context8) {
while (1) switch (_context8.prev = _context8.next) {
case 0:
_context8.next = 2;
return vc.expotModel({
compressPNG: false,
downloadFile: true,
type: _viewerCommunicator2.ExportFileType.GLB
});
case 2:
data = _context8.sent;
console.log(data);
case 4:
case "end":
return _context8.stop();
}
}, _callee8);
})), false);
var applyMaterial = /*#__PURE__*/function () {
var _ref9 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee9(material) {
var meshes, name;
return _regeneratorRuntime().wrap(function _callee9$(_context9) {
while (1) switch (_context9.prev = _context9.next) {
case 0:
_context9.next = 2;
return vc.onModelLoaded();
case 2:
_context9.next = 4;
return vc.getMeshesData();
case 4:
meshes = _context9.sent;
for (name in meshes) {
vc.materializeMesh(name, material);
}
case 6:
case "end":
return _context9.stop();
}
}, _callee9);
}));
return function applyMaterial(_x) {
return _ref9.apply(this, arguments);
};
}();
var initConfigurator = function initConfigurator() {
// const config = [
// {
// 'color': '#ffa0f0',
// 'materials': [
// {
// 'name': 'car_metal',
// 'color': '#ffa0f0'
// }
// ]
// },
// {
// 'color': '4b4a4b',
// 'materials': [
// {
// 'name': 'car_metal',
// 'color': '4b4a4b'
// }
// ]
// },
// {
// 'color': '#010101',
// 'materials': [
// {
// 'name': 'car_metal',
// 'color': '#010101'
// }
// ]
// }
// ] as Array<IConfiguration>;
// const config = [
// {
// 'color': 'rgb(255, 255, 255)',
// 'asset': 'https://vqa.hexa3d.io/index.html?load=%2Fviews%2Fqa%2Fitem%2F2022717%2F660070899346805%2F660070899346805.glb&autorotate=true&json-data=1658064892018&decrypt=1&br=true&tv=135&watermark=1'
// },
// {
// 'color': 'rgb(229, 222, 204)',
// 'asset': 'https://vqa.hexa3d.io/index.html?load=%2Fviews%2Fqa%2Fitem%2F2022717%2F5614144034778023%2F5614144034778023.glb&autorotate=true&json-data=1658065184207&decrypt=1&tv=135&watermark=1'
// },
// {
// 'color': 'rgb(119, 111, 98)',
// 'asset': 'https://vqa.hexa3d.io/index.html?load=%2Fviews%2Fqa%2Fitem%2F2022717%2F3949853585216815%2F3949853585216815.glb&autorotate=true&json-data=1658065089091&decrypt=1&tv=135&br=true&webp=1&watermark=1'
// }
// ] as Array<IConfiguration>;
var config = [{
// color: 'rgb(229, 222, 204)',
thumbnail: 'https://www.tami4.co.il/sites/default/files/2021-04/edge_cream_front_552x820.png',
asset: 'https://v.hexa3d.io/index.html?load=%2Fviews%2Fproduction%2Fitem%2F2022427%2F1785766613823082%2F1785766613823082.glb&autorotate=true&json-data=1651045050192&decrypt=1&tv=135&br=true&watermark=1&pv=https://cdn.hexa3d.io/hotlink-ok/2022427/50526c5d853941f395e47913e9852ab3.png'
}, {
// color: 'rgb(0, 0, 0)',
thumbnail: 'https://www.tami4.co.il/sites/default/files/2021-04/edge_black_front_552x820.png',
asset: 'https://v.hexa3d.io/index.html?load=%2Fviews%2Fproduction%2Fitem%2F2022427%2F4697126561495946%2F4697126561495946.glb&autorotate=true&json-data=1651045292244&decrypt=1&tv=135&br=true&watermark=1&pv=https://cdn.hexa3d.io/hotlink-ok/2022427/73fb4cb1d06f491fa6d8393f4704f816.png'
}, {
// color: 'rgb(255, 255, 255)',
thumbnail: 'https://www.tami4.co.il/sites/default/files/2021-04/edge_white_front_552x820.png',
asset: 'https://v.hexa3d.io/index.html?load=%2Fviews%2Fproduction%2Fitem%2F2022427%2F6769057538255978%2F6769057538255978.glb&autorotate=true&json-data=1651046028136&decrypt=1&tv=135&br=true&watermark=1&pv=https://cdn.hexa3d.io/hotlink-ok/2022427/e93b62f0f99e41c09c7b9c85a027e071.png'
}, {
// color: 'rgb(220, 39, 25)',
thumbnail: 'https://www.tami4.co.il/sites/default/files/2021-04/edge_red_front_552x820_0.png',
asset: 'https://v.hexa3d.io/index.html?load=%2Fviews%2Fproduction%2Fitem%2F2022427%2F3370851792395505%2F3370851792395505.glb&autorotate=true&json-data=1651045321141&decrypt=1&tv=135&br=true&watermark=1&pv=https://cdn.hexa3d.io/hotlink-ok/2022427/cc75a12053354011ae8b9a382f95eeb5.png'
}, {
color: 'rgb(229, 222, 204)',
asset: 'https://v.hexa3d.io/index.html?load=%2Fviews%2Fproduction%2Fitem%2F2022427%2F1785766613823082%2F1785766613823082.glb&autorotate=true&json-data=1651045050192&decrypt=1&tv=135&br=true&watermark=1&pv=https://cdn.hexa3d.io/hotlink-ok/2022427/50526c5d853941f395e47913e9852ab3.png'
}, {
color: 'rgb(0, 0, 0)',
asset: 'https://v.hexa3d.io/index.html?load=%2Fviews%2Fproduction%2Fitem%2F2022427%2F4697126561495946%2F4697126561495946.glb&autorotate=true&json-data=1651045292244&decrypt=1&tv=135&br=true&watermark=1&pv=https://cdn.hexa3d.io/hotlink-ok/2022427/73fb4cb1d06f491fa6d8393f4704f816.png'
}, {
color: 'rgb(255, 255, 255)',
asset: 'https://v.hexa3d.io/index.html?load=%2Fviews%2Fproduction%2Fitem%2F2022427%2F6769057538255978%2F6769057538255978.glb&autorotate=true&json-data=1651046028136&decrypt=1&tv=135&br=true&watermark=1&pv=https://cdn.hexa3d.io/hotlink-ok/2022427/e93b62f0f99e41c09c7b9c85a027e071.png'
}, {
color: 'rgb(220, 39, 25)',
asset: 'https://v.hexa3d.io/index.html?load=%2Fviews%2Fproduction%2Fitem%2F2022427%2F3370851792395505%2F3370851792395505.glb&autorotate=true&json-data=1651045321141&decrypt=1&tv=135&br=true&watermark=1&pv=https://cdn.hexa3d.io/hotlink-ok/2022427/cc75a12053354011ae8b9a382f95eeb5.png'
}];
// const config = [
// {
// 'color': '#ffffff',
// 'materials': [
// {
// 'name': 'Material1',
// 'textures': [
// {
// 'maps': [
// 'map'
// ],
// 'url': 'https://cdn.hexa3d.io/hotlink-ok/models/Logitech/G203_WHITE/Material1_diffuse.png'
// }
// ]
// },
// {
// 'name': 'Material2',
// 'textures': [
// {
// 'maps': [
// 'map'
// ],
// 'url': 'https://cdn.hexa3d.io/hotlink-ok/models/Logitech/G203_WHITE/Material2_diffuse.png'
// },
// {
// 'maps': [
// 'metalness',
// 'roughness',
// 'ao'
// ],
// 'url': 'https://cdn.hexa3d.io/hotlink-ok/models/Logitech/G203_WHITE/Material2_roughnessMetallic.png'
// }
// ]
// }
// ],
// 'sceneURL': 'https://cdn.hexa3d.io/hotlink-ok/models/Logitech/G203_WHITE.json?v=1650175969945'
// },
// {
// 'color': '#000000',
// 'materials': [
// {
// 'name': 'Material1',
// 'textures': [
// {
// 'maps': [
// 'map'
// ],
// 'url': 'https://cdn.hexa3d.io/hotlink-ok/models/Logitech/G203_BLACK/Material1_diffuse.png'
// }
// ]
// },
// {
// 'name': 'Material2',
// 'textures': [
// {
// 'maps': [
// 'map'
// ],
// 'url': 'https://cdn.hexa3d.io/hotlink-ok/models/Logitech/G203_BLACK/Material2_diffuse.png'
// },
// {
// 'maps': [
// 'metalness',
// 'roughness',
// 'ao'
// ],
// 'url': 'https://cdn.hexa3d.io/hotlink-ok/models/Logitech/G203_BLACK/Material2_roughnessMetallic.png'
// }
// ]
// }
// ],
// 'sceneURL': 'https://cdn.hexa3d.io/hotlink-ok/models/Logitech/G203_BLACK/910005796__910005808__910005823_GLTF.json'
// },
// {
// 'color': '#0072ce',
// 'materials': [
// {
// 'name': 'Material1',
// 'textures': [
// {
// 'maps': [
// 'map'
// ],
// 'url': 'https://cdn.hexa3d.io/hotlink-ok/models/Logitech/G203_BLUE/Material1_diffuse.png'
// }
// ]
// },
// {
// 'name': 'Material2',
// 'textures': [
// {
// 'maps': [
// 'map'
// ],
// 'url': 'https://cdn.hexa3d.io/hotlink-ok/models/Logitech/G203_BLUE/Material2_diffuse.png'
// },
// {
// 'maps': [
// 'metalness',
// 'roughness',
// 'ao'
// ],
// 'url': 'https://cdn.hexa3d.io/hotlink-ok/models/Logitech/G203_BLUE/Material2_roughnessMetallic.png'
// }
// ]
// }
// ],
// 'sceneURL': 'https://cdn.hexa3d.io/hotlink-ok/models/Logitech/G203_BLUE/910005798__910005801_GLTF.json'
// },
// {
// 'color': '#afbded',
// 'materials': [
// {
// 'name': 'Material1',
// 'textures': [
// {
// 'maps': [
// 'map'
// ],
// 'url': 'https://cdn.hexa3d.io/hotlink-ok/models/Logitech/G203_LILAC/Material1_diffuse.png'
// }
// ]
// },
// {
// 'name': 'Material2',
// 'textures': [
// {
// 'maps': [
// 'map'
// ],
// 'url': 'https://cdn.hexa3d.io/hotlink-ok/models/Logitech/G203_LILAC/Material2_diffuse.png'
// },
// {
// 'maps': [
// 'metalness',
// 'roughness',
// 'ao'
// ],
// 'url': 'https://cdn.hexa3d.io/hotlink-ok/models/Logitech/G203_LILAC/Material2_roughnessMetallic.png'
// }
// ]
// }
// ],
// 'sceneURL': 'https://cdn.hexa3d.io/hotlink-ok/models/Logitech/G203_LILAC/910005853__910005854_GLTF.json'
// }
// ] as Array<IConfiguration>;
document.getElementById('configurator-init').addEventListener('click', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee10() {
return _regeneratorRuntime().wrap(function _callee10$(_context10) {
while (1) switch (_context10.prev = _context10.next) {
case 0:
vc.configurator.setConfigurator(config);
config.forEach(function (c, i) {
return vc.configurator.preloadConfigurator(c, (i + 1) * 2000);
});
vc.configurator.toggleConfiguratorUI(true);
case 3:
case "end":
return _context10.stop();
}
}, _callee10);
})), false);
document.getElementById('configurator-select').addEventListener('change', /*#__PURE__*/function () {
var _ref11 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee11(e) {
return _regeneratorRuntime().wrap(function _callee11$(_context11) {
while (1) switch (_context11.prev = _context11.next) {
case 0:
vc.configurator.selectConfigurator(parseInt(e.target.value));
wireframeState = false;
case 2:
case "end":
return _context11.stop();
}
}, _callee11);
}));
return function (_x2) {
return _ref11.apply(this, arguments);
};
}());
document.getElementById('pic-in-pic').addEventListener('click', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee12() {
return _regeneratorRuntime().wrap(function _callee12$(_context12) {
while (1) switch (_context12.prev = _context12.next) {
case 0:
vc.togglePicInPic(!!!document.pictureInPictureElement);
case 1:
case "end":
return _context12.stop();
}
}, _callee12);
})), false);
document.getElementById('webxr').addEventListener('click', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee13() {
return _regeneratorRuntime().wrap(function _callee13$(_context13) {
while (1) switch (_context13.prev = _context13.next) {
case 0:
_context13.next = 2;
return vc.isWebXrSupported();
case 2:
if (!_context13.sent) {
_context13.next = 6;
break;
}
vc.toggleWebXR(true, true);
_context13.next = 7;
break;
case 6:
alert('This browser doesn\'t support WebXR');
case 7:
case "end":
return _context13.stop();
}
}, _callee13);
})), false);
document.getElementById('collision-init').addEventListener('click', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee14() {
var c;
return _regeneratorRuntime().wrap(function _callee14$(_context14) {
while (1) switch (_context14.prev = _context14.next) {
case 0:
_context14.next = 2;
return vc.onModelLoaded();
case 2:
vc.toggleCollision(true, '#ff0000');
_context14.next = 5;
return vc.waitForCollisions();
case 5:
c = _context14.sent;
console.log(c);
case 7:
case "end":
return _context14.stop();
}
}, _callee14);
})), false);
document.getElementById('preset').addEventListener('click', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee15() {
return _regeneratorRuntime().wrap(function _callee15$(_context15) {
while (1) switch (_context15.prev = _context15.next) {
case 0:
vc.applyPreset({
hdri: {
background: true,
blur: false,
format: 'hdr',
intensity: 1,
type: 9
}
});
case 1:
case "end":
return _context15.stop();
}
}, _callee15);
})), false);
document.getElementById('sync-clock').addEventListener('click', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee16() {
var md, min, sec, hour, _syncClock;
return _regeneratorRuntime().wrap(function _callee16$(_context16) {
while (1) switch (_context16.prev = _context16.next) {
case 0:
_context16.next = 2;
return vc.getMeshesData();
case 2:
md = _context16.sent;
min = 'Arrow_Min', sec = 'Arrow_Sec', hour = 'Arrow_Hr';
_syncClock = function syncClock() {
setTimeout(_syncClock.bind(_this), 1000);
var now = new Date();
var hours = now.getHours(),
minutes = now.getMinutes(),
seconds = now.getSeconds();
if (hours > 12) hours -= 12;
hours = 6 * hours;
minutes = 6 * minutes;
seconds = 6 * seconds;
md[sec].rotation.y = seconds * (Math.PI / 180);
md[min].rotation.y = minutes * (Math.PI / 180);
md[hour].rotation.y = hours * (Math.PI / 180);
vc.setMeshProps({
mesh: md[sec],
key: 'rotation',
value: md[sec].rotation
});
vc.setMeshProps({
mesh: md[min],
key: 'rotation',
value: md[min].rotation
});
vc.setMeshProps({
mesh: md[hour],
key: 'rotation',
value: md[hour].rotation
});
};
_syncClock();
case 6:
case "end":
return _context16.stop();
}
}, _callee16);
})), false);
};
initConfigurator();
var applyTexture = /*#__PURE__*/function () {
var _ref17 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee17() {
return _regeneratorRuntime().wrap(function _callee17$(_context17) {
while (1) switch (_context17.prev = _context17.next) {
case 0:
_context17.next = 2;
return vc.onModelLoaded();
case 2:
vc.applyTexture({
mapType: 'map',
materialName: 'Display_MAT',
mimeType: _viewerCommunicator2.TextureMimeType.VIDEO,
src: '#video'
});
case 3:
case "end":
return _context17.stop();
}
}, _callee17);
}));
return function applyTexture() {
return _ref17.apply(this, arguments);
};
}();
document.getElementById('apply-texture').addEventListener('click', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee18() {
return _regeneratorRuntime().wrap(function _callee18$(_context18) {
while (1) switch (_context18.prev = _context18.next) {
case 0:
applyTexture();
case 1:
case "end":
return _context18.stop();
}
}, _callee18);
})));
document.getElementById('hide-buttom').addEventListener('click', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee19() {
return _regeneratorRuntime().wrap(function _callee19$(_context19) {
while (1) switch (_context19.prev = _context19.next) {
case 0:
hideButtom = !hideButtom;
vc.toggleHideBottom(hideButtom);
case 2:
case "end":
return _context19.stop();
}
}, _callee19);
})));
document.getElementById('file').addEventListener('change', function (event) {
vc.displayFiles(event.target.files);
}, false);
vc.getBoundingBox().then(function (b) {
console.log(b);
});
})();