diff --git a/src/img/unaboomer_bw.png b/src/img/unaboomer_bw.png new file mode 100644 index 0000000..79b9555 Binary files /dev/null and b/src/img/unaboomer_bw.png differ diff --git a/src/index.js b/src/index.js index 3417fd3..b294a06 100644 --- a/src/index.js +++ b/src/index.js @@ -40,11 +40,11 @@ const wagmiClient = createClient({ ReactDOM.createRoot(document.getElementById("root")).render( - +
@@ -53,4 +53,5 @@ ReactDOM.createRoot(document.getElementById("root")).render( ); +// 0x97a8a91563a9c6a9fbdb5d37656d4022f2838928 - goerli // 0x5FbDB2315678afecb367f032d93F642f64180aa3 - local \ No newline at end of file diff --git a/src/styles/sections.css b/src/styles/sections.css index 21c5131..9d0bb0f 100644 --- a/src/styles/sections.css +++ b/src/styles/sections.css @@ -175,18 +175,6 @@ 100% { opacity: 1 } } -#killLeader { - margin: .5em 0 .5em 0; - position: absolute; - z-index: 99; - background-color: rgba(0,0,0,.6); - padding: 2px; - border-radius: 4px; - text-align: center; - right: 0; - padding: .75em; -} - .nopad { padding: 0; margin: 0; @@ -273,4 +261,24 @@ float: right; line-height: 1em; padding-right: 8px; +} + +#userInventory { + margin: 0 0 4em 0; +} + +#userInventory h1 { + margin: 0 0 1em 0; +} + +.ownedTokens { + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: center; +} + +.ownedToken { + height: 100%; + flex: 0 12%; } \ No newline at end of file diff --git a/src/template/Sections.jsx b/src/template/Sections.jsx index 6aaf917..cbbed61 100644 --- a/src/template/Sections.jsx +++ b/src/template/Sections.jsx @@ -1,6 +1,6 @@ import React, { useState, useEffect } from 'react'; import { ethers, BigNumber } from 'ethers'; -import { useAccount, useContractReads, useContractRead, usePrepareContractWrite, useContractWrite, useWaitForTransaction } from 'wagmi'; +import { useAccount, useContractReads, useContractRead, usePrepareContractWrite, useContractWrite, useWaitForTransaction, erc721ABI } from 'wagmi'; import { Parallax } from 'react-parallax'; import { NotificationContainer, NotificationManager } from 'react-notifications'; import { AwesomeButton } from 'react-awesome-button'; @@ -10,6 +10,7 @@ import Slider from 'rc-slider'; import LZA from '../img/lza_menace.png'; import Carty from '../img/cartyisme.png'; +import BoomerBW from '../img/unaboomer_bw.png'; import Boomer from '../img/unaboomer.png'; import Newspapers from '../img/newspapers.png'; import Bomb from '../img/bomb.png'; @@ -41,7 +42,7 @@ export class Section1 extends React.Component {

- Pixelated police sketch of the Unabomber suspect. + Pixelated police sketch of the Unabomber suspect.
@@ -170,6 +171,15 @@ class GameMap extends React.Component { function Section3(props) { const contractAddress = props.contractAddress; + const [tokensMinted, setTokensMinted] = useState(() => { + const saved = localStorage.getItem('tokensMinted0'); + return saved || JSON.stringify([]) + }); + + useEffect(() => { + localStorage.setItem('tokensMinted0', tokensMinted); + }, [tokensMinted]); + const [options, setOptions] = useState({ unaboomerAmount: 1, bombAmount: 1, @@ -193,7 +203,8 @@ function Section3(props) { unaboomerMaxSurvivorCount: 0, unaboomerMaxMintPerWallet: 0, readWTF: false, - balancesFetched: false + balancesFetched: false, + unaboomersByAddress: [] }); function handleStateChange(obj) { setOptions(preState => ({...preState , ...obj})); @@ -372,6 +383,23 @@ function Section3(props) { if (data.message.startsWith('user rejected transaction')) NotificationManager.info(`tx cancelled`, 'ok', 4000); } }); + useWaitForTransaction({ + hash: radicalizeBoomersWrite.data?.hash, + enabled: radicalizeBoomersWrite.status === 'success', + onSuccess(data) { + let tm = JSON.parse(tokensMinted); + const iface = new ethers.utils.Interface(erc721ABI); + data.logs.filter(log => + log.topics[0] === '0xddf252ad1be2c89b69c2b068fc378daa952ba7f163c4a11628f55a4df523b3ef' + ).map((log) => { + const res = iface.decodeEventLog("Transfer", log.data, log.topics); + NotificationManager.success(`You radicalized Unaboomer #${res.tokenId.toString()}`, '', 4000); + tm.push(Number(res.tokenId)); + }); + setTokensMinted(JSON.stringify(tm)); + console.log(tm); + } + }) useWaitForTransaction({ hash: sendBombsWrite.data?.hash, enabled: sendBombsWrite.status === 'success', @@ -383,15 +411,14 @@ function Section3(props) { const res = iface.decodeEventLog("SentBomb", log.data, log.topics); if (res.hit) { if (res.owned) { - NotificationManager.error(`Your bomb exploded during assembly and killed your Unaboomer ${res.tokenId.toString()}`, 'oof', 8000); + NotificationManager.error(`Your bomb exploded during assembly and killed your Unaboomer ${res.tokenId.toString()}`, '', 8000); } else { - NotificationManager.success(`Your bomb killed Unaboomer ${res.tokenId.toString()}`, 'Got em!', 8000); + NotificationManager.success(`Your bomb killed Unaboomer ${res.tokenId.toString()}`, '', 8000); } } else { - NotificationManager.warning(`Your bomb for Unaboomer ${res.tokenId.toString()} was a dud`, 'oof', 8000); + NotificationManager.warning(`Your bomb for Unaboomer ${res.tokenId.toString()} was a dud`, '', 8000); } - - }) + }); } }); return ( @@ -523,10 +550,27 @@ function Section3(props) { ) ||

no bombs

}
+ +
+ {isConnected && JSON.parse(tokensMinted).length > 0 && ( + <> +

Your Unaboomers

+
+ {JSON.parse(tokensMinted).map((id, idx) => ( +
+ +
+ ))} +
+ + )} +
)} + + - + } {isConnected && options.unaboomerMaxSupply > 0 && ( <> @@ -578,7 +622,7 @@ function Trollbox(props) { useEffect(() => { localStorage.setItem('trollboxHistory', history); - }, [history]) + }, [history]); const connectionStatus = { [ReadyState.CONNECTING]: 'Connecting',