1 line
54 KiB
JavaScript
1 line
54 KiB
JavaScript
import{d as e,c as t,a as n,w as l,b as i,r as o,o as a,e as s,t as r,F as d,f as c,g as u,h as g,v as p,i as h,j as m,k as y,l as f,m as w,n as v,p as b,q as x,s as C}from"./vendor.b622ee49.js";var k=e({name:"app",computed:{showNav(){return!["game","replay"].includes(String(this.$route.name))}}});const A={id:"app"},T={key:0,class:"nav"},S=s("Index"),z=s("New game");k.render=function(e,s,r,d,c,u){const g=o("router-link"),p=o("router-view");return a(),t("div",A,[e.showNav?(a(),t("ul",T,[n("li",null,[n(g,{class:"btn",to:{name:"index"}},{default:l((()=>[S])),_:1})]),n("li",null,[n(g,{class:"btn",to:{name:"new-game"}},{default:l((()=>[z])),_:1})])])):i("",!0),n(p)])};const I=864e5,P=e=>{const t=Math.floor(e/I);e%=I;const n=Math.floor(e/36e5);e%=36e5;const l=Math.floor(e/6e4);e%=6e4;return`${t}d ${n}h ${l}m ${Math.floor(e/1e3)}s`};var _=1e3,D=()=>{const e=new Date;return Date.UTC(e.getUTCFullYear(),e.getUTCMonth(),e.getUTCDate(),e.getUTCHours(),e.getUTCMinutes(),e.getUTCSeconds(),e.getUTCMilliseconds())},B=(e,t)=>P(t-e),E=P,O=e({name:"game-teaser",props:{game:{type:Object,required:!0}},computed:{style(){return{"background-image":`url("${this.game.imageUrl.replace("uploads/","uploads/r/")+"-375x210.webp"}")`}}},methods:{time(e,t){const n=t?"🏁":"⏳",l=e,i=t||D();return`${n} ${B(l,i)}`}}});const U={class:"game-info-text"},N=n("br",null,null,-1),M=n("br",null,null,-1),G=n("br",null,null,-1);O.render=function(e,d,c,u,g,p){const h=o("router-link");return a(),t("div",{class:"game-teaser",style:e.style},[n(h,{class:"game-info",to:{name:"game",params:{id:e.game.id}}},{default:l((()=>[n("span",U,[s(" 🧩 "+r(e.game.tilesFinished)+"/"+r(e.game.tilesTotal),1),N,s(" 👥 "+r(e.game.players),1),M,s(" "+r(e.time(e.game.started,e.game.finished)),1),G])])),_:1},8,["to"]),i("",!0)],4)};var $=e({components:{GameTeaser:O},data:()=>({gamesRunning:[],gamesFinished:[]}),async created(){const e=await fetch("/api/index-data"),t=await e.json();this.gamesRunning=t.gamesRunning,this.gamesFinished=t.gamesFinished}});const R=n("h1",null,"Running games",-1),V=n("h1",null,"Finished games",-1);$.render=function(e,l,i,s,r,u){const g=o("game-teaser");return a(),t("div",null,[R,(a(!0),t(d,null,c(e.gamesRunning,((e,l)=>(a(),t("div",{class:"game-teaser-wrap",key:l},[n(g,{game:e},null,8,["game"])])))),128)),V,(a(!0),t(d,null,c(e.gamesFinished,((e,l)=>(a(),t("div",{class:"game-teaser-wrap",key:l},[n(g,{game:e},null,8,["game"])])))),128))])};var j=e({name:"image-teaser",props:{image:{type:Object,required:!0}},computed:{style(){return{backgroundImage:`url("${this.image.url.replace("uploads/","uploads/r/")+"-150x100.webp"}")`}}},emits:{click:null,editClick:null},methods:{onClick(){this.$emit("click")},onEditClick(){this.$emit("editClick")}}});j.render=function(e,l,i,o,s,r){return a(),t("div",{class:"imageteaser",style:e.style,onClick:l[2]||(l[2]=(...t)=>e.onClick&&e.onClick(...t))},[n("div",{class:"btn edit",onClick:l[1]||(l[1]=u(((...t)=>e.onEditClick&&e.onEditClick(...t)),["stop"]))},"✏️")],4)};var F=e({name:"image-library",components:{ImageTeaser:j},props:{images:{type:Array,required:!0}},emits:{imageClicked:null,imageEditClicked:null},methods:{imageClicked(e){this.$emit("imageClicked",e)},imageEditClicked(e){this.$emit("imageEditClicked",e)}}});F.render=function(e,n,l,i,s,r){const u=o("image-teaser");return a(),t("div",null,[(a(!0),t(d,null,c(e.images,((n,l)=>(a(),t(u,{image:n,onClick:t=>e.imageClicked(n),onEditClick:t=>e.imageEditClicked(n),key:l},null,8,["image","onClick","onEditClick"])))),128))])};const L={name:"responsive-image",props:{src:String,title:{type:String,default:""},height:{type:String,default:"100%"},width:{type:String,default:"100%"}},computed:{style(){return{display:"inline-block",verticalAlign:"text-bottom",backgroundImage:`url('${this.src}')`,backgroundRepeat:"no-repeat",backgroundSize:"contain",backgroundPosition:"center",width:this.width,height:this.height}}}};L.render=function(e,n,l,i,o,s){return a(),t("div",{style:s.style,title:l.title},null,12,["title"])};var W=e({name:"tags-input",props:{modelValue:{type:Array,required:!0}},emits:{"update:modelValue":null},data:()=>({input:"",values:[]}),created(){this.values=this.modelValue},methods:{onKeyUp(e){if(","===e.key)return this.add(),e.stopPropagation(),!1},add(){const e=this.input.replace(/,/g,"").trim();e&&(this.values.includes(e)||this.values.push(e),this.input="",this.$emit("update:modelValue",this.values))},rm(e){this.values=this.values.filter((t=>t!==e)),this.$emit("update:modelValue",this.values)}}});const H=m()(((e,l,i,o,s,u)=>(a(),t("div",null,[g(n("input",{class:"input",type:"text","onUpdate:modelValue":l[1]||(l[1]=t=>e.input=t),placeholder:"Plants, People",onKeydown:l[2]||(l[2]=h(((...t)=>e.add&&e.add(...t)),["enter"])),onKeyup:l[3]||(l[3]=(...t)=>e.onKeyUp&&e.onKeyUp(...t))},null,544),[[p,e.input]]),(a(!0),t(d,null,c(e.values,((n,l)=>(a(),t("span",{key:l,class:"bit",onClick:t=>e.rm(n)},r(n)+" ✖",9,["onClick"])))),128))]))));W.render=H,W.__scopeId="data-v-771460ae";var Q=e({name:"new-image-dialog",components:{ResponsiveImage:L,TagsInput:W},emits:{bgclick:null,setupGameClick:null,postToGalleryClick:null},data:()=>({previewUrl:"",file:null,title:"",tags:[]}),computed:{canPostToGallery(){return!(!this.previewUrl||!this.file)},canSetupGameClick(){return!(!this.previewUrl||!this.file)}},methods:{preview(e){const t=e.target;if(!t.files)return;const n=t.files[0];if(!n)return;const l=new FileReader;l.readAsDataURL(n),l.onload=e=>{this.previewUrl=e.target.result,this.file=n}},postToGallery(){this.$emit("postToGalleryClick",{file:this.file,title:this.title,tags:this.tags})},setupGameClick(){this.$emit("setupGameClick",{file:this.file,title:this.title,tags:this.tags})}}});const Y={key:0,class:"has-image"},q={key:1},K={class:"upload"},Z=n("span",{class:"btn"},"Upload File",-1),J={class:"area-settings"},X=n("td",null,[n("label",null,"Title")],-1),ee=n("tr",null,[n("td",{colspan:"2"},[n("div",{class:"hint"},"Feel free to leave a credit to the artist/photographer in the title :)")])],-1),te=n("td",null,[n("label",null,"Tags")],-1),ne={class:"area-buttons"},le=s("🧩 Post to gallery "),ie=n("br",null,null,-1),oe=s(" + set up game");Q.render=function(e,l,i,s,r,d){const c=o("responsive-image"),h=o("tags-input");return a(),t("div",{class:"overlay new-image-dialog",onClick:l[8]||(l[8]=t=>e.$emit("bgclick"))},[n("div",{class:"overlay-content",onClick:l[7]||(l[7]=u((()=>{}),["stop"]))},[n("div",{class:["area-image",{"has-image":!!e.previewUrl,"no-image":!e.previewUrl}]},[e.previewUrl?(a(),t("div",Y,[n("span",{class:"remove btn",onClick:l[1]||(l[1]=t=>e.previewUrl="")},"X"),n(c,{src:e.previewUrl},null,8,["src"])])):(a(),t("div",q,[n("label",K,[n("input",{type:"file",style:{display:"none"},onChange:l[2]||(l[2]=(...t)=>e.preview&&e.preview(...t)),accept:"image/*"},null,32),Z])]))],2),n("div",J,[n("table",null,[n("tr",null,[X,n("td",null,[g(n("input",{type:"text","onUpdate:modelValue":l[3]||(l[3]=t=>e.title=t),placeholder:"Flower by @artist"},null,512),[[p,e.title]])])]),ee,n("tr",null,[te,n("td",null,[n(h,{modelValue:e.tags,"onUpdate:modelValue":l[4]||(l[4]=t=>e.tags=t)},null,8,["modelValue"])])])])]),n("div",ne,[n("button",{class:"btn",disabled:!e.canPostToGallery,onClick:l[5]||(l[5]=(...t)=>e.postToGallery&&e.postToGallery(...t))},"🖼️ Post to gallery",8,["disabled"]),n("button",{class:"btn",disabled:!e.canSetupGameClick,onClick:l[6]||(l[6]=(...t)=>e.setupGameClick&&e.setupGameClick(...t))},[le,ie,oe],8,["disabled"])])])])};var ae=e({name:"edit-image-dialog",components:{ResponsiveImage:L,TagsInput:W},props:{image:{type:Object,required:!0}},emits:{bgclick:null,saveClick:null},data:()=>({title:"",tags:[]}),created(){this.title=this.image.title,this.tags=this.image.tags.map((e=>e.title))},methods:{saveImage(){this.$emit("saveClick",{id:this.image.id,title:this.title,tags:this.tags})}}});const se={class:"area-image"},re={class:"has-image"},de={class:"area-settings"},ce=n("td",null,[n("label",null,"Title")],-1),ue=n("tr",null,[n("td",{colspan:"2"},[n("div",{class:"hint"},"Feel free to leave a credit to the artist/photographer in the title :)")])],-1),ge=n("td",null,[n("label",null,"Tags")],-1),pe={class:"area-buttons"};function he(e,t){const n=e.x-t.x,l=e.y-t.y;return Math.sqrt(n*n+l*l)}function me(e){return{x:e.x+e.w/2,y:e.y+e.h/2}}ae.render=function(e,l,i,s,r,d){const c=o("responsive-image"),h=o("tags-input");return a(),t("div",{class:"overlay edit-image-dialog",onClick:l[5]||(l[5]=t=>e.$emit("bgclick"))},[n("div",{class:"overlay-content",onClick:l[4]||(l[4]=u((()=>{}),["stop"]))},[n("div",se,[n("div",re,[n(c,{src:e.image.url,title:e.image.title},null,8,["src","title"])])]),n("div",de,[n("table",null,[n("tr",null,[ce,n("td",null,[g(n("input",{type:"text","onUpdate:modelValue":l[1]||(l[1]=t=>e.title=t),placeholder:"Flower by @artist"},null,512),[[p,e.title]])])]),ue,n("tr",null,[ge,n("td",null,[n(h,{modelValue:e.tags,"onUpdate:modelValue":l[2]||(l[2]=t=>e.tags=t)},null,8,["modelValue"])])])])]),n("div",pe,[n("button",{class:"btn",onClick:l[3]||(l[3]=(...t)=>e.saveImage&&e.saveImage(...t))},"🖼️ Save image")])])])};var ye={pointSub:function(e,t){return{x:e.x-t.x,y:e.y-t.y}},pointAdd:function(e,t){return{x:e.x+t.x,y:e.y+t.y}},pointDistance:he,pointInBounds:function(e,t){return e.x>=t.x&&e.x<=t.x+t.w&&e.y>=t.y&&e.y<=t.y+t.h},rectCenter:me,rectMoved:function(e,t,n){return{x:e.x+t,y:e.y+n,w:e.w,h:e.h}},rectCenterDistance:function(e,t){return he(me(e),me(t))},rectsOverlap:function(e,t){return!(t.x>e.x+e.w||e.x>t.x+t.w||t.y>e.y+e.h||e.y>t.y+t.h)}};var fe=1,we=4,ve=5,be=2,xe=3,Ce=6,ke=2,Ae=4,Te=3,Se=9,ze=1,Ie=2,Pe=3,_e=4,De=5,Be=6,Ee=7,Oe=8,Ue=10,Ne=1,Me=2,Ge=3;class $e{constructor(e){this.rand_high=e||3735929054,this.rand_low=1231121986^e}random(e,t){return this.rand_high=(this.rand_high<<16)+(this.rand_high>>16)+this.rand_low&4294967295,this.rand_low=this.rand_low+this.rand_high&4294967295,e+(this.rand_high>>>0)/4294967295*(t-e+1)|0}choice(e){return e[this.random(0,e.length-1)]}shuffle(e){const t=e.slice();for(let n=0;n<=t.length-2;n++){const e=this.random(n,t.length-1),l=t[n];t[n]=t[e],t[e]=l}return t}static serialize(e){return{rand_high:e.rand_high,rand_low:e.rand_low}}static unserialize(e){const t=new $e(0);return t.rand_high=e.rand_high,t.rand_low=e.rand_low,t}}const Re=(e,t)=>{const n=`${e}`;return n.length>=t.length?n:t.substr(0,t.length-n.length)+n},Ve=(...e)=>{const t=t=>(...n)=>{const l=new Date,i=Re(l.getHours(),"00"),o=Re(l.getMinutes(),"00"),a=Re(l.getSeconds(),"00");console[t](`${i}:${o}:${a}`,...e,...n)};return{log:t("log"),error:t("error"),info:t("info")}};var je,Fe,Le,We,He={hash:e=>{let t=0;for(let n=0;n<e.length;n++){t=(t<<5)-t+e.charCodeAt(n),t|=0}return t},slug:e=>{let t=e.toLowerCase();return t=t.replace(/[^a-z0-9]+/g,"-"),t=t.replace(/^-|-$/,""),t},uniqId:()=>Date.now().toString(36)+Math.random().toString(36).substring(2),encodeShape:function(e){return e.top+1<<0|e.right+1<<2|e.bottom+1<<4|e.left+1<<6},decodeShape:function(e){return{top:(e>>0&3)-1,right:(e>>2&3)-1,bottom:(e>>4&3)-1,left:(e>>6&3)-1}},encodeTile:function(e){return[e.idx,e.pos.x,e.pos.y,e.z,e.owner,e.group]},decodeTile:function(e){return{idx:e[0],pos:{x:e[1],y:e[2]},z:e[3],owner:e[4],group:e[5]}},encodePlayer:function(e){return[e.id,e.x,e.y,e.d,e.name,e.color,e.bgcolor,e.points,e.ts]},decodePlayer:function(e){return{id:e[0],x:e[1],y:e[2],d:e[3],name:e[4],color:e[5],bgcolor:e[6],points:e[7],ts:e[8]}},encodeGame:function(e){return Array.isArray(e)?e:[e.id,e.rng.type,$e.serialize(e.rng.obj),e.puzzle,e.players,e.evtInfos,e.scoreMode]},decodeGame:function(e){return Array.isArray(e)?{id:e[0],rng:{type:e[1],obj:$e.unserialize(e[2])},puzzle:e[3],players:e[4],evtInfos:e[5],scoreMode:e[6]}:e},coordByTileIdx:function(e,t){const n=e.width/e.tileSize;return{x:t%n,y:Math.floor(t/n)}},asQueryArgs:function(e){const t=[];for(let n in e){const l=[n,e[n]].map(encodeURIComponent);t.push(l.join("="))}return 0===t.length?"":`?${t.join("&")}`}};(Fe=je||(je={}))[Fe.Flat=0]="Flat",Fe[Fe.Out=1]="Out",Fe[Fe.In=-1]="In",(We=Le||(Le={}))[We.FINAL=0]="FINAL",We[We.ANY=1]="ANY";const Qe={};function Ye(e,t){return{id:e,x:0,y:0,d:0,name:null,color:null,bgcolor:null,points:0,ts:t}}function qe(e,t){let n=0;for(let l of Qe[e].players){if(He.decodePlayer(l).id===t)return n;n++}return-1}function Ke(e,t){const n=qe(e,t);return He.decodePlayer(Qe[e].players[n])}function Ze(e,t,n){const l=qe(e,t);-1===l?Qe[e].players.push(He.encodePlayer(n)):Qe[e].players[l]=He.encodePlayer(n)}function Je(e,t){return-1!==qe(e,t)}function Xe(e){return Qe[e]?Qe[e].players.map(He.decodePlayer):[]}function et(e){return Qe[e].puzzle.tiles.length}function tt(e){return Qe[e].scoreMode||0}function nt(e){return lt(e)===et(e)}function lt(e){let t=0;for(let n of Qe[e].puzzle.tiles)-1===He.decodeTile(n).owner&&t++;return t}function it(e,t,n){const l=Ke(e,t);for(let i of Object.keys(n))l[i]=n[i];Ze(e,t,l)}function ot(e,t){for(let n of Object.keys(t))Qe[e].puzzle.data[n]=t[n]}function at(e,t,n){for(let l of Object.keys(n)){const i=He.decodeTile(Qe[e].puzzle.tiles[t]);i[l]=n[l],Qe[e].puzzle.tiles[t]=He.encodeTile(i)}}const st=(e,t)=>He.decodeTile(Qe[e].puzzle.tiles[t]),rt=(e,t)=>st(e,t).group,dt=(e,t)=>{const n=Qe[e].puzzle.info,l={x:(n.table.width-n.width)/2,y:(n.table.height-n.height)/2},i=function(e,t){const n=Qe[e].puzzle.info,l=He.coordByTileIdx(n,t),i=l.x*n.tileSize,o=l.y*n.tileSize;return{x:i,y:o}}(e,t);return ye.pointAdd(l,i)},ct=(e,t)=>st(e,t).pos,ut=e=>{const t=St(e),n=zt(e),l=Math.round(t/4),i=Math.round(n/4);return{x:0-l,y:0-i,w:t+2*l,h:n+2*i}},gt=(e,t)=>{const n=yt(e),l=st(e,t);return{x:l.pos.x,y:l.pos.y,w:n,h:n}},pt=(e,t)=>st(e,t).z,ht=(e,t)=>{for(let n of Qe[e].puzzle.tiles){const e=He.decodeTile(n);if(e.owner===t)return e.idx}return-1},mt=e=>Qe[e].puzzle.info.tileDrawSize,yt=e=>Qe[e].puzzle.info.tileSize,ft=e=>Qe[e].puzzle.data.maxGroup,wt=e=>Qe[e].puzzle.data.maxZ;function vt(e,t){const n=Qe[e].puzzle.info,l=He.coordByTileIdx(n,t);return[l.y>0?t-n.tilesX:-1,l.x<n.tilesX-1?t+1:-1,l.y<n.tilesY-1?t+n.tilesX:-1,l.x>0?t-1:-1]}const bt=(e,t,n)=>{for(let l of t)at(e,l,{z:n})},xt=(e,t,n)=>{const l=ct(e,t);at(e,t,{pos:ye.pointAdd(l,n)})},Ct=(e,t,n)=>{const l=mt(e),i=ut(e),o=n;for(let a of t){const t=st(e,a);t.pos.x+n.x<i.x?o.x=Math.max(i.x-t.pos.x,o.x):t.pos.x+l+n.x>i.x+i.w&&(o.x=Math.min(i.x+i.w-t.pos.x+l,o.x)),t.pos.y+n.y<i.y?o.y=Math.max(i.y-t.pos.y,o.y):t.pos.y+l+n.y>i.y+i.h&&(o.y=Math.min(i.y+i.h-t.pos.y+l,o.y))}for(let a of t)xt(e,a,o)},kt=(e,t,n)=>{for(let l of t)at(e,l,{owner:n})};function At(e,t){const n=Qe[e].puzzle.tiles,l=He.decodeTile(n[t]),i=[];if(l.group)for(let o of n){const e=He.decodeTile(o);e.group===l.group&&i.push(e.idx)}else i.push(l.idx);return i}const Tt=(e,t)=>{const n=Ke(e,t);return n?n.points:0},St=e=>Qe[e].puzzle.info.table.width,zt=e=>Qe[e].puzzle.info.table.height;var It={__createPlayerObject:Ye,setGame:function(e,t){Qe[e]=t},exists:function(e){return!!Qe[e]||!1},playerExists:Je,getActivePlayers:function(e,t){const n=t-30*_;return Xe(e).filter((e=>e.ts>=n))},getIdlePlayers:function(e,t){const n=t-30*_;return Xe(e).filter((e=>e.ts<n&&e.points>0))},addPlayer:function(e,t,n){Je(e,t)?it(e,t,{ts:n}):Ze(e,t,Ye(t,n))},getFinishedTileCount:lt,getTileCount:et,getImageUrl:function(e){return Qe[e].puzzle.info.imageUrl},setImageUrl:function(e,t){Qe[e].puzzle.info.imageUrl=t},get:function(e){return Qe[e]},getAllGames:function(){return Object.values(Qe).sort(((e,t)=>nt(e.id)===nt(t.id)?t.puzzle.data.started-e.puzzle.data.started:nt(e.id)?1:-1))},getPlayerBgColor:(e,t)=>{const n=Ke(e,t);return n?n.bgcolor:null},getPlayerColor:(e,t)=>{const n=Ke(e,t);return n?n.color:null},getPlayerName:(e,t)=>{const n=Ke(e,t);return n?n.name:null},getPlayerIndexById:qe,getPlayerIdByIndex:function(e,t){return Qe[e].players.length>t?He.decodePlayer(Qe[e].players[t]).id:null},changePlayer:it,setPlayer:Ze,setTile:function(e,t,n){Qe[e].puzzle.tiles[t]=He.encodeTile(n)},setPuzzleData:function(e,t){Qe[e].puzzle.data=t},getTableWidth:St,getTableHeight:zt,getPuzzle:e=>Qe[e].puzzle,getRng:e=>Qe[e].rng.obj,getPuzzleWidth:e=>Qe[e].puzzle.info.width,getPuzzleHeight:e=>Qe[e].puzzle.info.height,getTilesSortedByZIndex:function(e){return Qe[e].puzzle.tiles.map(He.decodeTile).sort(((e,t)=>e.z-t.z))},getFirstOwnedTile:(e,t)=>{const n=ht(e,t);return n<0?null:Qe[e].puzzle.tiles[n]},getTileDrawOffset:e=>Qe[e].puzzle.info.tileDrawOffset,getTileDrawSize:mt,getFinalTilePos:dt,getStartTs:e=>Qe[e].puzzle.data.started,getFinishTs:e=>Qe[e].puzzle.data.finished,handleInput:function(e,t,n,l){const i=Qe[e].puzzle,o=function(e,t){return t in Qe[e].evtInfos?Qe[e].evtInfos[t]:{_last_mouse:null,_last_mouse_down:null}}(e,t),a=[],s=()=>{a.push([Ne,i.data])},r=t=>{a.push([Me,He.encodeTile(st(e,t))])},d=e=>{for(const t of e)r(t)},c=()=>{a.push([Ge,He.encodePlayer(Ke(e,t))])},u=n[0];if(u===Be){const i=n[1];it(e,t,{bgcolor:i,ts:l}),c()}else if(u===Ee){const i=n[1];it(e,t,{color:i,ts:l}),c()}else if(u===Oe){const i=`${n[1]}`.substr(0,16);it(e,t,{name:i,ts:l}),c()}else if(u===ze){const i={x:n[1],y:n[2]};it(e,t,{d:1,ts:l}),c(),o._last_mouse_down=i;const a=((e,t)=>{let n=Qe[e].puzzle.info,l=Qe[e].puzzle.tiles,i=-1,o=-1;for(let a=0;a<l.length;a++){const e=He.decodeTile(l[a]);if(0!==e.owner)continue;const s={x:e.pos.x,y:e.pos.y,w:n.tileSize,h:n.tileSize};ye.pointInBounds(t,s)&&(-1===i||e.z>i)&&(i=e.z,o=a)}return o})(e,i);if(a>=0){let n=wt(e)+1;ot(e,{maxZ:n}),s();const l=At(e,a);bt(e,l,wt(e)),kt(e,l,t),d(l)}o._last_mouse=i}else if(u===Pe){const i=n[1],a=n[2],s={x:i,y:a};if(null===o._last_mouse_down)it(e,t,{x:i,y:a,ts:l}),c();else{let n=ht(e,t);if(n>=0){it(e,t,{x:i,y:a,ts:l}),c();const r=At(e,n);let u=ye.pointInBounds(s,ut(e))&&ye.pointInBounds(o._last_mouse_down,ut(e));for(let t of r){const n=gt(e,t);if(ye.pointInBounds(s,n)){u=!0;break}}if(u){const t=i-o._last_mouse_down.x,n=a-o._last_mouse_down.y;Ct(e,r,{x:t,y:n}),d(r)}}else it(e,t,{ts:l}),c();o._last_mouse_down=s}o._last_mouse=s}else if(u===Ie){const a={x:n[1],y:n[2]},u=0;o._last_mouse_down=null;let g=ht(e,t);if(g>=0){let n=At(e,g);kt(e,n,0),d(n);let o=ct(e,g),a=dt(e,g);if(ye.pointDistance(a,o)<i.info.snapDistance){let i=ye.pointSub(a,o);Ct(e,n,i),((e,t)=>{for(let n of t)at(e,n,{owner:-1,z:1})})(e,n),d(n);let r=Tt(e,t);0===tt(e)?r+=n.length:1===tt(e)&&(r+=1),it(e,t,{d:u,ts:l,points:r}),c(),lt(e)===et(e)&&(ot(e,{finished:l}),s())}else{const n=(e,t,n,l)=>{let i=Qe[e].puzzle.info;if(n<0)return!1;if(((e,t,n)=>{const l=rt(e,t),i=rt(e,n);return!(!l||l!==i)})(e,t,n))return!1;const o=ct(e,t),a=ye.pointAdd(ct(e,n),{x:l[0]*i.tileSize,y:l[1]*i.tileSize});if(ye.pointDistance(o,a)<i.snapDistance){let l=ye.pointSub(a,o),i=At(e,t);Ct(e,i,l),((e,t,n)=>{const l=Qe[e].puzzle.tiles,i=rt(e,t),o=rt(e,n);let a;const d=[];i&&d.push(i),o&&d.push(o),i?a=i:o?a=o:(ot(e,{maxGroup:ft(e)+1}),s(),a=ft(e));if(at(e,t,{group:a}),r(t),at(e,n,{group:a}),r(n),d.length>0)for(const s of l){const t=He.decodeTile(s);d.includes(t.group)&&(at(e,t.idx,{group:a}),r(t.idx))}})(e,t,n),i=At(e,t);const c=((e,t)=>{let n=0;for(let l of t){let t=pt(e,l);t>n&&(n=t)}return n})(e,i);return bt(e,i,c),d(i),!0}return!1};let i=!1;for(let t of At(e,g)){let l=vt(e,t);if(n(e,t,l[0],[0,1])||n(e,t,l[1],[-1,0])||n(e,t,l[2],[0,-1])||n(e,t,l[3],[1,0])){i=!0;break}}if(i&&1===tt(e)){const n=Tt(e,t)+1;it(e,t,{d:u,ts:l,points:n}),c()}else it(e,t,{d:u,ts:l}),c()}}else it(e,t,{d:u,ts:l}),c();o._last_mouse=a}else if(u===_e){const i=n[1],a=n[2];it(e,t,{x:i,y:a,ts:l}),c(),o._last_mouse={x:i,y:a}}else if(u===De){const i=n[1],a=n[2];it(e,t,{x:i,y:a,ts:l}),c(),o._last_mouse={x:i,y:a}}else it(e,t,{ts:l}),c();return function(e,t,n){Qe[e].evtInfos[t]=n}(e,t,o),a}},Pt=e({name:"new-game-dialog",components:{ResponsiveImage:L},props:{image:{type:Object,required:!0}},emits:{newGame:null,bgclick:null},data:()=>({tiles:1e3,scoreMode:Le.ANY}),methods:{onNewGameClick(){this.$emit("newGame",{tiles:this.tilesInt,image:this.image,scoreMode:this.scoreModeInt})}},computed:{canStartNewGame(){return!!(this.tilesInt&&this.image&&this.image.url&&[0,1].includes(this.scoreModeInt))},scoreModeInt(){return parseInt(`${this.scoreMode}`,10)},tilesInt(){return parseInt(`${this.tiles}`,10)}}});const _t={class:"area-image"},Dt={class:"has-image"},Bt={class:"area-settings"},Et=n("td",null,[n("label",null,"Pieces")],-1),Ot=n("td",null,[n("label",null,"Scoring: ")],-1),Ut=s(" Any (Score when pieces are connected to each other or on final location)"),Nt=n("br",null,null,-1),Mt=s(" Final (Score when pieces are put to their final location)"),Gt={class:"area-buttons"};Pt.render=function(e,l,i,s,r,d){const c=o("responsive-image");return a(),t("div",{class:"overlay new-game-dialog",onClick:l[6]||(l[6]=t=>e.$emit("bgclick"))},[n("div",{class:"overlay-content",onClick:l[5]||(l[5]=u((()=>{}),["stop"]))},[n("div",_t,[n("div",Dt,[n(c,{src:e.image.url,title:e.image.title},null,8,["src","title"])])]),n("div",Bt,[n("table",null,[n("tr",null,[Et,n("td",null,[g(n("input",{type:"text","onUpdate:modelValue":l[1]||(l[1]=t=>e.tiles=t)},null,512),[[p,e.tiles]])])]),n("tr",null,[Ot,n("td",null,[n("label",null,[g(n("input",{type:"radio","onUpdate:modelValue":l[2]||(l[2]=t=>e.scoreMode=t),value:"1"},null,512),[[y,e.scoreMode]]),Ut]),Nt,n("label",null,[g(n("input",{type:"radio","onUpdate:modelValue":l[3]||(l[3]=t=>e.scoreMode=t),value:"0"},null,512),[[y,e.scoreMode]]),Mt])])])])]),n("div",Gt,[n("button",{class:"btn",disabled:!e.canStartNewGame,onClick:l[4]||(l[4]=(...t)=>e.onNewGameClick&&e.onNewGameClick(...t))}," 🧩 Generate Puzzle ",8,["disabled"])])])])};var $t=e({components:{ImageLibrary:F,NewImageDialog:Q,EditImageDialog:ae,NewGameDialog:Pt},data:()=>({filters:{sort:"date_desc",tags:[]},images:[],tags:[],image:{id:0,filename:"",file:"",url:"",title:"",tags:[],created:0},dialog:""}),async created(){await this.loadImages()},methods:{toggleTag(e){this.filters.tags.includes(e.slug)?this.filters.tags=this.filters.tags.filter((t=>t!==e.slug)):this.filters.tags.push(e.slug),this.filtersChanged()},async loadImages(){const e=await fetch(`/api/newgame-data${He.asQueryArgs(this.filters)}`),t=await e.json();this.images=t.images,this.tags=t.tags},async filtersChanged(){await this.loadImages()},onImageClicked(e){this.image=e,this.dialog="new-game"},onImageEditClicked(e){this.image=e,this.dialog="edit-image"},async uploadImage(e){const t=new FormData;t.append("file",e.file,e.file.name),t.append("title",e.title),t.append("tags",e.tags);const n=await fetch("/api/upload",{method:"post",body:t});return await n.json()},async saveImage(e){const t=await fetch("/api/save-image",{method:"post",headers:{Accept:"application/json","Content-Type":"application/json"},body:JSON.stringify({id:e.id,title:e.title,tags:e.tags})});return await t.json()},async onSaveImageClick(e){await this.saveImage(e),this.dialog="",await this.loadImages()},async postToGalleryClick(e){await this.uploadImage(e),this.dialog="",await this.loadImages()},async setupGameClick(e){const t=await this.uploadImage(e);this.loadImages(),this.image=t,this.dialog="new-game"},async onNewGame(e){const t=await fetch("/newgame",{method:"post",headers:{Accept:"application/json","Content-Type":"application/json"},body:JSON.stringify(e)});if(200===t.status){const e=await t.json();this.$router.push({name:"game",params:{id:e.id}})}}}});const Rt={class:"upload-image-teaser"},Vt=n("div",{class:"hint"},"(The image you upload will be added to the public gallery.)",-1),jt={key:0},Ft=s(" Tags: "),Lt=s(" Sort by: "),Wt=n("option",{value:"date_desc"},"Newest first",-1),Ht=n("option",{value:"date_asc"},"Oldest first",-1),Qt=n("option",{value:"alpha_asc"},"A-Z",-1),Yt=n("option",{value:"alpha_desc"},"Z-A",-1);$t.render=function(e,l,s,u,p,h){const m=o("image-library"),y=o("new-image-dialog"),w=o("edit-image-dialog"),v=o("new-game-dialog");return a(),t("div",null,[n("div",Rt,[n("div",{class:"btn btn-big",onClick:l[1]||(l[1]=t=>e.dialog="new-image")},"Upload your image"),Vt]),n("div",null,[e.tags.length>0?(a(),t("label",jt,[Ft,(a(!0),t(d,null,c(e.tags,((n,l)=>(a(),t("span",{class:["bit",{on:e.filters.tags.includes(n.slug)}],key:l,onClick:t=>e.toggleTag(n)},r(n.title),11,["onClick"])))),128))])):i("",!0),n("label",null,[Lt,g(n("select",{"onUpdate:modelValue":l[2]||(l[2]=t=>e.filters.sort=t),onChange:l[3]||(l[3]=(...t)=>e.filtersChanged&&e.filtersChanged(...t))},[Wt,Ht,Qt,Yt],544),[[f,e.filters.sort]])])]),n(m,{images:e.images,onImageClicked:e.onImageClicked,onImageEditClicked:e.onImageEditClicked},null,8,["images","onImageClicked","onImageEditClicked"]),"new-image"===e.dialog?(a(),t(y,{key:0,onBgclick:l[4]||(l[4]=t=>e.dialog=""),onPostToGalleryClick:e.postToGalleryClick,onSetupGameClick:e.setupGameClick},null,8,["onPostToGalleryClick","onSetupGameClick"])):i("",!0),"edit-image"===e.dialog?(a(),t(w,{key:1,onBgclick:l[5]||(l[5]=t=>e.dialog=""),onSaveClick:e.onSaveImageClick,image:e.image},null,8,["onSaveClick","image"])):i("",!0),e.image&&"new-game"===e.dialog?(a(),t(v,{key:2,onBgclick:l[6]||(l[6]=t=>e.dialog=""),onNewGame:e.onNewGame,image:e.image},null,8,["onNewGame","image"])):i("",!0)])};var qt=e({name:"scores",props:{activePlayers:{type:Array,required:!0},idlePlayers:{type:Array,required:!0}},computed:{actives(){return this.activePlayers.sort(((e,t)=>t.points-e.points)),this.activePlayers},idles(){return this.idlePlayers.sort(((e,t)=>t.points-e.points)),this.idlePlayers}}});const Kt={class:"scores"},Zt=n("div",null,"Scores",-1),Jt=n("td",null,"⚡",-1),Xt=n("td",null,"💤",-1);qt.render=function(e,l,i,o,s,u){return a(),t("div",Kt,[Zt,n("table",null,[(a(!0),t(d,null,c(e.actives,((e,l)=>(a(),t("tr",{key:l,style:{color:e.color}},[Jt,n("td",null,r(e.name),1),n("td",null,r(e.points),1)],4)))),128)),(a(!0),t(d,null,c(e.idles,((e,l)=>(a(),t("tr",{key:l,style:{color:e.color}},[Xt,n("td",null,r(e.name),1),n("td",null,r(e.points),1)],4)))),128))])])};var en=e({name:"puzzle-status",props:{finished:{type:Boolean,required:!0},duration:{type:Number,required:!0},piecesDone:{type:Number,required:!0},piecesTotal:{type:Number,required:!0}},computed:{icon(){return this.finished?"🏁":"⏳"},durationStr(){return E(this.duration)}}});const tn={class:"timer"};en.render=function(e,l,i,o,s,d){return a(),t("div",tn,[n("div",null," 🧩 "+r(e.piecesDone)+"/"+r(e.piecesTotal),1),n("div",null,r(e.icon)+" "+r(e.durationStr),1),w(e.$slots,"default")])};var nn=e({name:"settings-overlay",emits:{bgclick:null,"update:modelValue":null},props:{modelValue:Object},created(){this.$watch("modelValue",(e=>{this.$emit("update:modelValue",e)}),{deep:!0})}});const ln=n("td",null,[n("label",null,"Background: ")],-1),on=n("td",null,[n("label",null,"Color: ")],-1),an=n("td",null,[n("label",null,"Name: ")],-1);nn.render=function(e,l,i,o,s,r){return a(),t("div",{class:"overlay transparent",onClick:l[5]||(l[5]=t=>e.$emit("bgclick"))},[n("table",{class:"overlay-content settings",onClick:l[4]||(l[4]=u((()=>{}),["stop"]))},[n("tr",null,[ln,n("td",null,[g(n("input",{type:"color","onUpdate:modelValue":l[1]||(l[1]=t=>e.modelValue.background=t)},null,512),[[p,e.modelValue.background]])])]),n("tr",null,[on,n("td",null,[g(n("input",{type:"color","onUpdate:modelValue":l[2]||(l[2]=t=>e.modelValue.color=t)},null,512),[[p,e.modelValue.color]])])]),n("tr",null,[an,n("td",null,[g(n("input",{type:"text",maxLength:"16","onUpdate:modelValue":l[3]||(l[3]=t=>e.modelValue.name=t)},null,512),[[p,e.modelValue.name]])])])])])};var sn=e({name:"preview-overlay",props:{img:String},emits:{bgclick:null},computed:{previewStyle(){return{backgroundImage:`url('${this.img}')`}}}});const rn={class:"preview"};sn.render=function(e,l,i,o,s,r){return a(),t("div",{class:"overlay",onClick:l[1]||(l[1]=t=>e.$emit("bgclick"))},[n("div",rn,[n("div",{class:"img",style:e.previewStyle},null,4)])])};const dn=Ve("Communication.js");let cn,un=e=>{},gn=e=>{};let pn=0;const hn=e=>{pn!==e&&(pn=e,gn(e))};function mn(e){if(2===pn)try{cn.send(JSON.stringify(e))}catch(t){dn.info("unable to send message.. maybe because ws is invalid?")}}let yn,fn;var wn={connect:function(e,t,n){return yn=0,fn={},hn(3),new Promise((l=>{cn=new WebSocket(e,n+"|"+t),cn.onopen=e=>{hn(2),mn([xe])},cn.onmessage=e=>{const t=JSON.parse(e.data),i=t[0];if(i===we){const e=t[1];l(e)}else{if(i!==fe)throw`[ 2021-05-09 invalid connect msgType ${i} ]`;{const e=t[1],l=t[2];if(e===n&&fn[l])return void delete fn[l];un(t)}}},cn.onerror=e=>{throw hn(1),"[ 2021-05-15 onerror ]"},cn.onclose=e=>{4e3===e.code||1001===e.code?hn(4):hn(1)}}))},connectReplay:function(e,t,n){return yn=0,fn={},hn(3),new Promise((l=>{cn=new WebSocket(e,n+"|"+t),cn.onopen=e=>{hn(2),mn([Ce])},cn.onmessage=e=>{const t=JSON.parse(e.data),n=t[0];if(n!==ve)throw`[ 2021-05-09 invalid connectReplay msgType ${n} ]`;{const e=t[1],n=t[2];l({game:e,log:n})}},cn.onerror=e=>{throw hn(1),"[ 2021-05-15 onerror ]"},cn.onclose=e=>{4e3===e.code||1001===e.code?hn(4):hn(1)}}))},disconnect:function(){cn&&cn.close(4e3),yn=0,fn={}},sendClientEvent:function(e){yn++,fn[yn]=e,mn([be,yn,fn[yn]])},onServerChange:function(e){un=e},onConnectionStateChange:function(e){gn=e},CODE_CUSTOM_DISCONNECT:4e3,CONN_STATE_NOT_CONNECTED:0,CONN_STATE_DISCONNECTED:1,CONN_STATE_CLOSED:4,CONN_STATE_CONNECTED:2,CONN_STATE_CONNECTING:3},vn=e({name:"connection-overlay",emits:{reconnect:null},props:{connectionState:Number},computed:{lostConnection(){return this.connectionState===wn.CONN_STATE_DISCONNECTED},connecting(){return this.connectionState===wn.CONN_STATE_CONNECTING},show(){return!(!this.lostConnection&&!this.connecting)}}});const bn={key:0,class:"overlay connection-lost"},xn={key:0,class:"overlay-content"},Cn=n("div",null,"⁉️ LOST CONNECTION ⁉️",-1),kn={key:1,class:"overlay-content"},An=n("div",null,"Connecting...",-1);vn.render=function(e,l,o,s,r,d){return e.show?(a(),t("div",bn,[e.lostConnection?(a(),t("div",xn,[Cn,n("span",{class:"btn",onClick:l[1]||(l[1]=t=>e.$emit("reconnect"))},"Reconnect")])):i("",!0),e.connecting?(a(),t("div",kn,[An])):i("",!0)])):i("",!0)};var Tn=e({name:"help-overlay",emits:{bgclick:null}});const Sn=n("tr",null,[n("td",null,"⬆️ Move up:"),n("td",null,[n("div",null,[n("kbd",null,"W"),s("/"),n("kbd",null,"↑"),s("/🖱️")])])],-1),zn=n("tr",null,[n("td",null,"⬇️ Move down:"),n("td",null,[n("div",null,[n("kbd",null,"S"),s("/"),n("kbd",null,"↓"),s("/🖱️")])])],-1),In=n("tr",null,[n("td",null,"⬅️ Move left:"),n("td",null,[n("div",null,[n("kbd",null,"A"),s("/"),n("kbd",null,"←"),s("/🖱️")])])],-1),Pn=n("tr",null,[n("td",null,"➡️ Move right:"),n("td",null,[n("div",null,[n("kbd",null,"D"),s("/"),n("kbd",null,"→"),s("/🖱️")])])],-1),_n=n("tr",null,[n("td"),n("td",null,[n("div",null,[s("Move faster by holding "),n("kbd",null,"Shift")])])],-1),Dn=n("tr",null,[n("td",null,"🔍+ Zoom in:"),n("td",null,[n("div",null,[n("kbd",null,"E"),s("/🖱️-Wheel")])])],-1),Bn=n("tr",null,[n("td",null,"🔍- Zoom out:"),n("td",null,[n("div",null,[n("kbd",null,"Q"),s("/🖱️-Wheel")])])],-1),En=n("tr",null,[n("td",null,"🖼️ Toggle preview:"),n("td",null,[n("div",null,[n("kbd",null,"Space")])])],-1),On=n("tr",null,[n("td",null,"🧩✔️ Toggle fixed pieces:"),n("td",null,[n("div",null,[n("kbd",null,"F")])])],-1),Un=n("tr",null,[n("td",null,"🧩❓ Toggle loose pieces:"),n("td",null,[n("div",null,[n("kbd",null,"G")])])],-1);Tn.render=function(e,l,i,o,s,r){return a(),t("div",{class:"overlay transparent",onClick:l[2]||(l[2]=t=>e.$emit("bgclick"))},[n("table",{class:"overlay-content help",onClick:l[1]||(l[1]=u((()=>{}),["stop"]))},[Sn,zn,In,Pn,_n,Dn,Bn,En,On,Un])])};var Nn=Object.freeze({__proto__:null,[Symbol.toStringTag]:"Module",default:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAW0lEQVQ4je1RywrAIAxLxP//5exixRWlVgZelpOKeTQFfnDypgy3eLIkSLLL8mxGPoHsU2hPAgDHBLvRX6hZZw/fwT0BtlLSONqCbWAmEIqMZOCDDlaDR3N03gOyDCn+y4DWmAAAAABJRU5ErkJggg=="}),Mn=Object.freeze({__proto__:null,[Symbol.toStringTag]:"Module",default:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAARElEQVQ4jWNgGAU0Af+hmBCbgYGBgYERhwHEAEYGBgYGJtIdiApYyLAZBVDsAqoagC1ACQJyY4ERg0GCISh6KA4DigEAou8LC+LnIJoAAAAASUVORK5CYII="}),Gn=Object.freeze({__proto__:null,[Symbol.toStringTag]:"Module",default:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAcUlEQVQ4ja1TQQ7AIAgD///n7jCozA2Hbk00jbG1KIrcARszTugoBs49qioZj7r2kKACptkyAOCJsJuA+GzglwHjvMSSWFVaENWVASxh5eRLiq5fN/ASjI89VcP2K3hHpq1cEXNaMfnrL3TDZP2tDuoOA6MzCCXWr38AAAAASUVORK5CYII="}),$n=Object.freeze({__proto__:null,[Symbol.toStringTag]:"Module",default:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAU0lEQVQ4jWNgoAH4D8X42HDARKlt5BoAd82AuQAOGLGIYQQUPv0wF5CiCQUge4EsQ5C9QI4BjMguwBYeBAElscCIy1ZivMKIwSDBEBQ9FCckigEAU3QOD7TGvY4AAAAASUVORK5CYII="});function Rn(){let e=0,t=0,n=1;const l=(l,i)=>{e+=l/n,t+=i/n},i=e=>{const t=n+.05*n*("in"===e?1:-1);return Math.min(Math.max(t,.1),6)},o=l=>({x:l.x/n-e,y:l.y/n-t}),a=l=>({x:(l.x+e)*n,y:(l.y+t)*n}),s=e=>({w:e.w*n,h:e.h*n});return{move:l,canZoom:e=>n!=i(e),zoom:(e,t)=>((e,t)=>{if(n==e)return!1;const i=1-n/e;return l(-t.x*i,-t.y*i),n=e,!0})(i(e),t),worldToViewport:e=>{const{x:t,y:n}=a(e);return{x:Math.round(t),y:Math.round(n)}},worldToViewportRaw:a,worldDimToViewport:e=>{const{w:t,h:n}=s(e);return{w:Math.round(t),h:Math.round(n)}},worldDimToViewportRaw:s,viewportToWorld:e=>{const{x:t,y:n}=o(e);return{x:Math.round(t),y:Math.round(n)}},viewportToWorldRaw:o}}function Vn(e=0,t=0){const n=document.createElement("canvas");return n.width=e,n.height=t,n}var jn={createCanvas:Vn,loadImageToBitmap:async function(e){return new Promise((t=>{const n=new Image;n.onload=()=>{createImageBitmap(n).then(t)},n.src=e}))},resizeBitmap:async function(e,t,n){const l=Vn(t,n);return l.getContext("2d").drawImage(e,0,0,e.width,e.height,0,0,t,n),await createImageBitmap(l)},colorizedCanvas:function(e,t,n){const l=Vn(e.width,e.height),i=l.getContext("2d");return i.save(),i.drawImage(t,0,0),i.fillStyle=n,i.globalCompositeOperation="source-in",i.fillRect(0,0,t.width,t.height),i.restore(),i.save(),i.globalCompositeOperation="destination-over",i.drawImage(e,0,0),i.restore(),l}};const Fn=Ve("Debug.js");let Ln=0,Wn=0;var Hn=e=>{Ln=performance.now(),Wn=e},Qn=e=>{const t=performance.now(),n=t-Ln;n>Wn&&Fn.log(e+": "+n),Ln=t};const Yn=Ve("PuzzleGraphics.js");function qn(e,t){const n=He.coordByTileIdx(e,t);return{x:n.x*e.tileSize,y:n.y*e.tileSize,w:e.tileSize,h:e.tileSize}}var Kn={loadPuzzleBitmaps:async function(e){const t=await jn.loadImageToBitmap(e.info.imageUrl),n=await jn.resizeBitmap(t,e.info.width,e.info.height);return await async function(e,t,n){Yn.log("start createPuzzleTileBitmaps");var l=n.tileSize,i=n.tileMarginWidth,o=n.tileDrawSize,a=l/100,s=[0,0,40,15,37,5,37,5,40,0,38,-5,38,-5,20,-20,50,-20,50,-20,80,-20,62,-5,62,-5,60,0,63,5,63,5,65,15,100,0];const r=new Array(t.length),d={};function c(e){const t=`${e.top}${e.right}${e.left}${e.bottom}`;if(d[t])return d[t];const n=new Path2D,o={x:i,y:i},r=ye.pointAdd(o,{x:l,y:0}),c=ye.pointAdd(r,{x:0,y:l}),u=ye.pointSub(c,{x:l,y:0});if(n.moveTo(o.x,o.y),0!==e.top)for(let l=0;l<s.length/6;l++){const t=ye.pointAdd(o,{x:s[6*l+0]*a,y:e.top*s[6*l+1]*a}),i=ye.pointAdd(o,{x:s[6*l+2]*a,y:e.top*s[6*l+3]*a}),r=ye.pointAdd(o,{x:s[6*l+4]*a,y:e.top*s[6*l+5]*a});n.bezierCurveTo(t.x,t.y,i.x,i.y,r.x,r.y)}else n.lineTo(r.x,r.y);if(0!==e.right)for(let l=0;l<s.length/6;l++){const t=ye.pointAdd(r,{x:-e.right*s[6*l+1]*a,y:s[6*l+0]*a}),i=ye.pointAdd(r,{x:-e.right*s[6*l+3]*a,y:s[6*l+2]*a}),o=ye.pointAdd(r,{x:-e.right*s[6*l+5]*a,y:s[6*l+4]*a});n.bezierCurveTo(t.x,t.y,i.x,i.y,o.x,o.y)}else n.lineTo(c.x,c.y);if(0!==e.bottom)for(let l=0;l<s.length/6;l++){let t=ye.pointSub(c,{x:s[6*l+0]*a,y:e.bottom*s[6*l+1]*a}),i=ye.pointSub(c,{x:s[6*l+2]*a,y:e.bottom*s[6*l+3]*a}),o=ye.pointSub(c,{x:s[6*l+4]*a,y:e.bottom*s[6*l+5]*a});n.bezierCurveTo(t.x,t.y,i.x,i.y,o.x,o.y)}else n.lineTo(u.x,u.y);if(0!==e.left)for(let l=0;l<s.length/6;l++){let t=ye.pointSub(u,{x:-e.left*s[6*l+1]*a,y:s[6*l+0]*a}),i=ye.pointSub(u,{x:-e.left*s[6*l+3]*a,y:s[6*l+2]*a}),o=ye.pointSub(u,{x:-e.left*s[6*l+5]*a,y:s[6*l+4]*a});n.bezierCurveTo(t.x,t.y,i.x,i.y,o.x,o.y)}else n.lineTo(o.x,o.y);return d[t]=n,n}const u=jn.createCanvas(o,o),g=u.getContext("2d"),p=jn.createCanvas(o,o),h=p.getContext("2d");for(const m of t){const t=He.decodeTile(m),l=qn(n,t.idx),a=c(He.decodeShape(n.shapes[t.idx]));g.clearRect(0,0,o,o),g.save(),g.lineWidth=2,g.stroke(a),g.globalCompositeOperation="source-in",g.drawImage(e,l.x-i,l.y-i,o,o,0,0,o,o),g.restore(),g.save(),g.globalCompositeOperation="source-in",g.globalAlpha=.2,g.fillStyle="black",g.fillRect(0,0,u.width,u.height),g.restore(),g.save(),g.clip(a),g.drawImage(e,l.x-i,l.y-i,o,o,0,0,o,o),g.restore(),g.save(),g.clip(a),g.strokeStyle="rgba(0,0,0,.4)",g.lineWidth=0,g.shadowColor="black",g.shadowBlur=2,g.shadowOffsetX=-1,g.shadowOffsetY=-1,g.stroke(a),g.restore(),g.save(),g.clip(a),g.strokeStyle="rgba(255,255,255,.4)",g.lineWidth=0,g.shadowColor="white",g.shadowBlur=2,g.shadowOffsetX=1,g.shadowOffsetY=1,g.stroke(a),g.restore(),h.clearRect(0,0,o,o),h.save(),h.lineWidth=1,h.stroke(a),h.globalCompositeOperation="source-in",h.drawImage(e,l.x-i,l.y-i,o,o,0,0,o,o),h.restore(),g.drawImage(p,0,0),r[t.idx]=await createImageBitmap(u)}return Yn.log("end createPuzzleTileBitmaps"),r}(n,e.tiles,e.info)}};let Zn=-10,Jn=20,Xn=2,el=15;class tl{constructor(e){this.radius=10,this.previousRadius=10,this.explodingDuration=100,this.hasExploded=!1,this.alive=!0,this.color=function(e){return"rgba("+e.random(0,255)+","+e.random(0,255)+","+e.random(0,255)+", 0.8)"}(e),this.px=window.innerWidth/4+Math.random()*window.innerWidth/2,this.py=window.innerHeight,this.vx=Zn+Math.random()*Jn,this.vy=-1*(Xn+Math.random()*el),this.duration=0}update(e){if(this.hasExploded){const e=200-this.radius;this.previousRadius=this.radius,this.radius+=e/10,this.explodingDuration--,0==this.explodingDuration&&(this.alive=!1)}else this.vx+=0,this.vy+=1,this.vy>=0&&e&&this.explode(e),this.px+=this.vx,this.py+=this.vy}draw(e){e.beginPath(),e.arc(this.px,this.py,this.previousRadius,0,2*Math.PI,!1),this.hasExploded||(e.fillStyle=this.color,e.lineWidth=1,e.fill())}explode(e){this.hasExploded=!0;const t=3+Math.floor(3*Math.random());for(let n=0;n<t;n++){const t=10+Math.floor(21*Math.random()),n=5+5*Math.random(),l=2*Math.PI/t,i=Math.random()*l;for(let o=0;o<t;o++)e.push(new nl(this,o*l+i,n))}}}class nl{constructor(e,t,n){this.px=e.px,this.py=e.py,this.vx=Math.cos(t)*n,this.vy=Math.sin(t)*n,this.color=e.color,this.duration=40+Math.floor(20*Math.random()),this.alive=!0,this.radius=0}update(){this.vx+=0,this.vy+=.1,this.px+=this.vx,this.py+=this.vy,this.radius=3,this.duration--,this.duration<=0&&(this.alive=!1)}draw(e){e.beginPath(),e.arc(this.px,this.py,this.radius,0,2*Math.PI,!1),e.fillStyle=this.color,e.lineWidth=1,e.fill()}}class ll{constructor(e,t){this.canvas=e,this.rng=t,this.ctx=this.canvas.getContext("2d"),this.resize(),this.readyBombs=[],this.explodedBombs=[],this.particles=[],window.addEventListener("resize",(()=>{this.resize()}))}setSpeedParams(){let e=0,t=0;for(;e<this.canvas.height&&t>=0;)t+=1,e+=t;Xn=t/2,el=t-Xn;const n=1/4*this.canvas.width/(t/2);Zn=-n,Jn=2*n}resize(){this.setSpeedParams()}init(){this.readyBombs=[],this.explodedBombs=[],this.particles=[];for(let e=0;e<1;e++)this.readyBombs.push(new tl(this.rng))}update(){100*Math.random()<5&&this.readyBombs.push(new tl(this.rng));const e=[];for(;this.explodedBombs.length>0;){const t=this.explodedBombs.shift();if(!t)break;t.update(),t.alive&&e.push(t)}this.explodedBombs=e;const t=[];for(;this.readyBombs.length>0;){const e=this.readyBombs.shift();if(!e)break;e.update(this.particles),e.hasExploded?this.explodedBombs.push(e):t.push(e)}this.readyBombs=t;const n=[];for(;this.particles.length>0;){const e=this.particles.shift();if(!e)break;e.update(),e.alive&&n.push(e)}this.particles=n}render(){this.ctx.beginPath(),this.ctx.fillStyle="rgba(0, 0, 0, 0.1)",this.ctx.fillRect(0,0,this.canvas.width,this.canvas.height);for(let e=0;e<this.readyBombs.length;e++)this.readyBombs[e].draw(this.ctx);for(let e=0;e<this.explodedBombs.length;e++)this.explodedBombs[e].draw(this.ctx);for(let e=0;e<this.particles.length;e++)this.particles[e].draw(this.ctx)}}const il={"./grab.png":Nn,"./grab_mask.png":Mn,"./hand.png":Gn,"./hand_mask.png":$n};let ol=!0,al=!0;let sl=!0;async function rl(e,t,n,l,i,o){void 0===window.DEBUG&&(window.DEBUG=!1);const a=await jn.loadImageToBitmap(il["./grab.png"].default),s=await jn.loadImageToBitmap(il["./hand.png"].default),r=await jn.loadImageToBitmap(il["./grab_mask.png"].default),d=await jn.loadImageToBitmap(il["./hand_mask.png"].default),c=a.width,u=Math.round(c/2),g=a.height,p=Math.round(g/2),h={},m=async e=>{const t=e.color+" "+e.d;if(!h[t]){const n=e.d?a:s;if(e.color){const l=e.d?r:d;h[t]=await createImageBitmap(jn.colorizedCanvas(n,l,e.color))}else h[t]=n}return h[t]},y=function(e,t){return t.width=window.innerWidth,t.height=window.innerHeight,e.appendChild(t),window.addEventListener("resize",(()=>{t.width=window.innerWidth,t.height=window.innerHeight,sl=!0})),t}(i,jn.createCanvas()),f={log:[],logIdx:0,speeds:[.5,1,2,5,10,20,50],speedIdx:1,paused:!1,lastRealTs:0,lastGameTs:0,gameStartTs:0};wn.onConnectionStateChange((e=>{o.setConnectionState(e)}));let w=()=>0;const v=async()=>{if("play"===l){const l=await wn.connect(n,e,t),i=He.decodeGame(l);It.setGame(i.id,i),w=()=>D()}else{if("replay"!==l)throw"[ 2020-12-22 MODE invalid, must be play|replay ]";{const l=await wn.connectReplay(n,e,t),i=He.decodeGame(l.game);It.setGame(i.id,i),f.log=l.log,f.lastRealTs=D(),f.gameStartTs=parseInt(f.log[0][f.log[0].length-2],10),f.lastGameTs=f.gameStartTs,w=()=>f.lastGameTs}}sl=!0};await v();const b=It.getTileDrawOffset(e),x=It.getTileDrawSize(e),C=It.getPuzzleWidth(e),k=It.getPuzzleHeight(e),A=It.getTableWidth(e),T=It.getTableHeight(e),S={x:(A-C)/2,y:(T-k)/2},z={w:C,h:k},I={w:x,h:x},P=await Kn.loadPuzzleBitmaps(It.getPuzzle(e)),_=new ll(y,It.getRng(e));_.init();const B=y.getContext("2d");y.classList.add("loaded");const E=Rn();E.move(-(A-y.width)/2,-(T-y.height)/2);const O=function(e,t,n){let l=[],i=!0,o=!1,a=!1,s=!1,r=!1,d=!1,c=!1,u=!1;const g=(e,t)=>{const l=n.viewportToWorld({x:e,y:t});return[l.x,l.y]},p=e=>g(e.offsetX,e.offsetY),h=()=>g(e.width/2,e.height/2),m=(e,t)=>{i&&("Shift"===t.key?u=e:"ArrowUp"===t.key||"w"===t.key||"W"===t.key?s=e:"ArrowDown"===t.key||"s"===t.key||"S"===t.key?r=e:"ArrowLeft"===t.key||"a"===t.key||"A"===t.key?o=e:"ArrowRight"===t.key||"d"===t.key||"D"===t.key?a=e:"q"===t.key?c=e:"e"===t.key&&(d=e))};e.addEventListener("mousedown",(e=>{0===e.button&&y([ze,...p(e)])})),e.addEventListener("mouseup",(e=>{0===e.button&&y([Ie,...p(e)])})),e.addEventListener("mousemove",(e=>{y([Pe,...p(e)])})),e.addEventListener("wheel",(e=>{if(n.canZoom(e.deltaY<0?"in":"out")){const t=e.deltaY<0?_e:De;y([t,...p(e)])}})),t.addEventListener("keydown",(e=>m(!0,e))),t.addEventListener("keyup",(e=>m(!1,e))),t.addEventListener("keypress",(e=>{i&&(" "===e.key&&y([Ue]),"F"!==e.key&&"f"!==e.key||(ol=!ol,sl=!0),"G"!==e.key&&"g"!==e.key||(al=!al,sl=!0))}));const y=e=>{l.push(e)};return{addEvent:y,consumeAll:()=>{if(0===l.length)return[];const e=l.slice();return l=[],e},createKeyEvents:()=>{const e=u?20:10,t=(o?e:0)-(a?e:0),l=(s?e:0)-(r?e:0);0===t&&0===l||y([Se,t,l]),d&&c||(d?n.canZoom("in")&&y([_e,...h()]):c&&n.canZoom("out")&&y([De,...h()]))},setHotkeys:e=>{i=e}}}(y,window,E),U=It.getImageUrl(e),N=()=>{const t=It.getStartTs(e),n=It.getFinishTs(e),l=w();o.setFinished(!!n),o.setDuration((n||l)-t)};N(),o.setPiecesDone(It.getFinishedTileCount(e)),o.setPiecesTotal(It.getTileCount(e));const M=w();o.setActivePlayers(It.getActivePlayers(e,M)),o.setIdlePlayers(It.getIdlePlayers(e,M));const G=!!It.getFinishTs(e);let $=G;const R=()=>$&&!G,V=()=>It.getPlayerBgColor(e,t)||localStorage.getItem("bg_color")||"#222222",j=()=>It.getPlayerColor(e,t)||localStorage.getItem("player_color")||"#ffffff";let F="",L="",W=!1;const H=e=>{W=e;const[t,n]=e?[F,"grab"]:[L,"default"];y.style.cursor=`url('${t}') ${u} ${p}, ${n}`},Q=e=>{F=jn.colorizedCanvas(a,r,e).toDataURL(),L=jn.colorizedCanvas(s,d,e).toDataURL(),H(W)};Q(j());const Y=()=>{o.setReplaySpeed&&o.setReplaySpeed(f.speeds[f.speedIdx]),o.setReplayPaused&&o.setReplayPaused(f.paused)};if("play"===l?setInterval(N,1e3):"replay"===l&&Y(),"play"===l)wn.onServerChange((n=>{n[0],n[1],n[2];const l=n[3];for(const[i,o]of l)switch(i){case Ge:{const n=He.decodePlayer(o);n.id!==t&&(It.setPlayer(e,n.id,n),sl=!0)}break;case Me:{const t=He.decodeTile(o);It.setTile(e,t.idx,t),sl=!0}break;case Ne:It.setPuzzleData(e,o),sl=!0}$=!!It.getFinishTs(e)}));else if("replay"===l){let t=setInterval((()=>{const n=D();if(f.paused)return void(f.lastRealTs=n);const l=(n-f.lastRealTs)*f.speeds[f.speedIdx],i=f.lastGameTs+l;for(;;){if(f.paused)break;const n=f.logIdx+1;if(n>=f.log.length){clearInterval(t);break}const l=f.log[n],o=f.gameStartTs+l[l.length-1];if(o>i)break;const a=l.slice();if(a[0]===ke){const t=a[1];It.addPlayer(e,t,o),sl=!0}else if(a[0]===Ae){const t=It.getPlayerIdByIndex(e,a[1]);if(!t)throw"[ 2021-05-17 player not found (update player) ]";It.addPlayer(e,t,o),sl=!0}else if(a[0]===Te){const t=It.getPlayerIdByIndex(e,a[1]);if(!t)throw"[ 2021-05-17 player not found (handle input) ]";const n=a[2];It.handleInput(e,t,n,o),sl=!0}f.logIdx=n}f.lastRealTs=n,f.lastGameTs=i,N()}),50)}let q=null;return(e=>{const t=e.fps||60,n=e.slow||1,l=e.update,i=e.render,o=window.requestAnimationFrame,a=1/t,s=n*a;let r,d=0,c=window.performance.now();const u=()=>{for(r=window.performance.now(),d+=Math.min(1,(r-c)/1e3);d>s;)d-=s,l(a);i(d/n),c=r,o(u)};o(u)})({update:()=>{O.createKeyEvents();for(const n of O.consumeAll())if("play"===l){const l=n[0];if(l===Se){const e=n[1],t=n[2];sl=!0,E.move(e,t)}else if(l===Pe){if(q&&!It.getFirstOwnedTile(e,t)){const e={x:n[1],y:n[2]},t=E.worldToViewport(e),l=Math.round(t.x-q.x),i=Math.round(t.y-q.y);sl=!0,E.move(l,i),q=t}}else if(l===Ee)Q(n[1]);else if(l===ze){const e={x:n[1],y:n[2]};q=E.worldToViewport(e),H(!0)}else if(l===Ie)q=null,H(!1);else if(l===_e){const e={x:n[1],y:n[2]};sl=!0,E.zoom("in",E.worldToViewport(e))}else if(l===De){const e={x:n[1],y:n[2]};sl=!0,E.zoom("out",E.worldToViewport(e))}else l===Ue&&o.togglePreview();const i=w();It.handleInput(e,t,n,i).length>0&&(sl=!0),wn.sendClientEvent(n)}else if("replay"===l){const e=n[0];if(e===Se){const e=n[1],t=n[2];sl=!0,E.move(e,t)}else if(e===Pe){if(q){const e={x:n[1],y:n[2]},t=E.worldToViewport(e),l=Math.round(t.x-q.x),i=Math.round(t.y-q.y);sl=!0,E.move(l,i),q=t}}else if(e===ze){const e={x:n[1],y:n[2]};q=E.worldToViewport(e)}else if(e===Ie)q=null;else if(e===_e){const e={x:n[1],y:n[2]};sl=!0,E.zoom("in",E.worldToViewport(e))}else if(e===De){const e={x:n[1],y:n[2]};sl=!0,E.zoom("out",E.worldToViewport(e))}else e===Ue&&o.togglePreview()}$=!!It.getFinishTs(e),R()&&(_.update(),sl=!0)},render:async()=>{if(!sl)return;const n=w();let i,a,s;window.DEBUG&&Hn(0),B.fillStyle=V(),B.fillRect(0,0,y.width,y.height),window.DEBUG&&Qn("clear done"),i=E.worldToViewportRaw(S),a=E.worldDimToViewportRaw(z),B.fillStyle="rgba(255, 255, 255, .3)",B.fillRect(i.x,i.y,a.w,a.h),window.DEBUG&&Qn("board done");const r=It.getTilesSortedByZIndex(e);window.DEBUG&&Qn("get tiles done"),a=E.worldDimToViewportRaw(I);for(const e of r)(-1===e.owner?ol:al)&&(s=P[e.idx],i=E.worldToViewportRaw({x:b+e.pos.x,y:b+e.pos.y}),B.drawImage(s,0,0,s.width,s.height,i.x,i.y,a.w,a.h));window.DEBUG&&Qn("tiles done");const d=[];for(const o of It.getActivePlayers(e,n))c=o,("replay"===l||c.id!==t)&&(s=await m(o),i=E.worldToViewport(o),B.drawImage(s,i.x-u,i.y-p),d.push([`${o.name} (${o.points})`,i.x,i.y+g]));var c;B.fillStyle="white",B.textAlign="center";for(const[e,t,l]of d)B.fillText(e,t,l);window.DEBUG&&Qn("players done"),o.setActivePlayers(It.getActivePlayers(e,n)),o.setIdlePlayers(It.getIdlePlayers(e,n)),o.setPiecesDone(It.getFinishedTileCount(e)),window.DEBUG&&Qn("HUD done"),R()&&_.render(),sl=!1}}),{setHotkeys:e=>{O.setHotkeys(e)},onBgChange:e=>{localStorage.setItem("bg_color",e),O.addEvent([Be,e])},onColorChange:e=>{localStorage.setItem("player_color",e),O.addEvent([Ee,e])},onNameChange:e=>{localStorage.setItem("player_name",e),O.addEvent([Oe,e])},replayOnSpeedUp:()=>{f.speedIdx+1<f.speeds.length&&(f.speedIdx++,Y())},replayOnSpeedDown:()=>{f.speedIdx>=1&&(f.speedIdx--,Y())},replayOnPauseToggle:()=>{f.paused=!f.paused,Y()},previewImageUrl:U,player:{background:V(),color:j(),name:It.getPlayerName(e,t)||localStorage.getItem("player_name")||"anon"},disconnect:wn.disconnect,connect:v}}var dl=e({name:"game",components:{PuzzleStatus:en,Scores:qt,SettingsOverlay:nn,PreviewOverlay:sn,ConnectionOverlay:vn,HelpOverlay:Tn},data:()=>({activePlayers:[],idlePlayers:[],finished:!1,duration:0,piecesDone:0,piecesTotal:0,overlay:"",connectionState:0,g:{player:{background:"",color:"",name:""},previewImageUrl:"",setHotkeys:e=>{},onBgChange:e=>{},onColorChange:e=>{},onNameChange:e=>{},disconnect:()=>{},connect:()=>{}}}),async mounted(){this.$route.params.id&&(this.$watch((()=>this.g.player.background),(e=>{this.g.onBgChange(e)})),this.$watch((()=>this.g.player.color),(e=>{this.g.onColorChange(e)})),this.$watch((()=>this.g.player.name),(e=>{this.g.onNameChange(e)})),this.g=await rl(`${this.$route.params.id}`,this.$clientId,this.$config.WS_ADDRESS,"play",this.$el,{setActivePlayers:e=>{this.activePlayers=e},setIdlePlayers:e=>{this.idlePlayers=e},setFinished:e=>{this.finished=e},setDuration:e=>{this.duration=e},setPiecesDone:e=>{this.piecesDone=e},setPiecesTotal:e=>{this.piecesTotal=e},setConnectionState:e=>{this.connectionState=e},togglePreview:()=>{this.toggle("preview",!1)}}))},unmounted(){this.g.disconnect()},methods:{reconnect(){this.g.connect()},toggle(e,t){""===this.overlay?(this.overlay=e,t&&this.g.setHotkeys(!1)):(this.overlay="",t&&this.g.setHotkeys(!0))}}});const cl={id:"game"},ul={class:"menu"},gl={class:"tabs"},pl=s("🧩 Puzzles");dl.render=function(e,i,s,r,d,c){const u=o("settings-overlay"),p=o("preview-overlay"),h=o("help-overlay"),m=o("connection-overlay"),y=o("puzzle-status"),f=o("router-link"),w=o("scores");return a(),t("div",cl,[g(n(u,{onBgclick:i[1]||(i[1]=t=>e.toggle("settings",!0)),modelValue:e.g.player,"onUpdate:modelValue":i[2]||(i[2]=t=>e.g.player=t)},null,8,["modelValue"]),[[v,"settings"===e.overlay]]),g(n(p,{onBgclick:i[3]||(i[3]=t=>e.toggle("preview",!1)),img:e.g.previewImageUrl},null,8,["img"]),[[v,"preview"===e.overlay]]),g(n(h,{onBgclick:i[4]||(i[4]=t=>e.toggle("help",!0))},null,512),[[v,"help"===e.overlay]]),n(m,{connectionState:e.connectionState,onReconnect:e.reconnect},null,8,["connectionState","onReconnect"]),n(y,{finished:e.finished,duration:e.duration,piecesDone:e.piecesDone,piecesTotal:e.piecesTotal},null,8,["finished","duration","piecesDone","piecesTotal"]),n("div",ul,[n("div",gl,[n(f,{class:"opener",to:{name:"index"},target:"_blank"},{default:l((()=>[pl])),_:1}),n("div",{class:"opener",onClick:i[5]||(i[5]=t=>e.toggle("preview",!1))},"🖼️ Preview"),n("div",{class:"opener",onClick:i[6]||(i[6]=t=>e.toggle("settings",!0))},"🛠️ Settings"),n("div",{class:"opener",onClick:i[7]||(i[7]=t=>e.toggle("help",!0))},"ℹ️ Help")])]),n(w,{activePlayers:e.activePlayers,idlePlayers:e.idlePlayers},null,8,["activePlayers","idlePlayers"])])};var hl=e({name:"replay",components:{PuzzleStatus:en,Scores:qt,SettingsOverlay:nn,PreviewOverlay:sn,HelpOverlay:Tn},data:()=>({activePlayers:[],idlePlayers:[],finished:!1,duration:0,piecesDone:0,piecesTotal:0,overlay:"",connectionState:0,g:{player:{background:"",color:"",name:""},previewImageUrl:"",setHotkeys:e=>{},onBgChange:e=>{},onColorChange:e=>{},onNameChange:e=>{},replayOnSpeedUp:()=>{},replayOnSpeedDown:()=>{},replayOnPauseToggle:()=>{},disconnect:()=>{}},replay:{speed:1,paused:!1}}),async mounted(){this.$route.params.id&&(this.$watch((()=>this.g.player.background),(e=>{this.g.onBgChange(e)})),this.$watch((()=>this.g.player.color),(e=>{this.g.onColorChange(e)})),this.$watch((()=>this.g.player.name),(e=>{this.g.onNameChange(e)})),this.g=await rl(`${this.$route.params.id}`,this.$clientId,this.$config.WS_ADDRESS,"replay",this.$el,{setActivePlayers:e=>{this.activePlayers=e},setIdlePlayers:e=>{this.idlePlayers=e},setFinished:e=>{this.finished=e},setDuration:e=>{this.duration=e},setPiecesDone:e=>{this.piecesDone=e},setPiecesTotal:e=>{this.piecesTotal=e},togglePreview:()=>{this.toggle("preview",!1)},setConnectionState:e=>{this.connectionState=e},setReplaySpeed:e=>{this.replay.speed=e},setReplayPaused:e=>{this.replay.paused=e}}))},unmounted(){this.g.disconnect()},methods:{toggle(e,t){""===this.overlay?(this.overlay=e,t&&this.g.setHotkeys(!1)):(this.overlay="",t&&this.g.setHotkeys(!0))}},computed:{replayText(){return"Replay-Speed: "+this.replay.speed+"x"+(this.replay.paused?" Paused":"")}}});const ml={id:"replay"},yl={class:"menu"},fl={class:"tabs"},wl=s("🧩 Puzzles");hl.render=function(e,i,s,d,c,u){const p=o("settings-overlay"),h=o("preview-overlay"),m=o("help-overlay"),y=o("puzzle-status"),f=o("router-link"),w=o("scores");return a(),t("div",ml,[g(n(p,{onBgclick:i[1]||(i[1]=t=>e.toggle("settings",!0)),modelValue:e.g.player,"onUpdate:modelValue":i[2]||(i[2]=t=>e.g.player=t)},null,8,["modelValue"]),[[v,"settings"===e.overlay]]),g(n(h,{onBgclick:i[3]||(i[3]=t=>e.toggle("preview",!1)),img:e.g.previewImageUrl},null,8,["img"]),[[v,"preview"===e.overlay]]),g(n(m,{onBgclick:i[4]||(i[4]=t=>e.toggle("help",!0))},null,512),[[v,"help"===e.overlay]]),n(y,{finished:e.finished,duration:e.duration,piecesDone:e.piecesDone,piecesTotal:e.piecesTotal},{default:l((()=>[n("div",null,[n("div",null,r(e.replayText),1),n("button",{class:"btn",onClick:i[5]||(i[5]=t=>e.g.replayOnSpeedUp())},"⏫"),n("button",{class:"btn",onClick:i[6]||(i[6]=t=>e.g.replayOnSpeedDown())},"⏬"),n("button",{class:"btn",onClick:i[7]||(i[7]=t=>e.g.replayOnPauseToggle())},"⏸️")])])),_:1},8,["finished","duration","piecesDone","piecesTotal"]),n("div",yl,[n("div",fl,[n(f,{class:"opener",to:{name:"index"},target:"_blank"},{default:l((()=>[wl])),_:1}),n("div",{class:"opener",onClick:i[8]||(i[8]=t=>e.toggle("preview",!1))},"🖼️ Preview"),n("div",{class:"opener",onClick:i[9]||(i[9]=t=>e.toggle("settings",!0))},"🛠️ Settings"),n("div",{class:"opener",onClick:i[10]||(i[10]=t=>e.toggle("help",!0))},"ℹ️ Help")])]),n(w,{activePlayers:e.activePlayers,idlePlayers:e.idlePlayers},null,8,["activePlayers","idlePlayers"])])},(async()=>{const e=await fetch("/api/conf"),t=await e.json();const n=b({history:x(),routes:[{name:"index",path:"/",component:$},{name:"new-game",path:"/new-game",component:$t},{name:"game",path:"/g/:id",component:dl},{name:"replay",path:"/replay/:id",component:hl}]});n.beforeEach(((e,t)=>{t.name&&document.documentElement.classList.remove(`view-${String(t.name)}`),document.documentElement.classList.add(`view-${String(e.name)}`)}));const l=C(k);l.config.globalProperties.$config=t,l.config.globalProperties.$clientId=function(){let e=localStorage.getItem("ID");return e||(e=He.uniqId(),localStorage.setItem("ID",e)),e}(),l.use(n),l.mount("#app")})();
|