@arcgis/core/widgets/OrientedImageryViewer/components/NavigationUI360.js

ArcGIS Maps SDK for JavaScript: A complete 2D and 3D mapping and data visualization API

/*
All material copyright ESRI, All Rights Reserved, unless otherwise specified.
See https://js.arcgis.com/4.33/esri/copyright.txt for details.
*/
import{_ as t}from"../../../chunks/tslib.es6.js";import{createTask as i}from"../../../core/asyncUtils.js";import{throwIfAborted as o}from"../../../core/promiseUtils.js";import{whenOnce as e}from"../../../core/reactiveUtils.js";import{property as r}from"../../../core/accessorSupport/decorators/property.js";import"../../../core/has.js";import"../../../core/Logger.js";import"../../../core/RandomLCG.js";import{subclass as s}from"../../../core/accessorSupport/decorators/subclass.js";import n from"../../Widget.js";import{css as c}from"../css.js";import a from"./NavigationUIPanoramicViewModel.js";import{loadCalciteComponents as l}from"../../support/componentsUtils.js";import"../../support/widgetUtils.js";import{tsx as d}from"../../support/jsxFactory.js";let p=class extends n{constructor(t){super(t),this.navigate=null,this.viewModel=new a,this._clickTask=null,this._handleClick=t=>{this._clickTask?.abort(),this._clickTask=i((async i=>{const r=t.target;if(!this.navigate||!this.currentNode)return;await e((()=>"compiled"===this.viewModel.state),{signal:i});const s=r.getAttribute("data-direction");o(i),await this.navigate(this.currentNode,{direction:s,signal:i})}))}}loadDependencies(){return l({icon:()=>import("@esri/calcite-components/dist/components/calcite-icon")})}set currentNode(t){this.viewModel.currentNode=t}get currentNode(){return this.viewModel.currentNode}get nodes(){return this.viewModel.nodes}set nodes(t){this.viewModel.nodes=t}render(){const{currentNode:t}=this;if(!t)return null;const{currentHeading:i}=t,o={"--rotate-transform":` rotate(${-i}deg)`},e=t=>{const o=(t-(i??0)+360)%360;return o<45||o>=315?"towards":o>=135&&o<225?"backwards":o>=45&&o<135?"right":"left"},r=e(0),s=e(90),n=e(180),a=e(270);return d("div",{class:c.navigationUI},d("div",{class:c.navigationDirectionPad,styles:o},t[r]?d("calcite-icon",{class:this.classes(c.navigationDirection,c.navigationTop),"data-direction":r,icon:"chevron-up",key:"chevron-up",onclick:this._handleClick}):null,t[s]?d("calcite-icon",{class:this.classes(c.navigationDirection,c.navigationRight),"data-direction":s,icon:"chevron-right",key:"chevron-right",onclick:this._handleClick}):null,t[n]?d("calcite-icon",{class:this.classes(c.navigationDirection,c.navigationBottom),"data-direction":n,icon:"chevron-down",key:"chevron-down",onclick:this._handleClick}):null,t[a]?d("calcite-icon",{class:this.classes(c.navigationDirection,c.navigationLeft),"data-direction":a,icon:"chevron-left",key:"chevron-left",onclick:this._handleClick}):null))}};t([r()],p.prototype,"currentNode",null),t([r()],p.prototype,"navigate",void 0),t([r({nonNullable:!0})],p.prototype,"nodes",null),t([r()],p.prototype,"viewModel",void 0),t([r()],p.prototype,"_clickTask",void 0),p=t([s("esri.widgets.OrientedImageryViewer.components.NavigationUI360")],p);const h=p;export{h as default};