ethshit
/
tubbymemes
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor tip ux, get it all working

Browse Source
main
lza_menace 3 years ago
parent 4a09d3c62d
commit 265f7be78e
2 changed files with 86 additions and 52 deletions
Show Stats Download Patch File Download Diff File

2
suchwowx/config.py
Unescape Escape View File

@ -22,12 +22,14 @@ TEMPLATES_AUTO_RELOAD = getenv('TEMPLATES_AUTO_RELOAD', True)
# Contract # Contract
CONTRACT_TESTNET = getenv('TESTNET', True) CONTRACT_TESTNET = getenv('TESTNET', True)
CONTRACT_OWNER = 'lzamenace.eth'
if CONTRACT_TESTNET: if CONTRACT_TESTNET:
WOWX_ADDRESS = '0xc6B039b1e0be1ba0B433f319898438E782E5dEBA' # WOWX testnet WOWX_ADDRESS = '0xc6B039b1e0be1ba0B433f319898438E782E5dEBA' # WOWX testnet
CONTRACT_ADDRESS = '0xE1b6483729557E539cfD9c3Bdb754C54c16cFCe7' # SWX testnet CONTRACT_ADDRESS = '0xE1b6483729557E539cfD9c3Bdb754C54c16cFCe7' # SWX testnet
else: else:
WOWX_ADDRESS = '0xba5dc7e77d150816b758e9826fcad2d74820e379' # WOWX mainnet WOWX_ADDRESS = '0xba5dc7e77d150816b758e9826fcad2d74820e379' # WOWX mainnet
CONTRACT_ADDRESS = '' # SWX mainnet CONTRACT_ADDRESS = '' # SWX mainnet
CONTRACT_ABI = [ CONTRACT_ABI = [
{ {
"inputs": [ "inputs": [

128
suchwowx/templates/meme.html
Unescape Escape View File

@ -43,9 +43,11 @@
{% if meme.meme_ipfs_hash %} {% if meme.meme_ipfs_hash %}
<p><strong>Meme IPFS:</strong> <a href="{{ meme_url }}" target=_self>{{ meme.meme_ipfs_hash }}</a></p> <p><strong>Meme IPFS:</strong> <a href="{{ meme_url }}" target=_self>{{ meme.meme_ipfs_hash }}</a></p>
{% endif %} {% endif %}
<p><strong>WOW Tips:</strong> <span id="wowTips">?</span></p> <p><strong>Tips Received:</strong>
<p><strong>WOWX Tips:</strong> <span id="wowxTips">?</span></p> <span id="wowTips">?</span> WOW,
<p><strong>AVAX Tips:</strong> <span id="wowxTips">?</span></p> <span id="wowxTips">?</span> WOWX,
<span id="avaxTips">?</span> AVAX
</p>
{% if not meme.approved %} {% if not meme.approved %}
<br/> <br/>
@ -61,23 +63,20 @@
<br/> <br/>
<div id="tipButtons" class="columns" style="display:none;"> <div id="tipButtons" class="columns" style="display:none;">
<div class="column"> <div class="column">
<a class="button is-info is-12" onclick="tipWOW()" id="tipWOWButton" style="width:100%;">Tip WOW</a> <a class="button is-info is-12" onclick="tipWOW()" id="tipWOWButton" style="width:100%;">Tip via p2p WOW</a>
</div>
<div class="column">
<a class="button is-info is-12" onclick="tipAVAX()" id="tipAVAXButton" style="width:100%;">Tip AVAX</a>
</div> </div>
<div class="column"> <div class="column">
<a class="button is-info is-12" onclick="tipWOWX()" id="tipWOWXButton" style="width:100%;">Tip WOWX</a> <a class="button is-info is-12" onclick="tipSC()" id="tipSCButton" style="width:100%;">Tip via Smart Contract</a>
</div> </div>
</div> </div>
<div id="mintButtons" class="columns" style="display:none;"> <div id="mintButtons" class="columns" style="display:none;">
{% if meme.user.wownero_address %} {% if meme.user.wownero_address %}
<div class="column is-one-third"> <div class="column is-one-third">
<a class="button is-info" onclick="tipWOW()" id="tipWOWButton" style="width:100%;">Tip WOW</a> <a class="button is-info" onclick="tipWOW()" id="tipWOWButton" style="width:100%;">Tip via p2p WOW</a>
</div> </div>
{% endif %} {% endif %}
<div class="column"> <div class="column">
<a class="button is-danger" onclick="mint()" id="mintButton" style="width:100%;">Mint</a> <a class="button is-danger" onclick="mint()" id="mintButton" style="width:100%;">Mint to AVAX</a>
</div> </div>
</div> </div>
{% endif %} {% endif %}
@ -86,7 +85,7 @@
<div class="modal-background"></div> <div class="modal-background"></div>
<div class="modal-card"> <div class="modal-card">
<header class="modal-card-head"> <header class="modal-card-head">
<p class="modal-card-title">Tip meme in WOW</p> <p class="modal-card-title">Tip via WOW p2p</p>
<button class="delete" aria-label="close" id="closeWOWModal"></button> <button class="delete" aria-label="close" id="closeWOWModal"></button>
</header> </header>
<section class="modal-card-body"> <section class="modal-card-body">
@ -100,35 +99,41 @@
p2p transaction on the anonymous, private Wownero network. p2p transaction on the anonymous, private Wownero network.
Nobody will have visibility into these and will not be shown. Nobody will have visibility into these and will not be shown.
</p> </p>
</br>
<a href="https://wownero.org/#wallets" target="_blank">Wownero Wallets</a>
</section> </section>
<footer class="modal-card-foot"> <footer class="modal-card-foot">
</footer> </footer>
</div> </div>
</div> </div>
<div id="tipWOWXModal" class="modal"> <div id="tipSCModal" class="modal">
<div class="modal-background"></div> <div class="modal-background"></div>
<div class="modal-card"> <div class="modal-card">
<header class="modal-card-head"> <header class="modal-card-head">
<p class="modal-card-title">Tip meme in WOWX</p> <p class="modal-card-title">Tip via Smart Contract</p>
<button class="delete" aria-label="close" id="closeWOWXModal"></button> <button class="delete" aria-label="close" id="closeSCModal"></button>
</header> </header>
<section class="modal-card-body"> <section class="modal-card-body">
<!-- <p style="word-wrap: break-word;"> <p>
<strong>Wownero Address (p2p):</strong> Sending a tip via the <a href="{{ config.CONTRACT_ADDRESS | show_snowtrace }}" target="_blank">SuchWowX smart contract</a> will send a small amount to the
<span id="wowneroAddress">{{ meme.user.wownero_address | default('?') }}</span> publisher (the address that minted the meme) and the contract owner ({{ config.CONTRACT_OWNER }}), and the remainder is sent to the meme creator (whoever uploaded it). Everyone gets tipped for their contribution, but primarily the meme creator.
</p> </p>
</br> </br>
<p> <p>
Funds sent to this address will not be tracked as they are a direct, Input the amount of WOWX or AVAX you would like to send and click a button below to sign the transaction in MetaMask wallet.
p2p transaction on the anonymous, private Wownero network. </p>
Nobody will have visibility into these and will not be shown. </br>
</p> --> <div class="field">
sending a WOWX tip <label class="label">Tip Amount</label>
<div class="control">
<input id="tipSCAmount" class="input" type="text" placeholder=".042069">
</div>
</div>
</section> </section>
<footer class="modal-card-foot"> <footer class="modal-card-foot">
<button class="button is-success">Save changes</button> <button id="tipWOWXButton" class="button is-success" onclick="tipWOWX()">Tip WOWX</button>
<button class="button">Cancel</button> <button id="tipAVAXButton" class="button" onclick="tipAVAX()">Tip AVAX</button>
</footer> </footer>
</div> </div>
</div> </div>
@ -143,20 +148,23 @@
{% if meme.approved %} {% if meme.approved %}
<script type="text/javascript"> <script type="text/javascript">
window.addEventListener('DOMContentLoaded', async () => { window.addEventListener('DOMContentLoaded', async () => {
// Show buttons depending on if minted or not
let minted = await isMinted('{{ meme.meta_ipfs_hash }}'); let minted = await isMinted('{{ meme.meta_ipfs_hash }}');
if (minted) { if (minted) {
document.getElementById('tipButtons').style.display = "flex"; document.getElementById('tipButtons').style.display = "flex";
} else { } else {
document.getElementById('mintButtons').style.display = "flex"; document.getElementById('mintButtons').style.display = "flex";
} }
// try {
// _walletAddress = w3.utils.toChecksumAddress('{{ meme.user.public_address }}'); // Show tip amounts
// const userProfile = await contract.methods.userProfile(_walletAddress).call(); try {
// console.log(userProfile) const tokenId = await getTokenID('{{ meme.meta_ipfs_hash }}');
// if (userProfile.wowneroAddress){document.getElementById('wowneroAddress').innerHTML = userProfile.wowneroAddress}; const memeDeets = await contract.methods.tokenMeme(tokenId).call();
// } catch(e) { document.getElementById('wowxTips').innerHTML = await w3.utils.fromWei(memeDeets.creatorTipsWOWX);
// console.log(e); document.getElementById('avaxTips').innerHTML = await w3.utils.fromWei(memeDeets.creatorTipsAVAX);
// } } catch(e) {
console.log(e);
}
}); });
async function tipWOW() { async function tipWOW() {
@ -168,17 +176,41 @@
} }
} }
async function tipSC() {
document.getElementById('tipSCButton').classList.add('is-loading');
document.getElementById('tipSCModal').classList.add('is-active');
document.getElementById('closeSCModal').onclick = () => {
document.getElementById('tipSCModal').classList.remove('is-active');
document.getElementById('tipSCButton').classList.remove('is-loading');
}
}
async function getTipAmount() {
const amt = document.getElementById('tipSCAmount').value;
if (isNaN(amt)) {
notif('You must provide a number.', 'warning');
return false;
} else {
return amt;
}
}
async function tipAVAX() { async function tipAVAX() {
document.getElementById('tipAVAXButton').classList.add('is-loading'); document.getElementById('tipAVAXButton').classList.add('is-loading');
const tokenId = await getTokenID('{{ meme.meta_ipfs_hash }}'); const tokenId = await getTokenID('{{ meme.meta_ipfs_hash }}');
const walletAddress = await getMetamaskAccount(); const walletAddress = await getMetamaskAccount();
const tipAmountWei = w3.utils.toWei('.2'); const tipAmount = await getTipAmount();
if (!tipAmount) {
document.getElementById('tipAVAXButton').classList.remove('is-loading');
return false;
}
const tipAmountWei = w3.utils.toWei(tipAmount);
const gasPrice = await w3.eth.getGasPrice(); const gasPrice = await w3.eth.getGasPrice();
try {
const gasLimit = await contract.methods.tipAVAX(tokenId, tipAmountWei).estimateGas({from: walletAddress, value: tipAmountWei}, function(err, gas){ const gasLimit = await contract.methods.tipAVAX(tokenId, tipAmountWei).estimateGas({from: walletAddress, value: tipAmountWei}, function(err, gas){
return gas; return gas;
}); });
try { notif(`Tipping ${tipAmount} AVAX to meme "{{ meme.id | shorten_address }}" by "{{ meme.user.handle }} ({{ meme.user.public_address | shorten_address }})" via the Avalanche blockchain.`, 'info');
notif(`Tipping meme "{{ meme.id | shorten_address }}" by "{{ meme.user.handle }} ({{ meme.user.public_address | shorten_address }})" to the Avalanche blockchain.`, 'info');
let res = await contract.methods.tipAVAX(tokenId, tipAmountWei).send({ let res = await contract.methods.tipAVAX(tokenId, tipAmountWei).send({
from: walletAddress, from: walletAddress,
value: tipAmountWei, value: tipAmountWei,
@ -193,22 +225,19 @@
} }
} }
async function approveWOWX() { async function approveWOWX(amountWei) {
const walletAddress = await getMetamaskAccount(); const walletAddress = await getMetamaskAccount();
const allowanceWei = await wowxContract.methods.allowance(walletAddress, contractAddress).call(); const allowanceWei = await wowxContract.methods.allowance(walletAddress, contractAddress).call();
const allowance = await w3.utils.fromWei(allowanceWei); if (amountWei <= allowanceWei) {
console.log(`Current allowance is ${allowance} WOWX`);
const tipAmount = w3.utils.toWei('.2');
if (tipAmount <= allowanceWei) {
return true; return true;
} }
const gasPrice = await w3.eth.getGasPrice(); const gasPrice = await w3.eth.getGasPrice();
const gasLimit = await wowxContract.methods.approve(contractAddress, tipAmount).estimateGas({from: walletAddress}, function(err, gas){ const gasLimit = await wowxContract.methods.approve(contractAddress, amountWei).estimateGas({from: walletAddress}, function(err, gas){
return gas; return gas;
}); });
try { try {
notif(`Approving usage of WOWX token.`, 'info'); notif(`Approving usage of WOWX token.`, 'info');
let res = await wowxContract.methods.approve(contractAddress, tipAmount).send({ let res = await wowxContract.methods.approve(contractAddress, amountWei).send({
from: walletAddress, from: walletAddress,
gasPrice: gasPrice, gasPrice: gasPrice,
gas: gasLimit gas: gasLimit
@ -222,21 +251,24 @@
async function tipWOWX() { async function tipWOWX() {
document.getElementById('tipWOWXButton').classList.add('is-loading'); document.getElementById('tipWOWXButton').classList.add('is-loading');
let approved = await approveWOWX(); const tipAmount = await getTipAmount();
if (!approved) { if (!tipAmount) {
document.getElementById('tipWOWXButton').classList.remove('is-loading'); document.getElementById('tipWOWXButton').classList.remove('is-loading');
return false; return false;
} }
const tipAmountWei = w3.utils.toWei(tipAmount);
const tokenId = await getTokenID('{{ meme.meta_ipfs_hash }}'); const tokenId = await getTokenID('{{ meme.meta_ipfs_hash }}');
const walletAddress = await getMetamaskAccount(); const walletAddress = await getMetamaskAccount();
const tipAmount = '.2'; const approved = await approveWOWX(tipAmountWei);
const tipAmountWei = await w3.utils.toWei('.2'); if (!approved) {
document.getElementById('tipWOWXButton').classList.remove('is-loading');
return false;
}
const gasPrice = await w3.eth.getGasPrice(); const gasPrice = await w3.eth.getGasPrice();
try {
const gasLimit = await contract.methods.tipWOWX(tokenId, tipAmountWei).estimateGas({from: walletAddress}, function(err, gas){ const gasLimit = await contract.methods.tipWOWX(tokenId, tipAmountWei).estimateGas({from: walletAddress}, function(err, gas){
return gas; return gas;
}); });
try {
notif(`Tipping ${tipAmount} WOWX to meme "{{ meme.id | shorten_address }}" by "{{ meme.user.handle }} ({{ meme.user.public_address | shorten_address }})".`, 'info'); notif(`Tipping ${tipAmount} WOWX to meme "{{ meme.id | shorten_address }}" by "{{ meme.user.handle }} ({{ meme.user.public_address | shorten_address }})".`, 'info');
let res = await contract.methods.tipWOWX(tokenId, tipAmountWei).send({ let res = await contract.methods.tipWOWX(tokenId, tipAmountWei).send({
from: walletAddress, from: walletAddress,

Write Preview
Loading…
Cancel
Save