@mborecki/memory-game 0.1.0 → 0.3.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
@@ -1 +1 @@
1
- import{p as e,b as t}from"./p-D2pBOsDL.js";export{s as setNonce}from"./p-D2pBOsDL.js";import{g as a}from"./p-DQuL1Twl.js";(()=>{const s=import.meta.url,t={};return""!==s&&(t.resourcesUrl=new URL(".",s).href),e(t)})().then((async e=>(await a(),t([["p-35b15a0c",[[513,"mb-memory-game",{tileGroups:[16],reverseTile:[16],init:[4],cols:[2],tiles:[32],selected:[32],matchedTiles:[32],uncoverSelected:[32],initGame:[64]},null,{board:[{watchBoard:0}],matchedTiles:[{watchMatchedTiles:0}]}]]]],e))));
1
+ import{p as e,b as t}from"./p-D2pBOsDL.js";export{s as setNonce}from"./p-D2pBOsDL.js";import{g as i}from"./p-DQuL1Twl.js";(()=>{const s=import.meta.url,t={};return""!==s&&(t.resourcesUrl=new URL(".",s).href),e(t)})().then((async e=>(await i(),t([["p-eb79664b",[[513,"mb-memory-game",{tileGroups:[16],reverseTile:[16],init:[4],cols:[2],tiles:[32],selected:[32],matchedTiles:[32],uncoverSelected:[32],initGame:[64]},null,{tileGroups:[{watchTileGroups:0}],matchedTiles:[{watchMatchedTiles:0}]}]]]],e))));
@@ -0,0 +1 @@
1
+ {"version":3,"file":"memory-game.esm.js","sources":["../../node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.41.0 | MIT Licensed | https://stenciljs.com\n */\n\n// src/client/client-patch-browser.ts\nimport { BUILD, NAMESPACE } from \"@stencil/core/internal/app-data\";\nimport { consoleDevInfo, H, promiseResolve, win } from \"@stencil/core\";\nvar patchBrowser = () => {\n if (BUILD.isDev && !BUILD.isTesting) {\n consoleDevInfo(\"Running in development mode.\");\n }\n if (BUILD.cloneNodeFix) {\n patchCloneNodeFix(H.prototype);\n }\n const scriptElm = BUILD.scriptDataOpts ? win.document && Array.from(win.document.querySelectorAll(\"script\")).find(\n (s) => new RegExp(`/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) || s.getAttribute(\"data-stencil-namespace\") === NAMESPACE\n ) : null;\n const importMeta = import.meta.url;\n const opts = BUILD.scriptDataOpts ? (scriptElm || {})[\"data-opts\"] || {} : {};\n if (importMeta !== \"\") {\n opts.resourcesUrl = new URL(\".\", importMeta).href;\n }\n return promiseResolve(opts);\n};\nvar patchCloneNodeFix = (HTMLElementPrototype) => {\n const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n HTMLElementPrototype.cloneNode = function(deep) {\n if (this.nodeName === \"TEMPLATE\") {\n return nativeCloneNodeFn.call(this, deep);\n }\n const clonedNode = nativeCloneNodeFn.call(this, false);\n const srcChildNodes = this.childNodes;\n if (deep) {\n for (let i = 0; i < srcChildNodes.length; i++) {\n if (srcChildNodes[i].nodeType !== 2) {\n clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n }\n }\n }\n return clonedNode;\n };\n};\nexport {\n patchBrowser\n};\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(async (options) => {\n await globalScripts();\n return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"names":[],"mappings":";;;AAAA;AACA;AACA;;AAKA,IAAI,YAAY,GAAG,MAAM;AACzB,EAAE,IAAI,KAAK,CAAC,KAAK,IAAI,CAAC,KAAK,CAAC,SAAS,EAAE;AACvC,IAAI,cAAc,CAAC,8BAA8B,CAAC;AAClD;AACA,EAAE,IAAI,KAAK,CAAC,YAAY,EAAE;AAC1B,IAAI,iBAAiB,CAAC,CAAC,CAAC,SAAS,CAAC;AAClC;AACA,EAAE,MAAM,SAAS,GAAG,KAAK,CAAC,cAAc,GAAG,GAAG,CAAC,QAAQ,IAAI,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI;AACnH,IAAI,CAAC,CAAC,KAAK,IAAI,MAAM,CAAC,CAAC,CAAC,EAAE,SAAS,CAAC,uBAAuB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,YAAY,CAAC,wBAAwB,CAAC,KAAK;AAC1H,GAAG,GAAG,IAAI;AACV,EAAE,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,GAAG;AACpC,EAAE,MAAM,IAAI,GAAG,KAAK,CAAC,cAAc,GAAG,CAAC,SAAS,IAAI,EAAE,EAAE,WAAW,CAAC,IAAI,EAAE,GAAG,EAAE;AAC/E,EAAE,IAAI,UAAU,KAAK,EAAE,EAAE;AACzB,IAAI,IAAI,CAAC,YAAY,GAAG,IAAI,GAAG,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC,IAAI;AACrD;AACA,EAAE,OAAO,cAAc,CAAC,IAAI,CAAC;AAC7B,CAAC;AACD,IAAI,iBAAiB,GAAG,CAAC,oBAAoB,KAAK;AAClD,EAAE,MAAM,iBAAiB,GAAG,oBAAoB,CAAC,SAAS;AAC1D,EAAE,oBAAoB,CAAC,SAAS,GAAG,SAAS,IAAI,EAAE;AAClD,IAAI,IAAI,IAAI,CAAC,QAAQ,KAAK,UAAU,EAAE;AACtC,MAAM,OAAO,iBAAiB,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC;AAC/C;AACA,IAAI,MAAM,UAAU,GAAG,iBAAiB,CAAC,IAAI,CAAC,IAAI,EAAE,KAAK,CAAC;AAC1D,IAAI,MAAM,aAAa,GAAG,IAAI,CAAC,UAAU;AACzC,IAAI,IAAI,IAAI,EAAE;AACd,MAAM,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,aAAa,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;AACrD,QAAQ,IAAI,aAAa,CAAC,CAAC,CAAC,CAAC,QAAQ,KAAK,CAAC,EAAE;AAC7C,UAAU,UAAU,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC;AAClE;AACA;AACA;AACA,IAAI,OAAO,UAAU;AACrB,GAAG;AACH,CAAC;;ACrCD,YAAY,EAAE,CAAC,IAAI,CAAC,OAAO,OAAO,KAAK;AACvC,EAAE,MAAM,aAAa,EAAE;AACvB,EAAE,OAAO,aAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC;AAC7D,CAAC,CAAC","x_google_ignoreList":[0]}
@@ -0,0 +1 @@
1
+ import{h as t,r as e,c as i}from"./p-D2pBOsDL.js";function s({tile:e,selected:i,matched:s,uncovered:a,reversTile:h}){return t("div",{class:{"tile-container":!0,selected:i,matched:s}},t(r,{tile:a?e.data:h}))}function r({tile:e}){return"text"===e.type?t("button",{class:"tile tile-text"},e.text):"image"===e.type?t("button",{class:"tile tile-image"},t("img",{src:e.imageSrc})):void 0}const a=class{constructor(t){e(this,t),this.completed=i(this,"completed"),this.matched=i(this,"matched")}tileGroups=[];watchTileGroups(){this.init&&this.initGame()}reverseTile={type:"text",text:"?"};init=!0;tiles=[];selected=[];matchedTiles=[];watchMatchedTiles(){this.matchedTiles.length===this.tiles.length&&this.completed.emit()}cols;blockUI=!1;uncoverSelected=!1;completed;matched;componentWillLoad(){console.log("componentDidLoad",this.init,this.tileGroups,this.reverseTile),this.init&&this.tileGroups.length&&this.initGame()}slots=new Map;get gridCols(){return this.cols?this.cols:Math.floor(Math.sqrt(this.tiles.length))}get gridRows(){return Math.ceil(this.tiles.length/this.gridCols)}get gridAspectRatio(){return this.gridCols/this.gridRows}async initGame(t=this.tileGroups,e=this.reverseTile){console.log("initGame",t),this.reverseTile=e,this.buildTiles(t)}buildTiles(t){let e=[],i=0;t.forEach((t=>{const s=function(t,e){if(console.log("getSet",t,e),t.length<=0)throw new Error("getSet() - no items");if(t.length===e)return[...t];let i=[];for(;e-i.length>t.length;)i=[...i,...t];const s=new Set;for(;s.size<e-i.length;)s.add(t[Math.floor(Math.random()*t.length)]);return[...i,...s]}(t.tiles,t.count);e=[...e,...s.map((e=>({id:i++,data:{...e},groupId:t.id,uncovered:!1,matched:!1})))]})),this.tiles=e.sort((()=>Math.random()-.5))}async onTileClick(t){if(!this.blockUI)if(this.selected.includes(t))this.selected=this.selected.filter((e=>e!==t));else if(this.selected=[...this.selected,t],2===this.selected.length){const t=this.tiles.find((t=>t.id===this.selected[0])),e=this.tiles.find((t=>t.id===this.selected[1]));if(!t||!e)return;this.blockUI=!0,this.uncoverSelected=!0,t.groupId===e.groupId?(await Promise.all([this.markAsMatched(t.id),this.markAsMatched(e.id)]),this.matched.emit({t1:t.data,t2:e.data,groupId:t.groupId}),this.matchedTiles=[...this.matchedTiles,t.id,e.id]):await Promise.all([this.animateWrongMatch(t.id),this.animateWrongMatch(e.id)]),this.uncoverSelected=!1,this.blockUI=!1,this.selected=[]}}markAsMatched(t){return new Promise((e=>{const i=this.slots.get(t);if(!i)return;const s=i.children[0].animate([],{duration:1e3});s.addEventListener("finish",(()=>{e()})),s.addEventListener("cancel",(()=>{e()}))}))}animateWrongMatch(t){return new Promise((e=>{const i=this.slots.get(t);if(!i)return;const s=i.children[0].animate([{rotate:"0deg"},{rotate:"0deg"},{rotate:"30deg"},{rotate:"0deg"},{rotate:"-30deg"},{rotate:"0deg"},{rotate:"0deg"}],{duration:1500});s.addEventListener("finish",(()=>{e()})),s.addEventListener("cancel",(()=>{e()}))}))}render(){return t("div",{key:"56287b90e45786be67ed85b8964bb99a6589f2b5",part:"container",style:{"--aspect":`${this.gridAspectRatio}`}},t("div",{key:"cc965692a5523254c6930a26cb244a24fa7c05f7",part:"list",style:{"--cols":`${this.gridCols}`,"--rows":`${this.gridRows}`}},this.tiles.map((e=>t("div",{part:"tile-slot",onClick:()=>this.onTileClick(e.id),ref:t=>this.slots.set(e.id,t)},t(s,{tile:e,selected:this.selected.includes(e.id),matched:this.matchedTiles.includes(e.id),reversTile:this.reverseTile,uncovered:this.uncoverSelected&&this.selected.includes(e.id)}))))))}static get watchers(){return{tileGroups:[{watchTileGroups:0}],matchedTiles:[{watchMatchedTiles:0}]}}};a.style=":host{box-sizing:border-box;display:grid;place-content:center;width:100%;height:100%;container-type:size}[part=container]{width:min(100cqw, 100cqh / var(--aspect, 1));height:min(100cqw * var(--aspect, 1), 100cqh);container-type:size;background:pink}[part=list]{width:100cqw;height:100cqh;display:grid;grid-template-columns:repeat(var(--cols, 4), 1fr);grid-template-columns:repeat(var(--rows, 4), 1fr)}[part=tile-slot]{display:block;aspect-ratio:1;padding:5%}.tile-container{min-width:0;transition:scale 0.3s;width:100%;height:100%}.tile-container:hover{scale:1.05}.tile-container.selected{scale:1.1}.tile-container.matched{scale:0}.tile{border-radius:var(--tile-border-radius, 5px);border:var(--tile-border-width, 2px) solid var(--tile-border-color, black);padding:0;margin:0}.tile-text{width:100%;height:100%;aspect-ratio:1;background:#d9d9d9;display:grid;place-content:center}.tile-image{width:100%;height:100%}.tile-image img{display:block;width:100%;height:100%;object-fit:cover}";export{a as mb_memory_game}
@@ -2,9 +2,9 @@ import { EventEmitter } from "../../stencil-public-runtime";
2
2
  import { ITile, MatchedEvent, TileDefinition, TileGroup, TileID } from "./types";
3
3
  export declare class MbMemoryGame {
4
4
  tileGroups: TileGroup[];
5
+ watchTileGroups(): void;
5
6
  reverseTile: TileDefinition;
6
7
  init: boolean;
7
- watchBoard(): void;
8
8
  tiles: ITile[];
9
9
  selected: TileID[];
10
10
  matchedTiles: (string | number | null)[];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mborecki/memory-game",
3
- "version": "0.1.0",
3
+ "version": "0.3.2",
4
4
  "private": false,
5
5
  "type": "module",
6
6
  "description": "Sliding Puzzle",
@@ -1 +0,0 @@
1
- import{h as t,r as e,c as i}from"./p-D2pBOsDL.js";function s({tile:e,selected:i,matched:s,uncovered:a,reversTile:h}){return t("div",{class:{"tile-container":!0,selected:i,matched:s}},t(r,{tile:a?e.data:h}))}function r({tile:e}){return"text"===e.type?t("button",{class:"tile tile-text"},e.text):"image"===e.type?t("button",{class:"tile tile-image"},t("img",{src:e.imageSrc})):void 0}const a=class{constructor(t){e(this,t),this.completed=i(this,"completed"),this.matched=i(this,"matched")}tileGroups=[];reverseTile={type:"text",text:"?"};init=!0;watchBoard(){this.init&&this.initGame()}tiles=[];selected=[];matchedTiles=[];watchMatchedTiles(){this.matchedTiles.length===this.tiles.length&&this.completed.emit()}cols;blockUI=!1;uncoverSelected=!1;completed;matched;componentWillLoad(){console.log("componentDidLoad",this.init),this.init&&this.tileGroups&&this.initGame()}slots=new Map;get gridCols(){return this.cols?this.cols:Math.floor(Math.sqrt(this.tiles.length))}get gridRows(){return Math.ceil(this.tiles.length/this.gridCols)}get gridAspectRatio(){return this.gridCols/this.gridRows}async initGame(t=this.tileGroups,e=this.reverseTile){console.log("initGame",t),this.reverseTile=e,this.buildTiles(t)}buildTiles(t){let e=[],i=0;t.forEach((t=>{const s=function(t,e){if(console.log("getSet",t,e),t.length<=0)throw new Error("getSet() - no items");if(t.length===e)return[...t];let i=[];for(;e-i.length>t.length;)i=[...i,...t];const s=new Set;for(;s.size<e-i.length;)s.add(t[Math.floor(Math.random()*t.length)]);return[...i,...s]}(t.tiles,t.count);e=[...e,...s.map((e=>({id:i++,data:{...e},groupId:t.id,uncovered:!1,matched:!1})))]})),this.tiles=e.sort((()=>Math.random()-.5))}async onTileClick(t){if(!this.blockUI)if(this.selected.includes(t))this.selected=this.selected.filter((e=>e!==t));else if(this.selected=[...this.selected,t],2===this.selected.length){const t=this.tiles.find((t=>t.id===this.selected[0])),e=this.tiles.find((t=>t.id===this.selected[1]));if(!t||!e)return;this.blockUI=!0,this.uncoverSelected=!0,t.groupId===e.groupId?(await Promise.all([this.markAsMatched(t.id),this.markAsMatched(e.id)]),this.matched.emit({t1:t.data,t2:e.data,groupId:t.groupId}),this.matchedTiles=[...this.matchedTiles,t.id,e.id]):await Promise.all([this.animateWrongMatch(t.id),this.animateWrongMatch(e.id)]),this.uncoverSelected=!1,this.blockUI=!1,this.selected=[]}}markAsMatched(t){return new Promise((e=>{const i=this.slots.get(t);if(!i)return;const s=i.children[0].animate([],{duration:1e3});s.addEventListener("finish",(()=>{e()})),s.addEventListener("cancel",(()=>{e()}))}))}animateWrongMatch(t){return new Promise((e=>{const i=this.slots.get(t);if(!i)return;const s=i.children[0].animate([{rotate:"0deg"},{rotate:"0deg"},{rotate:"30deg"},{rotate:"0deg"},{rotate:"-30deg"},{rotate:"0deg"},{rotate:"0deg"}],{duration:1500});s.addEventListener("finish",(()=>{e()})),s.addEventListener("cancel",(()=>{e()}))}))}render(){return t("div",{key:"bb7b898014606de493fd580e50ef685f529ac2bb",part:"container",style:{"--aspect":`${this.gridAspectRatio}`}},t("div",{key:"0c677fb539e7af023c21411e70adf64050c97077",part:"list",style:{"--cols":`${this.gridCols}`,"--rows":`${this.gridRows}`}},this.tiles.map((e=>t("div",{part:"tile-slot",onClick:()=>this.onTileClick(e.id),ref:t=>this.slots.set(e.id,t)},t(s,{tile:e,selected:this.selected.includes(e.id),matched:this.matchedTiles.includes(e.id),reversTile:this.reverseTile,uncovered:this.uncoverSelected&&this.selected.includes(e.id)}))))))}static get watchers(){return{board:[{watchBoard:0}],matchedTiles:[{watchMatchedTiles:0}]}}};a.style=":host{box-sizing:border-box;display:grid;place-content:center;width:100%;height:100%;container-type:size}[part=container]{width:min(100cqw, 100cqh / var(--aspect, 1));height:min(100cqw * var(--aspect, 1), 100cqh);container-type:size;background:pink}[part=list]{width:100cqw;height:100cqh;display:grid;grid-template-columns:repeat(var(--cols, 4), 1fr);grid-template-columns:repeat(var(--rows, 4), 1fr)}[part=tile-slot]{display:block;aspect-ratio:1;padding:5%}.tile-container{min-width:0;transition:scale 0.3s;width:100%;height:100%}.tile-container:hover{scale:1.05}.tile-container.selected{scale:1.1}.tile-container.matched{scale:0}.tile{border-radius:var(--tile-border-radius, 5px);border:var(--tile-border-width, 2px) solid var(--tile-border-color, black);padding:0;margin:0}.tile-text{width:100%;height:100%;aspect-ratio:1;background:#d9d9d9;display:grid;place-content:center}.tile-image{width:100%;height:100%}.tile-image img{display:block;width:100%;height:100%;object-fit:cover}";export{a as mb_memory_game}