RanchiMall/flopay
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

bug fixes

Browse Source
This commit is contained in:
sairaj mote 2022-06-03 02:23:35 +05:30
parent 5ee21d2994
commit 1e8995076d
7 changed files with 71 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
css/main.css
View File

@ -274,24 +274,26 @@ ol li:not(:last-of-type)::after {
content: "";
position: absolute;
width: 0.1rem;
height: calc(100% - 1.5rem);
height: calc(100% - 2.2rem);
background: var(--accent-color);
margin-left: 0.6rem;
margin-top: 1.5rem;
margin-left: 0.7rem;
margin-top: 2rem;
}
ol li::before {
content: counter(item);
display: inline-flex;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
font-size: 0.8rem;
font-weight: 500;
margin-top: 0.15rem;
padding: 0.4rem;
margin-right: 1rem;
aspect-ratio: 1/1;
line-height: 1;
width: 1.5rem;
height: 1.5rem;
border-radius: 100%;
flex-shrink: 0;
color: rgba(var(--text-color), 0.8);
background: rgba(var(--text-color), 0.1);
}

2
css/main.min.css vendored
View File

File diff suppressed because one or more lines are too long

14
css/main.scss
View File

@ -244,26 +244,28 @@ ol {
content: "";
position: absolute;
width: 0.1rem;
height: calc(100% - 1.5rem);
height: calc(100% - 2.2rem);
background: var(--accent-color);
margin-left: 0.6rem;
margin-top: 1.5rem;
margin-left: 0.7rem;
margin-top: 2rem;
}
}
}
li::before {
content: counter(item);
display: inline-flex;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
font-size: 0.8rem;
font-weight: 500;
margin-top: 0.15rem;
padding: 0.4rem;
margin-right: 1rem;
aspect-ratio: 1/1;
line-height: 1;
width: 1.5rem;
height: 1.5rem;
border-radius: 100%;
flex-shrink: 0;
color: rgba(var(--text-color), 0.8);
background: rgba(var(--text-color), 0.1);
}

56
index.html
View File

@ -229,7 +229,7 @@
</svg>
Request
</button>
<button class="wallet-action cashier-option" onclick="showPopup('topup_wallet_popup')">
<button class="wallet-action cashier-option" onclick="openPopup('topup_wallet_popup')">
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24"
width="24px" fill="#000000">
<path d="M0 0h24v24H0z" fill="none" />
@ -238,7 +238,7 @@
</svg>
Top-up
</button>
<button class="wallet-action cashier-option" onclick="showPopup('withdraw_wallet_popup')">
<button class="wallet-action cashier-option" onclick="openPopup('withdraw_wallet_popup')">
<svg class="icon" xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24"
height="24px" viewBox="0 0 24 24" width="24px" fill="#000000">
<g>
@ -261,7 +261,7 @@
<div class="grid gap-0-5">
<h4>More from RanchiMall</h4>
<button class="integrated-action-button align-center"
onclick="showPopup('transfer_to_exchange_popup')">
onclick="openPopup('transfer_to_exchange_popup')">
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24"
width="24px" fill="#000000">
<path d="M0 0h24v24H0z" fill="none" />
@ -307,7 +307,7 @@
<h4>Payments</h4>
<h1>history</h1>
</div>
<button class="button button--small align-self-end" onclick="showPopup('payments_filters_popup')">
<button class="button button--small align-self-end" onclick="openPopup('payments_filters_popup')">
<svg class="icon margin-right-0-5" xmlns="http://www.w3.org/2000/svg" height="24px"
viewBox="0 0 24 24" width="24px" fill="#000000">
<path d="M0 0h24v24H0z" fill="none" />
@ -415,7 +415,7 @@
<p>No Saved FLO ID</p>
</div>
</section>
<button id="add_address_button" class="button interact fab" onclick="showPopup('add_address_popup')">
<button id="add_address_button" class="button interact fab" onclick="openPopup('add_address_popup')">
<svg class="icon margin-right-0-5" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24"
width="24px" fill="#000000">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -509,7 +509,7 @@
<div class="empty-state">
<p>Add your UPI IDs for easier access during transactions.</p>
</div>
<button class="button justify-self-start" onclick="showPopup('save_upi_popup')">
<button class="button justify-self-start" onclick="openPopup('save_upi_popup')">
<svg class="icon margin-right-0-5" xmlns="http://www.w3.org/2000/svg" height="24px"
viewBox="0 0 24 24" width="24px" fill="#000000">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -524,7 +524,7 @@
<sm-copy id="my_upi_id"></sm-copy>
</div>
<button id="change_upi_button" class="button button--small justify-self-start"
onclick="showPopup('change_cashier_upi_popup')">Change
onclick="openPopup('change_cashier_upi_popup')">Change
UPI</button>
</div>
</section>
@ -600,7 +600,7 @@
<!-- Popups -->
<sm-popup id="add_address_popup">
<header slot="header" class="popup__header">
<button class="popup__header__close justify-self-start" onclick="hidePopup()">
<button class="popup__header__close justify-self-start">
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px"
fill="#000000">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -624,7 +624,7 @@
<sm-popup id="edit_saved_popup">
<header slot="header" class="popup__header">
<div class="flex align-center">
<button class="popup__header__close" onclick="hidePopup()">
<button class="popup__header__close">
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px"
fill="#000000">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -657,7 +657,7 @@
</sm-popup>
<sm-popup id="token_transfer_popup">
<header slot="header" class="popup__header">
<button class="popup__header__close justify-self-start" onclick="hidePopup()">
<button class="popup__header__close justify-self-start">
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px"
fill="#000000">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -671,7 +671,7 @@
<sm-form>
<sm-input id="token_transfer__receiver" placeholder="FLO ID" error-text="Invalid FLO ID" data-flo-id
animate required autofocus>
<button slot="right" class="icon-only" onclick="showPopup('saved_ids_popup')"
<button slot="right" class="icon-only" onclick="openPopup('saved_ids_popup')"
title="Select from saved IDs">
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24"
width="24px" fill="#000000">
@ -707,7 +707,7 @@
<sm-popup id="saved_ids_popup">
<header slot="header" class="popup__header">
<div class="grid gap-1">
<button class="popup__header__close justify-self-start" onclick="hidePopup()">
<button class="popup__header__close justify-self-start">
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px"
fill="#000000">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -729,7 +729,7 @@
<sm-popup id="payments_filters_popup">
<header slot="header" class="popup__header">
<div class="grid gap-1">
<button class="popup__header__close justify-self-start" onclick="hidePopup()">
<button class="popup__header__close justify-self-start">
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px"
fill="#000000">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -783,7 +783,7 @@
</sm-popup>
<sm-popup id="topup_wallet_popup">
<header slot="header" class="popup__header">
<button class="popup__header__close justify-self-start" onclick="hidePopup()">
<button class="popup__header__close justify-self-start">
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px"
fill="#000000">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -813,22 +813,6 @@
</g>
</svg>
</sm-input>
<!-- <div class="grid gap-1">
<div class="grid gap-0-5 hide">
<p>
<b>Select UPI ID you'll send money from</b>
</p>
<sm-select id="select_topup_upi_id" style="z-index: 2;"></sm-select>
</div>
<button class="button button--small justify-self-start" onclick="showPopup('save_upi_popup')">
<svg class="icon margin-right-0-5" xmlns="http://www.w3.org/2000/svg" height="24px"
viewBox="0 0 24 24" width="24px" fill="#000000">
<path d="M0 0h24v24H0V0z" fill="none" />
<path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z" />
</svg>
Add UPI ID
</button>
</div> -->
<strong id="low_user_flo_warning" class="hide warning"></strong>
<button class="button button--primary cta" onclick="continueWalletTopup()"
type="submit">Continue</button>
@ -927,7 +911,7 @@
</sm-popup>
<sm-popup id="withdraw_wallet_popup">
<header slot="header" class="popup__header">
<button class="popup__header__close justify-self-start" onclick="hidePopup()">
<button class="popup__header__close justify-self-start">
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px"
fill="#000000">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -964,7 +948,7 @@
</p>
<sm-select id="select_withdraw_upi_id" style="z-index: 2;"></sm-select>
</div>
<button class="button button--small justify-self-start" onclick="showPopup('save_upi_popup')">
<button class="button button--small justify-self-start" onclick="openPopup('save_upi_popup')">
<svg class="icon margin-right-0-5" xmlns="http://www.w3.org/2000/svg" height="24px"
viewBox="0 0 24 24" width="24px" fill="#000000">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -1010,7 +994,7 @@
</sm-popup>
<sm-popup id="save_upi_popup">
<header slot="header" class="popup__header">
<button class="popup__header__close justify-self-start" onclick="hidePopup()">
<button class="popup__header__close justify-self-start">
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px"
fill="#000000">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -1028,7 +1012,7 @@
</sm-popup>
<sm-popup id="change_cashier_upi_popup">
<header slot="header" class="popup__header">
<button class="popup__header__close justify-self-start" onclick="hidePopup()">
<button class="popup__header__close justify-self-start">
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px"
fill="#000000">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -1048,7 +1032,7 @@
</sm-popup>
<sm-popup id="transfer_to_exchange_popup">
<header slot="header" class="popup__header">
<button class="popup__header__close justify-self-start" onclick="hidePopup()">
<button class="popup__header__close justify-self-start">
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px"
fill="#000000">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -1098,7 +1082,7 @@
<!-- Cashier popups -->
<sm-popup id="confirm_topup_popup">
<header slot="header" class="popup__header">
<button class="popup__header__close justify-self-start" onclick="hidePopup()">
<button class="popup__header__close justify-self-start">
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px"
fill="#000000">
<path d="M0 0h24v24H0V0z" fill="none" />

12
scripts/components.js
View File

@ -1468,7 +1468,7 @@ customElements.define('sm-popup', class extends HTMLElement {
this.popupContainer = this.shadowRoot.querySelector('.popup-container');
this.backdrop = this.shadowRoot.querySelector('.background');
this.popup = this.shadowRoot.querySelector('.popup');
this.dialogBox = this.shadowRoot.querySelector('.popup');
this.popupBodySlot = this.shadowRoot.querySelector('.popup-body slot');
this.popupHeader = this.shadowRoot.querySelector('.popup-top');
@ -1513,7 +1513,7 @@ customElements.define('sm-popup', class extends HTMLElement {
easing: 'ease'
}
const initialAnimation = (window.innerWidth > 640) ? 'scale(1.1)' : `translateY(${this.offset ? `${this.offset}px` : '100%'})`
this.animateTo(this.popup, [
this.animateTo(this.dialogBox, [
{
opacity: this.offset ? 1 : 0,
transform: initialAnimation
@ -1578,7 +1578,7 @@ customElements.define('sm-popup', class extends HTMLElement {
{ opacity: 1 },
{ opacity: 0 }
], animOptions)
this.animateTo(this.popup, [
this.animateTo(this.dialogBox, [
{
opacity: 1,
transform: (window.innerWidth > 640) ? 'none' : `translateY(${this.offset ? `${this.offset}px` : '0'})`
@ -1590,7 +1590,7 @@ customElements.define('sm-popup', class extends HTMLElement {
], animOptions).finished
.finally(() => {
this.popupContainer.classList.add('hide');
this.popup.style = ''
this.dialogBox.style = ''
this.removeAttribute('open');
if (this.forms.length) {
@ -1630,7 +1630,7 @@ customElements.define('sm-popup', class extends HTMLElement {
if (this.touchStartY < e.changedTouches[0].clientY) {
this.offset = e.changedTouches[0].clientY - this.touchStartY;
this.touchEndAnimation = window.requestAnimationFrame(() => {
this.popup.style.transform = `translateY(${this.offset}px)`;
this.dialogBox.style.transform = `translateY(${this.offset}px)`;
});
}
}
@ -1639,7 +1639,7 @@ customElements.define('sm-popup', class extends HTMLElement {
this.touchEndTime = e.timeStamp;
cancelAnimationFrame(this.touchEndAnimation);
this.touchEndY = e.changedTouches[0].clientY;
this.threshold = this.popup.getBoundingClientRect().height * 0.3;
this.threshold = this.dialogBox.getBoundingClientRect().height * 0.3;
if (this.touchEndTime - this.touchStartTime > 200) {
if (this.touchEndY - this.touchStartY > this.threshold) {
if (this.pinned) {

3
scripts/fn_ui.js
View File

@ -1049,4 +1049,5 @@ function signOut() {
location.reload();
}
});
}
}

37
scripts/std_ui.js
View File

@ -75,7 +75,7 @@ const debounce = (callback, wait) => {
let zIndex = 50
// function required for popups or modals to appear
function showPopup(popupId, pinned) {
function openPopup(popupId, pinned) {
zIndex++
getRef(popupId).setAttribute('style', `z-index: ${zIndex}`)
getRef(popupId).show({ pinned })
@ -83,11 +83,18 @@ function showPopup(popupId, pinned) {
}
// hides the popup or modal
function hidePopup() {
function closePopup() {
if (popupStack.peek() === undefined)
return;
popupStack.peek().popup.hide()
}
function popupState(show = false, id) {
if (show) {
openPopup(id);
} else {
closePopup();
}
}
document.addEventListener('popupopened', async e => {
const frag = document.createDocumentFragment()
@ -147,7 +154,7 @@ document.addEventListener('popupclosed', e => {
const getConfirmation = (title, options = {}) => {
return new Promise(resolve => {
const { message = '', cancelText = 'Cancel', confirmText = 'OK' } = options
showPopup('confirmation_popup', true)
openPopup('confirmation_popup', true)
getRef('confirm_title').innerText = title;
getRef('confirm_message').innerText = message;
let cancelButton = getRef('confirmation_popup').children[2].children[0],
@ -155,11 +162,11 @@ const getConfirmation = (title, options = {}) => {
submitButton.textContent = confirmText
cancelButton.textContent = cancelText
submitButton.onclick = () => {
hidePopup()
closePopup()
resolve(true);
}
cancelButton.onclick = () => {
hidePopup()
closePopup()
resolve(false);
}
})
@ -167,7 +174,7 @@ const getConfirmation = (title, options = {}) => {
// displays a popup for asking user input. Use this instead of JS prompt
function getPromptInput(title, message = '', options = {}) {
let { placeholder = '', isPassword = false, cancelText = 'Cancel', confirmText = 'OK' } = options
showPopup('prompt_popup', true)
openPopup('prompt_popup', true)
getRef('prompt_title').innerText = title;
getRef('prompt_message').innerText = message;
let buttons = getRef('prompt_popup').querySelectorAll("sm-button");
@ -181,12 +188,12 @@ function getPromptInput(title, message = '', options = {}) {
buttons[1].textContent = confirmText;
return new Promise((resolve, reject) => {
buttons[0].onclick = () => {
hidePopup()
closePopup()
return (null);
}
buttons[1].onclick = () => {
const value = getRef('prompt_input').value;
hidePopup()
closePopup()
resolve(value)
}
})
@ -261,7 +268,7 @@ window.addEventListener("load", () => {
document.querySelectorAll('sm-input[data-private-key]').forEach(input => input.customValidation = floCrypto.getPubKeyHex)
document.addEventListener('keyup', (e) => {
if (e.key === 'Escape') {
hidePopup()
closePopup()
}
})
document.addEventListener('copy', () => {
@ -272,7 +279,11 @@ window.addEventListener("load", () => {
createRipple(e, e.target.closest("button, sm-button, .interact"));
}
});
document.querySelectorAll('.popup__header__close, .close-popup-on-click').forEach(elem => {
elem.addEventListener('click', () => {
closePopup()
})
})
});
function createRipple(event, target) {
const circle = document.createElement("span");
@ -471,14 +482,18 @@ async function showPage(targetPage, options = {}) {
} else if (upi_txid) {
getRef('transaction__note').textContent = `UPI Transaction ID: ${upi_txid}`
}
getRef('transaction__note').classList.remove('hide')
} else if (status === 'REJECTED') {
const reason = cashierRejectionErrors.hasOwnProperty(note.split(':')[1]) ? cashierRejectionErrors[note.split(':')[1]] : note.split(':')[1]
getRef('transaction__note').innerHTML = `
<svg class="icon failed" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0z" fill="none"></path><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z"></path></svg>
${reason}
`
getRef('transaction__note').classList.remove('hide')
} else {
getRef('transaction__note').classList.add('hide')
getRef('transaction__note').textContent = ''
}
getRef('transaction__note').classList.remove('hide')
} else {
if (status === 'PENDING') {