create ad banner

forgetso · Apr 10, 2024 · 4050ffd · 4050ffd
1 parent 1dea7e0
commit 4050ffd
Show file tree

Hide file tree

Showing 3 changed files with 35 additions and 1 deletion.
diff --git a/assets/help.html b/assets/help.html
@@ -17,7 +17,13 @@
     </head>
 
     <body>
-        <div class="container" class="bg-light-subtle">
+
+        <div class="container bg-light-subtle">
+            <div class="text-center alert alert-info mt-2">
+                <a href="https://prosopo.io/?utm_source=search_and_replace&utm_medium=extension&utm_campaign=help_link&term=need+bot+protection&utm_content=textlink" target="_blank" class="link-body-emphasis">
+                    Ad: Need bot protection? The builders of Search and Replace bring you Procaptcha - free for up to 100k requests per month.
+                </a>
+            </div>
             <div class="row">
                 <div class="col-md-3" role="complementary">
                     <nav class="navbar border-bottom border-bottom-dark">

diff --git a/assets/popup.html b/assets/popup.html
@@ -87,6 +87,13 @@
     </head>
 
     <body>
+        <div class="alert alert-info text-center m-2" id="ad">
+            <span>Ad:</span>
+            <a href="https://prosopo.io/?utm_source=search_and_replace&utm_medium=extension&utm_campaign=popup_link&term=need+bot+protection&utm_content=textlink" target="_blank" class="link-body-emphasis bold">
+                Need bot protection?
+            </a>
+            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close" id="ad-close"></button>
+        </div>
         <div id="loader">
             <img src="ajax-loader.gif" width="16" height="16" name="loading" alt="searching and replacing..." />
         </div>

diff --git a/src/popup.ts b/src/popup.ts
@@ -62,7 +62,9 @@ window.addEventListener('DOMContentLoaded', async function () {
 
     // Restore the recent search replace instance and history list from storage
     port.onMessage.addListener(function (msg: SearchReplaceStorageItems) {
+        console.log('received msg', msg)
         const history: SearchReplaceInstance[] = msg.history || []
+        const hideAd: boolean = msg.hintPreferences?.ad || false
         let recentSearch: SearchReplaceInstance = msg.instance
         if (history.length > 0) {
             recentSearch = recentSearch || history[0]
@@ -71,6 +73,13 @@ window.addEventListener('DOMContentLoaded', async function () {
         if (recentSearch) {
             restoreSearchReplaceInstance(recentSearch)
         }
+        if (hideAd) {
+            const adElement = document.getElementById('ad')
+            if (adElement) {
+                document.body.removeChild(adElement)
+            }
+        }
+
         // Trigger a search term count if there is an existing search term
         contentScriptCall('count', recentSearch, history).catch((e) => {
             console.error(e)
@@ -139,6 +148,18 @@ window.addEventListener('DOMContentLoaded', async function () {
         autoGrow(searchTerm)
         autoGrow(replaceTerm)
     })
+
+    // Click handler for closing the ad banner
+    const adCloseElement = document.getElementById('ad-close')
+    if (adCloseElement) {
+        adCloseElement.onclick = function () {
+            const searchReplaceInput = getInputValues(false)
+            const history = constructSearchReplaceHistory()
+            const hintPreferences: HintPreferences = { ['ad']: true }
+            sendToStorage(searchReplaceInput, history, hintPreferences)
+        }
+    }
+
     // Localize HTML elements
     localizeElements(langData)
 })