0
+ + + +
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/assets/shrekler/script.js b/assets/shrekler/script.js
new file mode 100644
index 0000000..91c1add
--- /dev/null
+++ b/assets/shrekler/script.js
@@ -0,0 +1,710 @@
+const selectors = [
+ "promptbox", "prompt", "prompttext", "prompttitle", "chartitle", "chargold", "herocarousel", "purchasebtn", "purchasetext",
+ "tlpimg", "bbwimg", "pimg", "gimg", 'drimg', "pfimg", "pbimg", "dimg", "mm", "ex", "mws", "rp", "ws", "per", "soundimg", "credits", "fullimg", "fullimg2"
+];
+
+selectors.forEach((selector) => {
+ window[selector] = document.getElementById(selector);
+});
+
+let anima, fullscrnum = 0;
+let musicbtn = false, intervalsArr = [];
+let gold = document.querySelector("#goldcount");
+let coin = Number(localStorage.getItem("coin")) || 0;
+let music = new Audio("./assets/vid/music.mp3");
+let museimg = document.querySelector("#musicimg");
+let promptbtn = document.querySelector("#promptbutton");
+let promptbtn2 = document.querySelector("#promptbutton2");
+let settings = document.querySelector('#settingsbox');
+let upgrades = document.querySelector("#upgradesmenu");
+let music2 = new Audio("./assets/vid/music2.mp4");
+music2.volume = 0.5;
+let metawidth = (window.innerWidth > 0) ? window.innerWidth : screen.width;
+let firstslidevar = 0;
+
+if (localStorage.getItem("mws") && !localStorage.getItem("ws")) ws.style.display = "block";
+if (!localStorage.getItem("mm") && localStorage.getItem('7')) mm.style.display = "block";
+if (!localStorage.getItem("ex") && localStorage.getItem('6')) ex.style.display = "block";
+if (!localStorage.getItem("rp") && localStorage.getItem('4')) rp.style.display = "block";
+if (localStorage.getItem("0") && localStorage.getItem("1") && localStorage.getItem("2") && !localStorage.getItem("per")) per.style.display = "block";
+if (localStorage.getItem("0")) {
+ purchasebtn.classList.add("purchased");
+ purchasebtn.classList.remove("purchase");
+ purchasetext.textContent = "Purchased";
+ tlpimg.style.removeProperty('display');
+ Array.from(document.getElementsByClassName(`1img`)).forEach((element) =>
+ element.style.removeProperty("display")
+ );
+ Array.from(document.getElementsByClassName(`question1`)).forEach(
+ (element) => (element.textContent = "")
+ );
+ intervalsArr.push(setInterval(fight, 1000, "tlp"));
+}
+
+if (localStorage.getItem("1")) {
+ bbwimg.style.removeProperty('display');
+ Array.from(document.getElementsByClassName(`2img`)).forEach((element) =>
+ element.style.removeProperty("display")
+ );
+ Array.from(document.getElementsByClassName(`question2`)).forEach(
+ (element) => (element.textContent = "")
+ );
+ intervalsArr.push(setInterval(fight, 1000, "bbw"));
+}
+
+if (localStorage.getItem("2")) {
+ pimg.style.removeProperty('display');
+ Array.from(document.getElementsByClassName(`3img`)).forEach((element) =>
+ element.style.removeProperty("display")
+ );
+ Array.from(document.getElementsByClassName(`question3`)).forEach(
+ (element) => (element.textContent = "")
+ );
+ Array.from(document.getElementsByClassName(`4img`)).forEach((element) =>
+ element.style.removeProperty("display")
+ );
+ Array.from(document.getElementsByClassName(`question4`)).forEach(
+ (element) => (element.textContent = "")
+ );
+ intervalsArr.push(setInterval(fight, 1000, "p"));
+}
+
+if (localStorage.getItem("3")) {gimg.style.removeProperty('display'); intervalsArr.push(setInterval(fight, 100, "g"));};
+if (localStorage.getItem("4")) {drimg.style.removeProperty('display'); intervalsArr.push(setInterval(fight, 1000, "dr"))};
+
+if (
+ localStorage.getItem("3") &&
+ localStorage.getItem("4")
+) {
+ Array.from(document.getElementsByClassName(`5img`)).forEach((element) =>
+ element.style.removeProperty("display")
+ );
+ Array.from(document.getElementsByClassName(`question5`)).forEach(
+ (element) => (element.textContent = "")
+ );
+}
+
+if (localStorage.getItem("5")) {
+ pfimg.style.removeProperty('display');
+ Array.from(document.getElementsByClassName(`6img`)).forEach((element) =>
+ element.style.removeProperty("display")
+ );
+ Array.from(document.getElementsByClassName(`question6`)).forEach(
+ (element) => (element.textContent = "")
+ );
+ intervalsArr.push(setInterval(fight, 5000, "pf"));
+}
+
+if (localStorage.getItem("6")) {
+ pbimg.style.removeProperty('display');
+ Array.from(document.getElementsByClassName(`7img`)).forEach((element) =>
+ element.style.removeProperty("display")
+ );
+ Array.from(document.getElementsByClassName(`question7`)).forEach(
+ (element) => (element.textContent = "")
+ );
+ if (!localStorage.getItem("mws")) {
+ mws.style.display = "block";
+ }
+ intervalsArr.push(setInterval(fight, 10, "pb"));
+}
+
+if (localStorage.getItem("7")) {dimg.style.removeProperty('display'); intervalsArr.push(setInterval(fight, 1, "d"));};
+
+function toggleSettings() {
+ settings.style.display === 'none' ? settings.style.display = 'block' : settings.style.display = 'none';
+}
+
+function fight(e) {
+ let earn = 0;
+
+ const earnMap = {
+ "player": 1,
+ "g": 1,
+ "pb": 1,
+ "d": 1,
+ "tlp": 3,
+ "bbw": 4,
+ "p": 5,
+ "dr": 10,
+ "pf": 100,
+ }
+
+ earn = earnMap[e];
+
+ if (e !== "player" && localStorage.getItem("mm")) earn *= 2;
+ if (e === "player") {
+ if (localStorage.getItem("ex")) {
+
+ }
+ }
+ e === "player" ?
+ localStorage.getItem("ex") ?
+ earn *= 10 :
+ localStorage.getItem("rp") ?
+ earn *= 4 :
+ localStorage.getItem("per") ?
+ earn *= 2 :
+ null
+ : null;
+
+ localStorage.getItem("ws") ? earn *= 10 : null;
+
+ coin += earn;
+ goldChange();
+ let click = new Audio('./assets/vid/click.mp3');
+ localStorage.getItem('sound') !== false && e === 'player' ? click.play() : null;
+}
+
+function confirmClearData() {
+ prompttext.textContent = 'This action will delete all of your data including gold and music settings. Enter "Restart" below to confirm.';
+ prompttitle.textContent = "Are you sure?";
+ promptbtn.textContent = "Confirm";
+ promptbtn2.style.display = "none";
+ promptbox.style.display === "none" ? promptbox.style.display = "block" : promptbox.style.display = "none";
+}
+
+function toggleMusic() {
+ if (!musicbtn) {
+ musicbtn = true;
+ museimg.src = "./assets/img/music.png";
+ music.loop = true;
+ music.play();
+ } else {
+ musicbtn = false;
+ museimg.src = "./assets/img/nomusic.png";
+ music.pause();
+ }
+}
+
+function toggleSound() {
+ if (localStorage.getItem('sound') !== false) {
+ soundimg.src = "./assets/img/SoundOff.png";
+ localStorage.setItem('sound', false);
+ } else if (!localStorage.getItem('sound')) {
+ soundimg.src = "./assets/img/SoundOn.png";
+ localStorage.setItem('sound', true);
+ }
+}
+
+function toggleFullscreen() {
+ if (
+ (document.fullScreenElement && document.fullScreenElement !== null) ||
+ (!document.mozFullScreen && !document.webkitIsFullScreen)
+ ) {
+ if (document.documentElement.requestFullScreen) {
+ document.documentElement.requestFullScreen();
+ } else if (document.documentElement.mozRequestFullScreen) {
+ document.documentElement.mozRequestFullScreen();
+ } else if (document.documentElement.webkitRequestFullScreen) {
+ document.documentElement.webkitRequestFullScreen(
+ Element.ALLOW_KEYBOARD_INPUT
+ );
+ }
+ fullimg.src = "./assets/img/nofullscr.png";
+ } else {
+ if (document.cancelFullScreen) {
+ document.cancelFullScreen();
+ } else if (document.mozCancelFullScreen) {
+ document.mozCancelFullScreen();
+ } else if (document.webkitCancelFullScreen) {
+ document.webkitCancelFullScreen();
+ }
+ fullimg.src = "./assets/img/fullscr.png";
+ }
+}
+
+function checkButton(e) {
+ if (e.key === "F11") {
+ e.preventDefault();
+ alert("You are not allowed to fullscreen without pressing the button.");
+ }
+}
+
+function toggleHeroes() {
+ if (herocarousel.style.display === "none") {
+ herocarousel.style.display = "block";
+ if (musicbtn) {
+ music.pause();
+ music2.play();
+ }
+ } else {
+ herocarousel.style.display = "none";
+ purchasebtn.classList.remove("cantpurchase");
+ if (musicbtn) {
+ music2.pause();
+ music.play();
+ }
+ if (purchasetext.textContent === "Not Enough Coin") {
+ purchasetext.textContent = "Purchase";
+ purchasebtn.classList.add("purchase");
+ }
+ }
+}
+
+function toggleUpgrades() {
+ if (upgrades.style.display === "none") {
+ upgrades.style.display = "block";
+ if (musicbtn) {
+ music.pause();
+ music2.play();
+ }
+ } else {
+ upgrades.style.display = "none";
+ purchasebtn.classList.remove("cantpurchase");
+ if (musicbtn) {
+ music2.pause();
+ music.play();
+ }
+ }
+}
+
+let swiper = 0;
+
+if (metawidth <= 950) {
+ // Initialize Swiper
+ swiper = new Swiper(".mySwiper", {
+ slidesPerView: 1,
+ spaceBetween: 50,
+ centeredSlides: true,
+ loop: true,
+ fade: true,
+ mousewheel: true,
+ navigation: {
+ nextEl: ".swiper-button-next",
+ prevEl: ".swiper-button-prev",
+ },
+ breakpoints: {
+ 500: {
+ slidesPerView: 3,
+ },
+ },
+ });
+} else {
+ // Initialize Swiper
+ swiper = new Swiper(".mySwiper", {
+ slidesPerView: 5,
+ spaceBetween: 50,
+ centeredSlides: true,
+ loop: true,
+ fade: true,
+ mousewheel: true,
+ navigation: {
+ nextEl: ".swiper-button-next",
+ prevEl: ".swiper-button-prev",
+ },
+ breakpoints: {
+ 0: {
+ slidesPerView: 1,
+ },
+ 250: {
+ slidesPerView: 2,
+ },
+ 500: {
+ slidesPerView: 3,
+ },
+ 750: {
+ slidesPerView: 4,
+ },
+ 1000: {
+ slidesPerView: 5,
+ },
+ },
+ });
+}
+
+swiper.realIndex = 0;
+
+swiper.on("slideChange", function () {
+ if (!localStorage.getItem(`${this.realIndex}`)) {
+ purchasetext.textContent = "Purchase";
+ purchasebtn.classList.remove("purchased");
+ purchasebtn.classList.remove("cantpurchase");
+ purchasebtn.classList.add("purchase");
+ } else {
+ purchasetext.textContent = "Purchased";
+ purchasebtn.classList.remove("cantpurchase");
+ purchasebtn.classList.remove("purchase");
+ purchasebtn.classList.add("purchased");
+ }
+ if (this.realIndex === 0) {
+ chartitle.textContent = "Three Little Pigs";
+ chargold.textContent = "50";
+ } else if (this.realIndex === 1) {
+ chartitle.textContent = "???";
+ chargold.textContent = "???";
+ if (localStorage.getItem("0")) {
+ chartitle.textContent = "Big Bad Wolf";
+ chargold.textContent = "250";
+ } else {
+ purchasebtn.classList.add("purchased");
+ purchasebtn.classList.remove("purchase");
+ purchasetext.textContent = "Not Available";
+ }
+ } else if (this.realIndex === 2) {
+ chartitle.textContent = "???";
+ chargold.textContent = "???";
+ if (localStorage.getItem("1")) {
+ chartitle.textContent = "Pinocchio";
+ chargold.textContent = "2,500";
+ } else {
+ purchasebtn.classList.add("purchased");
+ purchasebtn.classList.remove("purchase");
+ purchasetext.textContent = "Not Available";
+ }
+ } else if (this.realIndex === 3) {
+ chartitle.textContent = "???";
+ chargold.textContent = "???";
+ if (localStorage.getItem("2")) {
+ chartitle.textContent = "Gingy";
+ chargold.textContent = "10,000";
+ } else {
+ purchasebtn.classList.add("purchased");
+ purchasebtn.classList.remove("purchase");
+ purchasetext.textContent = "Not Available";
+ }
+ } else if (this.realIndex === 4) {
+ chartitle.textContent = "???";
+ chargold.textContent = "???";
+ if (localStorage.getItem("2")) {
+ chartitle.textContent = "Dragon";
+ chargold.textContent = "100,000";
+ } else {
+ purchasebtn.classList.add("purchased");
+ purchasebtn.classList.remove("purchase");
+ purchasetext.textContent = "Not Available";
+ }
+ } else if (this.realIndex === 5) {
+ chartitle.textContent = "???";
+ chargold.textContent = "???";
+ if (firstslidevar === 0) {
+ firstslidevar = 1;
+ }
+ if (
+ localStorage.getItem("3") &&
+ localStorage.getItem("4")
+ ) {
+ chartitle.textContent = "Princess Fiona";
+ chargold.textContent = "500,000";
+ } else {
+ purchasebtn.classList.add("purchased");
+ purchasebtn.classList.remove("purchase");
+ purchasetext.textContent = "Not Available";
+ }
+ } else if (this.realIndex === 6) {
+ chartitle.textContent = "???";
+ chargold.textContent = "???";
+ if (localStorage.getItem("5")) {
+ chartitle.textContent = "Puss In Boots";
+ chargold.textContent = "1M";
+ } else {
+ purchasebtn.classList.add("purchased");
+ purchasebtn.classList.remove("purchase");
+ purchasetext.textContent = "Not Available";
+ }
+ } else if (this.realIndex === 7) {
+ chartitle.textContent = "???";
+ chargold.textContent = "???";
+ if (localStorage.getItem("6")) {
+ chartitle.textContent = "Donkey";
+ chargold.textContent = "10M";
+ } else {
+ purchasebtn.classList.add("purchased");
+ purchasebtn.classList.remove("purchase");
+ purchasetext.textContent = "Not Available";
+ }
+ }
+});
+
+function purchaseChar() {
+ let coinMap = {
+ 0: 50,
+ 1: 250,
+ 2: 2500,
+ 3: 10000,
+ 4: 100000,
+ 5: 500000,
+ 6: 1000000,
+ 7: 10000000,
+ };
+
+ let nameMap = {
+ 0: "tlp",
+ 1: "bbw",
+ 2: "p",
+ 3: "g",
+ 4: "dr",
+ 5: "pf",
+ 6: "pb",
+ 7: "d",
+ };
+
+ let timeMap = {
+ 0: 1000,
+ 1: 1000,
+ 2: 1000,
+ 3: 100,
+ 4: 1000,
+ 5: 5000,
+ 6: 10,
+ 7: 1,
+ };
+
+ let goalCoin = coinMap[swiper.realIndex];
+ let reachGoal = coin >= goalCoin;
+ let nameAbb = nameMap[swiper.realIndex];
+ let interval = timeMap[swiper.realIndex];
+
+ if (!localStorage.getItem(`${swiper.realIndex}`)) {
+ if (reachGoal === true) {
+ coin -= goalCoin;
+ localStorage.setItem(`${swiper.realIndex}`, true);
+ intervalsArr.push(setInterval(fight, interval, `${nameAbb}`));
+ window[nameAbb + 'img'].style.removeProperty("display");
+ } else {
+ purchasetext.textContent = "Not Enough Shrekles";
+ purchasebtn.classList.add("cantpurchase");
+ purchasebtn.classList.remove("purchase");
+ setTimeout(function () {
+ purchasebtn.classList.remove("cantpurchase");
+ purchasebtn.classList.add("purchase");
+ purchasetext.textContent = "Purchase";
+ }, 2000);
+ return;
+ }
+
+ if (localStorage.getItem("0")) {
+ Array.from(document.getElementsByClassName(`1img`)).forEach((element) =>
+ element.style.removeProperty("display")
+ );
+ Array.from(document.getElementsByClassName(`question1`)).forEach(
+ (element) => (element.textContent = "")
+ );
+ }
+ if (localStorage.getItem("1")) {
+ Array.from(document.getElementsByClassName(`2img`)).forEach((element) =>
+ element.style.removeProperty("display")
+ );
+ Array.from(document.getElementsByClassName(`question2`)).forEach(
+ (element) => (element.textContent = "")
+ );
+ }
+ if (localStorage.getItem("2")) {
+ Array.from(document.getElementsByClassName(`3img`)).forEach((element) =>
+ element.style.removeProperty("display")
+ );
+ Array.from(document.getElementsByClassName(`question3`)).forEach(
+ (element) => (element.textContent = "")
+ );
+ Array.from(document.getElementsByClassName(`4img`)).forEach((element) =>
+ element.style.removeProperty("display")
+ );
+ Array.from(document.getElementsByClassName(`question4`)).forEach(
+ (element) => (element.textContent = "")
+ );
+ }
+ if (
+ localStorage.getItem("3") &&
+ localStorage.getItem("4")
+ ) {
+ Array.from(document.getElementsByClassName(`5img`)).forEach((element) =>
+ element.style.removeProperty("display")
+ );
+ Array.from(document.getElementsByClassName(`question5`)).forEach(
+ (element) => (element.textContent = "")
+ );
+ }
+ if (localStorage.getItem("5")) {
+ Array.from(document.getElementsByClassName(`6img`)).forEach((element) =>
+ element.style.removeProperty("display")
+ );
+ Array.from(document.getElementsByClassName(`question6`)).forEach(
+ (element) => (element.textContent = "")
+ );
+ }
+ if (localStorage.getItem("6")) {
+ Array.from(document.getElementsByClassName(`7img`)).forEach((element) =>
+ element.style.removeProperty("display")
+ );
+ Array.from(document.getElementsByClassName(`question7`)).forEach(
+ (element) => (element.textContent = "")
+ );
+ if (!localStorage.getItem("mws")) {
+ mws.style.display = "block";
+ }
+ if (!localStorage.getItem("e")) {
+ ex.style.display = "block";
+ }
+ }
+ if (localStorage.getItem("0") && localStorage.getItem("1") && localStorage.getItem("2") && !localStorage.getItem("per")) {
+ per.style.display = "block";
+ }
+ if (localStorage.getItem("7") && !localStorage.getItem("mm")) {
+ mm.style.display = "block";
+ }
+ let purchase = new Audio("./assets/vid/purchase.mp3");
+ if (localStorage.getItem('sound') !== false) {
+ purchase.play();
+ }
+ goldChange();
+ purchasebtn.classList.remove("cantpurchase");
+ purchasebtn.classList.remove("purchase");
+ purchasebtn.classList.add("purchased");
+ purchasetext.textContent = "Purchased";
+ let heromuse = new Audio(`./assets/Sounds/Heroes/${chartitle.textContent}.mp3`);
+ if (chartitle.textContent === "Princess Fiona") {
+ heromuse.volume = 0.5;
+ }
+ heromuse.play();
+ }
+}
+
+function clearData() {
+ if (prompt.value.toLowerCase() === "restart") {
+ coin = 0;
+ goldChange();
+ localStorage.clear();
+ for (let i = 1; i <= 7; i++) {
+ Array.from(document.getElementsByClassName(`${i}img`)).forEach(
+ (element) => (element.style.display = "none")
+ );
+ Array.from(document.getElementsByClassName(`question${i}`)).forEach(
+ (element) => (element.textContent = "?")
+ );
+ }
+ for (let id of intervalsArr) {
+ clearInterval(id);
+ }
+ intervalsArr = [];
+ ws.style.display = "none";
+ mws.style.display = "none";
+ mm.style.display = "none";
+ ex.style.display = "none";
+ per.style.display = "none";
+ rp.style.display = "none";
+ purchasebtn.classList.remove("purchased");
+ purchasebtn.classList.add("purchase");
+ purchasetext.textContent = "Purchase";
+ if (chartitle.textContent !== "Three Little Pigs") {
+ chartitle.textContent = "???";
+ chargold.textContent = "???";
+ purchasetext.textContent = "Not Available";
+ }
+ prompttext.textContent = "Your data has been cleared successfully.";
+ prompttitle.textContent = "Cleared.";
+ promptbtn.textContent = "Clear Again";
+ } else {
+ prompttext.textContent =
+ 'You have not entered "Restart". Your request has been cancelled.';
+ prompttitle.textContent = "Cancelled.";
+ promptbtn.textContent = "Retry";
+ }
+ promptbtn2.style.display = "inline";
+ prompt.value = "";
+}
+
+function purchaseUpgrades(e) {
+ let coinMap = {
+ "mm": 250000,
+ "ex": 50000,
+ "mws": 0,
+ "ws": 100000000,
+ "per": 10000,
+ "rp": 25000,
+ };
+
+ let goalCoin = coinMap[`${e}`];
+ let reachGoal = coin >= goalCoin;
+
+ if (!localStorage.getItem(`${e}`)) {
+ if (reachGoal === true) {
+ coin -= goalCoin;
+ localStorage.setItem(`${e}`, true);
+ window[e].style.display = "none";
+ if (e === "mws") {
+ ws.style.display = "block";
+ }
+ if (e === "ws") {
+ credits.style.display = "block";
+ autoScroll();
+ setTimeout(function () {
+ playEndCredits()
+ }, 20000);
+ }
+ } else {
+ window[e].classList.add("cantpurchase");
+ setTimeout(() => {window[e].classList.remove("cantpurchase");}, 2000);
+ }
+ }
+}
+
+function goldChange() {
+ localStorage.setItem("coin", coin);
+ gold.textContent = coin;
+}
+
+function idle() {
+ let prevtime = localStorage.getItem("prevtime");
+ if (prevtime) {
+ prevtime = new Date(prevtime);
+ let newtime = new Date();
+ let difference = Math.abs(newtime.getTime() - prevtime.getTime());
+ let seconds = difference / 1000;
+ let deciseconds = difference / 100;
+ let centiseconds = difference / 10;
+ let earnings = 0;
+ newtime.setDate(newtime.getDate() + 1);
+
+ localStorage.getItem("0") ? earnings += (seconds * 3) : null;
+ localStorage.getItem("1") ? earnings += (seconds * 4) : null;
+ localStorage.getItem("2") ? earnings += (seconds * 5) : null;
+ localStorage.getItem("3") ? earnings += (deciseconds * 1) : null;
+ localStorage.getItem("4") ? earnings += (seconds * 10) : null;
+ localStorage.getItem("5") ? earnings += ((difference / 5000) * 100) : null;
+ localStorage.getItem("6") ? earnings += (centiseconds * 1) : null;
+ localStorage.getItem("7") ? earnings += (difference * 1) : null;
+ localStorage.getItem("mm") ? earnings *= 2 : null;
+
+ earnings = Math.round(earnings);
+ coin += earnings;
+ goldChange();
+ }
+}
+
+function newTime() {
+ let date = new Date();
+ localStorage.setItem("prevtime", date);
+}
+idle();
+setInterval(newTime, 1000);
+
+function autoScroll() {
+ window.scrollBy(0, 1);
+ setTimeout(function () {
+ return;
+ }, 20000);
+ setTimeout(autoScroll, 0);
+}
+
+function playEndCredits() {
+ let creditmuse = new Audio('./assets/Sounds/Heroes/End Credits.mp3');
+ creditmuse.play();
+ setTimeout(function () {
+ credits.style.display = 'none';
+ }, 3000)
+}
+
+function updateAnima() {
+ anima === 1 ? anima-- : anima++;
+
+ localStorage.getItem("0") ? tlpimg.src = `./assets/img/figures/tlp${anima}.png` : null;
+ localStorage.getItem("1") ? bbwimg.src = `./assets/img/figures/bbw${anima}.png` : null;
+ localStorage.getItem("2") ? pimg.src = `./assets/img/figures/p${anima}.png` : null;
+ localStorage.getItem("3") ? gimg.src = `./assets/img/figures/g${anima}.png` : null;
+ localStorage.getItem("4") ? drimg.src = `./assets/img/figures/dr${anima}.png` : null;
+ localStorage.getItem("5") ? pfimg.src = `./assets/img/figures/pf${anima}.png` : null;
+ localStorage.getItem("6") ? pbimg.src = `./assets/img/figures/pb${anima}.png` : null;
+ localStorage.getItem("7") ? dimg.src = `./assets/img/figures/d${anima}.png` : null;
+}
+
+setInterval(updateAnima, 500)
\ No newline at end of file
diff --git a/assets/shrekler/styles.css b/assets/shrekler/styles.css
new file mode 100644
index 0000000..76e74eb
--- /dev/null
+++ b/assets/shrekler/styles.css
@@ -0,0 +1,712 @@
+@import url("https://fonts.googleapis.com/css2?family=Bungee+Spice&display=swap");
+@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap");
+@import url("https://fonts.googleapis.com/css2?family=Montserrat&display=swap");
+
+body {
+ text-align: center;
+ background-image: url("./assets/img/background.png");
+ user-select: none;
+ background-repeat: no-repeat;
+ background-attachment: fixed;
+ background-position: center bottom;
+}
+
+.gold {
+ font-size: 40px;
+ margin: 0 auto;
+ width: 10%;
+ color: white;
+ position: absolute;
+ left: 15px;
+ top: 15px;
+ z-index: 3;
+}
+
+.goldcount {
+ position: absolute;
+ top: 0px;
+ left: 50px;
+ font-family: "Montserrat";
+ font-size: 45px;
+}
+
+.goldimg {
+ position: absolute;
+ top: 12px;
+ left: 5px;
+ z-index: 3;
+}
+
+#monsterimg {
+ position: absolute;
+ right: 0;
+ left: 0;
+ margin: auto;
+ bottom: 100px;
+ width: 500px;
+ height: 500px;
+ -webkit-transition-property: height, width;
+ -webkit-transition-duration: 0.5s;
+ -moz-transition-property: height, width;
+ -moz-transition-duration: 0.5s;
+ transition-property: height, width;
+ transition-duration: 0.5s;
+}
+
+#monsterimg:hover {
+ width: 600px;
+ height: 600px;
+ -webkit-transition-property: height, width;
+ -webkit-transition-duration: 0.5s;
+ -moz-transition-property: height, width;
+ -moz-transition-duration: 0.5s;
+ transition-property: height, width;
+ transition-duration: 0.5s;
+}
+
+#monsterimg:active:hover {
+ width: 550px;
+ height: 550px;
+ -webkit-transition-property: height, width;
+ -webkit-transition-duration: 0.25s;
+ -moz-transition-property: height, width;
+ -moz-transition-duration: 0.25s;
+ transition-property: height, width;
+ transition-duration: 0.25s;
+}
+
+#clearbtn {
+ position: absolute;
+ left: 0;
+ right: 0;
+ margin: auto;
+ bottom: 10px;
+ background-color: transparent;
+ color: white;
+ border-radius: 5px;
+ border: none;
+ height: 30px;
+ width: 90px;
+ font-size: 15px;
+ backdrop-filter: blur(15px);
+ -webkit-backdrop-filter: blur(15px);
+ font-family: "Roboto";
+ transition: all 2s;
+ -webkit-transition: all 2s;
+}
+
+#clearbtn:hover {
+ cursor: pointer;
+ transition: all 2s;
+ -webkit-transition: all 2s;
+ backdrop-filter: blur(75px);
+ -webkit-backdrop-filter: blur(75px);
+}
+
+@keyframes clearhover {
+ from {
+ backdrop-filter: blur(15px);
+ -webkit-backdrop-filter: blur(15px);
+ }
+ to {
+ backdrop-filter: blur(75px);
+ -webkit-backdrop-filter: blur(75px);
+ }
+}
+
+@keyframes revclearhover {
+ from {
+ backdrop-filter: blur(75px);
+ -webkit-backdrop-filter: blur(75px);
+ }
+ to {
+ backdrop-filter: blur(15px);
+ -webkit-backdrop-filter: blur(15px);
+ }
+}
+
+#upgrades {
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ margin: auto;
+ width: 275px;
+ height: 375px;
+ padding: 5px 5px 10px 5px;
+ backdrop-filter: blur(15px);
+ border-radius: 5px;
+ color: rgb(236, 236, 236);
+ font-family: "Montserrat";
+ text-align: center;
+}
+
+#upgrades div {
+ border: solid 2px white;
+ border-radius: 5px;
+ padding-bottom: 10px;
+ margin-top: 10px;
+}
+
+#upgrades div:hover {
+ cursor: pointer;
+}
+
+.upgradeimg {
+ display: inline;
+ vertical-align: middle;
+}
+
+.upgradetext {
+ display: inline;
+ vertical-align: middle;
+}
+
+.upgradetitle {
+ display: inline;
+ margin: 0;
+ padding: 2px 0px 2px 0px;
+}
+
+.title1 {
+ margin-left: 25px;
+}
+
+.title2 {
+ font-size: 14px;
+}
+
+.titletooltip {
+ display: block;
+}
+
+.musicbtn {
+ position: absolute;
+ top: 5px;
+ right: 5px;
+ height: 50px;
+ width: 50px;
+ border: none;
+ background: transparent;
+ filter: invert(1);
+}
+
+.fullscrbtn {
+ position: absolute;
+ top: 8px;
+ right: 60px;
+ background: transparent;
+ filter: invert(1);
+ border: none;
+}
+
+#promptbox {
+ background: white;
+ color: black;
+ position: absolute;
+ top: 0;
+ right: 0;
+ left: 0;
+ bottom: 0;
+ margin: auto;
+ height: 200px;
+ width: 500px;
+ border-radius: 5px;
+ text-align: center;
+}
+
+#prompttitle {
+ font-family: "Roboto";
+}
+
+#prompttext {
+ font-family: "Montserrat";
+}
+
+#prompt {
+ display: block;
+ margin: 0 auto;
+ border: none;
+ border-radius: 2px;
+ background-color: rgb(14, 14, 14);
+ color: white;
+ height: 17px;
+ width: 200px;
+}
+
+#prompt:focus {
+ box-shadow: 0 0 3pt 2pt #719ece;
+ outline: none;
+ caret-color: white;
+}
+
+#promptbutton,
+#promptbutton2 {
+ margin: 0 auto;
+ margin-top: 7px;
+ background: transparent;
+ border: solid 2px black;
+ color: black;
+ border-radius: 5px;
+ display: inline;
+}
+
+#promptbutton:hover,
+#promptbutton2:hover {
+ background: rgb(206, 206, 206);
+}
+
+#herocarousel {
+ position: absolute;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ margin: auto;
+ background-image: url("./assets/img/Tileable Wood.jpg");
+ background-size: 10%;
+}
+
+#chartitle {
+ position: absolute;
+ left: 0;
+ right: 0;
+ margin: auto;
+ top: 90px;
+ font-family: "Roboto";
+ color: white;
+ text-shadow: 2px 0 black, -2px 0 black, 0 2px black, 0 -2px black,
+ 1px 1px black, -1px -1px black, 1px -1px black, -1px 1px black;
+}
+
+#costchar {
+ position: absolute;
+ top: 150px;
+ right: 0;
+ left: 0px;
+ margin: auto;
+ text-align: center;
+ font-size: 20px;
+ height: 50px;
+ width: 300px;
+ color: white;
+}
+
+#costimg {
+ vertical-align: middle;
+ margin-right: 5px;
+}
+
+#costtext {
+ vertical-align: middle;
+ font-family: "Roboto";
+}
+
+#purchasebtn {
+ position: absolute;
+ left: 0;
+ right: 0;
+ margin: auto;
+ bottom: 100px;
+ height: 50px;
+ width: 300px;
+ border-radius: 5px;
+ color: white;
+ font-family: 'Montserrat';
+}
+
+.purchase {
+ background-color: rgb(3, 173, 3);
+ border: none;
+}
+
+.purchased {
+ background-color: rgb(42, 41, 41);
+ border: solid 2px white;
+}
+
+.cantpurchase {
+ background-color:rgb(164, 0, 0);
+ border: none;
+}
+
+.swiper {
+ right: 1rem;
+ width: 100%;
+ height: 100%;
+ position: absolute;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0px;
+ margin: auto;
+ width: 1707px;
+}
+
+.swiper-slide {
+ text-align: center;
+ /* Center slide text vertically */
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: -webkit-flex;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ -webkit-justify-content: center;
+ justify-content: center;
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ -webkit-align-items: center;
+ align-items: center;
+ color: white;
+ background-color: black;
+ font-size: 250px;
+ font-weight: bold;
+ font-family: monospace;
+ border-radius: 5px;
+}
+
+.swiper-slide img {
+ width: 100%;
+ height: 100%;
+ object-fit: cover;
+ border-radius: 5px;
+}
+
+.swiper-slide img {
+ width: 300;
+ height: 500;
+}
+
+.container > div {
+ top: 25vh;
+ height: 50vh;
+}
+
+#herobtn {
+ position: absolute;
+ left: 49px;
+ top: 19%;
+ height: 50px;
+ width: 260px;
+ background-image: url("./assets/img/Heroes_Sign.png");
+ background-size: cover;
+ background-repeat: no-repeat;
+}
+
+#herobtn:hover {
+ background-image: url("./assets/img/HeroesGlowing.png");
+}
+
+#upgradebtn {
+ position: absolute;
+ left: 125px;
+ top: 27%;
+ height: 100px;
+ width: 100px;
+ background-image: url("./assets/img/Upgrades.png");
+ background-repeat: no-repeat;
+ background-size: 100px 100px;
+}
+
+#upgradebtn:hover {
+ filter: invert(1);
+}
+
+#upgradesmenu {
+ background-image: url("./assets/img/Tileable Wood.jpg");
+ position: absolute;
+ top: 0;
+ left: 0;
+ height: 100%;
+ width: 100%;
+ z-index: 2;
+}
+
+#herobtn2 {
+ position: absolute;
+ left: 5px;
+ bottom: 5px;
+ border-radius: 5px;
+ width: 100px;
+ height: 50px;
+ font-size: 25px;
+ background: rgb(164, 0, 0);
+ color: white;
+ transition: all 1s;
+ -webkit-transition: all 1s;
+ border: none;
+}
+
+#herobtn2:hover {
+ transition: all 1s;
+ -webkit-transition: all 1s;
+ border: solid 2px black;
+}
+
+.arrowcon,
+.arrowcon2 {
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ margin: auto;
+ width: 75px;
+ height: 200px;
+ border: 2px solid white;
+ z-index: 1;
+ backdrop-filter: blur(15px);
+}
+
+.arrowcon {
+ left: 0;
+ border-top-right-radius: 200% 200%;
+ border-bottom-right-radius: 200% 200%;
+ border-left: 0;
+ left: 0px;
+}
+
+.arrowcon2 {
+ right: 0;
+ border-top-left-radius: 200% 200%;
+ border-bottom-left-radius: 200% 200%;
+ border-right: 0;
+}
+
+.swiper-button-next,
+.swiper-button-prev {
+ --swiper-theme-color: white;
+ height: 200px !important;
+ width: 75px !important;
+ position: absolute !important;
+ top: 0 !important;
+ bottom: 0 !important;
+ margin: auto !important;
+}
+
+.swiper-button-prev {
+ left: 0 !important;
+ border-top-right-radius: 200% 200% !important;
+ border-bottom-right-radius: 200% 200% !important;
+ border-left: 0 !important;
+}
+
+.swiper-button-next {
+ right: 0 !important;
+ border-top-left-radius: 200% 200% !important;
+ border-bottom-left-radius: 200% 200% !important;
+ border-right: 0 !important;
+}
+
+.tooltip {
+ position: relative;
+ display: inline-block;
+ border-bottom: 1px dotted black;
+ margin-top: 5px;
+}
+
+.tooltip1 {
+ left: 55px;
+}
+
+.tooltip2 {
+ left: 68px;
+}
+
+.tooltip3 {
+ left: 50px;
+}
+
+.tooltip4 {
+ left: 16px;
+}
+
+.tooltip5 {
+ left: 35px;
+}
+
+.tooltip6 {
+ left: 20px;
+}
+
+.tooltip .tooltiptext {
+ visibility: hidden;
+ backdrop-filter: blur(15px);
+ color: #fff;
+ text-align: center;
+ padding: 5px 0;
+ border-radius: 6px;
+ position: absolute;
+ z-index: 1;
+ bottom: 100%;
+ left: 50%;
+}
+
+.tooltip.tooltip1 .tooltiptext {
+ width: 120px;
+ margin-left: -60px;
+}
+
+.tooltip.tooltip2 .tooltiptext {
+ width: 500px;
+ margin-left: -250px;
+}
+
+.tooltip.tooltip3 .tooltiptext, .tooltip.tooltip6 .tooltiptext {
+ width: 100px;
+ margin-left: -50px;
+}
+
+.tooltip.tooltip4 .tooltiptext {
+ width: 50px;
+ margin-left: -25px;
+}
+
+.tooltip.tooltip5 .tooltiptext {
+ width: 300px;
+ margin-left: -150px;
+}
+
+.tooltip:hover .tooltiptext {
+ visibility: visible;
+}
+
+.cantafford {
+ background: rgb(164, 0, 0);
+}
+
+#settingsbox {
+ position: absolute;
+ height: 100%;
+ width: 100%;
+ background: transparent;
+}
+
+.settingsbtn {
+ width: 70px;
+ height: 70px;
+ background-color:rgb(42, 41, 41);
+ border: solid white;
+ border-radius: 5px;
+}
+
+#settingstitle {
+ color: white;
+ font-family: 'Montserrat';
+}
+
+.settingsimg {
+ filter: invert(1);
+}
+
+#settingsinnerbox {
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ margin: auto;
+ width: 400px;
+ height: 400px;
+ border: solid black;
+ backdrop-filter: blur(70px);
+ border-radius: 7px;
+ z-index: 2;
+}
+
+@media (max-width: 950px) {
+ #monsterimg {
+ width: 300px;
+ height: 300px;
+ }
+ #monsterimg:hover {
+ width: 350px;
+ height: 350px;
+ }
+ #monsterimg:active:hover {
+ width: 325px;
+ height: 325px;
+ }
+ #promptbox {
+ width: 375px;
+ }
+ #settingsinnerbox {
+ width: 350px;
+ height: 400px;
+ }
+ .swiper {
+ width: 400px;
+ height: 300px;
+ }
+ #costchar {
+ top: 125px;
+ }
+}
+
+.starimg {
+ height: 15px;
+ width: 15px;
+ margin: auto;
+}
+
+.starimg#onei {
+ margin-right: 15px;
+}
+
+.starimg#twoi {
+ margin-left: 15px;
+}
+
+#credits {
+ position: absolute;
+ height: 250%;
+ width: 100%;
+ background-color: black;
+ color: white;
+ z-index: 4;
+ top: 0;
+ left: 0;
+}
+
+#credits h1#creditstitle {
+ font-family: 'Montserrat';
+ margin-bottom: 600px;
+}
+
+#credits h3 {
+ font-family: 'Montserrat';
+ margin-top: 50px;
+}
+
+#credits h3:first-of-type {
+ margin-top: 10px;
+}
+
+#credits strong {
+ font-family: 'Roboto';
+ display: block;
+ margin-top: 5px;
+}
+
+#credits h2 {
+ font-family: 'Montserrat';
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ margin: auto;
+ margin-top: 3000px;
+}
+
+#imagecat {
+ position: absolute;
+ bottom: 10px;
+ left: 10px;
+}
+
+#imagecat img {
+ margin-left: 5px;
+ margin-right: 5px;
+ margin-bottom: 5px;
+}
\ No newline at end of file
diff --git a/assets/whiteman.png b/assets/whiteman.png
new file mode 100644
index 0000000..2c19b32
Binary files /dev/null and b/assets/whiteman.png differ
diff --git a/assets/whiteman/assets/trailer.mp4 b/assets/whiteman/assets/trailer.mp4
new file mode 100644
index 0000000..324ab46
Binary files /dev/null and b/assets/whiteman/assets/trailer.mp4 differ
diff --git a/assets/whiteman/assets/whiteman.mp4 b/assets/whiteman/assets/whiteman.mp4
new file mode 100644
index 0000000..c81372a
Binary files /dev/null and b/assets/whiteman/assets/whiteman.mp4 differ
diff --git a/assets/whiteman/assets/whiteman.png b/assets/whiteman/assets/whiteman.png
new file mode 100644
index 0000000..2c19b32
Binary files /dev/null and b/assets/whiteman/assets/whiteman.png differ
diff --git a/assets/whiteman/index.html b/assets/whiteman/index.html
new file mode 100644
index 0000000..433d3a8
--- /dev/null
+++ b/assets/whiteman/index.html
@@ -0,0 +1,52 @@
+
+
+
+
+ Based on a TRUE STORY.
+ Whiteman is an intense, action-packed, high-quality, adventurous, and inspiring film created and published by Rizz Productions.
+
+ Founded in Ohio, Rizz Productions is a well-known company. We have developed many popular productions such as WHITEMAN. +
++ Lorem ipsum odor amet, consectetuer adipiscing elit. Potenti metus habitasse duis euismod erat penatibus elementum ridiculus praesent. Quis ipsum finibus mattis viverra tempor eget fringilla. Rutrum rhoncus vestibulum imperdiet condimentum; proin senectus. Maximus montes justo tincidunt enim orci conubia tristique lectus venenatis. Aliquet praesent aptent, elementum inceptos turpis metus lacinia. Sed molestie egestas facilisi quam cras neque lacus velit. Feugiat duis risus bibendum curae, eros pulvinar. Pretium vivamus nulla varius hendrerit justo arcu mus. +
+ +A bookmark manager. Stylized with shadcn/ui.
+
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 250K
+ 
+ 
+ 
+ 
+