├── CNAME ├── robots.txt ├── nopixel_minigame ├── paypal.png ├── favicon.ico ├── 4.0 │ ├── favicon.ico │ ├── laundromat │ │ ├── favicon.ico │ │ ├── minigame.css │ │ └── index.html │ ├── roof_running │ │ ├── favicon.ico │ │ ├── index.html │ │ ├── minigame.css │ │ └── minigame.js │ └── index.html ├── fleeca │ ├── favicon.ico │ ├── audio_splash.ogg │ ├── audio_timer.ogg │ └── index.html ├── vault │ ├── favicon.ico │ ├── audio_splash.ogg │ ├── audio_timer.ogg │ └── index.html ├── yacht │ ├── favicon.ico │ ├── minigame.css │ └── minigame.js ├── thermite │ ├── favicon.ico │ ├── minigame.css │ ├── index.html │ └── minigame.js ├── untangle │ ├── favicon.ico │ ├── minigame.css │ └── index.html ├── lockpicks │ ├── favicon.ico │ ├── minigame.css │ ├── index.html │ └── minigame.js ├── lowervault │ ├── favicon.ico │ ├── audio_splash.ogg │ ├── audio_timer.ogg │ └── index.html ├── vaultcodes │ ├── favicon.ico │ ├── minigame.css │ ├── index.html │ └── minigame.js ├── hackingdevice │ ├── favicon.ico │ ├── minigame.css │ └── index.html ├── casino_computer │ ├── favicon.ico │ ├── minigame.css │ ├── index.html │ └── minigame.js ├── var_simulation │ ├── favicon.ico │ ├── minigame.css │ ├── minigame.js │ └── index.html ├── casino_generators │ ├── favicon.ico │ ├── minigame.css │ ├── index.html │ └── minigame.js ├── powerplant_generators │ ├── favicon.ico │ ├── minigame.css │ ├── index.html │ └── minigame.js └── index.html ├── README.md ├── index.html └── sitemap.xml /CNAME: -------------------------------------------------------------------------------- 1 | sharkiller.ddns.net -------------------------------------------------------------------------------- /robots.txt: -------------------------------------------------------------------------------- 1 | User-agent: * 2 | Allow: / 3 | 4 | Sitemap: https://sharkiller.ddns.net/sitemap.xml -------------------------------------------------------------------------------- /nopixel_minigame/paypal.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sharkiller/nopixel_minigame/HEAD/nopixel_minigame/paypal.png -------------------------------------------------------------------------------- /nopixel_minigame/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sharkiller/nopixel_minigame/HEAD/nopixel_minigame/favicon.ico -------------------------------------------------------------------------------- /nopixel_minigame/4.0/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sharkiller/nopixel_minigame/HEAD/nopixel_minigame/4.0/favicon.ico -------------------------------------------------------------------------------- /nopixel_minigame/fleeca/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sharkiller/nopixel_minigame/HEAD/nopixel_minigame/fleeca/favicon.ico -------------------------------------------------------------------------------- /nopixel_minigame/vault/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sharkiller/nopixel_minigame/HEAD/nopixel_minigame/vault/favicon.ico -------------------------------------------------------------------------------- /nopixel_minigame/yacht/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sharkiller/nopixel_minigame/HEAD/nopixel_minigame/yacht/favicon.ico -------------------------------------------------------------------------------- /nopixel_minigame/thermite/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sharkiller/nopixel_minigame/HEAD/nopixel_minigame/thermite/favicon.ico -------------------------------------------------------------------------------- /nopixel_minigame/untangle/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sharkiller/nopixel_minigame/HEAD/nopixel_minigame/untangle/favicon.ico -------------------------------------------------------------------------------- /nopixel_minigame/fleeca/audio_splash.ogg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sharkiller/nopixel_minigame/HEAD/nopixel_minigame/fleeca/audio_splash.ogg -------------------------------------------------------------------------------- /nopixel_minigame/fleeca/audio_timer.ogg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sharkiller/nopixel_minigame/HEAD/nopixel_minigame/fleeca/audio_timer.ogg -------------------------------------------------------------------------------- /nopixel_minigame/lockpicks/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sharkiller/nopixel_minigame/HEAD/nopixel_minigame/lockpicks/favicon.ico -------------------------------------------------------------------------------- /nopixel_minigame/lowervault/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sharkiller/nopixel_minigame/HEAD/nopixel_minigame/lowervault/favicon.ico -------------------------------------------------------------------------------- /nopixel_minigame/vault/audio_splash.ogg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sharkiller/nopixel_minigame/HEAD/nopixel_minigame/vault/audio_splash.ogg -------------------------------------------------------------------------------- /nopixel_minigame/vault/audio_timer.ogg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sharkiller/nopixel_minigame/HEAD/nopixel_minigame/vault/audio_timer.ogg -------------------------------------------------------------------------------- /nopixel_minigame/vaultcodes/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sharkiller/nopixel_minigame/HEAD/nopixel_minigame/vaultcodes/favicon.ico -------------------------------------------------------------------------------- /nopixel_minigame/hackingdevice/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sharkiller/nopixel_minigame/HEAD/nopixel_minigame/hackingdevice/favicon.ico -------------------------------------------------------------------------------- /nopixel_minigame/4.0/laundromat/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sharkiller/nopixel_minigame/HEAD/nopixel_minigame/4.0/laundromat/favicon.ico -------------------------------------------------------------------------------- /nopixel_minigame/4.0/roof_running/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sharkiller/nopixel_minigame/HEAD/nopixel_minigame/4.0/roof_running/favicon.ico -------------------------------------------------------------------------------- /nopixel_minigame/casino_computer/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sharkiller/nopixel_minigame/HEAD/nopixel_minigame/casino_computer/favicon.ico -------------------------------------------------------------------------------- /nopixel_minigame/lowervault/audio_splash.ogg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sharkiller/nopixel_minigame/HEAD/nopixel_minigame/lowervault/audio_splash.ogg -------------------------------------------------------------------------------- /nopixel_minigame/lowervault/audio_timer.ogg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sharkiller/nopixel_minigame/HEAD/nopixel_minigame/lowervault/audio_timer.ogg -------------------------------------------------------------------------------- /nopixel_minigame/var_simulation/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sharkiller/nopixel_minigame/HEAD/nopixel_minigame/var_simulation/favicon.ico -------------------------------------------------------------------------------- /nopixel_minigame/casino_generators/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sharkiller/nopixel_minigame/HEAD/nopixel_minigame/casino_generators/favicon.ico -------------------------------------------------------------------------------- /nopixel_minigame/powerplant_generators/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sharkiller/nopixel_minigame/HEAD/nopixel_minigame/powerplant_generators/favicon.ico -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | NoPixel Minigames © 2021 by Sharkiller is licensed under Attribution-NonCommercial-NoDerivatives 4.0 International. 2 | To view a copy of this license, visit http://creativecommons.org/licenses/by-nc-nd/4.0/ 3 | -------------------------------------------------------------------------------- /nopixel_minigame/lockpicks/minigame.css: -------------------------------------------------------------------------------- 1 | body{ 2 | background-color: #15181d; 3 | } 4 | 5 | #canvas { 6 | display: block; 7 | margin: 50px auto; 8 | width: 200px; 9 | } 10 | 11 | .stats{ 12 | width: -moz-fit-content; 13 | width: fit-content; 14 | margin: -20px auto auto; 15 | background-color: green; 16 | padding: 10px 20px; 17 | border-radius: 18px; 18 | } 19 | .stats.wrong{ 20 | background-color: red; 21 | } 22 | .stats .text{ 23 | text-align: center; 24 | font-size: 15px; 25 | font-family: sans-serif; 26 | font-weight: bold; 27 | text-transform: uppercase; 28 | color: white; 29 | border-radius: 18px; 30 | } 31 | .stats .value{ 32 | text-align: center; 33 | font-size: 40px; 34 | font-family: sans-serif; 35 | font-weight: bold; 36 | color: white; 37 | } 38 | 39 | .credits{ 40 | font-family: sans-serif; 41 | text-align: center; 42 | color: gray; 43 | margin: 20px auto; 44 | width: 100%; 45 | font-size: 12px; 46 | } 47 | .credits b{ 48 | color: white; 49 | } 50 | .credits a{ 51 | color: #ccc; 52 | } 53 | .credits .donate{ 54 | margin: 20px 0; 55 | } 56 | .credits .coin{ 57 | font-weight: bold; 58 | color: white; 59 | } 60 | .credits .wallet{ 61 | font-family: monospace; 62 | font-size: 20px; 63 | } -------------------------------------------------------------------------------- /nopixel_minigame/4.0/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | NoPixel 4.0 Minigames 6 | 7 | 8 | 9 | 10 | 33 | 34 | 40 | 41 | 42 |
43 | Laundromat Minigame
44 | Roof Running Minigame

45 | NoPixel 3.0 Minigames

46 | Whisper me on Twitch @Sh4rkill3r or Discord sharkiller
47 | 56 |

NoPixel Minigames by Sharkiller is licensed under CC BY-NC-ND 4.0

57 |
58 | 59 | -------------------------------------------------------------------------------- /nopixel_minigame/thermite/minigame.css: -------------------------------------------------------------------------------- 1 | body{ 2 | background-color: #15181d; 3 | font-family: sans-serif; 4 | } 5 | 6 | .title{ 7 | text-align: center; 8 | color: white; 9 | } 10 | .description{ 11 | text-align: center; 12 | color: gray; 13 | } 14 | 15 | /** 16 | MINIGAME SQUARES 17 | */ 18 | 19 | .streaks { 20 | display: block; 21 | margin: 40px auto; 22 | text-align: center; 23 | font-size: 30px; 24 | font-weight: bold; 25 | text-transform: uppercase; 26 | color: white; 27 | width: -moz-fit-content; 28 | width: fit-content; 29 | background-color: #028000; 30 | padding: 12px; 31 | border-radius: 18px; 32 | } 33 | .best_time, 34 | .time { 35 | display: inline-block; 36 | width: 100px; 37 | } 38 | .streaks .fa { 39 | padding: 0 10px; 40 | } 41 | .options{ 42 | font-weight: bold; 43 | text-align: center; 44 | margin: 0 auto 10px; 45 | } 46 | .option{ 47 | display: inline-block; 48 | color: white; 49 | font-weight: bold; 50 | text-align: center; 51 | width: -moz-fit-content; 52 | width: fit-content; 53 | height: 20px; 54 | background-color: #20282e; 55 | padding: 10px 20px; 56 | margin: 0 auto 10px; 57 | border-radius: 6px; 58 | } 59 | .option.grid input, 60 | .option.speed input{ 61 | vertical-align: text-top; 62 | } 63 | .speed_value{ 64 | display: inline-block; 65 | width: 18px; 66 | text-align: right; 67 | } 68 | .grid_value{ 69 | display: inline-block; 70 | width: 40px; 71 | text-align: center; 72 | } 73 | .minigame{ 74 | margin: 0 auto 20px; 75 | width: 540px; 76 | min-width: 540px; 77 | max-width: 540px; 78 | height: 540px; 79 | min-height: 540px; 80 | max-height: 540px; 81 | background-color: #232832; 82 | } 83 | .splash{ 84 | display: inline-block; 85 | width: 100%; 86 | margin: 220px auto; 87 | text-align: center; 88 | color: white; 89 | font-size: 16px; 90 | } 91 | .splash .hacker{ 92 | font-size: 65px; 93 | margin-bottom: 30px; 94 | } 95 | .groups{ 96 | display: flex; 97 | flex-wrap: wrap; 98 | justify-content: space-evenly; 99 | user-select: none; 100 | } 101 | .group{ 102 | width: 74px; 103 | height: 74px; 104 | border: 8px #232832 solid; 105 | background-color: #34475C; 106 | } 107 | .jewelry .group{ 108 | width: 92px; 109 | height: 92px; 110 | } 111 | .proper{ 112 | background-color: #006600; 113 | } 114 | .good{ 115 | background-color: #CCCCCC; 116 | } 117 | .bad{ 118 | background-color: #F00F18; 119 | } 120 | .hidden { 121 | display: none; 122 | } 123 | .restart{ 124 | text-align: center; 125 | } 126 | .btn_again { 127 | padding: 6px 15px; 128 | font-weight: bold; 129 | } 130 | .credits{ 131 | text-align: center; 132 | color: gray; 133 | margin-top: 40px; 134 | } 135 | .credits a{ 136 | color: #ccc; 137 | } 138 | .credits b{ 139 | color: white; 140 | } 141 | .credits .fas{ 142 | color: red; 143 | } 144 | .credits .donate{ 145 | margin: 20px 0; 146 | } 147 | .credits .coin{ 148 | font-weight: bold; 149 | color: white; 150 | } 151 | .credits .wallet{ 152 | font-family: monospace; 153 | font-size: 20px; 154 | } 155 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | NoPixel Minigames 6 | 7 | 8 | 9 | 10 | 40 | 41 | 47 | 48 | 49 |
50 |

Play NoPixel Minigames



51 | Whisper me on Twitch @Sh4rkill3r or Discord sharkiller
52 | 61 |

NoPixel Minigames by Sharkiller is licensed under CC BY-NC-ND 4.0

62 |
63 | 64 | -------------------------------------------------------------------------------- /nopixel_minigame/yacht/minigame.css: -------------------------------------------------------------------------------- 1 | body{ 2 | background-color: #15181d; 3 | } 4 | .minigame{ 5 | margin: 0 auto 20px; 6 | width: 800px; 7 | min-width: 800px; 8 | max-width: 800px; 9 | padding: 30px; 10 | background-color: #20282e; 11 | } 12 | .groups{ 13 | display: flex; 14 | flex-wrap: wrap; 15 | justify-content: space-evenly; 16 | } 17 | .group{ 18 | display: flex; 19 | flex-wrap: wrap; 20 | justify-content: space-evenly; 21 | background-color: black; 22 | width: 130px; 23 | height: 130px; 24 | margin: 20px 20px; 25 | padding: 15px; 26 | font-size: 25px; 27 | } 28 | .group input{ 29 | width: 20px; 30 | font-size: 25px; 31 | text-align: center; 32 | background-color: black; 33 | border: 1px solid #333; 34 | color: white; 35 | } 36 | .envelope{ 37 | background-color: black; 38 | display: inline-block; 39 | width: 160px; 40 | height: 40px; 41 | padding: 5px 5px 5px 20px; 42 | margin: 10px 5px; 43 | } 44 | .envelope-placeholder{ 45 | display: inline-block; 46 | width: 158px; 47 | height: 38px; 48 | padding: 5px 5px 5px 20px; 49 | margin: 5px 5px -31px; 50 | border: 1px solid black; 51 | } 52 | .envelope select, 53 | .group select{ 54 | height: 32px; 55 | font-size: 22px; 56 | background-color: black; 57 | color: white; 58 | vertical-align: top; 59 | padding-bottom: 2px; 60 | } 61 | .envelope select{ 62 | height: 40px; 63 | font-size: 32px; 64 | } 65 | .envelope select[disabled] { 66 | text-align-last: center; 67 | min-width: 30px; 68 | opacity: 1; 69 | appearance: none; 70 | } 71 | .envelope > select:nth-of-type(1n+2){ 72 | width: 45px; 73 | } 74 | .envelope option, 75 | .group option{ 76 | padding: 2px 0 1px; 77 | } 78 | .group .fa{ 79 | font-family: "Font Awesome 5 Free", sans-serif; 80 | } 81 | .group span{ 82 | color: white; 83 | } 84 | .group > div{ 85 | padding-top: 2px; 86 | } 87 | .group .fixed{ 88 | display: inline-block; 89 | font-family: sans-serif; 90 | color: white; 91 | width: 26px; 92 | height: 33px; 93 | text-align: center; 94 | } 95 | .group .position{ 96 | color: lightgreen; 97 | text-align: center; 98 | font-family: sans-serif; 99 | margin-bottom: -30px; 100 | padding: 0; 101 | } 102 | 103 | .step, 104 | .solution{ 105 | text-align: center; 106 | font-size: 20px; 107 | font-family: sans-serif; 108 | font-weight: bold; 109 | text-transform: uppercase; 110 | color: white; 111 | } 112 | .step{ 113 | font-size: 25px; 114 | } 115 | .step span{ 116 | color: lightgreen; 117 | } 118 | .step:nth-of-type(1n+2){ 119 | margin-top: 30px; 120 | } 121 | .minigames_order, 122 | .solution_order{ 123 | font-size: 40px; 124 | padding: 20px 0; 125 | } 126 | .minigames_verbose{ 127 | font-size: 30px; 128 | margin: 0 auto; 129 | width: 650px; 130 | text-align: left; 131 | text-transform: none; 132 | line-height: 40px; 133 | } 134 | .minigames_verbose .fa{ 135 | display: inline-block; 136 | width: 32px; 137 | text-align: center; 138 | } 139 | .buttons{ 140 | margin: 20px 0; 141 | text-align: center; 142 | } 143 | .buttons button{ 144 | font-size: 30px; 145 | text-transform: uppercase; 146 | } 147 | .credits{ 148 | font-family: sans-serif; 149 | text-align: center; 150 | color: gray; 151 | } 152 | .credits a{ 153 | color: #ccc; 154 | } 155 | .credits b{ 156 | color: white; 157 | } 158 | .credits .donate{ 159 | margin: 20px 0; 160 | } 161 | .credits .coin{ 162 | font-weight: bold; 163 | color: white; 164 | } 165 | .credits .wallet{ 166 | font-family: monospace; 167 | font-size: 20px; 168 | } 169 | 170 | .hidden { 171 | display: none!important; 172 | } -------------------------------------------------------------------------------- /nopixel_minigame/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | NoPixel 3.0 Minigames 6 | 7 | 8 | 9 | 10 | 33 | 34 | 40 | 41 | 42 |
43 | NoPixel 4.0 Minigames

44 | Lockpicks Minigame
45 | Hacking Device Minigame
46 | Fleeca Minigame
47 | Thermite Minigame
48 | Vault Minigame
49 | Lower Vault Minigame
50 | Vault Codes Minigame
51 | VAR Simulation Minigame
52 | Casino Generators Minigame
53 | Casino Computer Minigame
54 | Power Plant Minigame
55 | Untangle Minigame
56 | Yacht Helper

57 | Whisper me on Twitch @Sh4rkill3r or Discord sharkiller
58 | 67 |

NoPixel Minigames by Sharkiller is licensed under CC BY-NC-ND 4.0

68 |
69 | 70 | -------------------------------------------------------------------------------- /sitemap.xml: -------------------------------------------------------------------------------- 1 | 2 | 7 | 8 | 9 | https://sharkiller.ddns.net/ 10 | 2022-08-07T18:00:00+00:00 11 | daily 12 | 0.50 13 | 14 | 15 | https://sharkiller.ddns.net/nopixel_minigame/ 16 | 2022-08-07T18:00:00+00:00 17 | daily 18 | 0.60 19 | 20 | 21 | https://sharkiller.ddns.net/nopixel_minigame/lockpicks/ 22 | 2022-08-07T18:00:00+00:00 23 | daily 24 | 0.70 25 | 26 | 27 | https://sharkiller.ddns.net/nopixel_minigame/hackingdevice/ 28 | 2022-08-07T18:00:00+00:00 29 | daily 30 | 0.80 31 | 32 | 33 | https://sharkiller.ddns.net/nopixel_minigame/fleeca/ 34 | 2022-08-07T18:00:00+00:00 35 | daily 36 | 1.00 37 | 38 | 39 | https://sharkiller.ddns.net/nopixel_minigame/thermite/ 40 | 2022-08-07T18:00:00+00:00 41 | daily 42 | 0.85 43 | 44 | 45 | https://sharkiller.ddns.net/nopixel_minigame/vault/ 46 | 2022-08-07T18:00:00+00:00 47 | daily 48 | 0.95 49 | 50 | 51 | https://sharkiller.ddns.net/nopixel_minigame/lowervault/ 52 | 2022-08-07T18:00:00+00:00 53 | daily 54 | 0.90 55 | 56 | 57 | https://sharkiller.ddns.net/nopixel_minigame/vaultcodes/ 58 | 2022-08-07T18:00:00+00:00 59 | daily 60 | 0.64 61 | 62 | 63 | https://sharkiller.ddns.net/nopixel_minigame/var_simulation/ 64 | 2022-08-07T18:00:00+00:00 65 | daily 66 | 0.75 67 | 68 | 69 | https://sharkiller.ddns.net/nopixel_minigame/casino_generators/ 70 | 2022-08-07T18:00:00+00:00 71 | daily 72 | 0.75 73 | 74 | 75 | https://sharkiller.ddns.net/nopixel_minigame/casino_computer/ 76 | 2022-02-06T18:18:13+00:00 77 | daily 78 | 0.75 79 | 80 | 81 | https://sharkiller.ddns.net/nopixel_minigame/powerplant_generators/ 82 | 2022-08-07T18:00:00+00:00 83 | daily 84 | 0.75 85 | 86 | 87 | https://sharkiller.ddns.net/nopixel_minigame/yacht/ 88 | 2022-08-07T18:00:00+00:00 89 | daily 90 | 0.64 91 | 92 | 93 | https://sharkiller.ddns.net/nopixel_minigame/untangle/ 94 | 2023-07-07T18:00:00+00:00 95 | daily 96 | 0.74 97 | 98 | -------------------------------------------------------------------------------- /nopixel_minigame/4.0/laundromat/minigame.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Font Awesome Free 5.15.2 by @fontawesome - https://fontawesome.com 3 | * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) 4 | */ 5 | @font-face { 6 | font-family: "Font Awesome 5 Free"; 7 | font-style: normal; 8 | font-weight: 900; 9 | font-display: block; 10 | src: url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.eot); 11 | src: url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.eot?#iefix) format("embedded-opentype"), 12 | url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.woff2) format("woff2"), 13 | url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.woff) format("woff"), 14 | url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.ttf) format("truetype"), 15 | url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.svg#fontawesome) format("svg") 16 | } 17 | 18 | .fa, .fas { 19 | font-family: "Font Awesome 5 Free", sans-serif; 20 | font-weight: 900 21 | } 22 | 23 | /*! 24 | * Game 25 | */ 26 | 27 | body{ 28 | background-color: #15181d; 29 | font-family: sans-serif; 30 | } 31 | 32 | .title{ 33 | text-align: center; 34 | color: white; 35 | } 36 | .description{ 37 | text-align: center; 38 | color: gray; 39 | } 40 | .description sub{ 41 | font-style: italic; 42 | } 43 | 44 | .streaks { 45 | display: block; 46 | margin: 40px auto; 47 | text-align: center; 48 | font-size: 30px; 49 | font-weight: bold; 50 | text-transform: uppercase; 51 | color: white; 52 | width: -moz-fit-content; 53 | width: fit-content; 54 | background-color: #028000; 55 | padding: 12px; 56 | border-radius: 18px; 57 | } 58 | .best_time, 59 | .time { 60 | display: inline-block; 61 | width: 100px; 62 | } 63 | .streaks .fa { 64 | padding: 0 10px; 65 | } 66 | .options{ 67 | font-weight: bold; 68 | text-align: center; 69 | margin: 0 auto 10px; 70 | } 71 | .option{ 72 | display: inline-block; 73 | color: white; 74 | font-weight: bold; 75 | text-align: center; 76 | width: -moz-fit-content; 77 | width: fit-content; 78 | height: 20px; 79 | background-color: #20282e; 80 | padding: 10px 20px; 81 | margin: 0 auto 10px; 82 | border-radius: 6px; 83 | } 84 | .option.speed input{ 85 | vertical-align: text-top; 86 | } 87 | .speed_value{ 88 | display: inline-block; 89 | width: 18px; 90 | text-align: right; 91 | } 92 | .dots_value{ 93 | display: inline-block; 94 | width: 40px; 95 | text-align: center; 96 | } 97 | .minigame{ 98 | margin: 0 auto 20px; 99 | width: 540px; 100 | min-width: 540px; 101 | max-width: 540px; 102 | height: 540px; 103 | min-height: 540px; 104 | max-height: 540px; 105 | background-color: #232832; 106 | } 107 | .splash{ 108 | display: inline-block; 109 | width: 100%; 110 | margin: 220px auto; 111 | text-align: center; 112 | color: white; 113 | font-size: 16px; 114 | user-select: none; 115 | } 116 | .splash .hacker{ 117 | font-size: 65px; 118 | margin-bottom: 30px; 119 | } 120 | .game-canvas{ 121 | margin: 0; 122 | background-color: #0c2332; 123 | } 124 | .hidden { 125 | display: none; 126 | } 127 | .restart{ 128 | text-align: center; 129 | } 130 | .btn_again { 131 | padding: 6px 15px; 132 | font-weight: bold; 133 | } 134 | .credits{ 135 | text-align: center; 136 | color: gray; 137 | margin-top: 40px; 138 | } 139 | .credits a{ 140 | color: #ccc; 141 | } 142 | .credits b{ 143 | color: white; 144 | } 145 | .credits .fas{ 146 | color: red; 147 | } 148 | .credits .donate{ 149 | margin: 20px 0; 150 | } 151 | .credits .coin{ 152 | font-weight: bold; 153 | color: white; 154 | } 155 | .credits .wallet{ 156 | font-family: monospace; 157 | font-size: 20px; 158 | } 159 | -------------------------------------------------------------------------------- /nopixel_minigame/lockpicks/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | NoPixel Lockpicks Minigame 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 19 | 20 | 21 | 22 |
23 |
Status

24 |
Streak:
25 |
0
26 |
Max streak:
27 |
0
28 |
29 |
30 |
31 | Whisper me on Twitch @Sh4rkill3r or Discord sharkiller

32 | 41 |
42 |
43 | See also:
44 | NoPixel 4.0 Minigames

45 | >Lockpicks Minigame<
46 | Hacking Device Minigame
47 | Fleeca Minigame
48 | Thermite Minigame
49 | Vault Minigame
50 | Lower Vault Minigame
51 | Vault Codes Minigame
52 | VAR Simulation Minigame
53 | Casino Generators Minigame
54 | Casino Computer Minigame
55 | Power Plant Minigame
56 | Untangle Minigame
57 | Yacht Helper
58 |
59 |

NoPixel Minigames by Sharkiller is licensed under CC BY-NC-ND 4.0

60 | 61 | -------------------------------------------------------------------------------- /nopixel_minigame/var_simulation/minigame.css: -------------------------------------------------------------------------------- 1 | body{ 2 | background-color: #15181d; 3 | font-family: sans-serif; 4 | } 5 | 6 | .title{ 7 | text-align: center; 8 | color: white; 9 | } 10 | .description{ 11 | text-align: center; 12 | color: gray; 13 | } 14 | 15 | /** 16 | MINIGAME SQUARES 17 | */ 18 | .streaks { 19 | display: block; 20 | margin: 40px auto; 21 | text-align: center; 22 | font-size: 30px; 23 | font-weight: bold; 24 | text-transform: uppercase; 25 | color: white; 26 | width: -moz-fit-content; 27 | width: fit-content; 28 | background-color: #028000; 29 | padding: 12px; 30 | border-radius: 18px; 31 | } 32 | .options{ 33 | font-weight: bold; 34 | text-align: center; 35 | margin: 0 auto 10px; 36 | } 37 | .option{ 38 | display: inline-block; 39 | color: white; 40 | font-weight: bold; 41 | text-align: center; 42 | width: -moz-fit-content; 43 | width: fit-content; 44 | height: 20px; 45 | background-color: #20282e; 46 | padding: 10px 20px; 47 | margin: 0 auto 10px; 48 | border-radius: 6px; 49 | } 50 | .option.numbers input, 51 | .option.speed input{ 52 | vertical-align: text-top; 53 | } 54 | .numbers_value, 55 | .speed_value{ 56 | display: inline-block; 57 | width: 18px; 58 | text-align: right; 59 | } 60 | .splash{ 61 | display: inline-block; 62 | width: 100%; 63 | margin: 352px auto; 64 | text-align: center; 65 | color: white; 66 | font-size: 16px; 67 | } 68 | .splash .hacker{ 69 | font-size: 64px; 70 | margin-bottom: 30px; 71 | } 72 | .splash .message{ 73 | font-size: 24px; 74 | } 75 | .splash .sub_message{ 76 | display: block; 77 | font-size: 17px; 78 | margin-top: 5px; 79 | } 80 | 81 | .btn_again { 82 | margin: 70px auto; 83 | padding: 15px 20px; 84 | font-weight: bold; 85 | display: block; 86 | color: #ffffff; 87 | background-color: #2c465e; 88 | border: 1px solid #16181d; 89 | cursor: pointer; 90 | } 91 | .btn_again:hover { 92 | background-color: #425e79; 93 | } 94 | .groups .btn_again{ 95 | margin: 0 auto; 96 | } 97 | 98 | .minigame{ 99 | margin: 0 auto 20px; 100 | width: 1536px; 101 | min-width: 1536px; 102 | max-width: 1536px; 103 | height: 865px; 104 | min-height: 865px; 105 | max-height: 865px; 106 | background-color: #20282e; 107 | position: relative; 108 | } 109 | .groups{ 110 | position: relative; 111 | user-select: none; 112 | } 113 | .group{ 114 | position: absolute; 115 | width: 96px; 116 | height: 96px; 117 | background-color: #10487f; 118 | cursor: pointer; 119 | text-align: center; 120 | font-size: 62px; 121 | color: #ffffff; 122 | line-height: 100px; 123 | border: 1px solid white; 124 | } 125 | .groups.playing .group{ 126 | color: transparent; 127 | } 128 | 129 | .group.bg1{ 130 | background-color: #00ffff; 131 | } 132 | .group.bg2{ 133 | background-color: #088f90; 134 | } 135 | .group.bg3{ 136 | background-color: #708fae; 137 | } 138 | .group.bg4{ 139 | background-color: #7392b2; 140 | } 141 | .group.bg5{ 142 | background-color: #6394ed; 143 | } 144 | .group.bg6{ 145 | background-color: #10487f; 146 | } 147 | .group.bg7{ 148 | background-color: #0047ab; 149 | } 150 | .group.bg8{ 151 | background-color: #1335a3; 152 | } 153 | .group.bg9{ 154 | background-color: #00018b; 155 | } 156 | 157 | .group.good{ 158 | background-color: #3a5c81; 159 | border: none; 160 | } 161 | .group.bad{ 162 | background-color: #802525; 163 | border: none; 164 | } 165 | 166 | .credits{ 167 | text-align: center; 168 | color: gray; 169 | } 170 | .credits a{ 171 | color: #ccc; 172 | } 173 | .credits b{ 174 | color: white; 175 | } 176 | .credits .donate{ 177 | margin: 20px 0; 178 | } 179 | .credits .coin{ 180 | font-weight: bold; 181 | color: white; 182 | } 183 | .credits .wallet{ 184 | font-family: monospace; 185 | font-size: 20px; 186 | } 187 | 188 | .hidden { 189 | display: none!important; 190 | } -------------------------------------------------------------------------------- /nopixel_minigame/hackingdevice/minigame.css: -------------------------------------------------------------------------------- 1 | body{ 2 | background-color: #15181d; 3 | font-family: sans-serif; 4 | } 5 | 6 | .title{ 7 | text-align: center; 8 | color: white; 9 | } 10 | .description{ 11 | text-align: center; 12 | color: gray; 13 | } 14 | 15 | /** 16 | MINIGAME SQUARES 17 | */ 18 | 19 | .streaks { 20 | display: block; 21 | margin: 40px auto; 22 | text-align: center; 23 | font-size: 30px; 24 | font-weight: bold; 25 | text-transform: uppercase; 26 | color: white; 27 | width: -moz-fit-content; 28 | width: fit-content; 29 | background-color: #028000; 30 | padding: 12px; 31 | border-radius: 18px; 32 | } 33 | .best_time, 34 | .time { 35 | display: inline-block; 36 | width: 100px; 37 | } 38 | .streaks .fa { 39 | padding: 0 10px; 40 | } 41 | .options{ 42 | font-weight: bold; 43 | text-align: center; 44 | margin: 0 auto 10px; 45 | cursor: default; 46 | user-select: none; 47 | } 48 | .option{ 49 | display: inline-block; 50 | color: white; 51 | font-weight: bold; 52 | text-align: center; 53 | width: -moz-fit-content; 54 | width: fit-content; 55 | height: 20px; 56 | background-color: #20282e; 57 | padding: 10px 20px; 58 | margin: 0 auto 10px; 59 | border-radius: 6px; 60 | } 61 | .option.setting{ 62 | display: inline-flex; 63 | height: 32px; 64 | padding: 0; 65 | } 66 | .option.setting label{ 67 | font-size: 12px; 68 | padding: 6px 10px 6px 6px; 69 | cursor: pointer; 70 | } 71 | .option.setting input{ 72 | vertical-align: -2px; 73 | cursor: pointer; 74 | } 75 | .option.timeout label{ 76 | padding: 9px; 77 | } 78 | .option.timeout input{ 79 | vertical-align: text-top; 80 | } 81 | .timeout_value{ 82 | font-size: 12px; 83 | display: inline-block; 84 | width: 18px; 85 | text-align: right; 86 | padding: 9px 12px 9px 5px; 87 | } 88 | .minigame{ 89 | margin: 0 auto 20px; 90 | width: 540px; 91 | min-width: 540px; 92 | max-width: 540px; 93 | background-color: #232832; 94 | padding: 30px 0; 95 | } 96 | .splash{ 97 | display: inline-block; 98 | width: 100%; 99 | text-align: center; 100 | color: white; 101 | font-size: 16px; 102 | } 103 | .splash .hacker{ 104 | font-size: 65px; 105 | margin-bottom: 30px; 106 | } 107 | .splash .text{ 108 | font-weight: bold; 109 | } 110 | .minigame .find{ 111 | text-align: center; 112 | color: white; 113 | font-size: 30px; 114 | user-select: none; 115 | margin-top: 10px; 116 | } 117 | .minigame .find > div{ 118 | display: inline-block; 119 | } 120 | .minigame .timer{ 121 | text-align: center; 122 | color: green; 123 | font-size: 14px; 124 | margin-bottom: 15px; 125 | } 126 | .minigame .codes { 127 | display: flex; 128 | flex-wrap: wrap; 129 | width: 400px; 130 | margin: auto; 131 | } 132 | .minigame .codes > div{ 133 | flex: 1 0 10%; 134 | margin: 7px 0; 135 | color: white; 136 | text-align: center; 137 | font-size: 18px; 138 | } 139 | .minigame .codes > div.red{ 140 | color: red; 141 | } 142 | .minigame .codes > div.green{ 143 | color: green; 144 | } 145 | .minigame .mirrored .find > div, 146 | .minigame .mirrored .codes > div { 147 | -moz-transform: scale(-1, -1); 148 | -o-transform: scale(-1, -1); 149 | -webkit-transform: scale(-1, -1); 150 | transform: scale(-1, -1); 151 | } 152 | .hidden { 153 | display: none; 154 | } 155 | .restart{ 156 | text-align: center; 157 | } 158 | .btn_again { 159 | padding: 6px 15px; 160 | font-weight: bold; 161 | } 162 | .credits{ 163 | text-align: center; 164 | color: gray; 165 | margin-top: 40px; 166 | } 167 | .credits a{ 168 | color: #ccc; 169 | } 170 | .credits b{ 171 | color: white; 172 | } 173 | .credits .fas{ 174 | color: red; 175 | } 176 | .credits .donate{ 177 | margin: 20px 0; 178 | } 179 | .credits .coin{ 180 | font-weight: bold; 181 | color: white; 182 | } 183 | .credits .wallet{ 184 | font-family: monospace; 185 | font-size: 20px; 186 | } 187 | -------------------------------------------------------------------------------- /nopixel_minigame/powerplant_generators/minigame.css: -------------------------------------------------------------------------------- 1 | body{ 2 | background-color: #15181d; 3 | font-family: sans-serif; 4 | } 5 | 6 | .title{ 7 | text-align: center; 8 | color: white; 9 | } 10 | .description{ 11 | text-align: center; 12 | color: gray; 13 | } 14 | 15 | /** 16 | MINIGAME SQUARES 17 | */ 18 | 19 | .streaks { 20 | display: block; 21 | margin: 40px auto; 22 | text-align: center; 23 | font-size: 30px; 24 | font-weight: bold; 25 | text-transform: uppercase; 26 | color: white; 27 | width: -moz-fit-content; 28 | width: fit-content; 29 | background-color: #028000; 30 | padding: 12px; 31 | border-radius: 18px; 32 | } 33 | .best_time, 34 | .time { 35 | display: inline-block; 36 | width: 100px; 37 | } 38 | .streaks .fa { 39 | padding: 0 10px; 40 | } 41 | .options{ 42 | font-weight: bold; 43 | text-align: center; 44 | margin: 0 auto 10px; 45 | cursor: default; 46 | user-select: none; 47 | } 48 | .option{ 49 | display: inline-block; 50 | color: white; 51 | font-weight: bold; 52 | text-align: center; 53 | width: -moz-fit-content; 54 | width: fit-content; 55 | height: 20px; 56 | background-color: #20282e; 57 | padding: 10px 20px; 58 | margin: 0 auto 10px; 59 | border-radius: 6px; 60 | } 61 | .option.setting{ 62 | display: inline-flex; 63 | height: 32px; 64 | padding: 0; 65 | } 66 | .option.setting label{ 67 | font-size: 12px; 68 | padding: 6px 10px 6px 6px; 69 | cursor: pointer; 70 | } 71 | .option.setting input{ 72 | vertical-align: -2px; 73 | cursor: pointer; 74 | } 75 | .option.timeout label{ 76 | padding: 9px; 77 | } 78 | .option.timeout input{ 79 | vertical-align: text-top; 80 | } 81 | .timeout_value{ 82 | font-size: 12px; 83 | display: inline-block; 84 | width: 18px; 85 | text-align: right; 86 | padding: 9px 12px 9px 5px; 87 | } 88 | .minigame{ 89 | margin: 0 auto 20px; 90 | width: 640px; 91 | min-width: 640px; 92 | max-width: 640px; 93 | height: 640px; 94 | min-height: 640px; 95 | max-height: 640px; 96 | background-color: #232832; 97 | padding: 0; 98 | position: relative; 99 | } 100 | .splash{ 101 | display: inline-block; 102 | width: 100%; 103 | text-align: center; 104 | color: white; 105 | font-size: 16px; 106 | margin-top: 240px; 107 | } 108 | .splash .hacker{ 109 | font-size: 65px; 110 | margin-bottom: 30px; 111 | } 112 | .minigame > .hack > .bar { 113 | background-color: #1a5026; 114 | width: 100%; 115 | height: 64px; 116 | margin-top: 64px; 117 | display: inline-block; 118 | position: absolute; 119 | } 120 | .minigame .letters { 121 | position: absolute; 122 | } 123 | 124 | .minigame .letter { 125 | position: absolute; 126 | color: white; 127 | font-size: 60px; 128 | top: 590px; 129 | text-transform: uppercase; 130 | } 131 | .letters .letter.pos1 { 132 | margin-left: 60px; 133 | } 134 | .letters .letter.pos2 { 135 | margin-left: 220px; 136 | } 137 | .letters .letter.pos3 { 138 | margin-left: 387px; 139 | } 140 | .letters .letter.pos4 { 141 | margin-left: 540px; 142 | } 143 | .letters .letter.red{ 144 | color: red; 145 | } 146 | .letters .letter.green{ 147 | color: #0ee00e; 148 | } 149 | .minigame .mirrored .find > div, 150 | .minigame .mirrored .codes > div { 151 | -moz-transform: scale(-1, -1); 152 | -o-transform: scale(-1, -1); 153 | -webkit-transform: scale(-1, -1); 154 | transform: scale(-1, -1); 155 | } 156 | .hidden { 157 | display: none; 158 | } 159 | .restart{ 160 | text-align: center; 161 | } 162 | .btn_again { 163 | padding: 6px 15px; 164 | font-weight: bold; 165 | } 166 | .credits{ 167 | text-align: center; 168 | color: gray; 169 | margin-top: 40px; 170 | } 171 | .credits a{ 172 | color: #ccc; 173 | } 174 | .credits b{ 175 | color: white; 176 | } 177 | .credits .fas{ 178 | color: red; 179 | } 180 | .credits .donate{ 181 | margin: 20px 0; 182 | } 183 | .credits .coin{ 184 | font-weight: bold; 185 | color: white; 186 | } 187 | .credits .wallet{ 188 | font-family: monospace; 189 | font-size: 20px; 190 | } -------------------------------------------------------------------------------- /nopixel_minigame/lockpicks/minigame.js: -------------------------------------------------------------------------------- 1 | let canvas = document.getElementById("canvas"); 2 | let ctx = canvas.getContext("2d"); 3 | 4 | let W = canvas.width; 5 | let H = canvas.height; 6 | let degrees = 0; 7 | let new_degrees = 0; 8 | let time = 0; 9 | let color = "#ff0000"; 10 | let txtcolor = "#ffffff"; 11 | let bgcolor = "#404b58"; 12 | let bgcolor2 = "#41a491"; 13 | let bgcolor3 = "#00ff00"; 14 | let key_to_press; 15 | let g_start, g_end; 16 | let animation_loop; 17 | 18 | let streak = 0; 19 | let max_streak = 0; 20 | 21 | function getRandomInt(min, max) { 22 | min = Math.ceil(min); 23 | max = Math.floor(max); 24 | return Math.floor(Math.random() * (max - min + 1) + min); //The maximum is inclusive and the minimum is inclusive 25 | } 26 | 27 | function init(correct) { 28 | // Clear the canvas every time a chart is drawn 29 | ctx.clearRect(0,0,W,H); 30 | 31 | // Background 360 degree arc 32 | ctx.beginPath(); 33 | ctx.strokeStyle = bgcolor; 34 | ctx.lineWidth = 20; 35 | ctx.arc(W / 2, H / 2, 100, 0, Math.PI * 2, false); 36 | ctx.stroke(); 37 | 38 | // Green zone 39 | ctx.beginPath(); 40 | ctx.strokeStyle = correct === true? bgcolor3 : bgcolor2; 41 | ctx.lineWidth = 20; 42 | ctx.arc(W / 2, H / 2, 100, g_start - 90 * Math.PI / 180, g_end - 90 * Math.PI / 180, false); 43 | ctx.stroke(); 44 | 45 | // Angle in radians = angle in degrees * PI / 180 46 | let radians = degrees * Math.PI / 180; 47 | ctx.beginPath(); 48 | ctx.strokeStyle = color; 49 | ctx.lineWidth = 40; 50 | ctx.arc(W / 2, H / 2, 90, radians - 0.1 - 90 * Math.PI / 180, radians - 90 * Math.PI / 180, false); 51 | ctx.stroke(); 52 | 53 | // Adding the key_to_press 54 | ctx.fillStyle = txtcolor; 55 | ctx.font = "100px sans-serif"; 56 | let text_width = ctx.measureText(key_to_press).width; 57 | ctx.fillText(key_to_press, W / 2 - text_width / 2, H / 2 + 35); 58 | } 59 | 60 | function draw() { 61 | if (typeof animation_loop !== undefined) clearInterval(animation_loop); 62 | 63 | document.querySelector('.stats .streak').innerHTML = streak; 64 | document.querySelector('.stats .max-streak').innerHTML = max_streak; 65 | 66 | g_start = getRandomInt(20,40) / 10; 67 | g_end = getRandomInt(3,5) / 10; 68 | g_end = g_start + g_end; 69 | 70 | degrees = 0; 71 | new_degrees = 360; 72 | 73 | key_to_press = ''+getRandomInt(1,4); 74 | 75 | time = getRandomInt(1, 3) * 6; 76 | 77 | animation_loop = setInterval(animate_to, time); 78 | } 79 | 80 | function animate_to() { 81 | if (degrees >= new_degrees) { 82 | document.querySelector('.text.status').innerHTML = 'Skipped!'; 83 | console.log('Failed: timeout!'); 84 | wrong(); 85 | draw(); 86 | return; 87 | } 88 | 89 | degrees+=2; 90 | init(); 91 | } 92 | 93 | function correct(){ 94 | document.querySelector('.stats').classList.remove('wrong'); 95 | if(streak > max_streak){ 96 | max_streak = streak; 97 | } 98 | streak++; 99 | } 100 | 101 | function wrong(){ 102 | document.querySelector('.stats').classList.add('wrong'); 103 | if(streak > max_streak){ 104 | max_streak = streak; 105 | } 106 | streak = 0; 107 | } 108 | 109 | document.addEventListener("keydown", function(ev) { 110 | let key_pressed = ev.key; 111 | let valid_keys = ['1','2','3','4']; 112 | 113 | if( valid_keys.includes(key_pressed) ){ 114 | bgcolor3 = "#ff0000"; 115 | if( key_pressed === key_to_press ){ 116 | let d_start = (180 / Math.PI) * g_start; 117 | let d_end = (180 / Math.PI) * g_end; 118 | if( degrees < d_start ){ 119 | document.querySelector('.text.status').innerHTML = 'Too soon!'; 120 | wrong(); 121 | }else if( degrees > d_end ){ 122 | document.querySelector('.text.status').innerHTML = 'Too late!'; 123 | wrong(); 124 | }else{ 125 | document.querySelector('.text.status').innerHTML = 'Success!'; 126 | bgcolor3 = "#00ff00"; 127 | correct(); 128 | } 129 | }else{ 130 | document.querySelector('.text.status').innerHTML = 'Failed: Pressed '+key_pressed; 131 | console.log('Failed: Pressed '+key_pressed+' instead of '+key_to_press); 132 | wrong(); 133 | } 134 | init(true); 135 | clearInterval(animation_loop); 136 | setTimeout(function(){ 137 | draw(); 138 | }, 500); 139 | } 140 | }); 141 | 142 | draw(); -------------------------------------------------------------------------------- /nopixel_minigame/4.0/roof_running/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | NoPixel Roof Running Minigame 6 | 7 | 8 | 9 | 10 | 11 | 12 | 19 | 20 | 26 | 27 | 28 |

NoPixel Roof Running Minigame

29 |

30 | Play the NoPixel Roof Running Minigame and find the correct pattern. 31 |

32 | How to play: Click on the squares that are adjacent to one or more with the same color until no squares are left.
33 | If you are unable to remove all squares you fail.
34 |

35 |
36 | STREAK: 0 MAX STREAK: 0 37 |
TIME: 0.000 BEST TIME: 0.000 38 |
39 |
40 |
41 | 42 | 43 |
5x5
44 |
45 |
46 |
47 |
Play the minigame
48 | 49 |
50 |
51 |
52 | Whisper me on Twitch @Sh4rkill3r or Discord sharkiller
53 | 62 | See also:
63 | Laundromat Minigame
64 | >Roof Running Minigame<

65 | NoPixel 3.0 Minigames

66 |
NoPixel Minigames by Sharkiller is licensed under CC BY-NC-ND 4.0CCBYNCND
67 |
68 | 69 | -------------------------------------------------------------------------------- /nopixel_minigame/4.0/laundromat/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | NoPixel Laundromat Minigame 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 20 | 21 | 27 | 28 | 29 |

NoPixel Laundromat Minigame

30 |

31 | Play the NoPixel Laundromat Minigame and match the correct colors. 32 |

33 | How to play: Rotate the dots with ← and → or A and D to match the outer circle color.
34 | Press [ENTER] to confirm position. You can restart the minigame pressing [R]. 35 |

36 |
37 | STREAK: 0 MAX STREAK: 0 38 |
TIME: 0.000 BEST TIME: 0.000 39 |
40 |
41 |
42 | 43 | 44 |
10s
45 |
46 |
47 |
48 |
Lockpick... Unlock each lock...
49 | 50 |
51 |
52 |
53 | Whisper me on Twitch @Sh4rkill3r or Discord sharkiller
54 | 63 | See also:
64 | >Laundromat Minigame<
65 | Roof Running Minigame

66 | NoPixel 3.0 Minigames

67 |
NoPixel Minigames by Sharkiller is licensed under CC BY-NC-ND 4.0CCBYNCND
68 |
69 | 70 | -------------------------------------------------------------------------------- /nopixel_minigame/vaultcodes/minigame.css: -------------------------------------------------------------------------------- 1 | body{ 2 | background-color: #15181d; 3 | } 4 | 5 | /** 6 | MINIGAME SQUARES 7 | */ 8 | 9 | .streaks { 10 | display: block; 11 | margin: 80px auto 40px; 12 | text-align: center; 13 | font-size: 30px; 14 | font-family: sans-serif; 15 | font-weight: bold; 16 | text-transform: uppercase; 17 | color: white; 18 | width: -moz-fit-content; 19 | width: fit-content; 20 | background-color: #028000; 21 | padding: 12px; 22 | border-radius: 18px; 23 | } 24 | .best_time, 25 | .time { 26 | display: inline-block; 27 | width: 100px; 28 | } 29 | .streaks .fa { 30 | padding: 0 10px; 31 | } 32 | .options{ 33 | font-weight: bold; 34 | text-align: center; 35 | margin: 0 auto 10px; 36 | } 37 | .option{ 38 | display: inline-block; 39 | color: white; 40 | font-family: sans-serif; 41 | font-weight: bold; 42 | text-align: center; 43 | width: -moz-fit-content; 44 | width: fit-content; 45 | height: 20px; 46 | background-color: #20282e; 47 | padding: 10px 20px; 48 | margin: 0 auto 10px; 49 | border-radius: 6px; 50 | } 51 | .option.speed input, 52 | .option.numbers input{ 53 | vertical-align: text-top; 54 | } 55 | .speed_value, 56 | .numbers_value{ 57 | display: inline-block; 58 | width: 18px; 59 | text-align: right; 60 | } 61 | .minigame{ 62 | margin: 0 auto 20px; 63 | width: 600px; 64 | min-width: 600px; 65 | max-width: 600px; 66 | height: 215px; 67 | min-height: 215px; 68 | max-height: 215px; 69 | background-color: #232832; 70 | } 71 | .splash{ 72 | display: inline-block; 73 | width: 100%; 74 | margin: 48px auto; 75 | font-family: sans-serif; 76 | text-align: center; 77 | color: white; 78 | font-size: 16px; 79 | } 80 | .splash .hacker{ 81 | font-size: 65px; 82 | margin-bottom: 30px; 83 | } 84 | .minigame .numbers{ 85 | padding: 80px 0; 86 | font-family: sans-serif; 87 | text-align: center; 88 | color: white; 89 | font-size: 44px; 90 | user-select: none; 91 | } 92 | .answer{ 93 | text-align: center; 94 | font-size: 20px; 95 | font-family: sans-serif; 96 | font-weight: bold; 97 | color: white; 98 | padding-top: 70px; 99 | } 100 | .answer label{ 101 | display: block; 102 | font-size: 12px; 103 | text-align: left; 104 | margin-bottom: 8px; 105 | } 106 | .answer-wrapper { 107 | display:inline-block; 108 | position: relative; 109 | width: 222px; 110 | color: #b7bdc1; 111 | } 112 | .answer-wrapper:after { 113 | font-family: "Font Awesome 5 Free", sans-serif; 114 | content: '\f21b'; 115 | position: absolute; 116 | left: 3px; 117 | font-size: 18px; 118 | top: 25px; 119 | } 120 | .answer-wrapper.wrong:before { 121 | font-family: "Font Awesome 5 Free", sans-serif; 122 | content: '\f057'; 123 | position: absolute; 124 | right: -25px; 125 | bottom: 5px; 126 | font-size: 18px; 127 | color:red; 128 | } 129 | .answer-wrapper.right:before { 130 | font-family: "Font Awesome 5 Free", sans-serif; 131 | content: '\f058'; 132 | position: absolute; 133 | right: -25px; 134 | bottom: 5px; 135 | font-size: 18px; 136 | color: green; 137 | } 138 | #answer{ 139 | background-color: transparent; 140 | border: none; 141 | border-bottom: 2px solid white; 142 | padding: 0 0 6px 28px; 143 | width: 100%; 144 | font-size: 16px; 145 | font-weight: bold; 146 | color: white; 147 | } 148 | .answer-wrapper.wrong #answer { 149 | border-bottom-color: red; 150 | } 151 | .answer-wrapper.right #answer { 152 | border-bottom-color: green; 153 | } 154 | #answer::placeholder{ 155 | color: #626a71; 156 | } 157 | #answer:focus{ 158 | outline: none; 159 | } 160 | .solution{ 161 | font-size: 16px; 162 | font-weight: bold; 163 | color: white; 164 | font-family: sans-serif; 165 | width: 222px; 166 | margin: 10px auto 0; 167 | padding-left: 57px; 168 | } 169 | 170 | .solution .good{ 171 | color: #00ff00; 172 | } 173 | .solution .bad{ 174 | color: #ff0000; 175 | } 176 | .hidden { 177 | display: none; 178 | } 179 | .restart{ 180 | font-family: sans-serif; 181 | text-align: center; 182 | } 183 | .btn_again { 184 | padding: 6px 15px; 185 | font-weight: bold; 186 | } 187 | .credits{ 188 | font-family: sans-serif; 189 | text-align: center; 190 | color: gray; 191 | margin-top: 40px; 192 | } 193 | .credits a{ 194 | color: #ccc; 195 | } 196 | .credits b{ 197 | color: white; 198 | } 199 | .credits .fas{ 200 | color: red; 201 | } 202 | .credits .donate{ 203 | margin: 20px 0; 204 | } 205 | .credits .coin{ 206 | font-weight: bold; 207 | color: white; 208 | } 209 | .credits .wallet{ 210 | font-family: monospace; 211 | font-size: 20px; 212 | } 213 | -------------------------------------------------------------------------------- /nopixel_minigame/casino_computer/minigame.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Font Awesome Free 5.15.2 by @fontawesome - https://fontawesome.com 3 | * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) 4 | */ 5 | @font-face { 6 | font-family: "Font Awesome 5 Free"; 7 | font-style: normal; 8 | font-weight: 900; 9 | font-display: block; 10 | src: url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.eot); 11 | src: url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.eot?#iefix) format("embedded-opentype"), 12 | url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.woff2) format("woff2"), 13 | url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.woff) format("woff"), 14 | url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.ttf) format("truetype"), 15 | url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.svg#fontawesome) format("svg") 16 | } 17 | 18 | .fa, .fas { 19 | font-family: "Font Awesome 5 Free", sans-serif; 20 | font-weight: 900 21 | } 22 | 23 | /*! 24 | * Game 25 | */ 26 | 27 | body{ 28 | background-color: #15181d; 29 | font-family: sans-serif; 30 | } 31 | 32 | .title{ 33 | text-align: center; 34 | color: white; 35 | } 36 | .description{ 37 | text-align: center; 38 | color: gray; 39 | } 40 | .description sub{ 41 | font-style: italic; 42 | } 43 | 44 | .streaks { 45 | display: block; 46 | margin: 40px auto; 47 | text-align: center; 48 | font-size: 30px; 49 | font-weight: bold; 50 | text-transform: uppercase; 51 | color: white; 52 | width: -moz-fit-content; 53 | width: fit-content; 54 | background-color: #028000; 55 | padding: 12px; 56 | border-radius: 18px; 57 | } 58 | .best_time, 59 | .time { 60 | display: inline-block; 61 | width: 100px; 62 | } 63 | .streaks .fa { 64 | padding: 0 10px; 65 | } 66 | .options{ 67 | font-weight: bold; 68 | text-align: center; 69 | margin: 0 auto 10px; 70 | } 71 | .option{ 72 | display: inline-block; 73 | color: white; 74 | font-weight: bold; 75 | text-align: center; 76 | width: -moz-fit-content; 77 | width: fit-content; 78 | height: 20px; 79 | background-color: #20282e; 80 | padding: 10px 20px; 81 | margin: 0 auto 10px; 82 | border-radius: 6px; 83 | } 84 | .option.grid input, 85 | .option.speed input{ 86 | vertical-align: text-top; 87 | } 88 | .speed_value{ 89 | display: inline-block; 90 | width: 18px; 91 | text-align: right; 92 | } 93 | .grid_value{ 94 | display: inline-block; 95 | width: 40px; 96 | text-align: center; 97 | } 98 | .minigame{ 99 | margin: 0 auto 20px; 100 | width: 540px; 101 | min-width: 540px; 102 | max-width: 540px; 103 | height: 540px; 104 | min-height: 540px; 105 | max-height: 540px; 106 | background-color: #232832; 107 | } 108 | .splash{ 109 | display: inline-block; 110 | width: 100%; 111 | margin: 220px auto; 112 | text-align: center; 113 | color: white; 114 | font-size: 16px; 115 | } 116 | .splash .hacker{ 117 | font-size: 65px; 118 | margin-bottom: 30px; 119 | } 120 | .groups{ 121 | display: flex; 122 | flex-wrap: wrap; 123 | justify-content: space-evenly; 124 | user-select: none; 125 | } 126 | .group{ 127 | width: 61px; 128 | height: 61px; 129 | border: 8px #232832 solid; 130 | background-color: #094e1c; 131 | font-family: "Font Awesome 5 Free", sans-serif; 132 | font-size: 26px; 133 | color: white; 134 | text-align: center; 135 | line-height: 60px; 136 | } 137 | .group:first-child { 138 | color: #008001!important; 139 | background-color: #6acf66; 140 | } 141 | .group:last-child { 142 | color: #F00F18!important; 143 | background-color: #6acf66; 144 | } 145 | .group.breathing{ 146 | animation: 0.5s infinite alternate ease-in-out breathing-bg; 147 | } 148 | @keyframes breathing-bg { 149 | from{background-color: #094e1c;} 150 | to{background-color: #6acf66;} 151 | } 152 | .groups.transparent .group{ 153 | color: transparent; 154 | } 155 | .proper{ 156 | border-image: linear-gradient(45deg, #ecc800, #564800) 1; 157 | } 158 | .good{ 159 | background-color: #3cec54; 160 | } 161 | .bad{ 162 | background-color: #F00F18; 163 | } 164 | 165 | .hidden { 166 | display: none; 167 | } 168 | .restart{ 169 | text-align: center; 170 | } 171 | .btn_again { 172 | padding: 6px 15px; 173 | font-weight: bold; 174 | } 175 | .credits{ 176 | text-align: center; 177 | color: gray; 178 | margin-top: 40px; 179 | } 180 | .credits a{ 181 | color: #ccc; 182 | } 183 | .credits b{ 184 | color: white; 185 | } 186 | .credits .fas{ 187 | color: red; 188 | } 189 | .credits .donate{ 190 | margin: 20px 0; 191 | } 192 | .credits .coin{ 193 | font-weight: bold; 194 | color: white; 195 | } 196 | .credits .wallet{ 197 | font-family: monospace; 198 | font-size: 20px; 199 | } 200 | -------------------------------------------------------------------------------- /nopixel_minigame/casino_generators/minigame.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Font Awesome Free 5.15.2 by @fontawesome - https://fontawesome.com 3 | * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) 4 | */ 5 | @font-face { 6 | font-family: "Font Awesome 5 Free"; 7 | font-style: normal; 8 | font-weight: 900; 9 | font-display: block; 10 | src: url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.eot); 11 | src: url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.eot?#iefix) format("embedded-opentype"), 12 | url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.woff2) format("woff2"), 13 | url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.woff) format("woff"), 14 | url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.ttf) format("truetype"), 15 | url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.svg#fontawesome) format("svg") 16 | } 17 | 18 | .fa, .fas { 19 | font-family: "Font Awesome 5 Free", sans-serif; 20 | font-weight: 900 21 | } 22 | 23 | /*! 24 | * Game 25 | */ 26 | 27 | body{ 28 | background-color: #15181d; 29 | font-family: sans-serif; 30 | } 31 | 32 | .title{ 33 | text-align: center; 34 | color: white; 35 | } 36 | .description{ 37 | text-align: center; 38 | color: gray; 39 | } 40 | .description sub{ 41 | font-style: italic; 42 | } 43 | 44 | .streaks { 45 | display: block; 46 | margin: 40px auto; 47 | text-align: center; 48 | font-size: 30px; 49 | font-weight: bold; 50 | text-transform: uppercase; 51 | color: white; 52 | width: -moz-fit-content; 53 | width: fit-content; 54 | background-color: #028000; 55 | padding: 12px; 56 | border-radius: 18px; 57 | } 58 | .best_time, 59 | .time { 60 | display: inline-block; 61 | width: 100px; 62 | } 63 | .streaks .fa { 64 | padding: 0 10px; 65 | } 66 | .options{ 67 | font-weight: bold; 68 | text-align: center; 69 | margin: 0 auto 10px; 70 | } 71 | .option{ 72 | display: inline-block; 73 | color: white; 74 | font-weight: bold; 75 | text-align: center; 76 | width: -moz-fit-content; 77 | width: fit-content; 78 | height: 20px; 79 | background-color: #20282e; 80 | padding: 10px 20px; 81 | margin: 0 auto 10px; 82 | border-radius: 6px; 83 | } 84 | .option.grid input, 85 | .option.speed input{ 86 | vertical-align: text-top; 87 | } 88 | .speed_value{ 89 | display: inline-block; 90 | width: 18px; 91 | text-align: right; 92 | } 93 | .grid_value{ 94 | display: inline-block; 95 | width: 40px; 96 | text-align: center; 97 | } 98 | .minigame{ 99 | margin: 0 auto 20px; 100 | width: 540px; 101 | min-width: 540px; 102 | max-width: 540px; 103 | height: 540px; 104 | min-height: 540px; 105 | max-height: 540px; 106 | background-color: #232832; 107 | } 108 | .splash{ 109 | display: inline-block; 110 | width: 100%; 111 | margin: 220px auto; 112 | text-align: center; 113 | color: white; 114 | font-size: 16px; 115 | } 116 | .splash .hacker{ 117 | font-size: 65px; 118 | margin-bottom: 30px; 119 | } 120 | .groups{ 121 | display: flex; 122 | flex-wrap: wrap; 123 | justify-content: space-evenly; 124 | user-select: none; 125 | } 126 | .group{ 127 | width: 61px; 128 | height: 61px; 129 | border: 8px #232832 solid; 130 | background-color: #094e1c; 131 | font-family: "Font Awesome 5 Free", sans-serif; 132 | font-size: 26px; 133 | color: white; 134 | text-align: center; 135 | line-height: 60px; 136 | } 137 | .group:first-child { 138 | color: #008001!important; 139 | background-color: #6acf66; 140 | } 141 | .group:last-child { 142 | color: #F00F18!important; 143 | background-color: #6acf66; 144 | } 145 | .group.breathing{ 146 | animation: 0.5s infinite alternate ease-in-out breathing-bg; 147 | } 148 | @keyframes breathing-bg { 149 | from{background-color: #094e1c;} 150 | to{background-color: #6acf66;} 151 | } 152 | .groups.transparent .group{ 153 | color: transparent; 154 | } 155 | .proper{ 156 | border-image: linear-gradient(45deg, #ecc800, #564800) 1; 157 | } 158 | .good{ 159 | background-color: #3cec54; 160 | } 161 | .bad{ 162 | background-color: #F00F18; 163 | } 164 | 165 | .hidden { 166 | display: none; 167 | } 168 | .restart{ 169 | text-align: center; 170 | } 171 | .btn_again { 172 | padding: 6px 15px; 173 | font-weight: bold; 174 | } 175 | .credits{ 176 | text-align: center; 177 | color: gray; 178 | margin-top: 40px; 179 | } 180 | .credits a{ 181 | color: #ccc; 182 | } 183 | .credits b{ 184 | color: white; 185 | } 186 | .credits .fas{ 187 | color: red; 188 | } 189 | .credits .donate{ 190 | margin: 20px 0; 191 | } 192 | .credits .coin{ 193 | font-weight: bold; 194 | color: white; 195 | } 196 | .credits .wallet{ 197 | font-family: monospace; 198 | font-size: 20px; 199 | } 200 | -------------------------------------------------------------------------------- /nopixel_minigame/untangle/minigame.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Font Awesome Free 5.15.2 by @fontawesome - https://fontawesome.com 3 | * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) 4 | */ 5 | @font-face { 6 | font-family: "Font Awesome 5 Free"; 7 | font-style: normal; 8 | font-weight: 900; 9 | font-display: block; 10 | src: url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.eot); 11 | src: url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.eot?#iefix) format("embedded-opentype"), 12 | url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.woff2) format("woff2"), 13 | url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.woff) format("woff"), 14 | url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.ttf) format("truetype"), 15 | url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.svg#fontawesome) format("svg") 16 | } 17 | 18 | .fa, .fas { 19 | font-family: "Font Awesome 5 Free", sans-serif; 20 | font-weight: 900 21 | } 22 | 23 | /*! 24 | * Game 25 | */ 26 | 27 | body{ 28 | background-color: #15181d; 29 | font-family: sans-serif; 30 | } 31 | 32 | .title{ 33 | text-align: center; 34 | color: white; 35 | } 36 | .description{ 37 | text-align: center; 38 | color: gray; 39 | } 40 | .description sub{ 41 | font-style: italic; 42 | } 43 | 44 | .streaks { 45 | display: block; 46 | margin: 40px auto; 47 | text-align: center; 48 | font-size: 30px; 49 | font-weight: bold; 50 | text-transform: uppercase; 51 | color: white; 52 | width: -moz-fit-content; 53 | width: fit-content; 54 | background-color: #028000; 55 | padding: 12px; 56 | border-radius: 18px; 57 | } 58 | .best_time, 59 | .time { 60 | display: inline-block; 61 | width: 100px; 62 | } 63 | .streaks .fa { 64 | padding: 0 10px; 65 | } 66 | .options{ 67 | font-weight: bold; 68 | text-align: center; 69 | margin: 0 auto 10px; 70 | } 71 | .option{ 72 | display: inline-block; 73 | color: white; 74 | font-weight: bold; 75 | text-align: center; 76 | width: -moz-fit-content; 77 | width: fit-content; 78 | height: 20px; 79 | background-color: #20282e; 80 | padding: 10px 20px; 81 | margin: 0 auto 10px; 82 | border-radius: 6px; 83 | } 84 | .option.dots input, 85 | .option.speed input{ 86 | vertical-align: text-top; 87 | } 88 | .speed_value{ 89 | display: inline-block; 90 | width: 18px; 91 | text-align: right; 92 | } 93 | .dots_value{ 94 | display: inline-block; 95 | width: 40px; 96 | text-align: center; 97 | } 98 | .minigame{ 99 | margin: 0 auto 20px; 100 | width: 540px; 101 | min-width: 540px; 102 | max-width: 540px; 103 | height: 540px; 104 | min-height: 540px; 105 | max-height: 540px; 106 | background-color: #232832; 107 | } 108 | 109 | .untanglecanvas { 110 | height: 500px; 111 | width: 500px; 112 | margin: 20px; 113 | background-color: #094e1c; 114 | } 115 | 116 | .splash{ 117 | display: inline-block; 118 | width: 100%; 119 | margin: 220px auto; 120 | text-align: center; 121 | color: white; 122 | font-size: 16px; 123 | user-select: none; 124 | } 125 | .splash .hacker{ 126 | font-size: 65px; 127 | margin-bottom: 30px; 128 | } 129 | .groups{ 130 | display: flex; 131 | flex-wrap: wrap; 132 | justify-content: space-evenly; 133 | user-select: none; 134 | } 135 | .group{ 136 | width: 61px; 137 | height: 61px; 138 | border: 8px #232832 solid; 139 | background-color: #094e1c; 140 | font-family: "Font Awesome 5 Free", sans-serif; 141 | font-size: 26px; 142 | color: white; 143 | text-align: center; 144 | line-height: 60px; 145 | } 146 | .group:first-child { 147 | color: #008001!important; 148 | background-color: #6acf66; 149 | } 150 | .group:last-child { 151 | color: #F00F18!important; 152 | background-color: #6acf66; 153 | } 154 | .group.breathing{ 155 | animation: 0.5s infinite alternate ease-in-out breathing-bg; 156 | } 157 | @keyframes breathing-bg { 158 | from{background-color: #094e1c;} 159 | to{background-color: #6acf66;} 160 | } 161 | .groups.transparent .group{ 162 | color: transparent; 163 | } 164 | .proper{ 165 | border-image: linear-gradient(45deg, #ecc800, #564800) 1; 166 | } 167 | .good{ 168 | background-color: #3cec54; 169 | } 170 | .bad{ 171 | background-color: #F00F18; 172 | } 173 | 174 | .hidden { 175 | display: none; 176 | } 177 | .restart{ 178 | text-align: center; 179 | } 180 | .btn_again { 181 | padding: 6px 15px; 182 | font-weight: bold; 183 | } 184 | .credits{ 185 | text-align: center; 186 | color: gray; 187 | margin-top: 40px; 188 | } 189 | .credits a{ 190 | color: #ccc; 191 | } 192 | .credits b{ 193 | color: white; 194 | } 195 | .credits .fas{ 196 | color: red; 197 | } 198 | .credits .donate{ 199 | margin: 20px 0; 200 | } 201 | .credits .coin{ 202 | font-weight: bold; 203 | color: white; 204 | } 205 | .credits .wallet{ 206 | font-family: monospace; 207 | font-size: 20px; 208 | } 209 | -------------------------------------------------------------------------------- /nopixel_minigame/vaultcodes/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | NoPixel Vault Codes Minigame 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 20 | 21 | 22 |
23 | STREAK: 0 MAX STREAK: 0 24 |
TIME: 0.000 BEST TIME: 0.000 25 |
26 |
27 |
28 | 29 | 30 |
7s
31 |
32 |
33 | 34 | 35 |
12
36 |
37 |
38 |
39 |
Input password as shown
40 | 41 | 50 |
51 |
52 |
53 | Whisper me on Twitch @Sh4rkill3r or Discord sharkiller
54 | 63 | See also:
64 | NoPixel 4.0 Minigames

65 | Lockpicks Minigame
66 | Hacking Device Minigame
67 | Fleeca Minigame
68 | Thermite Minigame
69 | Vault Minigame
70 | Lower Vault Minigame
71 | >Vault Codes Minigame<
72 | VAR Simulation Minigame
73 | Casino Generators Minigame
74 | Casino Computer Minigame
75 | Power Plant Minigame
76 | Untangle Minigame
77 | Yacht Helper

78 |
NoPixel Minigames by Sharkiller is licensed under CC BY-NC-ND 4.0CCBYNCND
79 |
80 | 81 | -------------------------------------------------------------------------------- /nopixel_minigame/casino_computer/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | NoPixel Casino Computer Minigame 6 | 7 | 8 | 9 | 10 | 11 | 12 | 19 | 20 | 26 | 27 | 28 |

NoPixel Casino Computer Minigame

29 |

30 | Play the NoPixel Casino Computer Minigame and find the correct pattern. 31 |

32 | How to play: Connect blinking spots to bottom right doing the correct moves.
33 | Note: The game could have multiple solutions. One solution is shown if failed. 34 |

35 |
36 | STREAK: 0 MAX STREAK: 0 37 |
TIME: 0.000 BEST TIME: 0.000 38 |
39 |
40 |
41 | 42 | 43 |
10s
44 |
45 |
46 |
47 |
Network Access Blocked... Override Required
48 | 49 |
50 |
51 |
52 | Whisper me on Twitch @Sh4rkill3r or Discord sharkiller
53 | 62 | See also:
63 | NoPixel 4.0 Minigames

64 | Lockpicks Minigame
65 | Hacking Device Minigame
66 | Fleeca Minigame
67 | Thermite Minigame
68 | Vault Minigame
69 | Lower Vault Minigame
70 | Vault Codes Minigame
71 | VAR Simulation Minigame
72 | Casino Generators Minigame
73 | >Casino Computer Minigame<
74 | Power Plant Minigame
75 | Untangle Minigame
76 | Yacht Helper

77 |
NoPixel Minigames by Sharkiller is licensed under CC BY-NC-ND 4.0CCBYNCND
78 |
79 | 80 | -------------------------------------------------------------------------------- /nopixel_minigame/casino_generators/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | NoPixel Casino Generators Minigame 6 | 7 | 8 | 9 | 10 | 11 | 12 | 19 | 20 | 26 | 27 | 28 |

NoPixel Casino Generators Minigame

29 |

30 | Play the NoPixel Casino Generators Minigame and find the correct pattern. 31 |

32 | How to play: Connect blinking spots to bottom right doing the correct jumps.
33 | Note: The game could have multiple solutions. One solution is shown if failed. 34 |

35 |
36 | STREAK: 0 MAX STREAK: 0 37 |
TIME: 0.000 BEST TIME: 0.000 38 |
39 |
40 |
41 | 42 | 43 |
10s
44 |
45 |
46 |
47 |
Network Access Blocked... Override Required
48 | 49 |
50 |
51 |
52 | Whisper me on Twitch @Sh4rkill3r or Discord sharkiller
53 | 62 | See also:
63 | NoPixel 4.0 Minigames

64 | Lockpicks Minigame
65 | Hacking Device Minigame
66 | Fleeca Minigame
67 | Thermite Minigame
68 | Vault Minigame
69 | Lower Vault Minigame
70 | Vault Codes Minigame
71 | VAR Simulation Minigame
72 | >Casino Generators Minigame<
73 | Casino Computer Minigame
74 | Power Plant Minigame
75 | Untangle Minigame
76 | Yacht Helper

77 |
NoPixel Minigames by Sharkiller is licensed under CC BY-NC-ND 4.0CCBYNCND
78 |
79 | 80 | -------------------------------------------------------------------------------- /nopixel_minigame/var_simulation/minigame.js: -------------------------------------------------------------------------------- 1 | const random = (min, max) => { 2 | return Math.floor(Math.random() * (max - min)) + min; 3 | } 4 | const range = (start, end, length = end - start + 1) => { 5 | return Array.from({ length }, (_, i) => start + i) 6 | } 7 | const shuffle = (arr) => { 8 | for (let i = arr.length - 1; i > 0; i--) { 9 | const j = Math.floor(Math.random() * (i + 1)); 10 | const temp = arr[i]; 11 | arr[i] = arr[j]; 12 | arr[j] = temp; 13 | } 14 | } 15 | let sleep = (ms, fn) => {return setTimeout(fn, ms)}; 16 | 17 | let timer_game, order, speed; 18 | let numbers = 10; 19 | let streak = 0; 20 | let max_streak = 0; 21 | let game_started = false; 22 | let game_playing = false; 23 | 24 | // Options 25 | document.querySelector('#numbers').addEventListener('input', function(ev){ 26 | document.querySelector('.numbers_value').innerHTML = ev.target.value; 27 | numbers = ev.target.value; 28 | streak = 0; 29 | reset(); 30 | }); 31 | document.querySelector('#speed').addEventListener('input', function(ev){ 32 | document.querySelector('.speed_value').innerHTML = ev.target.value + 's'; 33 | }); 34 | 35 | // Resets 36 | document.querySelector('.splash .btn_again').addEventListener('click', function() { 37 | streak = 0; 38 | reset(); 39 | }); 40 | 41 | const getCookieValue = (name) => ( 42 | document.cookie.match('(^|;)\\s*' + name + '\\s*=\\s*([^;]+)')?.pop() || '' 43 | ) 44 | let getMaxStreakFromCookie = (n) => { 45 | let str = getCookieValue('max-'+n+'streak'); 46 | if(str !== '') 47 | return parseInt(str, 10); 48 | else 49 | return 0; 50 | } 51 | 52 | let validate = (ev) => { 53 | if(game_playing === false) return; 54 | 55 | if(parseInt(ev.target.dataset.number, 10) === order){ 56 | ev.target.classList.add('good'); 57 | order++; 58 | if(order > numbers){ 59 | game_started = false; 60 | game_playing = false; 61 | streak++; 62 | if(streak > max_streak){ 63 | max_streak = streak; 64 | document.cookie = "max-"+numbers+"streak="+max_streak; 65 | } 66 | reset(); 67 | } 68 | }else{ 69 | game_started = false; 70 | game_playing = false; 71 | streak = 0; 72 | 73 | ev.target.classList.add('bad'); 74 | document.querySelector('.groups').classList.remove('playing'); 75 | 76 | let btn = document.createElement('button'); 77 | btn.classList.add('btn_again'); 78 | btn.innerHTML = 'PLAY AGAIN'; 79 | btn.addEventListener('click', reset); 80 | document.querySelector('.groups').append(btn); 81 | } 82 | } 83 | 84 | let reset = () => { 85 | clearTimeout(timer_game); 86 | 87 | max_streak = getMaxStreakFromCookie(numbers); 88 | 89 | document.querySelector('.streaks .streak').innerHTML = streak; 90 | document.querySelector('.streaks .max_streak').innerHTML = max_streak; 91 | 92 | document.querySelector('.splash').classList.add('hidden'); 93 | document.querySelector('.groups').classList.remove('hidden','playing'); 94 | document.querySelector('.groups').innerHTML = ''; 95 | 96 | start(); 97 | } 98 | 99 | let newPos = (element) => { 100 | let top = element.offsetTop; 101 | let left = element.offsetLeft; 102 | let new_top = random(10,755); 103 | let new_left = random(10,1420); 104 | let diff_top = new_top - top; 105 | let diff_left = new_left - left; 106 | let duration = random(10,40)*100; 107 | 108 | new mojs.Html({ 109 | el: '#'+element.id, 110 | x: { 111 | 0:diff_left, 112 | duration: duration, 113 | easing: 'linear.none' 114 | }, 115 | y: { 116 | 0:diff_top, 117 | duration: duration, 118 | easing: 'linear.none' 119 | }, 120 | duration: duration+50, 121 | onComplete() { 122 | if(element.offsetTop === 0 && element.offsetLeft === 0) { 123 | this.pause(); 124 | return; 125 | } 126 | element.style = 'top: '+new_top+'px; left: '+new_left+'px; transform: none;'; 127 | newPos(element); 128 | }, 129 | onUpdate() { 130 | if(game_started === false) this.pause(); 131 | } 132 | }).play(); 133 | } 134 | 135 | let start = () => { 136 | order = 1; 137 | game_started = true; 138 | game_playing = false; 139 | 140 | numbers = document.querySelector('#numbers').value; 141 | let nums = range(1, numbers); 142 | shuffle(nums); 143 | nums.forEach(function(num){ 144 | let group = document.createElement('div'); 145 | group.id = 'pos'+num; 146 | group.classList.add('group','bg'+random(1,9)); 147 | group.dataset.number = num.toString(); 148 | group.style.top = random(10,755)+'px'; 149 | group.style.left = random(10,1420)+'px'; 150 | group.innerHTML = num.toString(); 151 | group.addEventListener('pointerdown', validate); 152 | document.querySelector('.groups').append(group); 153 | }); 154 | document.querySelectorAll('.group').forEach(el => { newPos(el) }); 155 | 156 | speed = document.querySelector('#speed').value; 157 | timer_game = sleep(speed * 1000, function(){ 158 | document.querySelector('.groups').classList.add('playing'); 159 | game_playing = true; 160 | }); 161 | } 162 | -------------------------------------------------------------------------------- /nopixel_minigame/4.0/roof_running/minigame.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Font Awesome Free 5.15.2 by @fontawesome - https://fontawesome.com 3 | * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) 4 | */ 5 | @font-face { 6 | font-family: "Font Awesome 5 Free"; 7 | font-style: normal; 8 | font-weight: 900; 9 | font-display: block; 10 | src: url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.eot); 11 | src: url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.eot?#iefix) format("embedded-opentype"), 12 | url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.woff2) format("woff2"), 13 | url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.woff) format("woff"), 14 | url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.ttf) format("truetype"), 15 | url(https://use.fontawesome.com/releases/v5.15.2/webfonts/fa-solid-900.svg#fontawesome) format("svg") 16 | } 17 | 18 | .fa, .fas { 19 | font-family: "Font Awesome 5 Free", sans-serif; 20 | font-weight: 900 21 | } 22 | 23 | /*! 24 | * Game 25 | */ 26 | 27 | body{ 28 | background-color: #15181d; 29 | font-family: sans-serif; 30 | } 31 | 32 | .title{ 33 | text-align: center; 34 | color: white; 35 | } 36 | .description{ 37 | text-align: center; 38 | color: gray; 39 | } 40 | .description sub{ 41 | font-style: italic; 42 | } 43 | 44 | .streaks { 45 | display: block; 46 | margin: 40px auto; 47 | text-align: center; 48 | font-size: 30px; 49 | font-weight: bold; 50 | text-transform: uppercase; 51 | color: white; 52 | width: -moz-fit-content; 53 | width: fit-content; 54 | background-color: #028000; 55 | padding: 12px; 56 | border-radius: 18px; 57 | } 58 | .best_time, 59 | .time { 60 | display: inline-block; 61 | width: 100px; 62 | } 63 | .streaks .fa { 64 | padding: 0 10px; 65 | } 66 | .options{ 67 | font-weight: bold; 68 | text-align: center; 69 | margin: 0 auto 10px; 70 | } 71 | .option{ 72 | display: inline-block; 73 | color: white; 74 | font-weight: bold; 75 | text-align: center; 76 | width: -moz-fit-content; 77 | width: fit-content; 78 | height: 20px; 79 | background-color: #20282e; 80 | padding: 10px 20px; 81 | margin: 0 auto 10px; 82 | border-radius: 6px; 83 | } 84 | .option.grid input, 85 | .option.speed input{ 86 | vertical-align: text-top; 87 | } 88 | .speed_value{ 89 | display: inline-block; 90 | width: 18px; 91 | text-align: right; 92 | } 93 | .grid_value{ 94 | display: inline-block; 95 | width: 40px; 96 | text-align: center; 97 | } 98 | .minigame{ 99 | margin: 0 auto 20px; 100 | width: 540px; 101 | min-width: 540px; 102 | max-width: 540px; 103 | height: 540px; 104 | min-height: 540px; 105 | max-height: 540px; 106 | background-color: #232832; 107 | } 108 | .splash{ 109 | display: inline-block; 110 | width: 100%; 111 | margin: 220px auto; 112 | text-align: center; 113 | color: white; 114 | font-size: 16px; 115 | } 116 | .splash .hacker{ 117 | font-size: 65px; 118 | margin-bottom: 30px; 119 | } 120 | .groups{ 121 | display: flex; 122 | flex-wrap: wrap; 123 | justify-content: space-evenly; 124 | user-select: none; 125 | } 126 | .group{ 127 | width: 69px; 128 | height: 69px; 129 | margin: 2px; 130 | /*background-color: #094e1c;*/ 131 | font-family: "Font Awesome 5 Free", sans-serif; 132 | font-size: 26px; 133 | color: white; 134 | text-align: center; 135 | line-height: 60px; 136 | } 137 | .group5{ 138 | width: 100px; 139 | height: 100px; 140 | } 141 | .group6{ 142 | width: 82px; 143 | height: 82px; 144 | } 145 | .group7{ 146 | width: 69px; 147 | height: 69px; 148 | } 149 | .group8{ 150 | width: 59px; 151 | height: 59px; 152 | } 153 | .group9{ 154 | width: 52px; 155 | height: 52px; 156 | } 157 | .group10{ 158 | width: 46px; 159 | height: 46px; 160 | } 161 | .group.green{ 162 | background: linear-gradient(180deg, #91bc57 0%, #6b8d40 100%); 163 | border: 2px #85a957 solid; 164 | } 165 | .group.red{ 166 | background: linear-gradient(180deg, #f60206 0%, #943a3a 100%); 167 | border: 2px #b55e5e solid; 168 | } 169 | .group.blue{ 170 | background: linear-gradient(180deg, #5092b7 0%, #427694 100%); 171 | border: 2px #5092b7 solid; 172 | } 173 | .group.removed{ 174 | background: transparent; 175 | border: 2px transparent solid; 176 | } 177 | .group.breathing{ 178 | animation: 0.5s infinite alternate ease-in-out breathing-bg; 179 | } 180 | @keyframes breathing-bg { 181 | from{background-color: #094e1c;} 182 | to{background-color: #6acf66;} 183 | } 184 | .groups.transparent .group{ 185 | color: transparent; 186 | } 187 | .proper{ 188 | border-image: linear-gradient(45deg, #ecc800, #564800) 1; 189 | } 190 | .good{ 191 | background-color: #3cec54; 192 | } 193 | .bad{ 194 | background-color: #F00F18; 195 | } 196 | 197 | .hidden { 198 | display: none; 199 | } 200 | .restart{ 201 | text-align: center; 202 | } 203 | .btn_again { 204 | padding: 6px 15px; 205 | font-weight: bold; 206 | } 207 | .credits{ 208 | text-align: center; 209 | color: gray; 210 | margin-top: 40px; 211 | } 212 | .credits a{ 213 | color: #ccc; 214 | } 215 | .credits b{ 216 | color: white; 217 | } 218 | .credits .fas{ 219 | color: red; 220 | } 221 | .credits .donate{ 222 | margin: 20px 0; 223 | } -------------------------------------------------------------------------------- /nopixel_minigame/thermite/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | NoPixel Thermite Minigame 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 20 | 21 | 27 | 28 | 29 |

NoPixel Thermite Minigame

30 |

31 | Play the NoPixel Thermite Minigame to test your memory. 32 |

33 | How to play: Remember the light square positions to replicate it later when they hide. 34 |

35 |
36 | STREAK: 0 MAX STREAK: 0 37 |
TIME: 0.000 BEST TIME: 0.000 38 |
39 |
40 |
41 | 42 | 43 |
6s
44 |
45 |
46 | 47 | 48 |
7x7
49 |
50 |
51 |
52 |
Remote Sequencing Required
53 | 54 |
55 |
56 |
57 | Whisper me on Twitch @Sh4rkill3r or Discord sharkiller
58 | 67 | See also:
68 | NoPixel 4.0 Minigames

69 | Lockpicks Minigame
70 | Hacking Device Minigame
71 | Fleeca Minigame
72 | >Thermite Minigame<
73 | Vault Minigame
74 | Lower Vault Minigame
75 | Vault Codes Minigame
76 | VAR Simulation Minigame
77 | Casino Generators Minigame
78 | Casino Computer Minigame
79 | Power Plant Minigame
80 | Untangle Minigame
81 | Yacht Helper

82 |
NoPixel Minigames by Sharkiller is licensed under CC BY-NC-ND 4.0CCBYNCND
83 |
84 | 85 | -------------------------------------------------------------------------------- /nopixel_minigame/var_simulation/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | NoPixel VAR Simulation Minigame 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 20 | 21 | 27 | 28 | 29 | 30 |

NoPixel VAR Simulation Minigame

31 |

32 | Play the NoPixel VAR Simulation Minigame to test your memory and get the maximum streak. 33 |

34 | How to play: Click the squares in the numerical order after the numbers hide. 35 |

36 | Help on 10: Mouse on 1, remember numbers 2, 3, 4 and 5, and remember the colors of 6 7 8 and 9, 37 |
or the combination of numbers/colors quantity you are better at. 38 |

39 |
STREAK: 0 | MAX STREAK: 0
40 |
41 |
42 | 43 | 44 |
10
45 |
46 |
47 | 48 | 49 |
10s
50 |
51 |
52 |
53 |
54 |
55 | Finger Print Not Recognized 56 | Proof of Training Required 57 | 58 |
59 | 60 |
61 |
62 | Whisper me on Twitch @Sh4rkill3r or Discord sharkiller
63 | 72 | See also:
73 | NoPixel 4.0 Minigames

74 | Lockpicks Minigame
75 | Hacking Device Minigame
76 | Fleeca Minigame
77 | Thermite Minigame
78 | Vault Minigame
79 | Lower Vault Minigame
80 | Vault Codes Minigame
81 | >VAR Simulation Minigame<
82 | Casino Generators Minigame
83 | Casino Computer Minigame
84 | Power Plant Minigame
85 | Untangle Minigame
86 | Yacht Helper

87 |
NoPixel Minigames by Sharkiller is licensed under CC BY-NC-ND 4.0CCBYNCND
88 |
89 | 90 | -------------------------------------------------------------------------------- /nopixel_minigame/untangle/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | NoPixel Untangle Minigame 6 | 7 | 8 | 9 | 10 | 11 | 12 | 19 | 20 | 26 | 27 | 28 |

NoPixel Untangle Minigame

29 |

30 | Play the NoPixel Untangle Minigame and find the correct pattern. 31 |

32 | How to play: Untangle the lines by moving the dots around until no lines intersect.
33 |

34 |
35 | STREAK: 0 MAX STREAK: 0 36 |
TIME: 0.000 BEST TIME: 0.000 37 |
38 |
39 |
40 | 41 | 42 |
10s
43 |
44 |
45 | 46 | 47 |
7
48 |
49 |
50 |
51 |
52 | 54 |
55 |
56 |
57 |
Firewall active... Decryption required...
58 | 59 |
60 |
61 |
62 | Whisper me on Twitch @Sh4rkill3r or Discord sharkiller
63 | 72 | See also:
73 | NoPixel 4.0 Minigames

74 | Lockpicks Minigame
75 | Hacking Device Minigame
76 | Fleeca Minigame
77 | Thermite Minigame
78 | Vault Minigame
79 | Lower Vault Minigame
80 | Vault Codes Minigame
81 | VAR Simulation Minigame
82 | Casino Generators Minigame
83 | Casino Computer Minigame
84 | Power Plant Minigame
85 | >Untangle Minigame<
86 | Yacht Helper

87 |
NoPixel Minigames by Sharkiller is licensed under CC BY-NC-ND 4.0CCBYNCND
88 |
89 | 90 | -------------------------------------------------------------------------------- /nopixel_minigame/powerplant_generators/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | NoPixel Power Plant Minigame 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 20 | 21 | 27 | 28 | 29 | 30 |

NoPixel Power Plant Minigame

31 |

32 | Play the NoPixel Power Plant Minigame to test your typing speed and accuracy. 33 |

34 | How to play: Press the correct key when is touching the green bar. 35 |

36 |
37 | STREAK: 0 MAX STREAK: 0 38 |
TIME: 0.000 BEST TIME: 0.000 39 |
40 |
41 |
42 | 43 |
44 |
45 | 46 |
47 |
48 | 49 |
50 |
51 |
52 |
Pattern recognition required...
53 | 57 |
58 |
59 |
60 | Whisper me on Twitch @Sh4rkill3r or Discord sharkiller
61 | 70 | See also:
71 | NoPixel 4.0 Minigames

72 | Lockpicks Minigame
73 | Hacking Device Minigame
74 | Fleeca Minigame
75 | Thermite Minigame
76 | Vault Minigame
77 | Lower Vault Minigame
78 | Vault Codes Minigame
79 | VAR Simulation Minigame
80 | Casino Generators Minigame
81 | Casino Computer Minigame
82 | >Power Plant Minigame<
83 | Untangle Minigame
84 | Yacht Helper

85 |
NoPixel Minigames by Sharkiller is licensed under CC BY-NC-ND 4.0CCBYNCND
86 |
87 | 88 | -------------------------------------------------------------------------------- /nopixel_minigame/vaultcodes/minigame.js: -------------------------------------------------------------------------------- 1 | let timer_start, timer_game, timer_finish, timer_time, answer, wrong, right, speed, numbers, timerStart, positions; 2 | let game_started = false; 3 | let streak = 0; 4 | let max_streak = 0; 5 | let best_time = 99.999; 6 | 7 | // Get max streak from cookie 8 | const regex = /max-streak_vaultcodes=([\d]+)/g; 9 | let cookie = document.cookie; 10 | if((cookie = regex.exec(cookie)) !== null){ 11 | max_streak = cookie[1]; 12 | } 13 | // Get max streak from cookie 14 | const regex_time = /best-time_vaultcodes=([\d.]+)/g; 15 | cookie = document.cookie; 16 | if((cookie = regex_time.exec(cookie)) !== null){ 17 | best_time = parseFloat(cookie[1]); 18 | } 19 | 20 | const sleep = (ms, fn) => {return setTimeout(fn, ms)}; 21 | 22 | const rangeNumbers = (length = 1) => { 23 | return Array.from({length}, _ => Math.floor(Math.random() * 10)) 24 | } 25 | 26 | // Options 27 | document.querySelector('#speed').addEventListener('input', function(ev){ 28 | document.querySelector('.speed_value').innerHTML = ev.target.value + 's'; 29 | }); 30 | document.querySelector('#numbers').addEventListener('input', function(ev){ 31 | document.querySelector('.numbers_value').innerHTML = ev.target.value; 32 | }); 33 | 34 | // Resets 35 | document.querySelector('.btn_again').addEventListener('click', function(){ 36 | streak = 0; 37 | reset(); 38 | }); 39 | 40 | document.querySelector('.minigame .numbers').addEventListener('keydown', function(e) { 41 | if (e.ctrlKey === true && e.key === 'c'){ 42 | alert('Low tier cheater WeirdChamp'); 43 | e.preventDefault(); 44 | return false; 45 | } 46 | }); 47 | document.querySelector('#answer').addEventListener('keydown', function(e) { 48 | if (e.ctrlKey === true && e.key === 'v'){ 49 | alert('Low tier cheater WeirdChamp'); 50 | e.preventDefault(); 51 | return false; 52 | } 53 | if (e.key === 'Enter' && document.querySelector('.solution').offsetHeight === 0) { 54 | clearTimeout(timer_finish); 55 | check(); 56 | } 57 | }); 58 | document.querySelector('#answer').addEventListener('drop', function(e) { 59 | alert('Low tier cheater WeirdChamp'); 60 | e.preventDefault(); 61 | return false; 62 | }); 63 | 64 | function check(){ 65 | stopTimer(); 66 | 67 | let response = document.querySelector('#answer').value.toLowerCase().trim(); 68 | 69 | if(game_started && response === answer.join('')){ 70 | streak++; 71 | if(streak > max_streak){ 72 | max_streak = streak; 73 | document.cookie = "max-streak_vaultcodes="+max_streak; 74 | } 75 | let time = document.querySelector('.streaks .time').innerHTML; 76 | if(parseFloat(time) < best_time){ 77 | best_time = parseFloat(time); 78 | document.cookie = "best-time_vaultcodes="+best_time; 79 | } 80 | let leaderboard = new XMLHttpRequest(); 81 | leaderboard.open("HEAD", 'streak.php?streak='+streak+'&max_streak='+max_streak 82 | +'&speed='+speed+'&numbers='+numbers+'&time='+time); 83 | leaderboard.send(); 84 | reset(); 85 | }else{ 86 | answer.forEach( (number, pos) => { 87 | let span = document.createElement('span'); 88 | span.innerText = number; 89 | if( response.length > pos ){ 90 | if( response[pos] === number.toString() ){ 91 | span.classList.add('good'); 92 | }else{ 93 | span.classList.add('bad'); 94 | } 95 | }else{ 96 | span.classList.add('bad'); 97 | } 98 | document.querySelector('.solution').append(span); 99 | }); 100 | } 101 | } 102 | 103 | function reset(){ 104 | game_started = false; 105 | 106 | resetTimer(); 107 | clearTimeout(timer_start); 108 | clearTimeout(timer_game); 109 | clearTimeout(timer_finish); 110 | 111 | document.querySelector('.splash').classList.remove('hidden'); 112 | document.querySelector('.minigame .numbers').classList.add('hidden'); 113 | document.querySelector('.minigame .input').classList.add('hidden'); 114 | 115 | document.querySelector('#answer').value = ''; 116 | document.querySelector('.solution').innerHTML = ''; 117 | 118 | start(); 119 | } 120 | 121 | function start(){ 122 | document.querySelector('.streak').innerHTML = streak; 123 | document.querySelector('.max_streak').innerHTML = max_streak; 124 | document.querySelector('.best_time').innerHTML = best_time; 125 | 126 | numbers = document.querySelector('#numbers').value; 127 | answer = rangeNumbers(numbers); 128 | document.querySelector('.minigame .numbers').innerHTML = answer.join(''); 129 | 130 | timer_start = sleep(2000, function(){ 131 | document.querySelector('.splash').classList.add('hidden'); 132 | document.querySelector('.minigame .numbers').classList.remove('hidden'); 133 | 134 | timer_game = sleep(3000, function(){ 135 | document.querySelector('.minigame .numbers').classList.add('hidden'); 136 | document.querySelector('.minigame .input').classList.remove('hidden'); 137 | 138 | game_started = true; 139 | startTimer(); 140 | 141 | document.querySelector('#answer').focus({preventScroll: true}); 142 | 143 | speed = document.querySelector('#speed').value; 144 | timer_finish = sleep((speed * 1000), function(){ 145 | game_started = false; 146 | streak = 0; 147 | check(); 148 | }); 149 | }); 150 | }); 151 | } 152 | 153 | function startTimer(){ 154 | timerStart = new Date(); 155 | timer_time = setInterval(timer,1); 156 | } 157 | function timer(){ 158 | let timerNow = new Date(); 159 | let timerDiff = new Date(); 160 | timerDiff.setTime(timerNow - timerStart); 161 | let ms = timerDiff.getMilliseconds(); 162 | let sec = timerDiff.getSeconds(); 163 | if (ms < 10) {ms = "00"+ms;}else if (ms < 100) {ms = "0"+ms;} 164 | document.querySelector('.streaks .time').innerHTML = sec+"."+ms; 165 | } 166 | function stopTimer(){ 167 | clearInterval(timer_time); 168 | } 169 | function resetTimer(){ 170 | clearInterval(timer_time); 171 | document.querySelector('.streaks .time').innerHTML = '0.000'; 172 | } 173 | 174 | start(); -------------------------------------------------------------------------------- /nopixel_minigame/thermite/minigame.js: -------------------------------------------------------------------------------- 1 | let timer_start, timer_game, timer_finish, timer_time, good_positions, wrong, right, speed, timerStart, positions; 2 | let game_started = false; 3 | let streak = 0; 4 | let max_streak = 0; 5 | let best_time = 99.999; 6 | 7 | let mode = 7; 8 | let mode_data = {}; 9 | mode_data[5] = [10, '92px']; 10 | mode_data[6] = [14, '74px']; 11 | mode_data[7] = [18, '61px']; 12 | mode_data[8] = [20, '51px']; 13 | mode_data[9] = [24, '44px']; 14 | mode_data[10] = [28, '38px']; 15 | 16 | // Get max streak from cookie 17 | const regex = /max-streak_thermite=([\d]+)/g; 18 | let cookie = document.cookie; 19 | if((cookie = regex.exec(cookie)) !== null){ 20 | max_streak = cookie[1]; 21 | } 22 | // Get max streak from cookie 23 | const regex_time = /best-time_thermite=([\d.]+)/g; 24 | cookie = document.cookie; 25 | if((cookie = regex_time.exec(cookie)) !== null){ 26 | best_time = parseFloat(cookie[1]); 27 | } 28 | 29 | const sleep = (ms, fn) => {return setTimeout(fn, ms)}; 30 | 31 | const range = (start, end, length = end - start + 1) => { 32 | return Array.from({length}, (_, i) => start + i) 33 | } 34 | 35 | const shuffle = (arr) => { 36 | for (let i = arr.length - 1; i > 0; i--) { 37 | const j = Math.floor(Math.random() * (i + 1)); 38 | const temp = arr[i]; 39 | arr[i] = arr[j]; 40 | arr[j] = temp; 41 | } 42 | } 43 | 44 | // Options 45 | document.querySelector('#speed').addEventListener('input', function(ev){ 46 | document.querySelector('.speed_value').innerHTML = ev.target.value + 's'; 47 | streak = 0; 48 | reset(); 49 | }); 50 | document.querySelector('#grid').addEventListener('input', function(ev){ 51 | document.querySelector('.grid_value').innerHTML = ev.target.value + 'x' + ev.target.value; 52 | mode = ev.target.value; 53 | streak = 0; 54 | reset(); 55 | }); 56 | 57 | // Resets 58 | document.querySelector('.btn_again').addEventListener('click', function(){ 59 | streak = 0; 60 | reset(); 61 | }); 62 | 63 | function listener(ev){ 64 | if(!game_started) return; 65 | 66 | if( good_positions.indexOf( parseInt(ev.target.dataset.position) ) === -1 ){ 67 | wrong++; 68 | ev.target.classList.add('bad'); 69 | }else{ 70 | right++; 71 | ev.target.classList.add('good'); 72 | } 73 | 74 | ev.target.removeEventListener('mousedown', listener); 75 | 76 | check(); 77 | } 78 | 79 | function addListeners(){ 80 | document.querySelectorAll('.group').forEach(el => { 81 | el.addEventListener('mousedown', listener); 82 | }); 83 | } 84 | 85 | function check(){ 86 | if(wrong === 3){ 87 | resetTimer(); 88 | game_started = false; 89 | streak = 0; 90 | 91 | let blocks = document.querySelectorAll('.group'); 92 | good_positions.forEach( pos => { 93 | blocks[pos].classList.add('proper'); 94 | }); 95 | return; 96 | } 97 | if(right === mode_data[mode][0]){ 98 | stopTimer(); 99 | streak++; 100 | if(streak > max_streak){ 101 | max_streak = streak; 102 | document.cookie = "max-streak_thermite="+max_streak; 103 | } 104 | let time = document.querySelector('.streaks .time').innerHTML; 105 | if(parseFloat(time) < best_time){ 106 | best_time = parseFloat(time); 107 | document.cookie = "best-time_thermite="+best_time; 108 | } 109 | let leaderboard = new XMLHttpRequest(); 110 | leaderboard.open("HEAD", 'streak.php?streak='+streak+'&max_streak='+max_streak 111 | +'&speed='+speed+'&mode='+mode+'&time='+time); 112 | leaderboard.send(); 113 | reset(); 114 | } 115 | } 116 | 117 | function reset(){ 118 | game_started = false; 119 | 120 | resetTimer(); 121 | clearTimeout(timer_start); 122 | clearTimeout(timer_game); 123 | clearTimeout(timer_finish); 124 | 125 | document.querySelector('.splash').classList.remove('hidden'); 126 | document.querySelector('.groups').classList.add('hidden'); 127 | 128 | document.querySelectorAll('.group').forEach(el => { el.remove(); }); 129 | 130 | start(); 131 | } 132 | 133 | function start(){ 134 | wrong = 0; 135 | right = 0; 136 | 137 | positions = range(0, Math.pow(mode, 2) - 1 ); 138 | shuffle(positions); 139 | good_positions = positions.slice(0, mode_data[mode][0]); 140 | 141 | let div = document.createElement('div'); 142 | div.classList.add('group'); 143 | div.style.width = mode_data[mode][1]; 144 | div.style.height = mode_data[mode][1]; 145 | const groups = document.querySelector('.groups'); 146 | for(let i=0; i < positions.length; i++){ 147 | let group = div.cloneNode(); 148 | group.dataset.position = i.toString(); 149 | groups.appendChild(group); 150 | } 151 | 152 | addListeners(); 153 | 154 | document.querySelector('.streak').innerHTML = streak; 155 | document.querySelector('.max_streak').innerHTML = max_streak; 156 | document.querySelector('.best_time').innerHTML = best_time; 157 | 158 | timer_start = sleep(2000, function(){ 159 | document.querySelector('.splash').classList.add('hidden'); 160 | document.querySelector('.groups').classList.remove('hidden'); 161 | 162 | let blocks = document.querySelectorAll('.group'); 163 | good_positions.forEach( pos => { 164 | blocks[pos].classList.add('good'); 165 | }); 166 | 167 | timer_game = sleep(4000, function(){ 168 | document.querySelectorAll('.group.good').forEach(el => { el.classList.remove('good')}); 169 | game_started = true; 170 | 171 | startTimer(); 172 | speed = document.querySelector('#speed').value; 173 | timer_finish = sleep((speed * 1000), function(){ 174 | game_started = false; 175 | wrong = 3; 176 | check(); 177 | }); 178 | }); 179 | }); 180 | } 181 | 182 | function startTimer(){ 183 | timerStart = new Date(); 184 | timer_time = setInterval(timer,1); 185 | } 186 | function timer(){ 187 | let timerNow = new Date(); 188 | let timerDiff = new Date(); 189 | timerDiff.setTime(timerNow - timerStart); 190 | let ms = timerDiff.getMilliseconds(); 191 | let sec = timerDiff.getSeconds(); 192 | if (ms < 10) {ms = "00"+ms;}else if (ms < 100) {ms = "0"+ms;} 193 | document.querySelector('.streaks .time').innerHTML = sec+"."+ms; 194 | } 195 | function stopTimer(){ 196 | clearInterval(timer_time); 197 | } 198 | function resetTimer(){ 199 | clearInterval(timer_time); 200 | document.querySelector('.streaks .time').innerHTML = '0.000'; 201 | } 202 | 203 | start(); -------------------------------------------------------------------------------- /nopixel_minigame/yacht/minigame.js: -------------------------------------------------------------------------------- 1 | let data; 2 | 3 | // Generate selectors 4 | let env = document.querySelector(".envelope .icon"); 5 | document.querySelectorAll('.envelope.add').forEach((el) => { 6 | el.prepend(env.cloneNode(true)); 7 | }); 8 | document.querySelectorAll('.position').forEach((el) => { 9 | el.append(env.cloneNode(true)); 10 | }); 11 | 12 | // Reset button 13 | document.querySelector('button[type="reset"]').addEventListener('click', function() { 14 | document.querySelector('.group input').focus({preventScroll: true}); 15 | }); 16 | 17 | // Move focus of screens minigame and validate 18 | document.querySelectorAll('.group input').forEach((el, index, elems) => { 19 | el.addEventListener("keyup", function(ev) { 20 | if(el.value !== ev.key){ 21 | el.value = ev.key; 22 | } 23 | let re = new RegExp('^'+el.pattern+'{1}$'); 24 | if(re.test(ev.key) === true){ 25 | if(index < 19){ 26 | elems[index+1].focus(); 27 | } 28 | resolvePuzzle(); 29 | }else{ 30 | el.value = ''; 31 | } 32 | }); 33 | }); 34 | 35 | let checkStart = index => { 36 | let order = [index+1]; 37 | let count = 0; 38 | while( data[index] !== 0 && count < 7){ 39 | count += 1; 40 | index += parseInt(data[index]); 41 | order.push(index+1); 42 | } 43 | return [count, order]; 44 | } 45 | let resolvePuzzle = () => { 46 | data = [0,0,0,0,0,0,0,0]; 47 | 48 | document.querySelectorAll('.group input').forEach((el) => { 49 | let change = 0; 50 | let re = new RegExp('^'+el.pattern+'{1}$'); 51 | if(re.test(el.value) === true){ 52 | switch(el.dataset.type){ 53 | case 'up': 54 | change-=(4*parseInt(el.value)); 55 | break; 56 | case 'down': 57 | change+=(4*parseInt(el.value)); 58 | break; 59 | case 'left': 60 | change-=parseInt(el.value); 61 | break; 62 | case 'right': 63 | change+=parseInt(el.value); 64 | break; 65 | } 66 | data[el.dataset.group-1] += change; 67 | }else{ 68 | document.querySelector('.solution_order').innerHTML = '?'; 69 | return false; 70 | } 71 | }); 72 | for(let i=0;i<=7;i++){ 73 | let result = checkStart(i); 74 | if( result[0] === 7 ){ 75 | document.querySelector('.solution_order').innerHTML = result[1].join('   '); 76 | return result[1]; 77 | }else if(i === 7){ 78 | document.querySelector('.solution_order').innerHTML = 'Wrong data'; 79 | } 80 | } 81 | return false; 82 | } 83 | 84 | // Select group steam 85 | document.querySelectorAll('.envelope.steam .icon').forEach((el, index, elems) => { 86 | el.addEventListener('change', (ev) => { 87 | let newIndex = ev.target.selectedIndex; 88 | for(let i=0; i<4; i++){ 89 | if(i !== index){ 90 | if(elems[i].selectedIndex !== newIndex) elems[i].selectedIndex = newIndex; 91 | } 92 | } 93 | }); 94 | }); 95 | 96 | // Select group phone 97 | document.querySelectorAll('.envelope.phone .icon').forEach((el, index, elems) => { 98 | el.addEventListener('change', (ev) => { 99 | elems[index===0?1:0].selectedIndex = ev.target.selectedIndex; 100 | }); 101 | }); 102 | 103 | // Generate order 104 | let validateAll = () => { 105 | document.querySelectorAll('.envelope .icon').forEach(el => { 106 | if(el.selectedIndex === 0) return false; 107 | }); 108 | document.querySelectorAll('.group .icon').forEach(el => { 109 | if(el.selectedIndex === 0) return false; 110 | }); 111 | document.querySelectorAll('.group input').forEach(el => { 112 | if(el.value === '') return false; 113 | }); 114 | let screens = resolvePuzzle(); 115 | if(screens === false) return false; 116 | 117 | return true; 118 | } 119 | let foundEnvelopes = (index) => { 120 | let envelopes = []; 121 | document.querySelectorAll('.envelope .icon').forEach((el, i)=> { 122 | if(el.selectedIndex === index){ 123 | envelopes.push(i); 124 | } 125 | }); 126 | if(envelopes.length === 0) return false; 127 | return envelopes; 128 | } 129 | let genOrder = () => { 130 | if( validateAll() === false ){ 131 | return false; 132 | } 133 | let validatedScreenInfo = resolvePuzzle(); 134 | document.querySelector('.minigames_verbose').innerHTML = ''; 135 | 136 | let orderIcons = []; 137 | console.log(validatedScreenInfo); 138 | // 8 1 5 3 4 2 7 6 139 | validatedScreenInfo.forEach((order, index) => { 140 | let sel = document.querySelectorAll('.group .icon')[order-1]; 141 | let div = document.createElement('div'); 142 | 143 | let envelopes = foundEnvelopes(sel.selectedIndex); 144 | let envStr = ''; 145 | if(envelopes !== false){ 146 | envelopes.forEach(envelope => { 147 | let group = document.querySelectorAll('.envelope')[envelope]; 148 | let select = group.querySelectorAll('select'); 149 | envStr += ''+select[1].value+' '; 150 | if(select[2]){ 151 | envStr += ''+select[2].value+' '; 152 | } 153 | }); 154 | }else{ 155 | envStr = 'Missing envelope'; 156 | } 157 | 158 | div.innerHTML = (index+1)+'º   |   '+order+'   |   '+ 159 | ''+sel.value+'   |   '+envStr; 160 | 161 | document.querySelector('.minigames_verbose').append(div); 162 | 163 | orderIcons.push(sel.value); 164 | }); 165 | 166 | document.querySelector('.minigames_order').innerHTML = ''+orderIcons.join('   ')+''; 167 | } 168 | document.querySelector('#generate_order').addEventListener('click', ev => { 169 | if( validateAll() === false ){ 170 | document.querySelector('.minigames_order').innerHTML = 'Incomplete data'; 171 | document.querySelector('.minigames_verbose').innerHTML = ''; 172 | return false; 173 | } 174 | genOrder(); 175 | }); 176 | /* 177 | // Prefill for test 178 | let test_selects = [5,5,5,5,10,10,8,9,11,1,6,15,10,5,6,1,15,9,8,11]; 179 | document.querySelectorAll('.icon').forEach((el, index, elems) => { 180 | el.selectedIndex = test_selects[index]; 181 | }); 182 | let test_inputs = [0,1,1,1,0,1,0,0,0,2,1,2,0,0,0,0,0,1,1,3]; 183 | document.querySelectorAll('input').forEach((el, index, elems) => { 184 | el.value = test_inputs[index].toString(); 185 | }); 186 | genOrder(); 187 | */ -------------------------------------------------------------------------------- /nopixel_minigame/powerplant_generators/minigame.js: -------------------------------------------------------------------------------- 1 | let timer_start, timer_game, timer_finish, timer_time, timer_hide, letters, difficulty, valid_keys, timerStart; 2 | let game_started = false; 3 | let streak = 0; 4 | let max_streak = 0; 5 | let best_time = 0; 6 | 7 | const sleep = (ms, fn) => {return setTimeout(fn, ms)}; 8 | 9 | const random = (min, max) => { 10 | return Math.floor(Math.random() * (max - min + 1)) + min; 11 | } 12 | 13 | let readCookie = () => { 14 | // Get max streak from cookie 15 | let regex = new RegExp("max-streak_powerplant_"+difficulty[3]+"=([\\d]+)",'g'); 16 | let cookie = document.cookie; 17 | if((cookie = regex.exec(cookie)) !== null){ 18 | max_streak = cookie[1]; 19 | }else{ 20 | max_streak = 0; 21 | } 22 | // Get max streak from cookie 23 | let regex_time = new RegExp("best-time_powerplant_"+difficulty[3]+"=([\\d.]+)",'g'); 24 | cookie = document.cookie; 25 | if((cookie = regex_time.exec(cookie)) !== null){ 26 | best_time = parseFloat(cookie[1]); 27 | }else{ 28 | best_time = 0; 29 | } 30 | } 31 | 32 | const getDifficulty = () => { 33 | let difficulty_selected = document.querySelector('input[name="difficulty"]:checked').value; 34 | 35 | switch(difficulty_selected){ 36 | case 'easy': 37 | return ["asd", 2000, 1000, 'easy']; 38 | case 'medium': 39 | return ["asdjkl", 1500, 750, 'medium']; 40 | case 'hard': 41 | return ["awsdgjikl", 1200, 500, 'hard']; 42 | } 43 | } 44 | 45 | // Difficulty changed 46 | document.querySelectorAll('input[name="difficulty"]').forEach((el) => { 47 | el.addEventListener('change', function(){ 48 | streak = 0; 49 | reset(); 50 | }); 51 | }); 52 | // Resets 53 | document.querySelector('.btn_again').addEventListener('click', function(){ 54 | streak = 0; 55 | reset(); 56 | }); 57 | 58 | document.addEventListener("keydown", function(ev) { 59 | let key_pressed = ev.key; 60 | if(game_started && valid_keys.includes(key_pressed) ){ 61 | let element = letters[0].el; 62 | let top = -590 * element.dataset.progress; 63 | if(top < -475 && top > -580 && key_pressed === element.textContent){// 64 | letters[0].el.classList.add('green'); 65 | streak++; 66 | if(streak > max_streak){ 67 | max_streak = streak; 68 | document.cookie = "max-streak_powerplant_"+difficulty[3]+"="+max_streak; 69 | } 70 | let time = document.querySelector('.streaks .time').innerHTML; 71 | if(parseFloat(time) > best_time){ 72 | best_time = parseFloat(time); 73 | document.cookie = "best-time_powerplant_"+difficulty[3]+"="+best_time; 74 | } 75 | }else{ 76 | streak = 0; 77 | resetTimer(); 78 | startTimer(); 79 | letters[0].el.classList.add('red'); 80 | } 81 | document.querySelector('.streak').innerHTML = streak; 82 | document.querySelector('.max_streak').innerHTML = max_streak; 83 | document.querySelector('.best_time').innerHTML = best_time; 84 | 85 | letters[0].stop(); 86 | 87 | new mojs.Html({ 88 | el: element, 89 | y: top, 90 | opacity: { 91 | 1:0, 92 | duration: 500, 93 | }, 94 | duration: 500, 95 | onComplete() { 96 | element.remove(); 97 | }, 98 | }).play(); 99 | letters.splice(0,1); 100 | } 101 | }); 102 | 103 | let createLetter = () => { 104 | let pos = random(1,4); 105 | let lettersElem = document.querySelector('.minigame .letters'); 106 | let div = document.createElement('div'); 107 | div.classList.add('letter', 'pos'+pos); 108 | div.innerHTML = difficulty[0].charAt(random(0, difficulty[0].length - 1)); 109 | lettersElem.append(div); 110 | let duration = difficulty[1]; 111 | let lettersCnt = letters.length; 112 | letters.push(new mojs.Html({ 113 | el: div, 114 | y: { 115 | 0:-590, 116 | duration: duration, 117 | easing: 'linear.none', 118 | onProgress (p) { 119 | div.dataset.progress = p; 120 | }, 121 | }, 122 | opacity: { 123 | 0:1, 124 | duration: 200, 125 | easing: 'linear.none' 126 | }, 127 | duration: duration, 128 | onComplete() { 129 | div.classList.add('red'); 130 | streak = 0; 131 | resetTimer(); 132 | startTimer(); 133 | letters.splice(0,1); 134 | }, 135 | onUpdate() { 136 | if(game_started === false) this.pause(); 137 | } 138 | })); 139 | letters[lettersCnt].then({ 140 | opacity: 0, 141 | duration: 500, 142 | onComplete() { 143 | div.remove(); 144 | }, 145 | }).play() 146 | } 147 | 148 | function reset(restart = true){ 149 | game_started = false; 150 | 151 | resetTimer(); 152 | clearTimeout(timer_start); 153 | clearTimeout(timer_game); 154 | clearTimeout(timer_finish); 155 | clearTimeout(timer_hide); 156 | 157 | if(restart){ 158 | document.querySelector('.minigame .hack').classList.add('hidden'); 159 | document.querySelector('.minigame .splash').classList.remove('hidden'); 160 | document.querySelector('.minigame .letters').innerHTML = ''; 161 | start(); 162 | } 163 | } 164 | 165 | function start(){ 166 | 167 | timer_start = sleep(1000, function(){ 168 | document.querySelector('.minigame .splash').classList.add('hidden'); 169 | document.querySelector('.minigame .hack').classList.remove('hidden'); 170 | 171 | difficulty = getDifficulty(); 172 | readCookie(); 173 | 174 | document.querySelector('.streak').innerHTML = streak; 175 | document.querySelector('.max_streak').innerHTML = max_streak; 176 | document.querySelector('.best_time').innerHTML = best_time; 177 | 178 | valid_keys = difficulty[0].split(''); 179 | letters = []; 180 | game_started = true; 181 | 182 | timer_game = setInterval(createLetter, difficulty[2]); 183 | 184 | startTimer(); 185 | 186 | }); 187 | } 188 | 189 | function startTimer(){ 190 | timerStart = new Date(); 191 | timer_time = setInterval(timer,1); 192 | } 193 | function timer(){ 194 | let timerNow = new Date(); 195 | let timerDiff = new Date(); 196 | timerDiff.setTime(timerNow - timerStart); 197 | let ms = timerDiff.getMilliseconds(); 198 | let sec = timerDiff.getSeconds(); 199 | if (ms < 10) {ms = "00"+ms;}else if (ms < 100) {ms = "0"+ms;} 200 | document.querySelector('.streaks .time').innerHTML = sec+"."+ms; 201 | } 202 | function stopTimer(){ 203 | clearInterval(timer_time); 204 | } 205 | function resetTimer(){ 206 | clearInterval(timer_time); 207 | document.querySelector('.streaks .time').innerHTML = '0.000'; 208 | } 209 | 210 | start(); -------------------------------------------------------------------------------- /nopixel_minigame/hackingdevice/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | NoPixel Hacking Device Minigame 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 20 | 21 | 27 | 28 | 29 |

NoPixel Hacking Device Minigame

30 |

31 | Play the NoPixel Security System Hacking Device Minigame to test your visual finder speed. 32 |

33 | How to play: Find the group of characters highlighted at the top on the character soup of the bottom. 34 |

35 |
36 | STREAK: 0 MAX STREAK: 0 37 |
TIME: 0.000 BEST TIME: 0.000 38 |
39 |
40 |
41 | 42 |
43 |
44 | 45 |
46 |
47 | 48 |
49 |
50 | 51 |
52 |
53 | 54 |
55 |
56 | 57 |
58 |
59 | 60 |
61 |
62 |
63 |
64 | 65 |
66 |
67 | 68 |
69 |
70 | 71 |
72 |
73 |
74 |
75 | 76 | 77 |
15s
78 |
79 |
80 | 81 |
82 |
83 |
84 |
PREPARING INTERFACE...
85 | 90 |
91 |
92 |
93 | Whisper me on Twitch @Sh4rkill3r or Discord sharkiller
94 | 103 | See also:
104 | NoPixel 4.0 Minigames

105 | Lockpicks Minigame
106 | >Hacking Device Minigame<
107 | Fleeca Minigame
108 | Thermite Minigame
109 | Vault Minigame
110 | Lower Vault Minigame
111 | Vault Codes Minigame
112 | VAR Simulation Minigame
113 | Casino Generators Minigame
114 | Casino Computer Minigame
115 | Power Plant Minigame
116 | Untangle Minigame
117 | Yacht Helper

118 |
NoPixel Minigames by Sharkiller is licensed under CC BY-NC-ND 4.0CCBYNCND
119 |
120 | 121 | -------------------------------------------------------------------------------- /nopixel_minigame/vault/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | NoPixel Vault Minigame 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 20 | 21 | 22 |
STREAK: 0 | MAX STREAK: 0
23 |
24 |
25 | 26 | 27 |
6s
28 |
29 |
30 | Mode: 31 | 32 | 33 |
34 |
35 | 36 |
37 |
38 |
39 |
40 | 42 |
43 |
44 | 46 |
47 |
48 | 50 |
51 |
52 |
53 |
54 |
55 | Vault Hacking Minigame 56 | 57 | 60 |
61 | 103 | 109 | 113 | 116 | 123 |
124 |
125 | Whisper me on Twitch @Sh4rkill3r or Discord sharkiller
126 | 135 | See also:
136 | NoPixel 4.0 Minigames

137 | Lockpicks Minigame
138 | Hacking Device Minigame
139 | Fleeca Minigame
140 | Thermite Minigame
141 | >Vault Minigame<
142 | Lower Vault Minigame
143 | Vault Codes Minigame
144 | VAR Simulation Minigame
145 | Casino Generators Minigame
146 | Casino Computer Minigame
147 | Power Plant Minigame
148 | Untangle Minigame
149 | Yacht Helper

150 |
NoPixel Minigames by Sharkiller is licensed under CC BY-NC-ND 4.0CCBYNCND
151 |
152 | 153 | -------------------------------------------------------------------------------- /nopixel_minigame/fleeca/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | NoPixel Fleeca Bank Minigame 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 20 | 21 | 27 | 28 | 29 |

NoPixel Fleeca Bank Minigame

30 |

31 | Play the NoPixel Fleeca Bank Minigame to test your speed and get the maximum streak. 32 |

33 | How to play: Remember the first numbers to reply the correct question later before time is out. 34 |

35 |
STREAK: 0 | MAX STREAK: 0
36 |
37 |
38 | 39 | 40 |
5s
41 |
42 |
43 | Mode: 44 | 45 | 46 | 47 |
48 |
49 | 50 |
51 |
52 |
53 |
54 | 56 |
57 |
58 | 60 |
61 |
62 | 64 |
65 |
66 |
67 |
68 |
69 | Fleeca Hacking Minigame 70 | 71 | 74 |
75 | 109 | 115 | 119 | 122 | 129 |
130 |
131 | Whisper me on Twitch @Sh4rkill3r or Discord sharkiller
132 | 141 | See also:
142 | NoPixel 4.0 Minigames

143 | Lockpicks Minigame
144 | Hacking Device Minigame
145 | >Fleeca Minigame<
146 | Thermite Minigame
147 | Vault Minigame
148 | Lower Vault Minigame
149 | Vault Codes Minigame
150 | VAR Simulation Minigame
151 | Casino Generators Minigame
152 | Casino Computer Minigame
153 | Power Plant Minigame
154 | Untangle Minigame
155 | Yacht Helper

156 |
NoPixel Minigames by Sharkiller is licensed under CC BY-NC-ND 4.0CCBYNCND
157 |
158 | 159 | -------------------------------------------------------------------------------- /nopixel_minigame/lowervault/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | NoPixel Lower Vault Minigame 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 20 | 21 | 22 |
STREAK: 0 | MAX STREAK: 0
23 |
24 |
25 | 26 | 27 |
5s
28 |
29 |
30 | Mode: 31 | 32 | 33 |
34 |
35 | 36 |
37 |
38 |
39 |
40 | 42 |
43 |
44 | 46 |
47 |
48 | 50 |
51 |
52 |
53 |
54 |
55 | Vault Hacking Minigame 56 | 57 | 60 |
61 | 111 | 117 | 121 | 124 | 131 |
132 |
133 | Whisper me on Twitch @Sh4rkill3r or Discord sharkiller
134 | 143 | See also:
144 | NoPixel 4.0 Minigames

145 | Lockpicks Minigame
146 | Hacking Device Minigame
147 | Fleeca Minigame
148 | Thermite Minigame
149 | Vault Minigame
150 | >Lower Vault Minigame<
151 | Vault Codes Minigame
152 | VAR Simulation Minigame
153 | Casino Generators Minigame
154 | Casino Computer Minigame
155 | Power Plant Minigame
156 | Untangle Minigame
157 | Yacht Helper

158 |
NoPixel Minigames by Sharkiller is licensed under CC BY-NC-ND 4.0CCBYNCND
159 |
160 | 161 | -------------------------------------------------------------------------------- /nopixel_minigame/casino_generators/minigame.js: -------------------------------------------------------------------------------- 1 | let timer_start, timer_finish, timer_hide, timer_time, good_positions, best_route, blinking_pos, last_pos, wrong, speed, timerStart; 2 | let game_started = false; 3 | let streak = 0; 4 | let max_streak = 0; 5 | let best_time = 99.999; 6 | 7 | const getCookieValue = (name) => ( 8 | document.cookie.match('(^|;)\\s*' + name + '\\s*=\\s*([^;]+)')?.pop() || '' 9 | ) 10 | let getMaxStreakFromCookie = () => { 11 | let str = getCookieValue('max-streak_casino_generator'); 12 | if(str !== '') 13 | return parseInt(str, 10); 14 | else 15 | return 0; 16 | } 17 | let getBestTimeFromCookie = () => { 18 | let str = getCookieValue('best-time_casino_generator'); 19 | if(str !== '') 20 | return parseFloat(str); 21 | else 22 | return 99.999; 23 | } 24 | max_streak = getMaxStreakFromCookie(); 25 | best_time = getBestTimeFromCookie(); 26 | 27 | const sleep = (ms, fn) => {return setTimeout(fn, ms)}; 28 | 29 | const range = (start, end, length = end - start + 1) => { 30 | return Array.from({length}, (_, i) => start + i) 31 | } 32 | 33 | const random = (min, max) => { 34 | return Math.floor(Math.random() * (max - min)) + min; 35 | } 36 | 37 | // Options 38 | document.querySelector('#speed').addEventListener('input', function(ev){ 39 | document.querySelector('.speed_value').innerHTML = ev.target.value + 's'; 40 | streak = 0; 41 | reset(); 42 | }); 43 | 44 | // Resets 45 | document.querySelector('.btn_again').addEventListener('click', function(){ 46 | streak = 0; 47 | reset(); 48 | }); 49 | 50 | function listener(ev){ 51 | if(!game_started) return; 52 | 53 | let pos_clicked = parseInt(ev.target.dataset.position); 54 | if(pos_clicked === 0) return; 55 | 56 | if(last_pos === 0){ 57 | document.querySelectorAll('.group.breathing') 58 | .forEach(el => { el.classList.remove('breathing') }); 59 | document.querySelector('.groups').classList.add('transparent'); 60 | 61 | if(pos_clicked === blinking_pos || pos_clicked === blinking_pos * 7){ 62 | last_pos = pos_clicked; 63 | ev.target.classList.add('good'); 64 | }else{ 65 | wrong++; 66 | ev.target.classList.add('bad'); 67 | } 68 | }else{ 69 | let pos_jumps = parseInt(document.querySelectorAll('.group')[last_pos].innerText, 10); 70 | let maxV = maxVertical(last_pos); 71 | let maxH = maxHorizontal(last_pos); 72 | 73 | if(pos_jumps <= maxH && pos_clicked === last_pos + pos_jumps){ 74 | last_pos = pos_clicked; 75 | ev.target.classList.add('good'); 76 | }else if(pos_jumps <= maxV && pos_clicked === last_pos + (pos_jumps * 7)){ 77 | last_pos = pos_clicked; 78 | ev.target.classList.add('good'); 79 | }else{ 80 | wrong++; 81 | ev.target.classList.add('bad'); 82 | } 83 | } 84 | 85 | check(); 86 | } 87 | 88 | function addListeners(){ 89 | document.querySelectorAll('.group').forEach(el => { 90 | el.addEventListener('mousedown', listener); 91 | }); 92 | } 93 | 94 | function check(){ 95 | if(wrong === 3){ 96 | resetTimer(); 97 | game_started = false; 98 | streak = 0; 99 | 100 | document.querySelector('.groups').classList.remove('transparent'); 101 | let blocks = document.querySelectorAll('.group'); 102 | good_positions.push(48); 103 | good_positions.forEach( pos => { 104 | blocks[pos].classList.add('proper'); 105 | }); 106 | return; 107 | } 108 | if(last_pos === 48){ 109 | stopTimer(); 110 | streak++; 111 | if(streak > max_streak){ 112 | max_streak = streak; 113 | document.cookie = "max-streak_casino_generator="+max_streak; 114 | } 115 | let time = document.querySelector('.streaks .time').innerHTML; 116 | if(parseFloat(time) < best_time){ 117 | best_time = parseFloat(time); 118 | document.cookie = "best-time_casino_generator="+best_time; 119 | } 120 | reset(); 121 | } 122 | } 123 | 124 | function maxVertical(pos){ 125 | return Math.floor((48-pos)/7); 126 | } 127 | function maxHorizontal(pos){ 128 | let max = (pos+1) % 7; 129 | if(max > 0) return 7-max; 130 | else return 0; 131 | } 132 | function generateNextPosition(pos){ 133 | let maxV = maxVertical(pos); 134 | let maxH = maxHorizontal(pos); 135 | if( maxV === 0 ){ 136 | let new_pos = random(random(1, maxH), maxH); 137 | return [new_pos, pos+new_pos]; 138 | } 139 | if( maxH === 0 ){ 140 | let new_pos = random(random(1, maxV), maxV); 141 | return [new_pos, pos+(new_pos*7)]; 142 | } 143 | if( random(1,1000) % 2 === 0 ){ 144 | let new_pos = random(random(1, maxH), maxH); 145 | return [new_pos, pos+new_pos]; 146 | }else{ 147 | let new_pos = random(random(1, maxV), maxV); 148 | return [new_pos, pos+(new_pos*7)]; 149 | } 150 | } 151 | 152 | function generateBestRoute(start_pos){ 153 | let route = []; 154 | if( random(1,1000) % 2 === 0 ){ 155 | start_pos *= 7; 156 | } 157 | while(start_pos < 48){ 158 | let new_pos = generateNextPosition(start_pos); 159 | route[start_pos] = new_pos[0]; 160 | start_pos = new_pos[1]; 161 | } 162 | 163 | return route; 164 | } 165 | 166 | function reset(){ 167 | game_started = false; 168 | last_pos = 0; 169 | 170 | resetTimer(); 171 | clearTimeout(timer_start); 172 | clearTimeout(timer_hide); 173 | clearTimeout(timer_finish); 174 | 175 | max_streak = getMaxStreakFromCookie(); 176 | best_time = getBestTimeFromCookie(); 177 | 178 | document.querySelector('.splash').classList.remove('hidden'); 179 | document.querySelector('.groups').classList.add('hidden'); 180 | document.querySelector('.groups').classList.remove('transparent'); 181 | 182 | document.querySelectorAll('.group').forEach(el => { el.remove(); }); 183 | 184 | start(); 185 | } 186 | 187 | function start(){ 188 | wrong = 0; 189 | last_pos = 0; 190 | 191 | blinking_pos = random(1,4); 192 | best_route = generateBestRoute(blinking_pos); 193 | good_positions = Object.keys(best_route); 194 | 195 | let div = document.createElement('div'); 196 | div.classList.add('group'); 197 | const groups = document.querySelector('.groups'); 198 | for(let i=0; i < 49; i++){ 199 | let group = div.cloneNode(); 200 | group.dataset.position = i.toString(); 201 | let text; 202 | switch(i){ 203 | case 0: 204 | text = '';break; 205 | case 48: 206 | text = '';break; 207 | case blinking_pos: 208 | case (blinking_pos*7): 209 | group.classList.add('breathing'); 210 | text = random(1,4); 211 | break; 212 | default: 213 | text = random(1,5); 214 | } 215 | if( good_positions.includes( i.toString() ) ){ 216 | text = best_route[i]; 217 | } 218 | group.innerHTML = text; 219 | groups.appendChild(group); 220 | } 221 | 222 | addListeners(); 223 | 224 | document.querySelector('.streak').innerHTML = streak; 225 | document.querySelector('.max_streak').innerHTML = max_streak; 226 | document.querySelector('.best_time').innerHTML = best_time; 227 | 228 | timer_start = sleep(2000, function(){ 229 | document.querySelector('.splash').classList.add('hidden'); 230 | document.querySelector('.groups').classList.remove('hidden'); 231 | 232 | game_started = true; 233 | timer_hide = sleep(6000, function(){ 234 | document.querySelector('.groups').classList.add('transparent'); 235 | }); 236 | 237 | startTimer(); 238 | speed = document.querySelector('#speed').value; 239 | timer_finish = sleep((speed * 1000), function(){ 240 | game_started = false; 241 | wrong = 3; 242 | check(); 243 | }); 244 | }); 245 | } 246 | 247 | function startTimer(){ 248 | timerStart = new Date(); 249 | timer_time = setInterval(timer,1); 250 | } 251 | function timer(){ 252 | let timerNow = new Date(); 253 | let timerDiff = new Date(); 254 | timerDiff.setTime(timerNow - timerStart); 255 | let ms = timerDiff.getMilliseconds(); 256 | let sec = timerDiff.getSeconds(); 257 | if (ms < 10) {ms = "00"+ms;}else if (ms < 100) {ms = "0"+ms;} 258 | document.querySelector('.streaks .time').innerHTML = sec+"."+ms; 259 | } 260 | function stopTimer(){ 261 | clearInterval(timer_time); 262 | } 263 | function resetTimer(){ 264 | clearInterval(timer_time); 265 | document.querySelector('.streaks .time').innerHTML = '0.000'; 266 | } 267 | 268 | start(); -------------------------------------------------------------------------------- /nopixel_minigame/4.0/roof_running/minigame.js: -------------------------------------------------------------------------------- 1 | let timer_start, timer_time, timerStart, pos_checked; 2 | let game_started = false; 3 | let streak = 0; 4 | let max_streak = 0; 5 | let best_time = 99.999; 6 | 7 | let mode = 5; 8 | 9 | const getCookieValue = (name) => ( 10 | document.cookie.match('(^|;)\\s*' + name + '\\s*=\\s*([^;]+)')?.pop() || '' 11 | ) 12 | let getMaxStreakFromCookie = () => { 13 | let str = getCookieValue('max-streak_roof_running'); 14 | if(str !== '') 15 | return parseInt(str, 10); 16 | else 17 | return 0; 18 | } 19 | let getBestTimeFromCookie = () => { 20 | let str = getCookieValue('best-time_roof_running'); 21 | if(str !== '') 22 | return parseFloat(str); 23 | else 24 | return 99.999; 25 | } 26 | max_streak = getMaxStreakFromCookie(); 27 | best_time = getBestTimeFromCookie(); 28 | 29 | const sleep = (ms, fn) => {return setTimeout(fn, ms)}; 30 | 31 | // Option 32 | document.querySelector('#grid').addEventListener('input', function(ev){ 33 | document.querySelector('.grid_value').innerHTML = ev.target.value + 'x' + ev.target.value; 34 | mode = parseInt(ev.target.value, 10); 35 | streak = 0; 36 | reset(); 37 | }); 38 | // Resets 39 | document.querySelector('.btn_again').addEventListener('click', function(){ 40 | streak = 0; 41 | reset(); 42 | }); 43 | 44 | function isValid(type, pos, color){ 45 | switch (type) { 46 | case 'left': 47 | if(pos%mode === 0) return false; 48 | pos = pos - 1; 49 | if(pos < 0) return false; 50 | break; 51 | case 'right': 52 | pos = pos + 1; 53 | if(pos >= (mode**2) || pos%mode === 0) return false; 54 | break; 55 | case 'top': 56 | pos = pos - mode; 57 | if(pos < 0) return false; 58 | break; 59 | case 'bottom': 60 | pos = pos + mode; 61 | if(pos >= (mode**2)) return false; 62 | break; 63 | } 64 | if(pos_checked.includes(pos)) return false; 65 | 66 | if( document.querySelectorAll('.group')[pos].dataset.color === color ){ 67 | pos_checked.push(pos); 68 | document.querySelectorAll('.group')[pos].classList.remove(color); 69 | document.querySelectorAll('.group')[pos].classList.add('removed'); 70 | document.querySelectorAll('.group')[pos].dataset.remove = '1'; 71 | checkAdjacent(pos, color); 72 | return pos; 73 | } 74 | return false; 75 | } 76 | 77 | function checkAdjacent(pos, color){ 78 | isValid('left', pos, color); 79 | isValid('right', pos, color); 80 | isValid('top', pos, color); 81 | isValid('bottom', pos, color); 82 | } 83 | 84 | function deleteChecked(){ 85 | 86 | const groups = document.querySelectorAll('.group'); 87 | for(let i= (mode**2)-1; i >= mode; i--){ 88 | if( groups[i].dataset.remove === '1'){ 89 | let pos = i - mode; 90 | while(pos >= 0){ 91 | if(groups[pos].dataset.remove !== '1'){ 92 | // Replace 93 | delete groups[i].dataset.remove; 94 | groups[i].classList.remove('removed'); 95 | groups[i].classList.add(groups[pos].dataset.color); 96 | groups[i].dataset.color = groups[pos].dataset.color; 97 | // Remove old 98 | groups[pos].dataset.remove = '1'; 99 | groups[pos].classList.remove(groups[pos].dataset.color); 100 | groups[pos].classList.add('removed'); 101 | delete groups[pos].dataset.color; 102 | pos=0; 103 | } 104 | pos=pos - mode; 105 | } 106 | } 107 | } 108 | } 109 | 110 | function joinColumns(){ 111 | const groups = document.querySelectorAll('.group'); 112 | for(let i= (mode**2)-mode; i <= (mode**2)-2; i++){ 113 | if( groups[i].dataset.remove === '1'){ 114 | let pos = i+1; 115 | let maxH = maxHorizontal(i); 116 | while(pos-i <= maxH){ 117 | if(groups[pos].dataset.remove !== '1'){ 118 | let pos_diff = pos-i; 119 | for(let vpos=pos; vpos>=0; vpos=vpos - mode){ 120 | if(groups[vpos].dataset.remove !== '1'){ 121 | // Replace 122 | delete groups[vpos-pos_diff].dataset.remove; 123 | groups[vpos-pos_diff].classList.remove('removed','red','green','blue'); 124 | groups[vpos-pos_diff].classList.add(groups[vpos].dataset.color); 125 | groups[vpos-pos_diff].dataset.color = groups[vpos].dataset.color; 126 | // Remove old 127 | groups[vpos].dataset.remove = '1'; 128 | groups[vpos].classList.remove(groups[vpos].dataset.color); 129 | groups[vpos].classList.add('removed'); 130 | delete groups[vpos].dataset.color; 131 | } 132 | } 133 | pos=(mode**2); 134 | } 135 | pos++; 136 | } 137 | } 138 | } 139 | } 140 | 141 | function listener(ev){ 142 | if(!game_started) return; 143 | 144 | let pos_clicked = parseInt(ev.target.dataset.position); 145 | let pos_color = ev.target.dataset.color; 146 | 147 | checkAdjacent(pos_clicked, pos_color); 148 | 149 | deleteChecked(); 150 | 151 | joinColumns(); 152 | 153 | pos_checked = []; 154 | 155 | check(); 156 | } 157 | 158 | function addListeners(){ 159 | document.querySelectorAll('.group').forEach(el => { 160 | el.addEventListener('mousedown', listener); 161 | }); 162 | } 163 | 164 | function check(){ 165 | if(document.querySelectorAll('.group.removed').length === (mode**2)){ 166 | stopTimer(); 167 | streak++; 168 | if(streak > max_streak){ 169 | max_streak = streak; 170 | document.cookie = "max-streak_roof_running="+max_streak; 171 | } 172 | let time = document.querySelector('.streaks .time').innerHTML; 173 | if(parseFloat(time) < best_time){ 174 | best_time = parseFloat(time); 175 | document.cookie = "best-time_roof_running="+best_time; 176 | } 177 | reset(); 178 | } 179 | } 180 | 181 | function maxHorizontal(pos){ 182 | let max = (pos+1) % mode; 183 | if(max > 0) return mode - max; 184 | else return 0; 185 | } 186 | 187 | function reset(){ 188 | game_started = false; 189 | 190 | resetTimer(); 191 | clearTimeout(timer_start); 192 | 193 | max_streak = getMaxStreakFromCookie(); 194 | best_time = getBestTimeFromCookie(); 195 | 196 | document.querySelector('.splash').classList.remove('hidden'); 197 | document.querySelector('.groups').classList.add('hidden'); 198 | 199 | document.querySelectorAll('.group').forEach(el => { el.remove(); }); 200 | 201 | start(); 202 | } 203 | 204 | function start(){ 205 | pos_checked = []; 206 | 207 | let div = document.createElement('div'); 208 | let colors = ['red', 'green', 'blue']; 209 | div.classList.add('group','group'+mode); 210 | const groups = document.querySelector('.groups'); 211 | for(let i=0; i < (mode**2); i++){ 212 | let group = div.cloneNode(); 213 | let randomColor = colors[Math.floor(Math.random() * colors.length)]; 214 | group.dataset.position = i.toString(); 215 | group.dataset.color = randomColor; 216 | group.classList.add(randomColor); 217 | groups.appendChild(group); 218 | } 219 | 220 | addListeners(); 221 | 222 | document.querySelector('.streak').innerHTML = streak; 223 | document.querySelector('.max_streak').innerHTML = max_streak; 224 | document.querySelector('.best_time').innerHTML = best_time; 225 | 226 | timer_start = sleep(500, function(){ 227 | document.querySelector('.splash').classList.add('hidden'); 228 | document.querySelector('.groups').classList.remove('hidden'); 229 | 230 | game_started = true; 231 | 232 | startTimer(); 233 | }); 234 | } 235 | 236 | function startTimer(){ 237 | timerStart = new Date(); 238 | timer_time = setInterval(timer,1); 239 | } 240 | function timer(){ 241 | let timerNow = new Date(); 242 | let timerDiff = new Date(); 243 | timerDiff.setTime(timerNow - timerStart); 244 | let ms = timerDiff.getMilliseconds(); 245 | let sec = timerDiff.getSeconds(); 246 | if (ms < 10) {ms = "00"+ms;}else if (ms < 100) {ms = "0"+ms;} 247 | document.querySelector('.streaks .time').innerHTML = sec+"."+ms; 248 | } 249 | function stopTimer(){ 250 | clearInterval(timer_time); 251 | } 252 | function resetTimer(){ 253 | clearInterval(timer_time); 254 | document.querySelector('.streaks .time').innerHTML = '0.000'; 255 | } 256 | 257 | start(); -------------------------------------------------------------------------------- /nopixel_minigame/casino_computer/minigame.js: -------------------------------------------------------------------------------- 1 | let timer_start, timer_finish, timer_hide, timer_time, good_positions, best_route, blinking_pos, last_pos, wrong, speed, timerStart; 2 | let game_started = false; 3 | let streak = 0; 4 | let max_streak = 0; 5 | let best_time = 99.999; 6 | let pieces = [ 7 | '', // 1 = Pawn 8 | '', // 2 = Knight 9 | '', // 3 = Bishop 10 | '', // 4 = Rook 11 | '', // 5 = Queen 12 | '' // 6 = King 13 | ] 14 | 15 | const getCookieValue = (name) => ( 16 | document.cookie.match('(^|;)\\s*' + name + '\\s*=\\s*([^;]+)')?.pop() || '' 17 | ) 18 | let getMaxStreakFromCookie = () => { 19 | let str = getCookieValue('max-streak_casino_computer'); 20 | if(str !== '') 21 | return parseInt(str, 10); 22 | else 23 | return 0; 24 | } 25 | let getBestTimeFromCookie = () => { 26 | let str = getCookieValue('best-time_casino_computer'); 27 | if(str !== '') 28 | return parseFloat(str); 29 | else 30 | return 99.999; 31 | } 32 | max_streak = getMaxStreakFromCookie(); 33 | best_time = getBestTimeFromCookie(); 34 | 35 | const sleep = (ms, fn) => {return setTimeout(fn, ms)}; 36 | 37 | const range = (start, end, length = end - start + 1) => { 38 | return Array.from({length}, (_, i) => start + i) 39 | } 40 | 41 | const random = (min, max) => { 42 | return Math.floor(Math.random() * (max - min + 1) + min); 43 | } 44 | 45 | // Options 46 | document.querySelector('#speed').addEventListener('input', function(ev){ 47 | document.querySelector('.speed_value').innerHTML = ev.target.value + 's'; 48 | streak = 0; 49 | reset(); 50 | }); 51 | 52 | // Resets 53 | document.querySelector('.btn_again').addEventListener('click', function(){ 54 | streak = 0; 55 | reset(); 56 | }); 57 | 58 | function listener(ev){ 59 | if(!game_started) return; 60 | 61 | let pos_clicked = parseInt(ev.target.dataset.position); 62 | if(pos_clicked === 0) return; 63 | 64 | if(last_pos === 0){ 65 | document.querySelectorAll('.group.breathing') 66 | .forEach(el => { el.classList.remove('breathing') }); 67 | document.querySelector('.groups').classList.add('transparent'); 68 | 69 | if(pos_clicked === blinking_pos || pos_clicked === blinking_pos * 7){ 70 | last_pos = pos_clicked; 71 | ev.target.classList.add('good'); 72 | }else{ 73 | wrong++; 74 | ev.target.classList.add('bad'); 75 | } 76 | }else{ 77 | let pos_jumps = parseInt(document.querySelectorAll('.group')[last_pos].dataset.value, 10); 78 | let maxV = maxVertical(last_pos); 79 | let maxH = maxHorizontal(last_pos); 80 | 81 | if(pos_jumps <= maxH && pos_clicked === last_pos + pos_jumps){ 82 | last_pos = pos_clicked; 83 | ev.target.classList.add('good'); 84 | }else if(pos_jumps <= maxV && pos_clicked === last_pos + (pos_jumps * 7)){ 85 | last_pos = pos_clicked; 86 | ev.target.classList.add('good'); 87 | }else{ 88 | wrong++; 89 | ev.target.classList.add('bad'); 90 | } 91 | } 92 | 93 | check(); 94 | } 95 | 96 | function addListeners(){ 97 | document.querySelectorAll('.group').forEach(el => { 98 | el.addEventListener('mousedown', listener); 99 | }); 100 | } 101 | 102 | function check(){ 103 | if(wrong === 3){ 104 | resetTimer(); 105 | game_started = false; 106 | streak = 0; 107 | 108 | document.querySelector('.groups').classList.remove('transparent'); 109 | let blocks = document.querySelectorAll('.group'); 110 | good_positions.push(48); 111 | good_positions.forEach( pos => { 112 | blocks[pos].classList.add('proper'); 113 | }); 114 | return; 115 | } 116 | if(last_pos === 48){ 117 | stopTimer(); 118 | streak++; 119 | if(streak > max_streak){ 120 | max_streak = streak; 121 | document.cookie = "max-streak_casino_computer="+max_streak; 122 | } 123 | let time = document.querySelector('.streaks .time').innerHTML; 124 | if(parseFloat(time) < best_time){ 125 | best_time = parseFloat(time); 126 | document.cookie = "best-time_casino_computer="+best_time; 127 | } 128 | reset(); 129 | } 130 | } 131 | 132 | function maxVertical(pos){ 133 | return Math.floor((48-pos)/7); 134 | } 135 | function maxHorizontal(pos){ 136 | let max = (pos+1) % 7; 137 | if(max > 0) return 7-max; 138 | else return 0; 139 | } 140 | function generateNextPosition(pos){ 141 | let maxV = maxVertical(pos); 142 | let maxH = maxHorizontal(pos); 143 | if( maxV === 0 ){ 144 | let new_pos = random(random(1, maxH), maxH); 145 | return [new_pos, pos+new_pos]; 146 | } 147 | if( maxH === 0 ){ 148 | let new_pos = random(random(1, maxV), maxV); 149 | return [new_pos, pos+(new_pos*7)]; 150 | } 151 | if( random(1,1000) % 2 === 0 ){ 152 | let new_pos = random(random(1, maxH), maxH); 153 | return [new_pos, pos+new_pos]; 154 | }else{ 155 | let new_pos = random(random(1, maxV), maxV); 156 | return [new_pos, pos+(new_pos*7)]; 157 | } 158 | } 159 | 160 | function generateBestRoute(start_pos){ 161 | let route = []; 162 | if( random(1,1000) % 2 === 0 ){ 163 | start_pos *= 7; 164 | } 165 | while(start_pos < 48){ 166 | let new_pos = generateNextPosition(start_pos); 167 | route[start_pos] = new_pos[0]; 168 | start_pos = new_pos[1]; 169 | } 170 | 171 | return route; 172 | } 173 | 174 | function reset(){ 175 | game_started = false; 176 | last_pos = 0; 177 | 178 | resetTimer(); 179 | clearTimeout(timer_start); 180 | clearTimeout(timer_hide); 181 | clearTimeout(timer_finish); 182 | 183 | max_streak = getMaxStreakFromCookie(); 184 | best_time = getBestTimeFromCookie(); 185 | 186 | document.querySelector('.splash').classList.remove('hidden'); 187 | document.querySelector('.groups').classList.add('hidden'); 188 | document.querySelector('.groups').classList.remove('transparent'); 189 | 190 | document.querySelectorAll('.group').forEach(el => { el.remove(); }); 191 | 192 | start(); 193 | } 194 | 195 | function start(){ 196 | wrong = 0; 197 | last_pos = 0; 198 | 199 | blinking_pos = random(1,4); 200 | best_route = generateBestRoute(blinking_pos); 201 | good_positions = Object.keys(best_route); 202 | 203 | let div = document.createElement('div'); 204 | div.classList.add('group'); 205 | const groups = document.querySelector('.groups'); 206 | for(let i=0; i < 49; i++){ 207 | let group = div.cloneNode(); 208 | group.dataset.position = i.toString(); 209 | let text, value; 210 | switch(i){ 211 | case 0: 212 | text = ''; 213 | value = 0; 214 | break; 215 | case 48: 216 | text = ''; 217 | value = 0; 218 | break; 219 | case blinking_pos: 220 | case (blinking_pos*7): 221 | group.classList.add('breathing'); 222 | value = random(1,5); 223 | text = pieces[value-1]; 224 | break; 225 | default: 226 | value = random(1,5); 227 | text = pieces[value-1]; 228 | } 229 | if( good_positions.includes( i.toString() ) ){ 230 | value = best_route[i]; 231 | text = pieces[value-1]; 232 | } 233 | group.innerHTML = text; 234 | group.dataset.value = value; 235 | groups.appendChild(group); 236 | } 237 | 238 | addListeners(); 239 | 240 | document.querySelector('.streak').innerHTML = streak; 241 | document.querySelector('.max_streak').innerHTML = max_streak; 242 | document.querySelector('.best_time').innerHTML = best_time; 243 | 244 | timer_start = sleep(2000, function(){ 245 | document.querySelector('.splash').classList.add('hidden'); 246 | document.querySelector('.groups').classList.remove('hidden'); 247 | 248 | game_started = true; 249 | timer_hide = sleep(6000, function(){ 250 | document.querySelector('.groups').classList.add('transparent'); 251 | }); 252 | 253 | startTimer(); 254 | speed = document.querySelector('#speed').value; 255 | timer_finish = sleep((speed * 1000), function(){ 256 | game_started = false; 257 | wrong = 3; 258 | check(); 259 | }); 260 | }); 261 | } 262 | 263 | function startTimer(){ 264 | timerStart = new Date(); 265 | timer_time = setInterval(timer,1); 266 | } 267 | function timer(){ 268 | let timerNow = new Date(); 269 | let timerDiff = new Date(); 270 | timerDiff.setTime(timerNow - timerStart); 271 | let ms = timerDiff.getMilliseconds(); 272 | let sec = timerDiff.getSeconds(); 273 | if (ms < 10) {ms = "00"+ms;}else if (ms < 100) {ms = "0"+ms;} 274 | document.querySelector('.streaks .time').innerHTML = sec+"."+ms; 275 | } 276 | function stopTimer(){ 277 | clearInterval(timer_time); 278 | } 279 | function resetTimer(){ 280 | clearInterval(timer_time); 281 | document.querySelector('.streaks .time').innerHTML = '0.000'; 282 | } 283 | 284 | start(); --------------------------------------------------------------------------------