diff --git a/css/brb.css b/css/brb.css index 2bcd5c4..6b0c72e 100644 --- a/css/brb.css +++ b/css/brb.css @@ -1,5 +1,5 @@ @import url('https://fonts.googleapis.com/css?family=Poppins:200,300,400,500,600,700,800,900&display=swap'); -body { +body{ user-select: none; padding: 0; margin: 0; @@ -16,7 +16,7 @@ body { #logclick{ position: absolute; width: 100%; - top: 40px; + top: 60px; left: 50%; text-align: center; transform: translate(-50%,0); @@ -63,7 +63,7 @@ body { .menu-container{ position: absolute; - top: 30px; + top: 50px; left: 50%; transform: translate(-50%, -50%); width: 300px; diff --git a/css/sett.css b/css/sett.css new file mode 100644 index 0000000..5801d04 --- /dev/null +++ b/css/sett.css @@ -0,0 +1,152 @@ +@import url('https://fonts.googleapis.com/css?family=Poppins:200,300,400,500,600,700,800,900&display=swap'); +*{ + margin: 0; + padding: 0; + box-sizing: border-box; + text-align: center; +} +body{ + user-select: none; + background-color: #333; +} +#jonathan{ + position: fixed; + top: 0%; + width: 100%; + height: 200px; + background: radial-gradient(125% 100% at 50% 0%,#fa552c 20%,transparent 70%); +} +.main{ + display: flex; + flex-wrap: wrap; + justify-content: center; +} +.item{ + position: relative; + /* border: none; */ + top: 5px; + margin: 2rem 3vw 2rem 3vw; + padding: 1rem 2rem; + border-radius: 6.9px; + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: center; + width: 350px; + height: 100px; + filter: drop-shadow(0px 20px 14px #444); +} +button{ + width: 32px; + height: 32px; + border-radius: 0.5rem; + border: none; + filter: drop-shadow(10px 10px 14px #444); +} + + + + + + + +/* Menu */ + +.menu-container{ + position: fixed; + top: 50px; + left: 50%; + transform: translate(-50%, -50%); + width: 300px; + display: flex; + align-items: center; + justify-content: center; + font-family: 'Poppins'; + z-index: 500; +} +.button{ + position: relative; + background: #1b1b1b; + color: #fff; + font-size: 20px; + padding: 8px 20px; + width: 150px;/* 100% */ + line-height: 30px; + display: flex; + align-items: center; + justify-content: space-between; + border-radius: 25px; + cursor: pointer; + transition: width .4s; + /* By MrEidam */ +} +.button.expand{ + width: 100%; +} +.fas.expand:before{ + content: '\f00d'; +} +ul{ + list-style: none; + position: absolute; + top: 65px; + display: block; + background: #1b1b1b; + width: 100%; + text-align: center; + border-radius: 5px; + display: none; + box-shadow: 0 3px 6px rgba(0,0,0,.3); + padding-inline-start: 0px; +} +ul:before{ + position: absolute; + content: ''; + width: 20px; + height: 20px; + background: #1b1b1b; + top: -10px; + right: 15px; + transform: rotate(45deg); + z-index: -1; +} +ul li{ + line-height: 35px; + padding: 8px 20px; + cursor: pointer; + border-bottom: 1px solid rgba(255,255,255,.1); +} +ul li:hover:first-child{ + border-radius: 5px 5px 0 0; +} +ul li:hover:last-child{ + border-radius: 0 0 5px 5px; +} +ul li:hover{ + box-shadow: inset 0 0 5px #33ff33, + inset 0 0 10px #66ff66; +} +ul li:last-child{ + border-bottom: none; +} +ul li a{ + display: block; + width: 100%; + height: 100%; + /* By MrEidam */ + color: #fff; + font-size: 18px; + text-decoration: none; +} +ul li:hover a{ + color: #44dd44; +} + +::-webkit-scrollbar{ + background: transparent; + width: 5px; +} +::-webkit-scrollbar-thumb{ + background: linear-gradient(transparent, #00ec00); + border-radius: 0 0 0.5rem 0.5rem; +} \ No newline at end of file diff --git a/css/shop.css b/css/shop.css index 2db4768..8ba3bc0 100644 --- a/css/shop.css +++ b/css/shop.css @@ -10,7 +10,6 @@ body { font-size: 15pt; - /*background: linear-gradient(#009000, black);*/ background-color: #333; } @@ -25,7 +24,7 @@ body { width: 100%; margin: 0; top: 0; - border-radius: 0 0 90px 90px; + background: radial-gradient(125% 100% at 50% 0%,#11ABFF 20%,transparent 70%); /* By MrEidam */ } #logclick{ @@ -138,10 +137,6 @@ button{ border: none; filter: drop-shadow(8px 6px 4px #555); } - - - - @media only screen and (max-width: 555px){ .row{ flex-direction: column; @@ -154,6 +149,8 @@ button{ } +/* Menu */ + .menu-container{ position: fixed; top: 50px; diff --git a/css/upgr.css b/css/upgr.css index daeab98..70107ca 100644 --- a/css/upgr.css +++ b/css/upgr.css @@ -20,7 +20,7 @@ body { width: 100%; margin: 0; top: 0; - border-radius: 0 0 90px 90px; + background: radial-gradient(125% 100% at 50% 0%,#efff11 20%,transparent 70%); } /* By MrEidam */ diff --git a/img/settings.svg b/img/settings.svg new file mode 100644 index 0000000..52bfffd --- /dev/null +++ b/img/settings.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/index.html b/index.html index 0a62c82..47455e5 100644 --- a/index.html +++ b/index.html @@ -17,18 +17,13 @@ BRB - Clicking - - - -
-
- +

@@ -45,33 +40,12 @@

- -
@@ -79,6 +53,7 @@
+ \ No newline at end of file diff --git a/js/main.js b/js/main.js index 7047f49..86e04b0 100644 --- a/js/main.js +++ b/js/main.js @@ -1,7 +1,6 @@ // Items let items; let cs = 0; -let e = 0; let anime = false; function load(){ @@ -65,100 +64,6 @@ window.onload = function(){ LDmodes() } -// Reset -function reset(){ - if((items.lang == 1) && confirm('Do you really want to reset everything?') && confirm('Are you sure?')){ - alert('Everything Reseted'); - items = { - clicks:0, - dogs:0, - cats:0, - foxes:0, - wolfs:0, - hamsters:0, - whales:0, - capybaras:0, - platapuses:0, - porcupines:0, - hippos:0, - snakes:0, - cheetahs:0, - pythons:0, - girrafes:0, - lions:0, - otters:0, - meerkat:0, - raccoon:0, - owl:0, - badger:0, - squirrel:0, - chameleon:0, - chicken:0, - wombat:0, - panther:0, - coyote:0, - frog:0, - bear:0, - pig:0, - - - - lemons:0, - lt3:0, - lang:items.lang, - pres:1, - mode:items.mode, - Mclick:1, - token:0, - } - } - if((items.lang == 0) && confirm('Vážně chceš všechno resetovat?') && confirm('Seš si jistý?')){ - alert('Vše resetováno'); - items = { - clicks:0, - dogs:0, - cats:0, - foxes:0, - wolfs:0, - hamsters:0, - whales:0, - capybaras:0, - platapuses:0, - porcupines:0, - hippos:0, - snakes:0, - cheetahs:0, - pythons:0, - girrafes:0, - lions:0, - otters:0, - meerkat:0, - raccoon:0, - owl:0, - badger:0, - squirrel:0, - chameleon:0, - chicken:0, - wombat:0, - panther:0, - coyote:0, - frog:0, - bear:0, - pig:0, - - - - lemons:0, - lt3:0, - lang:items.lang, - pres:1, - mode:items.mode, - Mclick:1, - token:0, - } - } -} - // Update function update(){ let i = JSON.stringify(items); @@ -204,24 +109,17 @@ function cash(){ },1000) } -// HELP -function help(){ - if(items.lang == 1){ /* EN */ - window.open('https://youtu.be/G0fP-l-05dM'); - }else if(items.lang == 0){ /* CZ */ - window.open('https://youtu.be/XhmETe4MSVI'); - } -} // Languages Cz || Uk function language(){ if(items.lang == 0){ /* CZ */ items.lang = 1; console.log(items.lang); document.documentElement.setAttribute('lang', 'cz'); - del.innerHTML = 'Reset'; - sos.innerHTML = 'Pomoc'; shop.innerHTML = 'Obchod'; upg.innerHTML = 'Vylepšení'; + sett.innerHTML = 'Nastavení'; + del.innerHTML = 'Reset'; + sos.innerHTML = 'Pomoc'; modes.innerHTML = 'Změn do Temného módu'; langs.innerHTML = 'Switch into English'; @@ -229,10 +127,11 @@ function language(){ items.lang = 0; console.log(items.lang); document.documentElement.setAttribute('lang', 'en'); - del.innerHTML = 'Reset'; - sos.innerHTML = 'Help'; shop.innerHTML = 'Shop'; upg.innerHTML = 'Upgrades'; + sett.innerHTML = 'Settings'; + del.innerHTML = 'Reset'; + sos.innerHTML = 'Help'; modes.innerHTML = 'Switch into Dark Mode'; langs.innerHTML = 'Změň si jazyk do Češtiny'; } @@ -242,41 +141,18 @@ function language(){ function checklang(){ if(items.lang == 0){ /* CZ */ document.documentElement.setAttribute('lang', 'cz'); - del.innerHTML = 'Reset'; - sos.innerHTML = 'Pomoc'; shop.innerHTML = 'Obchod'; upg.innerHTML = 'Vylepšení'; - if((items.mode||0) == 0){ - modes.innerHTML = 'Změn do Temného módu'; - }else if(items.mode == 1){ - modes.innerHTML = 'Změn do Světlého módu'; - } - langs.innerHTML = 'Switch into English'; + sett.innerHTML = 'Nastavení'; }else if(items.lang == 1){ /* UK */ document.documentElement.setAttribute('lang', 'en'); - del.innerHTML = 'Reset'; - sos.innerHTML = 'Help'; shop.innerHTML = 'Shop'; upg.innerHTML = 'Upgrades'; - if((items.mode||0) == 0){ - modes.innerHTML = 'Switch into Dark Mode'; - }else if(items.mode == 1){ - modes.innerHTML = 'Switch into Light Mode'; - } - langs.innerHTML = 'Změň si jazyk do Češtiny'; + sett.innerHTML = 'Settings'; } } // Dark || Light Mode -function SLDmodes(){ - if(items.mode == 0){ - items.mode = 1; - }else if(items.mode == 1){ - items.mode = 0; - } - LDmodes() - console.log(items.mode); -} function LDmodes(){ if((items.mode||0) == 0){// Light Mode body.style.background = '#fff'; diff --git a/js/menu.js b/js/menu.js new file mode 100644 index 0000000..342fbe0 --- /dev/null +++ b/js/menu.js @@ -0,0 +1,16 @@ +$(document).ready(function(){ + $('.button').click(function(){ + if($(this).hasClass('expand')){ + $('ul').slideUp(function(){ + $('.button').removeClass('expand'); + $('.fas').removeClass('expand'); + }) + }else{ + $(this).addClass('expand'); + setTimeout(function(){ + $('.fas').addClass('expand'); + $('ul').stop().slideDown(); + },200); + } + }) +}) \ No newline at end of file diff --git a/js/sett.js b/js/sett.js new file mode 100644 index 0000000..c4df88a --- /dev/null +++ b/js/sett.js @@ -0,0 +1,210 @@ +let cs; +let items + +// Update +function update(){ + let i = JSON.stringify(items); + localStorage.setItem('items', i); + cs = items.dogs + items.cats*12 + items.foxes*18 + items.wolfs*100 + items.hamsters*130 + items.whales*220 + items.capybaras*280 + items.platapuses*400 + items.porcupines*650 + items.hippos*950 + items.snakes*1000 + items.cheetahs*3000 + items.pythons*7800 + items.girrafes*8400 + items.otters*9000 + items.meerkat*9800 + items.raccoon*14500 + items.owl*16000; +} + +// Load +function load(){ + items = JSON.parse(localStorage.getItem('items')); + LDmodes(); + cs = items.dogs + items.cats*12 + items.foxes*18 + items.wolfs*100 + items.hamsters*130 + items.whales*220 + items.capybaras*280 + items.platapuses*400 + items.porcupines*650 + items.hippos*950 + items.snakes*1000 + items.cheetahs*3000 + items.pythons*7800 + items.girrafes*8400 + items.otters*9000 + items.meerkat*9800 + items.raccoon*14500 + items.owl*16000; + let Btns = document.querySelectorAll('.change'); + if(items.lang == 1){ // EN + document.documentElement.setAttribute('lang', 'en'); + shop.innerHTML = 'Shop'; + upg.innerHTML = 'Upgrades'; + sett.innerHTML = 'Settings'; + if(items.mode == 0){ld.innerHTML = 'Do you want to
switch to Dark mode?'; + }else if(items.mode == 1){ld.innerHTML = 'Do you want to
switch to Light mode?';} + lg.innerHTML = 'Do you want to
switch to Czech?'; + hl.innerHTML = 'Do you want to
wantch a video for help?'; + rs.innerHTML = 'Do you want to
completely reset?' + Btns.forEach((e) => { + e.innerHTML = 'Yes!'; + }); + } + if(items.lang == 0){ // CZ + document.documentElement.setAttribute('lang', 'cz'); + shop.innerHTML = 'Obchod'; + upg.innerHTML = 'Vylepšení'; + sett.innerHTML = 'Nastavení'; + if(items.mode == 0){ld.innerHTML = 'Chceš si zapnout
Tmavý mód?'; + }else if(items.mode == 1){ld.innerHTML = 'Chceš si zapnout
Světlý mód?';} + lg.innerHTML = 'Chceš si přepnout
jazyk do Angličtiny?'; + hl.innerHTML = 'Chceš si pustit
video pro pomoc?'; + rs.innerHTML = 'Chceš kompletně
resetovat postup?' + Btns.forEach((e) => { + e.innerHTML = 'Ano!'; + }); +} +} +load(); + +// Upload +function upload(){update();load();} + +function cash(){ + setTimeout (function money(){ + items.clicks += cs*items.pres; + upload(); + cash(); + },1000); +} +cash(); + +// Dark || Light Mode +function SLDmodes(){ + if(items.mode==0){items.mode=1;upload();} + else if(items.mode==1){items.mode=0;upload();} + LDmodes(); +} +function LDmodes(){ + let Bimts = document.querySelectorAll('.item'); + let Btns = document.querySelectorAll('.change'); + let hhh = document.querySelectorAll('h3'); + if((items.mode||0) == 0){// Light Mode + body.style.background = '#ddd'; + Bimts.forEach((e) => { + e.style.background = '#ffefd5'; + }); + Btns.forEach((e) => { + e.style.background = '#8FBC8F'; + e.style.color = '#ccc'; + e.style.textShadow = "2px 2px 4px #000"; + }); + hhh.forEach((e) => { + e.style.color = '#000'; + e.style.textShadow = "2px 2px 4px #000"; + }); + }else if(items.mode == 1){// Dark Mode + body.style.background = '#333'; + Bimts.forEach((e) => { + e.style.background = '#666055'; + e.style.color = '#000'; + }); + Btns.forEach((e) => { + e.style.background = '#008B8B'; + e.style.color = '#ccc'; + e.style.textShadow = "2px 2px 4px #000"; + }); + hhh.forEach((e) => { + e.style.color = '#eee'; + e.style.textShadow = "2px 2px 4px #000"; + }); + } +} + +function language(){ + if(items.lang == 0){ /* CZ */ + items.lang = 1; + }else if(items.lang == 1){ /* UK */ + items.lang = 0; + } + upload(); +} + +// HELP +function help(){ + if(items.lang == 1){ /* EN */ + window.open('https://youtu.be/G0fP-l-05dM'); + }else if(items.lang == 0){ /* CZ */ + window.open('https://youtu.be/XhmETe4MSVI'); + } +} + +// Reset +function reset(){ + if((items.lang == 1) && confirm('Do you really want to reset everything?') && confirm('Are you sure?')){ + alert('Everything Reseted'); + items = { + clicks:0, + dogs:0, + cats:0, + foxes:0, + wolfs:0, + hamsters:0, + whales:0, + capybaras:0, + platapuses:0, + porcupines:0, + hippos:0, + snakes:0, + cheetahs:0, + pythons:0, + girrafes:0, + lions:0, + otters:0, + meerkat:0, + raccoon:0, + owl:0, + badger:0, + squirrel:0, + chameleon:0, + chicken:0, + wombat:0, + panther:0, + coyote:0, + frog:0, + bear:0, + pig:0, + + + + lemons:0, + lt3:0, + lang:items.lang, + pres:1, + mode:items.mode, + Mclick:1, + token:0, + } + } + if((items.lang == 0) && confirm('Vážně chceš všechno resetovat?') && confirm('Seš si jistý?')){ + alert('Vše resetováno'); + items = { + clicks:0, + dogs:0, + cats:0, + foxes:0, + wolfs:0, + hamsters:0, + whales:0, + capybaras:0, + platapuses:0, + porcupines:0, + hippos:0, + snakes:0, + cheetahs:0, + pythons:0, + girrafes:0, + lions:0, + otters:0, + meerkat:0, + raccoon:0, + owl:0, + badger:0, + squirrel:0, + chameleon:0, + chicken:0, + wombat:0, + panther:0, + coyote:0, + frog:0, + bear:0, + pig:0, + + lemons:0, + lt3:0, + lang:items.lang, + pres:1, + mode:items.mode, + Mclick:1, + token:0, + } + } +} diff --git a/js/shop.js b/js/shop.js index 89c94c9..30ec9af 100644 --- a/js/shop.js +++ b/js/shop.js @@ -20,12 +20,9 @@ function load(){ if(items.lang == 1){ document.documentElement.setAttribute('lang', 'en'); - if((items.mode||0) == 0){ - modes.innerHTML = 'Switch into Dark Mode'; - }else if((items.mode||0) == 1){ - modes.innerHTML = 'Switch into Light Mode'; - } - upg.innerHTML = 'Upgrades' + shop.innerHTML = 'Shop'; + upg.innerHTML = 'Upgrades'; + sett.innerHTML = 'Settings'; disclick.innerHTML=`You've got ${fornum(items.clicks)} clicks, and making ${fornum(cs*items.pres)} per second!` disdog.innerHTML=`You've got ${fornum(items.dogs)} dogs!` discat.innerHTML=`You've got ${fornum(items.cats)} cats!` @@ -115,12 +112,9 @@ function load(){ } if(items.lang == 0){ document.documentElement.setAttribute('lang', 'cz'); - if((items.mode||0) == 0){ - modes.innerHTML = 'Změn do Temného módu'; - }else if((items.mode||0) == 1){ - modes.innerHTML = 'Změn do Světlého módu'; - } - upg.innerHTML = 'Vylepšení' + shop.innerHTML = 'Obchod'; + upg.innerHTML = 'Vylepšení'; + sett.innerHTML = 'Nastavení'; document.getElementById('disclick').innerHTML=`Právě máš ${fornum(items.clicks)} kliků a děláš ${fornum(cs*items.pres)} za sekundu!` document.getElementById('disdog').innerHTML=`Právě máš ${fornum(items.dogs)} psů!` document.getElementById('discat').innerHTML=`Právě máš ${fornum(items.cats)} koček!` @@ -629,21 +623,11 @@ function mxow(){ } // Dark || Light Mode -function SLDmodes(){ - if(items.mode == 0){ - items.mode = 1; - }else if(items.mode == 1){ - items.mode = 0; - } - LDmodes() - console.log(items.mode); -} function LDmodes(){ let Bimts = document.querySelectorAll('.item'); if((items.mode||0) == 0){// Light Mode body.style.background = '#ddd'; body.style.color = '#000'; - jonathan.style.background = 'linear-gradient(#11ABFF, #ccccccab)'; Bimts.forEach((e) => { e.style.background = '#ffefd5'; }); @@ -654,7 +638,6 @@ function LDmodes(){ }else if(items.mode == 1){// Dark Mode body.style.background = '#333'; body.style.color = '#fff'; - jonathan.style.background = 'linear-gradient(#11ABFF, #333333ab)'; Bimts.forEach((e) => { e.style.background = '#666055'; }); diff --git a/js/upgr.js b/js/upgr.js index 32229e3..b881afa 100644 --- a/js/upgr.js +++ b/js/upgr.js @@ -25,11 +25,9 @@ function load(){ } if(items.lang == 0){ // CZ document.documentElement.setAttribute('lang', 'cz'); - if((items.mode||0) == 0){ - modes.innerHTML = 'Změn do Temného módu'; - }else if((items.mode||0) == 1){ - modes.innerHTML = 'Změn do Světlého módu'; - } + shop.innerHTML = 'Obchod'; + upg.innerHTML = 'Vylepšení'; + sett.innerHTML = 'Nastavení'; dislm.innerHTML = `Právě máš ${fornum(items.lemons)} citrónů!`; disMcmake.innerHTML = `Zatím ti každý klik dává ${fornum((items.Mclick||1)*items.pres)} kliků!`; Mc1.innerHTML = `Kup si vylepšení na kliky za
${fornum(20+(items.Mclick||1)*(items.Mclick||1))} citrónů`; @@ -49,11 +47,9 @@ function load(){ }else if(items.lang == 1){ // En document.documentElement.setAttribute('lang', 'en'); - if((items.mode||0) == 0){ - modes.innerHTML = 'Switch into Dark Mode'; - }else if((items.mode||0) == 1){ - modes.innerHTML = 'Switch into Light Mode'; - } + shop.innerHTML = 'Shop'; + upg.innerHTML = 'Upgrades'; + sett.innerHTML = 'Settings'; dislm.innerHTML = `You've got ${fornum(items.lemons)} lemons!`; disMcmake.innerHTML = `So far every click gives you ${fornum((items.Mclick||1)*items.pres)} clicks!`; Mc1.innerHTML = `Buy an upgrade for your clicks
for ${fornum(20+(items.Mclick||1)*(items.Mclick||1))} lemons`; @@ -159,9 +155,6 @@ function progress(){ upload(); } - - - function TheThing(){ if(items.lang == 0 && items.token >= (1000*items.pres) && confirm(`Za Prestiže budeš získávat více kliků, ale tvůj postup se vynuluje (až na Prestiž body). Chceš se 'Znovuzrodit'?`)){ // CZ alert(`Získal jsi 0.5 prestiže bodů!`); @@ -265,22 +258,11 @@ function TheThing(){ // Dark || Light Mode -function SLDmodes(){ - if(items.mode == 0){ - items.mode = 1; - }else if(items.mode == 1){ - items.mode = 0; - } - LDmodes(); - upload(); - console.log(items.mode); -} function LDmodes(){ let Bimts = document.querySelectorAll('.item'); if((items.mode||0) == 0){// Light Mode body.style.background = '#ddd'; body.style.color = '#000'; - jonathan.style.background = 'linear-gradient(#11ABFF, #ccccccab)'; Bimts.forEach((e) => { e.style.background = '#ffefd5'; }); @@ -289,7 +271,6 @@ function LDmodes(){ }else if(items.mode == 1){// Dark Mode body.style.background = '#333'; body.style.color = '#fff'; - jonathan.style.background = 'linear-gradient(#11ABFF, #333333ab)'; Bimts.forEach((e) => { e.style.background = '#666055'; }); diff --git a/settings.html b/settings.html new file mode 100644 index 0000000..fdf177a --- /dev/null +++ b/settings.html @@ -0,0 +1,49 @@ + + + + + + + + + + BRB - Settings + + +
+ +
+
+

+ +
+
+

+ +
+
+

+ +
+
+

+ +
+
+ + +
+
Menu + +
+ +
+ + + + \ No newline at end of file diff --git a/shop.html b/shop.html index 39837f7..2480667 100644 --- a/shop.html +++ b/shop.html @@ -481,31 +481,15 @@ - - + + diff --git a/upgrade.html b/upgrade.html index fd02c22..d6138fb 100644 --- a/upgrade.html +++ b/upgrade.html @@ -27,7 +27,7 @@
-
+

BRB

@@ -71,29 +71,13 @@
- +