Vivek Teega
GitHub
commit
6a6bc50ca9
11
css/main.css
11
css/main.css
@ -1066,13 +1066,22 @@ theme-toggle {
|
||||
#participant_container,
|
||||
#deposits_container {
|
||||
display: grid;
|
||||
gap: 2.5rem;
|
||||
gap: 0.5rem;
|
||||
background-color: transparent;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.participant,
|
||||
.deposit-card {
|
||||
flex-wrap: wrap;
|
||||
gap: 2rem;
|
||||
background-color: rgba(var(--foreground-color), 1);
|
||||
padding: max(1rem, 1.5vw);
|
||||
border-radius: 0.5rem;
|
||||
}
|
||||
.participant .address,
|
||||
.deposit-card .address {
|
||||
min-width: 12rem;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 640px) {
|
||||
|
||||
2
css/main.min.css
vendored
2
css/main.min.css
vendored
File diff suppressed because one or more lines are too long
@ -969,12 +969,20 @@ theme-toggle {
|
||||
#participant_container,
|
||||
#deposits_container {
|
||||
display: grid;
|
||||
gap: 2.5rem;
|
||||
gap: 0.5rem;
|
||||
background-color: transparent;
|
||||
padding: 0;
|
||||
}
|
||||
.participant,
|
||||
.deposit-card {
|
||||
flex-wrap: wrap;
|
||||
gap: 2rem;
|
||||
background-color: rgba(var(--foreground-color), 1);
|
||||
padding: max(1rem, 1.5vw);
|
||||
border-radius: 0.5rem;
|
||||
.address {
|
||||
min-width: 12rem;
|
||||
}
|
||||
}
|
||||
@media only screen and (min-width: 640px) {
|
||||
.margin,
|
||||
|
||||
244
index.html
244
index.html
@ -144,7 +144,7 @@
|
||||
function formatAmount(amount = 0, currency = 'inr') {
|
||||
if (!amount)
|
||||
return '0';
|
||||
return amount.toLocaleString(currency === 'inr' ? `en-IN` : 'en-US', { currency, maximumFractionDigits: currency === 'inr' ? 2 : 8 })
|
||||
return amount.toLocaleString(currency === 'inr' ? `en-IN` : 'en-US', { currency, maximumFractionDigits: 8 })
|
||||
}
|
||||
// fetch data and return json
|
||||
async function fetchJson(url, options = {}) {
|
||||
@ -429,8 +429,8 @@
|
||||
document.getElementById('participant_container'),
|
||||
html`${Object.keys(contractParticipants)
|
||||
.map(participant => render.participantCard({
|
||||
acceptingToken: acceptingToken,
|
||||
sellingToken: sellingToken,
|
||||
acceptingToken,
|
||||
sellingToken,
|
||||
...contractParticipants[participant]
|
||||
}))
|
||||
}`
|
||||
@ -445,7 +445,7 @@
|
||||
document.getElementById('deposits_container'),
|
||||
html`${contractDeposits.map(deposit => render.depositCard({
|
||||
...deposit,
|
||||
acceptingToken: acceptingToken,
|
||||
acceptingToken,
|
||||
}))}`
|
||||
)
|
||||
else
|
||||
@ -771,12 +771,16 @@
|
||||
</div>
|
||||
<div class="flex flex-direction-column">
|
||||
<h5 class="label">Sender</h5>
|
||||
<a href=${`#/address/${sender}`} class="address wrap-around">${sender}</a>
|
||||
<sm-copy value=${sender}>
|
||||
<a href=${`#/address/${sender}`} class="address wrap-around">${sender}</a>
|
||||
</sm-copy>
|
||||
</div>
|
||||
${receiver ? html`
|
||||
<div class="flex flex-direction-column">
|
||||
<h5 class="label">Receiver</h5>
|
||||
<a href=${`#/address/${receiver}`} class="address wrap-around">${receiver}</a>
|
||||
<sm-copy value=${receiver}>
|
||||
<a href=${`#/address/${receiver}`} class="address wrap-around">${receiver}</a>
|
||||
</sm-copy>
|
||||
</div>
|
||||
`: ''
|
||||
}
|
||||
@ -833,7 +837,11 @@
|
||||
<h5 class="label">Supply</h5>
|
||||
<h4> ${supply ? formatAmount(supply, token.toLowerCase() === 'rupee' ? 'inr' : 'usd') : 'Infinite'} </h4>
|
||||
<h5 class="label">Incorporation address</h5>
|
||||
<h4 class="wrap-around">${incAddress}</h4>
|
||||
<sm-copy value=${incAddress}>
|
||||
<h4 class="wrap-around">
|
||||
<a href=${`#/address/${incAddress}`} class="address wrap-around">${incAddress}</a>
|
||||
</h4>
|
||||
</sm-copy>
|
||||
</div>
|
||||
<sm-chips data-target="token_views" onchange="changeView(event)">
|
||||
<sm-chip value="0" selected>Transactions</sm-chip>
|
||||
@ -880,7 +888,7 @@
|
||||
<div id="contract_info" class="card">
|
||||
<div class="flex info-row">
|
||||
<h5 class="label">Contract Type</h5>
|
||||
<h4>${replaceDash(contractType)}</h4>
|
||||
<h4>${replaceDash(contractType) === 'continuos event' ? 'continuous event' : replaceDash(contractType)}</h4>
|
||||
</div>
|
||||
${contractSubtype ? html`
|
||||
<div class="flex info-row">
|
||||
@ -934,11 +942,11 @@
|
||||
`: ''}
|
||||
${contractType === 'continuos-event' && contractSubtype === 'tokenswap' ? html`
|
||||
<div class="flex info-row">
|
||||
<h5 class="label">Input token</h5>
|
||||
<h5 class="label">deposit token</h5>
|
||||
<h4>${acceptingToken}</h4>
|
||||
</div>
|
||||
<div class="flex info-row">
|
||||
<h5 class="label">Output token</h5>
|
||||
<h5 class="label">participation token</h5>
|
||||
<h4>${sellingToken}</h4>
|
||||
</div>
|
||||
<div class="flex info-row">
|
||||
@ -1029,7 +1037,9 @@
|
||||
`;
|
||||
},
|
||||
depositCard(details) {
|
||||
const { currentBalance, depositorAddress, originalBalance, status, time, transactionHash, acceptingToken } = details
|
||||
const { currentBalance, depositorAddress, originalBalance, status, time, transactionHash, acceptingToken, sellingToken } = details
|
||||
console.log("I'm at the debug point")
|
||||
debugger
|
||||
return html`
|
||||
<li class="flex deposit-card">
|
||||
<div class="grid gap-0-5 flex-1">
|
||||
@ -1039,11 +1049,11 @@
|
||||
<div class="grid align-center gap-1 flex-1" style="grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr))">
|
||||
<div>
|
||||
<h5 class="label">Deposited</h5>
|
||||
<b>${formatAmount(originalBalance, 'usd')} ${acceptingToken}</b>
|
||||
<b>${formatAmount(originalBalance, 'usd')} ${sellingToken}</b>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="label">Current balance</h5>
|
||||
<b>${formatAmount(currentBalance, 'usd')} ${acceptingToken}</b>
|
||||
<b>${formatAmount(currentBalance, 'usd')} ${sellingToken}</b>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="label">Status</h5>
|
||||
@ -1069,6 +1079,51 @@
|
||||
</li>
|
||||
`;
|
||||
},
|
||||
contractDepositCard(obj) {
|
||||
const { hash, blockHeight, token, sender, receiver, amount, type, time, contractAddress, contractName } = obj;
|
||||
let title = 'Contract deposit';
|
||||
return html`
|
||||
<li id=${hash} class="transaction token-transfer">
|
||||
<svg class="icon" viewBox="0 0 64 64"> <title>transfer</title> <polyline points="17.04 35.97 14.57 33.5 40.15 7.9 32.75 0.5 55.52 0.5 55.52 23.28 48.12 15.87 23.86 40.14 15.88 48.13 8.48 40.72 8.48 63.5 31.25 63.5 23.85 56.1 49.43 30.5 46.96 28.03"/> </svg>
|
||||
<div class="contract-type">
|
||||
<h5 class="label">${title}</h5>
|
||||
<a href=${`#/token/${token}`} class="">${token}</a>
|
||||
</div>
|
||||
<div class="contract-info">
|
||||
<time>${getFormattedTime(time)}</time>
|
||||
<div class="flex flex-wrap gap-1">
|
||||
<div class="flex flex-direction-column">
|
||||
<h5 class="label">Sender</h5>
|
||||
<sm-copy value=${sender}>
|
||||
<a href=${`#/address/${sender}`} class="address wrap-around">${sender}</a>
|
||||
</sm-copy>
|
||||
</div>
|
||||
<div class="flex flex-direction-column">
|
||||
<h5 class="label">Receiver</h5>
|
||||
<sm-copy value=${receiver}>
|
||||
<a href=${`#/address/${receiver}`} class="address wrap-around">${receiver}</a>
|
||||
</sm-copy>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-direction-column">
|
||||
<h5 class="label">Contract name</h5>
|
||||
<h4>${contractName}</h4>
|
||||
</div>
|
||||
<div class="flex flex-direction-column">
|
||||
<h5 class="label">Amount</h5>
|
||||
<h4>${formatAmount(amount, token.toLowerCase() === 'rupee' ? 'inr' : 'usd')} ${token}</h4>
|
||||
</div>
|
||||
<div class="flex align-center space-between flex-wrap gap-1">
|
||||
<div class="flex flex-direction-column">
|
||||
<h5 class="label">Transaction ID</h5>
|
||||
<sm-copy value=${hash} clip-text></sm-copy>
|
||||
</div>
|
||||
<a href=${`#/transaction/${hash}`} class="button button--small button--colored">View details</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
`;
|
||||
},
|
||||
contractTransferCard(obj) {
|
||||
const { hash, token, sender, receiver, amount, contractName, userChoice, time } = obj;
|
||||
return html`
|
||||
@ -1115,11 +1170,15 @@
|
||||
<div class="flex flex-wrap gap-1">
|
||||
<div class="flex flex-direction-column">
|
||||
<h5 class="label">Sender</h5>
|
||||
<a href=${`#/address/${sender}`} class="address wrap-around">${sender}</a>
|
||||
<sm-copy value=${sender}>
|
||||
<a href=${`#/address/${sender}`} class="address wrap-around">${sender}</a>
|
||||
</sm-copy>
|
||||
</div>
|
||||
<div class="flex flex-direction-column">
|
||||
<h5 class="label">Receiver</h5>
|
||||
<a href=${`#/address/${receiver}`} class="address wrap-around">${receiver}</a>
|
||||
<sm-copy value=${receiver}>
|
||||
<a href=${`#/address/${receiver}`} class="address wrap-around">${receiver}</a>
|
||||
</sm-copy>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-direction-column">
|
||||
@ -1153,7 +1212,9 @@
|
||||
<time>${getFormattedTime(time)}</time>
|
||||
<div class="flex flex-direction-column">
|
||||
<h5 class="label">Incorporation address</h5>
|
||||
<a href=${`#/address/${incAddress}`} class="address wrap-around">${incAddress}</a>
|
||||
<sm-copy value=${incAddress}>
|
||||
<a href=${`#/address/${incAddress}`} class="address wrap-around">${incAddress}</a>
|
||||
</sm-copy>
|
||||
</div>
|
||||
<div class="flex flex-direction-column">
|
||||
<h5 class="label">token name</h5>
|
||||
@ -1217,8 +1278,8 @@
|
||||
`;
|
||||
},
|
||||
contractCreationCard(obj) {
|
||||
const { hash, blockHeight, token, contractName, incAddress, contractType, expiration, participationFees, availableChoices, time } = obj;
|
||||
console.log(obj);
|
||||
const { hash, blockHeight, token, contractName, incAddress, contractType, expiration, participationFees, availableChoices, time, acceptingToken, sellingToken, price } = obj;
|
||||
console.log(obj)
|
||||
return html`
|
||||
<li id=${hash} class="transaction contract-creation">
|
||||
<svg class="icon" viewBox="0 0 64 64"> <title>contract creation</title> <path d="M47.07,23.85V11"/> <path d="M3,47A7,7,0,0,0,.48,52.39a6.89,6.89,0,0,0,2.05,4.93,6.78,6.78,0,0,0,3.78,2,6.34,6.34,0,0,0,1.16.1H40.09a7,7,0,0,0,7-7V44"/> <path d="M6.31,53V11.61a7,7,0,0,1,7-7H45.91a6.26,6.26,0,0,1,1.16.1,6.74,6.74,0,0,1,3.78,1.95A7,7,0,0,1,50.37,17"/> <line x1="14.46" y1="23.85" x2="38.92" y2="23.85"/> <line x1="14.46" y1="32" x2="38.92" y2="32"/> <line x1="14.46" y1="40.15" x2="31.93" y2="40.15"/> <path d="M57.79,24.44l-2.88-2.9,3.79-3.79a1,1,0,0,1,1.39,0l3.11,3.11a1,1,0,0,1,0,1.39L40.34,45.1a1,1,0,0,1-.52.28L36,46A1,1,0,0,1,34.9,44.9l.67-3.77a1,1,0,0,1,.27-.52L52.65,23.8"/> </svg>
|
||||
@ -1234,25 +1295,51 @@
|
||||
</div>
|
||||
<div class="flex flex-direction-column">
|
||||
<h5 class="label">Contract address</h5>
|
||||
<a href=${`#/address/${incAddress}`} class="address wrap-around">${incAddress}</a>
|
||||
</div>
|
||||
<div class="flex flex-direction-column">
|
||||
<h5 class="label">token used</h5>
|
||||
<h4>${token}</h4>
|
||||
<sm-copy value=${incAddress}>
|
||||
<a href=${`#/address/${incAddress}`} class="address wrap-around">${incAddress}</a>
|
||||
</sm-copy>
|
||||
</div>
|
||||
<div class="flex flex-direction-column">
|
||||
<h5 class="label">contract type</h5>
|
||||
<h4>${replaceDash(contractType)}</h4>
|
||||
<h4>
|
||||
${replaceDash(contractType) === 'continuos event' ? 'continuous event' : replaceDash(contractType)}
|
||||
</h4>
|
||||
</div>
|
||||
${token ? html`
|
||||
<div class="flex flex-direction-column">
|
||||
<h5 class="label">token used</h5>
|
||||
<h4>${token}</h4>
|
||||
</div>
|
||||
`: ''}
|
||||
${acceptingToken ? html`
|
||||
<div class="flex flex-direction-column">
|
||||
<h5 class="label">deposit token</h5>
|
||||
<h4>${acceptingToken}</h4>
|
||||
</div>
|
||||
`: ''}
|
||||
${sellingToken ? html`
|
||||
<div class="flex flex-direction-column">
|
||||
<h5 class="label">participation token</h5>
|
||||
<h4>${sellingToken}</h4>
|
||||
</div>
|
||||
`: ''}
|
||||
${expiration ? html`
|
||||
<div class="flex flex-direction-column">
|
||||
<h5 class="label">expiration</h5>
|
||||
<h4 class="capitalise">${getFormattedTime(new Date(expiration).getTime())}</h4>
|
||||
</div>`: ''}
|
||||
<div class="flex flex-direction-column">
|
||||
<h5 class="label">participation amount</h5>
|
||||
<h4>${participationFees} ${token}</h4>
|
||||
</div>
|
||||
${participationFees ? html`
|
||||
<div class="flex flex-direction-column">
|
||||
<h5 class="label">participation amount</h5>
|
||||
<h4>${participationFees} ${token}</h4>
|
||||
</div>
|
||||
`: ''}
|
||||
${price ? html`
|
||||
<div class="flex flex-direction-column">
|
||||
<h5 class="label">price</h5>
|
||||
<h4>1 ${sellingToken} = ${formatAmount(price, 'usd')} ${acceptingToken}</h4>
|
||||
</div>
|
||||
`: ''}
|
||||
<div class="flex align-center space-between flex-wrap gap-1">
|
||||
<div class="flex flex-direction-column">
|
||||
<h5 class="label">Transaction ID</h5>
|
||||
@ -1292,6 +1379,9 @@
|
||||
case 'nfttransfer':
|
||||
return render.tokenTransferCard(tx)
|
||||
break;
|
||||
case 'contractdeposit':
|
||||
return render.contractDepositCard(tx)
|
||||
break;
|
||||
case 'contracttransfer':
|
||||
return render.contractTransferCard(tx);
|
||||
break;
|
||||
@ -1475,6 +1565,9 @@
|
||||
const deposits = await fetchJson(`${floGlobals.tokenApiUrl}/api/v2/smartContractDeposits?contractName=${contract.name}&contractAddress=${contract.address}`)
|
||||
return deposits.depositInfo
|
||||
}
|
||||
function getReceiver(vin, vout) {
|
||||
return vout.find(output => output.scriptPubKey.addresses.find(address => address !== vin[0].addr))?.scriptPubKey.addresses[0] || vin[0].addr
|
||||
}
|
||||
|
||||
function parseTransactions(txList) {
|
||||
if (!Array.isArray(txList))
|
||||
@ -1483,11 +1576,14 @@
|
||||
txList.forEach(tx => {
|
||||
const {
|
||||
transactionDetails: {
|
||||
txid, blockHeight, vin, vout, time },
|
||||
txid, blockHeight, vin, vout, time,
|
||||
receiverAddress,
|
||||
senderAddress,
|
||||
},
|
||||
parsedFloData: {
|
||||
contractAddress,
|
||||
contractType,
|
||||
contractConditions: { expiryTime } = {},
|
||||
contractConditions: { expiryTime, accepting_token, selling_token, subtype, price } = {},
|
||||
contractAmount,
|
||||
type,
|
||||
tokenAmount,
|
||||
@ -1496,7 +1592,8 @@
|
||||
contractName,
|
||||
triggerCondition,
|
||||
userChoice,
|
||||
nftHash
|
||||
nftHash,
|
||||
depositAmount,
|
||||
}
|
||||
} = tx;
|
||||
let obj = {
|
||||
@ -1510,16 +1607,8 @@
|
||||
switch (type) {
|
||||
case 'transfer':
|
||||
if (transferType == "token" || transferType == 'nft') {
|
||||
let receiverAddress = "";
|
||||
for (const output of vout) {
|
||||
if (output["scriptPubKey"]["addresses"][0] !== vin[0]["addr"]) {
|
||||
receiverAddress = output["scriptPubKey"]["addresses"][0];
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
obj = Object.assign({}, obj, {
|
||||
sender: vin[0]["addr"],
|
||||
sender: senderAddress,
|
||||
receiver: receiverAddress,
|
||||
amount: tokenAmount,
|
||||
type: transferType == "token" ? "tokentransfer" : "nfttransfer",
|
||||
@ -1528,16 +1617,8 @@
|
||||
break;
|
||||
} else if (transferType == 'smartContract') {
|
||||
// smart contract transfer
|
||||
let receiverAddress = "";
|
||||
for (const output of vout) {
|
||||
if (output["scriptPubKey"]["addresses"][0] !== vin[0]["addr"]) {
|
||||
receiverAddress = output["scriptPubKey"]["addresses"][0];
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
obj = Object.assign({}, obj, {
|
||||
sender: vin[0]["addr"],
|
||||
sender: senderAddress,
|
||||
receiver: receiverAddress,
|
||||
amount: tokenAmount,
|
||||
contractName,
|
||||
@ -1551,7 +1632,7 @@
|
||||
// token incorporation
|
||||
// smart contract incorporation
|
||||
obj = Object.assign({}, obj, {
|
||||
incAddress: vin[0]["addr"],
|
||||
incAddress: senderAddress,
|
||||
supply: tokenAmount,
|
||||
type: "tokenincorp",
|
||||
});
|
||||
@ -1560,47 +1641,68 @@
|
||||
case 'smartContractIncorporation':
|
||||
// smart contract incorporation
|
||||
// todo : add checks to determine obj for different types of smart contract incorporation
|
||||
obj = Object.assign({}, obj, {
|
||||
contractName,
|
||||
incAddress: contractAddress,
|
||||
contractType,
|
||||
expiration: expiryTime,
|
||||
participationFees: contractAmount,
|
||||
availableChoices: "",
|
||||
type: "contractincorp",
|
||||
});
|
||||
switch (subtype) {
|
||||
case 'tokenswap':
|
||||
obj = Object.assign({}, obj, {
|
||||
contractName,
|
||||
incAddress: contractAddress,
|
||||
contractType,
|
||||
type: "contractincorp",
|
||||
sellingToken: selling_token,
|
||||
acceptingToken: accepting_token,
|
||||
price,
|
||||
});
|
||||
delete obj["token"];
|
||||
break;
|
||||
default:
|
||||
obj = Object.assign({}, obj, {
|
||||
contractName,
|
||||
incAddress: contractAddress,
|
||||
contractType,
|
||||
expiration: expiryTime,
|
||||
participationFees: contractAmount,
|
||||
availableChoices: "",
|
||||
type: "contractincorp",
|
||||
});
|
||||
break;
|
||||
}
|
||||
latestTxArray.push(obj);
|
||||
break;
|
||||
case 'nftIncorporation':
|
||||
// nft incorporation
|
||||
obj = Object.assign({}, obj, {
|
||||
incAddress: vin[0]["addr"],
|
||||
incAddress: senderAddress,
|
||||
supply: tokenAmount,
|
||||
type: "nftincorp",
|
||||
nftHash
|
||||
});
|
||||
latestTxArray.push(obj);
|
||||
break;
|
||||
case 'smartContractDeposit':
|
||||
// smart contract deposit
|
||||
obj = Object.assign({}, obj, {
|
||||
contractName,
|
||||
contractAddress,
|
||||
contractType,
|
||||
amount: depositAmount,
|
||||
type: "contractdeposit",
|
||||
sender: senderAddress,
|
||||
receiver: receiverAddress,
|
||||
});
|
||||
latestTxArray.push(obj);
|
||||
break;
|
||||
}
|
||||
|
||||
} else {
|
||||
// transaction is a FLO Smart Contract Committee trigger
|
||||
|
||||
let receiver = "", sender = vin[0]['addr'];
|
||||
for (const output of vout) {
|
||||
if (output["scriptPubKey"]["addresses"][0] !== vin[0]["addr"]) {
|
||||
receiverAddress = output["scriptPubKey"]["addresses"][0];
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
obj = Object.assign({}, obj, {
|
||||
hash: txid,
|
||||
blockHeight,
|
||||
contractName,
|
||||
contractAddress: receiver,
|
||||
contractAddress: receiverAddress,
|
||||
winningChoice: triggerCondition,
|
||||
committeeAddress: sender,
|
||||
committeeAddress: senderAddress,
|
||||
type: 'contracttrigger'
|
||||
});
|
||||
latestTxArray.push(obj);
|
||||
@ -1650,7 +1752,6 @@
|
||||
receiver = vout[i]["scriptPubKey"]["addresses"][0];
|
||||
}
|
||||
}
|
||||
console.log(transaction)
|
||||
// todo - temporary fixes below. Fix these on the Database and API level
|
||||
let transactionType = ''
|
||||
if (type == 'transfer') {
|
||||
@ -1682,7 +1783,6 @@
|
||||
}
|
||||
|
||||
|
||||
// THIS TAG CONTAINS CODE REQUIRED FOR THE NAVBAR TO FUNCTION
|
||||
function returnHexNumber(s) {
|
||||
var regExp = /^[-+]?[0-9A-Fa-f]+\.?[0-9A-Fa-f]*?$/;
|
||||
return (typeof s === 'string' && regExp.test(s));
|
||||
|
||||
8
scripts/components.min.js
vendored
8
scripts/components.min.js
vendored
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue
Block a user