From 35f2f0782f25e80c6560a80808ccd6ee263e28b2 Mon Sep 17 00:00:00 2001
From: EmberSpirit <EmberSpirit007@proton.me>
Date: Mon, 16 Oct 2023 12:07:07 +0200
Subject: [PATCH] stepper badge update + injected wallet + smaller fixes

---
 src/components/BloodChart.vue       |  4 ---
 src/components/ConnectWallet.vue    | 30 +++++++++++++----
 src/components/RewardsWrapper.vue   |  2 +-
 src/components/SacrificeToken.vue   | 34 +++++++++++++++----
 src/components/StakeComponentV1.vue |  5 +++
 src/components/TokenLogo.vue        |  2 +-
 src/main.js                         | 22 +++++++++---
 src/stores/cycles.js                | 17 ++++++----
 src/stores/sacrifice.js             |  2 +-
 src/stores/tokens.js                | 52 ++++++++++++++++++++++++++---
 10 files changed, 133 insertions(+), 37 deletions(-)

diff --git a/src/components/BloodChart.vue b/src/components/BloodChart.vue
index 8493409..7f1d9c9 100644
--- a/src/components/BloodChart.vue
+++ b/src/components/BloodChart.vue
@@ -213,10 +213,6 @@ function getPercentageBloodChart(amount, goal) {
 .swiper-slide
     width: 80px
 
-.swiper-test
-    display: flex
-    flex-direction: column
-
 
 .blood-arrow
     min-width: 30px
diff --git a/src/components/ConnectWallet.vue b/src/components/ConnectWallet.vue
index abffc51..5547724 100644
--- a/src/components/ConnectWallet.vue
+++ b/src/components/ConnectWallet.vue
@@ -5,15 +5,24 @@
 			<div class="connectors-wrapper">
 				<div
 					class="connectors-element card"
+					:class="[[connector.id]]"
 					v-for="connector in walletStore.config?.connectors"
 					@click="connectWallet(connector)"
 				>
 					<div class="connector-icon">
-						<img :src="`/assets/img/connectors/${connector.id}.svg`" :alt="`${connector.name} Logo`" />
+						<template v-if="connector.id === 'injected'">
+							<font-awesome-icon :icon="['fas', 'wallet']" />
+						</template>
+						<template v-else>
+							<img :src="`/assets/img/connectors/${connector.id}.svg`" :alt="`${connector.name} Logo`" />
+						</template>
 					</div>
 					<div class="connector-name">
 						<template
-							v-if="connector.id !== 'metaMask' || (connector.id === 'metaMask' && isMetaMaskInstalled())"
+							v-if="
+								connector.id !== 'metaMask' ||
+								(connector.id === 'metaMask' && isMetaMaskInstalled(connector))
+							"
 						>
 							{{ connector.name }}
 						</template>
@@ -95,10 +104,9 @@ async function disconnectWallet() {
 	}
 }
 
-function isMetaMaskInstalled() {
-	//metamask is not installed but showing true, is that a bug?
-	if (typeof window.ethereum !== "undefined" && window.ethereum?.isMetaMask && !window.ethereum.isBraveWallet) {
-		console.log("MetaMask is installed!", window.ethereum);
+function isMetaMaskInstalled(connector) {
+	const metamaskInstalled = connector?.options?.getProvider();
+	if (metamaskInstalled) {
 		return true;
 	}
 	return false;
@@ -124,7 +132,7 @@ function badgeClick(token) {
 
 //special case for metaMask, but I think that is the most used wallet
 async function connectWallet(connector) {
-	if (connector.id === "metaMask" && !isMetaMaskInstalled()) {
+	if (connector.id === "metaMask" && !isMetaMaskInstalled(connector)) {
 		window.open(" https://metamask.io/", "_blank");
 		return;
 	}
@@ -151,6 +159,14 @@ async function connectWallet(connector) {
             &:hover, &:active, &:focus
                 background-color: lighten(#858585, 20%)
                 cursor: pointer
+            &.injected
+                .connector-icon
+                    background-color: white
+                    display: flex
+                    justify-content: center
+                    align-items: center
+                    svg
+                        font-size: 25px
             .connector-icon
                 border-radius: 12px
                 width: 40px
diff --git a/src/components/RewardsWrapper.vue b/src/components/RewardsWrapper.vue
index 73b2b46..eca37de 100644
--- a/src/components/RewardsWrapper.vue
+++ b/src/components/RewardsWrapper.vue
@@ -17,7 +17,7 @@ import TokenLogo from "@/components/TokenLogo.vue";
 const props = defineProps({
 	title: String,
 	info: String,
-	amount: String,
+	amount: [String, Number],
 	image: String,
 });
 </script>
diff --git a/src/components/SacrificeToken.vue b/src/components/SacrificeToken.vue
index 3bf4a72..4105d59 100644
--- a/src/components/SacrificeToken.vue
+++ b/src/components/SacrificeToken.vue
@@ -45,9 +45,17 @@
 					:logo="activeToken.logo"
 				>
 					<template v-slot:message>
-						<div class="sacrifice-adder-step bloodline-badge" @click="addTokens(10000000)">+10m</div>
-						<div class="sacrifice-adder-step bloodline-badge" @click="addTokens(100000000)">+100m</div>
-						<div class="sacrifice-adder-step bloodline-badge" @click="addTokens(1000000000)">+1b</div>
+						<div
+							class="sacrifice-adder-step bloodline-badge"
+							v-for="steps in activeToken.addSteps"
+							:key="steps.name"
+							@click="addTokens(steps.amount)"
+						>
+							<template v-if="sacrificeStore.sacrificeNumber < activeWalletToken.balanceOf">
+								+{{ steps.name }}
+							</template>
+							<template v-else> -{{ steps.name }} </template>
+						</div>
 					</template>
 					<template v-slot:message-end v-if="activeWalletToken?.balanceOf">
 						<div class="input-balance tiny-text">
@@ -192,6 +200,7 @@ const output = ref(0);
 const stakingOutput = ref(null);
 const blockEvent = ref(null);
 const approveToast = ref(null);
+const addOperator = ref(true);
 /**
  * state 0 enter amount
  * state 1 rdy to go
@@ -277,15 +286,25 @@ async function approveToken(amount) {
 }
 
 async function addTokens(value) {
-	sacrificeStore.sacrificeNumber = Number(sacrificeStore.sacrificeNumber) + Number(value);
+	if (sacrificeStore.sacrificeNumber < activeWalletToken.value.balanceOf) {
+		sacrificeStore.sacrificeNumber = Number(sacrificeStore.sacrificeNumber) + Number(value);
+	} else {
+		sacrificeStore.sacrificeNumber = Number(sacrificeStore.sacrificeNumber) - Number(value);
+		if (sacrificeStore.sacrificeNumber < 0) {
+			sacrificeStore.sacrificeNumber = 0;
+		}
+	}
+
 	const rewardValue = await sacrificeStore.getRewardsFor(sacrificeStore.sacrificeNumber, activeToken.value);
 	output.value = rewardValue.output;
 	stakingOutput.value = rewardValue.staking;
 }
 
 async function addMaxTokens() {
+	addOperator.value = !addOperator.value;
 	sacrificeStore.sacrificeNumber = activeWalletToken.value.balanceOf;
 	const rewardValue = await sacrificeStore.getRewardsFor(sacrificeStore.sacrificeNumber, activeToken.value);
+	console.log("rewardValue", rewardValue);
 	output.value = rewardValue.output;
 	stakingOutput.value = rewardValue.staking;
 }
@@ -454,7 +473,8 @@ async function changeActiveToken(token) {
             display: flex
             gap: 6px
             .sacrifice-adder-step
-                font-size: 14px
+                font-size: 12px
+                align-items: center
                 background: var(--grey, #858585)
                 color: var(--midnight-black, #0F0F0F)
                 &:hover,
@@ -462,8 +482,8 @@ async function changeActiveToken(token) {
                 &:focus
                     background-color: var(--grey-light)
                     cursor: pointer
-                @media (min-width: 992px)
-                    font-size: 12px
+                // @media (min-width: 992px)
+                //     font-size: 12px
             // .sacrifice-adder-balance
             //     margin-left: auto
             // .sacrifice-adder-max
diff --git a/src/components/StakeComponentV1.vue b/src/components/StakeComponentV1.vue
index 689bdee..06dd6b2 100644
--- a/src/components/StakeComponentV1.vue
+++ b/src/components/StakeComponentV1.vue
@@ -172,6 +172,11 @@ const props = defineProps({
 		required: false,
 		default: null,
 	},
+	dense: {
+		type: Boolean,
+		required: false,
+		default: false,
+	},
 });
 
 const stakeMenu = ref(false);
diff --git a/src/components/TokenLogo.vue b/src/components/TokenLogo.vue
index 8e75e55..f3632d1 100644
--- a/src/components/TokenLogo.vue
+++ b/src/components/TokenLogo.vue
@@ -7,7 +7,7 @@
 <script setup>
 const props = defineProps({
 	img: String,
-	alt: Number,
+	alt: String,
 	size: {
 		type: Number,
 		default: 45,
diff --git a/src/main.js b/src/main.js
index c05ca7e..92ba2e8 100644
--- a/src/main.js
+++ b/src/main.js
@@ -38,7 +38,7 @@ import { library } from '@fortawesome/fontawesome-svg-core'
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
 
 /* import specific icons */
-import { faArrowDown, faArrowRight, faSpinner, faPlus, faCaretLeft, faCaretRight, faBars, faAnglesRight, faChevronDown, faChevronUp, faArrowRightToBracket, faArrowRightFromBracket, faDroplet, faMoon, faPerson } from "@fortawesome/free-solid-svg-icons";
+import { faArrowDown, faArrowRight, faSpinner, faPlus, faCaretLeft, faCaretRight, faBars, faAnglesRight, faChevronDown, faChevronUp, faArrowRightToBracket, faArrowRightFromBracket, faDroplet, faMoon, faPerson, faWallet } from "@fortawesome/free-solid-svg-icons";
 
 import { faDiscord, faTwitter, faTelegram } from "@fortawesome/free-brands-svg-icons";
 
@@ -65,9 +65,20 @@ library.add(
 	faChevronUp,
     faDroplet,
     faMoon,
-    faPerson
+    faPerson,
+    faWallet
 );
 
+var logging = localStorage.getItem("LOGGING");
+if (logging === "true") {
+} else {
+	if (!window.console) window.console = {};
+	var methods = ["log", "debug", "warn", "info"];
+	for (let i = 0; i < methods.length; i++) {
+		console[methods[i]] = function () {};
+	}
+}
+
 const app = createApp(App)
 
 
@@ -109,7 +120,10 @@ try {
 				},
 			}),
 			new MetaMaskConnector({ chains }),
-			// new InjectedConnector({ chains }),
+			new InjectedConnector({
+				chains,
+				getProvider: () => (typeof window !== "undefined" ? window.myInjectedWallet : undefined),
+			}),
 			new WalletConnectConnector({
 				chains,
 				options: {
@@ -152,7 +166,7 @@ try {
 			console.log("CycleCompleted", log);
 			await cycleStore.fillCycle(cycleStore.currentCycle);
 			cycleStore.currentCycle++;
-			await cycleStore.fillCycle(cycleStore.currentCycle);
+            await cycleStore.fillCycle(cycleStore.currentCycle);
 		}
 	);
 
diff --git a/src/stores/cycles.js b/src/stores/cycles.js
index 0d45536..d95bb8e 100644
--- a/src/stores/cycles.js
+++ b/src/stores/cycles.js
@@ -67,13 +67,16 @@ export const useCycleStore = defineStore("cycles", {
             var data = await memeBurnerStore.getSacrificedCycle(this.currentCycle);
             console.log("this.currentCycle", this.currentCycle);
             console.log("this.cycles", this.cycles);
-			var tokenIndex = this.cycles[this.currentCycle]?.token.findIndex(
-				(tokenData) => tokenData.contractAddress === sacrificedToken
-            );
-            console.log("tokenIndex", tokenIndex);
-            const token = tokenStore.getToken(sacrificedToken);
-            this.cycles[this.currentCycle].token[tokenIndex].amount =
-                Number(data[tokenIndex].result[1]) / Math.pow(10, token.decimals)
+            if (this.cycles[this.currentCycle]) {
+                var tokenIndex = this.cycles[this.currentCycle].token.findIndex(
+					(tokenData) => tokenData.contractAddress === sacrificedToken
+				);
+				console.log("tokenIndex", tokenIndex);
+				const token = tokenStore.getToken(sacrificedToken);
+				this.cycles[this.currentCycle].token[tokenIndex].amount =
+					Number(data[tokenIndex].result[1]) / Math.pow(10, token.decimals);
+            }
+				
         },
         /**
          * main function to fill a round, will not be filled when already loaded
diff --git a/src/stores/sacrifice.js b/src/stores/sacrifice.js
index b8be191..a06f05a 100644
--- a/src/stores/sacrifice.js
+++ b/src/stores/sacrifice.js
@@ -55,7 +55,7 @@ export const useSacrificeStore = defineStore("sacrifice", {
                 // });
                 
                 var rewardData = data.logs.filter((logObject) => {
-					return logObject.topics.filter(
+					return logObject.topics.find(
 						(topic) => topic === "0x5e60ccd3c81486143d815dce24867a494d7fee585a0a44282cf479b19a5186ee"
 					);
 				});
diff --git a/src/stores/tokens.js b/src/stores/tokens.js
index e00ecdd..87153d7 100644
--- a/src/stores/tokens.js
+++ b/src/stores/tokens.js
@@ -12,8 +12,8 @@ import { multicall, getContract, fetchToken, getWalletClient, waitForTransaction
 
 
 export const useTokenStore = defineStore("token", {
-    state: () => ({
-        //some static data for the coin
+	state: () => ({
+		//some static data for the coin
 		token: [
 			{
 				name: "$PEPE",
@@ -28,6 +28,20 @@ export const useTokenStore = defineStore("token", {
 				backgroundColor: "#4b8501",
 				abi: Meme1Json.abi,
 				contractAddress: Meme1Json.contractAddress,
+				addSteps: [
+					{
+						amount: 10000000,
+						name: "10m",
+					},
+					{
+						amount: 100000000,
+						name: "100m",
+					},
+					{
+						amount: 1000000000,
+						name: "1b",
+					},
+				],
 			},
 			{
 				name: "$SHIB",
@@ -41,6 +55,20 @@ export const useTokenStore = defineStore("token", {
 				},
 				abi: Meme2Json.abi,
 				contractAddress: Meme2Json.contractAddress,
+				addSteps: [
+					{
+						amount: 1000000,
+						name: "1m",
+					},
+					{
+						amount: 10000000,
+						name: "10m",
+					},
+					{
+						amount: 100000000,
+						name: "100m",
+					},
+				],
 			},
 			{
 				name: "$ELON",
@@ -54,6 +82,20 @@ export const useTokenStore = defineStore("token", {
 				},
 				abi: Meme3Json.abi,
 				contractAddress: Meme3Json.contractAddress,
+				addSteps: [
+					{
+						amount: 10000000,
+						name: "10m",
+					},
+					{
+						amount: 100000000,
+						name: "100m",
+					},
+					{
+						amount: 1000000000,
+						name: "1b",
+					},
+				],
 			},
 			// {
 			// 	name: "$BITCOIN",
@@ -62,8 +104,8 @@ export const useTokenStore = defineStore("token", {
 			// 	vamp: {
 			// 		logo: "/assets/img/token/bitcoin.png",
 			// 		name: "$ELON Vamp Token",
-            //      winner: "/assets/img/token/bitcoinwinner.png"
-            //      winner2: "/assets/img/token/bitcoinwinnerborder.png"
+			//      winner: "/assets/img/token/bitcoinwinner.png"
+			//      winner2: "/assets/img/token/bitcoinwinnerborder.png"
 			// 	},
 			// 	abi: Meme4Json.abi,
 			// 	contractAddress: Meme4Json.contractAddress,
@@ -133,7 +175,7 @@ export const useTokenStore = defineStore("token", {
 			} catch (error) {
 				console.error("initV2", error);
 			}
-        },
+		},
 		async allowance() {
 			console.log("allowance");
 			const walletStore = useWalletStoreV2();