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

Standardizing ad blocker warning

Browse Source
This commit is contained in:
sairaj mote 2023-02-14 00:13:11 +05:30
parent 6f5503ca9b
commit ea6b9f5cb9
1 changed files with 68 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

79
index.html
View File

@ -60,7 +60,6 @@
</div>
</sm-form>
</sm-popup>
<div id="adblocker_warning"></div>
<div id="secondary_pages" class="page hidden">
<header class="flex align-center gap-1">
<div class="flex align-center flex-1">
@ -1598,17 +1597,8 @@
})
}
function detectAdBlocker(error) {
let isBrave = navigator.brave !== undefined
if (error === 'Cloud offline') {
renderElem(getRef('adblocker_warning'), html`
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M4.47 21h15.06c1.54 0 2.5-1.67 1.73-3L13.73 4.99c-.77-1.33-2.69-1.33-3.46 0L2.74 18c-.77 1.33.19 3 1.73 3zM12 14c-.55 0-1-.45-1-1v-2c0-.55.45-1 1-1s1 .45 1 1v2c0 .55-.45 1-1 1zm1 4h-2v-2h2v2z"/></svg>
<h1>Ad-Blocker Detected!</h1>
<p>
It seems like you are using an ad-blocker. Please disable it and reload the page.
We don't show any ads on this app and we don't track you.
</p>
${isBrave ? html`<strong>If you have enabled Brave shield then disable it also.</strong>` : ''}
`)
document.body.prepend(document.createElement('adblocker-warning'))
} else {
notify(error, "error")
}
@ -2566,6 +2556,73 @@
this.querySelector('#generated_private_key').value = ''
}
});
const adBlockerWarning = document.createElement('template')
adBlockerWarning.innerHTML = `
<style>
* {
padding: 0;
margin: 0;
box-sizing: border-box;
}
:host{
display: flex;
flex-direction: column;
align-content: center;
justify-content: center;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 50;
background-color: rgba(var(--foreground-color), 1);
}
#adblocker_warning {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
gap: 1rem;
padding: 1.5rem;
}
h1{
font-size: 2rem;
margin-top: 1rem;
}
p{
font-size: 0.9rem;
max-width: 65ch;
line-height: 1.7;
color: rgba(var(--text-color), 0.9);
}
.icon {
height: 4rem;
width: 4rem;
fill: #ffc107;
}
</style>
<article id="adblocker_warning"></article>
`;
window.customElements.define('adblocker-warning', class extends HTMLElement {
constructor() {
super();
this.attachShadow({ mode: 'open' });
this.shadowRoot.appendChild(adBlockerWarning.content.cloneNode(true));
}
connectedCallback() {
const isBrave = navigator.brave !== undefined
this.shadowRoot.querySelector('#adblocker_warning').innerHTML = `
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M4.47 21h15.06c1.54 0 2.5-1.67 1.73-3L13.73 4.99c-.77-1.33-2.69-1.33-3.46 0L2.74 18c-.77 1.33.19 3 1.73 3zM12 14c-.55 0-1-.45-1-1v-2c0-.55.45-1 1-1s1 .45 1 1v2c0 .55-.45 1-1 1zm1 4h-2v-2h2v2z"/></svg>
<h1>Ad-Blocker Detected!</h1>
<p>
It seems like you are using an ad-blocker. Please disable it and reload the page.
We don't show any ads on this app and we don't track you.
</p>
${isBrave ? `<strong>If you have enabled Brave shield then disable it also.</strong>` : ''}
`;
}
});
</script>
<script>
/*jshint esversion: 8 */