This commit is contained in:
sairaj mote 2020-09-18 13:57:52 +05:30
parent d1405ccc10
commit 45631075b2
6 changed files with 97 additions and 49 deletions

View File

@ -344,22 +344,22 @@ customElements.define('sm-input',
return this.shadowRoot.querySelector('input').checkValidity() return this.shadowRoot.querySelector('input').checkValidity()
} }
focusIn() { focusIn = () => {
this.shadowRoot.querySelector('input').focus() this.shadowRoot.querySelector('input').focus()
} }
focusOut() { focusOut = () => {
this.shadowRoot.querySelector('input').blur() this.shadowRoot.querySelector('input').blur()
} }
preventNonNumericalInput(e) { preventNonNumericalInput = (e) => {
let keyCode = e.keyCode; let keyCode = e.keyCode;
if (!((keyCode > 47 && keyCode < 56) || (keyCode > 36 && keyCode < 39) || (keyCode > 95 && keyCode < 104) || keyCode === 110 || (keyCode > 7 && keyCode < 19))) { if (!((keyCode > 47 && keyCode < 56) || (keyCode > 36 && keyCode < 39) || (keyCode > 95 && keyCode < 106) || keyCode === 110 || (keyCode > 7 && keyCode < 19))) {
e.preventDefault(); e.preventDefault();
} }
} }
fireEvent() { fireEvent = () => {
let event = new Event('input', { let event = new Event('input', {
bubbles: true, bubbles: true,
cancelable: true, cancelable: true,
@ -368,7 +368,7 @@ customElements.define('sm-input',
this.dispatchEvent(event); this.dispatchEvent(event);
} }
checkInput() { checkInput = () => {
if (!this.hasAttribute('placeholder') || this.getAttribute('placeholder') === '') if (!this.hasAttribute('placeholder') || this.getAttribute('placeholder') === '')
return; return;
if (this.input.value !== '') { if (this.input.value !== '') {
@ -407,6 +407,10 @@ customElements.define('sm-input',
if (this.hasAttribute('required')) { if (this.hasAttribute('required')) {
this.input.setAttribute('required', '') this.input.setAttribute('required', '')
} }
if (this.hasAttribute('min')) {
let minValue = this.getAttribute('min')
this.input.setAttribute('min', minValue)
}
if (this.hasAttribute('pattern')) { if (this.hasAttribute('pattern')) {
this.input.setAttribute('pattern', this.getAttribute('pattern')) this.input.setAttribute('pattern', this.getAttribute('pattern'))
} }
@ -420,6 +424,7 @@ customElements.define('sm-input',
if (this.hasAttribute('type')) { if (this.hasAttribute('type')) {
if (this.getAttribute('type') === 'number') { if (this.getAttribute('type') === 'number') {
this.input.setAttribute('inputmode', 'numeric') this.input.setAttribute('inputmode', 'numeric')
this.input.setAttribute('type', 'number')
} }
else else
this.input.setAttribute('type', this.getAttribute('type')) this.input.setAttribute('type', this.getAttribute('type'))

1
css/back.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="1920" height="1080" viewBox="0 0 1920 1080"><defs><style>.a{fill:#ffcdab;}.b{fill:#fff4c5;}</style></defs><title>back</title><path class="a" d="M1343.5-.5c33.54,48.75,50.34,166,277.18,193.18C1808.39,215.21,1899.21,313.38,1920,364c-.33-146.23-.17-218.31-.5-364.54Z"/><path class="b" d="M1343.5-.5a288.26,288.26,0,0,0,159,88.78c48.38,9.32,76.65,13.77,132.58,22.68,93.5,14.9,141.37,56.9,170.42,80.54a466.36,466.36,0,0,1,115,139q-.49-165.49-1-331Z"/></svg>

After

Width:  |  Height:  |  Size: 499 B

View File

@ -16,9 +16,10 @@ body {
--foreground-color: 255, 255, 255; --foreground-color: 255, 255, 255;
--background-color: #e8e8e8; --background-color: #e8e8e8;
--dark-shade: #dadada; --dark-shade: #dadada;
background: var(--foreground-color); background: linear-gradient(rgba(var(--foreground-color), 0.1), rgba(var(--foreground-color), 0.3)), url(back.svg) no-repeat fixed;
color: rgba(var(--text-color), 1); color: rgba(var(--text-color), 1);
font-size: 16px; font-size: 16px;
background-size: cover;
} }
a { a {
@ -1000,6 +1001,12 @@ sm-panel {
stroke: #EF5350; stroke: #EF5350;
} }
.rupee-symbol {
height: 1rem;
width: 1rem;
fill: rgba(var(--text-color), 0.5);
}
@media only screen and (max-width: 640px) { @media only screen and (max-width: 640px) {
#home_page, #deposit { #home_page, #deposit {
display: grid; display: grid;
@ -1022,6 +1029,10 @@ sm-panel {
margin-left: 6rem; margin-left: 6rem;
} }
sm-popup {
background: rgba(var(--foreground-color), 1);
}
sm-popup::part(popup) { sm-popup::part(popup) {
width: 24rem; width: 24rem;
} }
@ -1075,12 +1086,6 @@ sm-panel {
display: inline-flex; display: inline-flex;
} }
#home_page, #deposit {
display: grid;
gap: 1.5rem;
grid-template-columns: minmax(0, 1fr) 24rem;
}
.options-tab > .grid { .options-tab > .grid {
gap: 1rem; gap: 1rem;
min-width: auto; min-width: auto;
@ -1117,6 +1122,12 @@ sm-panel {
position: sticky; position: sticky;
top: 1.5rem; top: 1.5rem;
} }
#home_page, #deposit {
display: grid;
gap: 1.5rem;
grid-template-columns: minmax(0, 1fr) 24rem;
}
} }
@media only screen and (min-width: 1920px) { @media only screen and (min-width: 1920px) {
body { body {

2
css/main.min.css vendored

File diff suppressed because one or more lines are too long

View File

@ -16,9 +16,10 @@ body {
--foreground-color: 255, 255, 255; --foreground-color: 255, 255, 255;
--background-color: #e8e8e8; --background-color: #e8e8e8;
--dark-shade: #dadada; --dark-shade: #dadada;
background: var(--foreground-color); background: linear-gradient(rgba(var(--foreground-color), 0.1), rgba(var(--foreground-color), 0.3)),url(back.svg) no-repeat fixed;
color: rgba(var(--text-color), 1); color: rgba(var(--text-color), 1);
font-size: 16px; font-size: 16px;
background-size: cover;
} }
a { a {
@ -1075,6 +1076,12 @@ sm-panel{
} }
} }
.rupee-symbol{
height: 1rem;
width: 1rem;
fill: rgba(var(--text-color), 0.5);
}
@media only screen and (max-width: 640px) { @media only screen and (max-width: 640px) {
#home_page, #deposit{ #home_page, #deposit{
display: grid; display: grid;
@ -1097,7 +1104,9 @@ sm-panel{
padding: 0 2rem; padding: 0 2rem;
margin-left: 6rem; margin-left: 6rem;
} }
sm-popup{
background: rgba(var(--foreground-color), 1);
}
sm-popup::part(popup){ sm-popup::part(popup){
width: 24rem; width: 24rem;
} }
@ -1152,12 +1161,6 @@ sm-panel{
display: inline-flex; display: inline-flex;
} }
} }
#home_page, #deposit {
display: grid;
gap: 1.5rem;
grid-template-columns: minmax(0, 1fr) 24rem;
}
.options-tab{ .options-tab{
& > .grid{ & > .grid{
gap: 1rem; gap: 1rem;
@ -1200,6 +1203,11 @@ sm-panel{
position: sticky; position: sticky;
top: 1.5rem; top: 1.5rem;
} }
#home_page, #deposit {
display: grid;
gap: 1.5rem;
grid-template-columns: minmax(0, 1fr) 24rem;
}
} }
@media only screen and (min-width: 1920px) { @media only screen and (min-width: 1920px) {

View File

@ -71,7 +71,12 @@
*Requires Rupee to be deposited first. *Requires Rupee to be deposited first.
</p> </p>
<sm-input floId id="token_receiver" placeholder="Reciever's FLO ID" required animate></sm-input> <sm-input floId id="token_receiver" placeholder="Reciever's FLO ID" required animate></sm-input>
<sm-input id="token_amount" placeholder="Amount" type="number" min="1" required animate></sm-input> <sm-input id="token_amount" placeholder="Amount" type="number" min="1" required animate>
<svg slot="icon" class="rupee-symbol" viewBox="0 0 64 64">
<title>rupee-symbol</title>
<path d="M51.65,8H42.07A18.44,18.44,0,0,1,45,15.78h8.88l-2.2,8H45q-1,7.26-5.8,11.1T25.54,39.47L46,63.43V64H33.41L11,37.93l0-6.72H22.11a13.19,13.19,0,0,0,7.8-2.05,9.77,9.77,0,0,0,3.85-5.38H10.11l2.24-8H33.58Q31.44,9,21.93,9H10.11l2.37-9H53.89Z"/>
</svg>
</sm-input>
<button id="send_tokens_btn" class="action expand" type="submit" disabled> <button id="send_tokens_btn" class="action expand" type="submit" disabled>
<h4 class="expand primary-btn"> <h4 class="expand primary-btn">
Send Send
@ -88,7 +93,7 @@
<line x1="64" y1="0" x2="0" y2="64" /> <line x1="64" y1="0" x2="0" y2="64" />
<line x1="64" y1="64" x2="0" y2="0" /> <line x1="64" y1="64" x2="0" y2="0" />
</svg> </svg>
<h4>Deposit rupee</h4> <h4>Deposit</h4>
</header> </header>
<svg class="icon illustration" viewBox="0 0 64 64"> <svg class="icon illustration" viewBox="0 0 64 64">
<title>deposit</title> <title>deposit</title>
@ -103,9 +108,14 @@
<sm-button onclick="showPopup('transaction_result')">result</sm-button> <sm-button onclick="showPopup('transaction_result')">result</sm-button>
<section id="deposit_amount_section"> <section id="deposit_amount_section">
<p> <p>
Deposit rupee through UPI. Add money through UPI.
</p> </p>
<sm-input id="token_amount_to_buy" placeholder="Amount" type="number" min="1" required animate></sm-input> <sm-input id="token_amount_to_buy" placeholder="Amount" type="number" min="1" required animate>
<svg slot="icon" class="rupee-symbol" viewBox="0 0 64 64">
<title>rupee-symbol</title>
<path d="M51.65,8H42.07A18.44,18.44,0,0,1,45,15.78h8.88l-2.2,8H45q-1,7.26-5.8,11.1T25.54,39.47L46,63.43V64H33.41L11,37.93l0-6.72H22.11a13.19,13.19,0,0,0,7.8-2.05,9.77,9.77,0,0,0,3.85-5.38H10.11l2.24-8H33.58Q31.44,9,21.93,9H10.11l2.37-9H53.89Z"/>
</svg>
</sm-input>
</section> </section>
<section id="upi_txId_section" class="hide-completely"> <section id="upi_txId_section" class="hide-completely">
<p id="send_amount_to_deposit"></p> <p id="send_amount_to_deposit"></p>
@ -154,7 +164,12 @@
</p> </p>
<sm-input id="user_withdraw_upi" placeholder="Reciever's UPI address" pattern="^[a-zA-z0-9]+@[a-zA-z0-9]+" <sm-input id="user_withdraw_upi" placeholder="Reciever's UPI address" pattern="^[a-zA-z0-9]+@[a-zA-z0-9]+"
required animate></sm-input> required animate></sm-input>
<sm-input id="withdraw_cash_amount" placeholder="Amount" type="number" min="1" required animate></sm-input> <sm-input id="withdraw_cash_amount" placeholder="Amount" type="number" min="1" required animate>
<svg slot="icon" class="rupee-symbol" viewBox="0 0 64 64">
<title>rupee-symbol</title>
<path d="M51.65,8H42.07A18.44,18.44,0,0,1,45,15.78h8.88l-2.2,8H45q-1,7.26-5.8,11.1T25.54,39.47L46,63.43V64H33.41L11,37.93l0-6.72H22.11a13.19,13.19,0,0,0,7.8-2.05,9.77,9.77,0,0,0,3.85-5.38H10.11l2.24-8H33.58Q31.44,9,21.93,9H10.11l2.37-9H53.89Z"/>
</svg>
</sm-input>
<button id="withdraw_cash_btn" class="action expand" type="submit" disabled> <button id="withdraw_cash_btn" class="action expand" type="submit" disabled>
<h4 class="primary-btn expand"> <h4 class="primary-btn expand">
withdraw withdraw
@ -181,7 +196,12 @@
Request Rupee from other's using FLO address. Request Rupee from other's using FLO address.
</p> </p>
<sm-input floId id="requested_address" placeholder="Request from" required animate></sm-input> <sm-input floId id="requested_address" placeholder="Request from" required animate></sm-input>
<sm-input id="requested_amount" placeholder="Amount" type="number" min="1" required animate></sm-input> <sm-input id="requested_amount" placeholder="Amount" type="number" min="1" required animate>
<svg slot="icon" class="rupee-symbol" viewBox="0 0 64 64">
<title>rupee-symbol</title>
<path d="M51.65,8H42.07A18.44,18.44,0,0,1,45,15.78h8.88l-2.2,8H45q-1,7.26-5.8,11.1T25.54,39.47L46,63.43V64H33.41L11,37.93l0-6.72H22.11a13.19,13.19,0,0,0,7.8-2.05,9.77,9.77,0,0,0,3.85-5.38H10.11l2.24-8H33.58Q31.44,9,21.93,9H10.11l2.37-9H53.89Z"/>
</svg>
</sm-input>
<button id="request_rupee_btn" class="action expand" type="submit" disabled> <button id="request_rupee_btn" class="action expand" type="submit" disabled>
<h4 class="primary-btn expand"> <h4 class="primary-btn expand">
request request
@ -216,7 +236,12 @@
</details> </details>
<p id="pay_cashier_info"></p> <p id="pay_cashier_info"></p>
<sm-input floId id="recvr_id" placeholder="Reciever's FLO ID" required animaate></sm-input> <sm-input floId id="recvr_id" placeholder="Reciever's FLO ID" required animaate></sm-input>
<sm-input id="recvr_amount_to_pay" placeholder="Amount" type="number" min="1" required animate></sm-input> <sm-input id="recvr_amount_to_pay" placeholder="Amount" type="number" min="1" required animate>
<svg slot="icon" class="rupee-symbol" viewBox="0 0 64 64">
<title>rupee-symbol</title>
<path d="M51.65,8H42.07A18.44,18.44,0,0,1,45,15.78h8.88l-2.2,8H45q-1,7.26-5.8,11.1T25.54,39.47L46,63.43V64H33.41L11,37.93l0-6.72H22.11a13.19,13.19,0,0,0,7.8-2.05,9.77,9.77,0,0,0,3.85-5.38H10.11l2.24-8H33.58Q31.44,9,21.93,9H10.11l2.37-9H53.89Z"/>
</svg>
</sm-input>
<sm-input id="paid_cashier_upi" placeholder="Sender's UPI address" pattern="^[a-zA-z0-9]+@[a-zA-z0-9]+" required <sm-input id="paid_cashier_upi" placeholder="Sender's UPI address" pattern="^[a-zA-z0-9]+@[a-zA-z0-9]+" required
animate></sm-input> animate></sm-input>
<button id="cnf_cash_payment" class="action expand" type="submit" disabled> <button id="cnf_cash_payment" class="action expand" type="submit" disabled>
@ -331,7 +356,7 @@
<line y1="32.5" x2="19" y2="32.5" /> <line y1="32.5" x2="19" y2="32.5" />
<line x1="7" y1="50" x2="26" y2="50" /> <line x1="7" y1="50" x2="26" y2="50" />
</svg> </svg>
<h5>Activity</h5> <h5>Transactions</h5>
</div> </div>
<div title="helpline page" class="navbar-item helpline-option" id="helpline_page_btn" <div title="helpline page" class="navbar-item helpline-option" id="helpline_page_btn"
onclick="showPage(this, 'helpline_page')"> onclick="showPage(this, 'helpline_page')">
@ -449,7 +474,7 @@
<div class="left"> <div class="left">
<h3>Transaction Requests</h3> <h3>Transaction Requests</h3>
<sm-tab-header target="requests_to_cashier"> <sm-tab-header target="requests_to_cashier">
<sm-tab>Deposits</sm-tab> <sm-tab></sm-tab>
<sm-tab>Withdrawals</sm-tab> <sm-tab>Withdrawals</sm-tab>
<sm-tab>Pay Through Cashier</sm-tab> <sm-tab>Pay Through Cashier</sm-tab>
</sm-tab-header> </sm-tab-header>
@ -686,7 +711,7 @@
</sm-tab-panels> </sm-tab-panels>
</section> </section>
<section id="activity_page" class="page"> <section id="activity_page" class="page">
<h3>Activity</h3> <h3>Transactions</h3>
<p class="bottom-margin">*If your request isn't completed in 12hrs, use <strong>REPORT</strong> to get <p class="bottom-margin">*If your request isn't completed in 12hrs, use <strong>REPORT</strong> to get
assistance from our helpline.</p> assistance from our helpline.</p>
<sm-tab-header target="user_activities"> <sm-tab-header target="user_activities">
@ -754,6 +779,7 @@
<button class="primary-btn top-margin" onclick="signOut()">Sign out</button> <button class="primary-btn top-margin" onclick="signOut()">Sign out</button>
</section> </section>
</main> </main>
<script src="components.js"></script>
<script id="floGlobals"> <script id="floGlobals">
/* Constants for FLO blockchain operations !!Make sure to add this at begining!! */ /* Constants for FLO blockchain operations !!Make sure to add this at begining!! */
const floGlobals = { const floGlobals = {
@ -785,7 +811,6 @@
generalVC: {} generalVC: {}
} }
</script> </script>
<script src="components.js"></script>
<script id="onLoadStartUp"> <script id="onLoadStartUp">
const userFloIdContainers = document.querySelectorAll('.user-flo-id') const userFloIdContainers = document.querySelectorAll('.user-flo-id')
function onLoadStartUp() { function onLoadStartUp() {
@ -794,9 +819,9 @@
floDapps.launchStartUp().then(async result => { floDapps.launchStartUp().then(async result => {
console.log(`Welcome ${myFloID}`) console.log(`Welcome ${myFloID}`)
refresh_balance() refresh_balance()
await token_app.actions.doShreeGanesh();
userFloIdContainers.forEach(container => container.textContent = myFloID) userFloIdContainers.forEach(container => container.textContent = myFloID)
hideLoader() hideLoader()
await token_app.actions.doShreeGanesh();
}).catch(error => console.error(error)) }).catch(error => console.error(error))
} }
</script> </script>
@ -1544,6 +1569,7 @@
} }
} }
}) })
let currentRequest = null; let currentRequest = null;
document.getElementById('activity_page').addEventListener('click', (e) => { document.getElementById('activity_page').addEventListener('click', (e) => {
if (e.target.closest('.report')) { if (e.target.closest('.report')) {
@ -11132,10 +11158,7 @@
{ {
"FCja6sLv58e3RMy41T5AmWyvXEWesqBCkX": { "FCja6sLv58e3RMy41T5AmWyvXEWesqBCkX": {
"upi_id": "8507742774@ybl" "upi_id": "8507742774@ybl"
} },
}`
/*
,
"FHW2kgYEhDt85vjAiMMF7bQqdP74L7iwvQ": { "FHW2kgYEhDt85vjAiMMF7bQqdP74L7iwvQ": {
"upi_id": "8340617958@ybl" "upi_id": "8340617958@ybl"
}, },
@ -11151,7 +11174,7 @@
"FQ6udJuTbGDa2kWZAkmNpwgHaUEeYLPAtt": { "FQ6udJuTbGDa2kWZAkmNpwgHaUEeYLPAtt": {
"upi_id": "krishraj1012-2@okicici" "upi_id": "krishraj1012-2@okicici"
} }
*/ }`
text = removeWhiteSpaces(text); text = removeWhiteSpaces(text);
return text; return text;
const master_data = await ajaxGet( const master_data = await ajaxGet(
@ -11233,14 +11256,6 @@
// fetch configs from master comment // fetch configs from master comment
await this.fetch_configs(); await this.fetch_configs();
await this.retrieveLatestContent();
request_rupee_token();
withdraw_token_to_get_cash();
transferTokensManually();
const allCashierOptions = document.querySelectorAll('.cashier-option'), const allCashierOptions = document.querySelectorAll('.cashier-option'),
allUserOptions = document.querySelectorAll('.user-option'), allUserOptions = document.querySelectorAll('.user-option'),
allHelplineOptions = document.querySelectorAll('.helpline-option'), allHelplineOptions = document.querySelectorAll('.helpline-option'),
@ -11303,9 +11318,18 @@
userType.forEach(user => user.textContent = 'User') userType.forEach(user => user.textContent = 'User')
showPage(document.getElementById('home_page_btn'), 'home_page') showPage(document.getElementById('home_page_btn'), 'home_page')
} }
hidePopup() hidePopup()
await this.retrieveLatestContent();
request_rupee_token();
withdraw_token_to_get_cash();
transferTokensManually();
pay_through_cashier(); pay_through_cashier();
}, },
@ -11602,7 +11626,6 @@
}); });
notify(`Transfer successful: ${flo_txid}`, 'success', true, true); notify(`Transfer successful: ${flo_txid}`, 'success', true, true);
return true; return true;
} }
} catch (error) { } catch (error) {
@ -12024,7 +12047,7 @@
document.getElementById('deposit_amount_section').classList.add('hide-completely') document.getElementById('deposit_amount_section').classList.add('hide-completely')
depositedRupeeTxId.disabled = false depositedRupeeTxId.disabled = false
request_tokens_btn.disabled = true request_tokens_btn.disabled = true
request_tokens_btn.children[0].textContent = 'Deposit' request_tokens_btn.children[0].textContent = 'Request'
} }
if (depositRequested === 1) { if (depositRequested === 1) {
btnLoading('request_tokens_btn', 'start') btnLoading('request_tokens_btn', 'start')