"use strict";(self.webpackChunk_aidoop_aidoop_r=self.webpackChunk_aidoop_aidoop_r||[]).push([[6240],{16441:(t,i,e)=>{var o=e(50493),s=(e(44394),e(77198),e(16682)),r=e(94430),n=e(56765),a=e(85848),h=e(27805);let p=class extends r.oi{constructor(){super(...arguments),this.creatable=!1,this.boards=[],this.favorites=[],this.groups=[],this.reorderable=!1}connectedCallback(){super.connectedCallback(),this.reorderable&&(this.renderRoot.addEventListener("dragstart",(t=>{var i;const e=t.target;this.draggedItem=e.closest("[card]"),null===(i=t.dataTransfer)||void 0===i||i.setData("text/plain",e.innerHTML)})),this.renderRoot.addEventListener("dragover",(t=>{t.preventDefault();const i=t.target.closest("[card]");if(i&&i!==this.draggedItem){const e=i.getBoundingClientRect();t.clientX-e.left<e.width/2?this.renderRoot.insertBefore(this.draggedItem,i):this.renderRoot.insertBefore(this.draggedItem,i.nextSibling)}})),this.renderRoot.addEventListener("drop",(t=>{t.preventDefault();const i=Array.from(this.renderRoot.querySelectorAll("[card]")).map((t=>t.getAttribute("id"))).filter(Boolean);this.dispatchEvent(new CustomEvent("reordered",{detail:{groupId:this.group,boardIds:i}}))})))}render(){var t=this.boards||[];return r.dy`
      ${this.creatable?r.dy`
            <ox-board-creation-card
              .groups=${this.groups}
              .defaultGroup=${this.group}
              @create-board=${t=>this.onCreateBoard(t)}
              card
              create
            ></ox-board-creation-card>
          `:r.dy``}
      ${(0,a.U)(Date.now(),t.map((t=>r.dy`
              <div card draggable="true" id=${t.id}>
                <a href="board-viewer/${t.id}"> <img src=${t.thumbnail} /> </a>

                <div name>${t.name}</div>
                <!-- <div description>${t.description}</div> -->

                <mwc-icon
                  iconBtn
                  info
                  @click=${i=>{this.infoBoard(t),i.preventDefault()}}
                  >info</mwc-icon
                >

                ${(this.favorites||[]).includes(t.id)?r.dy` <mwc-icon iconBtn favored @click=${i=>this.removeFavorite(t.id)}>star</mwc-icon> `:r.dy` <mwc-icon iconBtn @click=${i=>this.addFavorite(t.id)}>star_border</mwc-icon> `}
              </div>
            `)))}
    `}updated(t){var i=this.renderRoot.querySelector("ox-board-creation-card");i&&i.reset()}onCreateBoard(t){this.dispatchEvent(new CustomEvent("create-board",{detail:t.detail}))}infoBoard(t){this.dispatchEvent(new CustomEvent("info-board",{detail:t}))}async removeFavorite(t){await h.Lp.query({query:s.ZP`
        mutation {
          deleteFavorite(routing: "${t}")
        }
      `}),this.refreshFavorites()}async addFavorite(t){await h.Lp.query({query:s.ZP`
        mutation {
          createFavorite(favorite: {
            routing: "${t}"
          }) {
            id
            routing
          }
        }
      `}),this.refreshFavorites()}async refreshFavorites(){this.dispatchEvent(new CustomEvent("refresh-favorites"))}};p.styles=[r.iv`
      :host {
        overflow: auto;
        padding: var(--popup-content-padding);
        display: grid;

        grid-template-columns: var(--card-list-template);
        grid-auto-rows: var(--card-list-rows-height);
        grid-gap: 20px;
        --mdc-button-horizontal-padding: var(--padding-default);
      }

      [card] {
        position: relative;
        align-items: center;
        overflow: hidden;
      }

      [card][create] {
        overflow: visible;
        background-color: initial;
      }

      [card] > a {
        display: flex;
      }

      [card]:hover {
        cursor: pointer;
      }

      [name] {
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        margin-top: var(--margin-narrow);
        width: calc(100% - 45px);
        color: var(--primary-text-color);
        font-weight: bolder;
        font-size: var(--fontsize-small);
      }

      img {
        display: block;

        margin: auto;
        max-width: 100%;
        max-height: 100%;
      }

      mwc-icon[iconBtn] {
        float: right;
        margin-top: -20px;
        margin-left: 2px;
        color: var(--board-list-star-color);
        font-size: 1.4em;
      }
      mwc-icon[info] {
        color: var(--primary-color);
      }

      mwc-icon[iconBtn][favored],
      mwc-icon[info]:hover {
        color: var(--board-list-star-active-color);
      }

      a {
        display: block;
        border-radius: var(--card-list-border-radius);
        border: var(--border-dark-color);
        box-sizing: border-box;
        background-color: var(--card-list-background-color);
        margin: 0px;
        height: calc(100% - 25px);
      }

      :host > *:hover [info] {
        opacity: 1;
        -webkit-transition: opacity 0.8s;
        -moz-transition: opacity 0.8s;
        -o-transition: opacity 0.8s;
        transition: opacity 0.8s;
      }

      [draggable='true'] {
        cursor: grab;
      }

      @media screen and (max-width: 800px), screen and (max-height: 600px) {
        ox-board-creation-card {
          display: none;
        }
      }
    `],(0,o.gn)([(0,n.Cb)({type:Boolean,attribute:"creatable"}),(0,o.w6)("design:type",Boolean)],p.prototype,"creatable",void 0),(0,o.gn)([(0,n.Cb)({type:Array}),(0,o.w6)("design:type",Array)],p.prototype,"boards",void 0),(0,o.gn)([(0,n.Cb)({type:Array}),(0,o.w6)("design:type",Array)],p.prototype,"favorites",void 0),(0,o.gn)([(0,n.Cb)({type:Array}),(0,o.w6)("design:type",Array)],p.prototype,"groups",void 0),(0,o.gn)([(0,n.Cb)({type:String}),(0,o.w6)("design:type",String)],p.prototype,"group",void 0),(0,o.gn)([(0,n.Cb)({type:Boolean,attribute:"reorderable"}),(0,o.w6)("design:type",Boolean)],p.prototype,"reorderable",void 0),p=(0,o.gn)([(0,n.Mo)("board-tile-list")],p)},98491:(t,i,e)=>{e.d(i,{Z:()=>r});var o=e(51266);const s=t=>Math.max(t.offsetHeight,t.scrollHeight);class r{constructor(t={}){const i={content:t.viewport.children[0],direction:"all",pointerMode:"all",scrollMode:void 0,bounce:!0,bounceForce:.1,friction:.05,textSelection:!1,inputsFocus:!0,emulateScroll:!1,preventDefaultOnEmulateScroll:!1,preventPointerMoveDefault:!0,lockScrollOnDragDirection:!1,pointerDownPreventDefault:!0,dragDirectionTolerance:40,onPointerDown(){},onPointerUp(){},onPointerMove(){},onClick(){},onUpdate(){},onWheel(){},shouldScroll:()=>!0};if(this.props={...i,...t},!(this.props.viewport&&this.props.viewport instanceof Element))return void o.error('ScrollBooster init error: "viewport" config property must be present and must be Element');if(!this.props.content)return void o.error("ScrollBooster init error: Viewport does not have any content");this.isDragging=!1,this.isTargetScroll=!1,this.isScrolling=!1,this.isRunning=!1;const e={x:0,y:0};this.position={...e},this.velocity={...e},this.dragStartPosition={...e},this.dragOffset={...e},this.clientOffset={...e},this.dragPosition={...e},this.targetPosition={...e},this.scrollOffset={...e},this.rafID=null,this.events={},this.updateMetrics(),this.handleEvents()}updateOptions(t={}){this.props={...this.props,...t},this.props.onUpdate(this.getState()),this.startAnimationLoop()}updateMetrics(){var t;this.viewport={width:this.props.viewport.clientWidth,height:this.props.viewport.clientHeight},this.content={width:(t=this.props.content,Math.max(t.offsetWidth,t.scrollWidth)),height:s(this.props.content)},this.edgeX={from:Math.min(-this.content.width+this.viewport.width,0),to:0},this.edgeY={from:Math.min(-this.content.height+this.viewport.height,0),to:0},this.props.onUpdate(this.getState()),this.startAnimationLoop()}startAnimationLoop(){this.isRunning=!0,cancelAnimationFrame(this.rafID),this.rafID=requestAnimationFrame((()=>this.animate()))}animate(){if(!this.isRunning)return;this.updateScrollPosition(),this.isMoving()||(this.isRunning=!1,this.isTargetScroll=!1);const t=this.getState();this.setContentPosition(t),this.props.onUpdate(t),this.rafID=requestAnimationFrame((()=>this.animate()))}updateScrollPosition(){this.applyEdgeForce(),this.applyDragForce(),this.applyScrollForce(),this.applyTargetForce();const t=1-this.props.friction;this.velocity.x*=t,this.velocity.y*=t,"vertical"!==this.props.direction&&(this.position.x+=this.velocity.x),"horizontal"!==this.props.direction&&(this.position.y+=this.velocity.y),this.props.bounce&&!this.isScrolling||this.isTargetScroll||(this.position.x=Math.max(Math.min(this.position.x,this.edgeX.to),this.edgeX.from),this.position.y=Math.max(Math.min(this.position.y,this.edgeY.to),this.edgeY.from))}applyForce(t){this.velocity.x+=t.x,this.velocity.y+=t.y}applyEdgeForce(){if(!this.props.bounce||this.isDragging)return;const t=this.position.x<this.edgeX.from,i=this.position.x>this.edgeX.to,e=this.position.y<this.edgeY.from,o=this.position.y>this.edgeY.to,s=t||i,r=e||o;if(!s&&!r)return;const n=t?this.edgeX.from:this.edgeX.to,a=e?this.edgeY.from:this.edgeY.to,h=n-this.position.x,p=a-this.position.y,c={x:h*this.props.bounceForce,y:p*this.props.bounceForce},l=this.position.x+(this.velocity.x+c.x)/this.props.friction,d=this.position.y+(this.velocity.y+c.y)/this.props.friction;(t&&l>=this.edgeX.from||i&&l<=this.edgeX.to)&&(c.x=h*this.props.bounceForce-this.velocity.x),(e&&d>=this.edgeY.from||o&&d<=this.edgeY.to)&&(c.y=p*this.props.bounceForce-this.velocity.y),this.applyForce({x:s?c.x:0,y:r?c.y:0})}applyDragForce(){if(!this.isDragging)return;const t=this.dragPosition.x-this.position.x,i=this.dragPosition.y-this.position.y;this.applyForce({x:t-this.velocity.x,y:i-this.velocity.y})}applyScrollForce(){this.isScrolling&&(this.applyForce({x:this.scrollOffset.x-this.velocity.x,y:this.scrollOffset.y-this.velocity.y}),this.scrollOffset.x=0,this.scrollOffset.y=0)}applyTargetForce(){this.isTargetScroll&&this.applyForce({x:.08*(this.targetPosition.x-this.position.x)-this.velocity.x,y:.08*(this.targetPosition.y-this.position.y)-this.velocity.y})}isMoving(){return this.isDragging||this.isScrolling||Math.abs(this.velocity.x)>=.01||Math.abs(this.velocity.y)>=.01}scrollTo(t={}){this.isTargetScroll=!0,this.targetPosition.x=-t.x||0,this.targetPosition.y=-t.y||0,this.startAnimationLoop()}setPosition(t={}){this.velocity.x=0,this.velocity.y=0,this.position.x=-t.x||0,this.position.y=-t.y||0,this.startAnimationLoop()}getState(){return{isMoving:this.isMoving(),isDragging:!(!this.dragOffset.x&&!this.dragOffset.y),position:{x:-this.position.x,y:-this.position.y},dragOffset:this.dragOffset,dragAngle:this.getDragAngle(this.clientOffset.x,this.clientOffset.y),borderCollision:{left:this.position.x>=this.edgeX.to,right:this.position.x<=this.edgeX.from,top:this.position.y>=this.edgeY.to,bottom:this.position.y<=this.edgeY.from}}}getDragAngle(t,i){return Math.round(Math.atan2(t,i)*(180/Math.PI))}getDragDirection(t,i){return Math.abs(90-Math.abs(t))<=90-i?"horizontal":"vertical"}setContentPosition(t){"transform"===this.props.scrollMode&&(this.props.content.style.transform=`translate(${-t.position.x}px, ${-t.position.y}px)`),"native"===this.props.scrollMode&&(this.props.viewport.scrollTop=t.position.y,this.props.viewport.scrollLeft=t.position.x)}handleEvents(){const t={x:0,y:0},i={x:0,y:0};let e=null,o=null,s=!1;const r=o=>{if(!this.isDragging)return;const r=s?o.touches[0]:o,{pageX:n,pageY:a,clientX:h,clientY:p}=r;this.dragOffset.x=n-t.x,this.dragOffset.y=a-t.y,this.clientOffset.x=h-i.x,this.clientOffset.y=p-i.y,(Math.abs(this.clientOffset.x)>5&&!e||Math.abs(this.clientOffset.y)>5&&!e)&&(e=this.getDragDirection(this.getDragAngle(this.clientOffset.x,this.clientOffset.y),this.props.dragDirectionTolerance)),this.props.lockScrollOnDragDirection&&"all"!==this.props.lockScrollOnDragDirection?e===this.props.lockScrollOnDragDirection&&s?(this.dragPosition.x=this.dragStartPosition.x+this.dragOffset.x,this.dragPosition.y=this.dragStartPosition.y+this.dragOffset.y):s?(this.dragPosition.x=this.dragStartPosition.x,this.dragPosition.y=this.dragStartPosition.y):(this.dragPosition.x=this.dragStartPosition.x+this.dragOffset.x,this.dragPosition.y=this.dragStartPosition.y+this.dragOffset.y):(this.dragPosition.x=this.dragStartPosition.x+this.dragOffset.x,this.dragPosition.y=this.dragStartPosition.y+this.dragOffset.y)};this.events.pointerdown=e=>{s=!(!e.touches||!e.touches[0]),this.props.onPointerDown(this.getState(),e,s);const o=s?e.touches[0]:e,{pageX:n,pageY:a,clientX:h,clientY:p}=o,{viewport:c}=this.props,l=c.getBoundingClientRect();if(h-l.left>=c.clientLeft+c.clientWidth)return;if(p-l.top>=c.clientTop+c.clientHeight)return;if(!this.props.shouldScroll(this.getState(),e))return;if(2===e.button)return;if("mouse"===this.props.pointerMode&&s)return;if("touch"===this.props.pointerMode&&!s)return;if(!(this.props.inputsFocus&&["input","textarea","button","select","label"].indexOf(e.target.nodeName.toLowerCase())>-1)){if(this.props.textSelection){const t=((t,i,e)=>{const o=t.childNodes,s=document.createRange();for(let t=0;t<o.length;t++){const r=o[t];if(3!==r.nodeType)continue;s.selectNodeContents(r);const n=s.getBoundingClientRect();if(i>=n.left&&e>=n.top&&i<=n.right&&e<=n.bottom)return r}return!1})(e.target,h,p);if(t)return;(()=>{const t=window.getSelection?window.getSelection():document.selection;t&&(t.removeAllRanges?t.removeAllRanges():t.empty&&t.empty())})()}this.isDragging=!0,t.x=n,t.y=a,i.x=h,i.y=p,this.dragStartPosition.x=this.position.x,this.dragStartPosition.y=this.position.y,r(e),this.startAnimationLoop(),!s&&this.props.pointerDownPreventDefault&&e.preventDefault()}},this.events.pointermove=t=>{!t.cancelable||"all"!==this.props.lockScrollOnDragDirection&&this.props.lockScrollOnDragDirection!==e||t.preventDefault(),r(t),this.props.onPointerMove(this.getState(),t,s)},this.events.pointerup=t=>{this.isDragging=!1,e=null,this.props.onPointerUp(this.getState(),t,s)},this.events.wheel=t=>{const i=this.getState();this.props.emulateScroll&&(this.velocity.x=0,this.velocity.y=0,this.isScrolling=!0,this.scrollOffset.x=-t.deltaX,this.scrollOffset.y=-t.deltaY,this.props.onWheel(i,t),this.startAnimationLoop(),clearTimeout(o),o=setTimeout((()=>this.isScrolling=!1),80),this.props.preventDefaultOnEmulateScroll&&this.getDragDirection(this.getDragAngle(-t.deltaX,-t.deltaY),this.props.dragDirectionTolerance)===this.props.preventDefaultOnEmulateScroll&&t.preventDefault())},this.events.scroll=()=>{const{scrollLeft:t,scrollTop:i}=this.props.viewport;Math.abs(this.position.x+t)>3&&(this.position.x=-t,this.velocity.x=0),Math.abs(this.position.y+i)>3&&(this.position.y=-i,this.velocity.y=0)},this.events.click=t=>{const i=this.getState(),e="vertical"!==this.props.direction?i.dragOffset.x:0,o="horizontal"!==this.props.direction?i.dragOffset.y:0;Math.max(Math.abs(e),Math.abs(o))>5&&(t.preventDefault(),t.stopPropagation()),this.props.onClick(i,t,s)},this.events.contentLoad=()=>this.updateMetrics(),this.events.resize=()=>this.updateMetrics(),this.props.viewport.addEventListener("mousedown",this.events.pointerdown),this.props.viewport.addEventListener("touchstart",this.events.pointerdown,{passive:!1}),this.props.viewport.addEventListener("click",this.events.click),this.props.viewport.addEventListener("wheel",this.events.wheel,{passive:!1}),this.props.viewport.addEventListener("scroll",this.events.scroll),this.props.content.addEventListener("load",this.events.contentLoad,!0),window.addEventListener("mousemove",this.events.pointermove),window.addEventListener("touchmove",this.events.pointermove,{passive:!1}),window.addEventListener("mouseup",this.events.pointerup),window.addEventListener("touchend",this.events.pointerup),window.addEventListener("resize",this.events.resize)}destroy(){this.props.viewport.removeEventListener("mousedown",this.events.pointerdown),this.props.viewport.removeEventListener("touchstart",this.events.pointerdown),this.props.viewport.removeEventListener("click",this.events.click),this.props.viewport.removeEventListener("wheel",this.events.wheel),this.props.viewport.removeEventListener("scroll",this.events.scroll),this.props.content.removeEventListener("load",this.events.contentLoad),window.removeEventListener("mousemove",this.events.pointermove),window.removeEventListener("touchmove",this.events.pointermove),window.removeEventListener("mouseup",this.events.pointerup),window.removeEventListener("touchend",this.events.pointerup),window.removeEventListener("resize",this.events.resize)}}}}]);