ethshit
/
unaboomer-site
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

new abi, better prop inputs, better ux for stuff

Browse Source
master
lza_menace 2 years ago
parent 2b500540a7
commit 04b7ff7749
3 changed files with 82 additions and 29 deletions
Show Stats Download Patch File Download Diff File

19
src/abi/main.json
Unescape Escape View File

@ -390,6 +390,25 @@
"stateMutability": "view", "stateMutability": "view",
"type": "function" "type": "function"
}, },
{
"inputs": [
{
"internalType": "address",
"name": "_address",
"type": "address"
}
],
"name": "unaboomersMinted",
"outputs": [
{
"internalType": "uint256",
"name": "",
"type": "uint256"
}
],
"stateMutability": "view",
"type": "function"
},
{ {
"inputs": [], "inputs": [],
"name": "unaboomersRadicalized", "name": "unaboomersRadicalized",

27
src/index.js
Unescape Escape View File

@ -37,24 +37,29 @@ const wagmiClient = createClient({
webSocketProvider webSocketProvider
}); });
let chainId;
let contractAddress;
if (process.env.CHAIN == '5') {
chainId = 5;
contractAddress = '0x31205d753eC2784160F70E6E6177581c7721bD0E';
} else if (process.env.CHAIN == '1') {
chainId = 1;
contractAddress = '';
} else {
chainId = 1337;
contractAddress = '0x5FbDB2315678afecb367f032d93F642f64180aa3';
}
ReactDOM.createRoot(document.getElementById("root")).render( ReactDOM.createRoot(document.getElementById("root")).render(
<ParallaxProvider> <ParallaxProvider>
<WagmiConfig client={wagmiClient}> <WagmiConfig client={wagmiClient}>
<RainbowKitProvider chains={chains} initialChain={5}> <RainbowKitProvider chains={chains} initialChain={chainId}>
<Wallet /> <Wallet />
<div className="scrollContainer"> <div className="scrollContainer">
<AllSections contractAddress={'0x31205d753eC2784160F70E6E6177581c7721bD0E'} /> <AllSections contractAddress={contractAddress} />
</div> </div>
</RainbowKitProvider> </RainbowKitProvider>
</WagmiConfig> </WagmiConfig>
</ParallaxProvider> </ParallaxProvider>
); );
// goerli
// 5
// 0x31205d753ec2784160f70e6e6177581c7721bd0e
// local
// 1337
// 0x5FbDB2315678afecb367f032d93F642f64180aa3

65
src/template/Sections.jsx
Unescape Escape View File

@ -124,7 +124,7 @@ class GameMap extends React.Component {
<h1 id="gameMapTitle">Metaverse Map</h1> <h1 id="gameMapTitle">Metaverse Map</h1>
<p id="gameMapText"> <p id="gameMapText">
{this.props.unaboomersRadicalized} / {this.props.unaboomerMaxSupply} Unaboomers radicalized and ready to terrorize the metaverse. <br /> {this.props.unaboomersRadicalized} / {this.props.unaboomerMaxSupply} Unaboomers radicalized and ready to terrorize the metaverse. <br />
{this.props.unaboomerMaxSupply - this.props.unaboomerMaxSurvivorCount} potential Unaboomers remain.<br /> {this.props.unaboomerMaxSupply - this.props.unaboomerMaxSurvivorCount - this.props.unaboomersRadicalized} potential Unaboomers remain.<br />
This round will end and the project will fully start when {this.props.unaboomerMaxSurvivorCount} or less Unaboomers remain standing.<br /> This round will end and the project will fully start when {this.props.unaboomerMaxSurvivorCount} or less Unaboomers remain standing.<br />
</p> </p>
{this.props.unaboomersRadicalized > 0 && ( {this.props.unaboomersRadicalized > 0 && (
@ -174,7 +174,7 @@ function Section3(props) {
sendBombPreviewAmount: 1, sendBombPreviewAmount: 1,
unaboomerPrice: 0, unaboomerPrice: 0,
bombPrice: ethers.utils.parseEther('.01'), bombPrice: ethers.utils.parseEther('.01'),
unaboomerBalance: 0, unaboomersMinted: 0,
bombBalance: 0, bombBalance: 0,
unaboomersRadicalized: 0, unaboomersRadicalized: 0,
bombsAssembled: 0, bombsAssembled: 0,
@ -186,7 +186,8 @@ function Section3(props) {
unaboomerMaxSupply: 0, unaboomerMaxSupply: 0,
unaboomerMaxSurvivorCount: 0, unaboomerMaxSurvivorCount: 0,
unaboomerMaxMintPerWallet: 0, unaboomerMaxMintPerWallet: 0,
readWTF: false readWTF: false,
balancesFetched: false
}); });
function handleStateChange(obj) { function handleStateChange(obj) {
setOptions(preState => ({...preState , ...obj})); setOptions(preState => ({...preState , ...obj}));
@ -238,7 +239,7 @@ function Section3(props) {
contracts: [ contracts: [
{ {
...defOpt, ...defOpt,
functionName: 'unaboomerBalance', functionName: 'unaboomersMinted',
args: [address] args: [address]
}, },
{ {
@ -271,13 +272,14 @@ function Section3(props) {
cacheTime: 6_000, cacheTime: 6_000,
onSuccess(data) { onSuccess(data) {
handleStateChange({ handleStateChange({
unaboomerBalance: Number(data[0]), unaboomersMinted: Number(data[0]),
bombBalance: Number(data[1]), bombBalance: Number(data[1]),
unaboomersRadicalized: Number(data[2]), unaboomersRadicalized: Number(data[2]),
bombsAssembled: Number(data[3]), bombsAssembled: Number(data[3]),
bombsExploded: Number(data[4]), bombsExploded: Number(data[4]),
unaboomersKilled: Number(data[5]), unaboomersKilled: Number(data[5]),
leaderboardPointer: Number(data[6]) leaderboardPointer: Number(data[6]),
balancesFetched: true
}); });
} }
}); });
@ -312,7 +314,7 @@ function Section3(props) {
const radicalizeBoomersPrepare = usePrepareContractWrite({ const radicalizeBoomersPrepare = usePrepareContractWrite({
address: contractAddress, address: contractAddress,
abi: MainABI, abi: MainABI,
enabled: isConnected, enabled: isConnected && options.unaboomersMinted < options.unaboomerMaxMintPerWallet && options.unaboomerAmount > 0 && options.balancesFetched,
functionName: 'radicalizeBoomers', functionName: 'radicalizeBoomers',
args: [options.unaboomerAmount], args: [options.unaboomerAmount],
overrides: { overrides: {
@ -320,11 +322,16 @@ function Section3(props) {
value: BigNumber.from((options.unaboomerPrice * options.unaboomerAmount).toString()) value: BigNumber.from((options.unaboomerPrice * options.unaboomerAmount).toString())
} }
}); });
const radicalizeBoomersWrite = useContractWrite(radicalizeBoomersPrepare.config); const radicalizeBoomersWrite = useContractWrite({
...radicalizeBoomersPrepare.config,
onError(data) {
if (data.message.startsWith('user rejected transaction')) NotificationManager.info(`tx cancelled`, 'ok', 4000);
}
});
const assembleBombsPrepare = usePrepareContractWrite({ const assembleBombsPrepare = usePrepareContractWrite({
address: contractAddress, address: contractAddress,
abi: MainABI, abi: MainABI,
enabled: isConnected, enabled: isConnected && options.bombAmount > 0,
functionName: 'assembleBombs', functionName: 'assembleBombs',
args: [options.bombAmount], args: [options.bombAmount],
overrides: { overrides: {
@ -332,16 +339,26 @@ function Section3(props) {
value: BigNumber.from((options.bombPrice * options.bombAmount).toString()) value: BigNumber.from((options.bombPrice * options.bombAmount).toString())
} }
}); });
const assembleBombsWrite = useContractWrite(assembleBombsPrepare.config); const assembleBombsWrite = useContractWrite({
...assembleBombsPrepare.config,
onError(data) {
if (data.message.startsWith('user rejected transaction')) NotificationManager.info(`tx cancelled`, 'ok', 4000);
}
});
const sendBombsPrepare = usePrepareContractWrite({ const sendBombsPrepare = usePrepareContractWrite({
address: contractAddress, address: contractAddress,
abi: MainABI, abi: MainABI,
enabled: isConnected && options.bombBalance > 0, enabled: isConnected && options.bombBalance > 0,
staleTime: 2_000,
functionName: 'sendBombs', functionName: 'sendBombs',
cacheTime: 1000,
args: [options.sendBombAmount] args: [options.sendBombAmount]
}); });
const sendBombsWrite = useContractWrite(sendBombsPrepare.config); const sendBombsWrite = useContractWrite({
...sendBombsPrepare.config,
onError(data) {
if (data.message.startsWith('user rejected transaction')) NotificationManager.info(`tx cancelled`, 'ok', 4000);
}
});
useWaitForTransaction({ useWaitForTransaction({
hash: sendBombsWrite.data?.hash, hash: sendBombsWrite.data?.hash,
enabled: sendBombsWrite.status === 'success', enabled: sendBombsWrite.status === 'success',
@ -431,24 +448,30 @@ function Section3(props) {
<div className="mintItem"> <div className="mintItem">
<h1>Radicalize a Boomer</h1> <h1>Radicalize a Boomer</h1>
<p>Radicalizing a boomer will mint ERC-721 BOOMR tokens with images of a pixel art Web3 Unaboomers.</p> <p>Radicalizing a boomer will mint ERC-721 BOOMR tokens with images of a pixel art Web3 Unaboomers.</p>
<p>You have {options.unaboomerBalance} / {options.unaboomerMaxMintPerWallet} BOOMR</p> <p>You have {options.unaboomersMinted} / {options.unaboomerMaxMintPerWallet} BOOMR</p>
<img src={Boomer} alt="" width="120px" /> <img src={Boomer} alt="" width="120px" />
{options.unaboomerBalance < options.unaboomerMaxMintPerWallet && options.unaboomersKilled + options.unaboomersRadicalized < options.unaboomerMaxSupply && ( {options.unaboomersMinted < options.unaboomerMaxMintPerWallet && options.unaboomersKilled + options.unaboomersRadicalized < options.unaboomerMaxSupply && (
<> <>
<p> <p>
<AwesomeButton type="secondary" ripple={true} disabled={radicalizeBoomersPrepare.status == 'error'} onPress={() => radicalizeBoomersWrite.write?.()}> <AwesomeButton type="secondary" ripple={true} disabled={radicalizeBoomersPrepare.status == 'error'} onPress={() => {
radicalizeBoomersWrite.write?.();
handleStateChange({
unaboomerAmount: 1,
unaboomerPreviewAmount: 1
})
}}>
{radicalizeBoomersWrite.isLoading && <>minting {options.unaboomerAmount}</>} {radicalizeBoomersWrite.isLoading && <>minting {options.unaboomerAmount}</>}
{radicalizeBoomersWrite.isIdle && <>mint {options.unaboomerPreviewAmount} ({ethers.utils.formatEther((options.unaboomerPrice * options.unaboomerPreviewAmount).toString())} Ξ)</>} {radicalizeBoomersWrite.isIdle && <>mint {options.unaboomerPreviewAmount} ({ethers.utils.formatEther((options.unaboomerPrice * options.unaboomerPreviewAmount).toString())} Ξ)</>}
{radicalizeBoomersWrite.isSuccess && <>sent</>} {radicalizeBoomersWrite.isSuccess && <>sent</>}
{radicalizeBoomersWrite.isError && <>error</>} {radicalizeBoomersWrite.isError && <>error</>}
</AwesomeButton> </AwesomeButton>
</p> </p>
<Slider className="slider" min={1} max={options.unaboomerMaxMintPerWallet - options.unaboomerBalance} onAfterChange={(v) => handleStateChange({unaboomerAmount: v})} onChange={(v) => { <Slider className="slider" min={1} max={options.unaboomerMaxMintPerWallet - options.unaboomersMinted} onAfterChange={(v) => handleStateChange({unaboomerAmount: v})} onChange={(v) => {
handleStateChange({unaboomerPreviewAmount: v}); handleStateChange({unaboomerPreviewAmount: v});
radicalizeBoomersWrite.reset(); radicalizeBoomersWrite.reset();
}} /> }} />
</> </>
) || options.unaboomerBalance < options.unaboomerMaxMintPerWallet && options.unaboomersKilled + options.unaboomersRadicalized < options.unaboomerMaxSupply && ( ) || options.unaboomersMinted == options.unaboomerMaxMintPerWallet && options.unaboomersKilled + options.unaboomersRadicalized < options.unaboomerMaxSupply && (
<h2>max per wallet reached</h2> <h2>max per wallet reached</h2>
) || ( ) || (
<h2>max supply reached</h2> <h2>max supply reached</h2>
@ -479,7 +502,13 @@ function Section3(props) {
<img src={Explosion} alt="" width="120px" /> <img src={Explosion} alt="" width="120px" />
{options.bombBalance > 0 && (<> {options.bombBalance > 0 && (<>
<p> <p>
<AwesomeButton type="secondary" ripple={true} disabled={sendBombsPrepare.status == 'error'} onPress={() => sendBombsWrite.write?.()}> <AwesomeButton type="secondary" ripple={true} disabled={sendBombsPrepare.status == 'error'} onPress={() => {
sendBombsWrite.write?.();
handleStateChange({
sendBombAmount: 1,
sendBombPreviewAmount: 1
});
}}>
{sendBombsWrite.isLoading && <>sending {options.sendBombAmount}</>} {sendBombsWrite.isLoading && <>sending {options.sendBombAmount}</>}
{sendBombsWrite.isIdle && <>send {options.sendBombPreviewAmount} (~0 Ξ)</>} {sendBombsWrite.isIdle && <>send {options.sendBombPreviewAmount} (~0 Ξ)</>}
{sendBombsWrite.isSuccess && <>sent</>} {sendBombsWrite.isSuccess && <>sent</>}

Write Preview
Loading…
Cancel
Save