\n * \n * \n * Should not match component / directive because we are in ngNonBindable.\n * \n * \n *
\n * ```\n *\n * @codeGenApi\n */\nfunction ɵɵenableBindings() {\n instructionState.bindingsEnabled = true;\n}\n/**\n * Sets a flag to specify that the TNode is in a skip hydration block.\n * @param tNode the current TNode\n */\nfunction enterSkipHydrationBlock(tNode) {\n instructionState.skipHydrationRootTNode = tNode;\n}\n/**\n * Disables directive matching on element.\n *\n * * Example:\n * ```\n * \n * \n * \n * Should not match component / directive because we are in ngNonBindable.\n * \n * \n *
\n * ```\n *\n * @codeGenApi\n */\nfunction ɵɵdisableBindings() {\n instructionState.bindingsEnabled = false;\n}\n/**\n * Clears the root skip hydration node when leaving a skip hydration block.\n */\nfunction leaveSkipHydrationBlock() {\n instructionState.skipHydrationRootTNode = null;\n}\n/**\n * Return the current `LView`.\n */\nfunction getLView() {\n return instructionState.lFrame.lView;\n}\n/**\n * Return the current `TView`.\n */\nfunction getTView() {\n return instructionState.lFrame.tView;\n}\n/**\n * Restores `contextViewData` to the given OpaqueViewState instance.\n *\n * Used in conjunction with the getCurrentView() instruction to save a snapshot\n * of the current view and restore it when listeners are invoked. This allows\n * walking the declaration view tree in listeners to get vars from parent views.\n *\n * @param viewToRestore The OpaqueViewState instance to restore.\n * @returns Context of the restored OpaqueViewState instance.\n *\n * @codeGenApi\n */\nfunction ɵɵrestoreView(viewToRestore) {\n instructionState.lFrame.contextLView = viewToRestore;\n return viewToRestore[CONTEXT];\n}\n/**\n * Clears the view set in `ɵɵrestoreView` from memory. Returns the passed in\n * value so that it can be used as a return value of an instruction.\n *\n * @codeGenApi\n */\nfunction ɵɵresetView(value) {\n instructionState.lFrame.contextLView = null;\n return value;\n}\nfunction getCurrentTNode() {\n let currentTNode = getCurrentTNodePlaceholderOk();\n while (currentTNode !== null && currentTNode.type === 64 /* TNodeType.Placeholder */) {\n currentTNode = currentTNode.parent;\n }\n return currentTNode;\n}\nfunction getCurrentTNodePlaceholderOk() {\n return instructionState.lFrame.currentTNode;\n}\nfunction getCurrentParentTNode() {\n const lFrame = instructionState.lFrame;\n const currentTNode = lFrame.currentTNode;\n return lFrame.isParent ? currentTNode : currentTNode.parent;\n}\nfunction setCurrentTNode(tNode, isParent) {\n ngDevMode && tNode && assertTNodeForTView(tNode, instructionState.lFrame.tView);\n const lFrame = instructionState.lFrame;\n lFrame.currentTNode = tNode;\n lFrame.isParent = isParent;\n}\nfunction isCurrentTNodeParent() {\n return instructionState.lFrame.isParent;\n}\nfunction setCurrentTNodeAsNotParent() {\n instructionState.lFrame.isParent = false;\n}\nfunction getContextLView() {\n const contextLView = instructionState.lFrame.contextLView;\n ngDevMode && assertDefined(contextLView, 'contextLView must be defined.');\n return contextLView;\n}\nfunction isInCheckNoChangesMode() {\n !ngDevMode && throwError('Must never be called in production mode');\n return _isInCheckNoChangesMode;\n}\nfunction setIsInCheckNoChangesMode(mode) {\n !ngDevMode && throwError('Must never be called in production mode');\n _isInCheckNoChangesMode = mode;\n}\n// top level variables should not be exported for performance reasons (PERF_NOTES.md)\nfunction getBindingRoot() {\n const lFrame = instructionState.lFrame;\n let index = lFrame.bindingRootIndex;\n if (index === -1) {\n index = lFrame.bindingRootIndex = lFrame.tView.bindingStartIndex;\n }\n return index;\n}\nfunction getBindingIndex() {\n return instructionState.lFrame.bindingIndex;\n}\nfunction setBindingIndex(value) {\n return instructionState.lFrame.bindingIndex = value;\n}\nfunction nextBindingIndex() {\n return instructionState.lFrame.bindingIndex++;\n}\nfunction incrementBindingIndex(count) {\n const lFrame = instructionState.lFrame;\n const index = lFrame.bindingIndex;\n lFrame.bindingIndex = lFrame.bindingIndex + count;\n return index;\n}\nfunction isInI18nBlock() {\n return instructionState.lFrame.inI18n;\n}\nfunction setInI18nBlock(isInI18nBlock) {\n instructionState.lFrame.inI18n = isInI18nBlock;\n}\n/**\n * Set a new binding root index so that host template functions can execute.\n *\n * Bindings inside the host template are 0 index. But because we don't know ahead of time\n * how many host bindings we have we can't pre-compute them. For this reason they are all\n * 0 index and we just shift the root so that they match next available location in the LView.\n *\n * @param bindingRootIndex Root index for `hostBindings`\n * @param currentDirectiveIndex `TData[currentDirectiveIndex]` will point to the current directive\n * whose `hostBindings` are being processed.\n */\nfunction setBindingRootForHostBindings(bindingRootIndex, currentDirectiveIndex) {\n const lFrame = instructionState.lFrame;\n lFrame.bindingIndex = lFrame.bindingRootIndex = bindingRootIndex;\n setCurrentDirectiveIndex(currentDirectiveIndex);\n}\n/**\n * When host binding is executing this points to the directive index.\n * `TView.data[getCurrentDirectiveIndex()]` is `DirectiveDef`\n * `LView[getCurrentDirectiveIndex()]` is directive instance.\n */\nfunction getCurrentDirectiveIndex() {\n return instructionState.lFrame.currentDirectiveIndex;\n}\n/**\n * Sets an index of a directive whose `hostBindings` are being processed.\n *\n * @param currentDirectiveIndex `TData` index where current directive instance can be found.\n */\nfunction setCurrentDirectiveIndex(currentDirectiveIndex) {\n instructionState.lFrame.currentDirectiveIndex = currentDirectiveIndex;\n}\n/**\n * Retrieve the current `DirectiveDef` which is active when `hostBindings` instruction is being\n * executed.\n *\n * @param tData Current `TData` where the `DirectiveDef` will be looked up at.\n */\nfunction getCurrentDirectiveDef(tData) {\n const currentDirectiveIndex = instructionState.lFrame.currentDirectiveIndex;\n return currentDirectiveIndex === -1 ? null : tData[currentDirectiveIndex];\n}\nfunction getCurrentQueryIndex() {\n return instructionState.lFrame.currentQueryIndex;\n}\nfunction setCurrentQueryIndex(value) {\n instructionState.lFrame.currentQueryIndex = value;\n}\n/**\n * Returns a `TNode` of the location where the current `LView` is declared at.\n *\n * @param lView an `LView` that we want to find parent `TNode` for.\n */\nfunction getDeclarationTNode(lView) {\n const tView = lView[TVIEW];\n // Return the declaration parent for embedded views\n if (tView.type === 2 /* TViewType.Embedded */) {\n ngDevMode && assertDefined(tView.declTNode, 'Embedded TNodes should have declaration parents.');\n return tView.declTNode;\n }\n // Components don't have `TView.declTNode` because each instance of component could be\n // inserted in different location, hence `TView.declTNode` is meaningless.\n // Falling back to `T_HOST` in case we cross component boundary.\n if (tView.type === 1 /* TViewType.Component */) {\n return lView[T_HOST];\n }\n // Remaining TNode type is `TViewType.Root` which doesn't have a parent TNode.\n return null;\n}\n/**\n * This is a light weight version of the `enterView` which is needed by the DI system.\n *\n * @param lView `LView` location of the DI context.\n * @param tNode `TNode` for DI context\n * @param flags DI context flags. if `SkipSelf` flag is set than we walk up the declaration\n * tree from `tNode` until we find parent declared `TElementNode`.\n * @returns `true` if we have successfully entered DI associated with `tNode` (or with declared\n * `TNode` if `flags` has `SkipSelf`). Failing to enter DI implies that no associated\n * `NodeInjector` can be found and we should instead use `ModuleInjector`.\n * - If `true` than this call must be fallowed by `leaveDI`\n * - If `false` than this call failed and we should NOT call `leaveDI`\n */\nfunction enterDI(lView, tNode, flags) {\n ngDevMode && assertLViewOrUndefined(lView);\n if (flags & InjectFlags.SkipSelf) {\n ngDevMode && assertTNodeForTView(tNode, lView[TVIEW]);\n let parentTNode = tNode;\n let parentLView = lView;\n while (true) {\n ngDevMode && assertDefined(parentTNode, 'Parent TNode should be defined');\n parentTNode = parentTNode.parent;\n if (parentTNode === null && !(flags & InjectFlags.Host)) {\n parentTNode = getDeclarationTNode(parentLView);\n if (parentTNode === null)\n break;\n // In this case, a parent exists and is definitely an element. So it will definitely\n // have an existing lView as the declaration view, which is why we can assume it's defined.\n ngDevMode && assertDefined(parentLView, 'Parent LView should be defined');\n parentLView = parentLView[DECLARATION_VIEW];\n // In Ivy there are Comment nodes that correspond to ngIf and NgFor embedded directives\n // We want to skip those and look only at Elements and ElementContainers to ensure\n // we're looking at true parent nodes, and not content or other types.\n if (parentTNode.type & (2 /* TNodeType.Element */ | 8 /* TNodeType.ElementContainer */)) {\n break;\n }\n }\n else {\n break;\n }\n }\n if (parentTNode === null) {\n // If we failed to find a parent TNode this means that we should use module injector.\n return false;\n }\n else {\n tNode = parentTNode;\n lView = parentLView;\n }\n }\n ngDevMode && assertTNodeForLView(tNode, lView);\n const lFrame = instructionState.lFrame = allocLFrame();\n lFrame.currentTNode = tNode;\n lFrame.lView = lView;\n return true;\n}\n/**\n * Swap the current lView with a new lView.\n *\n * For performance reasons we store the lView in the top level of the module.\n * This way we minimize the number of properties to read. Whenever a new view\n * is entered we have to store the lView for later, and when the view is\n * exited the state has to be restored\n *\n * @param newView New lView to become active\n * @returns the previously active lView;\n */\nfunction enterView(newView) {\n ngDevMode && assertNotEqual(newView[0], newView[1], '????');\n ngDevMode && assertLViewOrUndefined(newView);\n const newLFrame = allocLFrame();\n if (ngDevMode) {\n assertEqual(newLFrame.isParent, true, 'Expected clean LFrame');\n assertEqual(newLFrame.lView, null, 'Expected clean LFrame');\n assertEqual(newLFrame.tView, null, 'Expected clean LFrame');\n assertEqual(newLFrame.selectedIndex, -1, 'Expected clean LFrame');\n assertEqual(newLFrame.elementDepthCount, 0, 'Expected clean LFrame');\n assertEqual(newLFrame.currentDirectiveIndex, -1, 'Expected clean LFrame');\n assertEqual(newLFrame.currentNamespace, null, 'Expected clean LFrame');\n assertEqual(newLFrame.bindingRootIndex, -1, 'Expected clean LFrame');\n assertEqual(newLFrame.currentQueryIndex, 0, 'Expected clean LFrame');\n }\n const tView = newView[TVIEW];\n instructionState.lFrame = newLFrame;\n ngDevMode && tView.firstChild && assertTNodeForTView(tView.firstChild, tView);\n newLFrame.currentTNode = tView.firstChild;\n newLFrame.lView = newView;\n newLFrame.tView = tView;\n newLFrame.contextLView = newView;\n newLFrame.bindingIndex = tView.bindingStartIndex;\n newLFrame.inI18n = false;\n}\n/**\n * Allocates next free LFrame. This function tries to reuse the `LFrame`s to lower memory pressure.\n */\nfunction allocLFrame() {\n const currentLFrame = instructionState.lFrame;\n const childLFrame = currentLFrame === null ? null : currentLFrame.child;\n const newLFrame = childLFrame === null ? createLFrame(currentLFrame) : childLFrame;\n return newLFrame;\n}\nfunction createLFrame(parent) {\n const lFrame = {\n currentTNode: null,\n isParent: true,\n lView: null,\n tView: null,\n selectedIndex: -1,\n contextLView: null,\n elementDepthCount: 0,\n currentNamespace: null,\n currentDirectiveIndex: -1,\n bindingRootIndex: -1,\n bindingIndex: -1,\n currentQueryIndex: 0,\n parent: parent,\n child: null,\n inI18n: false,\n };\n parent !== null && (parent.child = lFrame); // link the new LFrame for reuse.\n return lFrame;\n}\n/**\n * A lightweight version of leave which is used with DI.\n *\n * This function only resets `currentTNode` and `LView` as those are the only properties\n * used with DI (`enterDI()`).\n *\n * NOTE: This function is reexported as `leaveDI`. However `leaveDI` has return type of `void` where\n * as `leaveViewLight` has `LFrame`. This is so that `leaveViewLight` can be used in `leaveView`.\n */\nfunction leaveViewLight() {\n const oldLFrame = instructionState.lFrame;\n instructionState.lFrame = oldLFrame.parent;\n oldLFrame.currentTNode = null;\n oldLFrame.lView = null;\n return oldLFrame;\n}\n/**\n * This is a lightweight version of the `leaveView` which is needed by the DI system.\n *\n * NOTE: this function is an alias so that we can change the type of the function to have `void`\n * return type.\n */\nconst leaveDI = leaveViewLight;\n/**\n * Leave the current `LView`\n *\n * This pops the `LFrame` with the associated `LView` from the stack.\n *\n * IMPORTANT: We must zero out the `LFrame` values here otherwise they will be retained. This is\n * because for performance reasons we don't release `LFrame` but rather keep it for next use.\n */\nfunction leaveView() {\n const oldLFrame = leaveViewLight();\n oldLFrame.isParent = true;\n oldLFrame.tView = null;\n oldLFrame.selectedIndex = -1;\n oldLFrame.contextLView = null;\n oldLFrame.elementDepthCount = 0;\n oldLFrame.currentDirectiveIndex = -1;\n oldLFrame.currentNamespace = null;\n oldLFrame.bindingRootIndex = -1;\n oldLFrame.bindingIndex = -1;\n oldLFrame.currentQueryIndex = 0;\n}\nfunction nextContextImpl(level) {\n const contextLView = instructionState.lFrame.contextLView =\n walkUpViews(level, instructionState.lFrame.contextLView);\n return contextLView[CONTEXT];\n}\nfunction walkUpViews(nestingLevel, currentView) {\n while (nestingLevel > 0) {\n ngDevMode &&\n assertDefined(currentView[DECLARATION_VIEW], 'Declaration view should be defined if nesting level is greater than 0.');\n currentView = currentView[DECLARATION_VIEW];\n nestingLevel--;\n }\n return currentView;\n}\n/**\n * Gets the currently selected element index.\n *\n * Used with {@link property} instruction (and more in the future) to identify the index in the\n * current `LView` to act on.\n */\nfunction getSelectedIndex() {\n return instructionState.lFrame.selectedIndex;\n}\n/**\n * Sets the most recent index passed to {@link select}\n *\n * Used with {@link property} instruction (and more in the future) to identify the index in the\n * current `LView` to act on.\n *\n * (Note that if an \"exit function\" was set earlier (via `setElementExitFn()`) then that will be\n * run if and when the provided `index` value is different from the current selected index value.)\n */\nfunction setSelectedIndex(index) {\n ngDevMode && index !== -1 &&\n assertGreaterThanOrEqual(index, HEADER_OFFSET, 'Index must be past HEADER_OFFSET (or -1).');\n ngDevMode &&\n assertLessThan(index, instructionState.lFrame.lView.length, 'Can\\'t set index passed end of LView');\n instructionState.lFrame.selectedIndex = index;\n}\n/**\n * Gets the `tNode` that represents currently selected element.\n */\nfunction getSelectedTNode() {\n const lFrame = instructionState.lFrame;\n return getTNode(lFrame.tView, lFrame.selectedIndex);\n}\n/**\n * Sets the namespace used to create elements to `'http://www.w3.org/2000/svg'` in global state.\n *\n * @codeGenApi\n */\nfunction ɵɵnamespaceSVG() {\n instructionState.lFrame.currentNamespace = SVG_NAMESPACE;\n}\n/**\n * Sets the namespace used to create elements to `'http://www.w3.org/1998/MathML/'` in global state.\n *\n * @codeGenApi\n */\nfunction ɵɵnamespaceMathML() {\n instructionState.lFrame.currentNamespace = MATH_ML_NAMESPACE;\n}\n/**\n * Sets the namespace used to create elements to `null`, which forces element creation to use\n * `createElement` rather than `createElementNS`.\n *\n * @codeGenApi\n */\nfunction ɵɵnamespaceHTML() {\n namespaceHTMLInternal();\n}\n/**\n * Sets the namespace used to create elements to `null`, which forces element creation to use\n * `createElement` rather than `createElementNS`.\n */\nfunction namespaceHTMLInternal() {\n instructionState.lFrame.currentNamespace = null;\n}\nfunction getNamespace$1() {\n return instructionState.lFrame.currentNamespace;\n}\nlet _wasLastNodeCreated = true;\n/**\n * Retrieves a global flag that indicates whether the most recent DOM node\n * was created or hydrated.\n */\nfunction wasLastNodeCreated() {\n return _wasLastNodeCreated;\n}\n/**\n * Sets a global flag to indicate whether the most recent DOM node\n * was created or hydrated.\n */\nfunction lastNodeWasCreated(flag) {\n _wasLastNodeCreated = flag;\n}\n\n/**\n * Adds all directive lifecycle hooks from the given `DirectiveDef` to the given `TView`.\n *\n * Must be run *only* on the first template pass.\n *\n * Sets up the pre-order hooks on the provided `tView`,\n * see {@link HookData} for details about the data structure.\n *\n * @param directiveIndex The index of the directive in LView\n * @param directiveDef The definition containing the hooks to setup in tView\n * @param tView The current TView\n */\nfunction registerPreOrderHooks(directiveIndex, directiveDef, tView) {\n ngDevMode && assertFirstCreatePass(tView);\n const { ngOnChanges, ngOnInit, ngDoCheck } = directiveDef.type.prototype;\n if (ngOnChanges) {\n const wrappedOnChanges = NgOnChangesFeatureImpl(directiveDef);\n (tView.preOrderHooks ??= []).push(directiveIndex, wrappedOnChanges);\n (tView.preOrderCheckHooks ??= []).push(directiveIndex, wrappedOnChanges);\n }\n if (ngOnInit) {\n (tView.preOrderHooks ??= []).push(0 - directiveIndex, ngOnInit);\n }\n if (ngDoCheck) {\n (tView.preOrderHooks ??= []).push(directiveIndex, ngDoCheck);\n (tView.preOrderCheckHooks ??= []).push(directiveIndex, ngDoCheck);\n }\n}\n/**\n *\n * Loops through the directives on the provided `tNode` and queues hooks to be\n * run that are not initialization hooks.\n *\n * Should be executed during `elementEnd()` and similar to\n * preserve hook execution order. Content, view, and destroy hooks for projected\n * components and directives must be called *before* their hosts.\n *\n * Sets up the content, view, and destroy hooks on the provided `tView`,\n * see {@link HookData} for details about the data structure.\n *\n * NOTE: This does not set up `onChanges`, `onInit` or `doCheck`, those are set up\n * separately at `elementStart`.\n *\n * @param tView The current TView\n * @param tNode The TNode whose directives are to be searched for hooks to queue\n */\nfunction registerPostOrderHooks(tView, tNode) {\n ngDevMode && assertFirstCreatePass(tView);\n // It's necessary to loop through the directives at elementEnd() (rather than processing in\n // directiveCreate) so we can preserve the current hook order. Content, view, and destroy\n // hooks for projected components and directives must be called *before* their hosts.\n for (let i = tNode.directiveStart, end = tNode.directiveEnd; i < end; i++) {\n const directiveDef = tView.data[i];\n ngDevMode && assertDefined(directiveDef, 'Expecting DirectiveDef');\n const lifecycleHooks = directiveDef.type.prototype;\n const { ngAfterContentInit, ngAfterContentChecked, ngAfterViewInit, ngAfterViewChecked, ngOnDestroy } = lifecycleHooks;\n if (ngAfterContentInit) {\n (tView.contentHooks ??= []).push(-i, ngAfterContentInit);\n }\n if (ngAfterContentChecked) {\n (tView.contentHooks ??= []).push(i, ngAfterContentChecked);\n (tView.contentCheckHooks ??= []).push(i, ngAfterContentChecked);\n }\n if (ngAfterViewInit) {\n (tView.viewHooks ??= []).push(-i, ngAfterViewInit);\n }\n if (ngAfterViewChecked) {\n (tView.viewHooks ??= []).push(i, ngAfterViewChecked);\n (tView.viewCheckHooks ??= []).push(i, ngAfterViewChecked);\n }\n if (ngOnDestroy != null) {\n (tView.destroyHooks ??= []).push(i, ngOnDestroy);\n }\n }\n}\n/**\n * Executing hooks requires complex logic as we need to deal with 2 constraints.\n *\n * 1. Init hooks (ngOnInit, ngAfterContentInit, ngAfterViewInit) must all be executed once and only\n * once, across many change detection cycles. This must be true even if some hooks throw, or if\n * some recursively trigger a change detection cycle.\n * To solve that, it is required to track the state of the execution of these init hooks.\n * This is done by storing and maintaining flags in the view: the {@link InitPhaseState},\n * and the index within that phase. They can be seen as a cursor in the following structure:\n * [[onInit1, onInit2], [afterContentInit1], [afterViewInit1, afterViewInit2, afterViewInit3]]\n * They are stored as flags in LView[FLAGS].\n *\n * 2. Pre-order hooks can be executed in batches, because of the select instruction.\n * To be able to pause and resume their execution, we also need some state about the hook's array\n * that is being processed:\n * - the index of the next hook to be executed\n * - the number of init hooks already found in the processed part of the array\n * They are stored as flags in LView[PREORDER_HOOK_FLAGS].\n */\n/**\n * Executes pre-order check hooks ( OnChanges, DoChanges) given a view where all the init hooks were\n * executed once. This is a light version of executeInitAndCheckPreOrderHooks where we can skip read\n * / write of the init-hooks related flags.\n * @param lView The LView where hooks are defined\n * @param hooks Hooks to be run\n * @param nodeIndex 3 cases depending on the value:\n * - undefined: all hooks from the array should be executed (post-order case)\n * - null: execute hooks only from the saved index until the end of the array (pre-order case, when\n * flushing the remaining hooks)\n * - number: execute hooks only from the saved index until that node index exclusive (pre-order\n * case, when executing select(number))\n */\nfunction executeCheckHooks(lView, hooks, nodeIndex) {\n callHooks(lView, hooks, 3 /* InitPhaseState.InitPhaseCompleted */, nodeIndex);\n}\n/**\n * Executes post-order init and check hooks (one of AfterContentInit, AfterContentChecked,\n * AfterViewInit, AfterViewChecked) given a view where there are pending init hooks to be executed.\n * @param lView The LView where hooks are defined\n * @param hooks Hooks to be run\n * @param initPhase A phase for which hooks should be run\n * @param nodeIndex 3 cases depending on the value:\n * - undefined: all hooks from the array should be executed (post-order case)\n * - null: execute hooks only from the saved index until the end of the array (pre-order case, when\n * flushing the remaining hooks)\n * - number: execute hooks only from the saved index until that node index exclusive (pre-order\n * case, when executing select(number))\n */\nfunction executeInitAndCheckHooks(lView, hooks, initPhase, nodeIndex) {\n ngDevMode &&\n assertNotEqual(initPhase, 3 /* InitPhaseState.InitPhaseCompleted */, 'Init pre-order hooks should not be called more than once');\n if ((lView[FLAGS] & 3 /* LViewFlags.InitPhaseStateMask */) === initPhase) {\n callHooks(lView, hooks, initPhase, nodeIndex);\n }\n}\nfunction incrementInitPhaseFlags(lView, initPhase) {\n ngDevMode &&\n assertNotEqual(initPhase, 3 /* InitPhaseState.InitPhaseCompleted */, 'Init hooks phase should not be incremented after all init hooks have been run.');\n let flags = lView[FLAGS];\n if ((flags & 3 /* LViewFlags.InitPhaseStateMask */) === initPhase) {\n flags &= 8191 /* LViewFlags.IndexWithinInitPhaseReset */;\n flags += 1 /* LViewFlags.InitPhaseStateIncrementer */;\n lView[FLAGS] = flags;\n }\n}\n/**\n * Calls lifecycle hooks with their contexts, skipping init hooks if it's not\n * the first LView pass\n *\n * @param currentView The current view\n * @param arr The array in which the hooks are found\n * @param initPhaseState the current state of the init phase\n * @param currentNodeIndex 3 cases depending on the value:\n * - undefined: all hooks from the array should be executed (post-order case)\n * - null: execute hooks only from the saved index until the end of the array (pre-order case, when\n * flushing the remaining hooks)\n * - number: execute hooks only from the saved index until that node index exclusive (pre-order\n * case, when executing select(number))\n */\nfunction callHooks(currentView, arr, initPhase, currentNodeIndex) {\n ngDevMode &&\n assertEqual(isInCheckNoChangesMode(), false, 'Hooks should never be run when in check no changes mode.');\n const startIndex = currentNodeIndex !== undefined ?\n (currentView[PREORDER_HOOK_FLAGS] & 65535 /* PreOrderHookFlags.IndexOfTheNextPreOrderHookMaskMask */) :\n 0;\n const nodeIndexLimit = currentNodeIndex != null ? currentNodeIndex : -1;\n const max = arr.length - 1; // Stop the loop at length - 1, because we look for the hook at i + 1\n let lastNodeIndexFound = 0;\n for (let i = startIndex; i < max; i++) {\n const hook = arr[i + 1];\n if (typeof hook === 'number') {\n lastNodeIndexFound = arr[i];\n if (currentNodeIndex != null && lastNodeIndexFound >= currentNodeIndex) {\n break;\n }\n }\n else {\n const isInitHook = arr[i] < 0;\n if (isInitHook) {\n currentView[PREORDER_HOOK_FLAGS] += 65536 /* PreOrderHookFlags.NumberOfInitHooksCalledIncrementer */;\n }\n if (lastNodeIndexFound < nodeIndexLimit || nodeIndexLimit == -1) {\n callHook(currentView, initPhase, arr, i);\n currentView[PREORDER_HOOK_FLAGS] =\n (currentView[PREORDER_HOOK_FLAGS] & 4294901760 /* PreOrderHookFlags.NumberOfInitHooksCalledMask */) + i +\n 2;\n }\n i++;\n }\n }\n}\n/**\n * Executes a single lifecycle hook, making sure that:\n * - it is called in the non-reactive context;\n * - profiling data are registered.\n */\nfunction callHookInternal(directive, hook) {\n profiler(4 /* ProfilerEvent.LifecycleHookStart */, directive, hook);\n const prevConsumer = setActiveConsumer(null);\n try {\n hook.call(directive);\n }\n finally {\n setActiveConsumer(prevConsumer);\n profiler(5 /* ProfilerEvent.LifecycleHookEnd */, directive, hook);\n }\n}\n/**\n * Execute one hook against the current `LView`.\n *\n * @param currentView The current view\n * @param initPhaseState the current state of the init phase\n * @param arr The array in which the hooks are found\n * @param i The current index within the hook data array\n */\nfunction callHook(currentView, initPhase, arr, i) {\n const isInitHook = arr[i] < 0;\n const hook = arr[i + 1];\n const directiveIndex = isInitHook ? -arr[i] : arr[i];\n const directive = currentView[directiveIndex];\n if (isInitHook) {\n const indexWithintInitPhase = currentView[FLAGS] >> 13 /* LViewFlags.IndexWithinInitPhaseShift */;\n // The init phase state must be always checked here as it may have been recursively updated.\n if (indexWithintInitPhase <\n (currentView[PREORDER_HOOK_FLAGS] >> 16 /* PreOrderHookFlags.NumberOfInitHooksCalledShift */) &&\n (currentView[FLAGS] & 3 /* LViewFlags.InitPhaseStateMask */) === initPhase) {\n currentView[FLAGS] += 8192 /* LViewFlags.IndexWithinInitPhaseIncrementer */;\n callHookInternal(directive, hook);\n }\n }\n else {\n callHookInternal(directive, hook);\n }\n}\n\nconst NO_PARENT_INJECTOR = -1;\n/**\n * Each injector is saved in 9 contiguous slots in `LView` and 9 contiguous slots in\n * `TView.data`. This allows us to store information about the current node's tokens (which\n * can be shared in `TView`) as well as the tokens of its ancestor nodes (which cannot be\n * shared, so they live in `LView`).\n *\n * Each of these slots (aside from the last slot) contains a bloom filter. This bloom filter\n * determines whether a directive is available on the associated node or not. This prevents us\n * from searching the directives array at this level unless it's probable the directive is in it.\n *\n * See: https://en.wikipedia.org/wiki/Bloom_filter for more about bloom filters.\n *\n * Because all injectors have been flattened into `LView` and `TViewData`, they cannot typed\n * using interfaces as they were previously. The start index of each `LInjector` and `TInjector`\n * will differ based on where it is flattened into the main array, so it's not possible to know\n * the indices ahead of time and save their types here. The interfaces are still included here\n * for documentation purposes.\n *\n * export interface LInjector extends Arraytext
- \\n
- \\n \\n {{ tabz.heading }}\\n ❌\\n \\n \\n
\\n
\\n\", styles: [\":host .nav-tabs .nav-item.disabled a.disabled{cursor:default}\\n\"], dependencies: [{ kind: \"directive\", type: i2.NgClass, selector: \"[ngClass]\", inputs: [\"class\", \"ngClass\"] }, { kind: \"directive\", type: i2.NgForOf, selector: \"[ngFor][ngForOf]\", inputs: [\"ngForOf\", \"ngForTrackBy\", \"ngForTemplate\"] }, { kind: \"directive\", type: i2.NgIf, selector: \"[ngIf]\", inputs: [\"ngIf\", \"ngIfThen\", \"ngIfElse\"] }, { kind: \"directive\", type: NgTranscludeDirective, selector: \"[ngTransclude]\", inputs: [\"ngTransclude\"] }] }); }\n}\ni0.ɵɵngDeclareClassMetadata({ minVersion: \"12.0.0\", version: \"17.0.4\", ngImport: i0, type: TabsetComponent, decorators: [{\n type: Component,\n args: [{ selector: 'tabset', template: \"- \\n
- \\n \\n {{ tabz.heading }}\\n ❌\\n \\n \\n
\\n
\\n\", styles: [\":host .nav-tabs .nav-item.disabled a.disabled{cursor:default}\\n\"] }]\n }], ctorParameters: () => [{ type: TabsetConfig }, { type: i0.Renderer2 }, { type: i0.ElementRef }], propDecorators: { vertical: [{\n type: Input\n }], justified: [{\n type: Input\n }], type: [{\n type: Input\n }], clazz: [{\n type: HostBinding,\n args: ['class.tab-container']\n }] } });\n\nclass TabDirective {\n /** if set, will be added to the tab's class attribute. Multiple classes are supported. */\n get customClass() {\n return this._customClass;\n }\n set customClass(customClass) {\n if (this.customClass) {\n this.customClass.split(' ').forEach((cssClass) => {\n this.renderer.removeClass(this.elementRef.nativeElement, cssClass);\n });\n }\n this._customClass = customClass ? customClass.trim() : '';\n if (this.customClass) {\n this.customClass.split(' ').forEach((cssClass) => {\n this.renderer.addClass(this.elementRef.nativeElement, cssClass);\n });\n }\n }\n /** tab active state toggle */\n get active() {\n return this._active;\n }\n set active(active) {\n if (this._active === active) {\n return;\n }\n if ((this.disabled && active) || !active) {\n if (this._active && !active) {\n this.deselect.emit(this);\n this._active = active;\n }\n return;\n }\n this._active = active;\n this.selectTab.emit(this);\n this.tabset.tabs.forEach((tab) => {\n if (tab !== this) {\n tab.active = false;\n }\n });\n }\n get ariaLabelledby() {\n return this.id ? `${this.id}-link` : '';\n }\n constructor(tabset, elementRef, renderer) {\n this.elementRef = elementRef;\n this.renderer = renderer;\n /** if true tab can not be activated */\n this.disabled = false;\n /** if true tab can be removable, additional button will appear */\n this.removable = false;\n /** fired when tab became active, $event:Tab equals to selected instance of Tab component */\n this.selectTab = new EventEmitter();\n /** fired when tab became inactive, $event:Tab equals to deselected instance of Tab component */\n this.deselect = new EventEmitter();\n /** fired before tab will be removed, $event:Tab equals to instance of removed tab */\n this.removed = new EventEmitter();\n this.addClass = true;\n this.role = 'tabpanel';\n this._active = false;\n this._customClass = '';\n this.tabset = tabset;\n this.tabset.addTab(this);\n }\n ngOnInit() {\n this.removable = !!this.removable;\n }\n ngOnDestroy() {\n this.tabset.removeTab(this, { reselect: false, emit: false });\n }\n static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: \"12.0.0\", version: \"17.0.4\", ngImport: i0, type: TabDirective, deps: [{ token: TabsetComponent }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive }); }\n static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: \"14.0.0\", version: \"17.0.4\", type: TabDirective, selector: \"tab, [tab]\", inputs: { heading: \"heading\", id: \"id\", disabled: \"disabled\", removable: \"removable\", customClass: \"customClass\", active: \"active\" }, outputs: { selectTab: \"selectTab\", deselect: \"deselect\", removed: \"removed\" }, host: { properties: { \"attr.id\": \"this.id\", \"class.active\": \"this.active\", \"class.tab-pane\": \"this.addClass\", \"attr.role\": \"this.role\", \"attr.aria-labelledby\": \"this.ariaLabelledby\" } }, exportAs: [\"tab\"], ngImport: i0 }); }\n}\ni0.ɵɵngDeclareClassMetadata({ minVersion: \"12.0.0\", version: \"17.0.4\", ngImport: i0, type: TabDirective, decorators: [{\n type: Directive,\n args: [{ selector: 'tab, [tab]', exportAs: 'tab' }]\n }], ctorParameters: () => [{ type: TabsetComponent }, { type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: { heading: [{\n type: Input\n }], id: [{\n type: HostBinding,\n args: ['attr.id']\n }, {\n type: Input\n }], disabled: [{\n type: Input\n }], removable: [{\n type: Input\n }], customClass: [{\n type: Input\n }], active: [{\n type: HostBinding,\n args: ['class.active']\n }, {\n type: Input\n }], selectTab: [{\n type: Output\n }], deselect: [{\n type: Output\n }], removed: [{\n type: Output\n }], addClass: [{\n type: HostBinding,\n args: ['class.tab-pane']\n }], role: [{\n type: HostBinding,\n args: ['attr.role']\n }], ariaLabelledby: [{\n type: HostBinding,\n args: ['attr.aria-labelledby']\n }] } });\n\n/** Should be used to mark \n \n
\n \n \n \n \n
\n \n \n\n \n
\n\n \n
\n - \n
- \n
{{ component.data?.opening }}
\n {{ startTime | date : \"hh:mm a\" }}\n \n\n - \n
{{ chat.q }}
\n {{ chat.time | date : \"hh:mm a\" }}\n \n - \n
{{ chat.a }}
\n\n \n \n \n \n \n
\n {{\n chat.time | date : \"hh:mm a\"\n }}\n \n
If the `eventName` is not given this will detach all event handlers attached.
If the `handlerToDetach` is not given, this will detach all event handlers for `eventName`.\n * @ko 컴포넌트에 등록된 이벤트를 해제한다.
`eventName`이 주어지지 않았을 경우 모든 이벤트 핸들러를 제거한다.
`handlerToAttach`가 주어지지 않았을 경우 `eventName`에 해당하는 모든 이벤트 핸들러를 제거한다.\n * @param {string?} eventName The name of the event to be detached
Format: column-major, when typed out it looks like row-major
The matrices are being post multiplied.\n * @module mat4\n */\n\n/**\n * Creates a new identity mat4\n *\n * @returns {mat4} a new 4x4 matrix\n */\n\nexport function create() {\n var out = new glMatrix.ARRAY_TYPE(16);\n\n if (glMatrix.ARRAY_TYPE != Float32Array) {\n out[1] = 0;\n out[2] = 0;\n out[3] = 0;\n out[4] = 0;\n out[6] = 0;\n out[7] = 0;\n out[8] = 0;\n out[9] = 0;\n out[11] = 0;\n out[12] = 0;\n out[13] = 0;\n out[14] = 0;\n }\n\n out[0] = 1;\n out[5] = 1;\n out[10] = 1;\n out[15] = 1;\n return out;\n}\n/**\n * Creates a new mat4 initialized with values from an existing matrix\n *\n * @param {ReadonlyMat4} a matrix to clone\n * @returns {mat4} a new 4x4 matrix\n */\n\nexport function clone(a) {\n var out = new glMatrix.ARRAY_TYPE(16);\n out[0] = a[0];\n out[1] = a[1];\n out[2] = a[2];\n out[3] = a[3];\n out[4] = a[4];\n out[5] = a[5];\n out[6] = a[6];\n out[7] = a[7];\n out[8] = a[8];\n out[9] = a[9];\n out[10] = a[10];\n out[11] = a[11];\n out[12] = a[12];\n out[13] = a[13];\n out[14] = a[14];\n out[15] = a[15];\n return out;\n}\n/**\n * Copy the values from one mat4 to another\n *\n * @param {mat4} out the receiving matrix\n * @param {ReadonlyMat4} a the source matrix\n * @returns {mat4} out\n */\n\nexport function copy(out, a) {\n out[0] = a[0];\n out[1] = a[1];\n out[2] = a[2];\n out[3] = a[3];\n out[4] = a[4];\n out[5] = a[5];\n out[6] = a[6];\n out[7] = a[7];\n out[8] = a[8];\n out[9] = a[9];\n out[10] = a[10];\n out[11] = a[11];\n out[12] = a[12];\n out[13] = a[13];\n out[14] = a[14];\n out[15] = a[15];\n return out;\n}\n/**\n * Create a new mat4 with the given values\n *\n * @param {Number} m00 Component in column 0, row 0 position (index 0)\n * @param {Number} m01 Component in column 0, row 1 position (index 1)\n * @param {Number} m02 Component in column 0, row 2 position (index 2)\n * @param {Number} m03 Component in column 0, row 3 position (index 3)\n * @param {Number} m10 Component in column 1, row 0 position (index 4)\n * @param {Number} m11 Component in column 1, row 1 position (index 5)\n * @param {Number} m12 Component in column 1, row 2 position (index 6)\n * @param {Number} m13 Component in column 1, row 3 position (index 7)\n * @param {Number} m20 Component in column 2, row 0 position (index 8)\n * @param {Number} m21 Component in column 2, row 1 position (index 9)\n * @param {Number} m22 Component in column 2, row 2 position (index 10)\n * @param {Number} m23 Component in column 2, row 3 position (index 11)\n * @param {Number} m30 Component in column 3, row 0 position (index 12)\n * @param {Number} m31 Component in column 3, row 1 position (index 13)\n * @param {Number} m32 Component in column 3, row 2 position (index 14)\n * @param {Number} m33 Component in column 3, row 3 position (index 15)\n * @returns {mat4} A new mat4\n */\n\nexport function fromValues(m00, m01, m02, m03, m10, m11, m12, m13, m20, m21, m22, m23, m30, m31, m32, m33) {\n var out = new glMatrix.ARRAY_TYPE(16);\n out[0] = m00;\n out[1] = m01;\n out[2] = m02;\n out[3] = m03;\n out[4] = m10;\n out[5] = m11;\n out[6] = m12;\n out[7] = m13;\n out[8] = m20;\n out[9] = m21;\n out[10] = m22;\n out[11] = m23;\n out[12] = m30;\n out[13] = m31;\n out[14] = m32;\n out[15] = m33;\n return out;\n}\n/**\n * Set the components of a mat4 to the given values\n *\n * @param {mat4} out the receiving matrix\n * @param {Number} m00 Component in column 0, row 0 position (index 0)\n * @param {Number} m01 Component in column 0, row 1 position (index 1)\n * @param {Number} m02 Component in column 0, row 2 position (index 2)\n * @param {Number} m03 Component in column 0, row 3 position (index 3)\n * @param {Number} m10 Component in column 1, row 0 position (index 4)\n * @param {Number} m11 Component in column 1, row 1 position (index 5)\n * @param {Number} m12 Component in column 1, row 2 position (index 6)\n * @param {Number} m13 Component in column 1, row 3 position (index 7)\n * @param {Number} m20 Component in column 2, row 0 position (index 8)\n * @param {Number} m21 Component in column 2, row 1 position (index 9)\n * @param {Number} m22 Component in column 2, row 2 position (index 10)\n * @param {Number} m23 Component in column 2, row 3 position (index 11)\n * @param {Number} m30 Component in column 3, row 0 position (index 12)\n * @param {Number} m31 Component in column 3, row 1 position (index 13)\n * @param {Number} m32 Component in column 3, row 2 position (index 14)\n * @param {Number} m33 Component in column 3, row 3 position (index 15)\n * @returns {mat4} out\n */\n\nexport function set(out, m00, m01, m02, m03, m10, m11, m12, m13, m20, m21, m22, m23, m30, m31, m32, m33) {\n out[0] = m00;\n out[1] = m01;\n out[2] = m02;\n out[3] = m03;\n out[4] = m10;\n out[5] = m11;\n out[6] = m12;\n out[7] = m13;\n out[8] = m20;\n out[9] = m21;\n out[10] = m22;\n out[11] = m23;\n out[12] = m30;\n out[13] = m31;\n out[14] = m32;\n out[15] = m33;\n return out;\n}\n/**\n * Set a mat4 to the identity matrix\n *\n * @param {mat4} out the receiving matrix\n * @returns {mat4} out\n */\n\nexport function identity(out) {\n out[0] = 1;\n out[1] = 0;\n out[2] = 0;\n out[3] = 0;\n out[4] = 0;\n out[5] = 1;\n out[6] = 0;\n out[7] = 0;\n out[8] = 0;\n out[9] = 0;\n out[10] = 1;\n out[11] = 0;\n out[12] = 0;\n out[13] = 0;\n out[14] = 0;\n out[15] = 1;\n return out;\n}\n/**\n * Transpose the values of a mat4\n *\n * @param {mat4} out the receiving matrix\n * @param {ReadonlyMat4} a the source matrix\n * @returns {mat4} out\n */\n\nexport function transpose(out, a) {\n // If we are transposing ourselves we can skip a few steps but have to cache some values\n if (out === a) {\n var a01 = a[1],\n a02 = a[2],\n a03 = a[3];\n var a12 = a[6],\n a13 = a[7];\n var a23 = a[11];\n out[1] = a[4];\n out[2] = a[8];\n out[3] = a[12];\n out[4] = a01;\n out[6] = a[9];\n out[7] = a[13];\n out[8] = a02;\n out[9] = a12;\n out[11] = a[14];\n out[12] = a03;\n out[13] = a13;\n out[14] = a23;\n } else {\n out[0] = a[0];\n out[1] = a[4];\n out[2] = a[8];\n out[3] = a[12];\n out[4] = a[1];\n out[5] = a[5];\n out[6] = a[9];\n out[7] = a[13];\n out[8] = a[2];\n out[9] = a[6];\n out[10] = a[10];\n out[11] = a[14];\n out[12] = a[3];\n out[13] = a[7];\n out[14] = a[11];\n out[15] = a[15];\n }\n\n return out;\n}\n/**\n * Inverts a mat4\n *\n * @param {mat4} out the receiving matrix\n * @param {ReadonlyMat4} a the source matrix\n * @returns {mat4} out\n */\n\nexport function invert(out, a) {\n var a00 = a[0],\n a01 = a[1],\n a02 = a[2],\n a03 = a[3];\n var a10 = a[4],\n a11 = a[5],\n a12 = a[6],\n a13 = a[7];\n var a20 = a[8],\n a21 = a[9],\n a22 = a[10],\n a23 = a[11];\n var a30 = a[12],\n a31 = a[13],\n a32 = a[14],\n a33 = a[15];\n var b00 = a00 * a11 - a01 * a10;\n var b01 = a00 * a12 - a02 * a10;\n var b02 = a00 * a13 - a03 * a10;\n var b03 = a01 * a12 - a02 * a11;\n var b04 = a01 * a13 - a03 * a11;\n var b05 = a02 * a13 - a03 * a12;\n var b06 = a20 * a31 - a21 * a30;\n var b07 = a20 * a32 - a22 * a30;\n var b08 = a20 * a33 - a23 * a30;\n var b09 = a21 * a32 - a22 * a31;\n var b10 = a21 * a33 - a23 * a31;\n var b11 = a22 * a33 - a23 * a32; // Calculate the determinant\n\n var det = b00 * b11 - b01 * b10 + b02 * b09 + b03 * b08 - b04 * b07 + b05 * b06;\n\n if (!det) {\n return null;\n }\n\n det = 1.0 / det;\n out[0] = (a11 * b11 - a12 * b10 + a13 * b09) * det;\n out[1] = (a02 * b10 - a01 * b11 - a03 * b09) * det;\n out[2] = (a31 * b05 - a32 * b04 + a33 * b03) * det;\n out[3] = (a22 * b04 - a21 * b05 - a23 * b03) * det;\n out[4] = (a12 * b08 - a10 * b11 - a13 * b07) * det;\n out[5] = (a00 * b11 - a02 * b08 + a03 * b07) * det;\n out[6] = (a32 * b02 - a30 * b05 - a33 * b01) * det;\n out[7] = (a20 * b05 - a22 * b02 + a23 * b01) * det;\n out[8] = (a10 * b10 - a11 * b08 + a13 * b06) * det;\n out[9] = (a01 * b08 - a00 * b10 - a03 * b06) * det;\n out[10] = (a30 * b04 - a31 * b02 + a33 * b00) * det;\n out[11] = (a21 * b02 - a20 * b04 - a23 * b00) * det;\n out[12] = (a11 * b07 - a10 * b09 - a12 * b06) * det;\n out[13] = (a00 * b09 - a01 * b07 + a02 * b06) * det;\n out[14] = (a31 * b01 - a30 * b03 - a32 * b00) * det;\n out[15] = (a20 * b03 - a21 * b01 + a22 * b00) * det;\n return out;\n}\n/**\n * Calculates the adjugate of a mat4\n *\n * @param {mat4} out the receiving matrix\n * @param {ReadonlyMat4} a the source matrix\n * @returns {mat4} out\n */\n\nexport function adjoint(out, a) {\n var a00 = a[0],\n a01 = a[1],\n a02 = a[2],\n a03 = a[3];\n var a10 = a[4],\n a11 = a[5],\n a12 = a[6],\n a13 = a[7];\n var a20 = a[8],\n a21 = a[9],\n a22 = a[10],\n a23 = a[11];\n var a30 = a[12],\n a31 = a[13],\n a32 = a[14],\n a33 = a[15];\n out[0] = a11 * (a22 * a33 - a23 * a32) - a21 * (a12 * a33 - a13 * a32) + a31 * (a12 * a23 - a13 * a22);\n out[1] = -(a01 * (a22 * a33 - a23 * a32) - a21 * (a02 * a33 - a03 * a32) + a31 * (a02 * a23 - a03 * a22));\n out[2] = a01 * (a12 * a33 - a13 * a32) - a11 * (a02 * a33 - a03 * a32) + a31 * (a02 * a13 - a03 * a12);\n out[3] = -(a01 * (a12 * a23 - a13 * a22) - a11 * (a02 * a23 - a03 * a22) + a21 * (a02 * a13 - a03 * a12));\n out[4] = -(a10 * (a22 * a33 - a23 * a32) - a20 * (a12 * a33 - a13 * a32) + a30 * (a12 * a23 - a13 * a22));\n out[5] = a00 * (a22 * a33 - a23 * a32) - a20 * (a02 * a33 - a03 * a32) + a30 * (a02 * a23 - a03 * a22);\n out[6] = -(a00 * (a12 * a33 - a13 * a32) - a10 * (a02 * a33 - a03 * a32) + a30 * (a02 * a13 - a03 * a12));\n out[7] = a00 * (a12 * a23 - a13 * a22) - a10 * (a02 * a23 - a03 * a22) + a20 * (a02 * a13 - a03 * a12);\n out[8] = a10 * (a21 * a33 - a23 * a31) - a20 * (a11 * a33 - a13 * a31) + a30 * (a11 * a23 - a13 * a21);\n out[9] = -(a00 * (a21 * a33 - a23 * a31) - a20 * (a01 * a33 - a03 * a31) + a30 * (a01 * a23 - a03 * a21));\n out[10] = a00 * (a11 * a33 - a13 * a31) - a10 * (a01 * a33 - a03 * a31) + a30 * (a01 * a13 - a03 * a11);\n out[11] = -(a00 * (a11 * a23 - a13 * a21) - a10 * (a01 * a23 - a03 * a21) + a20 * (a01 * a13 - a03 * a11));\n out[12] = -(a10 * (a21 * a32 - a22 * a31) - a20 * (a11 * a32 - a12 * a31) + a30 * (a11 * a22 - a12 * a21));\n out[13] = a00 * (a21 * a32 - a22 * a31) - a20 * (a01 * a32 - a02 * a31) + a30 * (a01 * a22 - a02 * a21);\n out[14] = -(a00 * (a11 * a32 - a12 * a31) - a10 * (a01 * a32 - a02 * a31) + a30 * (a01 * a12 - a02 * a11));\n out[15] = a00 * (a11 * a22 - a12 * a21) - a10 * (a01 * a22 - a02 * a21) + a20 * (a01 * a12 - a02 * a11);\n return out;\n}\n/**\n * Calculates the determinant of a mat4\n *\n * @param {ReadonlyMat4} a the source matrix\n * @returns {Number} determinant of a\n */\n\nexport function determinant(a) {\n var a00 = a[0],\n a01 = a[1],\n a02 = a[2],\n a03 = a[3];\n var a10 = a[4],\n a11 = a[5],\n a12 = a[6],\n a13 = a[7];\n var a20 = a[8],\n a21 = a[9],\n a22 = a[10],\n a23 = a[11];\n var a30 = a[12],\n a31 = a[13],\n a32 = a[14],\n a33 = a[15];\n var b00 = a00 * a11 - a01 * a10;\n var b01 = a00 * a12 - a02 * a10;\n var b02 = a00 * a13 - a03 * a10;\n var b03 = a01 * a12 - a02 * a11;\n var b04 = a01 * a13 - a03 * a11;\n var b05 = a02 * a13 - a03 * a12;\n var b06 = a20 * a31 - a21 * a30;\n var b07 = a20 * a32 - a22 * a30;\n var b08 = a20 * a33 - a23 * a30;\n var b09 = a21 * a32 - a22 * a31;\n var b10 = a21 * a33 - a23 * a31;\n var b11 = a22 * a33 - a23 * a32; // Calculate the determinant\n\n return b00 * b11 - b01 * b10 + b02 * b09 + b03 * b08 - b04 * b07 + b05 * b06;\n}\n/**\n * Multiplies two mat4s\n *\n * @param {mat4} out the receiving matrix\n * @param {ReadonlyMat4} a the first operand\n * @param {ReadonlyMat4} b the second operand\n * @returns {mat4} out\n */\n\nexport function multiply(out, a, b) {\n var a00 = a[0],\n a01 = a[1],\n a02 = a[2],\n a03 = a[3];\n var a10 = a[4],\n a11 = a[5],\n a12 = a[6],\n a13 = a[7];\n var a20 = a[8],\n a21 = a[9],\n a22 = a[10],\n a23 = a[11];\n var a30 = a[12],\n a31 = a[13],\n a32 = a[14],\n a33 = a[15]; // Cache only the current line of the second matrix\n\n var b0 = b[0],\n b1 = b[1],\n b2 = b[2],\n b3 = b[3];\n out[0] = b0 * a00 + b1 * a10 + b2 * a20 + b3 * a30;\n out[1] = b0 * a01 + b1 * a11 + b2 * a21 + b3 * a31;\n out[2] = b0 * a02 + b1 * a12 + b2 * a22 + b3 * a32;\n out[3] = b0 * a03 + b1 * a13 + b2 * a23 + b3 * a33;\n b0 = b[4];\n b1 = b[5];\n b2 = b[6];\n b3 = b[7];\n out[4] = b0 * a00 + b1 * a10 + b2 * a20 + b3 * a30;\n out[5] = b0 * a01 + b1 * a11 + b2 * a21 + b3 * a31;\n out[6] = b0 * a02 + b1 * a12 + b2 * a22 + b3 * a32;\n out[7] = b0 * a03 + b1 * a13 + b2 * a23 + b3 * a33;\n b0 = b[8];\n b1 = b[9];\n b2 = b[10];\n b3 = b[11];\n out[8] = b0 * a00 + b1 * a10 + b2 * a20 + b3 * a30;\n out[9] = b0 * a01 + b1 * a11 + b2 * a21 + b3 * a31;\n out[10] = b0 * a02 + b1 * a12 + b2 * a22 + b3 * a32;\n out[11] = b0 * a03 + b1 * a13 + b2 * a23 + b3 * a33;\n b0 = b[12];\n b1 = b[13];\n b2 = b[14];\n b3 = b[15];\n out[12] = b0 * a00 + b1 * a10 + b2 * a20 + b3 * a30;\n out[13] = b0 * a01 + b1 * a11 + b2 * a21 + b3 * a31;\n out[14] = b0 * a02 + b1 * a12 + b2 * a22 + b3 * a32;\n out[15] = b0 * a03 + b1 * a13 + b2 * a23 + b3 * a33;\n return out;\n}\n/**\n * Translate a mat4 by the given vector\n *\n * @param {mat4} out the receiving matrix\n * @param {ReadonlyMat4} a the matrix to translate\n * @param {ReadonlyVec3} v vector to translate by\n * @returns {mat4} out\n */\n\nexport function translate(out, a, v) {\n var x = v[0],\n y = v[1],\n z = v[2];\n var a00, a01, a02, a03;\n var a10, a11, a12, a13;\n var a20, a21, a22, a23;\n\n if (a === out) {\n out[12] = a[0] * x + a[4] * y + a[8] * z + a[12];\n out[13] = a[1] * x + a[5] * y + a[9] * z + a[13];\n out[14] = a[2] * x + a[6] * y + a[10] * z + a[14];\n out[15] = a[3] * x + a[7] * y + a[11] * z + a[15];\n } else {\n a00 = a[0];\n a01 = a[1];\n a02 = a[2];\n a03 = a[3];\n a10 = a[4];\n a11 = a[5];\n a12 = a[6];\n a13 = a[7];\n a20 = a[8];\n a21 = a[9];\n a22 = a[10];\n a23 = a[11];\n out[0] = a00;\n out[1] = a01;\n out[2] = a02;\n out[3] = a03;\n out[4] = a10;\n out[5] = a11;\n out[6] = a12;\n out[7] = a13;\n out[8] = a20;\n out[9] = a21;\n out[10] = a22;\n out[11] = a23;\n out[12] = a00 * x + a10 * y + a20 * z + a[12];\n out[13] = a01 * x + a11 * y + a21 * z + a[13];\n out[14] = a02 * x + a12 * y + a22 * z + a[14];\n out[15] = a03 * x + a13 * y + a23 * z + a[15];\n }\n\n return out;\n}\n/**\n * Scales the mat4 by the dimensions in the given vec3 not using vectorization\n *\n * @param {mat4} out the receiving matrix\n * @param {ReadonlyMat4} a the matrix to scale\n * @param {ReadonlyVec3} v the vec3 to scale the matrix by\n * @returns {mat4} out\n **/\n\nexport function scale(out, a, v) {\n var x = v[0],\n y = v[1],\n z = v[2];\n out[0] = a[0] * x;\n out[1] = a[1] * x;\n out[2] = a[2] * x;\n out[3] = a[3] * x;\n out[4] = a[4] * y;\n out[5] = a[5] * y;\n out[6] = a[6] * y;\n out[7] = a[7] * y;\n out[8] = a[8] * z;\n out[9] = a[9] * z;\n out[10] = a[10] * z;\n out[11] = a[11] * z;\n out[12] = a[12];\n out[13] = a[13];\n out[14] = a[14];\n out[15] = a[15];\n return out;\n}\n/**\n * Rotates a mat4 by the given angle around the given axis\n *\n * @param {mat4} out the receiving matrix\n * @param {ReadonlyMat4} a the matrix to rotate\n * @param {Number} rad the angle to rotate the matrix by\n * @param {ReadonlyVec3} axis the axis to rotate around\n * @returns {mat4} out\n */\n\nexport function rotate(out, a, rad, axis) {\n var x = axis[0],\n y = axis[1],\n z = axis[2];\n var len = Math.hypot(x, y, z);\n var s, c, t;\n var a00, a01, a02, a03;\n var a10, a11, a12, a13;\n var a20, a21, a22, a23;\n var b00, b01, b02;\n var b10, b11, b12;\n var b20, b21, b22;\n\n if (len < glMatrix.EPSILON) {\n return null;\n }\n\n len = 1 / len;\n x *= len;\n y *= len;\n z *= len;\n s = Math.sin(rad);\n c = Math.cos(rad);\n t = 1 - c;\n a00 = a[0];\n a01 = a[1];\n a02 = a[2];\n a03 = a[3];\n a10 = a[4];\n a11 = a[5];\n a12 = a[6];\n a13 = a[7];\n a20 = a[8];\n a21 = a[9];\n a22 = a[10];\n a23 = a[11]; // Construct the elements of the rotation matrix\n\n b00 = x * x * t + c;\n b01 = y * x * t + z * s;\n b02 = z * x * t - y * s;\n b10 = x * y * t - z * s;\n b11 = y * y * t + c;\n b12 = z * y * t + x * s;\n b20 = x * z * t + y * s;\n b21 = y * z * t - x * s;\n b22 = z * z * t + c; // Perform rotation-specific matrix multiplication\n\n out[0] = a00 * b00 + a10 * b01 + a20 * b02;\n out[1] = a01 * b00 + a11 * b01 + a21 * b02;\n out[2] = a02 * b00 + a12 * b01 + a22 * b02;\n out[3] = a03 * b00 + a13 * b01 + a23 * b02;\n out[4] = a00 * b10 + a10 * b11 + a20 * b12;\n out[5] = a01 * b10 + a11 * b11 + a21 * b12;\n out[6] = a02 * b10 + a12 * b11 + a22 * b12;\n out[7] = a03 * b10 + a13 * b11 + a23 * b12;\n out[8] = a00 * b20 + a10 * b21 + a20 * b22;\n out[9] = a01 * b20 + a11 * b21 + a21 * b22;\n out[10] = a02 * b20 + a12 * b21 + a22 * b22;\n out[11] = a03 * b20 + a13 * b21 + a23 * b22;\n\n if (a !== out) {\n // If the source and destination differ, copy the unchanged last row\n out[12] = a[12];\n out[13] = a[13];\n out[14] = a[14];\n out[15] = a[15];\n }\n\n return out;\n}\n/**\n * Rotates a matrix by the given angle around the X axis\n *\n * @param {mat4} out the receiving matrix\n * @param {ReadonlyMat4} a the matrix to rotate\n * @param {Number} rad the angle to rotate the matrix by\n * @returns {mat4} out\n */\n\nexport function rotateX(out, a, rad) {\n var s = Math.sin(rad);\n var c = Math.cos(rad);\n var a10 = a[4];\n var a11 = a[5];\n var a12 = a[6];\n var a13 = a[7];\n var a20 = a[8];\n var a21 = a[9];\n var a22 = a[10];\n var a23 = a[11];\n\n if (a !== out) {\n // If the source and destination differ, copy the unchanged rows\n out[0] = a[0];\n out[1] = a[1];\n out[2] = a[2];\n out[3] = a[3];\n out[12] = a[12];\n out[13] = a[13];\n out[14] = a[14];\n out[15] = a[15];\n } // Perform axis-specific matrix multiplication\n\n\n out[4] = a10 * c + a20 * s;\n out[5] = a11 * c + a21 * s;\n out[6] = a12 * c + a22 * s;\n out[7] = a13 * c + a23 * s;\n out[8] = a20 * c - a10 * s;\n out[9] = a21 * c - a11 * s;\n out[10] = a22 * c - a12 * s;\n out[11] = a23 * c - a13 * s;\n return out;\n}\n/**\n * Rotates a matrix by the given angle around the Y axis\n *\n * @param {mat4} out the receiving matrix\n * @param {ReadonlyMat4} a the matrix to rotate\n * @param {Number} rad the angle to rotate the matrix by\n * @returns {mat4} out\n */\n\nexport function rotateY(out, a, rad) {\n var s = Math.sin(rad);\n var c = Math.cos(rad);\n var a00 = a[0];\n var a01 = a[1];\n var a02 = a[2];\n var a03 = a[3];\n var a20 = a[8];\n var a21 = a[9];\n var a22 = a[10];\n var a23 = a[11];\n\n if (a !== out) {\n // If the source and destination differ, copy the unchanged rows\n out[4] = a[4];\n out[5] = a[5];\n out[6] = a[6];\n out[7] = a[7];\n out[12] = a[12];\n out[13] = a[13];\n out[14] = a[14];\n out[15] = a[15];\n } // Perform axis-specific matrix multiplication\n\n\n out[0] = a00 * c - a20 * s;\n out[1] = a01 * c - a21 * s;\n out[2] = a02 * c - a22 * s;\n out[3] = a03 * c - a23 * s;\n out[8] = a00 * s + a20 * c;\n out[9] = a01 * s + a21 * c;\n out[10] = a02 * s + a22 * c;\n out[11] = a03 * s + a23 * c;\n return out;\n}\n/**\n * Rotates a matrix by the given angle around the Z axis\n *\n * @param {mat4} out the receiving matrix\n * @param {ReadonlyMat4} a the matrix to rotate\n * @param {Number} rad the angle to rotate the matrix by\n * @returns {mat4} out\n */\n\nexport function rotateZ(out, a, rad) {\n var s = Math.sin(rad);\n var c = Math.cos(rad);\n var a00 = a[0];\n var a01 = a[1];\n var a02 = a[2];\n var a03 = a[3];\n var a10 = a[4];\n var a11 = a[5];\n var a12 = a[6];\n var a13 = a[7];\n\n if (a !== out) {\n // If the source and destination differ, copy the unchanged last row\n out[8] = a[8];\n out[9] = a[9];\n out[10] = a[10];\n out[11] = a[11];\n out[12] = a[12];\n out[13] = a[13];\n out[14] = a[14];\n out[15] = a[15];\n } // Perform axis-specific matrix multiplication\n\n\n out[0] = a00 * c + a10 * s;\n out[1] = a01 * c + a11 * s;\n out[2] = a02 * c + a12 * s;\n out[3] = a03 * c + a13 * s;\n out[4] = a10 * c - a00 * s;\n out[5] = a11 * c - a01 * s;\n out[6] = a12 * c - a02 * s;\n out[7] = a13 * c - a03 * s;\n return out;\n}\n/**\n * Creates a matrix from a vector translation\n * This is equivalent to (but much faster than):\n *\n * mat4.identity(dest);\n * mat4.translate(dest, dest, vec);\n *\n * @param {mat4} out mat4 receiving operation result\n * @param {ReadonlyVec3} v Translation vector\n * @returns {mat4} out\n */\n\nexport function fromTranslation(out, v) {\n out[0] = 1;\n out[1] = 0;\n out[2] = 0;\n out[3] = 0;\n out[4] = 0;\n out[5] = 1;\n out[6] = 0;\n out[7] = 0;\n out[8] = 0;\n out[9] = 0;\n out[10] = 1;\n out[11] = 0;\n out[12] = v[0];\n out[13] = v[1];\n out[14] = v[2];\n out[15] = 1;\n return out;\n}\n/**\n * Creates a matrix from a vector scaling\n * This is equivalent to (but much faster than):\n *\n * mat4.identity(dest);\n * mat4.scale(dest, dest, vec);\n *\n * @param {mat4} out mat4 receiving operation result\n * @param {ReadonlyVec3} v Scaling vector\n * @returns {mat4} out\n */\n\nexport function fromScaling(out, v) {\n out[0] = v[0];\n out[1] = 0;\n out[2] = 0;\n out[3] = 0;\n out[4] = 0;\n out[5] = v[1];\n out[6] = 0;\n out[7] = 0;\n out[8] = 0;\n out[9] = 0;\n out[10] = v[2];\n out[11] = 0;\n out[12] = 0;\n out[13] = 0;\n out[14] = 0;\n out[15] = 1;\n return out;\n}\n/**\n * Creates a matrix from a given angle around a given axis\n * This is equivalent to (but much faster than):\n *\n * mat4.identity(dest);\n * mat4.rotate(dest, dest, rad, axis);\n *\n * @param {mat4} out mat4 receiving operation result\n * @param {Number} rad the angle to rotate the matrix by\n * @param {ReadonlyVec3} axis the axis to rotate around\n * @returns {mat4} out\n */\n\nexport function fromRotation(out, rad, axis) {\n var x = axis[0],\n y = axis[1],\n z = axis[2];\n var len = Math.hypot(x, y, z);\n var s, c, t;\n\n if (len < glMatrix.EPSILON) {\n return null;\n }\n\n len = 1 / len;\n x *= len;\n y *= len;\n z *= len;\n s = Math.sin(rad);\n c = Math.cos(rad);\n t = 1 - c; // Perform rotation-specific matrix multiplication\n\n out[0] = x * x * t + c;\n out[1] = y * x * t + z * s;\n out[2] = z * x * t - y * s;\n out[3] = 0;\n out[4] = x * y * t - z * s;\n out[5] = y * y * t + c;\n out[6] = z * y * t + x * s;\n out[7] = 0;\n out[8] = x * z * t + y * s;\n out[9] = y * z * t - x * s;\n out[10] = z * z * t + c;\n out[11] = 0;\n out[12] = 0;\n out[13] = 0;\n out[14] = 0;\n out[15] = 1;\n return out;\n}\n/**\n * Creates a matrix from the given angle around the X axis\n * This is equivalent to (but much faster than):\n *\n * mat4.identity(dest);\n * mat4.rotateX(dest, dest, rad);\n *\n * @param {mat4} out mat4 receiving operation result\n * @param {Number} rad the angle to rotate the matrix by\n * @returns {mat4} out\n */\n\nexport function fromXRotation(out, rad) {\n var s = Math.sin(rad);\n var c = Math.cos(rad); // Perform axis-specific matrix multiplication\n\n out[0] = 1;\n out[1] = 0;\n out[2] = 0;\n out[3] = 0;\n out[4] = 0;\n out[5] = c;\n out[6] = s;\n out[7] = 0;\n out[8] = 0;\n out[9] = -s;\n out[10] = c;\n out[11] = 0;\n out[12] = 0;\n out[13] = 0;\n out[14] = 0;\n out[15] = 1;\n return out;\n}\n/**\n * Creates a matrix from the given angle around the Y axis\n * This is equivalent to (but much faster than):\n *\n * mat4.identity(dest);\n * mat4.rotateY(dest, dest, rad);\n *\n * @param {mat4} out mat4 receiving operation result\n * @param {Number} rad the angle to rotate the matrix by\n * @returns {mat4} out\n */\n\nexport function fromYRotation(out, rad) {\n var s = Math.sin(rad);\n var c = Math.cos(rad); // Perform axis-specific matrix multiplication\n\n out[0] = c;\n out[1] = 0;\n out[2] = -s;\n out[3] = 0;\n out[4] = 0;\n out[5] = 1;\n out[6] = 0;\n out[7] = 0;\n out[8] = s;\n out[9] = 0;\n out[10] = c;\n out[11] = 0;\n out[12] = 0;\n out[13] = 0;\n out[14] = 0;\n out[15] = 1;\n return out;\n}\n/**\n * Creates a matrix from the given angle around the Z axis\n * This is equivalent to (but much faster than):\n *\n * mat4.identity(dest);\n * mat4.rotateZ(dest, dest, rad);\n *\n * @param {mat4} out mat4 receiving operation result\n * @param {Number} rad the angle to rotate the matrix by\n * @returns {mat4} out\n */\n\nexport function fromZRotation(out, rad) {\n var s = Math.sin(rad);\n var c = Math.cos(rad); // Perform axis-specific matrix multiplication\n\n out[0] = c;\n out[1] = s;\n out[2] = 0;\n out[3] = 0;\n out[4] = -s;\n out[5] = c;\n out[6] = 0;\n out[7] = 0;\n out[8] = 0;\n out[9] = 0;\n out[10] = 1;\n out[11] = 0;\n out[12] = 0;\n out[13] = 0;\n out[14] = 0;\n out[15] = 1;\n return out;\n}\n/**\n * Creates a matrix from a quaternion rotation and vector translation\n * This is equivalent to (but much faster than):\n *\n * mat4.identity(dest);\n * mat4.translate(dest, vec);\n * let quatMat = mat4.create();\n * quat4.toMat4(quat, quatMat);\n * mat4.multiply(dest, quatMat);\n *\n * @param {mat4} out mat4 receiving operation result\n * @param {quat4} q Rotation quaternion\n * @param {ReadonlyVec3} v Translation vector\n * @returns {mat4} out\n */\n\nexport function fromRotationTranslation(out, q, v) {\n // Quaternion math\n var x = q[0],\n y = q[1],\n z = q[2],\n w = q[3];\n var x2 = x + x;\n var y2 = y + y;\n var z2 = z + z;\n var xx = x * x2;\n var xy = x * y2;\n var xz = x * z2;\n var yy = y * y2;\n var yz = y * z2;\n var zz = z * z2;\n var wx = w * x2;\n var wy = w * y2;\n var wz = w * z2;\n out[0] = 1 - (yy + zz);\n out[1] = xy + wz;\n out[2] = xz - wy;\n out[3] = 0;\n out[4] = xy - wz;\n out[5] = 1 - (xx + zz);\n out[6] = yz + wx;\n out[7] = 0;\n out[8] = xz + wy;\n out[9] = yz - wx;\n out[10] = 1 - (xx + yy);\n out[11] = 0;\n out[12] = v[0];\n out[13] = v[1];\n out[14] = v[2];\n out[15] = 1;\n return out;\n}\n/**\n * Creates a new mat4 from a dual quat.\n *\n * @param {mat4} out Matrix\n * @param {ReadonlyQuat2} a Dual Quaternion\n * @returns {mat4} mat4 receiving operation result\n */\n\nexport function fromQuat2(out, a) {\n var translation = new glMatrix.ARRAY_TYPE(3);\n var bx = -a[0],\n by = -a[1],\n bz = -a[2],\n bw = a[3],\n ax = a[4],\n ay = a[5],\n az = a[6],\n aw = a[7];\n var magnitude = bx * bx + by * by + bz * bz + bw * bw; //Only scale if it makes sense\n\n if (magnitude > 0) {\n translation[0] = (ax * bw + aw * bx + ay * bz - az * by) * 2 / magnitude;\n translation[1] = (ay * bw + aw * by + az * bx - ax * bz) * 2 / magnitude;\n translation[2] = (az * bw + aw * bz + ax * by - ay * bx) * 2 / magnitude;\n } else {\n translation[0] = (ax * bw + aw * bx + ay * bz - az * by) * 2;\n translation[1] = (ay * bw + aw * by + az * bx - ax * bz) * 2;\n translation[2] = (az * bw + aw * bz + ax * by - ay * bx) * 2;\n }\n\n fromRotationTranslation(out, a, translation);\n return out;\n}\n/**\n * Returns the translation vector component of a transformation\n * matrix. If a matrix is built with fromRotationTranslation,\n * the returned vector will be the same as the translation vector\n * originally supplied.\n * @param {vec3} out Vector to receive translation component\n * @param {ReadonlyMat4} mat Matrix to be decomposed (input)\n * @return {vec3} out\n */\n\nexport function getTranslation(out, mat) {\n out[0] = mat[12];\n out[1] = mat[13];\n out[2] = mat[14];\n return out;\n}\n/**\n * Returns the scaling factor component of a transformation\n * matrix. If a matrix is built with fromRotationTranslationScale\n * with a normalized Quaternion paramter, the returned vector will be\n * the same as the scaling vector\n * originally supplied.\n * @param {vec3} out Vector to receive scaling factor component\n * @param {ReadonlyMat4} mat Matrix to be decomposed (input)\n * @return {vec3} out\n */\n\nexport function getScaling(out, mat) {\n var m11 = mat[0];\n var m12 = mat[1];\n var m13 = mat[2];\n var m21 = mat[4];\n var m22 = mat[5];\n var m23 = mat[6];\n var m31 = mat[8];\n var m32 = mat[9];\n var m33 = mat[10];\n out[0] = Math.hypot(m11, m12, m13);\n out[1] = Math.hypot(m21, m22, m23);\n out[2] = Math.hypot(m31, m32, m33);\n return out;\n}\n/**\n * Returns a quaternion representing the rotational component\n * of a transformation matrix. If a matrix is built with\n * fromRotationTranslation, the returned quaternion will be the\n * same as the quaternion originally supplied.\n * @param {quat} out Quaternion to receive the rotation component\n * @param {ReadonlyMat4} mat Matrix to be decomposed (input)\n * @return {quat} out\n */\n\nexport function getRotation(out, mat) {\n var scaling = new glMatrix.ARRAY_TYPE(3);\n getScaling(scaling, mat);\n var is1 = 1 / scaling[0];\n var is2 = 1 / scaling[1];\n var is3 = 1 / scaling[2];\n var sm11 = mat[0] * is1;\n var sm12 = mat[1] * is2;\n var sm13 = mat[2] * is3;\n var sm21 = mat[4] * is1;\n var sm22 = mat[5] * is2;\n var sm23 = mat[6] * is3;\n var sm31 = mat[8] * is1;\n var sm32 = mat[9] * is2;\n var sm33 = mat[10] * is3;\n var trace = sm11 + sm22 + sm33;\n var S = 0;\n\n if (trace > 0) {\n S = Math.sqrt(trace + 1.0) * 2;\n out[3] = 0.25 * S;\n out[0] = (sm23 - sm32) / S;\n out[1] = (sm31 - sm13) / S;\n out[2] = (sm12 - sm21) / S;\n } else if (sm11 > sm22 && sm11 > sm33) {\n S = Math.sqrt(1.0 + sm11 - sm22 - sm33) * 2;\n out[3] = (sm23 - sm32) / S;\n out[0] = 0.25 * S;\n out[1] = (sm12 + sm21) / S;\n out[2] = (sm31 + sm13) / S;\n } else if (sm22 > sm33) {\n S = Math.sqrt(1.0 + sm22 - sm11 - sm33) * 2;\n out[3] = (sm31 - sm13) / S;\n out[0] = (sm12 + sm21) / S;\n out[1] = 0.25 * S;\n out[2] = (sm23 + sm32) / S;\n } else {\n S = Math.sqrt(1.0 + sm33 - sm11 - sm22) * 2;\n out[3] = (sm12 - sm21) / S;\n out[0] = (sm31 + sm13) / S;\n out[1] = (sm23 + sm32) / S;\n out[2] = 0.25 * S;\n }\n\n return out;\n}\n/**\n * Creates a matrix from a quaternion rotation, vector translation and vector scale\n * This is equivalent to (but much faster than):\n *\n * mat4.identity(dest);\n * mat4.translate(dest, vec);\n * let quatMat = mat4.create();\n * quat4.toMat4(quat, quatMat);\n * mat4.multiply(dest, quatMat);\n * mat4.scale(dest, scale)\n *\n * @param {mat4} out mat4 receiving operation result\n * @param {quat4} q Rotation quaternion\n * @param {ReadonlyVec3} v Translation vector\n * @param {ReadonlyVec3} s Scaling vector\n * @returns {mat4} out\n */\n\nexport function fromRotationTranslationScale(out, q, v, s) {\n // Quaternion math\n var x = q[0],\n y = q[1],\n z = q[2],\n w = q[3];\n var x2 = x + x;\n var y2 = y + y;\n var z2 = z + z;\n var xx = x * x2;\n var xy = x * y2;\n var xz = x * z2;\n var yy = y * y2;\n var yz = y * z2;\n var zz = z * z2;\n var wx = w * x2;\n var wy = w * y2;\n var wz = w * z2;\n var sx = s[0];\n var sy = s[1];\n var sz = s[2];\n out[0] = (1 - (yy + zz)) * sx;\n out[1] = (xy + wz) * sx;\n out[2] = (xz - wy) * sx;\n out[3] = 0;\n out[4] = (xy - wz) * sy;\n out[5] = (1 - (xx + zz)) * sy;\n out[6] = (yz + wx) * sy;\n out[7] = 0;\n out[8] = (xz + wy) * sz;\n out[9] = (yz - wx) * sz;\n out[10] = (1 - (xx + yy)) * sz;\n out[11] = 0;\n out[12] = v[0];\n out[13] = v[1];\n out[14] = v[2];\n out[15] = 1;\n return out;\n}\n/**\n * Creates a matrix from a quaternion rotation, vector translation and vector scale, rotating and scaling around the given origin\n * This is equivalent to (but much faster than):\n *\n * mat4.identity(dest);\n * mat4.translate(dest, vec);\n * mat4.translate(dest, origin);\n * let quatMat = mat4.create();\n * quat4.toMat4(quat, quatMat);\n * mat4.multiply(dest, quatMat);\n * mat4.scale(dest, scale)\n * mat4.translate(dest, negativeOrigin);\n *\n * @param {mat4} out mat4 receiving operation result\n * @param {quat4} q Rotation quaternion\n * @param {ReadonlyVec3} v Translation vector\n * @param {ReadonlyVec3} s Scaling vector\n * @param {ReadonlyVec3} o The origin vector around which to scale and rotate\n * @returns {mat4} out\n */\n\nexport function fromRotationTranslationScaleOrigin(out, q, v, s, o) {\n // Quaternion math\n var x = q[0],\n y = q[1],\n z = q[2],\n w = q[3];\n var x2 = x + x;\n var y2 = y + y;\n var z2 = z + z;\n var xx = x * x2;\n var xy = x * y2;\n var xz = x * z2;\n var yy = y * y2;\n var yz = y * z2;\n var zz = z * z2;\n var wx = w * x2;\n var wy = w * y2;\n var wz = w * z2;\n var sx = s[0];\n var sy = s[1];\n var sz = s[2];\n var ox = o[0];\n var oy = o[1];\n var oz = o[2];\n var out0 = (1 - (yy + zz)) * sx;\n var out1 = (xy + wz) * sx;\n var out2 = (xz - wy) * sx;\n var out4 = (xy - wz) * sy;\n var out5 = (1 - (xx + zz)) * sy;\n var out6 = (yz + wx) * sy;\n var out8 = (xz + wy) * sz;\n var out9 = (yz - wx) * sz;\n var out10 = (1 - (xx + yy)) * sz;\n out[0] = out0;\n out[1] = out1;\n out[2] = out2;\n out[3] = 0;\n out[4] = out4;\n out[5] = out5;\n out[6] = out6;\n out[7] = 0;\n out[8] = out8;\n out[9] = out9;\n out[10] = out10;\n out[11] = 0;\n out[12] = v[0] + ox - (out0 * ox + out4 * oy + out8 * oz);\n out[13] = v[1] + oy - (out1 * ox + out5 * oy + out9 * oz);\n out[14] = v[2] + oz - (out2 * ox + out6 * oy + out10 * oz);\n out[15] = 1;\n return out;\n}\n/**\n * Calculates a 4x4 matrix from the given quaternion\n *\n * @param {mat4} out mat4 receiving operation result\n * @param {ReadonlyQuat} q Quaternion to create matrix from\n *\n * @returns {mat4} out\n */\n\nexport function fromQuat(out, q) {\n var x = q[0],\n y = q[1],\n z = q[2],\n w = q[3];\n var x2 = x + x;\n var y2 = y + y;\n var z2 = z + z;\n var xx = x * x2;\n var yx = y * x2;\n var yy = y * y2;\n var zx = z * x2;\n var zy = z * y2;\n var zz = z * z2;\n var wx = w * x2;\n var wy = w * y2;\n var wz = w * z2;\n out[0] = 1 - yy - zz;\n out[1] = yx + wz;\n out[2] = zx - wy;\n out[3] = 0;\n out[4] = yx - wz;\n out[5] = 1 - xx - zz;\n out[6] = zy + wx;\n out[7] = 0;\n out[8] = zx + wy;\n out[9] = zy - wx;\n out[10] = 1 - xx - yy;\n out[11] = 0;\n out[12] = 0;\n out[13] = 0;\n out[14] = 0;\n out[15] = 1;\n return out;\n}\n/**\n * Generates a frustum matrix with the given bounds\n *\n * @param {mat4} out mat4 frustum matrix will be written into\n * @param {Number} left Left bound of the frustum\n * @param {Number} right Right bound of the frustum\n * @param {Number} bottom Bottom bound of the frustum\n * @param {Number} top Top bound of the frustum\n * @param {Number} near Near bound of the frustum\n * @param {Number} far Far bound of the frustum\n * @returns {mat4} out\n */\n\nexport function frustum(out, left, right, bottom, top, near, far) {\n var rl = 1 / (right - left);\n var tb = 1 / (top - bottom);\n var nf = 1 / (near - far);\n out[0] = near * 2 * rl;\n out[1] = 0;\n out[2] = 0;\n out[3] = 0;\n out[4] = 0;\n out[5] = near * 2 * tb;\n out[6] = 0;\n out[7] = 0;\n out[8] = (right + left) * rl;\n out[9] = (top + bottom) * tb;\n out[10] = (far + near) * nf;\n out[11] = -1;\n out[12] = 0;\n out[13] = 0;\n out[14] = far * near * 2 * nf;\n out[15] = 0;\n return out;\n}\n/**\n * Generates a perspective projection matrix with the given bounds.\n * The near/far clip planes correspond to a normalized device coordinate Z range of [-1, 1],\n * which matches WebGL/OpenGL's clip volume.\n * Passing null/undefined/no value for far will generate infinite projection matrix.\n *\n * @param {mat4} out mat4 frustum matrix will be written into\n * @param {number} fovy Vertical field of view in radians\n * @param {number} aspect Aspect ratio. typically viewport width/height\n * @param {number} near Near bound of the frustum\n * @param {number} far Far bound of the frustum, can be null or Infinity\n * @returns {mat4} out\n */\n\nexport function perspectiveNO(out, fovy, aspect, near, far) {\n var f = 1.0 / Math.tan(fovy / 2),\n nf;\n out[0] = f / aspect;\n out[1] = 0;\n out[2] = 0;\n out[3] = 0;\n out[4] = 0;\n out[5] = f;\n out[6] = 0;\n out[7] = 0;\n out[8] = 0;\n out[9] = 0;\n out[11] = -1;\n out[12] = 0;\n out[13] = 0;\n out[15] = 0;\n\n if (far != null && far !== Infinity) {\n nf = 1 / (near - far);\n out[10] = (far + near) * nf;\n out[14] = 2 * far * near * nf;\n } else {\n out[10] = -1;\n out[14] = -2 * near;\n }\n\n return out;\n}\n/**\n * Alias for {@link mat4.perspectiveNO}\n * @function\n */\n\nexport var perspective = perspectiveNO;\n/**\n * Generates a perspective projection matrix suitable for WebGPU with the given bounds.\n * The near/far clip planes correspond to a normalized device coordinate Z range of [0, 1],\n * which matches WebGPU/Vulkan/DirectX/Metal's clip volume.\n * Passing null/undefined/no value for far will generate infinite projection matrix.\n *\n * @param {mat4} out mat4 frustum matrix will be written into\n * @param {number} fovy Vertical field of view in radians\n * @param {number} aspect Aspect ratio. typically viewport width/height\n * @param {number} near Near bound of the frustum\n * @param {number} far Far bound of the frustum, can be null or Infinity\n * @returns {mat4} out\n */\n\nexport function perspectiveZO(out, fovy, aspect, near, far) {\n var f = 1.0 / Math.tan(fovy / 2),\n nf;\n out[0] = f / aspect;\n out[1] = 0;\n out[2] = 0;\n out[3] = 0;\n out[4] = 0;\n out[5] = f;\n out[6] = 0;\n out[7] = 0;\n out[8] = 0;\n out[9] = 0;\n out[11] = -1;\n out[12] = 0;\n out[13] = 0;\n out[15] = 0;\n\n if (far != null && far !== Infinity) {\n nf = 1 / (near - far);\n out[10] = far * nf;\n out[14] = far * near * nf;\n } else {\n out[10] = -1;\n out[14] = -near;\n }\n\n return out;\n}\n/**\n * Generates a perspective projection matrix with the given field of view.\n * This is primarily useful for generating projection matrices to be used\n * with the still experiemental WebVR API.\n *\n * @param {mat4} out mat4 frustum matrix will be written into\n * @param {Object} fov Object containing the following values: upDegrees, downDegrees, leftDegrees, rightDegrees\n * @param {number} near Near bound of the frustum\n * @param {number} far Far bound of the frustum\n * @returns {mat4} out\n */\n\nexport function perspectiveFromFieldOfView(out, fov, near, far) {\n var upTan = Math.tan(fov.upDegrees * Math.PI / 180.0);\n var downTan = Math.tan(fov.downDegrees * Math.PI / 180.0);\n var leftTan = Math.tan(fov.leftDegrees * Math.PI / 180.0);\n var rightTan = Math.tan(fov.rightDegrees * Math.PI / 180.0);\n var xScale = 2.0 / (leftTan + rightTan);\n var yScale = 2.0 / (upTan + downTan);\n out[0] = xScale;\n out[1] = 0.0;\n out[2] = 0.0;\n out[3] = 0.0;\n out[4] = 0.0;\n out[5] = yScale;\n out[6] = 0.0;\n out[7] = 0.0;\n out[8] = -((leftTan - rightTan) * xScale * 0.5);\n out[9] = (upTan - downTan) * yScale * 0.5;\n out[10] = far / (near - far);\n out[11] = -1.0;\n out[12] = 0.0;\n out[13] = 0.0;\n out[14] = far * near / (near - far);\n out[15] = 0.0;\n return out;\n}\n/**\n * Generates a orthogonal projection matrix with the given bounds.\n * The near/far clip planes correspond to a normalized device coordinate Z range of [-1, 1],\n * which matches WebGL/OpenGL's clip volume.\n *\n * @param {mat4} out mat4 frustum matrix will be written into\n * @param {number} left Left bound of the frustum\n * @param {number} right Right bound of the frustum\n * @param {number} bottom Bottom bound of the frustum\n * @param {number} top Top bound of the frustum\n * @param {number} near Near bound of the frustum\n * @param {number} far Far bound of the frustum\n * @returns {mat4} out\n */\n\nexport function orthoNO(out, left, right, bottom, top, near, far) {\n var lr = 1 / (left - right);\n var bt = 1 / (bottom - top);\n var nf = 1 / (near - far);\n out[0] = -2 * lr;\n out[1] = 0;\n out[2] = 0;\n out[3] = 0;\n out[4] = 0;\n out[5] = -2 * bt;\n out[6] = 0;\n out[7] = 0;\n out[8] = 0;\n out[9] = 0;\n out[10] = 2 * nf;\n out[11] = 0;\n out[12] = (left + right) * lr;\n out[13] = (top + bottom) * bt;\n out[14] = (far + near) * nf;\n out[15] = 1;\n return out;\n}\n/**\n * Alias for {@link mat4.orthoNO}\n * @function\n */\n\nexport var ortho = orthoNO;\n/**\n * Generates a orthogonal projection matrix with the given bounds.\n * The near/far clip planes correspond to a normalized device coordinate Z range of [0, 1],\n * which matches WebGPU/Vulkan/DirectX/Metal's clip volume.\n *\n * @param {mat4} out mat4 frustum matrix will be written into\n * @param {number} left Left bound of the frustum\n * @param {number} right Right bound of the frustum\n * @param {number} bottom Bottom bound of the frustum\n * @param {number} top Top bound of the frustum\n * @param {number} near Near bound of the frustum\n * @param {number} far Far bound of the frustum\n * @returns {mat4} out\n */\n\nexport function orthoZO(out, left, right, bottom, top, near, far) {\n var lr = 1 / (left - right);\n var bt = 1 / (bottom - top);\n var nf = 1 / (near - far);\n out[0] = -2 * lr;\n out[1] = 0;\n out[2] = 0;\n out[3] = 0;\n out[4] = 0;\n out[5] = -2 * bt;\n out[6] = 0;\n out[7] = 0;\n out[8] = 0;\n out[9] = 0;\n out[10] = nf;\n out[11] = 0;\n out[12] = (left + right) * lr;\n out[13] = (top + bottom) * bt;\n out[14] = near * nf;\n out[15] = 1;\n return out;\n}\n/**\n * Generates a look-at matrix with the given eye position, focal point, and up axis.\n * If you want a matrix that actually makes an object look at another object, you should use targetTo instead.\n *\n * @param {mat4} out mat4 frustum matrix will be written into\n * @param {ReadonlyVec3} eye Position of the viewer\n * @param {ReadonlyVec3} center Point the viewer is looking at\n * @param {ReadonlyVec3} up vec3 pointing up\n * @returns {mat4} out\n */\n\nexport function lookAt(out, eye, center, up) {\n var x0, x1, x2, y0, y1, y2, z0, z1, z2, len;\n var eyex = eye[0];\n var eyey = eye[1];\n var eyez = eye[2];\n var upx = up[0];\n var upy = up[1];\n var upz = up[2];\n var centerx = center[0];\n var centery = center[1];\n var centerz = center[2];\n\n if (Math.abs(eyex - centerx) < glMatrix.EPSILON && Math.abs(eyey - centery) < glMatrix.EPSILON && Math.abs(eyez - centerz) < glMatrix.EPSILON) {\n return identity(out);\n }\n\n z0 = eyex - centerx;\n z1 = eyey - centery;\n z2 = eyez - centerz;\n len = 1 / Math.hypot(z0, z1, z2);\n z0 *= len;\n z1 *= len;\n z2 *= len;\n x0 = upy * z2 - upz * z1;\n x1 = upz * z0 - upx * z2;\n x2 = upx * z1 - upy * z0;\n len = Math.hypot(x0, x1, x2);\n\n if (!len) {\n x0 = 0;\n x1 = 0;\n x2 = 0;\n } else {\n len = 1 / len;\n x0 *= len;\n x1 *= len;\n x2 *= len;\n }\n\n y0 = z1 * x2 - z2 * x1;\n y1 = z2 * x0 - z0 * x2;\n y2 = z0 * x1 - z1 * x0;\n len = Math.hypot(y0, y1, y2);\n\n if (!len) {\n y0 = 0;\n y1 = 0;\n y2 = 0;\n } else {\n len = 1 / len;\n y0 *= len;\n y1 *= len;\n y2 *= len;\n }\n\n out[0] = x0;\n out[1] = y0;\n out[2] = z0;\n out[3] = 0;\n out[4] = x1;\n out[5] = y1;\n out[6] = z1;\n out[7] = 0;\n out[8] = x2;\n out[9] = y2;\n out[10] = z2;\n out[11] = 0;\n out[12] = -(x0 * eyex + x1 * eyey + x2 * eyez);\n out[13] = -(y0 * eyex + y1 * eyey + y2 * eyez);\n out[14] = -(z0 * eyex + z1 * eyey + z2 * eyez);\n out[15] = 1;\n return out;\n}\n/**\n * Generates a matrix that makes something look at something else.\n *\n * @param {mat4} out mat4 frustum matrix will be written into\n * @param {ReadonlyVec3} eye Position of the viewer\n * @param {ReadonlyVec3} center Point the viewer is looking at\n * @param {ReadonlyVec3} up vec3 pointing up\n * @returns {mat4} out\n */\n\nexport function targetTo(out, eye, target, up) {\n var eyex = eye[0],\n eyey = eye[1],\n eyez = eye[2],\n upx = up[0],\n upy = up[1],\n upz = up[2];\n var z0 = eyex - target[0],\n z1 = eyey - target[1],\n z2 = eyez - target[2];\n var len = z0 * z0 + z1 * z1 + z2 * z2;\n\n if (len > 0) {\n len = 1 / Math.sqrt(len);\n z0 *= len;\n z1 *= len;\n z2 *= len;\n }\n\n var x0 = upy * z2 - upz * z1,\n x1 = upz * z0 - upx * z2,\n x2 = upx * z1 - upy * z0;\n len = x0 * x0 + x1 * x1 + x2 * x2;\n\n if (len > 0) {\n len = 1 / Math.sqrt(len);\n x0 *= len;\n x1 *= len;\n x2 *= len;\n }\n\n out[0] = x0;\n out[1] = x1;\n out[2] = x2;\n out[3] = 0;\n out[4] = z1 * x2 - z2 * x1;\n out[5] = z2 * x0 - z0 * x2;\n out[6] = z0 * x1 - z1 * x0;\n out[7] = 0;\n out[8] = z0;\n out[9] = z1;\n out[10] = z2;\n out[11] = 0;\n out[12] = eyex;\n out[13] = eyey;\n out[14] = eyez;\n out[15] = 1;\n return out;\n}\n/**\n * Returns a string representation of a mat4\n *\n * @param {ReadonlyMat4} a matrix to represent as a string\n * @returns {String} string representation of the matrix\n */\n\nexport function str(a) {\n return \"mat4(\" + a[0] + \", \" + a[1] + \", \" + a[2] + \", \" + a[3] + \", \" + a[4] + \", \" + a[5] + \", \" + a[6] + \", \" + a[7] + \", \" + a[8] + \", \" + a[9] + \", \" + a[10] + \", \" + a[11] + \", \" + a[12] + \", \" + a[13] + \", \" + a[14] + \", \" + a[15] + \")\";\n}\n/**\n * Returns Frobenius norm of a mat4\n *\n * @param {ReadonlyMat4} a the matrix to calculate Frobenius norm of\n * @returns {Number} Frobenius norm\n */\n\nexport function frob(a) {\n return Math.hypot(a[0], a[1], a[2], a[3], a[4], a[5], a[6], a[7], a[8], a[9], a[10], a[11], a[12], a[13], a[14], a[15]);\n}\n/**\n * Adds two mat4's\n *\n * @param {mat4} out the receiving matrix\n * @param {ReadonlyMat4} a the first operand\n * @param {ReadonlyMat4} b the second operand\n * @returns {mat4} out\n */\n\nexport function add(out, a, b) {\n out[0] = a[0] + b[0];\n out[1] = a[1] + b[1];\n out[2] = a[2] + b[2];\n out[3] = a[3] + b[3];\n out[4] = a[4] + b[4];\n out[5] = a[5] + b[5];\n out[6] = a[6] + b[6];\n out[7] = a[7] + b[7];\n out[8] = a[8] + b[8];\n out[9] = a[9] + b[9];\n out[10] = a[10] + b[10];\n out[11] = a[11] + b[11];\n out[12] = a[12] + b[12];\n out[13] = a[13] + b[13];\n out[14] = a[14] + b[14];\n out[15] = a[15] + b[15];\n return out;\n}\n/**\n * Subtracts matrix b from matrix a\n *\n * @param {mat4} out the receiving matrix\n * @param {ReadonlyMat4} a the first operand\n * @param {ReadonlyMat4} b the second operand\n * @returns {mat4} out\n */\n\nexport function subtract(out, a, b) {\n out[0] = a[0] - b[0];\n out[1] = a[1] - b[1];\n out[2] = a[2] - b[2];\n out[3] = a[3] - b[3];\n out[4] = a[4] - b[4];\n out[5] = a[5] - b[5];\n out[6] = a[6] - b[6];\n out[7] = a[7] - b[7];\n out[8] = a[8] - b[8];\n out[9] = a[9] - b[9];\n out[10] = a[10] - b[10];\n out[11] = a[11] - b[11];\n out[12] = a[12] - b[12];\n out[13] = a[13] - b[13];\n out[14] = a[14] - b[14];\n out[15] = a[15] - b[15];\n return out;\n}\n/**\n * Multiply each element of the matrix by a scalar.\n *\n * @param {mat4} out the receiving matrix\n * @param {ReadonlyMat4} a the matrix to scale\n * @param {Number} b amount to scale the matrix's elements by\n * @returns {mat4} out\n */\n\nexport function multiplyScalar(out, a, b) {\n out[0] = a[0] * b;\n out[1] = a[1] * b;\n out[2] = a[2] * b;\n out[3] = a[3] * b;\n out[4] = a[4] * b;\n out[5] = a[5] * b;\n out[6] = a[6] * b;\n out[7] = a[7] * b;\n out[8] = a[8] * b;\n out[9] = a[9] * b;\n out[10] = a[10] * b;\n out[11] = a[11] * b;\n out[12] = a[12] * b;\n out[13] = a[13] * b;\n out[14] = a[14] * b;\n out[15] = a[15] * b;\n return out;\n}\n/**\n * Adds two mat4's after multiplying each element of the second operand by a scalar value.\n *\n * @param {mat4} out the receiving vector\n * @param {ReadonlyMat4} a the first operand\n * @param {ReadonlyMat4} b the second operand\n * @param {Number} scale the amount to scale b's elements by before adding\n * @returns {mat4} out\n */\n\nexport function multiplyScalarAndAdd(out, a, b, scale) {\n out[0] = a[0] + b[0] * scale;\n out[1] = a[1] + b[1] * scale;\n out[2] = a[2] + b[2] * scale;\n out[3] = a[3] + b[3] * scale;\n out[4] = a[4] + b[4] * scale;\n out[5] = a[5] + b[5] * scale;\n out[6] = a[6] + b[6] * scale;\n out[7] = a[7] + b[7] * scale;\n out[8] = a[8] + b[8] * scale;\n out[9] = a[9] + b[9] * scale;\n out[10] = a[10] + b[10] * scale;\n out[11] = a[11] + b[11] * scale;\n out[12] = a[12] + b[12] * scale;\n out[13] = a[13] + b[13] * scale;\n out[14] = a[14] + b[14] * scale;\n out[15] = a[15] + b[15] * scale;\n return out;\n}\n/**\n * Returns whether or not the matrices have exactly the same elements in the same position (when compared with ===)\n *\n * @param {ReadonlyMat4} a The first matrix.\n * @param {ReadonlyMat4} b The second matrix.\n * @returns {Boolean} True if the matrices are equal, false otherwise.\n */\n\nexport function exactEquals(a, b) {\n return a[0] === b[0] && a[1] === b[1] && a[2] === b[2] && a[3] === b[3] && a[4] === b[4] && a[5] === b[5] && a[6] === b[6] && a[7] === b[7] && a[8] === b[8] && a[9] === b[9] && a[10] === b[10] && a[11] === b[11] && a[12] === b[12] && a[13] === b[13] && a[14] === b[14] && a[15] === b[15];\n}\n/**\n * Returns whether or not the matrices have approximately the same elements in the same position.\n *\n * @param {ReadonlyMat4} a The first matrix.\n * @param {ReadonlyMat4} b The second matrix.\n * @returns {Boolean} True if the matrices are equal, false otherwise.\n */\n\nexport function equals(a, b) {\n var a0 = a[0],\n a1 = a[1],\n a2 = a[2],\n a3 = a[3];\n var a4 = a[4],\n a5 = a[5],\n a6 = a[6],\n a7 = a[7];\n var a8 = a[8],\n a9 = a[9],\n a10 = a[10],\n a11 = a[11];\n var a12 = a[12],\n a13 = a[13],\n a14 = a[14],\n a15 = a[15];\n var b0 = b[0],\n b1 = b[1],\n b2 = b[2],\n b3 = b[3];\n var b4 = b[4],\n b5 = b[5],\n b6 = b[6],\n b7 = b[7];\n var b8 = b[8],\n b9 = b[9],\n b10 = b[10],\n b11 = b[11];\n var b12 = b[12],\n b13 = b[13],\n b14 = b[14],\n b15 = b[15];\n return Math.abs(a0 - b0) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a0), Math.abs(b0)) && Math.abs(a1 - b1) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a1), Math.abs(b1)) && Math.abs(a2 - b2) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a2), Math.abs(b2)) && Math.abs(a3 - b3) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a3), Math.abs(b3)) && Math.abs(a4 - b4) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a4), Math.abs(b4)) && Math.abs(a5 - b5) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a5), Math.abs(b5)) && Math.abs(a6 - b6) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a6), Math.abs(b6)) && Math.abs(a7 - b7) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a7), Math.abs(b7)) && Math.abs(a8 - b8) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a8), Math.abs(b8)) && Math.abs(a9 - b9) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a9), Math.abs(b9)) && Math.abs(a10 - b10) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a10), Math.abs(b10)) && Math.abs(a11 - b11) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a11), Math.abs(b11)) && Math.abs(a12 - b12) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a12), Math.abs(b12)) && Math.abs(a13 - b13) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a13), Math.abs(b13)) && Math.abs(a14 - b14) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a14), Math.abs(b14)) && Math.abs(a15 - b15) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a15), Math.abs(b15));\n}\n/**\n * Alias for {@link mat4.multiply}\n * @function\n */\n\nexport var mul = multiply;\n/**\n * Alias for {@link mat4.subtract}\n * @function\n */\n\nexport var sub = subtract;","import * as glMatrix from \"./common.js\";\n/**\n * 3x3 Matrix\n * @module mat3\n */\n\n/**\n * Creates a new identity mat3\n *\n * @returns {mat3} a new 3x3 matrix\n */\n\nexport function create() {\n var out = new glMatrix.ARRAY_TYPE(9);\n\n if (glMatrix.ARRAY_TYPE != Float32Array) {\n out[1] = 0;\n out[2] = 0;\n out[3] = 0;\n out[5] = 0;\n out[6] = 0;\n out[7] = 0;\n }\n\n out[0] = 1;\n out[4] = 1;\n out[8] = 1;\n return out;\n}\n/**\n * Copies the upper-left 3x3 values into the given mat3.\n *\n * @param {mat3} out the receiving 3x3 matrix\n * @param {ReadonlyMat4} a the source 4x4 matrix\n * @returns {mat3} out\n */\n\nexport function fromMat4(out, a) {\n out[0] = a[0];\n out[1] = a[1];\n out[2] = a[2];\n out[3] = a[4];\n out[4] = a[5];\n out[5] = a[6];\n out[6] = a[8];\n out[7] = a[9];\n out[8] = a[10];\n return out;\n}\n/**\n * Creates a new mat3 initialized with values from an existing matrix\n *\n * @param {ReadonlyMat3} a matrix to clone\n * @returns {mat3} a new 3x3 matrix\n */\n\nexport function clone(a) {\n var out = new glMatrix.ARRAY_TYPE(9);\n out[0] = a[0];\n out[1] = a[1];\n out[2] = a[2];\n out[3] = a[3];\n out[4] = a[4];\n out[5] = a[5];\n out[6] = a[6];\n out[7] = a[7];\n out[8] = a[8];\n return out;\n}\n/**\n * Copy the values from one mat3 to another\n *\n * @param {mat3} out the receiving matrix\n * @param {ReadonlyMat3} a the source matrix\n * @returns {mat3} out\n */\n\nexport function copy(out, a) {\n out[0] = a[0];\n out[1] = a[1];\n out[2] = a[2];\n out[3] = a[3];\n out[4] = a[4];\n out[5] = a[5];\n out[6] = a[6];\n out[7] = a[7];\n out[8] = a[8];\n return out;\n}\n/**\n * Create a new mat3 with the given values\n *\n * @param {Number} m00 Component in column 0, row 0 position (index 0)\n * @param {Number} m01 Component in column 0, row 1 position (index 1)\n * @param {Number} m02 Component in column 0, row 2 position (index 2)\n * @param {Number} m10 Component in column 1, row 0 position (index 3)\n * @param {Number} m11 Component in column 1, row 1 position (index 4)\n * @param {Number} m12 Component in column 1, row 2 position (index 5)\n * @param {Number} m20 Component in column 2, row 0 position (index 6)\n * @param {Number} m21 Component in column 2, row 1 position (index 7)\n * @param {Number} m22 Component in column 2, row 2 position (index 8)\n * @returns {mat3} A new mat3\n */\n\nexport function fromValues(m00, m01, m02, m10, m11, m12, m20, m21, m22) {\n var out = new glMatrix.ARRAY_TYPE(9);\n out[0] = m00;\n out[1] = m01;\n out[2] = m02;\n out[3] = m10;\n out[4] = m11;\n out[5] = m12;\n out[6] = m20;\n out[7] = m21;\n out[8] = m22;\n return out;\n}\n/**\n * Set the components of a mat3 to the given values\n *\n * @param {mat3} out the receiving matrix\n * @param {Number} m00 Component in column 0, row 0 position (index 0)\n * @param {Number} m01 Component in column 0, row 1 position (index 1)\n * @param {Number} m02 Component in column 0, row 2 position (index 2)\n * @param {Number} m10 Component in column 1, row 0 position (index 3)\n * @param {Number} m11 Component in column 1, row 1 position (index 4)\n * @param {Number} m12 Component in column 1, row 2 position (index 5)\n * @param {Number} m20 Component in column 2, row 0 position (index 6)\n * @param {Number} m21 Component in column 2, row 1 position (index 7)\n * @param {Number} m22 Component in column 2, row 2 position (index 8)\n * @returns {mat3} out\n */\n\nexport function set(out, m00, m01, m02, m10, m11, m12, m20, m21, m22) {\n out[0] = m00;\n out[1] = m01;\n out[2] = m02;\n out[3] = m10;\n out[4] = m11;\n out[5] = m12;\n out[6] = m20;\n out[7] = m21;\n out[8] = m22;\n return out;\n}\n/**\n * Set a mat3 to the identity matrix\n *\n * @param {mat3} out the receiving matrix\n * @returns {mat3} out\n */\n\nexport function identity(out) {\n out[0] = 1;\n out[1] = 0;\n out[2] = 0;\n out[3] = 0;\n out[4] = 1;\n out[5] = 0;\n out[6] = 0;\n out[7] = 0;\n out[8] = 1;\n return out;\n}\n/**\n * Transpose the values of a mat3\n *\n * @param {mat3} out the receiving matrix\n * @param {ReadonlyMat3} a the source matrix\n * @returns {mat3} out\n */\n\nexport function transpose(out, a) {\n // If we are transposing ourselves we can skip a few steps but have to cache some values\n if (out === a) {\n var a01 = a[1],\n a02 = a[2],\n a12 = a[5];\n out[1] = a[3];\n out[2] = a[6];\n out[3] = a01;\n out[5] = a[7];\n out[6] = a02;\n out[7] = a12;\n } else {\n out[0] = a[0];\n out[1] = a[3];\n out[2] = a[6];\n out[3] = a[1];\n out[4] = a[4];\n out[5] = a[7];\n out[6] = a[2];\n out[7] = a[5];\n out[8] = a[8];\n }\n\n return out;\n}\n/**\n * Inverts a mat3\n *\n * @param {mat3} out the receiving matrix\n * @param {ReadonlyMat3} a the source matrix\n * @returns {mat3} out\n */\n\nexport function invert(out, a) {\n var a00 = a[0],\n a01 = a[1],\n a02 = a[2];\n var a10 = a[3],\n a11 = a[4],\n a12 = a[5];\n var a20 = a[6],\n a21 = a[7],\n a22 = a[8];\n var b01 = a22 * a11 - a12 * a21;\n var b11 = -a22 * a10 + a12 * a20;\n var b21 = a21 * a10 - a11 * a20; // Calculate the determinant\n\n var det = a00 * b01 + a01 * b11 + a02 * b21;\n\n if (!det) {\n return null;\n }\n\n det = 1.0 / det;\n out[0] = b01 * det;\n out[1] = (-a22 * a01 + a02 * a21) * det;\n out[2] = (a12 * a01 - a02 * a11) * det;\n out[3] = b11 * det;\n out[4] = (a22 * a00 - a02 * a20) * det;\n out[5] = (-a12 * a00 + a02 * a10) * det;\n out[6] = b21 * det;\n out[7] = (-a21 * a00 + a01 * a20) * det;\n out[8] = (a11 * a00 - a01 * a10) * det;\n return out;\n}\n/**\n * Calculates the adjugate of a mat3\n *\n * @param {mat3} out the receiving matrix\n * @param {ReadonlyMat3} a the source matrix\n * @returns {mat3} out\n */\n\nexport function adjoint(out, a) {\n var a00 = a[0],\n a01 = a[1],\n a02 = a[2];\n var a10 = a[3],\n a11 = a[4],\n a12 = a[5];\n var a20 = a[6],\n a21 = a[7],\n a22 = a[8];\n out[0] = a11 * a22 - a12 * a21;\n out[1] = a02 * a21 - a01 * a22;\n out[2] = a01 * a12 - a02 * a11;\n out[3] = a12 * a20 - a10 * a22;\n out[4] = a00 * a22 - a02 * a20;\n out[5] = a02 * a10 - a00 * a12;\n out[6] = a10 * a21 - a11 * a20;\n out[7] = a01 * a20 - a00 * a21;\n out[8] = a00 * a11 - a01 * a10;\n return out;\n}\n/**\n * Calculates the determinant of a mat3\n *\n * @param {ReadonlyMat3} a the source matrix\n * @returns {Number} determinant of a\n */\n\nexport function determinant(a) {\n var a00 = a[0],\n a01 = a[1],\n a02 = a[2];\n var a10 = a[3],\n a11 = a[4],\n a12 = a[5];\n var a20 = a[6],\n a21 = a[7],\n a22 = a[8];\n return a00 * (a22 * a11 - a12 * a21) + a01 * (-a22 * a10 + a12 * a20) + a02 * (a21 * a10 - a11 * a20);\n}\n/**\n * Multiplies two mat3's\n *\n * @param {mat3} out the receiving matrix\n * @param {ReadonlyMat3} a the first operand\n * @param {ReadonlyMat3} b the second operand\n * @returns {mat3} out\n */\n\nexport function multiply(out, a, b) {\n var a00 = a[0],\n a01 = a[1],\n a02 = a[2];\n var a10 = a[3],\n a11 = a[4],\n a12 = a[5];\n var a20 = a[6],\n a21 = a[7],\n a22 = a[8];\n var b00 = b[0],\n b01 = b[1],\n b02 = b[2];\n var b10 = b[3],\n b11 = b[4],\n b12 = b[5];\n var b20 = b[6],\n b21 = b[7],\n b22 = b[8];\n out[0] = b00 * a00 + b01 * a10 + b02 * a20;\n out[1] = b00 * a01 + b01 * a11 + b02 * a21;\n out[2] = b00 * a02 + b01 * a12 + b02 * a22;\n out[3] = b10 * a00 + b11 * a10 + b12 * a20;\n out[4] = b10 * a01 + b11 * a11 + b12 * a21;\n out[5] = b10 * a02 + b11 * a12 + b12 * a22;\n out[6] = b20 * a00 + b21 * a10 + b22 * a20;\n out[7] = b20 * a01 + b21 * a11 + b22 * a21;\n out[8] = b20 * a02 + b21 * a12 + b22 * a22;\n return out;\n}\n/**\n * Translate a mat3 by the given vector\n *\n * @param {mat3} out the receiving matrix\n * @param {ReadonlyMat3} a the matrix to translate\n * @param {ReadonlyVec2} v vector to translate by\n * @returns {mat3} out\n */\n\nexport function translate(out, a, v) {\n var a00 = a[0],\n a01 = a[1],\n a02 = a[2],\n a10 = a[3],\n a11 = a[4],\n a12 = a[5],\n a20 = a[6],\n a21 = a[7],\n a22 = a[8],\n x = v[0],\n y = v[1];\n out[0] = a00;\n out[1] = a01;\n out[2] = a02;\n out[3] = a10;\n out[4] = a11;\n out[5] = a12;\n out[6] = x * a00 + y * a10 + a20;\n out[7] = x * a01 + y * a11 + a21;\n out[8] = x * a02 + y * a12 + a22;\n return out;\n}\n/**\n * Rotates a mat3 by the given angle\n *\n * @param {mat3} out the receiving matrix\n * @param {ReadonlyMat3} a the matrix to rotate\n * @param {Number} rad the angle to rotate the matrix by\n * @returns {mat3} out\n */\n\nexport function rotate(out, a, rad) {\n var a00 = a[0],\n a01 = a[1],\n a02 = a[2],\n a10 = a[3],\n a11 = a[4],\n a12 = a[5],\n a20 = a[6],\n a21 = a[7],\n a22 = a[8],\n s = Math.sin(rad),\n c = Math.cos(rad);\n out[0] = c * a00 + s * a10;\n out[1] = c * a01 + s * a11;\n out[2] = c * a02 + s * a12;\n out[3] = c * a10 - s * a00;\n out[4] = c * a11 - s * a01;\n out[5] = c * a12 - s * a02;\n out[6] = a20;\n out[7] = a21;\n out[8] = a22;\n return out;\n}\n/**\n * Scales the mat3 by the dimensions in the given vec2\n *\n * @param {mat3} out the receiving matrix\n * @param {ReadonlyMat3} a the matrix to rotate\n * @param {ReadonlyVec2} v the vec2 to scale the matrix by\n * @returns {mat3} out\n **/\n\nexport function scale(out, a, v) {\n var x = v[0],\n y = v[1];\n out[0] = x * a[0];\n out[1] = x * a[1];\n out[2] = x * a[2];\n out[3] = y * a[3];\n out[4] = y * a[4];\n out[5] = y * a[5];\n out[6] = a[6];\n out[7] = a[7];\n out[8] = a[8];\n return out;\n}\n/**\n * Creates a matrix from a vector translation\n * This is equivalent to (but much faster than):\n *\n * mat3.identity(dest);\n * mat3.translate(dest, dest, vec);\n *\n * @param {mat3} out mat3 receiving operation result\n * @param {ReadonlyVec2} v Translation vector\n * @returns {mat3} out\n */\n\nexport function fromTranslation(out, v) {\n out[0] = 1;\n out[1] = 0;\n out[2] = 0;\n out[3] = 0;\n out[4] = 1;\n out[5] = 0;\n out[6] = v[0];\n out[7] = v[1];\n out[8] = 1;\n return out;\n}\n/**\n * Creates a matrix from a given angle\n * This is equivalent to (but much faster than):\n *\n * mat3.identity(dest);\n * mat3.rotate(dest, dest, rad);\n *\n * @param {mat3} out mat3 receiving operation result\n * @param {Number} rad the angle to rotate the matrix by\n * @returns {mat3} out\n */\n\nexport function fromRotation(out, rad) {\n var s = Math.sin(rad),\n c = Math.cos(rad);\n out[0] = c;\n out[1] = s;\n out[2] = 0;\n out[3] = -s;\n out[4] = c;\n out[5] = 0;\n out[6] = 0;\n out[7] = 0;\n out[8] = 1;\n return out;\n}\n/**\n * Creates a matrix from a vector scaling\n * This is equivalent to (but much faster than):\n *\n * mat3.identity(dest);\n * mat3.scale(dest, dest, vec);\n *\n * @param {mat3} out mat3 receiving operation result\n * @param {ReadonlyVec2} v Scaling vector\n * @returns {mat3} out\n */\n\nexport function fromScaling(out, v) {\n out[0] = v[0];\n out[1] = 0;\n out[2] = 0;\n out[3] = 0;\n out[4] = v[1];\n out[5] = 0;\n out[6] = 0;\n out[7] = 0;\n out[8] = 1;\n return out;\n}\n/**\n * Copies the values from a mat2d into a mat3\n *\n * @param {mat3} out the receiving matrix\n * @param {ReadonlyMat2d} a the matrix to copy\n * @returns {mat3} out\n **/\n\nexport function fromMat2d(out, a) {\n out[0] = a[0];\n out[1] = a[1];\n out[2] = 0;\n out[3] = a[2];\n out[4] = a[3];\n out[5] = 0;\n out[6] = a[4];\n out[7] = a[5];\n out[8] = 1;\n return out;\n}\n/**\n * Calculates a 3x3 matrix from the given quaternion\n *\n * @param {mat3} out mat3 receiving operation result\n * @param {ReadonlyQuat} q Quaternion to create matrix from\n *\n * @returns {mat3} out\n */\n\nexport function fromQuat(out, q) {\n var x = q[0],\n y = q[1],\n z = q[2],\n w = q[3];\n var x2 = x + x;\n var y2 = y + y;\n var z2 = z + z;\n var xx = x * x2;\n var yx = y * x2;\n var yy = y * y2;\n var zx = z * x2;\n var zy = z * y2;\n var zz = z * z2;\n var wx = w * x2;\n var wy = w * y2;\n var wz = w * z2;\n out[0] = 1 - yy - zz;\n out[3] = yx - wz;\n out[6] = zx + wy;\n out[1] = yx + wz;\n out[4] = 1 - xx - zz;\n out[7] = zy - wx;\n out[2] = zx - wy;\n out[5] = zy + wx;\n out[8] = 1 - xx - yy;\n return out;\n}\n/**\n * Calculates a 3x3 normal matrix (transpose inverse) from the 4x4 matrix\n *\n * @param {mat3} out mat3 receiving operation result\n * @param {ReadonlyMat4} a Mat4 to derive the normal matrix from\n *\n * @returns {mat3} out\n */\n\nexport function normalFromMat4(out, a) {\n var a00 = a[0],\n a01 = a[1],\n a02 = a[2],\n a03 = a[3];\n var a10 = a[4],\n a11 = a[5],\n a12 = a[6],\n a13 = a[7];\n var a20 = a[8],\n a21 = a[9],\n a22 = a[10],\n a23 = a[11];\n var a30 = a[12],\n a31 = a[13],\n a32 = a[14],\n a33 = a[15];\n var b00 = a00 * a11 - a01 * a10;\n var b01 = a00 * a12 - a02 * a10;\n var b02 = a00 * a13 - a03 * a10;\n var b03 = a01 * a12 - a02 * a11;\n var b04 = a01 * a13 - a03 * a11;\n var b05 = a02 * a13 - a03 * a12;\n var b06 = a20 * a31 - a21 * a30;\n var b07 = a20 * a32 - a22 * a30;\n var b08 = a20 * a33 - a23 * a30;\n var b09 = a21 * a32 - a22 * a31;\n var b10 = a21 * a33 - a23 * a31;\n var b11 = a22 * a33 - a23 * a32; // Calculate the determinant\n\n var det = b00 * b11 - b01 * b10 + b02 * b09 + b03 * b08 - b04 * b07 + b05 * b06;\n\n if (!det) {\n return null;\n }\n\n det = 1.0 / det;\n out[0] = (a11 * b11 - a12 * b10 + a13 * b09) * det;\n out[1] = (a12 * b08 - a10 * b11 - a13 * b07) * det;\n out[2] = (a10 * b10 - a11 * b08 + a13 * b06) * det;\n out[3] = (a02 * b10 - a01 * b11 - a03 * b09) * det;\n out[4] = (a00 * b11 - a02 * b08 + a03 * b07) * det;\n out[5] = (a01 * b08 - a00 * b10 - a03 * b06) * det;\n out[6] = (a31 * b05 - a32 * b04 + a33 * b03) * det;\n out[7] = (a32 * b02 - a30 * b05 - a33 * b01) * det;\n out[8] = (a30 * b04 - a31 * b02 + a33 * b00) * det;\n return out;\n}\n/**\n * Generates a 2D projection matrix with the given bounds\n *\n * @param {mat3} out mat3 frustum matrix will be written into\n * @param {number} width Width of your gl context\n * @param {number} height Height of gl context\n * @returns {mat3} out\n */\n\nexport function projection(out, width, height) {\n out[0] = 2 / width;\n out[1] = 0;\n out[2] = 0;\n out[3] = 0;\n out[4] = -2 / height;\n out[5] = 0;\n out[6] = -1;\n out[7] = 1;\n out[8] = 1;\n return out;\n}\n/**\n * Returns a string representation of a mat3\n *\n * @param {ReadonlyMat3} a matrix to represent as a string\n * @returns {String} string representation of the matrix\n */\n\nexport function str(a) {\n return \"mat3(\" + a[0] + \", \" + a[1] + \", \" + a[2] + \", \" + a[3] + \", \" + a[4] + \", \" + a[5] + \", \" + a[6] + \", \" + a[7] + \", \" + a[8] + \")\";\n}\n/**\n * Returns Frobenius norm of a mat3\n *\n * @param {ReadonlyMat3} a the matrix to calculate Frobenius norm of\n * @returns {Number} Frobenius norm\n */\n\nexport function frob(a) {\n return Math.hypot(a[0], a[1], a[2], a[3], a[4], a[5], a[6], a[7], a[8]);\n}\n/**\n * Adds two mat3's\n *\n * @param {mat3} out the receiving matrix\n * @param {ReadonlyMat3} a the first operand\n * @param {ReadonlyMat3} b the second operand\n * @returns {mat3} out\n */\n\nexport function add(out, a, b) {\n out[0] = a[0] + b[0];\n out[1] = a[1] + b[1];\n out[2] = a[2] + b[2];\n out[3] = a[3] + b[3];\n out[4] = a[4] + b[4];\n out[5] = a[5] + b[5];\n out[6] = a[6] + b[6];\n out[7] = a[7] + b[7];\n out[8] = a[8] + b[8];\n return out;\n}\n/**\n * Subtracts matrix b from matrix a\n *\n * @param {mat3} out the receiving matrix\n * @param {ReadonlyMat3} a the first operand\n * @param {ReadonlyMat3} b the second operand\n * @returns {mat3} out\n */\n\nexport function subtract(out, a, b) {\n out[0] = a[0] - b[0];\n out[1] = a[1] - b[1];\n out[2] = a[2] - b[2];\n out[3] = a[3] - b[3];\n out[4] = a[4] - b[4];\n out[5] = a[5] - b[5];\n out[6] = a[6] - b[6];\n out[7] = a[7] - b[7];\n out[8] = a[8] - b[8];\n return out;\n}\n/**\n * Multiply each element of the matrix by a scalar.\n *\n * @param {mat3} out the receiving matrix\n * @param {ReadonlyMat3} a the matrix to scale\n * @param {Number} b amount to scale the matrix's elements by\n * @returns {mat3} out\n */\n\nexport function multiplyScalar(out, a, b) {\n out[0] = a[0] * b;\n out[1] = a[1] * b;\n out[2] = a[2] * b;\n out[3] = a[3] * b;\n out[4] = a[4] * b;\n out[5] = a[5] * b;\n out[6] = a[6] * b;\n out[7] = a[7] * b;\n out[8] = a[8] * b;\n return out;\n}\n/**\n * Adds two mat3's after multiplying each element of the second operand by a scalar value.\n *\n * @param {mat3} out the receiving vector\n * @param {ReadonlyMat3} a the first operand\n * @param {ReadonlyMat3} b the second operand\n * @param {Number} scale the amount to scale b's elements by before adding\n * @returns {mat3} out\n */\n\nexport function multiplyScalarAndAdd(out, a, b, scale) {\n out[0] = a[0] + b[0] * scale;\n out[1] = a[1] + b[1] * scale;\n out[2] = a[2] + b[2] * scale;\n out[3] = a[3] + b[3] * scale;\n out[4] = a[4] + b[4] * scale;\n out[5] = a[5] + b[5] * scale;\n out[6] = a[6] + b[6] * scale;\n out[7] = a[7] + b[7] * scale;\n out[8] = a[8] + b[8] * scale;\n return out;\n}\n/**\n * Returns whether or not the matrices have exactly the same elements in the same position (when compared with ===)\n *\n * @param {ReadonlyMat3} a The first matrix.\n * @param {ReadonlyMat3} b The second matrix.\n * @returns {Boolean} True if the matrices are equal, false otherwise.\n */\n\nexport function exactEquals(a, b) {\n return a[0] === b[0] && a[1] === b[1] && a[2] === b[2] && a[3] === b[3] && a[4] === b[4] && a[5] === b[5] && a[6] === b[6] && a[7] === b[7] && a[8] === b[8];\n}\n/**\n * Returns whether or not the matrices have approximately the same elements in the same position.\n *\n * @param {ReadonlyMat3} a The first matrix.\n * @param {ReadonlyMat3} b The second matrix.\n * @returns {Boolean} True if the matrices are equal, false otherwise.\n */\n\nexport function equals(a, b) {\n var a0 = a[0],\n a1 = a[1],\n a2 = a[2],\n a3 = a[3],\n a4 = a[4],\n a5 = a[5],\n a6 = a[6],\n a7 = a[7],\n a8 = a[8];\n var b0 = b[0],\n b1 = b[1],\n b2 = b[2],\n b3 = b[3],\n b4 = b[4],\n b5 = b[5],\n b6 = b[6],\n b7 = b[7],\n b8 = b[8];\n return Math.abs(a0 - b0) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a0), Math.abs(b0)) && Math.abs(a1 - b1) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a1), Math.abs(b1)) && Math.abs(a2 - b2) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a2), Math.abs(b2)) && Math.abs(a3 - b3) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a3), Math.abs(b3)) && Math.abs(a4 - b4) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a4), Math.abs(b4)) && Math.abs(a5 - b5) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a5), Math.abs(b5)) && Math.abs(a6 - b6) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a6), Math.abs(b6)) && Math.abs(a7 - b7) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a7), Math.abs(b7)) && Math.abs(a8 - b8) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a8), Math.abs(b8));\n}\n/**\n * Alias for {@link mat3.multiply}\n * @function\n */\n\nexport var mul = multiply;\n/**\n * Alias for {@link mat3.subtract}\n * @function\n */\n\nexport var sub = subtract;","import * as glMatrix from \"./common.js\";\n/**\n * 2 Dimensional Vector\n * @module vec2\n */\n\n/**\n * Creates a new, empty vec2\n *\n * @returns {vec2} a new 2D vector\n */\n\nexport function create() {\n var out = new glMatrix.ARRAY_TYPE(2);\n\n if (glMatrix.ARRAY_TYPE != Float32Array) {\n out[0] = 0;\n out[1] = 0;\n }\n\n return out;\n}\n/**\n * Creates a new vec2 initialized with values from an existing vector\n *\n * @param {ReadonlyVec2} a vector to clone\n * @returns {vec2} a new 2D vector\n */\n\nexport function clone(a) {\n var out = new glMatrix.ARRAY_TYPE(2);\n out[0] = a[0];\n out[1] = a[1];\n return out;\n}\n/**\n * Creates a new vec2 initialized with the given values\n *\n * @param {Number} x X component\n * @param {Number} y Y component\n * @returns {vec2} a new 2D vector\n */\n\nexport function fromValues(x, y) {\n var out = new glMatrix.ARRAY_TYPE(2);\n out[0] = x;\n out[1] = y;\n return out;\n}\n/**\n * Copy the values from one vec2 to another\n *\n * @param {vec2} out the receiving vector\n * @param {ReadonlyVec2} a the source vector\n * @returns {vec2} out\n */\n\nexport function copy(out, a) {\n out[0] = a[0];\n out[1] = a[1];\n return out;\n}\n/**\n * Set the components of a vec2 to the given values\n *\n * @param {vec2} out the receiving vector\n * @param {Number} x X component\n * @param {Number} y Y component\n * @returns {vec2} out\n */\n\nexport function set(out, x, y) {\n out[0] = x;\n out[1] = y;\n return out;\n}\n/**\n * Adds two vec2's\n *\n * @param {vec2} out the receiving vector\n * @param {ReadonlyVec2} a the first operand\n * @param {ReadonlyVec2} b the second operand\n * @returns {vec2} out\n */\n\nexport function add(out, a, b) {\n out[0] = a[0] + b[0];\n out[1] = a[1] + b[1];\n return out;\n}\n/**\n * Subtracts vector b from vector a\n *\n * @param {vec2} out the receiving vector\n * @param {ReadonlyVec2} a the first operand\n * @param {ReadonlyVec2} b the second operand\n * @returns {vec2} out\n */\n\nexport function subtract(out, a, b) {\n out[0] = a[0] - b[0];\n out[1] = a[1] - b[1];\n return out;\n}\n/**\n * Multiplies two vec2's\n *\n * @param {vec2} out the receiving vector\n * @param {ReadonlyVec2} a the first operand\n * @param {ReadonlyVec2} b the second operand\n * @returns {vec2} out\n */\n\nexport function multiply(out, a, b) {\n out[0] = a[0] * b[0];\n out[1] = a[1] * b[1];\n return out;\n}\n/**\n * Divides two vec2's\n *\n * @param {vec2} out the receiving vector\n * @param {ReadonlyVec2} a the first operand\n * @param {ReadonlyVec2} b the second operand\n * @returns {vec2} out\n */\n\nexport function divide(out, a, b) {\n out[0] = a[0] / b[0];\n out[1] = a[1] / b[1];\n return out;\n}\n/**\n * Math.ceil the components of a vec2\n *\n * @param {vec2} out the receiving vector\n * @param {ReadonlyVec2} a vector to ceil\n * @returns {vec2} out\n */\n\nexport function ceil(out, a) {\n out[0] = Math.ceil(a[0]);\n out[1] = Math.ceil(a[1]);\n return out;\n}\n/**\n * Math.floor the components of a vec2\n *\n * @param {vec2} out the receiving vector\n * @param {ReadonlyVec2} a vector to floor\n * @returns {vec2} out\n */\n\nexport function floor(out, a) {\n out[0] = Math.floor(a[0]);\n out[1] = Math.floor(a[1]);\n return out;\n}\n/**\n * Returns the minimum of two vec2's\n *\n * @param {vec2} out the receiving vector\n * @param {ReadonlyVec2} a the first operand\n * @param {ReadonlyVec2} b the second operand\n * @returns {vec2} out\n */\n\nexport function min(out, a, b) {\n out[0] = Math.min(a[0], b[0]);\n out[1] = Math.min(a[1], b[1]);\n return out;\n}\n/**\n * Returns the maximum of two vec2's\n *\n * @param {vec2} out the receiving vector\n * @param {ReadonlyVec2} a the first operand\n * @param {ReadonlyVec2} b the second operand\n * @returns {vec2} out\n */\n\nexport function max(out, a, b) {\n out[0] = Math.max(a[0], b[0]);\n out[1] = Math.max(a[1], b[1]);\n return out;\n}\n/**\n * Math.round the components of a vec2\n *\n * @param {vec2} out the receiving vector\n * @param {ReadonlyVec2} a vector to round\n * @returns {vec2} out\n */\n\nexport function round(out, a) {\n out[0] = Math.round(a[0]);\n out[1] = Math.round(a[1]);\n return out;\n}\n/**\n * Scales a vec2 by a scalar number\n *\n * @param {vec2} out the receiving vector\n * @param {ReadonlyVec2} a the vector to scale\n * @param {Number} b amount to scale the vector by\n * @returns {vec2} out\n */\n\nexport function scale(out, a, b) {\n out[0] = a[0] * b;\n out[1] = a[1] * b;\n return out;\n}\n/**\n * Adds two vec2's after scaling the second operand by a scalar value\n *\n * @param {vec2} out the receiving vector\n * @param {ReadonlyVec2} a the first operand\n * @param {ReadonlyVec2} b the second operand\n * @param {Number} scale the amount to scale b by before adding\n * @returns {vec2} out\n */\n\nexport function scaleAndAdd(out, a, b, scale) {\n out[0] = a[0] + b[0] * scale;\n out[1] = a[1] + b[1] * scale;\n return out;\n}\n/**\n * Calculates the euclidian distance between two vec2's\n *\n * @param {ReadonlyVec2} a the first operand\n * @param {ReadonlyVec2} b the second operand\n * @returns {Number} distance between a and b\n */\n\nexport function distance(a, b) {\n var x = b[0] - a[0],\n y = b[1] - a[1];\n return Math.hypot(x, y);\n}\n/**\n * Calculates the squared euclidian distance between two vec2's\n *\n * @param {ReadonlyVec2} a the first operand\n * @param {ReadonlyVec2} b the second operand\n * @returns {Number} squared distance between a and b\n */\n\nexport function squaredDistance(a, b) {\n var x = b[0] - a[0],\n y = b[1] - a[1];\n return x * x + y * y;\n}\n/**\n * Calculates the length of a vec2\n *\n * @param {ReadonlyVec2} a vector to calculate length of\n * @returns {Number} length of a\n */\n\nexport function length(a) {\n var x = a[0],\n y = a[1];\n return Math.hypot(x, y);\n}\n/**\n * Calculates the squared length of a vec2\n *\n * @param {ReadonlyVec2} a vector to calculate squared length of\n * @returns {Number} squared length of a\n */\n\nexport function squaredLength(a) {\n var x = a[0],\n y = a[1];\n return x * x + y * y;\n}\n/**\n * Negates the components of a vec2\n *\n * @param {vec2} out the receiving vector\n * @param {ReadonlyVec2} a vector to negate\n * @returns {vec2} out\n */\n\nexport function negate(out, a) {\n out[0] = -a[0];\n out[1] = -a[1];\n return out;\n}\n/**\n * Returns the inverse of the components of a vec2\n *\n * @param {vec2} out the receiving vector\n * @param {ReadonlyVec2} a vector to invert\n * @returns {vec2} out\n */\n\nexport function inverse(out, a) {\n out[0] = 1.0 / a[0];\n out[1] = 1.0 / a[1];\n return out;\n}\n/**\n * Normalize a vec2\n *\n * @param {vec2} out the receiving vector\n * @param {ReadonlyVec2} a vector to normalize\n * @returns {vec2} out\n */\n\nexport function normalize(out, a) {\n var x = a[0],\n y = a[1];\n var len = x * x + y * y;\n\n if (len > 0) {\n //TODO: evaluate use of glm_invsqrt here?\n len = 1 / Math.sqrt(len);\n }\n\n out[0] = a[0] * len;\n out[1] = a[1] * len;\n return out;\n}\n/**\n * Calculates the dot product of two vec2's\n *\n * @param {ReadonlyVec2} a the first operand\n * @param {ReadonlyVec2} b the second operand\n * @returns {Number} dot product of a and b\n */\n\nexport function dot(a, b) {\n return a[0] * b[0] + a[1] * b[1];\n}\n/**\n * Computes the cross product of two vec2's\n * Note that the cross product must by definition produce a 3D vector\n *\n * @param {vec3} out the receiving vector\n * @param {ReadonlyVec2} a the first operand\n * @param {ReadonlyVec2} b the second operand\n * @returns {vec3} out\n */\n\nexport function cross(out, a, b) {\n var z = a[0] * b[1] - a[1] * b[0];\n out[0] = out[1] = 0;\n out[2] = z;\n return out;\n}\n/**\n * Performs a linear interpolation between two vec2's\n *\n * @param {vec2} out the receiving vector\n * @param {ReadonlyVec2} a the first operand\n * @param {ReadonlyVec2} b the second operand\n * @param {Number} t interpolation amount, in the range [0-1], between the two inputs\n * @returns {vec2} out\n */\n\nexport function lerp(out, a, b, t) {\n var ax = a[0],\n ay = a[1];\n out[0] = ax + t * (b[0] - ax);\n out[1] = ay + t * (b[1] - ay);\n return out;\n}\n/**\n * Generates a random vector with the given scale\n *\n * @param {vec2} out the receiving vector\n * @param {Number} [scale] Length of the resulting vector. If ommitted, a unit vector will be returned\n * @returns {vec2} out\n */\n\nexport function random(out, scale) {\n scale = scale || 1.0;\n var r = glMatrix.RANDOM() * 2.0 * Math.PI;\n out[0] = Math.cos(r) * scale;\n out[1] = Math.sin(r) * scale;\n return out;\n}\n/**\n * Transforms the vec2 with a mat2\n *\n * @param {vec2} out the receiving vector\n * @param {ReadonlyVec2} a the vector to transform\n * @param {ReadonlyMat2} m matrix to transform with\n * @returns {vec2} out\n */\n\nexport function transformMat2(out, a, m) {\n var x = a[0],\n y = a[1];\n out[0] = m[0] * x + m[2] * y;\n out[1] = m[1] * x + m[3] * y;\n return out;\n}\n/**\n * Transforms the vec2 with a mat2d\n *\n * @param {vec2} out the receiving vector\n * @param {ReadonlyVec2} a the vector to transform\n * @param {ReadonlyMat2d} m matrix to transform with\n * @returns {vec2} out\n */\n\nexport function transformMat2d(out, a, m) {\n var x = a[0],\n y = a[1];\n out[0] = m[0] * x + m[2] * y + m[4];\n out[1] = m[1] * x + m[3] * y + m[5];\n return out;\n}\n/**\n * Transforms the vec2 with a mat3\n * 3rd vector component is implicitly '1'\n *\n * @param {vec2} out the receiving vector\n * @param {ReadonlyVec2} a the vector to transform\n * @param {ReadonlyMat3} m matrix to transform with\n * @returns {vec2} out\n */\n\nexport function transformMat3(out, a, m) {\n var x = a[0],\n y = a[1];\n out[0] = m[0] * x + m[3] * y + m[6];\n out[1] = m[1] * x + m[4] * y + m[7];\n return out;\n}\n/**\n * Transforms the vec2 with a mat4\n * 3rd vector component is implicitly '0'\n * 4th vector component is implicitly '1'\n *\n * @param {vec2} out the receiving vector\n * @param {ReadonlyVec2} a the vector to transform\n * @param {ReadonlyMat4} m matrix to transform with\n * @returns {vec2} out\n */\n\nexport function transformMat4(out, a, m) {\n var x = a[0];\n var y = a[1];\n out[0] = m[0] * x + m[4] * y + m[12];\n out[1] = m[1] * x + m[5] * y + m[13];\n return out;\n}\n/**\n * Rotate a 2D vector\n * @param {vec2} out The receiving vec2\n * @param {ReadonlyVec2} a The vec2 point to rotate\n * @param {ReadonlyVec2} b The origin of the rotation\n * @param {Number} rad The angle of rotation in radians\n * @returns {vec2} out\n */\n\nexport function rotate(out, a, b, rad) {\n //Translate point to the origin\n var p0 = a[0] - b[0],\n p1 = a[1] - b[1],\n sinC = Math.sin(rad),\n cosC = Math.cos(rad); //perform rotation and translate to correct position\n\n out[0] = p0 * cosC - p1 * sinC + b[0];\n out[1] = p0 * sinC + p1 * cosC + b[1];\n return out;\n}\n/**\n * Get the angle between two 2D vectors\n * @param {ReadonlyVec2} a The first operand\n * @param {ReadonlyVec2} b The second operand\n * @returns {Number} The angle in radians\n */\n\nexport function angle(a, b) {\n var x1 = a[0],\n y1 = a[1],\n x2 = b[0],\n y2 = b[1],\n // mag is the product of the magnitudes of a and b\n mag = Math.sqrt(x1 * x1 + y1 * y1) * Math.sqrt(x2 * x2 + y2 * y2),\n // mag &&.. short circuits if mag == 0\n cosine = mag && (x1 * x2 + y1 * y2) / mag; // Math.min(Math.max(cosine, -1), 1) clamps the cosine between -1 and 1\n\n return Math.acos(Math.min(Math.max(cosine, -1), 1));\n}\n/**\n * Set the components of a vec2 to zero\n *\n * @param {vec2} out the receiving vector\n * @returns {vec2} out\n */\n\nexport function zero(out) {\n out[0] = 0.0;\n out[1] = 0.0;\n return out;\n}\n/**\n * Returns a string representation of a vector\n *\n * @param {ReadonlyVec2} a vector to represent as a string\n * @returns {String} string representation of the vector\n */\n\nexport function str(a) {\n return \"vec2(\" + a[0] + \", \" + a[1] + \")\";\n}\n/**\n * Returns whether or not the vectors exactly have the same elements in the same position (when compared with ===)\n *\n * @param {ReadonlyVec2} a The first vector.\n * @param {ReadonlyVec2} b The second vector.\n * @returns {Boolean} True if the vectors are equal, false otherwise.\n */\n\nexport function exactEquals(a, b) {\n return a[0] === b[0] && a[1] === b[1];\n}\n/**\n * Returns whether or not the vectors have approximately the same elements in the same position.\n *\n * @param {ReadonlyVec2} a The first vector.\n * @param {ReadonlyVec2} b The second vector.\n * @returns {Boolean} True if the vectors are equal, false otherwise.\n */\n\nexport function equals(a, b) {\n var a0 = a[0],\n a1 = a[1];\n var b0 = b[0],\n b1 = b[1];\n return Math.abs(a0 - b0) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a0), Math.abs(b0)) && Math.abs(a1 - b1) <= glMatrix.EPSILON * Math.max(1.0, Math.abs(a1), Math.abs(b1));\n}\n/**\n * Alias for {@link vec2.length}\n * @function\n */\n\nexport var len = length;\n/**\n * Alias for {@link vec2.subtract}\n * @function\n */\n\nexport var sub = subtract;\n/**\n * Alias for {@link vec2.multiply}\n * @function\n */\n\nexport var mul = multiply;\n/**\n * Alias for {@link vec2.divide}\n * @function\n */\n\nexport var div = divide;\n/**\n * Alias for {@link vec2.distance}\n * @function\n */\n\nexport var dist = distance;\n/**\n * Alias for {@link vec2.squaredDistance}\n * @function\n */\n\nexport var sqrDist = squaredDistance;\n/**\n * Alias for {@link vec2.squaredLength}\n * @function\n */\n\nexport var sqrLen = squaredLength;\n/**\n * Perform some operation over an array of vec2s.\n *\n * @param {Array} a the array of vectors to iterate over\n * @param {Number} stride Number of elements between the start of each vec2. If 0 assumes tightly packed\n * @param {Number} offset Number of elements to skip at the beginning of the array\n * @param {Number} count Number of vec2s to iterate over. If 0 iterates over entire array\n * @param {Function} fn Function to call for each vector in the array\n * @param {Object} [arg] additional argument to pass to fn\n * @returns {Array} a\n * @function\n */\n\nexport var forEach = function () {\n var vec = create();\n return function (a, stride, offset, count, fn, arg) {\n var i, l;\n\n if (!stride) {\n stride = 2;\n }\n\n if (!offset) {\n offset = 0;\n }\n\n if (count) {\n l = Math.min(count * stride + offset, a.length);\n } else {\n l = a.length;\n }\n\n for (i = offset; i < l; i += stride) {\n vec[0] = a[i];\n vec[1] = a[i + 1];\n fn(vec, vec, arg);\n a[i] = vec[0];\n a[i + 1] = vec[1];\n }\n\n return a;\n };\n}();","/*\nCopyright (c) NAVER Corp.\nname: @egjs/imready\nlicense: MIT\nauthor: NAVER Corp.\nrepository: https://github.com/naver/egjs-imready\nversion: 1.4.1\n*/\nimport Component, { ComponentEvent } from '@egjs/component';\nimport { reactive, isString } from '@cfcs/core';\n\n/******************************************************************************\r\nCopyright (c) Microsoft Corporation.\r\n\r\nPermission to use, copy, modify, and/or distribute this software for any\r\npurpose with or without fee is hereby granted.\r\n\r\nTHE SOFTWARE IS PROVIDED \"AS IS\" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH\r\nREGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY\r\nAND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,\r\nINDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM\r\nLOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR\r\nOTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR\r\nPERFORMANCE OF THIS SOFTWARE.\r\n***************************************************************************** */\n/* global Reflect, Promise */\n\nvar extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf || {\n __proto__: []\n } instanceof Array && function (d, b) {\n d.__proto__ = b;\n } || function (d, b) {\n for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p];\n };\n return extendStatics(d, b);\n};\nfunction __extends(d, b) {\n if (typeof b !== \"function\" && b !== null) throw new TypeError(\"Class extends value \" + String(b) + \" is not a constructor or null\");\n extendStatics(d, b);\n function __() {\n this.constructor = d;\n }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n}\nvar __assign = function () {\n __assign = Object.assign || function __assign(t) {\n for (var s, i = 1, n = arguments.length; i < n; i++) {\n s = arguments[i];\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];\n }\n return t;\n };\n return __assign.apply(this, arguments);\n};\n\n/** @deprecated */\nfunction __spreadArrays() {\n for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;\n for (var r = Array(s), k = 0, i = 0; i < il; i++) for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++) r[k] = a[j];\n return r;\n}\n\n/*\negjs-imready\nCopyright (c) 2020-present NAVER Corp.\nMIT license\n*/\nvar isWindow = typeof window !== \"undefined\";\nvar ua = isWindow ? window.navigator.userAgent : \"\";\nvar SUPPORT_COMPUTEDSTYLE = isWindow ? !!(\"getComputedStyle\" in window) : false;\nvar IS_IE = /MSIE|Trident|Windows Phone|Edge/.test(ua);\nvar SUPPORT_ADDEVENTLISTENER = isWindow ? !!(\"addEventListener\" in document) : false;\nvar WIDTH = \"width\";\nvar HEIGHT = \"height\";\nvar PROPS = [\"prefix\", \"loaders\"];\nvar EVENTS = [\"preReadyElement\", \"readyElement\", \"error\", \"preReady\", \"ready\"];\n\nfunction getAttribute(el, name) {\n return el.getAttribute(name) || \"\";\n}\nfunction toArray(arr) {\n return [].slice.call(arr);\n}\nfunction hasSizeAttribute(target, prefix) {\n if (prefix === void 0) {\n prefix = \"data-\";\n }\n return !!target.getAttribute(prefix + \"width\");\n}\nfunction hasLoadingAttribute(target, prefix) {\n if (prefix === void 0) {\n prefix = \"data-\";\n }\n return \"loading\" in target && target.getAttribute(\"loading\") === \"lazy\" || !!target.getAttribute(prefix + \"lazy\");\n}\nfunction hasSkipAttribute(target, prefix) {\n if (prefix === void 0) {\n prefix = \"data-\";\n }\n return !!target.getAttribute(prefix + \"skip\");\n}\nfunction addEvent(element, type, handler) {\n if (SUPPORT_ADDEVENTLISTENER) {\n element.addEventListener(type, handler, false);\n } else if (element.attachEvent) {\n element.attachEvent(\"on\" + type, handler);\n } else {\n element[\"on\" + type] = handler;\n }\n}\nfunction removeEvent(element, type, handler) {\n if (element.removeEventListener) {\n element.removeEventListener(type, handler, false);\n } else if (element.detachEvent) {\n element.detachEvent(\"on\" + type, handler);\n } else {\n element[\"on\" + type] = null;\n }\n}\nfunction innerWidth(el) {\n return getSize(el, \"Width\");\n}\nfunction innerHeight(el) {\n return getSize(el, \"Height\");\n}\nfunction getStyles(el) {\n return (SUPPORT_COMPUTEDSTYLE ? window.getComputedStyle(el) : el.currentStyle) || {};\n}\nfunction getSize(el, name) {\n var size = el[\"client\" + name] || el[\"offset\" + name];\n return parseFloat(size || getStyles(el)[name.toLowerCase()]) || 0;\n}\nfunction getContentElements(element, tags, prefix) {\n var skipElements = toArray(element.querySelectorAll(__spreadArrays([\"[\" + prefix + \"skip] [\" + prefix + \"width]\"], tags.map(function (tag) {\n return [\"[\" + prefix + \"skip] \" + tag, tag + \"[\" + prefix + \"skip]\", \"[\" + prefix + \"width] \" + tag].join(\", \");\n })).join(\", \")));\n return toArray(element.querySelectorAll(\"[\" + prefix + \"width], \" + tags.join(\", \"))).filter(function (el) {\n return skipElements.indexOf(el) === -1;\n });\n}\n\n/*\negjs-imready\nCopyright (c) 2020-present NAVER Corp.\nMIT license\n*/\nvar elements = [];\nfunction addAutoSizer(element, prefix) {\n !elements.length && addEvent(window, \"resize\", resizeAllAutoSizers);\n element.__PREFIX__ = prefix;\n elements.push(element);\n resize(element);\n}\nfunction removeAutoSizer(element, prefix) {\n var index = elements.indexOf(element);\n if (index < 0) {\n return;\n }\n var fixed = getAttribute(element, prefix + \"fixed\");\n delete element.__PREFIX__;\n element.style[fixed === HEIGHT ? WIDTH : HEIGHT] = \"\";\n elements.splice(index, 1);\n !elements.length && removeEvent(window, \"resize\", resizeAllAutoSizers);\n}\nfunction resize(element, prefix) {\n if (prefix === void 0) {\n prefix = \"data-\";\n }\n var elementPrefix = element.__PREFIX__ || prefix;\n var dataWidth = parseInt(getAttribute(element, \"\" + elementPrefix + WIDTH), 10) || 0;\n var dataHeight = parseInt(getAttribute(element, \"\" + elementPrefix + HEIGHT), 10) || 0;\n var fixed = getAttribute(element, elementPrefix + \"fixed\");\n if (fixed === HEIGHT) {\n var size = innerHeight(element) || dataHeight;\n element.style[WIDTH] = dataWidth / dataHeight * size + \"px\";\n } else {\n var size = innerWidth(element) || dataWidth;\n element.style[HEIGHT] = dataHeight / dataWidth * size + \"px\";\n }\n}\nfunction resizeAllAutoSizers() {\n elements.forEach(function (element) {\n resize(element);\n });\n}\n\nvar Loader = /*#__PURE__*/function (_super) {\n __extends(Loader, _super);\n function Loader(element, options) {\n if (options === void 0) {\n options = {};\n }\n var _this = _super.call(this) || this;\n _this.isReady = false;\n _this.isPreReady = false;\n _this.hasDataSize = false;\n _this.hasLoading = false;\n _this.isSkip = false;\n _this.onCheck = function (e) {\n _this.clear();\n if (e && e.type === \"error\") {\n _this.onError(_this.element);\n }\n if (_this.hasLoading && _this.checkElement()) {\n // I'm not ready\n return;\n }\n // I'm pre-ready and ready!\n var withPreReady = !_this.hasDataSize && !_this.hasLoading;\n _this.onReady(withPreReady);\n };\n _this.options = __assign({\n prefix: \"data-\"\n }, options);\n _this.element = element;\n var prefix = _this.options.prefix;\n _this.hasDataSize = hasSizeAttribute(element, prefix);\n _this.isSkip = hasSkipAttribute(element, prefix);\n _this.hasLoading = hasLoadingAttribute(element, prefix);\n return _this;\n }\n var __proto = Loader.prototype;\n __proto.check = function () {\n if (this.isSkip || !this.checkElement()) {\n // I'm Ready\n this.onAlreadyReady(true);\n return false;\n }\n if (this.hasDataSize) {\n addAutoSizer(this.element, this.options.prefix);\n }\n if (this.hasDataSize || this.hasLoading) {\n // I'm Pre Ready\n this.onAlreadyPreReady();\n }\n // Wati Pre Ready, Ready\n return true;\n };\n __proto.addEvents = function () {\n var _this = this;\n var element = this.element;\n this.constructor.EVENTS.forEach(function (name) {\n addEvent(element, name, _this.onCheck);\n });\n };\n __proto.clear = function () {\n var _this = this;\n var element = this.element;\n this.constructor.EVENTS.forEach(function (name) {\n removeEvent(element, name, _this.onCheck);\n });\n this.removeAutoSizer();\n };\n __proto.destroy = function () {\n this.clear();\n this.off();\n };\n __proto.removeAutoSizer = function () {\n if (this.hasDataSize) {\n // I'm already ready.\n var prefix = this.options.prefix;\n removeAutoSizer(this.element, prefix);\n }\n };\n __proto.onError = function (target) {\n this.trigger(\"error\", {\n element: this.element,\n target: target\n });\n };\n __proto.onPreReady = function () {\n if (this.isPreReady) {\n return;\n }\n this.isPreReady = true;\n this.trigger(\"preReady\", {\n element: this.element,\n hasLoading: this.hasLoading,\n isSkip: this.isSkip\n });\n };\n __proto.onReady = function (withPreReady) {\n if (this.isReady) {\n return;\n }\n withPreReady = !this.isPreReady && withPreReady;\n if (withPreReady) {\n this.isPreReady = true;\n }\n this.removeAutoSizer();\n this.isReady = true;\n this.trigger(\"ready\", {\n element: this.element,\n withPreReady: withPreReady,\n hasLoading: this.hasLoading,\n isSkip: this.isSkip\n });\n };\n __proto.onAlreadyError = function (target) {\n var _this = this;\n setTimeout(function () {\n _this.onError(target);\n });\n };\n __proto.onAlreadyPreReady = function () {\n var _this = this;\n setTimeout(function () {\n _this.onPreReady();\n });\n };\n __proto.onAlreadyReady = function (withPreReady) {\n var _this = this;\n setTimeout(function () {\n _this.onReady(withPreReady);\n });\n };\n Loader.EVENTS = [];\n return Loader;\n}(Component);\n\nvar ElementLoader = /*#__PURE__*/function (_super) {\n __extends(ElementLoader, _super);\n function ElementLoader() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n var __proto = ElementLoader.prototype;\n __proto.setHasLoading = function (hasLoading) {\n this.hasLoading = hasLoading;\n };\n __proto.check = function () {\n if (this.isSkip) {\n // I'm Ready\n this.onAlreadyReady(true);\n return false;\n }\n if (this.hasDataSize) {\n addAutoSizer(this.element, this.options.prefix);\n this.onAlreadyPreReady();\n } else {\n // has not data size\n this.trigger(\"requestChildren\");\n }\n return true;\n };\n __proto.checkElement = function () {\n return true;\n };\n __proto.destroy = function () {\n this.clear();\n this.trigger(\"requestDestroy\");\n this.off();\n };\n __proto.onAlreadyPreReady = function () {\n // has data size\n _super.prototype.onAlreadyPreReady.call(this);\n this.trigger(\"reqeustReadyChildren\");\n };\n ElementLoader.EVENTS = [];\n return ElementLoader;\n}(Loader);\n\n/**\n * @alias eg.ImReady\n * @extends eg.Component\n */\nvar ImReadyManager = /*#__PURE__*/function (_super) {\n __extends(ImReadyManager, _super);\n /**\n * @param - ImReady's options\n */\n function ImReadyManager(options) {\n if (options === void 0) {\n options = {};\n }\n var _this = _super.call(this) || this;\n _this.readyCount = 0;\n _this.preReadyCount = 0;\n _this.totalCount = 0;\n _this.totalErrorCount = 0;\n _this.isPreReadyOver = true;\n _this.elementInfos = [];\n _this.options = __assign({\n loaders: {},\n prefix: \"data-\"\n }, options);\n return _this;\n }\n /**\n * Checks whether elements are in the ready state.\n * @ko 엘리먼트가 준비 상태인지 체크한다.\n * @elements - Elements to check ready status.
\n * ![](\"./1.jpg\")
\n * ![](\"./2.jpg\")
\n * ![](\"ERR\")
\n *
\n * ```\n * ## Javascript\n * ```js\n * import ImReady from \"@egjs/imready\";\n *\n * const im = new ImReady(); // umd: eg.ImReady\n * im.check(document.querySelectorAll(\"img\")).on({\n * preReadyElement: e => {\n * // 1, 3\n * // 2, 3\n * // 3, 3\n * console.log(e.preReadyCount, e.totalCount),\n * },\n * });\n * ```\n */\n var __proto = ImReadyManager.prototype;\n __proto.check = function (elements) {\n var _this = this;\n var prefix = this.options.prefix;\n this.clear();\n this.elementInfos = toArray(elements).map(function (element, index) {\n var loader = _this.getLoader(element, {\n prefix: prefix\n });\n loader.check();\n loader.on(\"error\", function (e) {\n _this.onError(index, e.target);\n }).on(\"preReady\", function (e) {\n var info = _this.elementInfos[index];\n info.hasLoading = e.hasLoading;\n info.isSkip = e.isSkip;\n var isPreReady = _this.checkPreReady(index);\n _this.onPreReadyElement(index);\n isPreReady && _this.onPreReady();\n }).on(\"ready\", function (_a) {\n var withPreReady = _a.withPreReady,\n hasLoading = _a.hasLoading,\n isSkip = _a.isSkip;\n var info = _this.elementInfos[index];\n info.hasLoading = hasLoading;\n info.isSkip = isSkip;\n var isPreReady = withPreReady && _this.checkPreReady(index);\n var isReady = _this.checkReady(index);\n // Pre-ready and ready occur simultaneously\n withPreReady && _this.onPreReadyElement(index);\n _this.onReadyElement(index);\n isPreReady && _this.onPreReady();\n isReady && _this.onReady();\n });\n return {\n loader: loader,\n element: element,\n hasLoading: false,\n hasError: false,\n isPreReady: false,\n isReady: false,\n isSkip: false\n };\n });\n var length = this.elementInfos.length;\n this.totalCount = length;\n if (!length) {\n setTimeout(function () {\n _this.onPreReady();\n _this.onReady();\n });\n }\n return this;\n };\n /**\n * Gets the total count of elements to be checked.\n * @ko 체크하는 element의 총 개수를 가져온다.\n */\n __proto.getTotalCount = function () {\n return this.totalCount;\n };\n /**\n * Whether the elements are all pre-ready. (all sizes are known)\n * @ko 엘리먼트들이 모두 사전 준비가 됐는지 (사이즈를 전부 알 수 있는지) 여부.\n */\n __proto.isPreReady = function () {\n return this.elementInfos.every(function (info) {\n return info.isPreReady;\n });\n };\n /**\n * Whether the elements are all ready.\n * @ko 엘리먼트들이 모두 준비가 됐는지 여부.\n */\n __proto.isReady = function () {\n return this.elementInfos.every(function (info) {\n return info.isReady;\n });\n };\n /**\n * Whether an error has occurred in the elements in the current state.\n * @ko 현재 상태에서 엘리먼트들이 에러가 발생했는지 여부.\n */\n __proto.hasError = function () {\n return this.totalErrorCount > 0;\n };\n /**\n * Clears events of elements being checked.\n * @ko 체크 중인 엘리먼트들의 이벤트를 해제 한다.\n */\n __proto.clear = function () {\n this.isPreReadyOver = false;\n this.totalCount = 0;\n this.preReadyCount = 0;\n this.readyCount = 0;\n this.totalErrorCount = 0;\n this.elementInfos.forEach(function (info) {\n if (info.loader) {\n info.loader.destroy();\n }\n });\n this.elementInfos = [];\n };\n /**\n * Destory all events.\n * @ko 모든 이벤트를 해제 한다.\n */\n __proto.destroy = function () {\n this.clear();\n this.off();\n };\n __proto.getLoader = function (element, options) {\n var _this = this;\n var tagName = element.tagName.toLowerCase();\n var loaders = this.options.loaders;\n var prefix = options.prefix;\n var tags = Object.keys(loaders);\n if (loaders[tagName]) {\n return new loaders[tagName](element, options);\n }\n var loader = new ElementLoader(element, options);\n var children = toArray(element.querySelectorAll(tags.join(\", \")));\n loader.setHasLoading(children.some(function (el) {\n return hasLoadingAttribute(el, prefix);\n }));\n var withPreReady = false;\n var childrenImReady = this.clone().on(\"error\", function (e) {\n loader.onError(e.target);\n }).on(\"ready\", function () {\n loader.onReady(withPreReady);\n });\n loader.on(\"requestChildren\", function () {\n // has not data size\n var contentElements = getContentElements(element, tags, _this.options.prefix);\n childrenImReady.check(contentElements).on(\"preReady\", function (e) {\n withPreReady = e.isReady;\n if (!withPreReady) {\n loader.onPreReady();\n }\n });\n }).on(\"reqeustReadyChildren\", function () {\n // has data size\n // loader call preReady\n // check only video, image elements\n childrenImReady.check(children);\n }).on(\"requestDestroy\", function () {\n childrenImReady.destroy();\n });\n return loader;\n };\n __proto.clone = function () {\n return new ImReadyManager(__assign({}, this.options));\n };\n __proto.checkPreReady = function (index) {\n this.elementInfos[index].isPreReady = true;\n ++this.preReadyCount;\n if (this.preReadyCount < this.totalCount) {\n return false;\n }\n return true;\n };\n __proto.checkReady = function (index) {\n this.elementInfos[index].isReady = true;\n ++this.readyCount;\n if (this.readyCount < this.totalCount) {\n return false;\n }\n return true;\n };\n __proto.onError = function (index, target) {\n var info = this.elementInfos[index];\n info.hasError = true;\n /**\n * An event occurs if the image, video fails to load.\n * @ko 이미지, 비디오가 로딩에 실패하면 이벤트가 발생한다.\n * @event eg.ImReady#error\n * @param {eg.ImReady.OnError} e - The object of data to be sent to an event \n * \n * \n * \n * ![](\"./2.jpg\"/)
\n * ![](\"ERR\"/)
\n *
\n * ```\n * ## Javascript\n * ```js\n * import ImReady from \"@egjs/imready\";\n *\n * const im = new ImReady(); // umd: eg.ImReady\n * im.check([document.querySelector(\"div\")]).on({\n * error: e => {\n * // \n * \n * ...
, 0, \n * \n * \n * \n *
\n * ```\n * ## Javascript\n * ```js\n * import ImReady from \"@egjs/imready\";\n *\n * const im = new ImReady(); // umd: eg.ImReady\n * im.check(document.querySelectorAll(\"img\")).on({\n * preReadyElement: e => {\n * // 1, 3\n * // 2, 3\n * // 3, 3\n * console.log(e.preReadyCount, e.totalCount),\n * },\n * });\n * ```\n */\n this.trigger(new ComponentEvent(\"preReadyElement\", {\n element: info.element,\n index: index,\n preReadyCount: this.preReadyCount,\n readyCount: this.readyCount,\n totalCount: this.totalCount,\n isPreReady: this.isPreReady(),\n isReady: this.isReady(),\n hasLoading: info.hasLoading,\n isSkip: info.isSkip\n }));\n };\n __proto.onPreReady = function () {\n this.isPreReadyOver = true;\n /**\n * An event occurs when all element are pre-ready (When all elements have the loading attribute applied or the size is known)\n * @ko 모든 엘리먼트들이 사전 준비된 경우 (모든 엘리먼트들이 loading 속성이 적용되었거나 사이즈를 알 수 있는 경우) 이벤트가 발생한다.\n * @event eg.ImReady#preReady\n * @param {eg.ImReady.OnPreReady} e - The object of data to be sent to an event \n * \n * \n * \n * \n * \n *
\n * ```\n * ## Javascript\n * ```js\n * import ImReady from \"@egjs/imready\";\n *\n * const im = new ImReady(); // umd: eg.ImReady\n * im.check(document.querySelectorAll(\"img\")).on({\n * preReady: e => {\n * // 0, 3\n * console.log(e.readyCount, e.totalCount),\n * },\n * });\n * ```\n */\n this.trigger(new ComponentEvent(\"preReady\", {\n readyCount: this.readyCount,\n totalCount: this.totalCount,\n isReady: this.isReady(),\n hasLoading: this.hasLoading()\n }));\n };\n __proto.onReadyElement = function (index) {\n var info = this.elementInfos[index];\n /**\n * An event occurs when the element is ready\n * @ko 해당 엘리먼트가 준비가 되었을 때 이벤트가 발생한다.\n * @event eg.ImReady#readyElement\n * @param {eg.ImReady.OnReadyElement} e - The object of data to be sent to an event \n * \n * \n * \n * \n * \n *
\n * ```\n * ## Javascript\n * ```js\n * import ImReady from \"@egjs/imready\";\n *\n * const im = new ImReady(); // umd: eg.ImReady\n * im.check(document.querySelectorAll(\"img\")).on({\n * readyElement: e => {\n * // 1, 0, false, 3\n * // 2, 1, false, 3\n * // 3, 2, true, 3\n * console.log(e.readyCount, e.index, e.hasError, e.totalCount),\n * },\n * });\n * ```\n */\n this.trigger(new ComponentEvent(\"readyElement\", {\n index: index,\n element: info.element,\n hasError: info.hasError,\n errorCount: this.getErrorCount(),\n totalErrorCount: this.totalErrorCount,\n preReadyCount: this.preReadyCount,\n readyCount: this.readyCount,\n totalCount: this.totalCount,\n isPreReady: this.isPreReady(),\n isReady: this.isReady(),\n hasLoading: info.hasLoading,\n isPreReadyOver: this.isPreReadyOver,\n isSkip: info.isSkip\n }));\n };\n __proto.onReady = function () {\n /**\n * An event occurs when all element are ready\n * @ko 모든 엘리먼트들이 준비된 경우 이벤트가 발생한다.\n * @event eg.ImReady#ready\n * @param {eg.ImReady.OnReady} e - The object of data to be sent to an event \n * \n * \n * \n * \n * \n *
\n * ```\n * ## Javascript\n * ```js\n * import ImReady from \"@egjs/imready\";\n *\n * const im = new ImReady(); // umd: eg.ImReady\n * im.check(document.querySelectorAll(\"img\")).on({\n * preReady: e => {\n * // 0, 3\n * console.log(e.readyCount, e.totalCount),\n * },\n * ready: e => {\n * // 1, 3\n * console.log(e.errorCount, e.totalCount),\n * },\n * });\n * ```\n */\n this.trigger(new ComponentEvent(\"ready\", {\n errorCount: this.getErrorCount(),\n totalErrorCount: this.totalErrorCount,\n totalCount: this.totalCount\n }));\n };\n __proto.getErrorCount = function () {\n return this.elementInfos.filter(function (info) {\n return info.hasError;\n }).length;\n };\n __proto.hasLoading = function () {\n return this.elementInfos.some(function (info) {\n return info.hasLoading;\n });\n };\n return ImReadyManager;\n}(Component);\n\nvar ImageLoader = /*#__PURE__*/function (_super) {\n __extends(ImageLoader, _super);\n function ImageLoader() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n var __proto = ImageLoader.prototype;\n __proto.checkElement = function () {\n var element = this.element;\n var src = element.getAttribute(\"src\");\n if (element.complete) {\n if (src) {\n // complete\n if (!element.naturalWidth) {\n this.onAlreadyError(element);\n }\n return false;\n } else {\n // Using an external lazy loading module\n this.onAlreadyPreReady();\n }\n }\n this.addEvents();\n IS_IE && element.setAttribute(\"src\", src);\n return true;\n };\n ImageLoader.EVENTS = [\"load\", \"error\"];\n return ImageLoader;\n}(Loader);\n\nvar VideoLoader = /*#__PURE__*/function (_super) {\n __extends(VideoLoader, _super);\n function VideoLoader() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n var __proto = VideoLoader.prototype;\n __proto.checkElement = function () {\n var element = this.element;\n // HAVE_NOTHING: 0, no information whether or not the audio/video is ready\n // HAVE_METADATA: 1, HAVE_METADATA - metadata for the audio/video is ready\n // HAVE_CURRENT_DATA: 2, data for the current playback position is available, but not enough data to play next frame/millisecond\n // HAVE_FUTURE_DATA: 3, data for the current and at least the next frame is available\n // HAVE_ENOUGH_DATA: 4, enough data available to start playing\n if (element.readyState >= 1) {\n return false;\n }\n if (element.error) {\n this.onAlreadyError(element);\n return false;\n }\n this.addEvents();\n return true;\n };\n VideoLoader.EVENTS = [\"loadedmetadata\", \"error\"];\n return VideoLoader;\n}(Loader);\n\nvar ImReady = /*#__PURE__*/function (_super) {\n __extends(ImReady, _super);\n function ImReady(options) {\n if (options === void 0) {\n options = {};\n }\n return _super.call(this, __assign({\n loaders: {\n img: ImageLoader,\n video: VideoLoader\n }\n }, options)) || this;\n }\n return ImReady;\n}(ImReadyManager);\n\nvar REACTIVE_IMREADY = function (_a) {\n var setEvents = _a.setEvents,\n setMethods = _a.setMethods,\n on = _a.on,\n onInit = _a.onInit,\n onDestroy = _a.onDestroy,\n getProps = _a.getProps;\n setEvents(EVENTS);\n setMethods([\"add\"]);\n var children = [];\n var reactiveImReady = reactive({\n preReadyCount: 0,\n readyCount: 0,\n errorCount: 0,\n totalErrorCount: 0,\n totalCount: 0,\n isPreReady: false,\n isReady: false,\n hasError: false,\n isPreReadyOver: false,\n add: function (element) {\n children.push(element);\n }\n });\n var props = getProps() || {};\n var imReady = new ImReady(props);\n imReady.on(\"error\", function (e) {\n reactiveImReady.hasError = true;\n reactiveImReady.errorCount = e.errorCount;\n reactiveImReady.totalErrorCount = e.totalErrorCount;\n }).on(\"preReadyElement\", function (e) {\n reactiveImReady.preReadyCount = e.preReadyCount;\n }).on(\"readyElement\", function (e) {\n reactiveImReady.readyCount = e.readyCount;\n reactiveImReady.isPreReadyOver = e.isPreReadyOver;\n }).on(\"preReady\", function () {\n reactiveImReady.isPreReady = true;\n }).on(\"ready\", function () {\n reactiveImReady.isReady = true;\n });\n on(function (_, name, callback) {\n imReady.on(name, callback);\n return function () {\n imReady.off(name, callback);\n };\n });\n onInit(function () {\n var selector = props === null || props === void 0 ? void 0 : props.selector;\n var checkedElements = [];\n children.forEach(function (child) {\n if (!child) {\n return;\n }\n if (isString(child)) {\n checkedElements = __spreadArrays(checkedElements, toArray(document.querySelectorAll(child)));\n } else if (child instanceof Element) {\n checkedElements.push(child);\n } else if (\"value\" in child || \"current\" in child) {\n var element = child.value || child.current;\n if (element) {\n checkedElements.push(element);\n }\n }\n });\n if (selector) {\n checkedElements = checkedElements.reduce(function (prev, cur) {\n return __spreadArrays(prev, [].slice.call(cur.querySelectorAll(selector)));\n }, []);\n }\n reactiveImReady.totalCount = checkedElements.length;\n imReady.check(checkedElements);\n });\n onDestroy(function () {\n imReady.destroy();\n });\n return reactiveImReady;\n};\n\n/*\negjs-imready\nCopyright (c) 2020-present NAVER Corp.\nMIT license\n*/\n\nexport default ImReady;\nexport { EVENTS, ImageLoader, Loader, ImReadyManager as Manager, PROPS, REACTIVE_IMREADY, VideoLoader };\n","/*\nCopyright (c) 2023-present NAVER Corp.\nname: @egjs/view360\nlicense: MIT\nauthor: NAVER Corp.\nrepository: https://github.com/naver/egjs-view360\nversion: 4.0.0-beta.7\n*/\nimport Component from '@egjs/component';\nimport { quat, vec3, mat4, vec2 } from 'gl-matrix';\nimport ImReady from '@egjs/imready';\n\n/******************************************************************************\r\nCopyright (c) Microsoft Corporation.\r\n\r\nPermission to use, copy, modify, and/or distribute this software for any\r\npurpose with or without fee is hereby granted.\r\n\r\nTHE SOFTWARE IS PROVIDED \"AS IS\" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH\r\nREGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY\r\nAND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,\r\nINDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM\r\nLOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR\r\nOTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR\r\nPERFORMANCE OF THIS SOFTWARE.\r\n***************************************************************************** */\nfunction __awaiter(thisArg, _arguments, P, generator) {\n function adopt(value) {\n return value instanceof P ? value : new P(function (resolve) {\n resolve(value);\n });\n }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) {\n try {\n step(generator.next(value));\n } catch (e) {\n reject(e);\n }\n }\n function rejected(value) {\n try {\n step(generator[\"throw\"](value));\n } catch (e) {\n reject(e);\n }\n }\n function step(result) {\n result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected);\n }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n}\n\n/*\r\n * Copyright (c) 2023-present NAVER Corp.\r\n * egjs projects are licensed under the MIT license\r\n */\n/**\r\n * Error thrown by {@link View360}\r\n * @ko {@link View360}이 발생시킨 에러\r\n * @since 4.0.0\r\n */\nclass View360Error extends Error {\n /**\r\n * Create new instance of View360Error\r\n * @ko View360Error의 인스턴스를 생성합니다.\r\n * @param message - Error message {@ko 에러 메시지}\r\n * @param code - Error code {@ko 에러 코드}\r\n */\n constructor(message, code) {\n super(message);\n Object.setPrototypeOf(this, View360Error.prototype);\n this.name = \"View360Error\";\n this.code = code;\n }\n}\n\n/*\r\n * Copyright (c) 2023-present NAVER Corp.\r\n * egjs projects are licensed under the MIT license\r\n */\n/**\r\n * Error codes of {@link View360Error}\r\n * @ko {@link View360Error}가 가질 수 있는 에러 코드 값들\r\n * @since 4.0.0\r\n */\nconst ERROR_CODES = {\n /**\r\n * The given value's type is not expected\r\n * @ko 주어진 값의 타입이 잘못되었을 경우\r\n * @since 4.0.0\r\n */\n WRONG_TYPE: 0,\n /**\r\n * The given value is not a supported option\r\n * @ko 잘못된 옵션을 받았을 경우\r\n * @since 4.0.0\r\n */\n WRONG_OPTION: 1,\n /**\r\n * The element with given CSS selector does not exist\r\n * @ko 주어진 CSS 셀렉터로 엘리먼트를 찾지 못했을 경우\r\n * @since 4.0.0\r\n */\n ELEMENT_NOT_FOUND: 2,\n /**\r\n * Couldn't find canvas element inside the given container element.\r\n * @ko 컨테이너 엘리먼트 내부에서 캔버스 엘리먼트를 찾지 못했을 경우\r\n * @since 4.0.0\r\n */\n CANVAS_NOT_FOUND: 3,\n /**\r\n * The browser does not support WebGL\r\n * @ko 브라우저가 WebGL을 지원하지 않는 경우\r\n * @since 4.0.0\r\n */\n WEBGL_NOT_SUPPORTED: 4,\n /**\r\n * Failed creating canvas 2D context\r\n * @ko 캔버스 2D 컨텍스트를 생성하지 못한 경우\r\n * @since 4.0.0\r\n */\n FAILED_CREATE_CONTEXT_2D: 5,\n /**\r\n * `init()` is called before setting {@link View360Options#projection}\r\n * @ko {@link View360Options#projection}을 설정하기 전에 `init()`이 호출된 경우\r\n * @since 4.0.0\r\n */\n PROVIDE_PROJECTION_FIRST: 6,\n /**\r\n * Failed linking WebGL program. Only can be thrown when {@link View360Options#debug} is `true`.\r\n * @ko WebGL 프로그램 링크에 실패한 경우. {@link View360Options#debug}를 `true`로 설정한 경우에만 발생할 수 있습니다.\r\n * @since 4.0.0\r\n */\n FAILED_LINKING_PROGRAM: 7,\n /**\r\n * Arguments are not sufficient for the given property.\r\n * @ko 프로퍼티에 값이 충분히 주어지지 않았을 때\r\n * @since 4.0.0\r\n */\n INSUFFICIENT_ARGS: 8\n};\nconst MESSAGES = {\n WRONG_TYPE: (val, types) => `${typeof val} is not a ${types.map(type => `\"${type}\"`).join(\" or \")}.`,\n WRONG_OPTION: (val, optionName) => `Bad option: given \"${val}\" for option \"${optionName}\".`,\n ELEMENT_NOT_FOUND: query => `Element with selector \"${query}\" not found.`,\n CANVAS_NOT_FOUND: \"The canvas element was not found inside the given root element.\",\n WEBGL_NOT_SUPPORTED: \"WebGL is not supported on this browser.\",\n FAILED_CREATE_CONTEXT_2D: \"Failed to create canvas 2D context\",\n PROVIDE_PROJECTION_FIRST: \"\\\"projection\\\" should be provided before initialization.\",\n FAILED_LINKING_PROGRAM: (msg, shaderLog) => `Failed linking WebGL program - \"${msg}\\nShader compile Log: ${shaderLog}`,\n INSUFFICIENT_ARGS: (val, name) => `Insufficient arguments: given \"${val}\" for \"${name}\".`\n};\nvar ERROR = {\n CODES: ERROR_CODES,\n MESSAGES\n};\n\n/*\r\n * Copyright (c) 2023-present NAVER Corp.\r\n * egjs projects are licensed under the MIT license\r\n */\nconst EVENTS$1 = {\n MOUSE_DOWN: \"mousedown\",\n MOUSE_MOVE: \"mousemove\",\n MOUSE_UP: \"mouseup\",\n TOUCH_START: \"touchstart\",\n TOUCH_MOVE: \"touchmove\",\n TOUCH_END: \"touchend\",\n WHEEL: \"wheel\",\n RESIZE: \"resize\",\n CONTEXT_MENU: \"contextmenu\",\n MOUSE_ENTER: \"mouseenter\",\n MOUSE_LEAVE: \"mouseleave\",\n POINTER_DOWN: \"pointerdown\",\n POINTER_MOVE: \"pointermove\",\n POINTER_UP: \"pointerup\",\n POINTER_CANCEL: \"pointercancel\",\n POINTER_ENTER: \"pointerenter\",\n POINTER_LEAVE: \"pointerleave\",\n KEY_DOWN: \"keydown\",\n KEY_UP: \"keyup\",\n LOAD: \"load\",\n ERROR: \"error\",\n CLICK: \"click\",\n DOUBLE_CLICK: \"dblclick\",\n CONTEXT_CREATE_ERROR: \"webglcontextcreationerror\",\n CONTEXT_LOST: \"webglcontextlost\",\n CONTEXT_RESTORED: \"webglcontextrestored\",\n DEVICE_ORIENTATION: \"deviceorientation\",\n DEVICE_MOTION: \"devicemotion\",\n ORIENTATION_CHANGE: \"orientationchange\",\n VIDEO_PLAY: \"play\",\n VIDEO_PAUSE: \"pause\",\n VIDEO_LOADED_DATA: \"loadeddata\",\n VIDEO_VOLUME_CHANGE: \"volumechange\",\n VIDEO_TIME_UPDATE: \"timeupdate\",\n VIDEO_DURATION_CHANGE: \"durationchange\",\n VIDEO_CAN_PLAYTHROUGH: \"canplaythrough\",\n TRANSITION_END: \"transitionend\",\n XR_END: \"end\"\n};\nconst EL_DIV = \"div\";\nconst EL_BUTTON = \"button\";\n// https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent.button\nvar MOUSE_BUTTON;\n(function (MOUSE_BUTTON) {\n MOUSE_BUTTON[MOUSE_BUTTON[\"LEFT\"] = 0] = \"LEFT\";\n MOUSE_BUTTON[MOUSE_BUTTON[\"MIDDLE\"] = 1] = \"MIDDLE\";\n MOUSE_BUTTON[MOUSE_BUTTON[\"RIGHT\"] = 2] = \"RIGHT\";\n})(MOUSE_BUTTON || (MOUSE_BUTTON = {}));\nconst CURSOR = {\n GRAB: \"grab\",\n GRABBING: \"grabbing\",\n NONE: \"\"\n};\nconst KEY_DIRECTION = [\"LEFT\", \"UP\", \"RIGHT\", \"DOWN\"];\nvar DIRECTION_KEY_CODE;\n(function (DIRECTION_KEY_CODE) {\n DIRECTION_KEY_CODE[DIRECTION_KEY_CODE[\"LEFT\"] = 37] = \"LEFT\";\n DIRECTION_KEY_CODE[DIRECTION_KEY_CODE[\"UP\"] = 38] = \"UP\";\n DIRECTION_KEY_CODE[DIRECTION_KEY_CODE[\"RIGHT\"] = 39] = \"RIGHT\";\n DIRECTION_KEY_CODE[DIRECTION_KEY_CODE[\"DOWN\"] = 40] = \"DOWN\";\n})(DIRECTION_KEY_CODE || (DIRECTION_KEY_CODE = {}));\nconst SPACE_KEY_CODE = 32;\nconst DIRECTION_KEY_NAME = {\n LEFT: \"ArrowLeft\",\n UP: \"ArrowUp\",\n RIGHT: \"ArrowRight\",\n DOWN: \"ArrowDown\"\n};\nconst SPACE_KEY_NAME = \" \";\nconst FULLSCREEN_REQUEST = [\"requestFullscreen\", \"webkitRequestFullscreen\", \"webkitRequestFullScreen\", \"webkitCancelFullScreen\", \"mozRequestFullScreen\", \"msRequestFullscreen\"];\nconst FULLSCREEN_ELEMENT = [\"fullscreenElement\", \"webkitFullscreenElement\", \"webkitCurrentFullScreenElement\", \"mozFullScreenElement\", \"msFullscreenElement\"];\nconst FULLSCREEN_EXIT = [\"exitFullscreen\", \"webkitExitFullscreen\", \"webkitCancelFullScreen\", \"mozCancelFullScreen\", \"msExitFullscreen\"];\nconst FULLSCREEN_CHANGE = [\"fullscreenchange\", \"webkitfullscreenchange\", \"mozfullscreenchange\", \"MSFullscreenChange\"];\n\n/*\r\n * Copyright (c) 2023-present NAVER Corp.\r\n * egjs projects are licensed under the MIT license\r\n */\n/**\r\n * Default class names\r\n * @ko 기본 클래스 이름들\r\n * @since 4.0.0\r\n */\nconst DEFAULT_CLASS = {\n CONTAINER: \"view360-container\",\n CANVAS: \"view360-canvas\",\n CTX_LOST: \"view360-ctx-lost\",\n IN_VR: \"view360-vr-presenting\",\n HOTSPOT_CONTAINER: \"view360-hotspots\",\n HOTSPOT: \"view360-hotspot\",\n HOTSPOT_VISIBLE: \"view360-hotspot-visible\",\n HOTSPOT_FLIP_X: \"view360-hotspot-flip-x\",\n HOTSPOT_FLIP_Y: \"view360-hotspot-flip-y\"\n};\n/**\r\n * Event names\r\n * @ko 이벤트 이름들\r\n * @since 4.0.0\r\n * @example\r\n * ```ts\r\n * import View360, { EVENTS } from \"@egjs/view360\";\r\n *\r\n * const viewer = new View360(\"#el_id\");\r\n *\r\n * viewer.on(EVENTS.READY, evt => {\r\n * console.log(\"View360 is ready!\");\r\n * });\r\n * ```\r\n */\nconst EVENTS = {\n READY: \"ready\",\n LOAD_START: \"loadStart\",\n LOAD: \"load\",\n PROJECTION_CHANGE: \"projectionChange\",\n RESIZE: \"resize\",\n BEFORE_RENDER: \"beforeRender\",\n RENDER: \"render\",\n INPUT_START: \"inputStart\",\n INPUT_END: \"inputEnd\",\n VIEW_CHANGE: \"viewChange\",\n STATIC_CLICK: \"staticClick\",\n VR_START: \"vrStart\",\n VR_END: \"vrEnd\"\n};\n/**\r\n * Collection of predefined easing functions\r\n * @ko 미리 정의된 easing 함수들\r\n */\nconst EASING = {\n LINEAR: x => x,\n SINE_WAVE: x => Math.sin(x * Math.PI * 2),\n EASE_OUT_CUBIC: x => 1 - Math.pow(1 - x, 3),\n EASE_OUT_BOUNCE: x => {\n const n1 = 7.5625;\n const d1 = 2.75;\n if (x < 1 / d1) {\n return n1 * x * x;\n } else if (x < 2 / d1) {\n return n1 * (x -= 1.5 / d1) * x + 0.75;\n } else if (x < 2.5 / d1) {\n return n1 * (x -= 2.25 / d1) * x + 0.9375;\n } else {\n return n1 * (x -= 2.625 / d1) * x + 0.984375;\n }\n }\n};\n\nvar _a;\nconst CAMERA_EVENTS = {\n CHANGE: \"change\",\n ANIMATION_END: \"animationEnd\"\n};\nconst OBJECT_3D_EVENTS = {\n UPDATE: \"update\"\n};\nconst CONTROL_EVENTS = {\n INPUT_START: \"inputStart\",\n CHANGE: \"change\",\n INPUT_END: \"inputEnd\",\n ENABLE: \"enable\",\n DISABLE: \"disable\",\n STATIC_CLICK: \"staticClick\"\n};\nconst DEG_TO_RAD = Math.PI / 180;\nconst RAD_TO_DEG = 180 / Math.PI;\nconst DEFAULT_EASING = EASING.EASE_OUT_CUBIC;\nconst DEFAULT_ANIMATION_DURATION = 300;\nconst INFINITE_RANGE = {\n min: -Infinity,\n max: Infinity\n};\nconst DEFAULT_PITCH_RANGE = {\n min: -90,\n max: 90\n};\nconst DEFAULT_ZOOM_RANGE = {\n min: 0.6,\n max: 10\n};\nvar ROTATE;\n(function (ROTATE) {\n ROTATE[ROTATE[\"ZERO\"] = 0] = \"ZERO\";\n ROTATE[ROTATE[\"CW_90\"] = 1] = \"CW_90\";\n ROTATE[ROTATE[\"CCW_90\"] = 2] = \"CCW_90\";\n ROTATE[ROTATE[\"CW_180\"] = 3] = \"CW_180\";\n})(ROTATE || (ROTATE = {}));\n// Custom event name for video time change\nconst VIDEO_TIME_CHANGE_EVENT = \"view360videotimechange\";\nconst SVG_NAMESPACE = \"http://www.w3.org/2000/svg\";\nconst SESSION_VR = \"immersive-vr\";\nconst XR_REFERENCE_SPACE = \"local\";\nconst EPSILON = (_a = Number.EPSILON) !== null && _a !== void 0 ? _a : 2.220446049250313e-16;\n\n/*\r\n * Copyright (c) 2023-present NAVER Corp.\r\n * egjs projects are licensed under the MIT license\r\n */\nconst isString = val => typeof val === \"string\";\nconst isElement = val => !!val && val.nodeType === Node.ELEMENT_NODE;\nconst createElement = (className, tag = EL_DIV) => {\n const el = document.createElement(tag);\n el.classList.add(className);\n return el;\n};\nconst getNullableElement = (el, parent) => {\n let targetEl = null;\n if (isString(el)) {\n const parentEl = parent ? parent : document;\n const queryResult = parentEl.querySelector(el);\n if (!queryResult) {\n return null;\n }\n targetEl = queryResult;\n } else if (isElement(el)) {\n targetEl = el;\n }\n return targetEl;\n};\nconst getElement = (el, parent) => {\n const targetEl = getNullableElement(el, parent);\n if (!targetEl) {\n if (isString(el)) {\n throw new View360Error(ERROR.MESSAGES.ELEMENT_NOT_FOUND(el), ERROR.CODES.ELEMENT_NOT_FOUND);\n } else {\n throw new View360Error(ERROR.MESSAGES.WRONG_TYPE(el, [\"HTMLElement\", \"string\"]), ERROR.CODES.WRONG_TYPE);\n }\n }\n return targetEl;\n};\nconst findCanvas = (root, selector) => {\n const canvas = root.querySelector(selector);\n if (!canvas) {\n throw new View360Error(ERROR.MESSAGES.CANVAS_NOT_FOUND, ERROR.CODES.CANVAS_NOT_FOUND);\n }\n return canvas;\n};\nconst range = end => {\n if (!end || end <= 0) {\n return [];\n }\n return Array.apply(0, Array(end)).map((undef, idx) => idx);\n};\nconst clamp = (x, min, max) => Math.max(Math.min(x, max), min);\n// Linear interpolation between a and b\nconst lerp = (a, b, t) => {\n return a * (1 - t) + b * t;\n};\nconst circulate = (val, min, max) => {\n const size = Math.abs(max - min);\n if (val < min) {\n const offset = (min - val) % size;\n val = max - offset;\n } else if (val > max) {\n const offset = (val - max) % size;\n val = min + offset;\n }\n return val;\n};\nconst findIndex = (array, checker) => {\n for (let idx = 0; idx < array.length; idx++) {\n if (checker(array[idx])) {\n return idx;\n }\n }\n return -1;\n};\nconst getObjectOption = val => typeof val === \"object\" ? val : {};\nconst toVerticalFov = (fovRadian, aspect) => {\n return Math.atan(Math.tan(fovRadian * 0.5) / aspect) * 2;\n};\nconst reorderCube = (arr, order, defaultOrder = \"RLUDFB\") => {\n return defaultOrder.split(\"\").map(face => order.indexOf(face)).map(index => arr[index]);\n};\nconst isFullscreen = () => {\n if (!document) return false;\n for (const key of FULLSCREEN_ELEMENT) {\n if (document[key]) return true;\n }\n return false;\n};\nconst sensorCanBeEnabledIOS = () => {\n return window.isSecureContext && !!DeviceMotionEvent && \"requestPermission\" in DeviceMotionEvent;\n};\nconst hfovToZoom = (baseFov, fov) => {\n const renderingWidth = Math.tan(DEG_TO_RAD * baseFov * 0.5);\n const zoomedWidth = Math.tan(DEG_TO_RAD * fov * 0.5);\n return renderingWidth / zoomedWidth;\n};\nconst eulerToQuat = (out, yaw, pitch, roll) => {\n quat.identity(out);\n const pitchThreshold = 0.01;\n const pitchClamped = clamp(pitch, -90 + pitchThreshold, 90 - pitchThreshold);\n quat.rotateY(out, out, yaw * DEG_TO_RAD);\n quat.rotateX(out, out, pitchClamped * DEG_TO_RAD);\n quat.rotateZ(out, out, roll * DEG_TO_RAD);\n return out;\n};\n/**\r\n * Extract euler angles from the quaternion, except roll(z-axis rotation)\r\n * @hidden\r\n */\nconst quatToEuler = quaternion => {\n const x = quaternion[0];\n const y = quaternion[1];\n const z = quaternion[2];\n const w = quaternion[3];\n const x2 = x * x;\n const y2 = y * y;\n const z2 = z * z;\n const w2 = w * w;\n const unit = x2 + y2 + z2 + w2;\n const test = x * w - y * z;\n let pitch, yaw;\n if (test > 0.499995 * unit) {\n // singularity at the north pole\n pitch = Math.PI / 2;\n yaw = 2 * Math.atan2(y, x);\n } else if (test < -0.499995 * unit) {\n // singularity at the south pole\n pitch = -Math.PI / 2;\n yaw = -2 * Math.atan2(y, x);\n } else {\n const view = vec3.fromValues(0, 0, 1);\n const up = vec3.fromValues(0, 1, 0);\n vec3.transformQuat(view, view, quaternion);\n vec3.transformQuat(up, up, quaternion);\n const viewXZ = Math.sqrt(view[0] * view[0] + view[2] * view[2]);\n pitch = Math.atan2(-view[1], viewXZ);\n yaw = Math.atan2(view[0], view[2]);\n }\n return {\n pitch: clamp(pitch * RAD_TO_DEG, -90, 90),\n yaw: circulate(yaw * RAD_TO_DEG, 0, 360)\n };\n};\n\n/*\r\n * Copyright (c) 2020 NAVER Corp.\r\n * egjs projects are licensed under the MIT license\r\n */\n/**\r\n * Interpolator between two values with duration\r\n * @ko 특정 시간동안 두 값을 보간해주는 보간기\r\n * @since 4.0.0\r\n */\nclass Motion {\n /**\r\n * Current interpolated value\r\n * @ko 현재 보간된 값\r\n * @since 4.0.0\r\n */\n get val() {\n return this._val;\n }\n /**\r\n * Start(from) value of interpolation\r\n * @ko 보간 시작 값\r\n * @since 4.0.0\r\n */\n get start() {\n return this._start;\n }\n /**\r\n * End(to) value of interpolation\r\n * @ko 보간 끝 값\r\n * @since 4.0.0\r\n */\n get end() {\n return this._end;\n }\n /**\r\n * Interpolation progress value (0 ~ 1)\r\n * @ko 현재 보간 진행정도 (0 ~ 1)\r\n * @since 4.0.0\r\n */\n get progress() {\n return this._progress;\n }\n /**\r\n * Whether the interpolation is in active state.\r\n * @ko 보간 진행중인지 여부. `true`일 경우 보간이 진행중입니다.\r\n * @since 4.0.0\r\n */\n get activated() {\n return this._activated;\n }\n /**\r\n * Duration of the interpolation\r\n * @ko 보간할 시간\r\n * @since 4.0.0\r\n */\n get duration() {\n return this._duration;\n }\n set duration(val) {\n this._duration = val;\n }\n /**\r\n * Whether to loop interpolation on finish\r\n * @ko 보간이 끝난 이후에 다시 시작할지 여부\r\n * @since 4.0.0\r\n */\n get loop() {\n return this._loop;\n }\n set loop(val) {\n this._loop = val;\n }\n /**\r\n * Range of the interpolation\r\n * @ko 보간 범위\r\n * @since 4.0.0\r\n */\n get range() {\n return this._range;\n }\n /**\r\n * Easing function of the interpolation\r\n * @ko 보간에 사용되는 easing function\r\n * @since 4.0.0\r\n */\n get easing() {\n return this._easing;\n }\n set easing(val) {\n this._easing = val;\n }\n /**\r\n * Create new instance.\r\n * @ko 새로운 인스턴스를 생성합니다.\r\n * @param options Options {@ko 옵션들}\r\n * @param options.duration Duration of the interpolation {@ko 보간할 시간}\r\n * @param options.loop Whether to loop interpolation on finish {@ko 보간이 끝난 이후에 다시 시작할지 여부}\r\n * @param options.range Range of the interpolation {@ko 보간 범위}\r\n * @param options.loop Easing function of the interpolation {@ko 보간에 사용되는 easing function}\r\n */\n constructor({\n duration = DEFAULT_ANIMATION_DURATION,\n loop = false,\n range = {\n min: 0,\n max: 1\n },\n easing = DEFAULT_EASING\n } = {}) {\n this._duration = duration;\n this._loop = loop;\n this._range = range;\n this._easing = easing;\n this._activated = false;\n this.reset(0);\n }\n /**\r\n * Update motion and progress it by given deltaTime\r\n * @ko 주어진 deltaTime만큼 보간을 진행합니다.\r\n * @param deltaTime - number of milisec to update motion {@ko 보간을 진행할 시간, 밀리초 단위}\r\n * @returns Difference(delta) of the value from the last update. {@ko 지난 업데이트 이후의 값 변화량}\r\n * @since 4.0.0\r\n */\n update(deltaTime) {\n if (!this._activated) {\n this._val = this._end;\n return 0;\n }\n const start = this._start;\n const end = this._end;\n const duration = this._duration;\n const prev = this._val;\n const loop = this._loop;\n const nextProgress = this._progress + deltaTime / duration;\n this._progress = loop ? circulate(nextProgress, 0, 1) : clamp(nextProgress, 0, 1);\n const easedProgress = this._easing(this._progress);\n this._val = lerp(start, end, easedProgress);\n if (!loop && this._progress >= 1) {\n this._activated = false;\n }\n return this._val - prev;\n }\n /**\r\n * Set `start`, `end` to the given value and set `progress` to 0.\r\n * @ko 주어진 값으로 시작 지점, 끝 지점을 초기화하고 progress를 0으로 세팅합니다.\r\n * @param defaultVal - Value to reset {@ko 초기화할 값}\r\n * @since 4.0.0\r\n */\n reset(defaultVal) {\n const range = this._range;\n const val = clamp(defaultVal, range.min, range.max);\n this._start = val;\n this._end = val;\n this._val = val;\n this._progress = 0;\n this._activated = false;\n }\n /**\r\n * Add delta to start & end and current value.\r\n * @ko 현재 & 끝 및 현재 값에 주어진 값을 더합니다.\r\n * @param delta - Delta value to add {@ko 추가할 값}\r\n */\n add(delta) {\n const range = this._range;\n this._start = clamp(this._start + delta, range.min, range.max);\n this._end = clamp(this._end + delta, range.min, range.max);\n this._val = clamp(this._val + delta, range.min, range.max);\n }\n /**\r\n * Set current value to start, and end to current value + delta, then reset progress to 0.\r\n * @ko 현재 값을 시작 지점으로, 그에서 delta만큼 추가된 값을 끝점으로 하고 progress를 0으로 갱신합니다.\r\n * @param delta - Delta value to add {@ko 추가할 값}\r\n */\n setNewEndByDelta(delta) {\n const range = this._range;\n this._start = this._val;\n this._end = clamp(this._end + delta, range.min, range.max);\n this._progress = 0;\n this._activated = true;\n }\n /**\r\n * Set new range of the interpolation.\r\n * @ko 보간의 범위를 변경합니다.\r\n * @param min - New minimum range {@ko 변경할 범위의 최소값}\r\n * @param max - New maximum range {@ko 변경할 범위의 최대값}\r\n */\n setRange(min, max) {\n this._start = clamp(this._start, min, max);\n this._end = clamp(this._end, min, max);\n this._range = {\n min,\n max\n };\n }\n}\n\n/*\r\n * Copyright (c) 2023-present NAVER Corp.\r\n * egjs projects are licensed under the MIT license\r\n */\n/**\r\n * Animation of the {@link Camera}\r\n * @internal\r\n * @ko {@link Camera}의 애니메이션\r\n * @since 4.0.0\r\n */\nclass CameraAnimation {\n /**\r\n * Duration of the animation\r\n * @ko 애니메이션 재생시간\r\n * @since 4.0.0\r\n */\n get duration() {\n return this._motion.duration;\n }\n set duration(val) {\n this._motion.duration = val;\n }\n /**\r\n * Easing function of the animation\r\n * @ko 애니메이션의 easing function\r\n * @since 4.0.0\r\n */\n get easing() {\n return this._motion.easing;\n }\n set easing(val) {\n this._motion.easing = val;\n }\n /**\r\n * Create new instance\r\n * @ko 새로운 인스턴스를 생성합니다.\r\n * @param camera - Camera to animate {@ko 애니메이션을 적용할 카메라}\r\n * @param from - Start pose {@ko 애니메이션이 시작 시점의 카메라의 회전 및 줌}\r\n * @param to - End pose {@ko 애니메이션이 끝났을 때 카메라의 회전 및 줌}\r\n * @param options - Options {@ko 옵션들}\r\n * @param options.duration - Animation duration {@ko 애니메이션 재생 시간}\r\n * @param options.easing - Animation easing function {@ko 애니메이션 easing function}\r\n */\n constructor(camera, from, to, {\n duration = DEFAULT_ANIMATION_DURATION,\n easing = DEFAULT_EASING\n } = {}) {\n this._camera = camera;\n this._motion = new Motion({\n duration,\n easing,\n range: {\n min: 0,\n max: 1\n }\n });\n this._from = from;\n this._to = to;\n this._finishPromise = new Promise(resolve => {\n this._finish = resolve;\n });\n // Enable motion\n this._motion.setNewEndByDelta(1);\n }\n /**\r\n * Return a promise that resolved on animation end.\r\n * @ko 애니메이션 재생이 끝났을 때 resolve되는 Promise를 반환합니다.\r\n * @since 4.0.0\r\n */\n getFinishPromise() {\n return this._finishPromise;\n }\n /**\r\n * Update animation by given deltaTime.\r\n * @ko 주어진 시간만큼 애니메이션을 업데이트합니다.\r\n * @param deltaTime Number of milisec to update {@ko 업데이트할 시간, 밀리초 단위}\r\n * @since 4.0.0\r\n */\n update(deltaTime) {\n const camera = this._camera;\n const from = this._from;\n const to = this._to;\n const motion = this._motion;\n motion.update(deltaTime);\n // Progress that easing is applied\n const progress = motion.val;\n const rotation = quat.create();\n const zoom = lerp(from.zoom, to.zoom, progress);\n quat.slerp(rotation, from.rotation, to.rotation, progress);\n camera.rotate(rotation, zoom);\n if (progress >= 1) {\n this._finish();\n }\n }\n}\n\n/**\r\n * Camera for View360\r\n * @ko View360용 카메라 구현체\r\n * @version 4.0.0\r\n */\nclass Camera extends Component {\n /**\r\n * Camera's width / height ratio\r\n * @ko 카메라의 가로 / 세로 비율\r\n * @readonly\r\n */\n get aspect() {\n return this._aspect;\n }\n /**\r\n * Whether the camera's rotation changed from the last frame.\r\n * @ko 마지막 프레임 이후로 카메라의 회전값이 변경되었는지 나타내는 플래그.\r\n * @readonly\r\n */\n get changed() {\n return this._changed;\n }\n /**\r\n * @copy View360#yawRange\r\n */\n get yawRange() {\n return this._initialYawRange;\n }\n set yawRange(val) {\n this._initialYawRange = val;\n }\n /**\r\n * @copy View360#pitchRange\r\n */\n get pitchRange() {\n return this._initialPitchRange;\n }\n set pitchRange(val) {\n this._initialPitchRange = val;\n }\n /**\r\n * @copy View360#zoomRange\r\n */\n get zoomRange() {\n return this._initialZoomRange;\n }\n set zoomRange(val) {\n this._initialZoomRange = val;\n }\n /**\r\n * Create new instance of Camera\r\n * @param options - Camera options {@ko 카메라 옵션들}\r\n */\n constructor({\n initialYaw,\n initialPitch,\n initialZoom,\n yawRange,\n pitchRange,\n zoomRange,\n fov\n }) {\n super();\n this.yaw = initialYaw;\n this.pitch = initialPitch;\n this.zoom = initialZoom;\n this.rollOffset = 0;\n this.initialYaw = initialYaw;\n this.initialPitch = initialPitch;\n this.initialZoom = initialZoom;\n this.position = vec3.create();\n this.animation = null;\n this._up = vec3.fromValues(0, 1, 0);\n this._aspect = 1;\n this._initialYawRange = yawRange;\n this._initialPitchRange = pitchRange;\n this._initialZoomRange = zoomRange;\n this._yawRange = yawRange;\n this._pitchRange = pitchRange;\n this._zoomRange = zoomRange;\n this.quaternion = quat.create();\n this._updateQuaternion();\n this.viewMatrix = mat4.create();\n this.projectionMatrix = mat4.create();\n this.fov = fov;\n this._maxRenderHeight = -1;\n }\n /**\r\n * Destroy instance and detach all event listeners\r\n * @ko 인스턴스를 삭제하고 모든 이벤트 리스너를 삭제합니다.\r\n * @since 4.0.0\r\n */\n destroy() {\n this.off();\n }\n /**\r\n * Refresh internal size value.\r\n * @ko 내부 크기값을 갱신합니다.\r\n * @param width - New width {@ko 변경된 너비값}\r\n * @param height - New height {@ko 변경된 높이값}\r\n * @since 4.0.0\r\n */\n resize(width, height) {\n const prevAspect = this._aspect;\n this._aspect = width / height;\n if (this._aspect !== prevAspect) {\n this.updateMatrix();\n }\n }\n /**\r\n * Change camera's rotation with euler values.\r\n * @ko 카메라 회전을 오일러 각 방향으로 변경합니다.\r\n * @param rotation - Rotation values {@ko 회전 값}\r\n * @param rotation.yaw - yaw(y-axis rotation) to look at {@ko 바라볼 yaw(y축 회전) 값}\r\n * @param rotation.pitch - pitch(x-axis rotation) to look at {@ko 바라볼 pitch(x축 회전) 값}\r\n * @param rotation.zoom - zoom value to apply {@ko 적용할 카메라 줌 값}\r\n * @since 4.0.0\r\n */\n lookAt({\n yaw = this.yaw,\n pitch = this.pitch,\n zoom = this.zoom\n }) {\n const prevQuaternion = quat.clone(this.quaternion);\n const prevZoom = this.zoom;\n this.yaw = circulate(yaw, 0, 360);\n this.pitch = clamp(pitch, -90, 90);\n this.zoom = zoom;\n this._updateQuaternion();\n const zoomDiff = Math.abs(zoom - prevZoom);\n if (!quat.equals(this.quaternion, prevQuaternion) || zoomDiff >= EPSILON * 10 // ignore small changes\n ) {\n this.updateMatrix();\n }\n }\n /**\r\n * Change camera's rotation with quaternion.\r\n * @ko 카메라 회전을 Quaternion을 이용해서 변경합니다.\r\n * @param rotation - Quaternion to apply {@ko 적용할 Quaternion}\r\n * @param zoom - zoom value to apply {@ko 적용할 카메라 줌 값}\r\n * @since 4.0.0\r\n */\n rotate(rotation, zoom = this.zoom) {\n const normalized = quat.normalize(quat.create(), rotation);\n const isSameRotation = quat.equals(this.quaternion, normalized);\n quat.copy(this.quaternion, normalized);\n const prevZoom = this.zoom;\n const {\n yaw,\n pitch\n } = quatToEuler(normalized);\n this.yaw = yaw;\n this.pitch = pitch;\n this.zoom = zoom;\n const zoomDiff = Math.abs(zoom - prevZoom);\n if (!isSameRotation || zoomDiff >= EPSILON * 10) {\n this.updateMatrix();\n }\n }\n /**\r\n * Change camera's rotation to given euler values by the given duration.\r\n * @ko 카메라를 주어진 방향으로 주어진 시간동안 서서히 이동시킵니다.\r\n * @param options - Animation parameters {@ko 애니메이션 패러미터}\r\n * @param options.yaw - yaw(y-axis rotation) to look at {@ko 바라볼 yaw(y축 회전) 값}\r\n * @param options.pitch - pitch(x-axis rotation) to look at {@ko 바라볼 pitch(x축 회전) 값}\r\n * @param options.zoom - zoom value to apply {@ko 적용할 카메라 줌 값}\r\n * @param options.duration - Duration of the animation {@ko 애니메이션 시간}\r\n * @param options.easing - Easing function for the animation {@ko 애니메이션에 적용할 easing function}\r\n */\n animateTo({\n yaw = this.yaw,\n pitch = this.pitch,\n zoom = this.zoom,\n duration = 0,\n easing = DEFAULT_EASING\n } = {}) {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.yaw === yaw && this.pitch === pitch && this.zoom === zoom) return;\n const from = {\n rotation: quat.clone(this.quaternion),\n zoom: this.zoom\n };\n const to = {\n rotation: eulerToQuat(quat.create(), yaw, pitch, this.rollOffset),\n zoom\n };\n const animation = new CameraAnimation(this, from, to, {\n duration,\n easing\n });\n const finishPromise = animation.getFinishPromise();\n this.animation = animation;\n finishPromise.then(() => {\n this.animation = null;\n this.trigger(CAMERA_EVENTS.ANIMATION_END, {\n animation\n });\n });\n return finishPromise;\n });\n }\n /**\r\n * @hidden\r\n */\n restrictYawRange(min, max) {\n this._yawRange = {\n min,\n max\n };\n }\n /**\r\n * @hidden\r\n */\n restrictPitchRange(min, max) {\n this._pitchRange = {\n min,\n max\n };\n }\n /**\r\n * @hidden\r\n */\n restrictZoomRange(min, max) {\n this._zoomRange = {\n min,\n max\n };\n }\n /**\r\n * @hidden\r\n */\n restrictRenderHeight(height) {\n this._maxRenderHeight = height;\n }\n /**\r\n * @hidden\r\n */\n resetRange() {\n this._yawRange = this._initialYawRange;\n this._pitchRange = this._initialPitchRange;\n this._zoomRange = this._initialZoomRange;\n this._maxRenderHeight = -1;\n }\n /**\r\n * Get actual yaw range by the given zoom value.\r\n * @ko 주어진 zoom 값에 대한 실제 yaw 범위값을 반환합니다.\r\n * @since 4.0.0\r\n */\n getYawRange(zoom) {\n const yawLimit = this._yawRange;\n const maxRenderHeight = this._maxRenderHeight;\n if (!yawLimit) return INFINITE_RANGE;\n const halfHFov = this.getHorizontalFov(zoom) * 0.5;\n let minYaw = yawLimit.min;\n let maxYaw = yawLimit.max;\n if (maxRenderHeight > 0) {\n const halfVFovRad = toVerticalFov(halfHFov * DEG_TO_RAD, this._aspect);\n const h = maxRenderHeight * 0.5;\n const t = Math.tan(halfVFovRad);\n const d = Math.sqrt((1 + h * h) / (1 + t * t));\n const theta = Math.atan(Math.tan(halfHFov * DEG_TO_RAD) * d) * RAD_TO_DEG;\n minYaw = yawLimit.min + theta;\n maxYaw = yawLimit.max - theta;\n }\n if (minYaw > maxYaw) {\n minYaw = 0;\n maxYaw = 0;\n }\n return {\n min: minYaw,\n max: maxYaw\n };\n }\n /**\r\n * Get actual pitch range by the given zoom value.\r\n * @ko 주어진 zoom 값에 대한 실제 pitch 범위값을 반환합니다.\r\n * @since 4.0.0\r\n */\n getPitchRange(zoom) {\n const pitchLimit = this._pitchRange;\n const maxRenderHeight = this._maxRenderHeight;\n if (!pitchLimit) return DEFAULT_PITCH_RANGE;\n let minPitch = pitchLimit.min;\n let maxPitch = pitchLimit.max;\n if (maxRenderHeight > 0) {\n const halfVFov = this.getVerticalFov(zoom) * 0.5;\n minPitch = pitchLimit.min + halfVFov;\n maxPitch = pitchLimit.max - halfVFov;\n }\n if (minPitch > maxPitch) {\n minPitch = 0;\n maxPitch = 0;\n }\n return {\n min: Math.max(minPitch, -90),\n max: Math.min(maxPitch, 90)\n };\n }\n /**\r\n * Get actual zoom range in fov degrees.\r\n * @ko 실제 줌 범위를 fov각의 범위로 반환합니다.\r\n * @since 4.0.0\r\n */\n getZoomRange() {\n var _a;\n const limit = (_a = this._zoomRange) !== null && _a !== void 0 ? _a : DEFAULT_ZOOM_RANGE;\n // max (zoom in) -> minimum fov\n const minFov = this.getHorizontalFov(limit.max);\n const maxFov = this.getHorizontalFov(limit.min);\n const currentFov = this.getHorizontalFov(this.zoom);\n return {\n min: Math.max(minFov, 1),\n max: Math.min(maxFov, 180),\n current: currentFov\n };\n }\n /**\r\n * Return horizontal fov value when the given zoom is applied. (in degrees, °)\r\n * @ko 주어진 zoom 값이 적용되었을 때의 수평 fov값을 반환합니다. (도 단위, °)\r\n * @returns Zoomed horizontal FOV {@ko 줌이 적용된 수평 fov값}\r\n * @since 4.0.0\r\n */\n getHorizontalFov(zoom = this.zoom) {\n return this._getZoomedHorizontalFov(zoom) * RAD_TO_DEG;\n }\n /**\r\n * Return vertical fov value when the given zoom is applied. (in degrees, °)\r\n * @ko 주어진 zoom 값이 적용되었을 때의 수직 fov값을 반환합니다. (도 단위, °)\r\n * @returns Zoomed vertical FOV {@ko 줌이 적용된 수직 fov값}\r\n * @since 4.0.0\r\n */\n getVerticalFov(zoom = this.zoom) {\n const aspect = this._aspect;\n const hFov = this._getZoomedHorizontalFov(zoom); // In radians\n const vFov = toVerticalFov(hFov, aspect);\n return vFov * RAD_TO_DEG;\n }\n /**\r\n * Calculate zoom value for the given fov.\r\n * @ko 주어진 fov값을 zoom값으로 변환합니다.\r\n * @param fov horizontal fov (in degrees, °) {@ko 수평 fov 값 (도 단위, °)}\r\n * @since 4.0.0\r\n */\n fovToZoom(fov) {\n const baseFov = this.fov;\n const renderingWidth = Math.tan(DEG_TO_RAD * baseFov * 0.5);\n const zoomedWidth = Math.tan(DEG_TO_RAD * fov * 0.5);\n return renderingWidth / zoomedWidth;\n }\n /**\r\n * Update inner matrixes.\r\n * @ko 내부 행렬들을 업데이트합니다.\r\n * @internal\r\n * @since 4.0.0\r\n */\n updateMatrix() {\n const up = this._up;\n const aspect = this._aspect;\n const viewMatrix = this.viewMatrix;\n const projMatrix = this.projectionMatrix;\n const position = this.position;\n const rotation = this.quaternion;\n const upDir = vec3.create();\n const viewDir = vec3.fromValues(0, 0, -1);\n vec3.transformQuat(viewDir, viewDir, rotation);\n vec3.transformQuat(upDir, up, rotation);\n const hFov = this._getZoomedHorizontalFov(); // In radians\n const vFov = toVerticalFov(hFov, aspect);\n mat4.lookAt(viewMatrix, position, viewDir, upDir);\n mat4.perspective(projMatrix, vFov, aspect, 0.1, 100);\n this._changed = true;\n }\n /**\r\n * @hidden\r\n */\n onFrameRender() {\n this._changed = false;\n }\n _updateQuaternion() {\n eulerToQuat(this.quaternion, this.yaw, this.pitch, this.rollOffset);\n }\n /**\r\n * @param zoom Current zoom value\r\n * @returns horizontal fov including zoom, in radian\r\n */\n _getZoomedHorizontalFov(zoom = this.zoom) {\n return 2 * Math.atan(Math.tan(DEG_TO_RAD * this.fov * 0.5) / zoom);\n }\n}\n\n/*\r\n * Copyright (c) 2023-present NAVER Corp.\r\n * egjs projects are licensed under the MIT license\r\n */\nclass MouseInput extends Component {\n constructor() {\n super();\n this._onMouseDown = evt => {\n const el = this._el;\n if (!el || evt.button !== MOUSE_BUTTON.LEFT) return;\n evt.preventDefault();\n if (el.focus) {\n el.focus();\n } else {\n window.focus();\n }\n this._prevPos[0] = evt.clientX;\n this._prevPos[1] = evt.clientY;\n window.addEventListener(EVENTS$1.MOUSE_MOVE, this._onMouseMove, false);\n window.addEventListener(EVENTS$1.MOUSE_UP, this._onMouseUp, false);\n this.trigger(CONTROL_EVENTS.INPUT_START, {\n srcEvent: evt,\n isTouch: false,\n isKeyboard: false\n });\n };\n this._onMouseMove = evt => {\n evt.preventDefault();\n const x = evt.clientX;\n const y = evt.clientY;\n const prevPos = this._prevPos;\n const deltaX = x - prevPos[0];\n const deltaY = y - prevPos[1];\n this.trigger(CONTROL_EVENTS.CHANGE, {\n delta: {\n x: deltaX,\n y: deltaY\n },\n isTouch: false,\n isKeyboard: false\n });\n prevPos[0] = x;\n prevPos[1] = y;\n };\n this._onMouseUp = () => {\n this._prevPos[0] = 0;\n this._prevPos[1] = 0;\n window.removeEventListener(EVENTS$1.MOUSE_MOVE, this._onMouseMove, false);\n window.removeEventListener(EVENTS$1.MOUSE_UP, this._onMouseUp, false);\n this.trigger(CONTROL_EVENTS.INPUT_END, {\n isTouch: false,\n isKeyboard: false,\n scrolling: false\n });\n };\n this._el = null;\n this._prevPos = [0, 0];\n }\n enable(element) {\n if (this._el) return;\n element.addEventListener(EVENTS$1.MOUSE_DOWN, this._onMouseDown);\n this._el = element;\n }\n disable() {\n const element = this._el;\n if (!element) return;\n element.removeEventListener(EVENTS$1.MOUSE_DOWN, this._onMouseDown);\n window.removeEventListener(EVENTS$1.MOUSE_MOVE, this._onMouseMove, false);\n window.removeEventListener(EVENTS$1.MOUSE_UP, this._onMouseUp, false);\n this._el = null;\n }\n}\n\n/*\r\n * Copyright (c) 2023-present NAVER Corp.\r\n * egjs projects are licensed under the MIT license\r\n */\nclass TouchInput extends Component {\n get scrollable() {\n return this._scrollable;\n }\n set scrollable(val) {\n this._scrollable = val;\n }\n constructor() {\n super();\n this._onTouchStart = evt => {\n if (evt.touches.length > 1 || this._scrolling) return;\n const touch = evt.touches[0];\n this._isFirstTouch = true;\n this._prevPos[0] = touch.clientX;\n this._prevPos[1] = touch.clientY;\n this.trigger(CONTROL_EVENTS.INPUT_START, {\n srcEvent: evt,\n isTouch: true,\n isKeyboard: false\n });\n };\n this._onTouchMove = evt => {\n // Only the one finger motion should be considered\n if (evt.touches.length > 1 || this._scrolling) return;\n const touch = evt.touches[0];\n const scrollable = this._scrollable;\n const prevPos = this._prevPos;\n const x = touch.clientX;\n const y = touch.clientY;\n const deltaX = x - prevPos[0];\n const deltaY = y - prevPos[1];\n if (this._isFirstTouch) {\n if (scrollable && !isFullscreen()) {\n if (Math.abs(deltaY) > Math.abs(deltaX)) {\n // Assume Scrolling\n this._scrolling = true;\n return;\n }\n }\n this._isFirstTouch = false;\n }\n if (evt.cancelable !== false) {\n evt.preventDefault();\n }\n this.trigger(CONTROL_EVENTS.CHANGE, {\n delta: {\n x: deltaX,\n y: deltaY\n },\n isTouch: true,\n isKeyboard: false\n });\n prevPos[0] = x;\n prevPos[1] = y;\n };\n this._onTouchEnd = evt => {\n if (evt.touches.length !== 0) return;\n const touch = evt.touches[0];\n const prevPos = this._prevPos;\n if (touch) {\n prevPos[0] = touch.clientX;\n prevPos[1] = touch.clientY;\n } else {\n prevPos[0] = 0;\n prevPos[1] = 0;\n this.trigger(CONTROL_EVENTS.INPUT_END, {\n isTouch: true,\n isKeyboard: false,\n scrolling: this._scrolling\n });\n }\n if (evt.cancelable !== false) {\n evt.preventDefault();\n }\n this._scrolling = false;\n };\n this._el = null;\n this._prevPos = [0, 0];\n this._isFirstTouch = false;\n this._scrolling = false;\n this._scrollable = false;\n }\n enable(element) {\n if (this._el) return;\n element.addEventListener(EVENTS$1.TOUCH_START, this._onTouchStart, {\n passive: false\n });\n element.addEventListener(EVENTS$1.TOUCH_MOVE, this._onTouchMove, {\n passive: false\n });\n element.addEventListener(EVENTS$1.TOUCH_END, this._onTouchEnd);\n this._el = element;\n }\n disable() {\n const element = this._el;\n if (!element) return;\n element.removeEventListener(EVENTS$1.TOUCH_START, this._onTouchStart);\n element.removeEventListener(EVENTS$1.TOUCH_MOVE, this._onTouchMove);\n element.removeEventListener(EVENTS$1.TOUCH_END, this._onTouchEnd);\n this._el = null;\n }\n}\n\n/*\r\n * Copyright (c) 2023-present NAVER Corp.\r\n * egjs projects are licensed under the MIT license\r\n */\nclass KeyboardInput extends Component {\n get active() {\n const pressed = this._pressed;\n return pressed.LEFT || pressed.UP || pressed.RIGHT || pressed.DOWN;\n }\n constructor() {\n super();\n this._onKeyDown = evt => {\n // Ignore all other keypress except main arrow keys\n if (evt.location !== KeyboardEvent.DOM_KEY_LOCATION_STANDARD) return;\n this._updateKeyPress(evt, true);\n const pressedCount = this._getPressedKeyCount();\n if (pressedCount <= 0) return;\n evt.preventDefault();\n if (pressedCount === 1 && !evt.repeat) {\n // On first keydown\n this.trigger(CONTROL_EVENTS.INPUT_START, {\n srcEvent: evt,\n isTouch: false,\n isKeyboard: true\n });\n }\n };\n this._onKeyUp = evt => {\n // Ignore all other keypress except main arrow keys\n if (evt.location !== KeyboardEvent.DOM_KEY_LOCATION_STANDARD) return;\n this._updateKeyPress(evt, false);\n const pressedCount = this._getPressedKeyCount();\n if (pressedCount > 0) return;\n this.trigger(CONTROL_EVENTS.INPUT_END, {\n isTouch: false,\n isKeyboard: true,\n scrolling: false\n });\n };\n this._el = null;\n this._clearPressedKeys();\n }\n enable(element) {\n if (this._el) return;\n element.addEventListener(EVENTS$1.KEY_DOWN, this._onKeyDown);\n element.addEventListener(EVENTS$1.KEY_UP, this._onKeyUp);\n this._el = element;\n this._clearPressedKeys();\n }\n disable() {\n const element = this._el;\n if (!element) return;\n element.removeEventListener(EVENTS$1.KEY_DOWN, this._onKeyDown);\n element.removeEventListener(EVENTS$1.KEY_UP, this._onKeyUp);\n this._el = null;\n this._clearPressedKeys();\n }\n update() {\n const delta = this._getDeltaByPressedKeys();\n if (delta.x !== 0 || delta.y !== 0) {\n this.trigger(CONTROL_EVENTS.CHANGE, {\n delta,\n isTouch: false,\n isKeyboard: true\n });\n }\n }\n _clearPressedKeys() {\n this._pressed = KEY_DIRECTION.reduce((obj, keyName) => {\n return Object.assign(Object.assign({}, obj), {\n [keyName]: false\n });\n }, {});\n }\n _updateKeyPress(event, isEnable) {\n const pressed = this._pressed;\n const keyToUpdate = event.keyCode != null ? DIRECTION_KEY_CODE[event.keyCode] : DIRECTION_KEY_NAME[event.key];\n if (!keyToUpdate) return;\n pressed[keyToUpdate] = isEnable;\n }\n _getPressedKeyCount() {\n return KEY_DIRECTION.filter(key => this._pressed[key]).length;\n }\n _getDeltaByPressedKeys() {\n const pressed = this._pressed;\n let x = 0;\n let y = 0;\n if (pressed.LEFT) {\n x += 1;\n }\n if (pressed.RIGHT) {\n x -= 1;\n }\n if (pressed.UP) {\n y += 1;\n }\n if (pressed.DOWN) {\n y -= 1;\n }\n return {\n x,\n y\n };\n }\n}\n\n/*\r\n * Copyright (c) 2023-present NAVER Corp.\r\n * egjs projects are licensed under the MIT license\r\n */\n/**\r\n * Camera's rotation control\r\n * @ko 카메라의 회전을 담당하는 컨트롤\r\n * @since 4.0.0\r\n */\nclass RotateControl extends Component {\n /**\r\n * @copy CameraControl#enabled\r\n */\n get enabled() {\n return this._enabled;\n }\n /**\r\n * @hidden\r\n */\n get enableBlocked() {\n return this._enableBlocked;\n }\n /**\r\n * @copy CameraControl#animating\r\n */\n get animating() {\n return this._keyboardInput.active || this._xMotion.activated || this._yMotion.activated;\n }\n /**\r\n * Current yaw value\r\n * @ko 현재 yaw 값\r\n * @readonly\r\n * @since 4.0.0\r\n */\n get yaw() {\n return this._xMotion;\n }\n /**\r\n * Current pitch value\r\n * @ko 현재 pitch 값\r\n * @readonly\r\n * @since 4.0.0\r\n */\n get pitch() {\n return this._yMotion;\n }\n /**\r\n * @copy View360#scrollable\r\n */\n get scrollable() {\n return this._touchInput.scrollable;\n }\n set scrollable(val) {\n this._touchInput.scrollable = val;\n }\n /**\r\n * Scale factor for mouse/touch rotation\r\n * @ko 마우스/터치를 통한 회전 배율\r\n * @default [1, 1]\r\n * @since 4.0.0\r\n */\n get pointerScale() {\n return this._pointerScale;\n }\n set pointerScale(val) {\n this._pointerScale = val;\n }\n /**\r\n * Scale factor for keyboard rotation\r\n * @ko 키보드를 통한 회전 배율\r\n * @default [1, 1]\r\n * @since 4.0.0\r\n */\n get keyboardScale() {\n return this._keyboardScale;\n }\n set keyboardScale(val) {\n this._keyboardScale = val;\n }\n /**\r\n * Duration of the input animation (ms)\r\n * @ko 회전 애니메이션의 시간 (ms)\r\n * @default 300\r\n */\n get duration() {\n return this._duration;\n }\n set duration(val) {\n this._duration = val;\n this._xMotion.duration = val;\n this._yMotion.duration = val;\n }\n /**\r\n * Easing function of the animation\r\n * @ko 회전 애니메이션에 적용할 easing 함수\r\n * @default EASING.EASE_OUT_CUBIC\r\n * @see EASING\r\n */\n get easing() {\n return this._easing;\n }\n set easing(val) {\n this._easing = val;\n this._xMotion.easing = val;\n this._yMotion.easing = val;\n }\n /**\r\n * Disable X-axis(pitch) rotation.\r\n * @ko x축 회전(pitch)을 비활성화합니다.\r\n * @default false\r\n */\n get disablePitch() {\n return this._disablePitch;\n }\n set disablePitch(val) {\n this._disablePitch = val;\n }\n /**\r\n * Disable Y-axis(yaw) rotation.\r\n * @ko y축 회전(yaw)을 비활성화합니다.\r\n * @default false\r\n */\n get disableYaw() {\n return this._disableYaw;\n }\n set disableYaw(val) {\n this._disableYaw = val;\n }\n /**\r\n * Disable rotation by keyboard.\r\n * @ko 키보드를 이용한 회전을 비활성화합니다.\r\n * @default false\r\n */\n get disableKeyboard() {\n return this._disableKeyboard;\n }\n set disableKeyboard(val) {\n this._disableKeyboard = val;\n }\n /**\r\n * Create new RotateControl instance\r\n * @ko RotateControl의 인스턴스를 생성합니다.\r\n * @param controlEl - Element to attach handlers {@ko 입력을 받을 엘리먼트}\r\n * @param enableBlocked - Whether to disable control on init {@ko 초기화 과정에서 컨트롤 활성화 여부}\r\n * @param options - Options for control {@ko 컨트롤 옵션들}\r\n */\n constructor(controlEl, enableBlocked, {\n duration = DEFAULT_ANIMATION_DURATION,\n easing = DEFAULT_EASING,\n pointerScale = [1, 1],\n keyboardScale = [1, 1],\n disablePitch = false,\n disableYaw = false,\n disableKeyboard = false\n } = {}) {\n super();\n this._onInputStart = evt => {\n this._changedWhileDragging = false;\n this.trigger(CONTROL_EVENTS.INPUT_START, Object.assign(Object.assign({}, evt), {\n inputType: \"rotate\"\n }));\n };\n this._onChange = evt => {\n const delta = evt.delta;\n const invZoomScale = 1 / this._zoomScale; // Reduce speed on zoom\n const screenScale = this._screenScale;\n const keyboardScale = this._keyboardScale;\n const pointerScale = this._pointerScale;\n let scale;\n if (evt.isKeyboard) {\n scale = [keyboardScale[0] * invZoomScale, keyboardScale[1] * invZoomScale];\n } else {\n scale = [pointerScale[0] * screenScale[0] * invZoomScale, pointerScale[1] * screenScale[1] * invZoomScale];\n }\n const scaledX = delta.x * scale[0];\n const scaledY = delta.y * scale[1];\n this._xMotion.setNewEndByDelta(scaledX);\n this._yMotion.setNewEndByDelta(scaledY);\n this._changedWhileDragging = true;\n };\n this._onInputEnd = evt => {\n this.trigger(CONTROL_EVENTS.INPUT_END, Object.assign(Object.assign({}, evt), {\n inputType: \"rotate\"\n }));\n if (!this._changedWhileDragging && !evt.isKeyboard && !evt.scrolling) {\n this.trigger(CONTROL_EVENTS.STATIC_CLICK, {\n isTouch: evt.isTouch\n });\n }\n this._changedWhileDragging = false;\n };\n this._controlEl = controlEl;\n this._pointerScale = pointerScale;\n this._keyboardScale = keyboardScale;\n this._duration = duration;\n this._easing = easing;\n this._disablePitch = disablePitch;\n this._disableYaw = disableYaw;\n this._disableKeyboard = disableKeyboard;\n this._enableBlocked = enableBlocked;\n this._mouseInput = new MouseInput();\n this._touchInput = new TouchInput();\n this._keyboardInput = new KeyboardInput();\n this._xMotion = new Motion({\n duration,\n range: INFINITE_RANGE,\n easing\n });\n this._yMotion = new Motion({\n duration,\n range: DEFAULT_PITCH_RANGE,\n easing\n });\n this._screenScale = [1, 1];\n this._zoomScale = 1;\n this._enabled = false;\n this._changedWhileDragging = false;\n this._bindInputs();\n }\n destroy() {\n this.disable();\n this._mouseInput.off();\n this._touchInput.off();\n this._keyboardInput.off();\n this.off();\n this._changedWhileDragging = false;\n }\n /**\r\n * @hidden\r\n */\n update(delta) {\n if (!this._enabled) return;\n const xMotion = this._xMotion;\n const yMotion = this._yMotion;\n const keyboardInput = this._keyboardInput;\n if (!this._disableKeyboard) {\n keyboardInput.update();\n }\n if (!this._disablePitch) {\n yMotion.update(delta);\n }\n if (!this._disableYaw) {\n xMotion.update(delta);\n }\n }\n /**\r\n * @hidden\r\n */\n updateRange(camera, zoom) {\n const yawRange = camera.getYawRange(zoom);\n const pitchRange = camera.getPitchRange(zoom);\n this._xMotion.setRange(yawRange.min, yawRange.max);\n this._yMotion.setRange(pitchRange.min, pitchRange.max);\n }\n /**\r\n * @hidden\r\n */\n setZoomScale(val) {\n this._zoomScale = val;\n }\n /**\r\n * Resize control to match target size.\r\n * @ko 컨트롤의 내부 크기를 갱신합니다.\r\n * @param hfov - Camera horizontal fov in degrees {@ko 카메라의 수평방향 fov값 (도 단위)}\r\n * @param aspect - Camera aspect {@ko 카메라 가로/세로 비율}\r\n * @param width - New width {@ko 갱신된 너비}\r\n * @param height - New height {@ko 갱신된 높이}\r\n */\n resize(hfov, aspect, width, height) {\n const vfov = toVerticalFov(hfov * DEG_TO_RAD, aspect) * RAD_TO_DEG;\n this._screenScale[0] = hfov / width;\n this._screenScale[1] = vfov / height;\n }\n enable() {\n if (this._enabled) return;\n const element = this._controlEl;\n this._mouseInput.enable(element);\n this._touchInput.enable(element);\n this._keyboardInput.enable(element);\n this._enabled = true;\n this._enableBlocked = false;\n this.trigger(CONTROL_EVENTS.ENABLE, {\n control: this,\n updateCursor: true\n });\n }\n disable() {\n if (!this._enabled) return;\n this._mouseInput.disable();\n this._touchInput.disable();\n this._keyboardInput.disable();\n this._enabled = false;\n this.trigger(CONTROL_EVENTS.DISABLE, {\n updateCursor: true\n });\n }\n sync(camera) {\n this.updateRange(camera, camera.zoom);\n this._xMotion.reset(camera.yaw);\n this._yMotion.reset(camera.pitch);\n }\n _bindInputs() {\n const mouseInput = this._mouseInput;\n const touchInput = this._touchInput;\n const keyboardInput = this._keyboardInput;\n mouseInput.on(CONTROL_EVENTS.INPUT_START, this._onInputStart);\n mouseInput.on(CONTROL_EVENTS.CHANGE, this._onChange);\n mouseInput.on(CONTROL_EVENTS.INPUT_END, this._onInputEnd);\n touchInput.on(CONTROL_EVENTS.INPUT_START, this._onInputStart);\n touchInput.on(CONTROL_EVENTS.CHANGE, this._onChange);\n touchInput.on(CONTROL_EVENTS.INPUT_END, this._onInputEnd);\n keyboardInput.on(CONTROL_EVENTS.INPUT_START, this._onInputStart);\n keyboardInput.on(CONTROL_EVENTS.CHANGE, this._onChange);\n keyboardInput.on(CONTROL_EVENTS.INPUT_END, this._onInputEnd);\n }\n}\n\n/*\r\n * Copyright (c) 2023-present NAVER Corp.\r\n * egjs projects are licensed under the MIT license\r\n */\nclass WheelInput extends Component {\n get scrollable() {\n return this._scrollable;\n }\n set scrollable(val) {\n this._scrollable = val;\n }\n constructor() {\n super();\n this._onWheel = evt => {\n const scrollable = this._scrollable;\n if (evt.deltaY === 0 || scrollable) return;\n evt.preventDefault();\n evt.stopPropagation();\n if (this._inputTimer < 0) {\n this.trigger(CONTROL_EVENTS.INPUT_START, {\n srcEvent: evt,\n isTouch: false,\n isKeyboard: false\n });\n } else {\n this._clearTimer();\n }\n const delta = this._baseScale * evt.deltaY;\n this.trigger(CONTROL_EVENTS.CHANGE, {\n delta,\n isTouch: false,\n isKeyboard: false\n });\n this._inputTimer = window.setTimeout(() => {\n this.trigger(CONTROL_EVENTS.INPUT_END, {\n isTouch: false,\n isKeyboard: false,\n scrolling: false\n });\n this._inputTimer = -1;\n }, DEFAULT_ANIMATION_DURATION);\n };\n this._el = null;\n this._baseScale = 0.04;\n this._scrollable = false;\n this._inputTimer = -1;\n }\n enable(element) {\n if (this._el) return;\n element.addEventListener(EVENTS$1.WHEEL, this._onWheel, {\n passive: false,\n capture: false\n });\n this._el = element;\n this._clearTimer();\n }\n disable() {\n const element = this._el;\n if (!element) return;\n element.removeEventListener(EVENTS$1.WHEEL, this._onWheel, false);\n this._el = null;\n this._clearTimer();\n }\n _clearTimer() {\n window.clearTimeout(this._inputTimer);\n this._inputTimer = -1;\n }\n}\n\n/*\r\n * Copyright (c) 2023-present NAVER Corp.\r\n * egjs projects are licensed under the MIT license\r\n */\nclass PinchInput extends Component {\n constructor() {\n super();\n this._onTouchMove = evt => {\n const touches = evt.touches;\n if (touches.length !== 2) return;\n if (!evt.cancelable) return;\n evt.preventDefault();\n evt.stopPropagation();\n const prevDistance = this._prevDistance;\n const diff = [touches[0].pageX - touches[1].pageX, touches[0].pageY - touches[1].pageY];\n const distance = Math.sqrt(diff[0] * diff[0] + diff[1] * diff[1]) * this._baseScale;\n const delta = this._isFirstTouch ? 0 : distance - prevDistance;\n if (this._isFirstTouch) {\n this.trigger(CONTROL_EVENTS.INPUT_START, {\n srcEvent: evt,\n isTouch: true,\n isKeyboard: false\n });\n }\n this._prevDistance = distance;\n this._isFirstTouch = false;\n this.trigger(CONTROL_EVENTS.CHANGE, {\n delta,\n isTouch: true,\n isKeyboard: false\n });\n };\n this._onTouchEnd = evt => {\n if (evt.touches.length !== 0) return;\n if (!this._isFirstTouch) {\n this.trigger(CONTROL_EVENTS.INPUT_END, {\n isTouch: true,\n isKeyboard: false,\n scrolling: false\n });\n }\n this._prevDistance = -1;\n this._isFirstTouch = true;\n };\n this._el = null;\n this._baseScale = -0.2;\n this._prevDistance = -1;\n this._isFirstTouch = true;\n }\n enable(element) {\n if (this._el) return;\n element.addEventListener(EVENTS$1.TOUCH_MOVE, this._onTouchMove, {\n passive: false,\n capture: false\n });\n element.addEventListener(EVENTS$1.TOUCH_END, this._onTouchEnd);\n this._el = element;\n this._prevDistance = -1;\n this._isFirstTouch = true;\n }\n disable() {\n const element = this._el;\n if (!element) return;\n element.removeEventListener(EVENTS$1.TOUCH_MOVE, this._onTouchMove, false);\n element.removeEventListener(EVENTS$1.TOUCH_END, this._onTouchEnd);\n this._el = null;\n }\n}\n\n/*\r\n* Copyright (c) 2023-present NAVER Corp.\r\n* egjs projects are licensed under the MIT license\r\n*/\n/**\r\n * Camera's zoom control\r\n * @ko 카메라의 줌 값을 담당하는 컨트롤\r\n * @since 4.0.0\r\n */\nclass ZoomControl extends Component {\n /**\r\n * @copy CameraControl#enabled\r\n */\n get enabled() {\n return this._enabled;\n }\n /**\r\n * @hidden\r\n */\n get enableBlocked() {\n return this._enableBlocked;\n }\n /**\r\n * @copy CameraControl#animating\r\n */\n get animating() {\n return this._motion.activated;\n }\n /**\r\n * Current zoom value\r\n * @ko 현재 줌 값\r\n * @since 4.0.0\r\n * @readonly\r\n */\n get zoom() {\n return this._motion.val;\n }\n /**\r\n * @copy View360#wheelScrollable\r\n */\n get scrollable() {\n return this._wheelInput.scrollable;\n }\n set scrollable(val) {\n this._wheelInput.scrollable = val;\n }\n /**\r\n * @hidden\r\n */\n get range() {\n return this._motion.range;\n }\n /**\r\n * Scale factor of the zoom\r\n * @ko 입력에 의한 줌 배율\r\n * @default 1\r\n * @since 4.0.0\r\n */\n get scale() {\n return this._scale;\n }\n set scale(val) {\n this._scale = val;\n }\n /**\r\n * Duration of the input animation (ms)\r\n * @ko 회전 애니메이션의 시간 (ms)\r\n * @default 300\r\n * @since 4.0.0\r\n */\n get duration() {\n return this._motion.duration;\n }\n /**\r\n * Easing function of the animation\r\n * @ko 회전 애니메이션에 적용할 easing 함수\r\n * @default EASING.EASE_OUT_CUBIC\r\n * @see EASING\r\n * @since 4.0.0\r\n */\n get easing() {\n return this._motion.easing;\n }\n /**\r\n * Create new ZoomControl instance\r\n * @ko ZoomControl의 인스턴스를 생성합니다.\r\n * @param controlEl - Element to attach handlers {@ko 입력을 받을 엘리먼트}\r\n * @param enableBlocked - Whether to disable control on init {@ko 초기화 과정에서 컨트롤 활성화 여부}\r\n * @param options - Options for control {@ko 컨트롤 옵션들}\r\n */\n constructor(controlEl, enableBlocked, {\n scale = 1,\n duration = DEFAULT_ANIMATION_DURATION,\n easing = DEFAULT_EASING\n } = {}) {\n super();\n this._onInputStart = evt => {\n this.trigger(CONTROL_EVENTS.INPUT_START, Object.assign(Object.assign({}, evt), {\n inputType: \"zoom\"\n }));\n };\n this._onChange = ({\n delta\n }) => {\n const scale = this._scale;\n const scaledDelta = delta * scale;\n this._motion.setNewEndByDelta(scaledDelta);\n };\n this._onInputEnd = evt => {\n this.trigger(CONTROL_EVENTS.INPUT_END, Object.assign(Object.assign({}, evt), {\n inputType: \"zoom\"\n }));\n };\n this._scale = scale;\n this._controlEl = controlEl;\n this._enableBlocked = enableBlocked;\n this._wheelInput = new WheelInput();\n this._pinchInput = new PinchInput();\n this._motion = new Motion({\n duration,\n easing,\n range: INFINITE_RANGE\n });\n this._enabled = false;\n this._bindInputs();\n }\n destroy() {\n this.disable();\n this._wheelInput.off();\n this._pinchInput.off();\n this.off();\n }\n /**\r\n * @hidden\r\n */\n update(delta) {\n if (!this._enabled) return;\n const motion = this._motion;\n motion.update(delta);\n }\n enable() {\n if (this._enabled) return;\n const element = this._controlEl;\n this._wheelInput.enable(element);\n this._pinchInput.enable(element);\n this._enabled = true;\n this._enableBlocked = false;\n this.trigger(CONTROL_EVENTS.ENABLE, {\n control: this,\n updateCursor: false\n });\n }\n disable() {\n if (!this._enabled) return;\n this._wheelInput.disable();\n this._pinchInput.disable();\n this._enabled = false;\n this.trigger(CONTROL_EVENTS.DISABLE, {\n updateCursor: false\n });\n }\n sync(camera) {\n const motion = this._motion;\n const range = camera.getZoomRange();\n motion.setRange(range.min, range.max);\n motion.reset(range.current);\n }\n _bindInputs() {\n const wheelInput = this._wheelInput;\n const pinchInput = this._pinchInput;\n wheelInput.on(CONTROL_EVENTS.INPUT_START, this._onInputStart);\n wheelInput.on(CONTROL_EVENTS.CHANGE, this._onChange);\n wheelInput.on(CONTROL_EVENTS.INPUT_END, this._onInputEnd);\n pinchInput.on(CONTROL_EVENTS.INPUT_START, this._onInputStart);\n pinchInput.on(CONTROL_EVENTS.CHANGE, this._onChange);\n pinchInput.on(CONTROL_EVENTS.INPUT_END, this._onInputEnd);\n }\n}\n\n/*\r\n * Copyright (c) 2023-present NAVER Corp.\r\n * egjs projects are licensed under the MIT license\r\n */\nconst ROTATE_CONSTANT = {\n PITCH_DELTA: 1,\n YAW_DELTA_BY_ROLL: 2,\n YAW_DELTA_BY_YAW: 3\n};\nROTATE_CONSTANT[ROTATE_CONSTANT.PITCH_DELTA] = {\n targetAxis: [0, 1, 0],\n meshPoint: [0, 0, 1]\n};\nROTATE_CONSTANT[ROTATE_CONSTANT.YAW_DELTA_BY_ROLL] = {\n targetAxis: [0, 1, 0],\n meshPoint: [1, 0, 0]\n};\nROTATE_CONSTANT[ROTATE_CONSTANT.YAW_DELTA_BY_YAW] = {\n targetAxis: [1, 0, 0],\n meshPoint: [0, 0, 1]\n};\nclass GyroInput extends Component {\n get enabled() {\n return this._enabled;\n }\n get orientationUpdated() {\n return this._orientationUpdated;\n }\n get ignoreRoll() {\n return this._ignoreRoll;\n }\n set ignoreRoll(val) {\n this._ignoreRoll = val;\n }\n constructor() {\n super();\n this._onDeviceOrientation = evt => {\n const prevOrientation = this._orientation;\n const {\n alpha,\n beta,\n gamma\n } = evt;\n if (alpha == null || beta == null || gamma == null) return;\n prevOrientation.alpha = alpha;\n prevOrientation.beta = beta;\n prevOrientation.gamma = gamma;\n this._orientationUpdated = true;\n if (this._needsCalibrate) {\n this._needsCalibrate = false;\n this._calibrateSensor();\n }\n };\n this._updateScreenOrientation = () => {\n if (window.screen && window.screen.orientation && window.screen.orientation.angle !== undefined) {\n this._screenOrientation = screen.orientation.angle;\n } else if (window.orientation !== undefined) {\n this._screenOrientation = window.orientation >= 0 ? window.orientation : 360 + window.orientation;\n } else {\n this._screenOrientation = 0;\n }\n };\n this.quaternion = quat.create();\n this._orientation = {\n alpha: 0,\n beta: 90,\n gamma: 0\n };\n this._yawOrigin = 0;\n this._yawOffset = 0;\n this._orientationUpdated = false;\n this._screenOrientation = 0;\n this._needsCalibrate = true;\n this._enabled = false;\n }\n enable() {\n if (this._enabled) return;\n window.addEventListener(EVENTS$1.DEVICE_ORIENTATION, this._onDeviceOrientation);\n window.addEventListener(EVENTS$1.ORIENTATION_CHANGE, this._updateScreenOrientation);\n this._updateScreenOrientation();\n this._orientationUpdated = false;\n this._needsCalibrate = true;\n this._enabled = true;\n }\n disable() {\n if (!this._enabled) return;\n window.removeEventListener(EVENTS$1.DEVICE_ORIENTATION, this._onDeviceOrientation);\n window.removeEventListener(EVENTS$1.ORIENTATION_CHANGE, this._updateScreenOrientation);\n this._enabled = false;\n }\n update() {\n this._updateRotation();\n this._orientationUpdated = false;\n }\n collectDelta() {\n if (!this._orientationUpdated) {\n return {\n pitch: 0,\n yaw: 0\n };\n }\n const prevRotation = quat.clone(this.quaternion);\n this._updateRotation();\n this._orientationUpdated = false;\n return this._toEulerDelta(prevRotation, this.quaternion);\n }\n setInitialRotation(yaw) {\n this._yawOrigin = yaw;\n }\n _calibrateSensor() {\n const yawOrigin = this._yawOrigin;\n const rotation = this.quaternion;\n this._yawOffset = 0;\n this._updateRotation();\n const {\n yaw: sensorYaw\n } = quatToEuler(rotation);\n this._yawOffset = sensorYaw - yawOrigin;\n this._updateRotation();\n this._needsCalibrate = false;\n }\n _updateRotation() {\n const rotation = this.quaternion;\n const {\n alpha,\n beta,\n gamma\n } = this._orientation;\n quat.identity(rotation);\n quat.rotateY(rotation, rotation, (alpha - this._yawOffset) * DEG_TO_RAD);\n quat.rotateX(rotation, rotation, beta * DEG_TO_RAD);\n quat.rotateZ(rotation, rotation, -gamma * DEG_TO_RAD);\n const screen = quat.create();\n const screenAngle = -this._screenOrientation * 0.5 * DEG_TO_RAD;\n const world = quat.fromValues(-Math.sqrt(0.5), 0, 0, Math.sqrt(0.5));\n quat.set(screen, 0, Math.sin(screenAngle), 0, Math.cos(screenAngle));\n quat.multiply(rotation, rotation, screen);\n quat.multiply(rotation, rotation, world);\n quat.normalize(rotation, rotation);\n }\n _toEulerDelta(prevQuat, currentQuat) {\n return {\n yaw: this._getDeltaYaw(prevQuat, currentQuat),\n pitch: this._getDeltaPitch(prevQuat, currentQuat)\n };\n }\n _getDeltaYaw(prvQ, curQ) {\n const yawDeltaByYaw = this._getRotationDelta(prvQ, curQ, ROTATE_CONSTANT.YAW_DELTA_BY_YAW);\n const yawDeltaByRoll = this._getRotationDelta(prvQ, curQ, ROTATE_CONSTANT.YAW_DELTA_BY_ROLL) * Math.sin(this._extractPitchFromQuat(curQ));\n return yawDeltaByRoll + yawDeltaByYaw;\n }\n _getDeltaPitch(prvQ, curQ) {\n return this._getRotationDelta(prvQ, curQ, ROTATE_CONSTANT.PITCH_DELTA);\n }\n _getRotationDelta(prevQ, curQ, rotateKind) {\n const targetAxis = vec3.fromValues(ROTATE_CONSTANT[rotateKind].targetAxis[0], ROTATE_CONSTANT[rotateKind].targetAxis[1], ROTATE_CONSTANT[rotateKind].targetAxis[2]);\n const meshPoint = ROTATE_CONSTANT[rotateKind].meshPoint;\n const prevQuaternion = quat.clone(prevQ);\n const curQuaternion = quat.clone(curQ);\n quat.normalize(prevQuaternion, prevQuaternion);\n quat.normalize(curQuaternion, curQuaternion);\n let prevPoint = vec3.fromValues(0, 0, 1);\n let curPoint = vec3.fromValues(0, 0, 1);\n vec3.transformQuat(prevPoint, prevPoint, prevQuaternion);\n vec3.transformQuat(curPoint, curPoint, curQuaternion);\n vec3.transformQuat(targetAxis, targetAxis, curQuaternion);\n const rotateDistance = vec3.dot(targetAxis, vec3.cross(vec3.create(), prevPoint, curPoint));\n const rotateDirection = rotateDistance > 0 ? 1 : -1;\n // when counter clock wise, use vec3.fromValues(0,1,0)\n // when clock wise, use vec3.fromValues(0,-1,0)\n // const meshPoint1 = vec3.fromValues(0, 0, 0);\n const meshPoint2 = vec3.fromValues(meshPoint[0], meshPoint[1], meshPoint[2]);\n let meshPoint3;\n if (rotateKind !== ROTATE_CONSTANT.YAW_DELTA_BY_YAW) {\n meshPoint3 = vec3.fromValues(0, rotateDirection, 0);\n } else {\n meshPoint3 = vec3.fromValues(rotateDirection, 0, 0);\n }\n vec3.transformQuat(meshPoint2, meshPoint2, curQuaternion);\n vec3.transformQuat(meshPoint3, meshPoint3, curQuaternion);\n const vecU = meshPoint2;\n const vecV = meshPoint3;\n const vecN = vec3.create();\n vec3.cross(vecN, vecU, vecV);\n vec3.normalize(vecN, vecN);\n const coefficientA = vecN[0];\n const coefficientB = vecN[1];\n const coefficientC = vecN[2];\n // a point on the plane\n curPoint = vec3.fromValues(meshPoint[0], meshPoint[1], meshPoint[2]);\n vec3.transformQuat(curPoint, curPoint, curQuaternion);\n // a point should project on the plane\n prevPoint = vec3.fromValues(meshPoint[0], meshPoint[1], meshPoint[2]);\n vec3.transformQuat(prevPoint, prevPoint, prevQuaternion);\n // distance between prevPoint and the plane\n let distance = Math.abs(prevPoint[0] * coefficientA + prevPoint[1] * coefficientB + prevPoint[2] * coefficientC);\n const projectedPrevPoint = vec3.create();\n vec3.subtract(projectedPrevPoint, prevPoint, vec3.scale(vec3.create(), vecN, distance));\n let trigonometricRatio = (projectedPrevPoint[0] * curPoint[0] + projectedPrevPoint[1] * curPoint[1] + projectedPrevPoint[2] * curPoint[2]) / (vec3.length(projectedPrevPoint) * vec3.length(curPoint));\n // defensive block\n if (trigonometricRatio > 1) {\n trigonometricRatio = 1;\n }\n const theta = Math.acos(trigonometricRatio);\n const crossVec = vec3.cross(vec3.create(), curPoint, projectedPrevPoint);\n distance = coefficientA * crossVec[0] + coefficientB * crossVec[1] + coefficientC * crossVec[2];\n let thetaDirection;\n if (rotateKind !== ROTATE_CONSTANT.YAW_DELTA_BY_YAW) {\n thetaDirection = distance > 0 ? 1 : -1;\n } else {\n thetaDirection = distance < 0 ? 1 : -1;\n }\n const deltaRadian = theta * thetaDirection * rotateDirection;\n return deltaRadian * RAD_TO_DEG;\n }\n _extractPitchFromQuat(quaternion) {\n const baseV = vec3.fromValues(0, 0, 1);\n vec3.transformQuat(baseV, baseV, quaternion);\n return -1 * Math.atan2(baseV[1], Math.sqrt(Math.pow(baseV[0], 2) + Math.pow(baseV[2], 2)));\n }\n}\n\n/**\r\n * Camera's rotation control by gyroscope\r\n * @ko 자이로스코프를 이용한 회전 컨트롤\r\n * @since 4.0.0\r\n */\nclass GyroControl extends Component {\n /**\r\n * @copy CameraControl#enabled\r\n */\n get enabled() {\n return this._input.enabled;\n }\n /**\r\n * @hidden\r\n */\n get enableBlocked() {\n return this._enableBlocked;\n }\n /**\r\n * @copy CameraControl#animating\r\n */\n get animating() {\n return this._input.enabled && this._input.orientationUpdated;\n }\n /**\r\n * When `true`, ignore gyroscope's roll(z-axis rotation) value.\r\n * :::caution\r\n * Setting `false` will ignore camera's range limit.\r\n * Options like {@link View360Options#yawRange}, {@link View360Options#pitchRange} are ignored, and {@link CylinderProjection} also can't force it's camera range limit.\r\n * :::\r\n * @ko `true`일 경우 자이로스코프 입력의 roll(z축 회전)값을 무시합니다.\r\n * :::caution\r\n * 이 값을 `false`로 설정할 경우 카메라 범위 제약을 무시합니다.\r\n * {@link View360Options#yawRange}, {@link View360Options#pitchRange}와 같은 값은 무시되며, {@link CylinderProjection} 사용시에도 범위를 벗어날 수 있습니다.\r\n * :::\r\n * @default true\r\n * @since 4.0.0\r\n */\n get ignoreRoll() {\n return this._ignoreRoll;\n }\n set ignoreRoll(val) {\n this._ignoreRoll = val;\n }\n /**\r\n * Return availability of the gyroscope.\r\n * :::caution\r\n * This will always return false until user permission under environments like iOS which requires user permission when using gyroscope.\r\n * :::\r\n * @ko 자이로스코프 사용 가능 여부를 반환합니다.\r\n * :::caution\r\n * iOS와 같이 GyroScope 사용시 사용자 Permission을 요구하는 환경에서는 사용자 Permission을 받기 전까지 항상 `false`입니다.\r\n * :::\r\n * @example\r\n * ```ts\r\n * const gyroAvailable = await GyroControl.isAvailable();\r\n * ```\r\n */\n static isAvailable() {\n return __awaiter(this, void 0, void 0, function* () {\n if (!DeviceMotionEvent) {\n return false;\n }\n let onDeviceMotionChange;\n const listenDeviceMotion = () => new Promise(res => {\n onDeviceMotionChange = evt => {\n res(evt.rotationRate && evt.rotationRate.alpha != null);\n };\n window.addEventListener(EVENTS$1.DEVICE_MOTION, onDeviceMotionChange);\n });\n const timeout = () => new Promise(res => {\n setTimeout(() => res(false), 1000);\n });\n return Promise.race([listenDeviceMotion(), timeout()]).then(available => {\n window.removeEventListener(EVENTS$1.DEVICE_MOTION, onDeviceMotionChange);\n return available;\n });\n });\n }\n /**\r\n * Request user permission for gyroscope sensor.\r\n * This can be used in environments like iOS which requires user permission when using gyroscope sensors.\r\n * @ko 사용자의 sensor permission 취득을 요청합니다.\r\n * iOS와 같이 gyroscope 사용시 사용자 Permission을 요구하는 환경에서 사용 가능합니다.\r\n * @returns Whether the permission is granted {@ko 사용자 permission 취득 여부}\r\n */\n static requestSensorPermission() {\n return __awaiter(this, void 0, void 0, function* () {\n // Request sensor permission, on iOS13+\n if (sensorCanBeEnabledIOS()) {\n return DeviceMotionEvent.requestPermission().then(permissionState => {\n return permissionState === \"granted\";\n }).catch(() => false);\n }\n return true;\n });\n }\n /**\r\n * Create new GyroControl instance\r\n * @ko GyroControl의 인스턴스를 생성합니다.\r\n * @param enableBlocked - Whether to disable control on init {@ko 초기화 과정에서 컨트롤 활성화 여부}\r\n * @param options - Options for control {@ko 컨트롤 옵션들}\r\n */\n constructor(enableBlocked, {\n ignoreRoll = true\n } = {}) {\n super();\n this._enableBlocked = enableBlocked;\n this._ignoreRoll = ignoreRoll;\n this._input = new GyroInput();\n }\n /**\r\n * @copy CameraControl#destroy\r\n */\n destroy() {\n this.disable();\n this._input.off();\n this.off();\n }\n /**\r\n * @hidden\r\n */\n update(camera, yaw, pitch, zoom) {\n if (!this._ignoreRoll) {\n this._updateQuaternion(camera, zoom);\n } else {\n this._updateYawPitch(camera, yaw, pitch, zoom);\n }\n }\n /**\r\n * @copy CameraControl#enable\r\n */\n enable() {\n if (this._input.enabled) return;\n this._input.enable();\n this._enableBlocked = false;\n this.trigger(CONTROL_EVENTS.ENABLE, {\n control: this,\n updateCursor: false\n });\n }\n /**\r\n * @copy CameraControl#disable\r\n */\n disable() {\n if (!this._input.enabled) return;\n this._input.disable();\n this.trigger(CONTROL_EVENTS.DISABLE, {\n updateCursor: false\n });\n }\n /**\r\n * @copy CameraControl#sync\r\n */\n sync() {} // eslint-disable-line @typescript-eslint/no-empty-function\n _updateYawPitch(camera, yaw, pitch, zoom) {\n const input = this._input;\n if (!input.enabled) return;\n const {\n yaw: yawDelta,\n pitch: pitchDelta\n } = input.collectDelta();\n yaw.add(yawDelta);\n pitch.add(pitchDelta);\n camera.lookAt({\n yaw: yaw.val,\n pitch: pitch.val,\n zoom\n });\n }\n _updateQuaternion(camera, zoom) {\n const input = this._input;\n if (!input.enabled) return;\n input.update();\n camera.rotate(input.quaternion, zoom);\n }\n}\n\n/**\r\n * Panorama control for View360\r\n * @ko View360용 파노라마 컨트롤\r\n * @since 4.0.0\r\n */\nclass PanoControl {\n /**\r\n * @copy View360#useGrabCursor\r\n */\n get useGrabCursor() {\n return this._useGrabCursor;\n }\n set useGrabCursor(val) {\n if (val === this._useGrabCursor) return;\n this._useGrabCursor = val;\n if (val && this._enabled) {\n this._setCursor(CURSOR.GRAB);\n } else if (!val) {\n this._setCursor(CURSOR.NONE);\n }\n }\n /**\r\n * @copy View360#disableContextMenu\r\n */\n get disableContextMenu() {\n return this._disableContextMenu;\n }\n set disableContextMenu(val) {\n if (val === this._disableContextMenu) return;\n this._disableContextMenu = val;\n if (val && this._enabled) {\n this._blockContextMenu();\n } else if (!val) {\n this._restoreContextMenu();\n }\n }\n /**\r\n * @copy View360#disableContextMenu\r\n */\n get scrollable() {\n return this._rotateControl.scrollable;\n }\n set scrollable(val) {\n this._rotateControl.scrollable = val;\n }\n /**\r\n * @copy View360#disableContextMenu\r\n */\n get wheelScrollable() {\n return this._zoomControl.scrollable;\n }\n set wheelScrollable(val) {\n this._zoomControl.scrollable = val;\n }\n /**\r\n * When `true`, disables rotation slow-down by zoom-value.\r\n * @ko `true`일 경우 줌 된 정도에 따라 회전속도를 늦추는 동작을 비활성화합니다.\r\n * @since 4.0.0\r\n */\n get ignoreZoomScale() {\n return this._ignoreZoomScale;\n }\n set ignoreZoomScale(val) {\n this._ignoreZoomScale = val;\n }\n /**\r\n * Whether the control is enabled or not\r\n * @ko 컨트롤 활성화 여부를 가리키는 값\r\n * @readonly\r\n * @since 4.0.0\r\n */\n get enabled() {\n return this._enabled;\n }\n /**\r\n * @copy View360#rotate\r\n */\n get rotate() {\n return this._rotateControl;\n }\n /**\r\n * @copy View360#zoom\r\n */\n get zoom() {\n return this._zoomControl;\n }\n /**\r\n * @copy View360#gyro\r\n */\n get gyro() {\n return this._gyroControl;\n }\n /**\r\n * Whether one of the controls is animating at the moment\r\n * @ko 현재 컨트롤 중 하나라도 동작중인지 여부를 나타내는 값\r\n * @readonly\r\n * @since 4.0.0\r\n */\n get animating() {\n return this._rotateControl.animating || this._zoomControl.animating || this._gyroControl.animating;\n }\n /**\r\n * Create new instance.\r\n * @ko 새 인스턴스를 생성합니다.\r\n * @param element - Canvas element {@ko 캔버스 엘리먼트}\r\n * @param camera - Camera instance {@ko Camera 인스턴스}\r\n * @param options - Options for PanoControl {@ko PanoControl 옵션들}\r\n */\n constructor(element, camera, {\n useGrabCursor,\n scrollable,\n wheelScrollable,\n disableContextMenu,\n rotate,\n zoom,\n gyro\n }) {\n this._preventContextMenu = evt => {\n evt.preventDefault();\n };\n this._onInputStart = evt => {\n if (this._useGrabCursor && !evt.isKeyboard) {\n this._setCursor(CURSOR.GRABBING);\n }\n };\n this._onInputEnd = evt => {\n if (this._useGrabCursor && !evt.isKeyboard) {\n this._setCursor(CURSOR.GRAB);\n }\n };\n this._onEnable = ({\n control,\n updateCursor\n }) => {\n if (updateCursor && this._useGrabCursor) {\n this._setCursor(CURSOR.GRAB);\n }\n control.sync(this._camera);\n };\n this._onDisable = ({\n updateCursor\n }) => {\n if (updateCursor) {\n this._setCursor(CURSOR.NONE);\n }\n };\n this._onCameraAnimationEnd = ({\n animation\n }) => {\n animation.getFinishPromise().then(() => {\n this.sync();\n });\n };\n // Bind Options\n this._useGrabCursor = useGrabCursor;\n this._disableContextMenu = disableContextMenu;\n // Set internal values\n this._camera = camera;\n this._controlEl = element;\n this._ignoreZoomScale = false;\n this._enabled = false;\n this._rotateControl = new RotateControl(element, !rotate, getObjectOption(rotate));\n this._zoomControl = new ZoomControl(element, !zoom, getObjectOption(zoom));\n this._gyroControl = new GyroControl(!gyro, getObjectOption(gyro));\n this._rotateControl.scrollable = scrollable;\n this._zoomControl.scrollable = wheelScrollable;\n this._bindEvents();\n }\n /**\r\n * Destroy the instance and remove all event listeners attached.\r\n * This also will reset CSS cursor to initial.\r\n * @ko 인스턴스를 삭제하고 부착된 모든 이벤트 리스너를 제거합니다.\r\n * 또한, 캔버스에 적용된 CSS cursor도 제거합니다.\r\n * @since 4.0.0\r\n */\n destroy() {\n this.disable();\n this._rotateControl.destroy();\n this._zoomControl.destroy();\n this._setCursor(CURSOR.NONE);\n }\n /**\r\n * Resize control to match target size.\r\n * @ko 컨트롤이 내부에 캐시하고 있는 크기값을 갱신합니다.\r\n * @param width New width {@ko 변경된 너비}\r\n * @param height New height {@ko 변경된 높이}\r\n * @since 4.0.0\r\n */\n resize(width, height) {\n const camera = this._camera;\n this._rotateControl.resize(camera.fov, camera.aspect, width, height);\n }\n /**\r\n * Enable this control and add event listeners.\r\n * @ko 컨트롤을 활성화하고 이벤트 리스너들을 추가합니다.\r\n * @since 4.0.0\r\n */\n enable() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this._enabled) return;\n if (!this._rotateControl.enableBlocked) {\n this._rotateControl.enable();\n }\n if (!this._zoomControl.enableBlocked) {\n this._zoomControl.enable();\n }\n if (!this._gyroControl.enableBlocked) {\n if (yield GyroControl.isAvailable()) {\n this._gyroControl.enable();\n }\n }\n this.sync();\n if (this._disableContextMenu) {\n this._blockContextMenu();\n }\n this._enabled = true;\n });\n }\n /**\r\n * Disable this control and remove all event listeners\r\n * @ko 컨트롤을 비활성화하고 모든 이벤트 리스너들을 제거합니다.\r\n * @since 4.0.0\r\n */\n disable() {\n if (!this._enabled) return;\n this._rotateControl.disable();\n this._zoomControl.disable();\n this._gyroControl.disable();\n this._restoreContextMenu();\n this._enabled = false;\n }\n /**\r\n * Update control by given deltaTime\r\n * @ko 컨트롤을 주어진 시간만큼 업데이트합니다.\r\n * @param delta Number of milisec to update {@ko 업데이트할 시간, 밀리초 단위}\r\n * @since 4.0.0\r\n * @internal\r\n */\n update(delta) {\n const camera = this._camera;\n const rotateControl = this._rotateControl;\n const zoomControl = this._zoomControl;\n const gyroControl = this._gyroControl;\n zoomControl.update(delta);\n const zoom = hfovToZoom(camera.fov, zoomControl.zoom);\n // Slow down rotation on zoom-in\n const zoomScale = this._ignoreZoomScale ? 1 : Math.max(zoom, 1);\n rotateControl.setZoomScale(zoomScale);\n rotateControl.updateRange(camera, zoom);\n rotateControl.update(delta);\n const yaw = rotateControl.yaw;\n const pitch = rotateControl.pitch;\n if (gyroControl.enabled) {\n gyroControl.update(camera, yaw, pitch, zoom);\n } else {\n camera.lookAt({\n yaw: yaw.val,\n pitch: pitch.val,\n zoom\n });\n }\n }\n /**\r\n * Synchronize this control's state to current camera state\r\n * @ko 컨트롤을 카메라의 현재 상태와 동기화합니다.\r\n * @since 4.0.0\r\n */\n sync() {\n const camera = this._camera;\n this._zoomControl.sync(camera);\n this._rotateControl.sync(camera);\n }\n _blockContextMenu() {\n const el = this._controlEl;\n el.addEventListener(EVENTS$1.CONTEXT_MENU, this._preventContextMenu);\n }\n _restoreContextMenu() {\n const el = this._controlEl;\n el.removeEventListener(EVENTS$1.CONTEXT_MENU, this._preventContextMenu);\n }\n _setCursor(newCursor) {\n if (!this._useGrabCursor && newCursor !== CURSOR.NONE) return;\n const targetEl = this._controlEl;\n targetEl.style.cursor = newCursor;\n }\n _bindEvents() {\n const rotateControl = this._rotateControl;\n const zoomControl = this._zoomControl;\n rotateControl.on(CONTROL_EVENTS.INPUT_START, this._onInputStart);\n rotateControl.on(CONTROL_EVENTS.INPUT_END, this._onInputEnd);\n rotateControl.on(CONTROL_EVENTS.ENABLE, this._onEnable);\n rotateControl.on(CONTROL_EVENTS.DISABLE, this._onDisable);\n zoomControl.on(CONTROL_EVENTS.ENABLE, this._onEnable);\n zoomControl.on(CONTROL_EVENTS.DISABLE, this._onDisable);\n this._camera.on(CAMERA_EVENTS.ANIMATION_END, this._onCameraAnimationEnd);\n }\n}\n\n/**\r\n * @hidden\r\n */\nclass Texture {\n constructor({\n width,\n height,\n flipY\n }) {\n this.width = width;\n this.height = height;\n this.flipY = flipY;\n this.wrapS = WebGLRenderingContext.CLAMP_TO_EDGE;\n this.wrapT = WebGLRenderingContext.CLAMP_TO_EDGE;\n }\n destroy() {\n // DO_NOTHING\n }\n isVideo() {\n return false;\n }\n isCube() {\n return false;\n }\n}\n\n/*\r\n * Copyright (c) 2023-present NAVER Corp.\r\n * egjs projects are licensed under the MIT license\r\n */\n/**\r\n * @hidden\r\n */\nclass Texture2D extends Texture {\n constructor({\n source,\n width,\n height,\n flipY\n }) {\n super({\n width,\n height,\n flipY\n });\n this.source = source;\n }\n}\n\n/*\r\n * Copyright (c) 2023-present NAVER Corp.\r\n * egjs projects are licensed under the MIT license\r\n */\n/**\r\n * @hidden\r\n */\nclass TextureVideo extends Texture2D {\n destroy() {\n const video = this.source;\n video.pause();\n video.removeAttribute(\"src\");\n video.load();\n }\n isVideo() {\n return true;\n }\n isPaused() {\n const video = this.source;\n return video.paused || video.ended || video.readyState <= 2;\n }\n hasAudio() {\n const video = this.source;\n if (video.audioTracks) {\n return video.audioTracks.length > 0;\n }\n if (video.webkitAudioDecodedByteCount != null) {\n return video.webkitAudioDecodedByteCount > 0;\n }\n if (video.mozHasAudio != null) {\n return video.mozHasAudio;\n }\n // We don't know whether the video has audio or not, return true\n return true;\n }\n}\n\n/*\r\n * Copyright (c) 2023-present NAVER Corp.\r\n * egjs projects are licensed under the MIT license\r\n */\n/**\r\n * @hidden\r\n */\nclass TextureCube extends Texture {\n constructor({\n sources,\n width,\n height,\n flipY\n }) {\n super({\n width,\n height,\n flipY\n });\n this.sources = sources;\n }\n isCube() {\n return true;\n }\n}\n\n/**\r\n * @hidden\r\n */\nclass TextureLoader {\n constructor() {\n this._loadChecker = new ImReady();\n }\n load(src, video) {\n return __awaiter(this, void 0, void 0, function* () {\n if (video) {\n return this.loadVideo(src, getObjectOption(video));\n } else {\n if (Array.isArray(src) && src.length > 1) {\n return this.loadCubeImage(src);\n } else {\n const imgSrc = Array.isArray(src) ? src[0] : src;\n return this.loadImage(imgSrc);\n }\n }\n });\n }\n loadImage(src) {\n return __awaiter(this, void 0, void 0, function* () {\n const images = this._toImageArray(src);\n return this._load(images, resolve => {\n const image = images[0];\n resolve(new Texture2D({\n source: image,\n width: image.naturalWidth,\n height: image.naturalHeight,\n flipY: true\n }));\n });\n });\n }\n loadCubeImage(src) {\n return __awaiter(this, void 0, void 0, function* () {\n const images = this._toImageArray(src);\n return this._load(images, resolve => {\n resolve(new TextureCube({\n sources: images,\n width: images[0].naturalWidth,\n height: images[0].naturalHeight,\n flipY: false\n }));\n });\n });\n }\n loadVideo(src, videoConfig) {\n return __awaiter(this, void 0, void 0, function* () {\n const config = Object.assign({\n autoplay: true,\n muted: true,\n loop: false,\n volume: 1\n }, videoConfig);\n const video = this._toVideoElement(src, config);\n return this._load([video], resolve => {\n const {\n autoplay,\n muted\n } = config;\n video.currentTime = 0;\n if (autoplay && muted) {\n video.play().catch(() => void 0);\n }\n resolve(new TextureVideo({\n source: video,\n width: video.videoWidth,\n height: video.videoHeight,\n flipY: true\n }));\n });\n });\n }\n _load(content, onLoad) {\n const loader = this._loadChecker;\n return new Promise((resolve, reject) => {\n loader.once(\"ready\", evt => {\n if (evt.errorCount > 0) return;\n onLoad(resolve);\n });\n loader.once(\"error\", reject);\n loader.check(content);\n });\n }\n _toImageArray(src) {\n const srcs = Array.isArray(src) ? src : [src];\n return srcs.map(source => {\n if (isString(source)) {\n const imgEl = new Image();\n imgEl.crossOrigin = \"anonymous\";\n imgEl.src = source;\n return imgEl;\n } else {\n return source;\n }\n });\n }\n _toVideoElement(src, {\n muted,\n loop,\n volume\n }) {\n if (src instanceof HTMLVideoElement) {\n return src;\n }\n const video = document.createElement(\"video\");\n video.crossOrigin = \"anonymous\";\n video.playsInline = true;\n video.setAttribute(\"webkit-playsinline\", \"\");\n video.muted = muted;\n video.volume = volume;\n video.loop = loop;\n if (Array.isArray(src)) {\n src.forEach(source => this._appendSourceElement(video, source));\n } else {\n this._appendSourceElement(video, src);\n }\n const sourceCount = video.querySelectorAll(\"source\").length;\n if (sourceCount > 0 && video.readyState < 1) {\n video.load();\n }\n return video;\n }\n _appendSourceElement(video, src) {\n if (src instanceof HTMLSourceElement) {\n return src;\n }\n const sourceEl = document.createElement(\"source\");\n sourceEl.src = src;\n video.appendChild(sourceEl);\n }\n}\n\n/*\r\n * Copyright (c) 2023-present NAVER Corp.\r\n * egjs projects are licensed under the MIT license\r\n */\n/**\r\n * @internal\r\n */\nclass FrameAnimator {\n /** */\n constructor(maxDeltaTime, context = window) {\n this.maxDeltaTime = maxDeltaTime;\n this._context = context;\n this._rafId = -1;\n this._rafTimer = -1;\n this._lastUpdateTime = -1;\n }\n start(callback) {\n const context = this._context;\n // No context / callback set\n if (!context || !callback) return;\n // Animation already started\n if (this._rafId >= 0 || this._rafTimer >= 0) return;\n const loop = (_time, frame) => {\n const time = Date.now();\n const delta = Math.min(time - this._lastUpdateTime, this.maxDeltaTime * 1000);\n callback(delta, frame);\n this._lastUpdateTime = time;\n this._rafId = context.requestAnimationFrame(loop);\n };\n this._lastUpdateTime = Date.now();\n this._rafId = context.requestAnimationFrame(loop);\n }\n stop() {\n if (this._rafId >= 0) {\n this._context.cancelAnimationFrame(this._rafId);\n }\n if (this._rafTimer >= 0) {\n clearTimeout(this._rafTimer);\n }\n this._rafId = -1;\n this._rafTimer = -1;\n }\n changeContext(context) {\n this.stop();\n this._context = context;\n }\n}\n\n/*\r\n * Copyright (c) 2023-present NAVER Corp.\r\n * egjs projects are licensed under the MIT license\r\n */\n/**\r\n * Automatic resizer that uses both ResizeObserver and window resize event\r\n */\nclass AutoResizer {\n get useResizeObserver() {\n return this._useResizeObserver;\n }\n /**\r\n * Returns whether AutoResizer is enabled\r\n */\n get enabled() {\n return this._enabled;\n }\n /** */\n constructor(useResizeObserver, onResize) {\n // eslint-disable-next-line @typescript-eslint/member-ordering\n this._skipFirstResize = (() => {\n let isFirstResize = true;\n return () => {\n if (isFirstResize) {\n isFirstResize = false;\n return;\n }\n this._onResize();\n };\n })();\n this._useResizeObserver = useResizeObserver;\n this._enabled = false;\n this._resizeObserver = null;\n this._onResize = onResize;\n }\n /**\r\n * Enable resizer\r\n */\n enable(element) {\n if (this._enabled) {\n this.disable();\n }\n if (this._useResizeObserver && !!window.ResizeObserver) {\n const bbox = element.getBoundingClientRect();\n const resizeImmediate = bbox.width !== 0 || bbox.height !== 0;\n const resizeObserver = new ResizeObserver(resizeImmediate ? this._skipFirstResize : this._onResize);\n resizeObserver.observe(element);\n this._resizeObserver = resizeObserver;\n } else {\n window.addEventListener(EVENTS$1.RESIZE, this._onResize);\n }\n this._enabled = true;\n return this;\n }\n /**\r\n * Disable resizer\r\n */\n disable() {\n if (!this._enabled) return this;\n const resizeObserver = this._resizeObserver;\n if (resizeObserver) {\n resizeObserver.disconnect();\n this._resizeObserver = null;\n } else {\n window.removeEventListener(EVENTS$1.RESIZE, this._onResize);\n }\n this._enabled = false;\n return this;\n }\n}\n\n/**\r\n * A manager class for autoplay feature.\r\n * @ko Autoplay 기능의 매니저 클래스.\r\n * @since 4.0.0\r\n */\nclass Autoplay {\n /**\r\n * Whether autoplay is enabled or not\r\n * @ko 자동재생 활성화 여부를 나타내는 값\r\n * @readonly\r\n * @since 4.0.0\r\n */\n get enabled() {\n return this._enabled;\n }\n /**\r\n * @hidden\r\n */\n get enableBlocked() {\n return this._enableBlocked;\n }\n /**\r\n * Whether autoplay is updating the camera at the moment\r\n * @ko 현재 자동재생이 동작중인지 여부를 나타내는 값\r\n * @readonly\r\n * @since 4.0.0\r\n */\n get playing() {\n return this._enabled && !this._interrupted;\n }\n /**\r\n * Reactivation delay after mouse input in milisecond.\r\n * @ko 재활성화되기까지의 시간 (밀리초 단위)\r\n * @default 2000\r\n * @since 4.0.0\r\n */\n get delay() {\n return this._delay;\n }\n set delay(val) {\n this._delay = val;\n }\n /**\r\n * Reactivation delay after mouse leave when using {@link AutoplayOptions#pauseOnHover}\r\n * @ko {@link AutoplayOptions#pauseOnHover} 사용시 마우스가 캔버스 영역을 떠난 뒤 자동재생이 다시 활성화되기까지의 시간\r\n * @default 0\r\n * @since 4.0.0\r\n */\n get delayOnMouseLeave() {\n return this._delayOnMouseLeave;\n }\n set delayOnMouseLeave(val) {\n this._delayOnMouseLeave = val;\n }\n /**\r\n * Y-axis(yaw) rotation speed\r\n * @ko Y-축 회전(yaw)의 속도\r\n * @default 1\r\n * @since 4.0.0\r\n */\n get speed() {\n return this._speed;\n }\n set speed(val) {\n this._speed = val;\n }\n /**\r\n * Whether to pause rotation on mouse hover\r\n * @ko 마우스가 캔버스 영역에 들어왔을 때 자동재생을 정지할지 여부\r\n * @default false\r\n * @since 4.0.0\r\n */\n get pauseOnHover() {\n return this._pauseOnHover;\n }\n set pauseOnHover(val) {\n this._pauseOnHover = val;\n }\n /**\r\n * Whether user can interrupt the rotation with click/wheel input\r\n * @ko 클릭이나 휠같은 사용자 인터랙션시 자동재생을 멈출지 여부\r\n * @default true\r\n * @since 4.0.0\r\n */\n get canInterrupt() {\n return this._canInterrupt;\n }\n set canInterrupt(val) {\n this._canInterrupt = val;\n }\n /**\r\n * Whether to disable autoplay on user interrupt\r\n * @ko 사용자 동작에 의해 자동재생이 정지할 때, {@link Autoplay#disable}을 호출하여 자동재생을 영구히 정지할지 여부\r\n * @default false\r\n * @since 4.0.0\r\n */\n get disableOnInterrupt() {\n return this._disableOnInterrupt;\n }\n set disableOnInterrupt(val) {\n this._disableOnInterrupt = val;\n }\n /**\r\n * Create new AutoPlayer instance\r\n * @param camera - Instance of the {@link Camera} {@ko Camera의 인스턴스}\r\n * @param element - Canvas element {@ko 캔버스 엘리먼트}\r\n * @param options - Autoplay options {@ko 자동재생 옵션들}\r\n * @since 4.0.0\r\n */\n constructor(viewer, element, options) {\n this._onInputStart = () => {\n if (!this._canInterrupt) return;\n this._interrupted = true;\n this._clearTimeout();\n };\n this._onInputEnd = () => {\n this._setUninterruptedAfterDelay(this._delay);\n };\n this._onGyroEnable = () => {\n this.disable();\n };\n this._onMouseEnter = () => {\n if (!this._pauseOnHover) return;\n this._interrupted = true;\n this._hovering = true;\n };\n this._onMouseLeave = () => {\n if (!this._pauseOnHover) return;\n this._hovering = false;\n this._setUninterruptedAfterDelay(this._delayOnMouseLeave);\n };\n this._camera = viewer.camera;\n this._control = viewer.control;\n this._element = element;\n this._enabled = false;\n this._interrupted = false;\n this._interruptionTimer = -1;\n this._hovering = false;\n const {\n delay = 2000,\n delayOnMouseLeave = 0,\n speed = 1,\n pauseOnHover = false,\n canInterrupt = true,\n disableOnInterrupt = false\n } = getObjectOption(options);\n this._enableBlocked = !options;\n this._delay = delay;\n this._delayOnMouseLeave = delayOnMouseLeave;\n this._speed = speed;\n this._pauseOnHover = pauseOnHover;\n this._canInterrupt = canInterrupt;\n this._disableOnInterrupt = disableOnInterrupt;\n }\n /**\r\n * Destroy the instance and remove all event listeners attached\r\n * @ko 인스턴스를 제거하고 연결된 모든 이벤트 핸들러를 삭제합니다.\r\n * @since 4.0.0\r\n */\n destroy() {\n this.disable();\n }\n /**\r\n * Rotate camera by given deltaTime\r\n * @ko 주어진 deltaTime만큼 카메라를 회전시킵니다.\r\n * @param deltaTime - Number of milisec to update {@ko 업데이트할 시간, 밀리초 단위}\r\n * @since 4.0.0\r\n */\n update(deltaTime) {\n if (!this._enabled) return;\n if (this._interrupted) {\n if (this._disableOnInterrupt) {\n this.disable();\n }\n return;\n }\n const camera = this._camera;\n const delta = -this._speed * deltaTime / 100;\n camera.yaw = circulate(camera.yaw + delta, 0, 360);\n }\n /**\r\n * Enable autoplay and add event listeners.\r\n * @ko 자동재생을 활성화하고 이벤트리스너들을 추가합니다.\r\n * @since 4.0.0\r\n */\n enable() {\n const control = this._control;\n const element = this._element;\n if (this._enabled || control.gyro.enabled) return;\n control.rotate.on(CONTROL_EVENTS.INPUT_START, this._onInputStart);\n control.rotate.on(CONTROL_EVENTS.INPUT_END, this._onInputEnd);\n control.zoom.on(CONTROL_EVENTS.INPUT_START, this._onInputStart);\n control.zoom.on(CONTROL_EVENTS.INPUT_END, this._onInputEnd);\n control.gyro.on(CONTROL_EVENTS.ENABLE, this._onGyroEnable);\n element.addEventListener(EVENTS$1.MOUSE_ENTER, this._onMouseEnter, false);\n element.addEventListener(EVENTS$1.MOUSE_LEAVE, this._onMouseLeave, false);\n this._enabled = true;\n this._enableBlocked = false;\n }\n /**\r\n * Enable autoplay after current `delay` value.\r\n * @ko 현재의 `delay`값만큼 시간이 지난 다음에 자동재생을 활성화합니다.\r\n * @since 4.0.0\r\n */\n enableAfterDelay() {\n this.enable();\n this._interrupted = true;\n this._setUninterruptedAfterDelay(this._delay);\n }\n /**\r\n * Disable autoplay and remove all event handlers.\r\n * @ko 자동재생을 비활성화하고 모든 이벤트 핸들러를 제거합니다.\r\n * @since 4.0.0\r\n */\n disable() {\n if (!this._enabled) return;\n const control = this._control;\n const element = this._element;\n control.rotate.off(CONTROL_EVENTS.INPUT_START, this._onInputStart);\n control.rotate.off(CONTROL_EVENTS.INPUT_END, this._onInputEnd);\n control.zoom.off(CONTROL_EVENTS.INPUT_START, this._onInputStart);\n control.zoom.off(CONTROL_EVENTS.INPUT_END, this._onInputEnd);\n control.gyro.off(CONTROL_EVENTS.ENABLE, this._onGyroEnable);\n element.removeEventListener(EVENTS$1.MOUSE_ENTER, this._onMouseEnter, false);\n element.removeEventListener(EVENTS$1.MOUSE_LEAVE, this._onMouseLeave, false);\n this._enabled = false;\n this._interrupted = false;\n this._hovering = false;\n this._clearTimeout();\n }\n _setUninterruptedAfterDelay(delay) {\n if (this._hovering) return;\n this._clearTimeout();\n if (delay > 0) {\n this._interruptionTimer = window.setTimeout(() => {\n this._interrupted = false;\n this._interruptionTimer = -1;\n }, delay);\n } else {\n this._interrupted = false;\n this._interruptionTimer = -1;\n }\n }\n _clearTimeout() {\n if (this._interruptionTimer >= 0) {\n window.clearTimeout(this._interruptionTimer);\n this._interruptionTimer = -1;\n }\n }\n}\n\n/**\r\n * WebXR manager class\r\n * @ko WebXR 매니저 클래스\r\n * @since 4.0.0\r\n */\nclass XRManager extends Component {\n /**\r\n * Create new instance.\r\n * 새 인스턴스를 생성합니다.\r\n * @param ctx - Instance of WebGL context helper {@ko WebGL 콘텍스트 헬퍼의 인스턴스}\r\n * @param options - Options {@ko 옵션들}\r\n */\n constructor(ctx, options = {}) {\n super();\n /**\r\n * Destroy instance and end XR session if there was any.\r\n * @ko 인스턴스를 제거하고, XR 세션이 존재할 경우 종료합니다.\r\n * @since 4.0.0\r\n */\n this.destroy = () => {\n this.exit();\n this.off();\n };\n this._onSessionEnd = () => {\n this.exit();\n this.trigger(EVENTS.VR_END);\n };\n this._xrSession = null;\n this._xrRefSpace = null;\n this._ctx = ctx;\n this._options = options;\n }\n /**\r\n * Returns WebXR availability.\r\n * @ko WebXR 사용 가능 여부를 반환합니다.\r\n * @since 4.0.0\r\n */\n isAvailable() {\n return __awaiter(this, void 0, void 0, function* () {\n // eslint-disable-next-line compat/compat\n const xr = window.navigator.xr;\n if (!xr) return false;\n return xr.isSessionSupported(SESSION_VR).then(available => {\n return available;\n }).catch(() => {\n return false;\n });\n });\n }\n /**\r\n * Enter VR session\r\n * @ko VR 세션에 진입합니다.\r\n * @since 4.0.0\r\n */\n enter() {\n return __awaiter(this, void 0, void 0, function* () {\n const ctx = this._ctx;\n // eslint-disable-next-line compat/compat\n const xr = window.navigator.xr;\n if (!xr) return;\n yield GyroControl.requestSensorPermission();\n const options = Object.assign({\n requiredFeatures: [XR_REFERENCE_SPACE]\n }, this._options);\n yield ctx.makeXRCompatible();\n const session = yield xr.requestSession(SESSION_VR, options);\n ctx.bindXRLayer(session);\n const refSpace = yield session.requestReferenceSpace(XR_REFERENCE_SPACE);\n this._setSession(session, refSpace);\n this.trigger(EVENTS.VR_START, {\n session\n });\n });\n }\n /**\r\n * Exit VR session\r\n * @ko VR 세션에서 나갑니다.\r\n * @since 4.0.0\r\n */\n exit() {\n const xrSession = this._xrSession;\n if (xrSession) {\n xrSession.end().catch(() => void 0);\n }\n this._xrSession = null;\n this._xrRefSpace = null;\n }\n /**\r\n * @hidden\r\n */\n canRender(frame) {\n const refSpace = this._xrRefSpace;\n if (!refSpace) return false;\n const pose = frame.getViewerPose(refSpace);\n return !!pose;\n }\n /**\r\n * @hidden\r\n */\n getEyeParams(frame) {\n const session = frame.session;\n const pose = frame.getViewerPose(this._xrRefSpace);\n if (!pose) return null;\n const glLayer = session.renderState.baseLayer;\n if (!glLayer) return null;\n return pose.views.map(view => {\n const viewport = glLayer.getViewport(view);\n const vMatrix = view.transform.inverse.matrix;\n return {\n viewport,\n vMatrix,\n pMatrix: view.projectionMatrix\n };\n });\n }\n _setSession(session, refSpace) {\n this._xrSession = session;\n this._xrRefSpace = refSpace;\n session.addEventListener(EVENTS$1.XR_END, this._onSessionEnd);\n }\n}\n\n/**\r\n * Hotspot data\r\n * @ko 핫스팟 데이터\r\n * @since 4.0.0\r\n */\nclass Hotspot {\n constructor(element, position) {\n this.element = element;\n this.position = position;\n }\n}\n\n/*\r\n * Copyright (c) 2023-present NAVER Corp.\r\n * egjs projects are licensed under the MIT license\r\n */\n/**\r\n * Hotspot renderer\r\n * @ko Hotspot 렌더러\r\n * @since 4.0.0\r\n */\nclass HotspotRenderer {\n /**\r\n * Create new instance\r\n * @ko 새 인스턴스를 생성합니다.\r\n * @param rootEl - Container element for hotspots {@ko 핫스팟들의 컨테이너 엘리먼트}\r\n * @param renderer - instance of WebGLRenderer {@ko WebGLRenderer의 인스턴스}\r\n * @param options - Hotspot options {@ko Hotspot 옵션들 }\r\n */\n constructor(rootEl, renderer, {\n zoom = false\n }) {\n this._containerEl = getNullableElement(`.${DEFAULT_CLASS.HOTSPOT_CONTAINER}`, rootEl);\n this._renderer = renderer;\n this._hotspots = [];\n this._zoom = zoom;\n }\n /**\r\n * Refresh hotspots by collecting hotspot elements from current hotspot root element\r\n * @ko 현재 핫스팟 루트 엘리먼트 내에서 핫스팟 엘리먼트들을 수집하여 갱신합니다.\r\n * @throws {ERROR_CODES.INSUFFICIENT_ARGS} if data-position doesn't include all x, y, z values {@ko data-position이 x, y, z좌표를 전부 포함하고 있지 않을 때}\r\n */\n refresh() {\n const container = this._containerEl;\n if (!container) return;\n const hotspotEls = [].slice.apply(container.querySelectorAll(`.${DEFAULT_CLASS.HOTSPOT}`));\n this._hotspots = hotspotEls.map(el => this._parseHotspot(el));\n }\n /**\r\n * Render hotspots\r\n * @ko 핫스팟들을 렌더링합니다.\r\n * @param camera - Instance of Camera {@ko Camera의 인스턴스}\r\n */\n render(camera) {\n const hotspots = this._hotspots;\n const halfWidth = this._renderer.width * 0.5;\n const halfHeight = this._renderer.height * 0.5;\n const zoom = camera.zoom;\n const centerTransform = \"translate(-50%, -50%)\";\n const zoomTransform = this._zoom ? `scale(${zoom})` : \"\";\n hotspots.forEach(hotspot => {\n const position = hotspot.position;\n const relPos = vec3.create();\n vec3.copy(relPos, position);\n vec3.transformMat4(relPos, relPos, camera.viewMatrix);\n vec3.transformMat4(relPos, relPos, camera.projectionMatrix);\n if (relPos[2] > 1 || relPos[2] < 0) {\n hotspot.element.classList.remove(DEFAULT_CLASS.HOTSPOT_VISIBLE);\n return;\n }\n const screenPos = vec2.fromValues(relPos[0] * halfWidth + halfWidth, -relPos[1] * halfHeight + halfHeight);\n hotspot.element.classList.add(DEFAULT_CLASS.HOTSPOT_VISIBLE);\n hotspot.element.style.transform = [centerTransform, `translate(${screenPos[0]}px, ${screenPos[1]}px)`, zoomTransform].join(\" \");\n });\n }\n _parseHotspot(element) {\n const yawStr = element.dataset.yaw;\n const pitchStr = element.dataset.pitch;\n const positionStr = element.dataset.position;\n if (yawStr || pitchStr) {\n const yaw = yawStr ? parseFloat(yawStr) : 0;\n const pitch = pitchStr ? parseFloat(pitchStr) : 0;\n const position = this._yawPitchToVec3(yaw, pitch);\n return new Hotspot(element, position);\n } else if (positionStr) {\n const pos = positionStr.split(\" \").map(val => parseFloat(val));\n if (pos.length < 3) {\n throw new View360Error(ERROR.MESSAGES.INSUFFICIENT_ARGS(positionStr, \"hotspot attribute \\\"data-position\\\"\"), ERROR.CODES.INSUFFICIENT_ARGS);\n }\n return new Hotspot(element, vec3.fromValues(pos[0], pos[1], pos[2]));\n } else {\n // Place hotspot at yaw: 0, pitch: 0\n const defaultPos = vec3.fromValues(0, 0, -1);\n return new Hotspot(element, defaultPos);\n }\n }\n _yawPitchToVec3(yaw, pitch) {\n const yawRad = yaw * DEG_TO_RAD;\n const pitchRad = pitch * DEG_TO_RAD;\n const position = vec3.create();\n position[1] = Math.sin(pitchRad);\n position[2] = Math.cos(pitchRad);\n position[0] = position[2] * Math.sin(-yawRad);\n position[2] = -position[2] * Math.cos(-yawRad);\n return position;\n }\n}\n\n/**\r\n * @hidden\r\n */\nclass VertexArrayObject {\n get count() {\n return this.geometry.indicies.count;\n }\n constructor(obj, geometry, buffers) {\n this.obj = obj;\n this.geometry = geometry;\n this.buffers = buffers;\n }\n}\n\n/**\r\n * @hidden\r\n */\nclass WebGLContext {\n get canvas() {\n return this._canvas;\n }\n get maxTextureSize() {\n return this._maxTextureSize;\n }\n get isWebGL2() {\n return this._isWebGL2;\n }\n get supportVAO() {\n return this._isWebGL2 || !!this._extensions.vao;\n }\n get lost() {\n return this._contextLost;\n }\n get debug() {\n return this._debug;\n }\n constructor(canvas, debug) {\n this._onContextLost = () => {\n const canvas = this._canvas;\n canvas.classList.add(DEFAULT_CLASS.CTX_LOST);\n this._contextLost = true;\n };\n this._onContextRestore = () => {\n const canvas = this._canvas;\n canvas.classList.remove(DEFAULT_CLASS.CTX_LOST);\n this._contextLost = false;\n };\n this._canvas = canvas;\n this._contextLost = false;\n this._debug = debug;\n this._extensions = {\n vao: null,\n loseContext: null\n };\n }\n init() {\n const canvas = this._canvas;\n const {\n gl,\n isWebGL2\n } = this._getContext(canvas);\n this._gl = gl;\n this._maxTextureSize = gl.getParameter(gl.MAX_TEXTURE_SIZE);\n this._isWebGL2 = isWebGL2;\n if (!this._isWebGL2) {\n this._extensions.vao = gl.getExtension(\"OES_vertex_array_object\");\n }\n this._extensions.loseContext = gl.getExtension(\"WEBGL_lose_context\");\n canvas.addEventListener(EVENTS$1.CONTEXT_LOST, this._onContextLost);\n canvas.addEventListener(EVENTS$1.CONTEXT_RESTORED, this._onContextRestore);\n // gl.enable(gl.DEPTH_TEST);\n }\n\n destroy() {\n const gl = this._gl;\n const canvas = this._canvas;\n if (gl) {\n // gl is not defined when destroy is called before init\n gl.bindBuffer(gl.ARRAY_BUFFER, null);\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, null);\n }\n canvas.removeEventListener(EVENTS$1.CONTEXT_LOST, this._onContextLost);\n canvas.removeEventListener(EVENTS$1.CONTEXT_RESTORED, this._onContextRestore);\n }\n forceLoseContext() {\n const extension = this._extensions.loseContext;\n if (!extension) return;\n extension.loseContext();\n }\n forceRestoreContext() {\n const extension = this._extensions.loseContext;\n if (!extension) return;\n extension.restoreContext();\n }\n clear() {\n const gl = this._gl;\n gl.clear(gl.COLOR_BUFFER_BIT);\n }\n resize() {\n const gl = this._gl;\n gl.viewport(0, 0, gl.drawingBufferWidth, gl.drawingBufferHeight);\n }\n viewport(x, y, width, height) {\n const gl = this._gl;\n gl.viewport(x, y, width, height);\n }\n createVAO(geometry, shaderProgram) {\n const nativeVAO = this._createNativeVAO();\n const vao = new VertexArrayObject(nativeVAO, geometry, {\n indicies: this._createBuffer(),\n position: this._createBuffer(),\n uv: this._createBuffer()\n });\n if (nativeVAO) {\n this._bindNativeVAO(nativeVAO);\n this._supplyGeometryData(vao, shaderProgram);\n this._bindNativeVAO(null);\n this._unbindBuffers();\n }\n return vao;\n }\n draw(vao, shaderProgram) {\n const gl = this._gl;\n if (vao.obj) {\n this._bindNativeVAO(vao.obj);\n } else {\n this._supplyGeometryData(vao, shaderProgram);\n }\n gl.drawElements(gl.TRIANGLES, vao.count, gl.UNSIGNED_SHORT, 0);\n if (vao.obj) {\n this._bindNativeVAO(null);\n } else {\n this._unbindBuffers();\n }\n }\n releaseVAO(vao) {\n if (vao.obj) {\n this._deleteNativeVAO(vao.obj);\n }\n this._deleteBuffer(vao.buffers.indicies);\n this._deleteBuffer(vao.buffers.position);\n this._deleteBuffer(vao.buffers.uv);\n }\n getUniformLocations(program, uniforms) {\n const gl = this._gl;\n const uniformLocations = Object.keys(uniforms).reduce((locations, key) => {\n locations[key] = gl.getUniformLocation(program, key);\n return locations;\n }, {});\n return Object.assign(Object.assign({}, this._getCommonUniformLocations(program)), uniformLocations);\n }\n updateCommonUniforms(entity, camera, shaderProgram) {\n const gl = this._gl;\n const uniformLocations = shaderProgram.uniformLocations;\n // We're using \"matrix\"(=local matrix) here for efficiency\n // As projection doesn't require world matrix, as it doesn't have any parent or child\n const matrix = entity.matrix;\n const mvMatrix = mat4.create();\n mat4.multiply(mvMatrix, camera.viewMatrix, matrix);\n gl.uniformMatrix4fv(uniformLocations.uMVMatrix, false, mvMatrix);\n gl.uniformMatrix4fv(uniformLocations.uPMatrix, false, camera.projectionMatrix);\n }\n updateVRUniforms(shaderProgram, mvMatrix, pMatrix, eyeIndex) {\n const gl = this._gl;\n const uniformLocations = shaderProgram.uniformLocations;\n gl.uniformMatrix4fv(uniformLocations.uMVMatrix, false, mvMatrix);\n gl.uniformMatrix4fv(uniformLocations.uPMatrix, false, pMatrix);\n if (uniformLocations.uEye) {\n gl.uniform1f(uniformLocations.uEye, eyeIndex);\n }\n }\n updateUniforms(shaderProgram) {\n const gl = this._gl;\n const uniforms = shaderProgram.uniforms;\n const uniformLocations = shaderProgram.uniformLocations;\n for (const key in uniforms) {\n const uniform = uniforms[key];\n const location = uniformLocations[key];\n if (!uniform) continue;\n if (uniform.needsUpdate) {\n uniform.update(gl, location, this._isWebGL2);\n }\n }\n }\n releaseShaderResources(shaderProgram) {\n const gl = this._gl;\n const uniforms = shaderProgram.uniforms;\n for (const key in uniforms) {\n const uniform = uniforms[key];\n if (!uniform) continue;\n if (uniform.needsUpdate) {\n uniform.destroy(gl);\n }\n }\n gl.deleteProgram(shaderProgram.program);\n }\n useProgram(shaderProgram) {\n const gl = this._gl;\n gl.useProgram(shaderProgram.program);\n }\n createProgram(vertexShader, fragmentShader) {\n const gl = this._gl;\n const program = gl.createProgram();\n const vs = this._compileShader(gl.VERTEX_SHADER, vertexShader);\n const fs = this._compileShader(gl.FRAGMENT_SHADER, fragmentShader);\n gl.attachShader(program, vs);\n gl.attachShader(program, fs);\n gl.bindAttribLocation(program, 0, \"position\");\n gl.bindAttribLocation(program, 1, \"uv\");\n gl.linkProgram(program);\n if (this._debug && !gl.getProgramParameter(program, gl.LINK_STATUS)) {\n let shaderLog = null;\n if (!gl.getShaderParameter(vs, gl.COMPILE_STATUS)) {\n shaderLog = gl.getShaderInfoLog(vs);\n } else if (!gl.getShaderParameter(fs, gl.COMPILE_STATUS)) {\n shaderLog = gl.getShaderInfoLog(fs);\n }\n throw new View360Error(ERROR.MESSAGES.FAILED_LINKING_PROGRAM(gl.getProgramInfoLog(program), shaderLog), ERROR.CODES.FAILED_LINKING_PROGRAM);\n }\n gl.deleteShader(vs);\n gl.deleteShader(fs);\n return program;\n }\n createWebGLTexture(texData) {\n const gl = this._gl;\n const texture = gl.createTexture();\n gl.bindTexture(gl.TEXTURE_2D, texture);\n gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);\n gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);\n gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, texData.wrapS);\n gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, texData.wrapT);\n if (!texData.isVideo() && this._isWebGL2) {\n const gl2 = gl;\n gl2.texStorage2D(gl2.TEXTURE_2D, 1, gl2.RGBA8, texData.width, texData.height);\n }\n return texture;\n }\n createWebGLCubeTexture(texData, size) {\n const gl = this._gl;\n const texture = gl.createTexture();\n gl.bindTexture(gl.TEXTURE_CUBE_MAP, texture);\n gl.texParameteri(gl.TEXTURE_CUBE_MAP, gl.TEXTURE_MIN_FILTER, gl.LINEAR);\n gl.texParameteri(gl.TEXTURE_CUBE_MAP, gl.TEXTURE_MAG_FILTER, gl.LINEAR);\n gl.texParameteri(gl.TEXTURE_CUBE_MAP, gl.TEXTURE_WRAP_S, texData.wrapS);\n gl.texParameteri(gl.TEXTURE_CUBE_MAP, gl.TEXTURE_WRAP_T, texData.wrapT);\n if (this._isWebGL2) {\n const gl2 = gl;\n gl2.texStorage2D(gl2.TEXTURE_CUBE_MAP, 1, gl2.RGBA8, size, size);\n }\n return texture;\n }\n makeXRCompatible() {\n return __awaiter(this, void 0, void 0, function* () {\n const gl = this._gl;\n const attributes = gl.getContextAttributes();\n if (attributes && attributes.xrCompatible !== true) {\n yield gl.makeXRCompatible();\n }\n });\n }\n bindXRLayer(session) {\n const gl = this._gl;\n const xrLayer = new XRWebGLLayer(session, gl);\n session.updateRenderState({\n baseLayer: xrLayer\n });\n }\n bindXRFrame(frame) {\n const gl = this._gl;\n const session = frame.session;\n const baseLayer = session.renderState.baseLayer;\n gl.bindFramebuffer(gl.FRAMEBUFFER, baseLayer.framebuffer);\n }\n useDefaultFrameBuffer() {\n const gl = this._gl;\n gl.bindFramebuffer(gl.FRAMEBUFFER, null);\n }\n _createBuffer() {\n return this._gl.createBuffer();\n }\n _deleteBuffer(buffer) {\n return this._gl.deleteBuffer(buffer);\n }\n _createNativeVAO() {\n const gl = this._gl;\n if (this._isWebGL2) {\n return gl.createVertexArray();\n } else {\n const ext = this._extensions.vao;\n return (ext === null || ext === void 0 ? void 0 : ext.createVertexArrayOES()) || null;\n }\n }\n _bindNativeVAO(vao) {\n const gl = this._gl;\n if (this._isWebGL2) {\n gl.bindVertexArray(vao);\n } else {\n const ext = this._extensions.vao;\n ext === null || ext === void 0 ? void 0 : ext.bindVertexArrayOES(vao);\n }\n }\n _deleteNativeVAO(vao) {\n const gl = this._gl;\n if (this._isWebGL2) {\n gl.deleteVertexArray(vao);\n } else {\n const ext = this._extensions.vao;\n ext === null || ext === void 0 ? void 0 : ext.deleteVertexArrayOES(vao);\n }\n }\n _supplyGeometryData(vao, shaderProgram) {\n const geometry = vao.geometry;\n this._supplyIndiciesData(geometry.indicies, vao.buffers.indicies);\n this._supplyAttributeData(geometry.vertices, shaderProgram.program, \"position\", vao.buffers.position);\n this._supplyAttributeData(geometry.uvs, shaderProgram.program, \"uv\", vao.buffers.uv);\n }\n _unbindBuffers() {\n const gl = this._gl;\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, null);\n gl.bindBuffer(gl.ARRAY_BUFFER, null);\n }\n _supplyIndiciesData(indicies, buffer) {\n const gl = this._gl;\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, buffer);\n gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, indicies.data, gl.STATIC_DRAW);\n }\n _supplyAttributeData(attribute, program, name, buffer) {\n const gl = this._gl;\n const attribLocation = gl.getAttribLocation(program, name);\n // Attribute not used\n if (attribLocation < 0) return;\n gl.bindBuffer(gl.ARRAY_BUFFER, buffer);\n gl.bufferData(gl.ARRAY_BUFFER, attribute.data, gl.STATIC_DRAW);\n gl.vertexAttribPointer(attribLocation, attribute.itemSize, gl.FLOAT, false, 0, 0);\n gl.enableVertexAttribArray(attribLocation);\n }\n _compileShader(type, src) {\n const gl = this._gl;\n const shader = gl.createShader(type);\n gl.shaderSource(shader, src);\n gl.compileShader(shader);\n return shader;\n }\n _getCommonUniformLocations(program) {\n const gl = this._gl;\n return {\n uMVMatrix: gl.getUniformLocation(program, \"uMVMatrix\"),\n uPMatrix: gl.getUniformLocation(program, \"uPMatrix\")\n };\n }\n _getContext(canvas) {\n const webglIdentifiers = [\"webgl2\", \"webgl\", \"experimental-webgl\", \"webkit-3d\", \"moz-webgl\"];\n let context = null;\n let isWebGL2 = false;\n const contextAttributes = {\n preserveDrawingBuffer: false,\n antialias: false\n };\n const onWebglContextCreationError = e => e.statusMessage;\n canvas.addEventListener(EVENTS$1.CONTEXT_CREATE_ERROR, onWebglContextCreationError);\n for (const identifier of webglIdentifiers) {\n try {\n context = canvas.getContext(identifier, contextAttributes);\n isWebGL2 = identifier === \"webgl2\";\n } catch (t) {} // eslint-disable-line no-empty\n if (context) {\n break;\n }\n }\n canvas.removeEventListener(EVENTS$1.CONTEXT_CREATE_ERROR, onWebglContextCreationError);\n if (!context) {\n throw new View360Error(ERROR.MESSAGES.WEBGL_NOT_SUPPORTED, ERROR.CODES.WEBGL_NOT_SUPPORTED);\n }\n return {\n gl: context,\n isWebGL2\n };\n }\n}\n\n/*\r\n * Copyright (c) 2023-present NAVER Corp.\r\n * egjs projects are licensed under the MIT license\r\n */\n/**\r\n * Projection renderer, based on WebGL\r\n * @ko WebGL 기반의 프로젝션 렌더러\r\n * @since 4.0.0\r\n */\nclass WebGLRenderer {\n /**\r\n * Canvas element\r\n * @ko 캔버스 엘리먼트\r\n * @since 4.0.0\r\n */\n get canvas() {\n return this._canvas;\n }\n /**\r\n * Canvas's width (`devicePixelRatio` is not applied)\r\n * @ko 캔버스의 보이는 너비 (`devicePixelRatio`가 적용되지 않은)\r\n * @since 4.0.0\r\n */\n get width() {\n return this._elementSize.x;\n }\n /**\r\n * Canvas's height (`devicePixelRatio` is not applied)\r\n * @ko 캔버스의 높이 (`devicePixelRatio`가 적용되지 않은)\r\n * @since 4.0.0\r\n */\n get height() {\n return this._elementSize.y;\n }\n /**\r\n * Current `devicePixelRatio` value.\r\n * @ko 현재 `devicePixelRatio` 값.\r\n * @since 4.0.0\r\n * @example\r\n * ```js\r\n * cosnt renderingWidth = view360.renderer.width * view360.renderer.pixelRatio;\r\n * ```\r\n */\n get pixelRatio() {\n return this._pixelRatio;\n }\n /**\r\n * Width / height ratio (= width / height)\r\n * @ko 너비 / 높이의 비율 (= width / height)\r\n * @since 4.0.0\r\n * @example\r\n * ```js\r\n * const aspect = view360.renderer.width / view360.renderer.pixelRatio;\r\n * assert(aspect === view360.renderer.aspect);\r\n * ```\r\n */\n get aspect() {\n return this._elementSize.x / this._elementSize.y;\n }\n /**\r\n * Create new instance\r\n * @ko 새 인스턴스를 생성합니다.\r\n * @param canvas - Canvas element {@ko 캔버스 엘리먼트}\r\n * @param debug - Whether to enable WebGL debugging {@ko WebGL debug 활성화 여부 }\r\n */\n constructor(canvas, debug) {\n this._canvas = canvas;\n this._elementSize = {\n x: 0,\n y: 0\n };\n this._pixelRatio = 1;\n this.ctx = new WebGLContext(canvas, debug);\n }\n /**\r\n * Destroy instance and release all resources.\r\n * @ko 인스턴스를 제거하고 사용된 리소스를 전부 해제합니다.\r\n * @since 4.0.0\r\n */\n destroy() {\n const canvas = this._canvas;\n this.ctx.destroy();\n canvas.width = 1;\n canvas.height = 1;\n }\n /**\r\n * Resize canvas and renew inner size cache.\r\n * @ko 캔버스의 크기를 재계산해서 내부의 사이즈 캐시값을 갱신합니다.\r\n * @since 4.0.0\r\n */\n resize() {\n const canvas = this._canvas;\n const canvasSize = this._elementSize;\n const devicePixelRatio = window.devicePixelRatio;\n canvasSize.x = canvas.clientWidth;\n canvasSize.y = canvas.clientHeight;\n canvas.width = canvasSize.x * devicePixelRatio;\n canvas.height = canvasSize.y * devicePixelRatio;\n this._pixelRatio = devicePixelRatio;\n this.ctx.resize();\n }\n /**\r\n * Render projection\r\n * @ko 프로젝션을 렌더링합니다.\r\n * @param projection - Projection to render {@ko 렌더링할 프로젝션}\r\n * @param cameraa - Camera instance {@ko 카메라의 인스턴스}\r\n * @since 4.0.0\r\n */\n render(mesh, camera) {\n const ctx = this.ctx;\n if (ctx.lost) return;\n ctx.clear();\n ctx.useProgram(mesh.program);\n ctx.updateCommonUniforms(mesh, camera, mesh.program);\n mesh.update({\n camera\n });\n ctx.updateUniforms(mesh.program);\n ctx.draw(mesh.vao, mesh.program);\n }\n /**\r\n * Render VR frame, only used for rendering frames inside VR sessions.\r\n * @ko VR 프레임을 렌더링합니다. VR 세션 진입 도중에만 사용됩니다.\r\n * @internal\r\n * @param mesh - Triangle mesh to render {@ko 렌더링할 메쉬}\r\n * @param vr - Instance of XRManager {@ko XRManager의 인스턴스}\r\n * @param frame - VR frame {@ko VR 프레임}\r\n * @since 4.0.0\r\n */\n renderVR(mesh, vr, frame) {\n const ctx = this.ctx;\n const eyeParams = vr.getEyeParams(frame);\n if (!eyeParams || !mesh) return;\n ctx.bindXRFrame(frame);\n ctx.useProgram(mesh.program);\n ctx.updateUniforms(mesh.program);\n eyeParams.forEach((eye, eyeIndex) => {\n const viewport = eye.viewport;\n // We're using \"mesh.matrix\"(=local matrix) here for efficiency\n // As projection doesn't require world matrix, as it doesn't have any parent or child\n const mvMatrix = mat4.multiply(mat4.create(), eye.vMatrix, mesh.matrix);\n ctx.viewport(viewport.x, viewport.y, viewport.width, viewport.height);\n ctx.updateVRUniforms(mesh.program, mvMatrix, eye.pMatrix, eyeIndex);\n ctx.draw(mesh.vao, mesh.program);\n });\n }\n}\n\n/**\r\n * Panorama 360 image viewer\r\n * @ko 파노라마 360 이미지 뷰어\r\n * @since 4.0.0\r\n * @see View360Options\r\n * @see View360Events\r\n */\nclass View360 extends Component {\n /**\r\n * Root element (`.view360-container`)\r\n * @ko 루트 엘리먼트 (`.view360-container`)\r\n * @since 4.0.0\r\n * @readonly\r\n * @example\r\n * ```html\r\n * \n * \n * \r\n * \r\n *
\r\n * ```\r\n * ```ts\r\n * import View360 from \"@egjs/view360\";\r\n *\r\n * const viewer = new View360(\"#viewer\");\r\n * console.log(viewer.rootEl); // Element with id \"viewer\"\r\n * ```\r\n */\n get rootEl() {\n return this._rootEl;\n }\n /**\r\n * Projection renderer.\r\n * @ko 프로젝션 렌더러.\r\n * @since 4.0.0\r\n * @readonly\r\n */\n get renderer() {\n return this._renderer;\n }\n /**\r\n * Projection camera.\r\n * @ko 프로젝션 카메라.\r\n * @since 4.0.0\r\n * @readonly\r\n */\n get camera() {\n return this._camera;\n }\n /**\r\n * Rotate/Zoom Controller.\r\n * @ko 회전/줌 컨트롤러.\r\n * @since 4.0.0\r\n * @readonly\r\n */\n get control() {\n return this._control;\n }\n /**\r\n * WebXR-based VR manager.\r\n * @ko WebXR 기반의 VR 기능 매니저 인스턴스.\r\n * @since 4.0.0\r\n * @readonly\r\n * @example\r\n * ```ts\r\n * // Example: Enter VR\r\n * // This must be called on user interaction, else will be rejected.\r\n * viewer.vr.enter();\r\n * ```\r\n */\n get vr() {\n return this._vr;\n }\n /**\r\n * Hotspot renderer.\r\n * You can also change options of {@link View360Options#hotspot} with this.\r\n * @ko 핫스팟 렌더러 인스턴스.\r\n * {@link View360Options#hotspot} 옵션 변경도 가능합니다.\r\n * @since 4.0.0\r\n * @readonly\r\n */\n get hotspot() {\n return this._hotspot;\n }\n /**\r\n * An array of plugins added.\r\n * @ko 추가된 플러그인의 배열\r\n * @since 4.0.0\r\n * @readonly\r\n * @example\r\n * ```ts\r\n * const viewer = new View360(\"#el_id\", {\r\n * plugins: [new ControlBar()]\r\n * });\r\n *\r\n * console.log(viewer.plugins); // [ControlBar]\r\n *\r\n * viewer.addPlugins(new LoadingSpinner()) // [ControlBar, LoadingSpinner];\r\n * ```\r\n */\n get plugins() {\n return this._plugins;\n }\n /**\r\n * An instance of {@link Projection} that currently enabled. `null` if not initialized yet.\r\n * You should call {@link View360#load} to change panorama src or projection type.\r\n * @ko 현재 사용중인 {@link Projection}의 인스턴스. 프로젝션을 활성화하지 않았을 경우 `null`입니다.\r\n * 파노라마 이미지 소스나 프로젝션 타입을 변경하려면 {@link View360#load}를 호출하면 됩니다.\r\n * @since 4.0.0\r\n * @example\r\n * ```ts\r\n * const viewer = new View360\r\n * ```\r\n */\n get projection() {\n return this._projection;\n }\n set projection(val) {\n if (this._initialized && val) {\n this.load(val);\n } else {\n this._projection = val;\n }\n }\n /**\r\n * An instance of triangle mesh to render.\r\n * @ko 렌더링할 triangle mesh의 인스턴스\r\n * @internal\r\n * @since 4.0.0\r\n * @readonly\r\n */\n get mesh() {\n return this._mesh;\n }\n /**\r\n * A boolean value whether {@link View360#init init()} is called before.\r\n * @ko {@link View360#init init()}이 호출되었는지 여부를 가리키는 값\r\n * @since 4.0.0\r\n * @readonly\r\n * @example\r\n * ```ts\r\n * const viewer = new View360(\"#el\", { autoInit: false });\r\n *\r\n * console.log(viewer.initialized); // false\r\n *\r\n * await viewer.init();\r\n *\r\n * console.log(viewer.initialized); // true\r\n * ```\r\n */\n get initialized() {\n return this._initialized;\n }\n /**\r\n * Instance of the Autoplay manager.\r\n * You can also change {@link View360Options#autoplay} options with this.\r\n * @ko Autoplay 기능의 매니저 인스턴스.\r\n * 이 인스턴스를 통해 {@link View360Options#autoplay} 옵션을 변경하는 것도 가능합니다.\r\n * @since 4.0.0\r\n * @readonly\r\n * @example\r\n * ```ts\r\n * // Disable autoplay\r\n * viewer.autoplay.disable();\r\n * ```\r\n */\n get autoplay() {\n return this._autoplay;\n }\n /**\r\n * When this value is `true` and {@link View360Options#projection} is set, {@link View360#init init()} will be called automatically when instance is created.\r\n * @ko 이 값이 `true`이고, {@link View360Options#projection}이 설정되었으면, 인스턴스 생성 시점에 자동으로 {@link View360#init init()}을 호출합니다.\r\n * @default true\r\n * @since 4.0.0\r\n * @example\r\n * ```ts\r\n * import View360, { EquirectProjection, EVENTS } from \"@egjs/view360\";\r\n *\r\n * // viewer.init() is called on instance creation\r\n * // But as `init` is asynchronous, you should wait for \"ready\" event if you want to do something after initialization.\r\n * const viewer = new View360(\"#el_id\", {\r\n * autoInit: true,\r\n * projection: new EquirectProjection({ src: \"SRC_TO_URL\" })\r\n * });\r\n *\r\n * console.log(viewer.initialized); // false, as `init` is asynchronous\r\n *\r\n * viewer.once(EVENTS.READY, () => {\r\n * console.log(viewer.initialized); // true\r\n * });\r\n * ```\r\n */\n get autoInit() {\n return this._autoInit;\n }\n /**\r\n * When `true`, {@link View360#resize} is called when the canvas size is changed.\r\n * @ko `true`일 경우, 캔버스의 크기가 변경되었을 때 자동으로 {@link View360#resize}를 호출합니다.\r\n * @default true\r\n * @since 4.0.0\r\n * @see View360#useResizeObserver\r\n * @example\r\n * ```ts\r\n * const viewer = new View360(\"#el_id\", {\r\n * autoResize: true\r\n * });\r\n *\r\n * // This can trigger `viewer.resize()` if the canvas size was not 400px\r\n * const canvas = viewer.renderer.canvas;\r\n * canvas.style.width = \"400px\";\r\n * ```\r\n */\n get autoResize() {\n return this._autoResize;\n }\n /**\r\n * CSS selector for canvas element to render panorama image/video.\r\n * The canvas element should be placed inside the root element. (Dont' have to be direct child)\r\n * @ko 파노라마 이미지/비디오를 렌더링할 canvas 엘리먼트의 CSS 선택자\r\n * 캔버스 엘리먼트는 루트 엘리먼트 내부에 있어야합니다. 루트 엘리먼트의 직계 자식 엘리먼트(Direct child element)일 필요는 없습니다.\r\n * @default \"canvas\"\r\n * @since 4.0.0\r\n * @example\r\n * ```html\r\n * \r\n * \r\n * \r\n * \r\n *
\r\n * ```\r\n *\r\n * ```ts\r\n * const viewer = new View360(\"#el_id\", {\r\n * canvasSelector: \"#canvas_to_select\"\r\n * });\r\n * ```\r\n */\n get canvasSelector() {\n return this._canvasSelector;\n }\n /**\r\n * When `true`, it will use {@link ResizeObserver} API to detect canvas size change when {@link View360Options#autoResize} is enabled.\r\n * @ko `true`일 때 {@link View360Options#autoResize}가 활성화되었으면, 사용 가능한 환경에서 {@link ResizeObserver} API를 사용해서 캔버스 크기 변화를 추적합니다.\r\n * @default true\r\n * @since 4.0.0\r\n */\n get useResizeObserver() {\n return this._useResizeObserver;\n }\n /**\r\n * {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex tabindex} attribute for the canvas element.\r\n * This is necessary for the keyboard controls.\r\n * By default, `0` will be assigned. `null` to disable.\r\n * @ko 캔버스 엘리먼트에 적용할 {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex tabindex} 어트리뷰트의 값.\r\n * 이 값을 설정해야만 키보드 컨트롤을 사용 가능합니다.\r\n * 기본값으로 `0`이 설정됩니다. `null`로 지정하면 `tabindex`를 설정하지 않습니다.\r\n * @see RotateControlOptions#disableKeyboard\r\n * @default 0\r\n * @since 4.0.0\r\n * @example\r\n * ```ts\r\n * const viewer = new View360(\"#el_id\", {\r\n * tabindex: 5\r\n * });\r\n * ```\r\n *\r\n * ```html\r\n * \r\n * \r\n * \r\n *
\r\n * ```\r\n */\n get tabIndex() {\n return this._tabIndex;\n }\n set tabIndex(val) {\n const canvas = this._renderer.canvas;\n this._tabIndex = val;\n if (val != null) {\n canvas.tabIndex = val;\n } else {\n canvas.removeAttribute(\"tabindex\");\n }\n }\n /**\r\n * A maximum delta time between frames in seconds.\r\n * It can prevent camera or control changing too fast when frame being late.\r\n * @ko 프레임간 시간 차이의 최대값. (초 단위)\r\n * 퍼포먼스 등의 이유로 프레임 렌더링이 늦어졌을 때, 화면이 갑작스럽게 바뀌는 것을 막아줍니다.\r\n * @default 1 / 30\r\n * @since 4.0.0\r\n */\n get maxDeltaTime() {\n return this._animator.maxDeltaTime;\n }\n set maxDeltaTime(val) {\n this._animator.maxDeltaTime = val;\n }\n /**\r\n * Enable WebGL debugging. Setting this to `true` can decrease performance.\r\n * This is used internally on developing View360.\r\n * @ko WebGL 디버깅을 활성화합니다. 이 값을 `true`로 할 경우 성능이 하락할 수 있습니다.\r\n * 이 옵션은 View360을 개발하기 위해 내부적으로 사용됩니다.\r\n * @default false\r\n */\n get debug() {\n return this._debug;\n }\n set debug(val) {\n this._debug = val;\n }\n // Camera options\n /**\r\n * Initial yaw (y-axis rotation) value for camera. (in degrees, °)\r\n * As View360 uses right-handed coordinate system internally, camera will rotate counter-clockwise by this value.\r\n * @ko 카메라의 초기 yaw(y축 회전)값 (도 단위, °)\r\n * View360은 오른손 좌표계를 사용하기 때문에, 카메라가 해당 값만큼 시계 반대방향으로 회전합니다.\r\n * @default 0\r\n * @since 4.0.0\r\n * @example\r\n * ```ts\r\n * const viewer = new View360(\"#el_id\", {\r\n * initialYaw: 30\r\n * });\r\n *\r\n * viewer.on(\"ready\", () => {\r\n * console.log(viewer.camera.yaw); // 30\r\n * });\r\n * ```\r\n */\n get initialYaw() {\n return this._camera.initialYaw;\n }\n set initialYaw(val) {\n this._camera.initialYaw = val;\n }\n /**\r\n * Initial pitch (x-axis rotation) value for camera. (in degrees, °)\r\n * As View360 uses right-handed coordinate system internally, positive value will make camera to look upside, while negative value will look down.\r\n * @ko 카메라의 초기 pitch(x축 회전)값 (도 단위, °)\r\n * View360은 오른손 좌표계를 사용하기 때문에, 양(+)의 값은 카메라가 위를 보게 하고, 음(-)의 값은 카메라가 아래를 보게 합니다.\r\n * @default 0\r\n * @since 4.0.0\r\n * @example\r\n * ```ts\r\n * const viewer = new View360(\"#el_id\", {\r\n * initialPitch: 60\r\n * });\r\n *\r\n * viewer.on(\"ready\", () => {\r\n * console.log(viewer.camera.pitch); // 60\r\n * });\r\n * ```\r\n */\n get initialPitch() {\n return this._camera.initialPitch;\n }\n set initialPitch(val) {\n this._camera.initialPitch = val;\n }\n /**\r\n * Initial zoom value for camera.\r\n * Setting this value to `2` will enlarge panorama 200% by width.\r\n * @ko 카메라의 초기 줌 값.\r\n * 이 값을 `2`로 설정할 경우 파노라마 이미지를 가로 기준 200%만큼 확대합니다.\r\n * @default 1\r\n * @since 4.0.0\r\n * @example\r\n * ```ts\r\n * const viewer = new View360(\"#el_id\", {\r\n * initialZoom: 2\r\n * });\r\n *\r\n * viewer.on(\"ready\", () => {\r\n * console.log(viewer.camera.zoom); // 2\r\n * });\r\n * ```\r\n */\n get initialZoom() {\n return this._camera.initialZoom;\n }\n set initialZoom(val) {\n this._camera.initialZoom = val;\n }\n /**\r\n * Restrict yaw(y-axis rotation) range. (in degrees, °)\r\n * @ko yaw(y축 회전) 범위를 제한합니다. (도 단위, °)\r\n * @since 4.0.0\r\n * @example\r\n * ```ts\r\n * const viewer = new View360(\"#el_id\", {\r\n * yawRange: [-30, 30]\r\n * });\r\n *\r\n * viewer.on(\"ready\", () => {\r\n * console.log(viewer.camera.yaw); // 0\r\n * viewer.camera.lookAt({ yaw: 60 });\r\n * console.log(viewer.camera.yaw); // 30\r\n * });\r\n * ```\r\n */\n get yawRange() {\n return this._camera.yawRange;\n }\n set yawRange(val) {\n this._camera.yawRange = val;\n if (this._projection) this._projection.updateCamera(this._camera);\n }\n /**\r\n * Restrict pitch(x-axis rotation) range. (in degrees, °)\r\n * @ko pitch(x축 회전) 범위를 제한합니다. (도 단위, °)\r\n * @default null\r\n * @since 4.0.0\r\n * @example\r\n * ```ts\r\n * const viewer = new View360(\"#el_id\", {\r\n * pitchRange: [-45, 45]\r\n * });\r\n *\r\n * viewer.on(\"ready\", () => {\r\n * console.log(viewer.camera.pitch); // 0\r\n * viewer.camera.lookAt({ pitch: 60 });\r\n * console.log(viewer.camera.pitch); // 45\r\n * });\r\n * ```\r\n */\n get pitchRange() {\n return this._camera.pitchRange;\n }\n set pitchRange(val) {\n this._camera.pitchRange = val;\n if (this._projection) this._projection.updateCamera(this._camera);\n }\n /**\r\n * Restrict camera zoom range.\r\n * If `null`, a default zoom range from `0.6` to `10` will be used.\r\n * @ko 카메라 줌 범위를 제한합니다.\r\n * `null`일 경우 기본값으로 `0.6`에서 `10`의 범위를 사용합니다.\r\n * @default null\r\n * @since 4.0.0\r\n * @example\r\n * ```ts\r\n * const viewer = new View360(\"#el_id\", {\r\n * zoomRange: [0.5, 4]\r\n * });\r\n *\r\n * viewer.on(\"ready\", () => {\r\n * console.log(viewer.camera.zoom); // 1\r\n * viewer.camera.lookAt({ zoom: 6 });\r\n * console.log(viewer.camera.zoom); // 4\r\n * });\r\n * ```\r\n */\n get zoomRange() {\n return this._camera.zoomRange;\n }\n set zoomRange(val) {\n this._camera.zoomRange = val;\n if (this._projection) this._projection.updateCamera(this._camera);\n }\n /**\r\n * Camera's horizontal FOV(Field of View). (in degrees, °)\r\n * @ko 카메라의 수평 FOV(Field of View) 값. (도 단위, °)\r\n * @default 90\r\n * @since 4.0.0\r\n * @example\r\n * ```ts\r\n * // Init with fov: 120\r\n * const viewer = new View360(\"#el_id\", { fov: 120 });\r\n *\r\n * // Back to 90\r\n * viewer.fov = 90;\r\n * ```\r\n */\n get fov() {\n return this._camera.fov;\n }\n set fov(val) {\n const camera = this._camera;\n const control = this._control;\n camera.fov = val;\n camera.updateMatrix();\n control.sync();\n }\n // Control options\n /**\r\n * A control for camera rotation.\r\n * You can also change options of {@link View360Options#rotate} with this.\r\n * @ko 카메라 회전을 담당하는 컨트롤.\r\n * {@link View360Options#rotate} 옵션 변경도 가능합니다.\r\n * @since 4.0.0\r\n * @readonly\r\n */\n get rotate() {\n return this._control.rotate;\n }\n /**\r\n * A control for camera zoom.\r\n * You can also change options of {@link View360Options#zoom} with this.\r\n * @ko 카메라 줌을 담당하는 컨트롤.\r\n * {@link View360Options#zoom} 옵션 변경도 가능합니다.\r\n * @since 4.0.0\r\n * @readonly\r\n */\n get zoom() {\n return this._control.zoom;\n }\n /**\r\n * A control for camera rotation with gyroscope input.\r\n * You can also change options of {@link View360Options#gyro} with this.\r\n * @ko 자이로스코프를 통한 카메라 회전을 담당하는 컨트롤.\r\n * {@link View360Options#gyro} 옵션 변경도 가능합니다.\r\n * @since 4.0.0\r\n * @readonly\r\n */\n get gyro() {\n return this._control.gyro;\n }\n /**\r\n * Apply CSS {@link https://developer.mozilla.org/en-US/docs/Web/CSS/cursor cursor} by current state of input when using mouse.\r\n * If `true`, this will add CSS style to canvas element. It'll apply `cursor: \"grab\"` by default and `cursor: \"grabbing\"` when holding the mouse button.\r\n * @ko 마우스 사용시 CSS {@link https://developer.mozilla.org/en-US/docs/Web/CSS/cursor cursor}값을 자동으로 변경할지 여부.\r\n * `true`일 경우 기본 상태에서 `cursor: \"grab\"`을, 입력 도중에 `cursor: \"grabbing\"`을 캔버스에 적용합니다.\r\n * @default true\r\n * @since 4.0.0\r\n */\n get useGrabCursor() {\n return this._control.useGrabCursor;\n }\n set useGrabCursor(val) {\n this._control.useGrabCursor = val;\n }\n /**\r\n * Disable context menu which pops up on mouse right click.\r\n * @ko 마우스 우클릭시 표시되는 컨텍스트 메뉴를 비활성화합니다.\r\n * @default false\r\n * @since 4.0.0\r\n */\n get disableContextMenu() {\n return this._control.disableContextMenu;\n }\n set disableContextMenu(val) {\n this._control.disableContextMenu = val;\n }\n /**\r\n * If `true`, enables scroll on mobile(touch) devices on canvas.\r\n * :::caution\r\n * When this option is enabled, users must swipe horizontally first then vertically to change view up or down.\r\n * :::\r\n * @ko `true`로 설정할 경우, 모바일(터치) 환경의 캔버스 영역 내에서 스크롤을 가능하게 합니다.\r\n * :::caution\r\n * 이 값을 활성화할 경우, 사용자가 카메라 뷰를 위/아래로 바꾸기 위해서는 먼저 가로로 스와이프한 이후에 세로로 스와이프해야만 합니다.\r\n * :::\r\n * @since 4.0.0\r\n * @default true\r\n */\n get scrollable() {\n return this._control.scrollable;\n }\n set scrollable(val) {\n this._control.scrollable = val;\n }\n /**\r\n * If `true`, enables scroll by mouse wheel on canvas.\r\n * :::caution\r\n * When this option is enabled, zoom by mouse wheel will be disabled.\r\n * :::\r\n * @ko `true`로 설정할 경우, 캔버스 영역 내에서 마우스 휠을 이용한 페이지 스크롤이 가능해집니다.\r\n * :::caution\r\n * 이 값을 활성화할 경우, 마우스 휠을 통한 줌이 불가능하게 됩니다.\r\n * :::\r\n * @since 4.0.0\r\n * @default false\r\n */\n get wheelScrollable() {\n return this._control.wheelScrollable;\n }\n set wheelScrollable(val) {\n this._control.wheelScrollable = val;\n }\n /**\r\n * Create new instance of View360\r\n * @ko View360의 새로운 인스턴스를 생성합니다\r\n * @param root - Root element(`.view360-container`) to mount View360\r\n * Can be either a CSS selector or HTMLElement.\r\n * {@ko View360을 마운트할 루트 엘리먼트, CSS 셀렉터나 HTMLElement를 지정 가능합니다.}\r\n * @param options - Options to apply\r\n * {@ko 적용할 옵션들}\r\n * @example\r\n * ```ts\r\n * import View360, { EquirectProjection } from \"@egjs/view360\";\r\n *\r\n * // Create new View360 instance\r\n * const viewer = new View360(\"#id-of-a-container\", {\r\n * projection: new EquirectProjection({\r\n * src: \"URL_TO_PANORAMA_IMAGE_OR_VIDEO\",\r\n * })\r\n * });\r\n * ```\r\n */\n constructor(root, {\n projection = null,\n initialYaw = 0,\n initialPitch = 0,\n initialZoom = 1,\n yawRange = null,\n pitchRange = null,\n zoomRange = null,\n fov = 90,\n useGrabCursor = true,\n disableContextMenu = false,\n rotate = true,\n zoom = true,\n gyro = false,\n scrollable = true,\n wheelScrollable = false,\n autoplay = false,\n hotspot = {},\n autoInit = true,\n autoResize = true,\n canvasSelector = \"canvas\",\n useResizeObserver = true,\n on = {},\n plugins = [],\n maxDeltaTime = 1 / 30,\n tabIndex = 0,\n debug = false\n } = {}) {\n super();\n /**\r\n * Render a single panorama image/video frame.\r\n * Rendering is performed automatically on demand, so you usually don't have to call this.\r\n * Call this when a frame is not renewed after changing options.\r\n * @ko 파노라마 이미지/비디오의 한 프레임을 렌더링합니다.\r\n * 프레임 갱신은 보통 필요한 때에만 자동적으로 이루어지기 때문에, 보통은 이 메소드를 호출할 필요는 없습니다.\r\n * 옵션 변경 이후에도 프레임 갱신이 이루어지지 않는다면, 이 메소드를 호출해주세요.\r\n * @param delta Delta time in milisec. {@ko 프레임간 시간 차이, 밀리초 단위}\r\n * @since 4.0.0\r\n */\n this.renderFrame = delta => {\n const camera = this._camera;\n const renderer = this._renderer;\n const control = this._control;\n const hotspot = this._hotspot;\n const autoPlayer = this._autoplay;\n const mesh = this._mesh;\n if (!mesh) return;\n this._emit(EVENTS.BEFORE_RENDER);\n if (autoPlayer.playing) {\n autoPlayer.update(delta);\n control.sync();\n }\n if (camera.animation) {\n camera.animation.update(delta);\n } else {\n control.update(delta);\n }\n renderer.render(mesh, camera);\n hotspot.render(camera);\n if (camera.changed) {\n this._emit(EVENTS.VIEW_CHANGE, {\n yaw: camera.yaw,\n pitch: camera.pitch,\n zoom: camera.zoom,\n quaternion: [camera.quaternion[0], camera.quaternion[1], camera.quaternion[2], camera.quaternion[3]]\n });\n }\n camera.onFrameRender();\n this._emit(EVENTS.RENDER);\n };\n this._renderFrameOnDemand = delta => {\n const camera = this._camera;\n const control = this._control;\n const autoplay = this._autoplay;\n const mesh = this._mesh;\n const texture = mesh === null || mesh === void 0 ? void 0 : mesh.getTexture();\n if (!this._initialized || !texture) return;\n if (!camera.animation && !control.animating && !autoplay.playing && !texture.isVideo()) return;\n this.renderFrame(delta);\n };\n this._renderVRFrame = (_delta, frame) => {\n const vr = this._vr;\n const mesh = this._mesh;\n const renderer = this._renderer;\n if (!mesh) return;\n this._emit(EVENTS.BEFORE_RENDER);\n renderer.renderVR(mesh, vr, frame);\n this._emit(EVENTS.RENDER);\n };\n this._rootEl = getElement(root);\n this._plugins = plugins;\n this._initialized = false;\n // Options\n this._autoInit = autoInit;\n this._autoResize = autoResize;\n this._canvasSelector = canvasSelector;\n this._useResizeObserver = useResizeObserver;\n this._tabIndex = tabIndex;\n this._debug = debug;\n // Core components\n const canvas = findCanvas(this._rootEl, canvasSelector);\n this._renderer = new WebGLRenderer(canvas, debug);\n this._camera = new Camera({\n initialYaw,\n initialPitch,\n initialZoom,\n fov,\n yawRange,\n pitchRange,\n zoomRange\n });\n this._control = new PanoControl(canvas, this._camera, {\n useGrabCursor,\n scrollable,\n wheelScrollable,\n disableContextMenu,\n rotate,\n zoom,\n gyro\n });\n this._animator = new FrameAnimator(maxDeltaTime);\n this._autoplay = new Autoplay(this, canvas, autoplay);\n this._projection = projection;\n this._mesh = null;\n this._autoResizer = new AutoResizer(useResizeObserver, () => this.resize());\n this._vr = new XRManager(this._renderer.ctx);\n this._hotspot = new HotspotRenderer(this._rootEl, this._renderer, hotspot);\n this._addEventHandlers(on);\n if (projection && autoInit) {\n this.init();\n }\n }\n /**\r\n * Destroy instance and release all resources.\r\n * @ko 인스턴스를 제거하고 모든 리소스를 해제합니다.\r\n * @since 4.0.0\r\n */\n destroy() {\n this._camera.destroy();\n this._animator.stop();\n this._renderer.destroy();\n this._control.destroy();\n this._autoResizer.disable();\n if (this._mesh) {\n this._mesh.destroy(this._renderer.ctx);\n this._mesh = null;\n }\n this._plugins.forEach(plugin => plugin.destroy(this));\n this._initialized = false;\n }\n /**\r\n * Initialize inner components and load projection src.\r\n * @ko 내부 컴포넌트들을 초기화하고 프로젝션 소스를 로드합니다.\r\n * @since 4.0.0\r\n */\n init() {\n return __awaiter(this, void 0, void 0, function* () {\n if (!this._projection) {\n throw new View360Error(ERROR.MESSAGES.PROVIDE_PROJECTION_FIRST, ERROR.CODES.PROVIDE_PROJECTION_FIRST);\n }\n const renderer = this._renderer;\n const camera = this._camera;\n const control = this._control;\n const animator = this._animator;\n const hotspot = this._hotspot;\n const projection = this._projection;\n const canvas = renderer.canvas;\n this._bindComponentEvents();\n renderer.ctx.init();\n this._resizeComponents();\n camera.updateMatrix();\n if (this._autoResize) {\n this._autoResizer.enable(canvas);\n }\n if (!this._autoplay.enableBlocked) {\n this._autoplay.enable();\n }\n this._plugins.forEach(plugin => {\n plugin.init(this);\n });\n const texture = yield this._loadTexture(projection);\n this._applyProjection(projection, texture);\n hotspot.refresh();\n animator.start(this._renderFrameOnDemand);\n yield control.enable();\n if (this._tabIndex != null && !canvas.hasAttribute(\"tabIndex\")) {\n canvas.tabIndex = this._tabIndex;\n }\n this._initialized = true;\n this.renderFrame(0);\n this._emit(EVENTS.READY);\n });\n }\n /**\r\n * Load new panorama image/video and display it.\r\n * This will {@link View360#init init()} View360 if it's not initialized yet.\r\n * @ko 새로운 파노라마 이미지 혹은 비디오를 로드하고 표시합니다.\r\n * 만약 View360이 아직 초기화되지 않았다면, {@link View360#init init()}을 호출합니다.\r\n * @param projection - Projection & video options for new source. {@ko 새로운 파노라마 이미지/비디오에 적용할 옵션들}\r\n * @returns `Promise\n \n \n \n \n \n \n \n \n
\n \n \n \n \n \n {{\n choice.title\n }} \n\n {{ choice.title }} \n \n \n
\n \n
\n \n \n \n {{\n component.data.choice.title\n }} \n\n {{ component.data.choice.title }} \n \n
\n \n
\n \n \n \n Back\n \n\n \n \n Show Inventory\n \n\n \n \n Restart\n \n \n \n Open Fullscreen\n \n \n \n Close Fullscreen\n \n \n \n Unmute\n \n \n \n Mute\n \n \n \n Help\n \n \n \n Close\n \n
\n \n \n
\n \n \n No fields set - please go to settings and set your tracking fields.\n
\n \n {{ scenario.settings.tracking.instructions }}\n
\n 0\">\n
\n \n \n \n \n
\n \n \n Please enter a value above.\n
\n \n \n Please enter a value above.\n
\n \n \n \n Please enter a value above.\n
\n \n \n Please enter a value above.\n
\n \n \n \n \n {{ option }}\n \n \n\n \n Please enter a value above.\n
\n \n \n \n {{ field.instructions }}\n
\n \n \n \n \n
\n \n \n By submitting this form you agree to our\n privacy policy\n
\n \n \n\n\n","import { Component, Input, ViewChild } from '@angular/core';\nimport { NgForm } from '@angular/forms';\nimport { PlayerSessionService } from 'src/app/services/player-session.service';\nimport { PlayerService } from 'src/app/services/player.service';\n\n@Component({\n selector: 'app-user-tracking-form',\n templateUrl: './user-tracking-form.component.html',\n styleUrls: ['./user-tracking-form.component.scss'],\n})\nexport class UserTrackingFormComponent {\n @Input() scenario: any;\n submitted = false;\n formProcessing = false;\n\n formData: any = {};\n userData:any = {};\n\n @ViewChild('userTrackingForm', { static: false }) userTrackingForm?: NgForm;\n\n constructor(\n private playerSessionService: PlayerSessionService,\n private playerService: PlayerService\n ) {}\n\n ngOnInit(): void {\n if (this.scenario.settings.tracking && this.scenario.settings.tracking.fields) {\n this.scenario.settings.tracking.fields.forEach((field: any) => {\n this.formData[field.id] = null;\n });\n }\n }\n\n onSubmit() {\n this.submitted = true;\n this.formProcessing = true;\n // do it\n if (!this.userTrackingForm?.valid) {\n this.formProcessing = false;\n return false;\n } else {\n // this.userData = JSON.parse(JSON.stringify(this.formData));\n this.scenario.settings.tracking.fields.forEach((field: any) => {\n this.userData[field.name] = JSON.parse(JSON.stringify(this.formData[field.id]));\n });\n this.playerSessionService.setUserData(this.userData);\n return true;\n }\n }\n}\n","\n
","import { Component, Input } from '@angular/core';\n\n@Component({\n selector: 'app-unavailable',\n templateUrl: './unavailable.component.html',\n styleUrls: ['./unavailable.component.scss']\n})\nexport class UnavailableComponent {\n\n @Input() reason?:any;\n\n ngOnInit() {\n console.log(this.reason);\n }\n}\n","Scenario unavailable
\n{{reason.detail}}
\nLoading...
\nNo scenario found...
\n\n *\n * Updating a client without reloading can easily result in a broken application due to a version\n * mismatch between the [application shell](guide/glossary#app-shell) and other page resources,\n * such as [lazy-loaded chunks](guide/glossary#lazy-loading), whose filenames may change between\n * versions.\n *\n * Only use this method, if you are certain it is safe for your specific use case.\n *\n *
\n *\n * @returns a promise that\n * - resolves to `true` if an update was activated successfully\n * - resolves to `false` if no update was available (for example, the client was already on the\n * latest version).\n * - rejects if any error occurs\n */\n activateUpdate() {\n if (!this.sw.isEnabled) {\n return Promise.reject(new Error(ERR_SW_NOT_SUPPORTED));\n }\n const nonce = this.sw.generateNonce();\n return this.sw.postMessageWithOperation('ACTIVATE_UPDATE', { nonce }, nonce);\n }\n static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: \"12.0.0\", version: \"16.2.8\", ngImport: i0, type: SwUpdate, deps: [{ token: NgswCommChannel }], target: i0.ɵɵFactoryTarget.Injectable }); }\n static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: \"12.0.0\", version: \"16.2.8\", ngImport: i0, type: SwUpdate }); }\n}\ni0.ɵɵngDeclareClassMetadata({ minVersion: \"12.0.0\", version: \"16.2.8\", ngImport: i0, type: SwUpdate, decorators: [{\n type: Injectable\n }], ctorParameters: function () { return [{ type: NgswCommChannel }]; } });\n\n/*!\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nconst SCRIPT = new InjectionToken('NGSW_REGISTER_SCRIPT');\nfunction ngswAppInitializer(injector, script, options, platformId) {\n return () => {\n if (!(isPlatformBrowser(platformId) && ('serviceWorker' in navigator) &&\n options.enabled !== false)) {\n return;\n }\n // Wait for service worker controller changes, and fire an INITIALIZE action when a new SW\n // becomes active. This allows the SW to initialize itself even if there is no application\n // traffic.\n navigator.serviceWorker.addEventListener('controllerchange', () => {\n if (navigator.serviceWorker.controller !== null) {\n navigator.serviceWorker.controller.postMessage({ action: 'INITIALIZE' });\n }\n });\n let readyToRegister$;\n if (typeof options.registrationStrategy === 'function') {\n readyToRegister$ = options.registrationStrategy();\n }\n else {\n const [strategy, ...args] = (options.registrationStrategy || 'registerWhenStable:30000').split(':');\n switch (strategy) {\n case 'registerImmediately':\n readyToRegister$ = of(null);\n break;\n case 'registerWithDelay':\n readyToRegister$ = delayWithTimeout(+args[0] || 0);\n break;\n case 'registerWhenStable':\n readyToRegister$ = !args[0] ? whenStable(injector) :\n merge(whenStable(injector), delayWithTimeout(+args[0]));\n break;\n default:\n // Unknown strategy.\n throw new Error(`Unknown ServiceWorker registration strategy: ${options.registrationStrategy}`);\n }\n }\n // Don't return anything to avoid blocking the application until the SW is registered.\n // Also, run outside the Angular zone to avoid preventing the app from stabilizing (especially\n // given that some registration strategies wait for the app to stabilize).\n // Catch and log the error if SW registration fails to avoid uncaught rejection warning.\n const ngZone = injector.get(NgZone);\n ngZone.runOutsideAngular(() => readyToRegister$.pipe(take(1)).subscribe(() => navigator.serviceWorker.register(script, { scope: options.scope })\n .catch(err => console.error('Service worker registration failed with:', err))));\n };\n}\nfunction delayWithTimeout(timeout) {\n return of(null).pipe(delay(timeout));\n}\nfunction whenStable(injector) {\n const appRef = injector.get(ApplicationRef);\n return appRef.isStable.pipe(filter(stable => stable));\n}\nfunction ngswCommChannelFactory(opts, platformId) {\n return new NgswCommChannel(isPlatformBrowser(platformId) && opts.enabled !== false ? navigator.serviceWorker :\n undefined);\n}\n/**\n * Token that can be used to provide options for `ServiceWorkerModule` outside of\n * `ServiceWorkerModule.register()`.\n *\n * You can use this token to define a provider that generates the registration options at runtime,\n * for example via a function call:\n *\n * {@example service-worker/registration-options/module.ts region=\"registration-options\"\n * header=\"app.module.ts\"}\n *\n * @publicApi\n */\nclass SwRegistrationOptions {\n}\n/**\n * @publicApi\n *\n * Sets up providers to register the given Angular Service Worker script.\n *\n * If `enabled` is set to `false` in the given options, the module will behave as if service\n * workers are not supported by the browser, and the service worker will not be registered.\n *\n * Example usage:\n * ```ts\n * bootstrapApplication(AppComponent, {\n * providers: [\n * provideServiceWorker('ngsw-worker.js')\n * ],\n * });\n * ```\n */\nfunction provideServiceWorker(script, options = {}) {\n return makeEnvironmentProviders([\n SwPush,\n SwUpdate,\n { provide: SCRIPT, useValue: script },\n { provide: SwRegistrationOptions, useValue: options },\n {\n provide: NgswCommChannel,\n useFactory: ngswCommChannelFactory,\n deps: [SwRegistrationOptions, PLATFORM_ID]\n },\n {\n provide: APP_INITIALIZER,\n useFactory: ngswAppInitializer,\n deps: [Injector, SCRIPT, SwRegistrationOptions, PLATFORM_ID],\n multi: true,\n },\n ]);\n}\n\n/**\n * @publicApi\n */\nclass ServiceWorkerModule {\n /**\n * Register the given Angular Service Worker script.\n *\n * If `enabled` is set to `false` in the given options, the module will behave as if service\n * workers are not supported by the browser, and the service worker will not be registered.\n */\n static register(script, options = {}) {\n return {\n ngModule: ServiceWorkerModule,\n providers: [provideServiceWorker(script, options)],\n };\n }\n static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: \"12.0.0\", version: \"16.2.8\", ngImport: i0, type: ServiceWorkerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }\n static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: \"14.0.0\", version: \"16.2.8\", ngImport: i0, type: ServiceWorkerModule }); }\n static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: \"12.0.0\", version: \"16.2.8\", ngImport: i0, type: ServiceWorkerModule, providers: [SwPush, SwUpdate] }); }\n}\ni0.ɵɵngDeclareClassMetadata({ minVersion: \"12.0.0\", version: \"16.2.8\", ngImport: i0, type: ServiceWorkerModule, decorators: [{\n type: NgModule,\n args: [{ providers: [SwPush, SwUpdate] }]\n }] });\n\n/**\n * @module\n * @description\n * Entry point for all public APIs of this package.\n */\n// This file only reexports content of the `src` folder. Keep it that way.\n\n// This file is not used to build this module. It is only used during editing\n\n/**\n * Generated bundle index. Do not edit.\n */\n\nexport { ServiceWorkerModule, SwPush, SwRegistrationOptions, SwUpdate, provideServiceWorker };\n","import { Subject } from '../Subject';\nimport { multicast } from './multicast';\nimport { connect } from './connect';\nexport function publish(selector) {\n return selector ? (source) => connect(selector)(source) : (source) => multicast(new Subject())(source);\n}\n","import { asyncScheduler } from '../scheduler/async';\nimport { delayWhen } from './delayWhen';\nimport { timer } from '../observable/timer';\nexport function delay(due, scheduler = asyncScheduler) {\n const duration = timer(due, scheduler);\n return delayWhen(() => duration);\n}\n","import { NgModule, isDevMode } from '@angular/core';\nimport { BrowserModule } from '@angular/platform-browser';\n\nimport { AppRoutingModule } from './app-routing.module';\nimport { AppComponent } from './app.component';\n\nimport { TooltipModule } from 'ngx-bootstrap/tooltip';\nimport { PopoverModule } from 'ngx-bootstrap/popover';\nimport { TabsModule } from 'ngx-bootstrap/tabs';\n\nimport { GlobalComponentsComponent } from './player/global-components/global-components.component';\nimport { PickTaskComponent } from './player/components/pick-task/pick-task.component';\nimport { TableComponentComponent } from './player/components/table-component/table-component.component';\nimport { HotspotComponentComponent } from './player/components/hotspot-component/hotspot-component.component';\nimport { ButtonComponentComponent } from './player/components/button-component/button-component.component';\nimport { DownloadComponentComponent } from './player/components/download-component/download-component.component';\nimport { ChatComponentComponent } from './player/components/chat-component/chat-component.component';\nimport { FormComponentComponent } from './player/components/form-component/form-component.component';\nimport { QuizComponentComponent } from './player/components/quiz-component/quiz-component.component';\nimport { PlayerComponent } from './player/player/player.component';\nimport { InventoryComponent } from './player/inventory/inventory.component';\nimport { ChartComponentComponent } from './player/components/chart-component/chart-component.component';\nimport { NotFoundComponent } from './not-found/not-found.component';\nimport { SafeHtmlPipe } from './pipes/safe-html.pipe';\nimport { ScenarioVarsPipe } from './pipes/scenario-vars.pipe';\nimport { FormsModule } from '@angular/forms';\nimport { Nl2brPipe } from './pipes/nl2br.pipe';\nimport { NgChartsModule } from 'ng2-charts';\nimport { HttpClient, HttpClientModule } from '@angular/common/http';\nimport { LoaderComponent } from './loader/loader.component';\nimport { ModalModule } from 'ngx-bootstrap/modal';\nimport { ServiceWorkerModule } from '@angular/service-worker';\nimport { UserTrackingFormComponent } from './player/user-tracking-form/user-tracking-form.component';\nimport { PlayerModalComponent } from './player/player-modal/player-modal.component';\nimport { SafePipe } from './pipes/safe.pipe';\nimport { UnavailableComponent } from './unavailable/unavailable.component';\nimport { EmbedComponentComponent } from './player/components/embed-component/embed-component.component';\nimport { PlayerHelpComponent } from './player/global-components/player-help/player-help.component';\nimport { TabsComponentComponent } from './player/components/tabs-component/tabs-component.component';\nimport { ComponentContainerComponent } from './player/component-container/component-container.component';\n\nimport { DragDropModule } from '@angular/cdk/drag-drop';\nimport { ComponentClassPipe } from './pipes/component-class.pipe';\nimport { ComponentStylePipe } from './pipes/component-style.pipe';\nimport { BlockClassPipe } from './pipes/block-class.pipe';\nimport { BlockStylePipe } from './pipes/block-style.pipe';\nimport { ScenarioStylePipe } from './pipes/scenario-style.pipe';\nimport { BlockAnimationPipe } from './pipes/block-animation.pipe';\nimport { ChatAdventureComponentComponent } from './player/components/chat/chat-adventure-component/chat-adventure-component.component';\nimport { ChatMessengerComponentComponent } from './player/components/chat/chat-messenger-component/chat-messenger-component.component';\nimport { AnimationClassPipe } from './pipes/animation-class.pipe';\nimport { AnimationStylePipe } from './pipes/animation-style.pipe';\nimport { PopoverComponent } from './player/popover/popover.component';\nimport { PanoramicImageComponentComponent } from './player/components/panoramic-image-component/panoramic-image-component.component';\nimport { NgxView360Module } from '@egjs/ngx-view360';\nimport { AudioComponentComponent } from './player/components/audio-component/audio-component.component';\nimport { VideoComponentComponent } from './player/components/video-component/video-component.component';\nimport { TextComponentComponent } from './player/components/text-component/text-component.component';\n\n@NgModule({\n declarations: [\n AppComponent,\n PickTaskComponent,\n TableComponentComponent,\n HotspotComponentComponent,\n ButtonComponentComponent,\n DownloadComponentComponent,\n ChatComponentComponent,\n FormComponentComponent,\n QuizComponentComponent,\n PlayerComponent,\n GlobalComponentsComponent,\n InventoryComponent,\n ChartComponentComponent,\n NotFoundComponent,\n SafeHtmlPipe,\n ScenarioVarsPipe,\n Nl2brPipe,\n LoaderComponent,\n UserTrackingFormComponent,\n PlayerModalComponent,\n SafePipe,\n UnavailableComponent,\n EmbedComponentComponent,\n PlayerHelpComponent,\n TabsComponentComponent,\n ComponentContainerComponent,\n ComponentClassPipe,\n ComponentStylePipe,\n BlockClassPipe,\n BlockStylePipe,\n ScenarioStylePipe,\n BlockAnimationPipe,\n ChatAdventureComponentComponent,\n ChatMessengerComponentComponent,\n AnimationClassPipe,\n AnimationStylePipe,\n PopoverComponent,\n PanoramicImageComponentComponent,\n AudioComponentComponent,\n VideoComponentComponent,\n TextComponentComponent\n ],\n imports: [\n BrowserModule,\n AppRoutingModule,\n FormsModule,\n TooltipModule.forRoot(),\n NgChartsModule,\n HttpClientModule,\n DragDropModule,\n ModalModule.forRoot(),\n TabsModule.forRoot(),\n PopoverModule.forRoot(),\n NgxView360Module,\n ServiceWorkerModule.register('ngsw-worker.js', {\n enabled: !isDevMode(),\n // Register the ServiceWorker as soon as the application is stable\n // or after 30 seconds (whichever comes first).\n registrationStrategy: 'registerWhenStable:30000',\n })\n ],\n providers: [],\n bootstrap: [AppComponent],\n})\nexport class AppModule {}\n","import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';\n\nimport { AppModule } from './app/app.module';\n\n\nplatformBrowserDynamic().bootstrapModule(AppModule)\n .catch(err => console.error(err));\n","\"use strict\";\nObject.defineProperty(exports, \"__esModule\", { value: true });\nexports.toCSS = exports.toJSON = void 0;\nconst toJSON_1 = require(\"./toJSON\");\nObject.defineProperty(exports, \"toJSON\", { enumerable: true, get: function () { return toJSON_1.toJSON; } });\nconst toCSS_1 = require(\"./toCSS\");\nObject.defineProperty(exports, \"toCSS\", { enumerable: true, get: function () { return toCSS_1.toCSS; } });\n","\"use strict\";\nObject.defineProperty(exports, \"__esModule\", { value: true });\nexports.isEmpty = void 0;\nconst isEmpty = function (x) {\n return typeof x == 'undefined' || x.length == 0 || x == null;\n};\nexports.isEmpty = isEmpty;\n","\"use strict\";\nObject.defineProperty(exports, \"__esModule\", { value: true });\nexports.altX = exports.lineAttrX = exports.commentX = exports.lineX = exports.endX = exports.selX = void 0;\nexports.selX = /([^\\s\\;\\{\\}][^\\;\\{\\}]*)\\{/g;\nexports.endX = /\\}/g;\nexports.lineX = /([^\\;\\{\\}]*)\\;/g;\nexports.commentX = /\\/\\*[\\s\\S]*?\\*\\//g;\nexports.lineAttrX = /([^\\:]+):([^\\;]*);/;\n// This is used, a concatenation of all above. We use alternation to\n// capture.\nexports.altX = /(\\/\\*[\\s\\S]*?\\*\\/)|([^\\s\\;\\{\\}][^\\;\\{\\}]*(?=\\{))|(\\})|([^\\;\\{\\}]+\\;(?!\\s*\\*\\/))/gim;\n","\"use strict\";\nObject.defineProperty(exports, \"__esModule\", { value: true });\nexports.strAttr = void 0;\nconst strAttr = (name, value, depth = 0) => {\n let response = '';\n for (let i = 0; i <= depth; ++i) {\n response += ' ';\n }\n return response + name + ': ' + value + ';\\n';\n};\nexports.strAttr = strAttr;\n","\"use strict\";\nObject.defineProperty(exports, \"__esModule\", { value: true });\nexports.strNode = void 0;\nconst toCSS_1 = require(\"./toCSS\");\nconst strNode = function (name, value, depth = 0) {\n let cssString = '';\n for (let i = 0; i <= depth; ++i) {\n cssString += ' ';\n }\n cssString += name + ' {\\n';\n cssString += toCSS_1.toCSS(value, depth + 1);\n for (let i = 0; i <= depth; ++i) {\n cssString += ' ';\n }\n cssString += '}\\n';\n return cssString;\n};\nexports.strNode = strNode;\n","\"use strict\";\nObject.defineProperty(exports, \"__esModule\", { value: true });\nexports.toCSS = void 0;\nconst strAttr_1 = require(\"./strAttr\");\nconst strNode_1 = require(\"./strNode\");\n/**\n * @param node\n * A JSON node.\n * @param depth\n * The depth of the current node; used for indentation and\n * optional.\n * @param breaks\n * Whether to add line breaks in the output.\n */\nconst toCSS = function (node, depth = 0, breaks = 0) {\n let cssString = '';\n if (node.attributes) {\n for (const i in node.attributes) {\n const att = node.attributes[i];\n cssString += strAttr_1.strAttr(i, att, depth);\n }\n }\n if (node.children) {\n let first = true;\n for (const i in node.children) {\n if (breaks && !first) {\n cssString += '\\n';\n }\n else {\n first = false;\n }\n cssString += strNode_1.strNode(i, node.children[i], depth);\n }\n }\n return cssString;\n};\nexports.toCSS = toCSS;\n","\"use strict\";\nObject.defineProperty(exports, \"__esModule\", { value: true });\nexports.toJSON = void 0;\nconst regex_1 = require(\"./regex\");\nconst isEmpty_1 = require(\"./isEmpty\");\nconst capComment = 1;\nconst capSelector = 2;\nconst capEnd = 3;\nconst capAttr = 4;\n/**\n * Input is css string and current pos, returns JSON object\n *\n * @param cssString\n * The CSS string.\n * @param args\n * An optional argument object. ordered: Whether order of\n * comments and other nodes should be kept in the output. This\n * will return an object where all the keys are numbers and the\n * values are objects containing \"name\" and \"value\" keys for each\n * node. comments: Whether to capture comments. split: Whether to\n * split each comma separated list of selectors.\n */\nconst defaultArgs = {\n ordered: false,\n comments: false,\n stripComments: false,\n split: false,\n};\nconst toJSON = function (cssString, args = defaultArgs) {\n const node = {\n children: {},\n attributes: {},\n };\n let match = null;\n let count = 0;\n if (args.stripComments) {\n args.comments = false;\n cssString = cssString.replace(regex_1.commentX, '');\n }\n while ((match = regex_1.altX.exec(cssString)) != null) {\n if (!isEmpty_1.isEmpty(match[capComment]) && args.comments) {\n // Comment\n node[count++] = match[capComment].trim();\n }\n else if (!isEmpty_1.isEmpty(match[capSelector])) {\n // New node, we recurse\n const name = match[capSelector].trim();\n // This will return when we encounter a closing brace\n const newNode = exports.toJSON(cssString, args);\n if (args.ordered) {\n // Since we must use key as index to keep order and not\n // name, this will differentiate between a Rule Node and an\n // Attribute, since both contain a name and value pair.\n node[count++] = { name, value: newNode, type: 'rule' };\n }\n else {\n const bits = args.split ? name.split(',') : [name];\n for (const i in bits) {\n const sel = bits[i].trim();\n if (sel in node.children) {\n for (const att in newNode.attributes) {\n node.children[sel].attributes[att] = newNode.attributes[att];\n }\n }\n else {\n node.children[sel] = newNode;\n }\n }\n }\n }\n else if (!isEmpty_1.isEmpty(match[capEnd])) {\n // Node has finished\n return node;\n }\n else if (!isEmpty_1.isEmpty(match[capAttr])) {\n const line = match[capAttr].trim();\n const attr = regex_1.lineAttrX.exec(line);\n if (attr) {\n // Attribute\n const name = attr[1].trim();\n const value = attr[2].trim();\n if (args.ordered) {\n node[count++] = { name, value, type: 'attr' };\n }\n else {\n if (name in node.attributes) {\n const currVal = node.attributes[name];\n if (!(currVal instanceof Array)) {\n node.attributes[name] = [currVal];\n }\n node.attributes[name].push(value);\n }\n else {\n node.attributes[name] = value;\n }\n }\n }\n else {\n // Semicolon terminated line\n node[count++] = line;\n }\n }\n }\n return node;\n};\nexports.toJSON = toJSON;\n","!function(t,e){\"object\"==typeof exports&&\"undefined\"!=typeof module?module.exports=e():\"function\"==typeof define&&define.amd?define(e):(t=\"undefined\"!=typeof globalThis?globalThis:t||self).dayjs=e()}(this,(function(){\"use strict\";var t=1e3,e=6e4,n=36e5,r=\"millisecond\",i=\"second\",s=\"minute\",u=\"hour\",a=\"day\",o=\"week\",c=\"month\",f=\"quarter\",h=\"year\",d=\"date\",l=\"Invalid Date\",$=/^(\\d{4})[-/]?(\\d{1,2})?[-/]?(\\d{0,2})[Tt\\s]*(\\d{1,2})?:?(\\d{1,2})?:?(\\d{1,2})?[.:]?(\\d+)?$/,y=/\\[([^\\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g,M={name:\"en\",weekdays:\"Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday\".split(\"_\"),months:\"January_February_March_April_May_June_July_August_September_October_November_December\".split(\"_\"),ordinal:function(t){var e=[\"th\",\"st\",\"nd\",\"rd\"],n=t%100;return\"[\"+t+(e[(n-20)%10]||e[n]||e[0])+\"]\"}},m=function(t,e,n){var r=String(t);return!r||r.length>=e?t:\"\"+Array(e+1-r.length).join(n)+t},v={s:m,z:function(t){var e=-t.utcOffset(),n=Math.abs(e),r=Math.floor(n/60),i=n%60;return(e<=0?\"+\":\"-\")+m(r,2,\"0\")+\":\"+m(i,2,\"0\")},m:function t(e,n){if(e.date()\\n \\n ![]()
\\n \\n \\n \\n \\n
\\n\").replace(/(^|\\n)\\s*/g, '');\n\n /**\n * @returns {boolean}\n */\n var resetOldContainer = function resetOldContainer() {\n var oldContainer = getContainer();\n if (!oldContainer) {\n return false;\n }\n oldContainer.remove();\n removeClass([document.documentElement, document.body], [swalClasses['no-backdrop'], swalClasses['toast-shown'], swalClasses['has-column']]);\n return true;\n };\n var resetValidationMessage$1 = function resetValidationMessage() {\n globalState.currentInstance.resetValidationMessage();\n };\n var addInputChangeListeners = function addInputChangeListeners() {\n var popup = getPopup();\n var input = getDirectChildByClass(popup, swalClasses.input);\n var file = getDirectChildByClass(popup, swalClasses.file);\n /** @type {HTMLInputElement} */\n var range = popup.querySelector(\".\".concat(swalClasses.range, \" input\"));\n /** @type {HTMLOutputElement} */\n var rangeOutput = popup.querySelector(\".\".concat(swalClasses.range, \" output\"));\n var select = getDirectChildByClass(popup, swalClasses.select);\n /** @type {HTMLInputElement} */\n var checkbox = popup.querySelector(\".\".concat(swalClasses.checkbox, \" input\"));\n var textarea = getDirectChildByClass(popup, swalClasses.textarea);\n input.oninput = resetValidationMessage$1;\n file.onchange = resetValidationMessage$1;\n select.onchange = resetValidationMessage$1;\n checkbox.onchange = resetValidationMessage$1;\n textarea.oninput = resetValidationMessage$1;\n range.oninput = function () {\n resetValidationMessage$1();\n rangeOutput.value = range.value;\n };\n range.onchange = function () {\n resetValidationMessage$1();\n rangeOutput.value = range.value;\n };\n };\n\n /**\n * @param {string | HTMLElement} target\n * @returns {HTMLElement}\n */\n var getTarget = function getTarget(target) {\n return typeof target === 'string' ? document.querySelector(target) : target;\n };\n\n /**\n * @param {SweetAlertOptions} params\n */\n var setupAccessibility = function setupAccessibility(params) {\n var popup = getPopup();\n popup.setAttribute('role', params.toast ? 'alert' : 'dialog');\n popup.setAttribute('aria-live', params.toast ? 'polite' : 'assertive');\n if (!params.toast) {\n popup.setAttribute('aria-modal', 'true');\n }\n };\n\n /**\n * @param {HTMLElement} targetElement\n */\n var setupRTL = function setupRTL(targetElement) {\n if (window.getComputedStyle(targetElement).direction === 'rtl') {\n addClass(getContainer(), swalClasses.rtl);\n }\n };\n\n /**\n * Add modal + backdrop + no-war message for Russians to DOM\n *\n * @param {SweetAlertOptions} params\n */\n var init = function init(params) {\n // Clean up the old popup container if it exists\n var oldContainerExisted = resetOldContainer();\n if (isNodeEnv()) {\n error('SweetAlert2 requires document to initialize');\n return;\n }\n var container = document.createElement('div');\n container.className = swalClasses.container;\n if (oldContainerExisted) {\n addClass(container, swalClasses['no-transition']);\n }\n setInnerHtml(container, sweetHTML);\n var targetElement = getTarget(params.target);\n targetElement.appendChild(container);\n setupAccessibility(params);\n setupRTL(targetElement);\n addInputChangeListeners();\n };\n\n /**\n * @param {HTMLElement | object | string} param\n * @param {HTMLElement} target\n */\n var parseHtmlToContainer = function parseHtmlToContainer(param, target) {\n // DOM element\n if (param instanceof HTMLElement) {\n target.appendChild(param);\n }\n\n // Object\n else if (_typeof(param) === 'object') {\n handleObject(param, target);\n }\n\n // Plain string\n else if (param) {\n setInnerHtml(target, param);\n }\n };\n\n /**\n * @param {any} param\n * @param {HTMLElement} target\n */\n var handleObject = function handleObject(param, target) {\n // JQuery element(s)\n if (param.jquery) {\n handleJqueryElem(target, param);\n }\n\n // For other objects use their string representation\n else {\n setInnerHtml(target, param.toString());\n }\n };\n\n /**\n * @param {HTMLElement} target\n * @param {any} elem\n */\n var handleJqueryElem = function handleJqueryElem(target, elem) {\n target.textContent = '';\n if (0 in elem) {\n for (var i = 0; (i in elem); i++) {\n target.appendChild(elem[i].cloneNode(true));\n }\n } else {\n target.appendChild(elem.cloneNode(true));\n }\n };\n\n /**\n * @returns {'webkitAnimationEnd' | 'animationend' | false}\n */\n var animationEndEvent = function () {\n // Prevent run in Node env\n if (isNodeEnv()) {\n return false;\n }\n var testEl = document.createElement('div');\n\n // Chrome, Safari and Opera\n if (typeof testEl.style.webkitAnimation !== 'undefined') {\n return 'webkitAnimationEnd';\n }\n\n // Standard syntax\n if (typeof testEl.style.animation !== 'undefined') {\n return 'animationend';\n }\n return false;\n }();\n\n /**\n * @param {SweetAlert} instance\n * @param {SweetAlertOptions} params\n */\n var renderActions = function renderActions(instance, params) {\n var actions = getActions();\n var loader = getLoader();\n if (!actions || !loader) {\n return;\n }\n\n // Actions (buttons) wrapper\n if (!params.showConfirmButton && !params.showDenyButton && !params.showCancelButton) {\n hide(actions);\n } else {\n show(actions);\n }\n\n // Custom class\n applyCustomClass(actions, params, 'actions');\n\n // Render all the buttons\n renderButtons(actions, loader, params);\n\n // Loader\n setInnerHtml(loader, params.loaderHtml || '');\n applyCustomClass(loader, params, 'loader');\n };\n\n /**\n * @param {HTMLElement} actions\n * @param {HTMLElement} loader\n * @param {SweetAlertOptions} params\n */\n function renderButtons(actions, loader, params) {\n var confirmButton = getConfirmButton();\n var denyButton = getDenyButton();\n var cancelButton = getCancelButton();\n if (!confirmButton || !denyButton || !cancelButton) {\n return;\n }\n\n // Render buttons\n renderButton(confirmButton, 'confirm', params);\n renderButton(denyButton, 'deny', params);\n renderButton(cancelButton, 'cancel', params);\n handleButtonsStyling(confirmButton, denyButton, cancelButton, params);\n if (params.reverseButtons) {\n if (params.toast) {\n actions.insertBefore(cancelButton, confirmButton);\n actions.insertBefore(denyButton, confirmButton);\n } else {\n actions.insertBefore(cancelButton, loader);\n actions.insertBefore(denyButton, loader);\n actions.insertBefore(confirmButton, loader);\n }\n }\n }\n\n /**\n * @param {HTMLElement} confirmButton\n * @param {HTMLElement} denyButton\n * @param {HTMLElement} cancelButton\n * @param {SweetAlertOptions} params\n */\n function handleButtonsStyling(confirmButton, denyButton, cancelButton, params) {\n if (!params.buttonsStyling) {\n removeClass([confirmButton, denyButton, cancelButton], swalClasses.styled);\n return;\n }\n addClass([confirmButton, denyButton, cancelButton], swalClasses.styled);\n\n // Buttons background colors\n if (params.confirmButtonColor) {\n confirmButton.style.backgroundColor = params.confirmButtonColor;\n addClass(confirmButton, swalClasses['default-outline']);\n }\n if (params.denyButtonColor) {\n denyButton.style.backgroundColor = params.denyButtonColor;\n addClass(denyButton, swalClasses['default-outline']);\n }\n if (params.cancelButtonColor) {\n cancelButton.style.backgroundColor = params.cancelButtonColor;\n addClass(cancelButton, swalClasses['default-outline']);\n }\n }\n\n /**\n * @param {HTMLElement} button\n * @param {'confirm' | 'deny' | 'cancel'} buttonType\n * @param {SweetAlertOptions} params\n */\n function renderButton(button, buttonType, params) {\n var buttonName = /** @type {'Confirm' | 'Deny' | 'Cancel'} */capitalizeFirstLetter(buttonType);\n toggle(button, params[\"show\".concat(buttonName, \"Button\")], 'inline-block');\n setInnerHtml(button, params[\"\".concat(buttonType, \"ButtonText\")] || ''); // Set caption text\n button.setAttribute('aria-label', params[\"\".concat(buttonType, \"ButtonAriaLabel\")] || ''); // ARIA label\n\n // Add buttons custom classes\n button.className = swalClasses[buttonType];\n applyCustomClass(button, params, \"\".concat(buttonType, \"Button\"));\n }\n\n /**\n * @param {SweetAlert} instance\n * @param {SweetAlertOptions} params\n */\n var renderCloseButton = function renderCloseButton(instance, params) {\n var closeButton = getCloseButton();\n if (!closeButton) {\n return;\n }\n setInnerHtml(closeButton, params.closeButtonHtml || '');\n\n // Custom class\n applyCustomClass(closeButton, params, 'closeButton');\n toggle(closeButton, params.showCloseButton);\n closeButton.setAttribute('aria-label', params.closeButtonAriaLabel || '');\n };\n\n /**\n * @param {SweetAlert} instance\n * @param {SweetAlertOptions} params\n */\n var renderContainer = function renderContainer(instance, params) {\n var container = getContainer();\n if (!container) {\n return;\n }\n handleBackdropParam(container, params.backdrop);\n handlePositionParam(container, params.position);\n handleGrowParam(container, params.grow);\n\n // Custom class\n applyCustomClass(container, params, 'container');\n };\n\n /**\n * @param {HTMLElement} container\n * @param {SweetAlertOptions['backdrop']} backdrop\n */\n function handleBackdropParam(container, backdrop) {\n if (typeof backdrop === 'string') {\n container.style.background = backdrop;\n } else if (!backdrop) {\n addClass([document.documentElement, document.body], swalClasses['no-backdrop']);\n }\n }\n\n /**\n * @param {HTMLElement} container\n * @param {SweetAlertOptions['position']} position\n */\n function handlePositionParam(container, position) {\n if (!position) {\n return;\n }\n if (position in swalClasses) {\n addClass(container, swalClasses[position]);\n } else {\n warn('The \"position\" parameter is not valid, defaulting to \"center\"');\n addClass(container, swalClasses.center);\n }\n }\n\n /**\n * @param {HTMLElement} container\n * @param {SweetAlertOptions['grow']} grow\n */\n function handleGrowParam(container, grow) {\n if (!grow) {\n return;\n }\n addClass(container, swalClasses[\"grow-\".concat(grow)]);\n }\n\n /**\n * This module contains `WeakMap`s for each effectively-\"private property\" that a `Swal` has.\n * For example, to set the private property \"foo\" of `this` to \"bar\", you can `privateProps.foo.set(this, 'bar')`\n * This is the approach that Babel will probably take to implement private methods/fields\n * https://github.com/tc39/proposal-private-methods\n * https://github.com/babel/babel/pull/7555\n * Once we have the changes from that PR in Babel, and our core class fits reasonable in *one module*\n * then we can use that language feature.\n */\n\n var privateProps = {\n innerParams: new WeakMap(),\n domCache: new WeakMap()\n };\n\n /** @type {InputClass[]} */\n var inputClasses = ['input', 'file', 'range', 'select', 'radio', 'checkbox', 'textarea'];\n\n /**\n * @param {SweetAlert} instance\n * @param {SweetAlertOptions} params\n */\n var renderInput = function renderInput(instance, params) {\n var popup = getPopup();\n if (!popup) {\n return;\n }\n var innerParams = privateProps.innerParams.get(instance);\n var rerender = !innerParams || params.input !== innerParams.input;\n inputClasses.forEach(function (inputClass) {\n var inputContainer = getDirectChildByClass(popup, swalClasses[inputClass]);\n if (!inputContainer) {\n return;\n }\n\n // set attributes\n setAttributes(inputClass, params.inputAttributes);\n\n // set class\n inputContainer.className = swalClasses[inputClass];\n if (rerender) {\n hide(inputContainer);\n }\n });\n if (params.input) {\n if (rerender) {\n showInput(params);\n }\n // set custom class\n setCustomClass(params);\n }\n };\n\n /**\n * @param {SweetAlertOptions} params\n */\n var showInput = function showInput(params) {\n if (!params.input) {\n return;\n }\n if (!renderInputType[params.input]) {\n error(\"Unexpected type of input! Expected \".concat(Object.keys(renderInputType).join(' | '), \", got \\\"\").concat(params.input, \"\\\"\"));\n return;\n }\n var inputContainer = getInputContainer(params.input);\n if (!inputContainer) {\n return;\n }\n var input = renderInputType[params.input](inputContainer, params);\n show(inputContainer);\n\n // input autofocus\n if (params.inputAutoFocus) {\n setTimeout(function () {\n focusInput(input);\n });\n }\n };\n\n /**\n * @param {HTMLInputElement} input\n */\n var removeAttributes = function removeAttributes(input) {\n for (var i = 0; i < input.attributes.length; i++) {\n var attrName = input.attributes[i].name;\n if (!['id', 'type', 'value', 'style'].includes(attrName)) {\n input.removeAttribute(attrName);\n }\n }\n };\n\n /**\n * @param {InputClass} inputClass\n * @param {SweetAlertOptions['inputAttributes']} inputAttributes\n */\n var setAttributes = function setAttributes(inputClass, inputAttributes) {\n var popup = getPopup();\n if (!popup) {\n return;\n }\n var input = getInput$1(popup, inputClass);\n if (!input) {\n return;\n }\n removeAttributes(input);\n for (var attr in inputAttributes) {\n input.setAttribute(attr, inputAttributes[attr]);\n }\n };\n\n /**\n * @param {SweetAlertOptions} params\n */\n var setCustomClass = function setCustomClass(params) {\n if (!params.input) {\n return;\n }\n var inputContainer = getInputContainer(params.input);\n if (inputContainer) {\n applyCustomClass(inputContainer, params, 'input');\n }\n };\n\n /**\n * @param {HTMLInputElement | HTMLTextAreaElement} input\n * @param {SweetAlertOptions} params\n */\n var setInputPlaceholder = function setInputPlaceholder(input, params) {\n if (!input.placeholder && params.inputPlaceholder) {\n input.placeholder = params.inputPlaceholder;\n }\n };\n\n /**\n * @param {Input} input\n * @param {Input} prependTo\n * @param {SweetAlertOptions} params\n */\n var setInputLabel = function setInputLabel(input, prependTo, params) {\n if (params.inputLabel) {\n var label = document.createElement('label');\n var labelClass = swalClasses['input-label'];\n label.setAttribute('for', input.id);\n label.className = labelClass;\n if (_typeof(params.customClass) === 'object') {\n addClass(label, params.customClass.inputLabel);\n }\n label.innerText = params.inputLabel;\n prependTo.insertAdjacentElement('beforebegin', label);\n }\n };\n\n /**\n * @param {SweetAlertInput} inputType\n * @returns {HTMLElement | undefined}\n */\n var getInputContainer = function getInputContainer(inputType) {\n var popup = getPopup();\n if (!popup) {\n return;\n }\n return getDirectChildByClass(popup, swalClasses[( /** @type {SwalClass} */inputType)] || swalClasses.input);\n };\n\n /**\n * @param {HTMLInputElement | HTMLOutputElement | HTMLTextAreaElement} input\n * @param {SweetAlertOptions['inputValue']} inputValue\n */\n var checkAndSetInputValue = function checkAndSetInputValue(input, inputValue) {\n if (['string', 'number'].includes(_typeof(inputValue))) {\n input.value = \"\".concat(inputValue);\n } else if (!isPromise(inputValue)) {\n warn(\"Unexpected type of inputValue! Expected \\\"string\\\", \\\"number\\\" or \\\"Promise\\\", got \\\"\".concat(_typeof(inputValue), \"\\\"\"));\n }\n };\n\n /** @type {Record\\n \\n \\n
\\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n
\\n \\n \\n \").concat(content, \"
\");\n };\n\n /**\n * @param {SweetAlert} instance\n * @param {SweetAlertOptions} params\n */\n var renderImage = function renderImage(instance, params) {\n var image = getImage();\n if (!image) {\n return;\n }\n if (!params.imageUrl) {\n hide(image);\n return;\n }\n show(image, '');\n\n // Src, alt\n image.setAttribute('src', params.imageUrl);\n image.setAttribute('alt', params.imageAlt || '');\n\n // Width, height\n applyNumericalStyle(image, 'width', params.imageWidth);\n applyNumericalStyle(image, 'height', params.imageHeight);\n\n // Class\n image.className = swalClasses.image;\n applyCustomClass(image, params, 'image');\n };\n\n /**\n * @param {SweetAlert} instance\n * @param {SweetAlertOptions} params\n */\n var renderPopup = function renderPopup(instance, params) {\n var container = getContainer();\n var popup = getPopup();\n if (!container || !popup) {\n return;\n }\n\n // Width\n // https://github.com/sweetalert2/sweetalert2/issues/2170\n if (params.toast) {\n applyNumericalStyle(container, 'width', params.width);\n popup.style.width = '100%';\n var loader = getLoader();\n loader && popup.insertBefore(loader, getIcon());\n } else {\n applyNumericalStyle(popup, 'width', params.width);\n }\n\n // Padding\n applyNumericalStyle(popup, 'padding', params.padding);\n\n // Color\n if (params.color) {\n popup.style.color = params.color;\n }\n\n // Background\n if (params.background) {\n popup.style.background = params.background;\n }\n hide(getValidationMessage());\n\n // Classes\n addClasses$1(popup, params);\n };\n\n /**\n * @param {HTMLElement} popup\n * @param {SweetAlertOptions} params\n */\n var addClasses$1 = function addClasses(popup, params) {\n var showClass = params.showClass || {};\n // Default Class + showClass when updating Swal.update({})\n popup.className = \"\".concat(swalClasses.popup, \" \").concat(isVisible$1(popup) ? showClass.popup : '');\n if (params.toast) {\n addClass([document.documentElement, document.body], swalClasses['toast-shown']);\n addClass(popup, swalClasses.toast);\n } else {\n addClass(popup, swalClasses.modal);\n }\n\n // Custom class\n applyCustomClass(popup, params, 'popup');\n // TODO: remove in the next major\n if (typeof params.customClass === 'string') {\n addClass(popup, params.customClass);\n }\n\n // Icon class (#1842)\n if (params.icon) {\n addClass(popup, swalClasses[\"icon-\".concat(params.icon)]);\n }\n };\n\n /**\n * @param {SweetAlert} instance\n * @param {SweetAlertOptions} params\n */\n var renderProgressSteps = function renderProgressSteps(instance, params) {\n var progressStepsContainer = getProgressSteps();\n if (!progressStepsContainer) {\n return;\n }\n var progressSteps = params.progressSteps,\n currentProgressStep = params.currentProgressStep;\n if (!progressSteps || progressSteps.length === 0 || currentProgressStep === undefined) {\n hide(progressStepsContainer);\n return;\n }\n show(progressStepsContainer);\n progressStepsContainer.textContent = '';\n if (currentProgressStep >= progressSteps.length) {\n warn('Invalid currentProgressStep parameter, it should be less than progressSteps.length ' + '(currentProgressStep like JS arrays starts from 0)');\n }\n progressSteps.forEach(function (step, index) {\n var stepEl = createStepElement(step);\n progressStepsContainer.appendChild(stepEl);\n if (index === currentProgressStep) {\n addClass(stepEl, swalClasses['active-progress-step']);\n }\n if (index !== progressSteps.length - 1) {\n var lineEl = createLineElement(params);\n progressStepsContainer.appendChild(lineEl);\n }\n });\n };\n\n /**\n * @param {string} step\n * @returns {HTMLLIElement}\n */\n var createStepElement = function createStepElement(step) {\n var stepEl = document.createElement('li');\n addClass(stepEl, swalClasses['progress-step']);\n setInnerHtml(stepEl, step);\n return stepEl;\n };\n\n /**\n * @param {SweetAlertOptions} params\n * @returns {HTMLLIElement}\n */\n var createLineElement = function createLineElement(params) {\n var lineEl = document.createElement('li');\n addClass(lineEl, swalClasses['progress-step-line']);\n if (params.progressStepsDistance) {\n applyNumericalStyle(lineEl, 'width', params.progressStepsDistance);\n }\n return lineEl;\n };\n\n /**\n * @param {SweetAlert} instance\n * @param {SweetAlertOptions} params\n */\n var renderTitle = function renderTitle(instance, params) {\n var title = getTitle();\n if (!title) {\n return;\n }\n showWhenInnerHtmlPresent(title);\n toggle(title, params.title || params.titleText, 'block');\n if (params.title) {\n parseHtmlToContainer(params.title, title);\n }\n if (params.titleText) {\n title.innerText = params.titleText;\n }\n\n // Custom class\n applyCustomClass(title, params, 'title');\n };\n\n /**\n * @param {SweetAlert} instance\n * @param {SweetAlertOptions} params\n */\n var render = function render(instance, params) {\n renderPopup(instance, params);\n renderContainer(instance, params);\n renderProgressSteps(instance, params);\n renderIcon(instance, params);\n renderImage(instance, params);\n renderTitle(instance, params);\n renderCloseButton(instance, params);\n renderContent(instance, params);\n renderActions(instance, params);\n renderFooter(instance, params);\n var popup = getPopup();\n if (typeof params.didRender === 'function' && popup) {\n params.didRender(popup);\n }\n };\n\n /*\n * Global function to determine if SweetAlert2 popup is shown\n */\n var isVisible = function isVisible() {\n return isVisible$1(getPopup());\n };\n\n /*\n * Global function to click 'Confirm' button\n */\n var clickConfirm = function clickConfirm() {\n var _dom$getConfirmButton;\n return (_dom$getConfirmButton = getConfirmButton()) === null || _dom$getConfirmButton === void 0 ? void 0 : _dom$getConfirmButton.click();\n };\n\n /*\n * Global function to click 'Deny' button\n */\n var clickDeny = function clickDeny() {\n var _dom$getDenyButton;\n return (_dom$getDenyButton = getDenyButton()) === null || _dom$getDenyButton === void 0 ? void 0 : _dom$getDenyButton.click();\n };\n\n /*\n * Global function to click 'Cancel' button\n */\n var clickCancel = function clickCancel() {\n var _dom$getCancelButton;\n return (_dom$getCancelButton = getCancelButton()) === null || _dom$getCancelButton === void 0 ? void 0 : _dom$getCancelButton.click();\n };\n\n /** @typedef {'cancel' | 'backdrop' | 'close' | 'esc' | 'timer'} DismissReason */\n\n /** @type {Record