1 line
5.5 KiB
JavaScript
1 line
5.5 KiB
JavaScript
"use strict";(self.webpackChunk_farmos_org_farmos_map=self.webpackChunk_farmos_org_farmos_map||[]).push([[103],{856:(e,t,a)=>{a.r(t),a.d(t,{default:()=>_});var n=a(8714),s=a(8775),i=a(245);const l=(e,t,a)=>{const n=document.createElement(e);return Object.entries(t||{}).forEach((([e,t])=>n.setAttribute(e,t))),a&&a(n),n};var h=a(2971);class d extends h.Z{constructor({sidePanel:e,paneId:t,paneUniqId:a,name:s,icon:i,weight:h}){super({name:s,icon:i,weight:h}),this.sidePanel_=e,this.paneId_=t,this.paneUniqId_=a,this.element_=l("div",{id:`ol-side-panel-pane-${this.paneUniqId_}`,role:"tabpanel",class:"ol-side-panel-pane",tabindex:"0","aria-labelledby":`ol-side-panel-tab-${this.paneUniqId_}`}),this.headerElement_=l("h1",{class:"ol-side-panel-header"}),this.element_.appendChild(this.headerElement_),this.headerElementText_=document.createElement("span"),this.headerElementText_.innerHTML=this.get("name"),this.headerElement_.appendChild(this.headerElementText_),this.headerElementCloser_=l("span",{class:"ol-side-panel-close"}),this.headerElementCloser_.innerHTML="«",this.headerElement_.appendChild(this.headerElementCloser_),this.headerElementCloser_.addEventListener("click",(e=>{e.preventDefault(),this.set("active",!1)})),this.on("change:name",(()=>{this.headerElementText_.innerHTML=this.get("name")})),this.widgets=new n.Z,this.widgets.on("add",(e=>this.element_.appendChild(e.element.element_))),this.widgets.on("remove",(e=>this.element_.removeChild(e.element.element_))),this.on("change:active",(()=>{this.get("active")?-1===this.element_.className.search(/\bactive\b/)&&(this.element_.className+=" active"):this.element_.className=this.element_.className.replace(/\s*\bactive\b/g,"")}))}remove(){this.sidePanel_.removePane_(this),this.sidePanel_=void 0}addWidgetElement(e){const t=new class{constructor({pane:e,element:t}){this.pane_=e,this.element_=t}remove(){this.pane_.removeWidget_(this),this.pane_=void 0}}({pane:this,element:e});return this.widgets.push(t),t}removeWidget_(e){this.widgets.remove(e)}}const p=d;class r{constructor({pane:e}){this.pane_=e,this.element_=l("button",{id:`ol-side-panel-tab-${this.pane_.paneUniqId_}`,role:"tab","aria-controls":`ol-side-panel-pane-${this.pane_.paneUniqId_}`}),this.updateName_(),this.updateIcon_(),this.updateWeight_(),this.pane_.on("change:name",(()=>this.updateName_())),this.pane_.on("change:icon",(()=>this.updateIcon_())),this.pane_.on("change:weight",(()=>this.updateWeight_())),this.pane_.on("change:active",(()=>{const e=this.pane_.get("active");e?-1===this.element_.className.search(/\bactive\b/)&&(this.element_.className+=" active"):this.element_.className=this.element_.className.replace(/\s*\bactive\b/g,""),this.element_.setAttribute("aria-selected",e?"true":"false")})),this.element_.addEventListener("click",(e=>{e.preventDefault(),this.pane_.set("active",!this.pane_.get("active")),this.element_.blur()}))}static fromPane(e){const t=new r({pane:e});return e.tabRef_=t,t}updateName_(){const e=this.pane_.get("name");this.element_.setAttribute("aria-label",`Tab for map side pane: '${e}'`)}updateIcon_(){this.element_.innerHTML=this.pane_.get("icon")}updateWeight_(){this.element_.style.order=this.pane_.get("weight")}}const c=r;class o extends s.default{constructor(){super({element:document.createElement("div"),activePane:null});const{element:e}=this;e.className=`ol-side-panel ${i.XV} ${i.hg}`,window.nextOlSidePanelPaneUniqId=window.nextOlSidePanelPaneUniqId||0,this.panes=new n.Z,e.appendChild(l("div",{class:"ol-side-panel-tabs",role:"tablist"},(e=>{this.panes.on("add",(t=>{const a=t.element;e.appendChild(c.fromPane(a).element_),a.on("change:active",(()=>{a.get("active")||a!==this.get("activePane")?a.get("active")&&this.updateActivePane_(a):this.updateActivePane_(null)}))})),this.panes.on("remove",(t=>{e.removeChild(t.element.tabRef_.element_)})),e.appendChild(l("div",{class:"ol-side-panel-tabs-separator"}))}))),e.appendChild(l("div",{class:"ol-side-panel-content"},(e=>{this.panes.on("add",(t=>e.appendChild(t.element.element_))),this.panes.on("remove",(t=>{e.removeChild(t.element.element_),t.element===this.get("activePane")&&this.updateActivePane_(null)}))}))),this.on("change:activePane",(()=>{this.get("activePane")?this.getMap().getTargetElement().className=this.getMap().getTargetElement().className.replace(/\bol-side-panel-collapsed\b/g,""):-1===this.getMap().getTargetElement().className.search(/\bol-side-panel-collapsed\b/)&&(this.getMap().getTargetElement().className+=" ol-side-panel-collapsed")}))}definePane({paneId:e,name:t,icon:a,weight:n}){const s=window.nextOlSidePanelPaneUniqId++,i=new p({paneId:e,paneUniqId:s,name:t,icon:a,weight:n});return this.panes.push(i),i}getPaneById(e){return this.panes.getArray().find((t=>t.paneId_===e))}removePaneById(e){this.removePane_(this.getPaneById(e))}removePane_(e){this.panes.remove(e)}addWidgetElement(e,t){return this.getPane(e).addWidgetElement(t)}updateActivePane_(e){this.set("activePane",e),this.panes.getArray().filter((t=>t!==e)).forEach((e=>e.set("active",!1)))}setMap(e){const t=this.getMap();if(e===t)return;const a=e=>{e&&e.className.replace(/\bmap-with-ol-side-panel\b/g,"")},n=e=>{e&&(e.className+=" map-with-ol-side-panel ol-side-panel-collapsed")};if(t&&(a(t.getTargetElement()),this.onMapTargetChange&&(t.un("change:target",this.onMapTargetChange.listener),this.onMapTargetChange=null)),super.setMap(e),e){n(e.getTargetElement());const t=t=>{a(t.oldValue),n(e.getTargetElement())};this.onMapTargetChange=e.getInteractions().on("change:target",t)}}}const m=o,_={attach(e){e.sidePanel=new m,e.map.addControl(e.sidePanel)}}}}]); |