diff --git a/dist/index.c0fd3053.js b/dist/index.c0fd3053.js index 22140b8..053c6b2 100644 --- a/dist/index.c0fd3053.js +++ b/dist/index.c0fd3053.js @@ -181,10 +181,16 @@ exports.export = function(dest, destName, get) { },{}],"7OIPf":[function(require,module,exports,__globalThis) { var parcelHelpers = require("@parcel/transformer-js/src/esmodule-helpers.js"); parcelHelpers.defineInteropFlag(exports); -parcelHelpers.export(exports, "hashCode", ()=>hashCode); parcelHelpers.export(exports, "getLevelBackground", ()=>getLevelBackground); +parcelHelpers.export(exports, "hashCode", ()=>hashCode); var _backgroundsJson = require("./backgrounds.json"); var _backgroundsJsonDefault = parcelHelpers.interopDefault(_backgroundsJson); +const backgrounds = (0, _backgroundsJsonDefault.default); +function getLevelBackground(level) { + let svg = level.svg !== null && backgrounds[level.svg % backgrounds.length]; + if (!level.color && !svg) svg = backgrounds[hashCode(level.name) % backgrounds.length]; + return svg; +} function hashCode(string) { let hash = 0; for(let i = 0; i < string.length; i++){ @@ -194,12 +200,6 @@ function hashCode(string) { } return Math.abs(hash); } -const backgrounds = (0, _backgroundsJsonDefault.default); -function getLevelBackground(level) { - let svg = level.svg !== null && backgrounds[level.svg % backgrounds.length]; - if (!level.color && !svg) svg = backgrounds[hashCode(level.name) % backgrounds.length]; - return svg; -} },{"./backgrounds.json":"el6Kx","@parcel/transformer-js/src/esmodule-helpers.js":"gkKU3"}],"el6Kx":[function(require,module,exports,__globalThis) { module.exports = JSON.parse("[\"\",\"\",\"\",\"\",\"\",\"\",\"\",\"\",\"\",\"\",\"\",\"\",\"\",\"\",\"\",\"\",\"\",\"\",\"\",\"\",\"\",\"\",\"\",\"\",\"\",\"\",\"\",\"\",\"\",\"\",\"\",\"\"]"); diff --git a/dist/index.c0fd3053.js.map b/dist/index.c0fd3053.js.map index 325344f..b311bba 100644 --- a/dist/index.c0fd3053.js.map +++ b/dist/index.c0fd3053.js.map @@ -1 +1 @@ -{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,OAAO,GAAG,KAAK,KAAK,CAAC;;;ACA5B,OAAO,OAAO,GAAG,KAAK,KAAK,CAAC;;;ACA5B,QAAQ,cAAc,GAAG,SAAU,CAAC;IAClC,OAAO,KAAK,EAAE,UAAU,GAAG,IAAI;QAAC,SAAS;IAAC;AAC5C;AAEA,QAAQ,iBAAiB,GAAG,SAAU,CAAC;IACrC,OAAO,cAAc,CAAC,GAAG,cAAc;QAAC,OAAO;IAAI;AACrD;AAEA,QAAQ,SAAS,GAAG,SAAU,MAAM,EAAE,IAAI;IACxC,OAAO,IAAI,CAAC,QAAQ,OAAO,CAAC,SAAU,GAAG;QACvC,IACE,QAAQ,aACR,QAAQ,gBACR,OAAO,SAAS,CAAC,cAAc,CAAC,IAAI,CAAC,MAAM,MAE3C;QAGF,OAAO,cAAc,CAAC,MAAM,KAAK;YAC/B,YAAY;YACZ,KAAK;gBACH,OAAO,MAAM,CAAC,IAAI;YACpB;QACF;IACF;IAEA,OAAO;AACT;AAEA,QAAQ,MAAM,GAAG,SAAU,IAAI,EAAE,QAAQ,EAAE,GAAG;IAC5C,OAAO,cAAc,CAAC,MAAM,UAAU;QACpC,YAAY;QACZ,KAAK;IACP;AACF;;;;;AChCA,8CAAgB;AAahB,wDAAgB;AAHhB;;AAVO,SAAS,SAAS,MAAc;IACrC,IAAI,OAAO;IACX,IAAK,IAAI,IAAI,GAAG,IAAI,OAAO,MAAM,EAAE,IAAK;QACtC,IAAI,OAAO,OAAO,UAAU,CAAC;QAC7B,OAAO,AAAC,CAAA,QAAQ,CAAA,IAAK,OAAO;QAC5B,OAAO,OAAO,MAAM,2BAA2B;IACjD;IACA,OAAO,KAAK,GAAG,CAAC;AAClB;AAGA,MAAM,cAAc,CAAA,GAAA,+BAAY,AAAD;AAExB,SAAS,mBAAmB,KAAc;IAE7C,IAAI,MAAM,MAAM,GAAG,KAAK,QAAQ,WAAW,CAAC,MAAM,GAAG,GAAG,YAAY,MAAM,CAAC;IAE3E,IAAI,CAAC,MAAM,KAAK,IAAI,CAAC,KACnB,MAAM,WAAW,CAAC,SAAS,MAAM,IAAI,IAAI,YAAY,MAAM,CAAC;IAE9D,OAAO;AACX;;;ACvBA,OAAO,OAAO,GAAG,KAAK,KAAK,CAAC","sources":["src/palette.json","src/levels.json","node_modules/@parcel/transformer-js/src/esmodule-helpers.js","src/getLevelBackground.ts","src/backgrounds.json"],"sourcesContent":["{\n \"_\": \"\",\n \"B\": \"black\",\n \"W\": \"white\",\n \"g\": \"#231f20\",\n \"y\": \"#ffd300\",\n \"b\": \"#6262EA\",\n \"t\": \"#5DA3EA\",\n \"s\": \"#E67070\",\n \"r\": \"#e32119\",\n \"R\": \"#ab0c0c\",\n \"c\": \"#59EEA3\",\n \"G\": \"#A1F051\",\n \"v\": \"#A664E8\",\n \"p\": \"#E869E8\",\n \"a\": \"#5BECEC\",\n \"C\": \"#53EE53\",\n \"S\": \"#F44848\",\n \"P\": \"#E66BA8\",\n \"O\": \"#F29E4A\",\n \"k\": \"#618227\",\n \"e\": \"#e1c8b4\",\n \"l\": \"#9b9fa4\"\n}\n","[\n {\n \"name\": \"71 mini\",\n \"size\": 5,\n \"bricks\": \"bbb____bt__btt__b_t___ttt\",\n \"svg\": 23,\n \"color\": \"\"\n },\n {\n \"name\": \"Butterfly\",\n \"bricks\": \"_________bb_t_t_bbbbb_t_bbbbbbbtbbbb_bbbtbbb____btb____bbbtbbb__bb_t_bb___________________\",\n \"size\": 9,\n \"svg\": 20,\n \"color\": \"\"\n },\n {\n \"name\": \"Castle\",\n \"size\": 7,\n \"bricks\": \"s_s_s_ssssssssssBBBssssBBBssttbbbttttbbbtttbtbtbt\",\n \"svg\": 16\n },\n {\n \"name\": \"Eyes\",\n \"size\": 9,\n \"bricks\": \"ttttttt__tWWWWWWW_tWrrWttW_tWWWWWWW_ttttttt_____t______ttttt____ttttt_____t_t\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Creeper\",\n \"size\": 10,\n \"bricks\": \"___________ccGGccGG__cGccGcGc__GBBccBBc__cBBGcBBc__GccBBGGc__ccBBBBcG__GGBBBBcG__cGBccBGc___________\",\n \"svg\": 22\n },\n {\n \"name\": \"Stairs\",\n \"size\": 8,\n \"bricks\": \"tt______tt______bbtt____bbtt____vvbbtt__vvbbtt__ppvvbbttppvvbbtt\",\n \"svg\": 14\n },\n {\n \"name\": \"Dots\",\n \"size\": 9,\n \"bricks\": \"b_t_a_c____________b_t_a_c__________P_b_t_a_c__________P_b_t_a____________P_b_t_a\",\n \"svg\": null\n },\n {\n \"name\": \"Lines\",\n \"size\": 9,\n \"bricks\": \"aaaaaaaa___________tttttttt_________aaaaaaaa___________tttttttt_________aaaaaaaa\",\n \"svg\": 8,\n \"color\": \"\"\n },\n {\n \"name\": \"Heart\",\n \"size\": 15,\n \"bricks\": \"__________________RRR___RRR_____RSSSR_RSSSR___RSWWSSRSSSSSR__RSWSSSSSSSSSR__RSSSSSSSSSSSR__RSWSSSSSSSSSR___RSSSSSSSSSR_____RSSSSSSSR_______RSSSSSR_________RSSSR___________RSR_____________R____________________________________\",\n \"svg\": 17,\n \"color\": \"\"\n },\n {\n \"name\": \"Swiss\",\n \"size\": 7,\n \"bricks\": \"________RRRRR__RRWRR__RWWWR__RRWRR__RRRRR\",\n \"svg\": 13,\n \"color\": \"\"\n },\n {\n \"name\": \"Germany\",\n \"size\": 6,\n \"bricks\": \"_______gggg__rrrr__yyyy\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"France\",\n \"size\": 8,\n \"bricks\": \"_________ttWWrr__ttWWrr__ttWWrr__ttWWrr__ttWWrr________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Smiley\",\n \"size\": 8,\n \"bricks\": \"_________yy__yy__yy__yy__________________yyyyyy___yyyy__________\",\n \"svg\": 29,\n \"color\": \"\"\n },\n {\n \"name\": \"Labyrinthe\",\n \"size\": 11,\n \"bricks\": \"_______tttS_Stttt_S________t___S__Stt_ttttt____t_____S__ttt_S_S____t___t_tttt_t_S_t____tSt_t_t_Sttt___t_t_____Sttt_tttttS\",\n \"svg\": 21\n },\n {\n \"name\": \"Temple\",\n \"size\": 11,\n \"bricks\": \"_______________WWW______WWWWWWW___WWWWWWWWW___b_b_b_b____b_b_b_b____v_v_v_v____P_P_P_P____P_P_P_P____WWWWWWW___WWWWWWWWW_\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Pacman\",\n \"size\": 12,\n \"bricks\": \"____yyyy______yyyyyyyy___yyyyByyyyy__yyyyyyyyy__yyyyyyyy____yyyyyy______yyyyyy___S_Syyyyyyyy_____yyyyyyyyy___yyyyyyyyyy___yyyyyyyy______yyyy\",\n \"svg\": 7,\n \"color\": \"\"\n },\n {\n \"name\": \"Ship\",\n \"size\": 11,\n \"bricks\": \"____sWW________sWWW_______sWWW_______s___OOOOOOOOOOOOOO_OBOBOBOBOO__OOOOOOOO_bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb___________\",\n \"svg\": 19\n },\n {\n \"name\": \"We come in peace\",\n \"size\": 13,\n \"bricks\": \"________________a_____a_______a___a_______aaaaaaa_____aaBaaaBaa___aaaaaaaaaaa__aaaaaaaaaaa__a_aaaaaaa_a__a_a_____a_a_____aa_aa_____________________________\",\n \"svg\": 29,\n \"color\": \"\"\n },\n {\n \"name\": \"Space mushroom\",\n \"size\": 10,\n \"bricks\": \"______________WW_______WWWW_____WWWWWW___WWBWWBWW__WWWWWWWW____W__W_____W_WW_W___W_W__W_W\",\n \"svg\": 6,\n \"color\": \"\"\n },\n {\n \"name\": \"Wololo\",\n \"size\": 9,\n \"bricks\": \"____WW_OOW___WW__OWW__W___OWWWbbbW_WWW_WbW_WOW__WWb__OW__bbb__O___W_W__O___W_W__O\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Small heart\",\n \"size\": 15,\n \"bricks\": \"________________________________RRRR___RRRR___RrWWrR_RWWrrR__RWWrrrRWWrrrR__RrrrrrrrrrrrR__RrrrrrrrrrrrR___RrrrrrrrrrR_____RrrrrrrrR_______RrrrrrR_________RrrrR___________RrR_____________R______________________\",\n \"svg\": 29,\n \"color\": \"\"\n },\n {\n \"name\": \"Eye\",\n \"size\": 9,\n \"bricks\": \"____________ggg_____gWWWg___gWbbbWg_gWWbBbWWg_gWbbbWg___gWWWg_____ggg____________\",\n \"svg\": null,\n \"color\": \"#5da3ea\"\n },\n {\n \"name\": \"Enderman\",\n \"size\": 10,\n \"bricks\": \"___________gggggggg__gggggggg__gggggggg__gggggggg__vvvggvvv__gggggggg__gggggggg__gggggggg_____________________\",\n \"svg\": null,\n \"color\": \"#154b07\"\n },\n {\n \"name\": \"Mushroom\",\n \"size\": 16,\n \"bricks\": \"_____________________rrrrWW________WWrrrrWWWW_____WWrrrrrrWWWW____WrrWWWWrrWWW___rrrWWWWWWrrrrr__rrrWWWWWWrrWWr__WrrWWWWWWrWWWW__WWrrWWWWrrWWWW__WWrrrrrrrrrWWr__WrrWWWWWWWWrrr_____WWBWWBWW_______WWWBWWBWWW______WWWWWWWWWW_______WWWWWWWW____________________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Tulip\",\n \"size\": 11,\n \"bricks\": \"______________R_R_R______RRRRR______RRRRR______RRRRR_______RRR_________k________k_k_k______k_k_k_______kkk_________k________________\",\n \"svg\": 17,\n \"color\": \"\"\n },\n {\n \"name\": \"Chain\",\n \"size\": 7,\n \"bricks\": \"yyy____yBy____yyyyy____yBy____yyyyy____yBy____yyy\",\n \"svg\": 31,\n \"color\": \"\"\n },\n {\n \"name\": \"Marion\",\n \"size\": 9,\n \"bricks\": \"rr_____rr_rr___rr__rrr_rrr__rrrrrrr__rr_r_rr__rr___rr__rr___rr__rr___rr_rrr___rrr\",\n \"svg\": 27,\n \"color\": \"\"\n },\n {\n \"name\": \"Renan\",\n \"size\": 9,\n \"bricks\": \"yyyyyyy___yyyyyyy__yy___yy__yy___yy__yyyyyy___yy_yy____yy__yy___yy___yy_yyy___yyy\",\n \"svg\": 3,\n \"color\": \"\"\n },\n {\n \"name\": \"Violet Pairs\",\n \"size\": 8,\n \"bricks\": \"b_b_b_b_b_b_b_b__________t_t_t_t_t_t_t_t________b_b_b_b_b_b_b_b\",\n \"svg\": 5,\n \"color\": \"\"\n },\n {\n \"name\": \"Red Cups\",\n \"size\": 11,\n \"bricks\": \"___________rBr_rBr_rBrrrr_rrr_rrr___________r_rBr_rBr_rr_rrr_rrr_r___________rBr_rBr_rBrrrr_rrr_rrr__________\",\n \"svg\": 23,\n \"color\": \"\"\n },\n {\n \"name\": \"Cactus\",\n \"size\": 10,\n \"bricks\": \"____G______rG_Gk______G_Gk______kkkk_r_____kkk_G______GkGk_____rGkk_______Gk________kk________kk_____\",\n \"svg\": 27,\n \"color\": \"\"\n },\n {\n \"name\": \"Sunny Face\",\n \"size\": 11,\n \"bricks\": \"____yyy______yyyyyyy___yyyyyyyyy__yyyyyyyyy_yyyWWyWWyyyyyyyyyyyyyyyyyyyyyyyyy_yyWWWWWyy__yyyWWWyyy___yyyyyyy______yyy\",\n \"svg\": null,\n \"color\": \"#5da3ea\"\n },\n {\n \"name\": \"Mountain\",\n \"size\": 9,\n \"bricks\": \"_______________W_______WWW______GGWW__W_GGGGG_kkkGGGGG_kkkkGGGGkkkkkGGGGkkkkkkGGG_________\",\n \"svg\": 15,\n \"color\": \"\"\n },\n {\n \"name\": \"Dollar\",\n \"size\": 17,\n \"bricks\": \"________________________G_G______________G_G____________GGGGGGG_________GGGGGGGGG_______GG__G_G__GG______GG__G_G__GG______GG__G_G___________GGGGGGGG__________GGGGGGGG___________G_G__GG______GG__G_G__GG______GG__G_G__GG_______GGGGGGGGG_________GGGGGGG____________G_G______________G_G________________________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Waves\",\n \"size\": 8,\n \"bricks\": \"___bbb____bbb____bbttbbbbbttbbbbttttaatttttaattttaaaaaaa\",\n \"svg\": 20,\n \"color\": \"\"\n },\n {\n \"name\": \"Box\",\n \"size\": 8,\n \"bricks\": \"yyyyyyyyy______yy_bbbb_yy_b__b_yy_b__b_yy_bbbb_yy______yyyyyyyyy\",\n \"svg\": 30,\n \"color\": \"\",\n \"squared\": false\n },\n {\n \"name\": \"Rose\",\n \"size\": 9,\n \"bricks\": \"__SS______SSSS_____SSSS_____SSSS______SS_k______k_kk_____kk_k______kk________k\",\n \"svg\": 4,\n \"color\": \"\"\n },\n {\n \"name\": \"Time\",\n \"size\": 9,\n \"bricks\": \"__________WWWWWWW___WWWWW_____yyy_______y________y_______WyW_____WyyyW___yyyyyyy__________\",\n \"svg\": 9,\n \"color\": \"\",\n \"squared\": false\n },\n {\n \"name\": \"Watermelon\",\n \"size\": 8,\n \"bricks\": \"_____Sk_____SSBk___SBSSk__SSSSSk_SSBSSk_SBSSSSk_kSSSkk___kkk____\",\n \"svg\": 28,\n \"color\": \"\"\n },\n {\n \"name\": \"Worms\",\n \"size\": 13,\n \"bricks\": \"___sssss_______sssssss______WWsWWsss_____WBsBWsss_____WBsBWsss_____WWsWWsss_____sssssss_______ssssss_____WWWWWWss_______WssWs__s_____ssss__sss___sssssssssss__sssssssss_ss\",\n \"svg\": null,\n \"color\": \"\",\n \"squared\": false\n },\n {\n \"name\": \"Ocean Sunrise\",\n \"size\": 8,\n \"bricks\": \"SSSSSSSSSSSyySSSSSyyyySSSyyyyyySbttttttbbbttttbbbbbttbbbbbbbbbbb\",\n \"svg\": 12,\n \"color\": \"\"\n },\n {\n \"name\": \"Crosses\",\n \"size\": 13,\n \"bricks\": \"b___b___b___b__v___v___v___vvv_vvv_vvv___v___v___v__p___p___p___ppp_ppp_ppp_ppp___p___p___p__P___P___P___PPP_PPP_PPP___P___P___P__p___p___p___ppp_ppp_ppp_ppp___p___p___p\",\n \"svg\": 10,\n \"color\": \"\"\n },\n {\n \"name\": \"Negative space\",\n \"size\": 9,\n \"bricks\": \"tttttttttt_t_t_t_t_________b_b_b_b_bbbbbbbbbb_b_b_b_b___________t_t_t_t_ttttttttt_________\",\n \"svg\": null\n },\n {\n \"name\": \"UK\",\n \"size\": 11,\n \"bricks\": \"brbbWrWbbrbbbrbWrWbrbbbbbrWrWrbbbWWWWWrWWWWWrrrrrrrrrrrWWWWWrWWWWWbbbrWrWrbbbbbrbWrWbrbbbrbbWrWbbrb__________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Greece\",\n \"size\": 11,\n \"bricks\": \"ttWttttttttttWttWWWWWWWWWWWttttttttWttWWWWWWttWttttttttWWWWWWWWWWWtttttttttttWWWWWWWWWWWttttttttttt__________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Russia\",\n \"size\": 8,\n \"bricks\": \"________WWWWWWWWWWWWWWWWttttttttttttttttrrrrrrrrrrrrrrrr________________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Ukraine\",\n \"size\": 8,\n \"bricks\": \"________ttttttttttttttttttttttttyyyyyyyyyyyyyyyyyyyyyyyy________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Poland\",\n \"size\": 7,\n \"bricks\": \"________WWWWW__WWWWW__rrrrr__rrrrr_______________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Yellow 71\",\n \"size\": 9,\n \"bricks\": \"_________yyyyy__yyyyyyy_yyy___yy__yy__yyy__yy_yyy___yy_yy____yy_yy____yy__________________\",\n \"svg\": 26,\n \"color\": \"\"\n },\n {\n \"name\": \"71 on white\",\n \"size\": 6,\n \"bricks\": \"WWWWWWrrrWWrWWrWrrWrWWWrWrWWWrWWWWWW______\",\n \"svg\": null\n },\n {\n \"name\": \"Blue 71\",\n \"size\": 8,\n \"bricks\": \"ttttt__bttttt_bb___ttbbb__tt__bb__tt__bb_tt___bb_tt___bb_tt___bb\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Seventy one\",\n \"size\": 21,\n \"bricks\": \"rr_yy_rrry_yrrry_yrrrr_ry_yr__y_yr_ry_y_r_rr_yy_rr_yy_r_ry_y_r_r_ry_yr__y_yr_ry_y_r_rr_y_yrrry_yrrryyy_r_yyy__________________y______________r_____yyyrrry_yrrryyyrr_y_y__yrr_y_yrr_y_yr__y_yyyyrrr_y_rrry_yrrryyy____________________yrrryyyrrr_________yy_r_ry_yrr_____________rrry_yrrryyyyyyyyyyyy_____________________________________________________________________________________________________________________________\",\n \"svg\": null\n },\n {\n \"name\": \"B71\",\n \"size\": 10,\n \"bricks\": \"__________bbbtttt_b_b__b__tbb_b__b__t_b_bbb__t__b_b__b_t__b_b__bt___b_bbb_t__bbb__________\",\n \"svg\": null\n },\n {\n \"name\": \"Pig\",\n \"size\": 9,\n \"bricks\": \"__________PP___PP__PPP_PPP__WWPPPWW__WBPPPBW__PPsssPP__PsBsBsP__PPsssPP___________\",\n \"svg\": null\n },\n {\n \"name\": \"Big Pig\",\n \"size\": 15,\n \"bricks\": \"________________sss_______sss__ss__sssss__ss____sssssssss_____sWBsssssBWs___ssBBsssssBBss__ssss_____ssss__sss_sssss_sss__sss_sBsBs_sss__sss_sssss_sss___sss_____sss____sssssssssss__GGGsssssssssGGGGGGsGsssssGsGGGGGGssGGGGGssGGG_______________\",\n \"svg\": 2,\n \"color\": \"\"\n },\n {\n \"name\": \"Donkey Kong\",\n \"size\": 9,\n \"bricks\": \"OOr__a___OOr__a___ppppppp_O______a________a____pppppppr_a______b_a___O__ppppppp__\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Banana\",\n \"size\": 12,\n \"bricks\": \"_________________e__________eee_________eee_________eee_________eeeyy_____yyeeyyyy___yyyyey_yC___yy_yyy___C_____yyyy_________yyyy_________yyyy\",\n \"svg\": null\n },\n {\n \"name\": \"Fox\",\n \"size\": 8,\n \"bricks\": \"e______eee_OO_eeeeOOOOeeeOBOOBOeOOOOOOOO_WWBBWW___WWWW_____WW___\",\n \"svg\": null\n },\n {\n \"name\": \"Wiki\",\n \"size\": 10,\n \"bricks\": \"_______________________GGGG_____GGkkGG___GkggggkG__GgWWWWgG__GkggggkG___GGkkGG_____GGGG_______________________\",\n \"svg\": null\n },\n {\n \"name\": \"Baby Dog\",\n \"size\": 8,\n \"bricks\": \"_______W__eeeeWWWWeeWeWWWegWegeeeeWWWWee_eWggWe__eWWWWe____WW\",\n \"svg\": null\n },\n {\n \"name\": \"Cute dog\",\n \"size\": 9,\n \"bricks\": \"__________O_____O_OOOWWWOOOOOWWWWWOOOOeWWWWOO_eBeWWBW__eBeWWBW___eWBWW_____WRW____________\",\n \"svg\": null\n },\n {\n \"name\": \"icon:extra_life\",\n \"size\": 9,\n \"bricks\": \"___________rr_rr___rrrrrrr_rrrrrrrrrrrrrrrrrr_rrrrrrr___rrrrr_____rrr_______r_____________\",\n \"svg\": null\n },\n {\n \"name\": \"icon:streak_shots\",\n \"size\": 8,\n \"bricks\": \"_W_W_W__W_W_W_W_tttttt_WttttttW_tttttt_W______W______W_____WWWW\",\n \"svg\": null\n },\n {\n \"name\": \"icon:base_combo\",\n \"size\": 8,\n \"bricks\": \"ttttttttttyyttttttyytyyttttttyyttyyttttttyytyyttttttyytttttttttt________\",\n \"svg\": null\n },\n {\n \"name\": \"icon:slow_down\",\n \"size\": 10,\n \"bricks\": \"_____________kk_______kkkk_____kkkkkkGG__kkkkkkGBG_kkkkkkGGGGkkkkkkGG__GGGGGG____GG__GG_____________\",\n \"svg\": null\n },\n {\n \"name\": \"icon:bigger_puck\",\n \"size\": 8,\n \"bricks\": \"_________tttttt__tttttt______________________W___________WWWWWW_\",\n \"svg\": null\n },\n {\n \"name\": \"icon:viscosity\",\n \"size\": 8,\n \"bricks\": \"________tt______bbtt__ttbbbbttbbbtbbtbbbbbtbbtbbbbbybbybbbbbbbbb\",\n \"svg\": null\n },\n {\n \"name\": \"icon:left_is_lava\",\n \"size\": 8,\n \"bricks\": \"r_______rtttttt_rtttttt_r_______r_______r____W__r_______r_WWW___\",\n \"svg\": null\n },\n {\n \"name\": \"icon:right_is_lava\",\n \"size\": 8,\n \"bricks\": \"_______r_ttttttr_ttttttr_______r_______r_____W_r_______r__WWW__r\",\n \"svg\": null\n },\n {\n \"name\": \"icon:telekinesis\",\n \"size\": 8,\n \"bricks\": \"_____PW_____s______P______s_______P_______s_______P_____WWWWW\",\n \"svg\": null\n },\n {\n \"name\": \"icon:top_is_lava\",\n \"size\": 8,\n \"bricks\": \"rrrrrrrr_tttttt__tttttt____________________W_______________WWW__\",\n \"svg\": null\n },\n {\n \"name\": \"icon:coin_magnet\",\n \"size\": 8,\n \"bricks\": \"__y__y_yy_________y_y_y_y________y_y______________y______WWW____\",\n \"svg\": null\n },\n {\n \"name\": \"icon:skip_last\",\n \"size\": 5,\n \"bricks\": \"_ttt_t_t_ttt_ttt_t_t_ttt_\",\n \"svg\": null\n },\n {\n \"name\": \"icon:multiball\",\n \"size\": 8,\n \"bricks\": \"_________tttttt__tttttt___________W__W____________________WWW___\",\n \"svg\": null\n },\n {\n \"name\": \"icon:smaller_puck\",\n \"size\": 8,\n \"bricks\": \"_________tttttt__tttttt_____________W_____________________WW____\",\n \"svg\": null\n },\n {\n \"name\": \"icon:pierce\",\n \"size\": 6,\n \"bricks\": \"ttttttttttWtttt__ttt__ttt__ttt__tttt\",\n \"svg\": null\n },\n {\n \"name\": \"icon:picky_eater\",\n \"size\": 8,\n \"bricks\": \"rtrtrtrttrtrtrtrrtrtrtrt____________________t_____________WWWW\",\n \"svg\": null\n },\n {\n \"name\": \"icon:metamorphosis\",\n \"size\": 8,\n \"bricks\": \"aaaaaa__aaaa__________W___________ttaatt__tttttt_________WWW\",\n \"svg\": null\n },\n {\n \"name\": \"icon:compound_interest\",\n \"size\": 8,\n \"bricks\": \"_________tttttt__ttt__t______y_____________W__y_________rrWWWrrr\",\n \"svg\": null\n },\n {\n \"name\": \"icon:hot_start\",\n \"size\": 7,\n \"bricks\": \"ttttttttttt_tt_____W_____y_y_____y_____y_y_WWW_y_\",\n \"svg\": null\n },\n {\n \"name\": \"icon:sapper\",\n \"size\": 9,\n \"bricks\": \"_____WW______W__W_tttWttt_yttgggtt__tgggggt__tgggggt__tgggggt__ttgggtt__ttttttt___________\",\n \"svg\": null,\n \"color\": \"#000000\"\n },\n {\n \"name\": \"icon:bigger_explosions\",\n \"size\": 8,\n \"bricks\": \"__r_______ry_rr___ryry__ryyyW_rr_rrWyyy___yryrr__yrry_rr_rr\",\n \"svg\": null\n },\n {\n \"name\": \"icon:extra_levels\",\n \"size\": 6,\n \"bricks\": \"__________b__t_bb_ttt_b__t_bbb____________\",\n \"svg\": null\n },\n {\n \"name\": \"icon:pierce_color\",\n \"size\": 8,\n \"bricks\": \"bb___bbbb__b_bbb_____bbb____bbbbb____bbbbb____bbbbb____bbbbb____\",\n \"svg\": null\n },\n {\n \"name\": \"icon:soft_reset\",\n \"size\": 8,\n \"bricks\": \"___rg_____rrgg___rryggg_rryWggggrryWgggg_ryyggg___rrgg_____rg___\",\n \"svg\": null\n },\n {\n \"name\": \"icon:ball_repulse_ball\",\n \"size\": 8,\n \"bricks\": \"WsP__PsWs______sP______P________________P______Ps______sWsP__PsW\",\n \"svg\": null\n },\n {\n \"name\": \"icon:ball_attract_ball\",\n \"size\": 8,\n \"bricks\": \"__P__P____s__s__PsW__WsP________________PsW__WsP__s__s____P__P__\",\n \"svg\": null\n },\n {\n \"name\": \"icon:puck_repulse_ball\",\n \"size\": 8,\n \"bricks\": \"__________________W_______s___W___P__s______P____________WWW__\",\n \"svg\": null\n },\n {\n \"name\": \"A\",\n \"size\": 7,\n \"bricks\": \"___t_____ttt___t___t__t___t_tttttttt_____tt_____t\",\n \"svg\": null\n },\n {\n \"name\": \"B\",\n \"size\": 9,\n \"bricks\": \"_bbbbb_____bb_bb____bb_bb____bb_bb____bbbb_____bb_bb____bb_bb____bb_bb___bbbbb____\",\n \"svg\": null\n },\n {\n \"name\": \"C\",\n \"size\": 8,\n \"bricks\": \"__rrrr___rrrrrr_rrr___rrrr______rr______rrr___rr_rrrrrr___rrrr\",\n \"svg\": null\n },\n {\n \"name\": \"D\",\n \"size\": 8,\n \"bricks\": \"_GGGGG____GG__G___GG__GG__GG__GG__GG__GG__GG__GG__GG__G__GGGGG\",\n \"svg\": null\n },\n {\n \"name\": \"e\",\n \"size\": 8,\n \"bricks\": \"__tttt___tttttt_tt____tttt____tttttttttttt_______tt__tt___tttt_\",\n \"svg\": null\n },\n {\n \"name\": \"icon:wind\",\n \"size\": 9,\n \"bricks\": \"_ss______s___PPPP_s_________sssssss___________sssssss_s________s___PPPP__ss\",\n \"svg\": null\n },\n {\n \"name\": \"icon:sturdy_bricks\",\n \"size\": 7,\n \"bricks\": \"ttbttttbtttbtt____W_____W_W___W___W_______WWW____\",\n \"svg\": null\n },\n {\n \"name\": \"icon:respawn\",\n \"size\": 9,\n \"bricks\": \"tttt___ttttt__t__ttta_ttt_______________________________W_________________WWW\",\n \"svg\": null\n },\n {\n \"name\": \"Elephant\",\n \"size\": 18,\n \"bricks\": \"_________________________llll_________lll_llllll_lll___lsssllllllllsssl__lsssllllllllsssl__lsssllBllBllsssl__lssllWllllWllssl___ll__llllll__ll_________llll_______________ll______________llll______________ll________________________________________________________________________________________________________________________________________\",\n \"svg\": 25,\n \"color\": \"\"\n },\n {\n \"name\": \"Orca\",\n \"size\": 20,\n \"bricks\": \"____________________________________________________________________________________________BBBBB____BBB_BBB___BBBBBBB____BBBBB___BBBBBBBBB____BBB___BBBBWBBWWW_____BBBBBBBBBBBWWWW_____BBBBBBBBBBWWWWW_____BBBBBBBBBWWWWW_______BBBBBBBWWWWW___________WWBBWWW______________BBB_BB______________BB__B______________________________________________________________________________________________________________________________\",\n \"svg\": null,\n \"color\": \"#1c71d8\"\n },\n {\n \"name\": \"Shark\",\n \"size\": 17,\n \"bricks\": \"__________________________________________g_______________ggg____________ggggggg_________ggggggggg_______ggggggggggg_____gggggWWWggggg____gBgWWWWWWWgBg___ggWWWWrWrWWWWgg__ggWWWrrrrrWWWgg_ggWWWrrrrrrrWWWggggWWrrrrrrrrrWWgggWWWrWrWrWrWrWWWggWWrrWWWWWWWrrWWggWWWWWWWWWWWWWWWg_________________\",\n \"svg\": null,\n \"color\": \"#3584e4\"\n },\n {\n \"name\": \"Bird\",\n \"size\": 13,\n \"bricks\": \"_______RRR____R____RSSSR___RR__RSSWWWR__RSR_RSWWBWR__RSSRRSWWWWyy_RSSSRSWWWR___RSSSSSSRR_____RRSSyyyy______RSyyyyy___RRRRSyyyy____RSSSRyyy_____RRRR______________________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Tux\",\n \"size\": 14,\n \"bricks\": \"_____gggg________gggggggg_____gggggggggg____gggggggggg___gggggggggggg__gggWBggWBggg__gggBBggBBggg__ggggyyyygggg_ggggggyyggggggggggWWWWWWggggg_gWWWWWWWWg_g__WWWWWWWWWW____WWWWWWWWWW____yyy____yyy__\",\n \"svg\": null,\n \"color\": \"#62a0ea\"\n },\n {\n \"name\": \"Armenia\",\n \"size\": 6,\n \"bricks\": \"_______rrrr__bbbb__yyyy_____________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Austria\",\n \"size\": 6,\n \"bricks\": \"_______rrrr__WWWW__rrrr______\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Benin\",\n \"size\": 8,\n \"bricks\": \"_________kkyyyy__kkyyyy__kkrrrr__kkrrrr__________________________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Botswana\",\n \"size\": 10,\n \"bricks\": \"___________tttttttt__tttttttt__tttttttt__WWWWWWWW__BBBBBBBB__WWWWWWWW__tttttttt__tttttttt__tttttttt___________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Bulgaria\",\n \"size\": 6,\n \"bricks\": \"_______WWWW__cccc__rrrr_____________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Canada\",\n \"size\": 7,\n \"bricks\": \"________rWWWr__rWrWr__rWWWr______________________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Chad\",\n \"size\": 8,\n \"bricks\": \"_________bbyyRR__bbyyRR__bbyyRR\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"China\",\n \"size\": 8,\n \"bricks\": \"_________RRyRRR__RyRyRR__RRyRRR__RRRRRR\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Colombia\",\n \"size\": 7,\n \"bricks\": \"________yyyyy__yyyyy__bbbbb__RRRRR_______________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Republic of the Congo\",\n \"size\": 7,\n \"bricks\": \"________kkkyy__kkyyr__kyyrr__yyrrr_______________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Côte d'Ivoire\",\n \"size\": 8,\n \"bricks\": \"_________OOWWGG__OOWWGG__OOWWGG\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Denmark\",\n \"size\": 8,\n \"bricks\": \"_________rrWrrr__rrWrrr__WWWWWW__rrWrrr__rrWrrr\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"El Salvador\",\n \"size\": 8,\n \"bricks\": \"_________bbbbbb__bbbbbb__WWWkWW__WWkWWW__bbbbbb__bbbbbb\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Egypt\",\n \"size\": 8,\n \"bricks\": \"_________RRRRRR__RRRRRR__WWWyWW__WWyWWW__gggggg__gggggg\",\n \"svg\": null,\n \"color\": \"#1c71d8\"\n },\n {\n \"name\": \"Estonia\",\n \"size\": 8,\n \"bricks\": \"_________tttttt__tttttt__gggggg__gggggg__WWWWWW__WWWWWW\",\n \"svg\": null,\n \"color\": \"#986a44\"\n },\n {\n \"name\": \"Finland\",\n \"size\": 6,\n \"bricks\": \"_______WtWW__tttt__WtWW_____________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Gabon\",\n \"size\": 5,\n \"bricks\": \"______CCC__yyy__ttt______\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Georgia\",\n \"size\": 9,\n \"bricks\": \"__________WrWrWrW__WWWrWWW__rrrrrrr__WWWrWWW__WrWrWrW__________________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Guinea\",\n \"size\": 8,\n \"bricks\": \"_________rryycc__rryycc__rryycc\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Indonesia\",\n \"size\": 6,\n \"bricks\": \"_______rrrr__rrrr__WWWW__WWWW_______\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"icon:one_more_choice\",\n \"size\": 7,\n \"bricks\": \"ttt____tbbb___tbttt__tbtbbb__btbbb___tbbb____bbb_\",\n \"svg\": null\n },\n {\n \"name\": \"icon:instant_upgrade\",\n \"size\": 5,\n \"bricks\": \"ttt__tbbb_tbbb_tbbb__bbb_\",\n \"svg\": null\n },\n {\n \"name\": \"icon:checkmark_checked\",\n \"size\": 6,\n \"bricks\": \"_WWWWGWBBBGGGGBGGWWGGGBWWBGBBW_WWWW_\",\n \"svg\": null\n },\n {\n \"name\": \"icon:checkmark_unchecked\",\n \"size\": 6,\n \"bricks\": \"_WWWW_WBBBBWWBBBBWWBBBBWWBBBBW_WWWW_\",\n \"svg\": null\n },\n {\n \"name\": \"icon:fullscreen\",\n \"size\": 6,\n \"bricks\": \"WW__WWW____W____________W____WWW__WW\",\n \"svg\": null\n },\n {\n \"name\": \"icon:exit_fullscreen\",\n \"size\": 6,\n \"bricks\": \"_W__W_WW__WW____________WW__WW_W__W_\",\n \"svg\": null\n }\n]","exports.interopDefault = function (a) {\n return a && a.__esModule ? a : {default: a};\n};\n\nexports.defineInteropFlag = function (a) {\n Object.defineProperty(a, '__esModule', {value: true});\n};\n\nexports.exportAll = function (source, dest) {\n Object.keys(source).forEach(function (key) {\n if (\n key === 'default' ||\n key === '__esModule' ||\n Object.prototype.hasOwnProperty.call(dest, key)\n ) {\n return;\n }\n\n Object.defineProperty(dest, key, {\n enumerable: true,\n get: function () {\n return source[key];\n },\n });\n });\n\n return dest;\n};\n\nexports.export = function (dest, destName, get) {\n Object.defineProperty(dest, destName, {\n enumerable: true,\n get: get,\n });\n};\n","import {RawLevel} from \"./types\";\n\nexport function hashCode(string: string) {\n let hash = 0;\n for (let i = 0; i < string.length; i++) {\n let code = string.charCodeAt(i);\n hash = (hash << 5) - hash + code;\n hash = hash & hash; // Convert to 32bit integer\n }\n return Math.abs(hash);\n}\n\nimport _backgrounds from \"./backgrounds.json\";\nconst backgrounds = _backgrounds as string[];\n\nexport function getLevelBackground(level:RawLevel){\n\n let svg = level.svg !== null && backgrounds[level.svg % backgrounds.length];\n\n if (!level.color && !svg) {\n svg = backgrounds[hashCode(level.name) % backgrounds.length];\n }\n return svg\n}","[\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\"\n]\n"],"names":[],"version":3,"file":"index.c0fd3053.js.map","sourceRoot":"/__parcel_source_root/"} \ No newline at end of file +{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,OAAO,GAAG,KAAK,KAAK,CAAC;;;ACA5B,OAAO,OAAO,GAAG,KAAK,KAAK,CAAC;;;ACA5B,QAAQ,cAAc,GAAG,SAAU,CAAC;IAClC,OAAO,KAAK,EAAE,UAAU,GAAG,IAAI;QAAC,SAAS;IAAC;AAC5C;AAEA,QAAQ,iBAAiB,GAAG,SAAU,CAAC;IACrC,OAAO,cAAc,CAAC,GAAG,cAAc;QAAC,OAAO;IAAI;AACrD;AAEA,QAAQ,SAAS,GAAG,SAAU,MAAM,EAAE,IAAI;IACxC,OAAO,IAAI,CAAC,QAAQ,OAAO,CAAC,SAAU,GAAG;QACvC,IACE,QAAQ,aACR,QAAQ,gBACR,OAAO,SAAS,CAAC,cAAc,CAAC,IAAI,CAAC,MAAM,MAE3C;QAGF,OAAO,cAAc,CAAC,MAAM,KAAK;YAC/B,YAAY;YACZ,KAAK;gBACH,OAAO,MAAM,CAAC,IAAI;YACpB;QACF;IACF;IAEA,OAAO;AACT;AAEA,QAAQ,MAAM,GAAG,SAAU,IAAI,EAAE,QAAQ,EAAE,GAAG;IAC5C,OAAO,cAAc,CAAC,MAAM,UAAU;QACpC,YAAY;QACZ,KAAK;IACP;AACF;;;;;AC7BA,wDAAgB;AAWhB,8CAAgB;AAdhB;;AACA,MAAM,cAAc,CAAA,GAAA,+BAAY,AAAD;AAExB,SAAS,mBAAmB,KAAc;IAE7C,IAAI,MAAM,MAAM,GAAG,KAAK,QAAQ,WAAW,CAAC,MAAM,GAAG,GAAG,YAAY,MAAM,CAAC;IAE3E,IAAI,CAAC,MAAM,KAAK,IAAI,CAAC,KACnB,MAAM,WAAW,CAAC,SAAS,MAAM,IAAI,IAAI,YAAY,MAAM,CAAC;IAE9D,OAAO;AACX;AAGO,SAAS,SAAS,MAAc;IACrC,IAAI,OAAO;IACX,IAAK,IAAI,IAAI,GAAG,IAAI,OAAO,MAAM,EAAE,IAAK;QACtC,IAAI,OAAO,OAAO,UAAU,CAAC;QAC7B,OAAO,AAAC,CAAA,QAAQ,CAAA,IAAK,OAAO;QAC5B,OAAO,OAAO,MAAM,2BAA2B;IACjD;IACA,OAAO,KAAK,GAAG,CAAC;AAClB;;;ACxBA,OAAO,OAAO,GAAG,KAAK,KAAK,CAAC","sources":["src/palette.json","src/levels.json","node_modules/@parcel/transformer-js/src/esmodule-helpers.js","src/getLevelBackground.ts","src/backgrounds.json"],"sourcesContent":["{\n \"_\": \"\",\n \"B\": \"black\",\n \"W\": \"white\",\n \"g\": \"#231f20\",\n \"y\": \"#ffd300\",\n \"b\": \"#6262EA\",\n \"t\": \"#5DA3EA\",\n \"s\": \"#E67070\",\n \"r\": \"#e32119\",\n \"R\": \"#ab0c0c\",\n \"c\": \"#59EEA3\",\n \"G\": \"#A1F051\",\n \"v\": \"#A664E8\",\n \"p\": \"#E869E8\",\n \"a\": \"#5BECEC\",\n \"C\": \"#53EE53\",\n \"S\": \"#F44848\",\n \"P\": \"#E66BA8\",\n \"O\": \"#F29E4A\",\n \"k\": \"#618227\",\n \"e\": \"#e1c8b4\",\n \"l\": \"#9b9fa4\"\n}\n","[\n {\n \"name\": \"71 mini\",\n \"size\": 5,\n \"bricks\": \"bbb____bt__btt__b_t___ttt\",\n \"svg\": 23,\n \"color\": \"\"\n },\n {\n \"name\": \"Butterfly\",\n \"bricks\": \"_________bb_t_t_bbbbb_t_bbbbbbbtbbbb_bbbtbbb____btb____bbbtbbb__bb_t_bb___________________\",\n \"size\": 9,\n \"svg\": 20,\n \"color\": \"\"\n },\n {\n \"name\": \"Castle\",\n \"size\": 7,\n \"bricks\": \"s_s_s_ssssssssssBBBssssBBBssttbbbttttbbbtttbtbtbt\",\n \"svg\": 16\n },\n {\n \"name\": \"Eyes\",\n \"size\": 9,\n \"bricks\": \"ttttttt__tWWWWWWW_tWrrWttW_tWWWWWWW_ttttttt_____t______ttttt____ttttt_____t_t\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Creeper\",\n \"size\": 10,\n \"bricks\": \"___________ccGGccGG__cGccGcGc__GBBccBBc__cBBGcBBc__GccBBGGc__ccBBBBcG__GGBBBBcG__cGBccBGc___________\",\n \"svg\": 22\n },\n {\n \"name\": \"Stairs\",\n \"size\": 8,\n \"bricks\": \"tt______tt______bbtt____bbtt____vvbbtt__vvbbtt__ppvvbbttppvvbbtt\",\n \"svg\": 14\n },\n {\n \"name\": \"Dots\",\n \"size\": 9,\n \"bricks\": \"b_t_a_c____________b_t_a_c__________P_b_t_a_c__________P_b_t_a____________P_b_t_a\",\n \"svg\": null\n },\n {\n \"name\": \"Lines\",\n \"size\": 9,\n \"bricks\": \"aaaaaaaa___________tttttttt_________aaaaaaaa___________tttttttt_________aaaaaaaa\",\n \"svg\": 8,\n \"color\": \"\"\n },\n {\n \"name\": \"Heart\",\n \"size\": 15,\n \"bricks\": \"__________________RRR___RRR_____RSSSR_RSSSR___RSWWSSRSSSSSR__RSWSSSSSSSSSR__RSSSSSSSSSSSR__RSWSSSSSSSSSR___RSSSSSSSSSR_____RSSSSSSSR_______RSSSSSR_________RSSSR___________RSR_____________R____________________________________\",\n \"svg\": 17,\n \"color\": \"\"\n },\n {\n \"name\": \"Swiss\",\n \"size\": 7,\n \"bricks\": \"________RRRRR__RRWRR__RWWWR__RRWRR__RRRRR\",\n \"svg\": 13,\n \"color\": \"\"\n },\n {\n \"name\": \"Germany\",\n \"size\": 6,\n \"bricks\": \"_______gggg__rrrr__yyyy\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"France\",\n \"size\": 8,\n \"bricks\": \"_________ttWWrr__ttWWrr__ttWWrr__ttWWrr__ttWWrr________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Smiley\",\n \"size\": 8,\n \"bricks\": \"_________yy__yy__yy__yy__________________yyyyyy___yyyy__________\",\n \"svg\": 29,\n \"color\": \"\"\n },\n {\n \"name\": \"Labyrinthe\",\n \"size\": 11,\n \"bricks\": \"_______tttS_Stttt_S________t___S__Stt_ttttt____t_____S__ttt_S_S____t___t_tttt_t_S_t____tSt_t_t_Sttt___t_t_____Sttt_tttttS\",\n \"svg\": 21\n },\n {\n \"name\": \"Temple\",\n \"size\": 11,\n \"bricks\": \"_______________WWW______WWWWWWW___WWWWWWWWW___b_b_b_b____b_b_b_b____v_v_v_v____P_P_P_P____P_P_P_P____WWWWWWW___WWWWWWWWW_\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Pacman\",\n \"size\": 12,\n \"bricks\": \"____yyyy______yyyyyyyy___yyyyByyyyy__yyyyyyyyy__yyyyyyyy____yyyyyy______yyyyyy___S_Syyyyyyyy_____yyyyyyyyy___yyyyyyyyyy___yyyyyyyy______yyyy\",\n \"svg\": 7,\n \"color\": \"\"\n },\n {\n \"name\": \"Ship\",\n \"size\": 11,\n \"bricks\": \"____sWW________sWWW_______sWWW_______s___OOOOOOOOOOOOOO_OBOBOBOBOO__OOOOOOOO_bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb___________\",\n \"svg\": 19\n },\n {\n \"name\": \"We come in peace\",\n \"size\": 13,\n \"bricks\": \"________________a_____a_______a___a_______aaaaaaa_____aaBaaaBaa___aaaaaaaaaaa__aaaaaaaaaaa__a_aaaaaaa_a__a_a_____a_a_____aa_aa_____________________________\",\n \"svg\": 29,\n \"color\": \"\"\n },\n {\n \"name\": \"Space mushroom\",\n \"size\": 10,\n \"bricks\": \"______________WW_______WWWW_____WWWWWW___WWBWWBWW__WWWWWWWW____W__W_____W_WW_W___W_W__W_W\",\n \"svg\": 6,\n \"color\": \"\"\n },\n {\n \"name\": \"Wololo\",\n \"size\": 9,\n \"bricks\": \"____WW_OOW___WW__OWW__W___OWWWbbbW_WWW_WbW_WOW__WWb__OW__bbb__O___W_W__O___W_W__O\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Small heart\",\n \"size\": 15,\n \"bricks\": \"________________________________RRRR___RRRR___RrWWrR_RWWrrR__RWWrrrRWWrrrR__RrrrrrrrrrrrR__RrrrrrrrrrrrR___RrrrrrrrrrR_____RrrrrrrrR_______RrrrrrR_________RrrrR___________RrR_____________R______________________\",\n \"svg\": 29,\n \"color\": \"\"\n },\n {\n \"name\": \"Eye\",\n \"size\": 9,\n \"bricks\": \"____________ggg_____gWWWg___gWbbbWg_gWWbBbWWg_gWbbbWg___gWWWg_____ggg____________\",\n \"svg\": null,\n \"color\": \"#5da3ea\"\n },\n {\n \"name\": \"Enderman\",\n \"size\": 10,\n \"bricks\": \"___________gggggggg__gggggggg__gggggggg__gggggggg__vvvggvvv__gggggggg__gggggggg__gggggggg_____________________\",\n \"svg\": null,\n \"color\": \"#154b07\"\n },\n {\n \"name\": \"Mushroom\",\n \"size\": 16,\n \"bricks\": \"_____________________rrrrWW________WWrrrrWWWW_____WWrrrrrrWWWW____WrrWWWWrrWWW___rrrWWWWWWrrrrr__rrrWWWWWWrrWWr__WrrWWWWWWrWWWW__WWrrWWWWrrWWWW__WWrrrrrrrrrWWr__WrrWWWWWWWWrrr_____WWBWWBWW_______WWWBWWBWWW______WWWWWWWWWW_______WWWWWWWW____________________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Tulip\",\n \"size\": 11,\n \"bricks\": \"______________R_R_R______RRRRR______RRRRR______RRRRR_______RRR_________k________k_k_k______k_k_k_______kkk_________k________________\",\n \"svg\": 17,\n \"color\": \"\"\n },\n {\n \"name\": \"Chain\",\n \"size\": 7,\n \"bricks\": \"yyy____yBy____yyyyy____yBy____yyyyy____yBy____yyy\",\n \"svg\": 31,\n \"color\": \"\"\n },\n {\n \"name\": \"Marion\",\n \"size\": 9,\n \"bricks\": \"rr_____rr_rr___rr__rrr_rrr__rrrrrrr__rr_r_rr__rr___rr__rr___rr__rr___rr_rrr___rrr\",\n \"svg\": 27,\n \"color\": \"\"\n },\n {\n \"name\": \"Renan\",\n \"size\": 9,\n \"bricks\": \"yyyyyyy___yyyyyyy__yy___yy__yy___yy__yyyyyy___yy_yy____yy__yy___yy___yy_yyy___yyy\",\n \"svg\": 3,\n \"color\": \"\"\n },\n {\n \"name\": \"Violet Pairs\",\n \"size\": 8,\n \"bricks\": \"b_b_b_b_b_b_b_b__________t_t_t_t_t_t_t_t________b_b_b_b_b_b_b_b\",\n \"svg\": 5,\n \"color\": \"\"\n },\n {\n \"name\": \"Red Cups\",\n \"size\": 11,\n \"bricks\": \"___________rBr_rBr_rBrrrr_rrr_rrr___________r_rBr_rBr_rr_rrr_rrr_r___________rBr_rBr_rBrrrr_rrr_rrr__________\",\n \"svg\": 23,\n \"color\": \"\"\n },\n {\n \"name\": \"Cactus\",\n \"size\": 10,\n \"bricks\": \"____G______rG_Gk______G_Gk______kkkk_r_____kkk_G______GkGk_____rGkk_______Gk________kk________kk_____\",\n \"svg\": 27,\n \"color\": \"\"\n },\n {\n \"name\": \"Sunny Face\",\n \"size\": 11,\n \"bricks\": \"____yyy______yyyyyyy___yyyyyyyyy__yyyyyyyyy_yyyWWyWWyyyyyyyyyyyyyyyyyyyyyyyyy_yyWWWWWyy__yyyWWWyyy___yyyyyyy______yyy\",\n \"svg\": null,\n \"color\": \"#5da3ea\"\n },\n {\n \"name\": \"Mountain\",\n \"size\": 9,\n \"bricks\": \"_______________W_______WWW______GGWW__W_GGGGG_kkkGGGGG_kkkkGGGGkkkkkGGGGkkkkkkGGG_________\",\n \"svg\": 15,\n \"color\": \"\"\n },\n {\n \"name\": \"Dollar\",\n \"size\": 17,\n \"bricks\": \"________________________G_G______________G_G____________GGGGGGG_________GGGGGGGGG_______GG__G_G__GG______GG__G_G__GG______GG__G_G___________GGGGGGGG__________GGGGGGGG___________G_G__GG______GG__G_G__GG______GG__G_G__GG_______GGGGGGGGG_________GGGGGGG____________G_G______________G_G________________________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Waves\",\n \"size\": 8,\n \"bricks\": \"___bbb____bbb____bbttbbbbbttbbbbttttaatttttaattttaaaaaaa\",\n \"svg\": 20,\n \"color\": \"\"\n },\n {\n \"name\": \"Box\",\n \"size\": 8,\n \"bricks\": \"yyyyyyyyy______yy_bbbb_yy_b__b_yy_b__b_yy_bbbb_yy______yyyyyyyyy\",\n \"svg\": 30,\n \"color\": \"\",\n \"squared\": false\n },\n {\n \"name\": \"Rose\",\n \"size\": 9,\n \"bricks\": \"__SS______SSSS_____SSSS_____SSSS______SS_k______k_kk_____kk_k______kk________k\",\n \"svg\": 4,\n \"color\": \"\"\n },\n {\n \"name\": \"Time\",\n \"size\": 9,\n \"bricks\": \"__________WWWWWWW___WWWWW_____yyy_______y________y_______WyW_____WyyyW___yyyyyyy__________\",\n \"svg\": 9,\n \"color\": \"\",\n \"squared\": false\n },\n {\n \"name\": \"Watermelon\",\n \"size\": 8,\n \"bricks\": \"_____Sk_____SSBk___SBSSk__SSSSSk_SSBSSk_SBSSSSk_kSSSkk___kkk____\",\n \"svg\": 28,\n \"color\": \"\"\n },\n {\n \"name\": \"Worms\",\n \"size\": 13,\n \"bricks\": \"___sssss_______sssssss______WWsWWsss_____WBsBWsss_____WBsBWsss_____WWsWWsss_____sssssss_______ssssss_____WWWWWWss_______WssWs__s_____ssss__sss___sssssssssss__sssssssss_ss\",\n \"svg\": null,\n \"color\": \"\",\n \"squared\": false\n },\n {\n \"name\": \"Ocean Sunrise\",\n \"size\": 8,\n \"bricks\": \"SSSSSSSSSSSyySSSSSyyyySSSyyyyyySbttttttbbbttttbbbbbttbbbbbbbbbbb\",\n \"svg\": 12,\n \"color\": \"\"\n },\n {\n \"name\": \"Crosses\",\n \"size\": 13,\n \"bricks\": \"b___b___b___b__v___v___v___vvv_vvv_vvv___v___v___v__p___p___p___ppp_ppp_ppp_ppp___p___p___p__P___P___P___PPP_PPP_PPP___P___P___P__p___p___p___ppp_ppp_ppp_ppp___p___p___p\",\n \"svg\": 10,\n \"color\": \"\"\n },\n {\n \"name\": \"Negative space\",\n \"size\": 9,\n \"bricks\": \"tttttttttt_t_t_t_t_________b_b_b_b_bbbbbbbbbb_b_b_b_b___________t_t_t_t_ttttttttt_________\",\n \"svg\": null\n },\n {\n \"name\": \"UK\",\n \"size\": 11,\n \"bricks\": \"brbbWrWbbrbbbrbWrWbrbbbbbrWrWrbbbWWWWWrWWWWWrrrrrrrrrrrWWWWWrWWWWWbbbrWrWrbbbbbrbWrWbrbbbrbbWrWbbrb__________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Greece\",\n \"size\": 11,\n \"bricks\": \"ttWttttttttttWttWWWWWWWWWWWttttttttWttWWWWWWttWttttttttWWWWWWWWWWWtttttttttttWWWWWWWWWWWttttttttttt__________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Russia\",\n \"size\": 8,\n \"bricks\": \"________WWWWWWWWWWWWWWWWttttttttttttttttrrrrrrrrrrrrrrrr________________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Ukraine\",\n \"size\": 8,\n \"bricks\": \"________ttttttttttttttttttttttttyyyyyyyyyyyyyyyyyyyyyyyy________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Poland\",\n \"size\": 7,\n \"bricks\": \"________WWWWW__WWWWW__rrrrr__rrrrr_______________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Yellow 71\",\n \"size\": 9,\n \"bricks\": \"_________yyyyy__yyyyyyy_yyy___yy__yy__yyy__yy_yyy___yy_yy____yy_yy____yy__________________\",\n \"svg\": 26,\n \"color\": \"\"\n },\n {\n \"name\": \"71 on white\",\n \"size\": 6,\n \"bricks\": \"WWWWWWrrrWWrWWrWrrWrWWWrWrWWWrWWWWWW______\",\n \"svg\": null\n },\n {\n \"name\": \"Blue 71\",\n \"size\": 8,\n \"bricks\": \"ttttt__bttttt_bb___ttbbb__tt__bb__tt__bb_tt___bb_tt___bb_tt___bb\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Seventy one\",\n \"size\": 21,\n \"bricks\": \"rr_yy_rrry_yrrry_yrrrr_ry_yr__y_yr_ry_y_r_rr_yy_rr_yy_r_ry_y_r_r_ry_yr__y_yr_ry_y_r_rr_y_yrrry_yrrryyy_r_yyy__________________y______________r_____yyyrrry_yrrryyyrr_y_y__yrr_y_yrr_y_yr__y_yyyyrrr_y_rrry_yrrryyy____________________yrrryyyrrr_________yy_r_ry_yrr_____________rrry_yrrryyyyyyyyyyyy_____________________________________________________________________________________________________________________________\",\n \"svg\": null\n },\n {\n \"name\": \"B71\",\n \"size\": 10,\n \"bricks\": \"__________bbbtttt_b_b__b__tbb_b__b__t_b_bbb__t__b_b__b_t__b_b__bt___b_bbb_t__bbb__________\",\n \"svg\": null\n },\n {\n \"name\": \"Pig\",\n \"size\": 9,\n \"bricks\": \"__________PP___PP__PPP_PPP__WWPPPWW__WBPPPBW__PPsssPP__PsBsBsP__PPsssPP___________\",\n \"svg\": null\n },\n {\n \"name\": \"Big Pig\",\n \"size\": 15,\n \"bricks\": \"________________sss_______sss__ss__sssss__ss____sssssssss_____sWBsssssBWs___ssBBsssssBBss__ssss_____ssss__sss_sssss_sss__sss_sBsBs_sss__sss_sssss_sss___sss_____sss____sssssssssss__GGGsssssssssGGGGGGsGsssssGsGGGGGGssGGGGGssGGG_______________\",\n \"svg\": 2,\n \"color\": \"\"\n },\n {\n \"name\": \"Donkey Kong\",\n \"size\": 9,\n \"bricks\": \"OOr__a___OOr__a___ppppppp_O______a________a____pppppppr_a______b_a___O__ppppppp__\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Banana\",\n \"size\": 12,\n \"bricks\": \"_________________e__________eee_________eee_________eee_________eeeyy_____yyeeyyyy___yyyyey_yC___yy_yyy___C_____yyyy_________yyyy_________yyyy\",\n \"svg\": null\n },\n {\n \"name\": \"Fox\",\n \"size\": 8,\n \"bricks\": \"e______eee_OO_eeeeOOOOeeeOBOOBOeOOOOOOOO_WWBBWW___WWWW_____WW___\",\n \"svg\": null\n },\n {\n \"name\": \"Wiki\",\n \"size\": 10,\n \"bricks\": \"_______________________GGGG_____GGkkGG___GkggggkG__GgWWWWgG__GkggggkG___GGkkGG_____GGGG_______________________\",\n \"svg\": null\n },\n {\n \"name\": \"Baby Dog\",\n \"size\": 8,\n \"bricks\": \"_______W__eeeeWWWWeeWeWWWegWegeeeeWWWWee_eWggWe__eWWWWe____WW\",\n \"svg\": null\n },\n {\n \"name\": \"Cute dog\",\n \"size\": 9,\n \"bricks\": \"__________O_____O_OOOWWWOOOOOWWWWWOOOOeWWWWOO_eBeWWBW__eBeWWBW___eWBWW_____WRW____________\",\n \"svg\": null\n },\n {\n \"name\": \"icon:extra_life\",\n \"size\": 9,\n \"bricks\": \"___________rr_rr___rrrrrrr_rrrrrrrrrrrrrrrrrr_rrrrrrr___rrrrr_____rrr_______r_____________\",\n \"svg\": null\n },\n {\n \"name\": \"icon:streak_shots\",\n \"size\": 8,\n \"bricks\": \"_W_W_W__W_W_W_W_tttttt_WttttttW_tttttt_W______W______W_____WWWW\",\n \"svg\": null\n },\n {\n \"name\": \"icon:base_combo\",\n \"size\": 8,\n \"bricks\": \"ttttttttttyyttttttyytyyttttttyyttyyttttttyytyyttttttyytttttttttt________\",\n \"svg\": null\n },\n {\n \"name\": \"icon:slow_down\",\n \"size\": 10,\n \"bricks\": \"_____________kk_______kkkk_____kkkkkkGG__kkkkkkGBG_kkkkkkGGGGkkkkkkGG__GGGGGG____GG__GG_____________\",\n \"svg\": null\n },\n {\n \"name\": \"icon:bigger_puck\",\n \"size\": 8,\n \"bricks\": \"_________tttttt__tttttt______________________W___________WWWWWW_\",\n \"svg\": null\n },\n {\n \"name\": \"icon:viscosity\",\n \"size\": 8,\n \"bricks\": \"________tt______bbtt__ttbbbbttbbbtbbtbbbbbtbbtbbbbbybbybbbbbbbbb\",\n \"svg\": null\n },\n {\n \"name\": \"icon:left_is_lava\",\n \"size\": 8,\n \"bricks\": \"r_______rtttttt_rtttttt_r_______r_______r____W__r_______r_WWW___\",\n \"svg\": null\n },\n {\n \"name\": \"icon:right_is_lava\",\n \"size\": 8,\n \"bricks\": \"_______r_ttttttr_ttttttr_______r_______r_____W_r_______r__WWW__r\",\n \"svg\": null\n },\n {\n \"name\": \"icon:telekinesis\",\n \"size\": 8,\n \"bricks\": \"_____PW_____s______P______s_______P_______s_______P_____WWWWW\",\n \"svg\": null\n },\n {\n \"name\": \"icon:top_is_lava\",\n \"size\": 8,\n \"bricks\": \"rrrrrrrr_tttttt__tttttt____________________W_______________WWW__\",\n \"svg\": null\n },\n {\n \"name\": \"icon:coin_magnet\",\n \"size\": 8,\n \"bricks\": \"__y__y_yy_________y_y_y_y________y_y______________y______WWW____\",\n \"svg\": null\n },\n {\n \"name\": \"icon:skip_last\",\n \"size\": 5,\n \"bricks\": \"_ttt_t_t_ttt_ttt_t_t_ttt_\",\n \"svg\": null\n },\n {\n \"name\": \"icon:multiball\",\n \"size\": 8,\n \"bricks\": \"_________tttttt__tttttt___________W__W____________________WWW___\",\n \"svg\": null\n },\n {\n \"name\": \"icon:smaller_puck\",\n \"size\": 8,\n \"bricks\": \"_________tttttt__tttttt_____________W_____________________WW____\",\n \"svg\": null\n },\n {\n \"name\": \"icon:pierce\",\n \"size\": 6,\n \"bricks\": \"ttttttttttWtttt__ttt__ttt__ttt__tttt\",\n \"svg\": null\n },\n {\n \"name\": \"icon:picky_eater\",\n \"size\": 8,\n \"bricks\": \"rtrtrtrttrtrtrtrrtrtrtrt____________________t_____________WWWW\",\n \"svg\": null\n },\n {\n \"name\": \"icon:metamorphosis\",\n \"size\": 8,\n \"bricks\": \"aaaaaa__aaaa__________W___________ttaatt__tttttt_________WWW\",\n \"svg\": null\n },\n {\n \"name\": \"icon:compound_interest\",\n \"size\": 8,\n \"bricks\": \"_________tttttt__ttt__t______y_____________W__y_________rrWWWrrr\",\n \"svg\": null\n },\n {\n \"name\": \"icon:hot_start\",\n \"size\": 7,\n \"bricks\": \"ttttttttttt_tt_____W_____y_y_____y_____y_y_WWW_y_\",\n \"svg\": null\n },\n {\n \"name\": \"icon:sapper\",\n \"size\": 9,\n \"bricks\": \"_____WW______W__W_tttWttt_yttgggtt__tgggggt__tgggggt__tgggggt__ttgggtt__ttttttt___________\",\n \"svg\": null,\n \"color\": \"#000000\"\n },\n {\n \"name\": \"icon:bigger_explosions\",\n \"size\": 8,\n \"bricks\": \"__r_______ry_rr___ryry__ryyyW_rr_rrWyyy___yryrr__yrry_rr_rr\",\n \"svg\": null\n },\n {\n \"name\": \"icon:extra_levels\",\n \"size\": 6,\n \"bricks\": \"__________b__t_bb_ttt_b__t_bbb____________\",\n \"svg\": null\n },\n {\n \"name\": \"icon:pierce_color\",\n \"size\": 8,\n \"bricks\": \"bb___bbbb__b_bbb_____bbb____bbbbb____bbbbb____bbbbb____bbbbb____\",\n \"svg\": null\n },\n {\n \"name\": \"icon:soft_reset\",\n \"size\": 8,\n \"bricks\": \"___rg_____rrgg___rryggg_rryWggggrryWgggg_ryyggg___rrgg_____rg___\",\n \"svg\": null\n },\n {\n \"name\": \"icon:ball_repulse_ball\",\n \"size\": 8,\n \"bricks\": \"WsP__PsWs______sP______P________________P______Ps______sWsP__PsW\",\n \"svg\": null\n },\n {\n \"name\": \"icon:ball_attract_ball\",\n \"size\": 8,\n \"bricks\": \"__P__P____s__s__PsW__WsP________________PsW__WsP__s__s____P__P__\",\n \"svg\": null\n },\n {\n \"name\": \"icon:puck_repulse_ball\",\n \"size\": 8,\n \"bricks\": \"__________________W_______s___W___P__s______P____________WWW__\",\n \"svg\": null\n },\n {\n \"name\": \"A\",\n \"size\": 7,\n \"bricks\": \"___t_____ttt___t___t__t___t_tttttttt_____tt_____t\",\n \"svg\": null\n },\n {\n \"name\": \"B\",\n \"size\": 9,\n \"bricks\": \"_bbbbb_____bb_bb____bb_bb____bb_bb____bbbb_____bb_bb____bb_bb____bb_bb___bbbbb____\",\n \"svg\": null\n },\n {\n \"name\": \"C\",\n \"size\": 8,\n \"bricks\": \"__rrrr___rrrrrr_rrr___rrrr______rr______rrr___rr_rrrrrr___rrrr\",\n \"svg\": null\n },\n {\n \"name\": \"D\",\n \"size\": 8,\n \"bricks\": \"_GGGGG____GG__G___GG__GG__GG__GG__GG__GG__GG__GG__GG__G__GGGGG\",\n \"svg\": null\n },\n {\n \"name\": \"e\",\n \"size\": 8,\n \"bricks\": \"__tttt___tttttt_tt____tttt____tttttttttttt_______tt__tt___tttt_\",\n \"svg\": null\n },\n {\n \"name\": \"icon:wind\",\n \"size\": 9,\n \"bricks\": \"_ss______s___PPPP_s_________sssssss___________sssssss_s________s___PPPP__ss\",\n \"svg\": null\n },\n {\n \"name\": \"icon:sturdy_bricks\",\n \"size\": 7,\n \"bricks\": \"ttbttttbtttbtt____W_____W_W___W___W_______WWW____\",\n \"svg\": null\n },\n {\n \"name\": \"icon:respawn\",\n \"size\": 9,\n \"bricks\": \"tttt___ttttt__t__ttta_ttt_______________________________W_________________WWW\",\n \"svg\": null\n },\n {\n \"name\": \"Elephant\",\n \"size\": 18,\n \"bricks\": \"_________________________llll_________lll_llllll_lll___lsssllllllllsssl__lsssllllllllsssl__lsssllBllBllsssl__lssllWllllWllssl___ll__llllll__ll_________llll_______________ll______________llll______________ll________________________________________________________________________________________________________________________________________\",\n \"svg\": 25,\n \"color\": \"\"\n },\n {\n \"name\": \"Orca\",\n \"size\": 20,\n \"bricks\": \"____________________________________________________________________________________________BBBBB____BBB_BBB___BBBBBBB____BBBBB___BBBBBBBBB____BBB___BBBBWBBWWW_____BBBBBBBBBBBWWWW_____BBBBBBBBBBWWWWW_____BBBBBBBBBWWWWW_______BBBBBBBWWWWW___________WWBBWWW______________BBB_BB______________BB__B______________________________________________________________________________________________________________________________\",\n \"svg\": null,\n \"color\": \"#1c71d8\"\n },\n {\n \"name\": \"Shark\",\n \"size\": 17,\n \"bricks\": \"__________________________________________g_______________ggg____________ggggggg_________ggggggggg_______ggggggggggg_____gggggWWWggggg____gBgWWWWWWWgBg___ggWWWWrWrWWWWgg__ggWWWrrrrrWWWgg_ggWWWrrrrrrrWWWggggWWrrrrrrrrrWWgggWWWrWrWrWrWrWWWggWWrrWWWWWWWrrWWggWWWWWWWWWWWWWWWg_________________\",\n \"svg\": null,\n \"color\": \"#3584e4\"\n },\n {\n \"name\": \"Bird\",\n \"size\": 13,\n \"bricks\": \"_______RRR____R____RSSSR___RR__RSSWWWR__RSR_RSWWBWR__RSSRRSWWWWyy_RSSSRSWWWR___RSSSSSSRR_____RRSSyyyy______RSyyyyy___RRRRSyyyy____RSSSRyyy_____RRRR______________________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Tux\",\n \"size\": 14,\n \"bricks\": \"_____gggg________gggggggg_____gggggggggg____gggggggggg___gggggggggggg__gggWBggWBggg__gggBBggBBggg__ggggyyyygggg_ggggggyyggggggggggWWWWWWggggg_gWWWWWWWWg_g__WWWWWWWWWW____WWWWWWWWWW____yyy____yyy__\",\n \"svg\": null,\n \"color\": \"#62a0ea\"\n },\n {\n \"name\": \"Armenia\",\n \"size\": 6,\n \"bricks\": \"_______rrrr__bbbb__yyyy_____________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Austria\",\n \"size\": 6,\n \"bricks\": \"_______rrrr__WWWW__rrrr______\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Benin\",\n \"size\": 8,\n \"bricks\": \"_________kkyyyy__kkyyyy__kkrrrr__kkrrrr__________________________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Botswana\",\n \"size\": 10,\n \"bricks\": \"___________tttttttt__tttttttt__tttttttt__WWWWWWWW__BBBBBBBB__WWWWWWWW__tttttttt__tttttttt__tttttttt___________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Bulgaria\",\n \"size\": 6,\n \"bricks\": \"_______WWWW__cccc__rrrr_____________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Canada\",\n \"size\": 7,\n \"bricks\": \"________rWWWr__rWrWr__rWWWr______________________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Chad\",\n \"size\": 8,\n \"bricks\": \"_________bbyyRR__bbyyRR__bbyyRR\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"China\",\n \"size\": 8,\n \"bricks\": \"_________RRyRRR__RyRyRR__RRyRRR__RRRRRR\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Colombia\",\n \"size\": 7,\n \"bricks\": \"________yyyyy__yyyyy__bbbbb__RRRRR_______________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Republic of the Congo\",\n \"size\": 7,\n \"bricks\": \"________kkkyy__kkyyr__kyyrr__yyrrr_______________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Côte d'Ivoire\",\n \"size\": 8,\n \"bricks\": \"_________OOWWGG__OOWWGG__OOWWGG\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Denmark\",\n \"size\": 8,\n \"bricks\": \"_________rrWrrr__rrWrrr__WWWWWW__rrWrrr__rrWrrr\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"El Salvador\",\n \"size\": 8,\n \"bricks\": \"_________bbbbbb__bbbbbb__WWWkWW__WWkWWW__bbbbbb__bbbbbb\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Egypt\",\n \"size\": 8,\n \"bricks\": \"_________RRRRRR__RRRRRR__WWWyWW__WWyWWW__gggggg__gggggg\",\n \"svg\": null,\n \"color\": \"#1c71d8\"\n },\n {\n \"name\": \"Estonia\",\n \"size\": 8,\n \"bricks\": \"_________tttttt__tttttt__gggggg__gggggg__WWWWWW__WWWWWW\",\n \"svg\": null,\n \"color\": \"#986a44\"\n },\n {\n \"name\": \"Finland\",\n \"size\": 6,\n \"bricks\": \"_______WtWW__tttt__WtWW_____________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Gabon\",\n \"size\": 5,\n \"bricks\": \"______CCC__yyy__ttt______\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Georgia\",\n \"size\": 9,\n \"bricks\": \"__________WrWrWrW__WWWrWWW__rrrrrrr__WWWrWWW__WrWrWrW__________________\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Guinea\",\n \"size\": 8,\n \"bricks\": \"_________rryycc__rryycc__rryycc\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"Indonesia\",\n \"size\": 6,\n \"bricks\": \"_______rrrr__rrrr__WWWW__WWWW_______\",\n \"svg\": null,\n \"color\": \"\"\n },\n {\n \"name\": \"icon:one_more_choice\",\n \"size\": 7,\n \"bricks\": \"ttt____tbbb___tbttt__tbtbbb__btbbb___tbbb____bbb_\",\n \"svg\": null\n },\n {\n \"name\": \"icon:instant_upgrade\",\n \"size\": 5,\n \"bricks\": \"ttt__tbbb_tbbb_tbbb__bbb_\",\n \"svg\": null\n },\n {\n \"name\": \"icon:checkmark_checked\",\n \"size\": 6,\n \"bricks\": \"_WWWWGWBBBGGGGBGGWWGGGBWWBGBBW_WWWW_\",\n \"svg\": null\n },\n {\n \"name\": \"icon:checkmark_unchecked\",\n \"size\": 6,\n \"bricks\": \"_WWWW_WBBBBWWBBBBWWBBBBWWBBBBW_WWWW_\",\n \"svg\": null\n },\n {\n \"name\": \"icon:fullscreen\",\n \"size\": 6,\n \"bricks\": \"WW__WWW____W____________W____WWW__WW\",\n \"svg\": null\n },\n {\n \"name\": \"icon:exit_fullscreen\",\n \"size\": 6,\n \"bricks\": \"_W__W_WW__WW____________WW__WW_W__W_\",\n \"svg\": null\n }\n]","exports.interopDefault = function (a) {\n return a && a.__esModule ? a : {default: a};\n};\n\nexports.defineInteropFlag = function (a) {\n Object.defineProperty(a, '__esModule', {value: true});\n};\n\nexports.exportAll = function (source, dest) {\n Object.keys(source).forEach(function (key) {\n if (\n key === 'default' ||\n key === '__esModule' ||\n Object.prototype.hasOwnProperty.call(dest, key)\n ) {\n return;\n }\n\n Object.defineProperty(dest, key, {\n enumerable: true,\n get: function () {\n return source[key];\n },\n });\n });\n\n return dest;\n};\n\nexports.export = function (dest, destName, get) {\n Object.defineProperty(dest, destName, {\n enumerable: true,\n get: get,\n });\n};\n","import {RawLevel} from \"./types\";\n\nimport _backgrounds from \"./backgrounds.json\";\nconst backgrounds = _backgrounds as string[];\n\nexport function getLevelBackground(level:RawLevel){\n\n let svg = level.svg !== null && backgrounds[level.svg % backgrounds.length];\n\n if (!level.color && !svg) {\n svg = backgrounds[hashCode(level.name) % backgrounds.length];\n }\n return svg\n}\n\n\nexport function hashCode(string: string) {\n let hash = 0;\n for (let i = 0; i < string.length; i++) {\n let code = string.charCodeAt(i);\n hash = (hash << 5) - hash + code;\n hash = hash & hash; // Convert to 32bit integer\n }\n return Math.abs(hash);\n}\n","[\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\",\n \"\"\n]\n"],"names":[],"version":3,"file":"index.c0fd3053.js.map","sourceRoot":"/__parcel_source_root/"} \ No newline at end of file diff --git a/dist/index.html b/dist/index.html index 17b271e..338ca17 100644 --- a/dist/index.html +++ b/dist/index.html @@ -49,7 +49,7 @@ body { top: 0; } -#score:hover, #score:focus, #menu:hover, #menu:focus { +#score:hover, #menu:hover, #score:focus, #menu:focus { cursor: pointer; background: #0000004d; } @@ -88,15 +88,6 @@ body { display: flex; } -.popup.actionsAsGrid > div { - max-width: 800px; - - & section { - grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); - display: grid; - } -} - .popup > div > * { margin: 0; padding: 0; @@ -111,50 +102,57 @@ body { align-items: stretch; margin-top: 20px; display: flex; +} - & button { - font: inherit; - color: #fff; - cursor: pointer; - text-align: left; - background: #000c; - border: 1px solid #fff; - gap: 10px; - margin-top: -1px; - padding: 10px; - display: flex; +.popup > div > section button { + font: inherit; + color: #fff; + cursor: pointer; + text-align: left; + background: #000c; + border: 1px solid #fff; + gap: 10px; + margin-top: -1px; + padding: 10px; + display: flex; +} - &:not([disabled]):hover, &:not([disabled]):focus { - z-index: 1; - border-color: #f1d33b; - position: relative; - } +.popup > div > section button:not([disabled]):hover, .popup > div > section button:not([disabled]):focus { + z-index: 1; + border-color: #f1d33b; + position: relative; +} - &[disabled] { - opacity: .5; - filter: saturate(0); - pointer-events: none; - } +.popup > div > section button[disabled] { + opacity: .5; + filter: saturate(0); + pointer-events: none; +} - & > div { - flex-grow: 1; - } +.popup > div > section button > div { + flex-grow: 1; +} - & > div > em { - opacity: .8; - display: block; - } +.popup > div > section button > div > em { + opacity: .8; + display: block; +} - &.grey-out-unless-hovered { - &:not(:hover) { - opacity: .6; +.popup > div > section button.grey-out-unless-hovered:not(:hover) { + opacity: .6; +} - & img { - filter: saturate(0); - } - } - } - } +.popup > div > section button.grey-out-unless-hovered:not(:hover) img { + filter: saturate(0); +} + +.popup.actionsAsGrid > div { + max-width: 800px; +} + +.popup.actionsAsGrid > div section { + grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); + display: grid; } .popup button.close-modale { @@ -168,21 +166,21 @@ body { top: 0; right: 0; overflow: hidden; +} - &:before { - content: "+"; - font-size: 80px; - display: inline-block; - position: absolute; - top: 34px; - left: 26px; - transform: translate(-50%, -50%)rotate(45deg); - } +.popup button.close-modale:before { + content: "+"; + font-size: 80px; + display: inline-block; + position: absolute; + top: 34px; + left: 26px; + transform: translate(-50%, -50%)rotate(45deg); +} - &:hover { - background: #000; - font-weight: bold; - } +.popup button.close-modale:hover { + background: #000; + font-weight: bold; } .popup .textAfterButtons { @@ -238,7 +236,7 @@ body { margin: 40px; } -#level-recording-container img, #level-recording-container video { +#level-recording-container video { max-width: 100%; height: auto; } diff --git a/src/game.less b/src/game.less new file mode 100644 index 0000000..aa16c97 --- /dev/null +++ b/src/game.less @@ -0,0 +1,329 @@ +* { + font-family: Courier New, + Courier, + Lucida Sans Typewriter, + Lucida Typewriter, + monospace; + box-sizing: border-box; +} + +body { + margin: 0; + padding: 0; + overflow: hidden; + width: 100vw; + height: 100vh; + height: calc(var(--vh, 1vh) * 100); + color: white; + background-size: 120px 120px; + background-color: var(--background1); + --background1: #030c23; + --background2: #03112a; +} + +#game { + position: absolute; + top: 0; + left: 0; + height: 100vh; + height: calc(var(--vh, 1vh) * 100); + width: 100vw; +} + +#score, +#menu { + position: absolute; + top: 0; + z-index: 1; + padding: 10px; + appearance: none; + background: none; + border: none; + font: inherit; + color: white; + min-width: 40px; + min-height: 40px; + line-height: 20px; + + &:hover, + &:focus { + background: rgba(0, 0, 0, 0.3); + cursor: pointer; + } + +} + +#score { + right: 0; +} + +#menu { + left: 0; + @media screen and (orientation: portrait) { + & > span { + display: none; + } + } +} + + +.popup { + position: fixed; + inset: 0; + background: rgba(0, 0, 0, 0.9); + z-index: 10; + display: flex; + overflow: auto; + + & > div { + margin: auto; + padding: 20px 10px; + transform-origin: center; + display: flex; + flex-direction: column; + align-items: stretch; + width: 100%; + max-width: 450px; + + & > * { + padding: 0; + margin: 0; + } + + & > h2, + & > p { + margin-bottom: 20px; + } + + & > section { + display: flex; + flex-direction: column; + align-items: stretch; + margin-top: 20px; + + button { + font: inherit; + background: rgba(0, 0, 0, 0.8); + color: white; + padding: 10px; + cursor: pointer; + border: 1px solid white; + text-align: left; + display: flex; + gap: 10px; + margin-top: -1px; + + &:not([disabled]):hover, + &:not([disabled]):focus { + border-color: #f1d33b; + position: relative; + z-index: 1; + } + + &[disabled] { + opacity: 0.5; + filter: saturate(0); + pointer-events: none; + } + + & > div { + flex-grow: 1; + } + + & > div > em { + display: block; + opacity: 0.8; + } + + &.grey-out-unless-hovered { + &:not(:hover) { + opacity: 0.6; + + img { + filter: saturate(0); + } + } + } + } + } + } + + &.actionsAsGrid > div { + max-width: 800px; + + section { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); + } + } + + button.close-modale { + color: white; + position: absolute; + top: 0; + right: 0; + width: 60px; + height: 60px; + background: transparent; + border: none; + cursor: pointer; + overflow: hidden; + + &:before { + content: "+"; + position: absolute; + transform: translate(-50%, -50%) rotate(45deg); + font-size: 80px; + display: inline-block; + top: 34px; + left: 26px; + } + + &:hover { + font-weight: bold; + background: black; + } + } + + .textAfterButtons { + color: rgba(255, 255, 255, 0.58); + } + + a[href] { + color: inherit; + + &:hover, + &:focus { + color: white; + } + } +} + + +/*Unlocks progress bar*/ +.progress { + display: block; + padding: 5px 10px; + background: #1c1c2f; + color: #fff; + box-shadow: inset 3px 3px 5px rgba(0, 0, 0, 0.5); + border-radius: 5px; + text-align: center; + position: relative; + overflow: hidden; + + & > .progress_bar_part { + display: block; + background: #4049ca; + box-shadow: inset 3px 3px 5px rgba(0, 0, 0, 0.5); + left: 0; + position: absolute; + right: 0; + top: 0; + bottom: 0; + transform-origin: top left; + animation: grow 1s both ease-out; + z-index: 1; + } + + & > span { + display: block; + position: relative; + z-index: 2; + } + + @keyframes grow { + 0% { + transform: scale(0, 1); + } + } +} + + +#level-recording-container { + max-width: 400px; + text-align: center; + margin: 40px; + + video { + max-width: 100%; + height: auto; + } + + a { + display: block; + + video { + border-radius: 10px; + display: block; + outline: 1px solid white; + box-shadow: 2px 2px 5px black; + margin: 20px auto; + } + } + + @media (min-width: 1200px) { + position: absolute; + top: 40px; + left: 40px; + max-width: calc((100vw - 450px) / 2 - 80px); + } +} + + +.histogram { + display: flex; + gap: 10px; + align-items: stretch; + margin: 10px 0 40px 0; + + & > span { + /* Hover zone */ + flex-grow: 1; + width: 10px; + position: relative; + display: flex; + flex-direction: column; + justify-content: flex-end; + + &.active > span { + background: #4049ca; + } + + & > span { + /*Visible bar*/ + background: #1c1c2f; + width: 100%; + display: block; + border-radius: 5px; + min-height: 1px; + + & > span { + /*label */ + position: absolute; + bottom: -20px; + pointer-events: none; + white-space: nowrap; + transform-origin: bottom left; + font-size: 13px; + text-align: center; + display: block; + left: 50%; + transform: translate(-50%, 0); + } + + } + } + &> span:not(:hover):not(.active) > span > span { + opacity: 0; + } +} + +h2.histogram-title { + color: #3b3f75; + font-size: 18px; +} + +h2.histogram-title strong { + color: #4049ca; +} diff --git a/src/game_utils.test.ts b/src/game_utils.test.ts index e8f7509..d9d2fb8 100644 --- a/src/game_utils.test.ts +++ b/src/game_utils.test.ts @@ -1,4 +1,5 @@ -import {getMajorityValue, sample, sumOfKeys} from "./game_utils"; +import {getMajorityValue, makeEmptyPerksMap, sample, sumOfKeys} from "./game_utils"; +import {Upgrade} from "./types"; describe('getMajorityValue', ()=>{ @@ -39,4 +40,10 @@ describe('sumOfKeys', ()=>{ it('returns 0 for null',()=>{ expect(sumOfKeys(null)).toEqual(0) }) +}) +describe('makeEmptyPerksMap', ()=>{ + it('returns an object',()=>{ + expect(makeEmptyPerksMap([{id:"ball_attract_ball"}])).toEqual({ball_attract_ball:0}) + expect(makeEmptyPerksMap([])).toEqual({}) + }) }) \ No newline at end of file diff --git a/src/game_utils.ts b/src/game_utils.ts index 3c6d147..3603a65 100644 --- a/src/game_utils.ts +++ b/src/game_utils.ts @@ -1,5 +1,5 @@ -import {PerksMap, Upgrade} from "./types"; +import {PerkId, PerksMap, Upgrade} from "./types"; export function getMajorityValue(arr: string[]): string { const count: { [k: string]: number } = {}; @@ -19,7 +19,7 @@ export function sumOfKeys(obj:{[key:string]:number} | undefined | null){ return Object.values(obj)?.reduce((a,b)=>a+b,0) ||0 } -export const makeEmptyPerksMap = (upgrades:Upgrade[]) => { +export const makeEmptyPerksMap = (upgrades: { id:PerkId }[]) => { const p = {} as any; upgrades.forEach((u) => (p[u.id] = 0)); return p as PerksMap; diff --git a/src/getLevelBackground.ts b/src/getLevelBackground.ts index 05cfd4d..a37941d 100644 --- a/src/getLevelBackground.ts +++ b/src/getLevelBackground.ts @@ -1,15 +1,5 @@ import {RawLevel} from "./types"; -export function hashCode(string: string) { - let hash = 0; - for (let i = 0; i < string.length; i++) { - let code = string.charCodeAt(i); - hash = (hash << 5) - hash + code; - hash = hash & hash; // Convert to 32bit integer - } - return Math.abs(hash); -} - import _backgrounds from "./backgrounds.json"; const backgrounds = _backgrounds as string[]; @@ -21,4 +11,15 @@ export function getLevelBackground(level:RawLevel){ svg = backgrounds[hashCode(level.name) % backgrounds.length]; } return svg -} \ No newline at end of file +} + + +export function hashCode(string: string) { + let hash = 0; + for (let i = 0; i < string.length; i++) { + let code = string.charCodeAt(i); + hash = (hash << 5) - hash + code; + hash = hash & hash; // Convert to 32bit integer + } + return Math.abs(hash); +} diff --git a/src/index.html b/src/index.html index 9417e26..20da3a9 100644 --- a/src/index.html +++ b/src/index.html @@ -13,7 +13,7 @@ content="A breakout game with roguelite mechanics. Break bricks, catch coins, pick upgrades, repeat. Play for free on mobile and desktop." /> span { - display: none; - } -} - -.popup { - position: fixed; - inset: 0; - background: rgba(0, 0, 0, 0.9); - z-index: 10; - display: flex; - overflow: auto; -} - -.popup > div { - margin: auto; - padding: 20px 10px; - /*border: 1px solid white;*/ - transform-origin: center; - display: flex; - flex-direction: column; - align-items: stretch; - width: 100%; - max-width: 450px; -} - -.popup.actionsAsGrid > div { - max-width: 800px; - - section { - display: grid; - grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); - } -} - -.popup > div > * { - padding: 0; - margin: 0; -} - -.popup > div > h2, -.popup > div > p { - margin-bottom: 20px; -} - -.popup > div > section { - display: flex; - flex-direction: column; - align-items: stretch; - margin-top: 20px; - - button { - font: inherit; - background: rgba(0, 0, 0, 0.8); - color: white; - padding: 10px; - cursor: pointer; - border: 1px solid white; - text-align: left; - display: flex; - gap: 10px; - margin-top: -1px; - - &:not([disabled]):hover, - &:not([disabled]):focus { - border-color: #f1d33b; - position: relative; - z-index: 1; - } - - &[disabled] { - /*border: 1px solid #666;*/ - opacity: 0.5; - filter: saturate(0); - pointer-events: none; - } - - & > div { - flex-grow: 1; - } - - & > div > em { - display: block; - opacity: 0.8; - } - - &.grey-out-unless-hovered { - &:not(:hover) { - opacity: 0.6; - img { - filter: saturate(0); - } - } - } - } -} - -.popup button.close-modale { - color: white; - position: absolute; - top: 0; - right: 0; - width: 60px; - height: 60px; - background: transparent; - border: none; - cursor: pointer; - overflow: hidden; - - &:before { - content: "+"; - position: absolute; - transform: translate(-50%, -50%) rotate(45deg); - font-size: 80px; - display: inline-block; - top: 34px; - left: 26px; - } - - &:hover { - font-weight: bold; - background: black; - } -} - -.popup .textAfterButtons { - color: rgba(255, 255, 255, 0.58); -} - -.popup a[href] { - color: inherit; -} - -.popup a[href]:hover, -.popup a[href]:focus { - color: white; -} - -/*Unlocks progress bar*/ -.progress { - display: block; - padding: 5px 10px; - background: #1c1c2f; - color: #fff; - box-shadow: inset 3px 3px 5px rgba(0, 0, 0, 0.5); - border-radius: 5px; - text-align: center; - position: relative; - overflow: hidden; -} - -.progress > .progress_bar_part { - display: block; - background: #4049ca; - box-shadow: inset 3px 3px 5px rgba(0, 0, 0, 0.5); - left: 0; - position: absolute; - right: 0; - top: 0; - bottom: 0; - transform-origin: top left; - animation: grow 1s both ease-out; - z-index: 1; -} - -.progress > span { - display: block; - position: relative; - z-index: 2; -} - -@keyframes grow { - 0% { - transform: scale(0, 1); - } -} - -#level-recording-container { - max-width: 400px; - text-align: center; - margin: 40px; -} - -#level-recording-container img, -#level-recording-container video { - max-width: 100%; - height: auto; -} - -#level-recording-container a { - display: block; -} - -#level-recording-container a video { - border-radius: 10px; - display: block; - outline: 1px solid white; - box-shadow: 2px 2px 5px black; - margin: 20px auto; -} - -@media (min-width: 1200px) { - #level-recording-container { - position: absolute; - top: 40px; - left: 40px; - max-width: calc((100vw - 450px) / 2 - 80px); - } -} - -.histogram { - display: flex; - gap: 10px; - align-items: stretch; - margin: 10px 0 40px 0; -} - -.histogram > span { - /* Hover zone */ - flex-grow: 1; - width: 10px; - position: relative; - display: flex; - flex-direction: column; - justify-content: flex-end; -} - -.histogram > span.active > span { - background: #4049ca; -} - -.histogram > span > span { - /*Visible bar*/ - background: #1c1c2f; - width: 100%; - display: block; - border-radius: 5px; - min-height: 1px; -} - -.histogram > span > span > span { - /*label */ - position: absolute; - bottom: -20px; - pointer-events: none; - white-space: nowrap; - transform-origin: bottom left; - font-size: 13px; - text-align: center; - display: block; - left: 50%; - transform: translate(-50%, 0); -} - -.histogram > span:not(:hover):not(.active) > span > span { - opacity: 0; -} - -h2.histogram-title { - color: #3b3f75; - font-size: 18px; -} - -h2.histogram-title strong { - color: #4049ca; -}