bump manifest version for fix to icon size

Merge pull request #9 from GandalfDG/icon_tweaks
make 32px icons actually 32 px
2025-11-23 14:31:04 +00:00 · 2025-11-23 09:29:49 -05:00 · 2025-11-23 14:29:05 +00:00 · 2025-11-23 14:21:16 +00:00 · 2025-11-23 09:17:50 -05:00 · 2025-11-23 09:17:12 -05:00
10 changed files with 179 additions and 51 deletions
--- a/.gitignore
+++ b/.gitignore
@@ -1,2 +1,5 @@
 scripts/
-node_modules/
+node_modules/
+package/
+
+package.zip
--- a/icons/virus_black_32.png
+++ b/icons/virus_black_32.png
--- a/icons/virus_white_32.png
+++ b/icons/virus_white_32.png
--- a/manifest.json
+++ b/manifest.json
@@ -1,7 +1,7 @@
 {
    "manifest_version": 2,
    "name": "Slop Farmer",
-    "version": "0.4",
+    "version": "0.5.2",

    "author": "Jack Case",
    "description": "Crowd-source AI slop pages and domains",
@@ -13,22 +13,21 @@
        "*://*.duckduckgo.com/*"
    ],

-    "content_security_policy": "script-src 'self' 'wasm-unsafe-eval'; object-src 'self'; worker-src 'self' blob:",
+    "content_security_policy": "script-src 'self' 'wasm-unsafe-eval'; object-src 'self'; worker-src 'self'",

    "browser_action": {
-        "default_icon": "icons/virus-slash.png",
        "default_title": "Slop Farmer",
        "default_popup": "pages/action_popup.html",
        "default_area": "navbar",
        "theme_icons": [
            {
-                "dark": "icons/virus_white_16.png",
-                "light": "icons/virus_black_16.png",
+                "dark": "icons/virus_black_16.png",
+                "light": "icons/virus_white_16.png",
                "size": 16
            },
            {
-                "dark": "icons/virus_white_32.png",
-                "light": "icons/virus_black_32.png",
+                "dark": "icons/virus_black_32.png",
+                "light": "icons/virus_white_32.png",
                "size": 32
            }
        ]
@@ -44,5 +43,16 @@
            "matches": ["*://*.duckduckgo.com/*q=*"],
            "js": ["scripts/content-script.js"]
        }
-    ]
+    ],
+
+    "browser_specific_settings": {
+        "gecko": {
+            "data_collection_permissions": {
+                "required": [
+                    "authenticationInfo",
+                    "personallyIdentifyingInfo"
+                ]
+            }
+        }
+    }
 }
--- a/package-extension.sh
+++ b/package-extension.sh
@@ -0,0 +1,4 @@
+#!/usr/bin/bash
+
+tsc;
+zip -r package.zip icons/ pages/ scripts/ styles/ manifest.json;
--- a/pages/action_popup.html
+++ b/pages/action_popup.html
@@ -1,50 +1,86 @@
 <html lang="en">
+
 <head>
    <meta charset="UTF-8">
    <!-- <meta name="viewport" content="width=device-width, initial-scale=1.0"> -->
    <!-- <script async defer src="https://cdn.jsdelivr.net/gh/altcha-org/altcha/dist/altcha.min.js" type="module"></script> -->
    <script async src="/scripts/browser-action.js" type="module"></script>
    <script async defer src="/scripts/altcha/dist/altcha.js" type="module"></script>
+    <link rel="stylesheet" href="/styles/bulma/bulma.min.css">
    <title>Slop Farmer</title>
 </head>
+
 <body>
-    <nav>
-        <button id="signup-select" type="button">sign up</button>
-        <button id="login-select" type="button">log in</button>
-    </nav>
-
-    <div id="onboarding" style="visibility: visible;">
-        <h1>Welcome, Slop Farmer!</h1>
-        <p>tired of ai-generated slop articles in your search results? Sign up or log in to start reporting slop articles
-            and have reported slop flagged in your searches!
-        </p>
+    <div id="onboarding" style="visibility: visible;" class="hero is-primary not-logged-in">
+        <div class="hero-body">
+            <h1 class="title">Welcome, Slop Farmer!</h1>
+            <p>tired of ai-generated slop articles in your search results? Sign up or log in to start reporting slop
+                articles and have reported slop flagged in your searches!</p>
+        </div>
    </div>

-    <div id="signup" style="visibility: collapse;">
-        <form id="signup-form">
-            <label for="email">email</label>
-            <input type="email" name="email" required />
-            <label for="password">password</label>
-            <input type="password" name="password" required />
-            <altcha-widget challengeurl="https://api.slopfarmer.jack-case.pro/altcha-challenge"></altcha-widget>
-            <button id="signup-button">sign up</button>
-        </form>
-    </div>
+    <button id="logout-button" class="button is-small logged-in">Logout</button>

-    <div id="login" style="visibility: collapse;">
-        <h1>Log in to enable slop checking and reporting</h1>
-        <form id="login-form">
-            <label for="email" id="username">username</label>
-            <input type="text" name="username" required />
-            <label for="password" id="password">password</label>
-            <input type="password" name="password" required />
-            <button id="login-button">login</button>
-        </form>
-        <h2 style="visibility: collapse;" id="login-status">You're logged in.</h2>  
-    </div>
+    <div class="section">
+        <nav class="tabs is-centered not-logged-in">
+            <ul>
+                <li id="signup-tab"><a>sign up</a></li>
+                <li id="login-tab"><a>log in</a></li>
+            </ul>
+        </nav>

-    <div id="report" style="visibility: collapse;">
-        <button id="report-button">Report this page</button>
-        <h2></h2>
+
+
+        <div id="signup" style="display:block" class="box">
+            <h1 class="title">Sign Up</h1>
+            <form id="signup-form">
+                <div class="field">
+                    <label for="email" class="label">E-Mail</label>
+                    <div class="control">
+                        <input type="email" name="email" required class="input" />
+                    </div>
+                </div>
+                <div class="field">
+                    <label for="password" class="label">Password</label>
+                    <div class="control">
+                        <input type="password" name="password" required class="input" />
+                    </div>
+                </div>
+                <div class="field">
+                    <altcha-widget challengeurl="https://api.slopfarmer.jack-case.pro/altcha-challenge"></altcha-widget>
+                </div>
+                <div class="field">
+                    <button id="signup-button" class="button is-primary">sign up</button>
+                </div>
+            </form>
+            <h2></h2>
+        </div>
+
+        <div id="login" style="display:none" class="box">
+            <h1 class="title">Log In</h1>
+            <form id="login-form">
+                <div class="field">
+                    <label for="email" id="username" class="label">E-Mail</label>
+                    <div class="control">
+                        <input type="text" name="username" required class="input" />
+                    </div>
+                </div>
+                <div class="field">
+                    <label for="password" id="password" class="label">Password</label>
+                    <div class="control">
+                        <input type="password" name="password" required class="input" />
+                    </div>
+                </div>
+                <div class="field">
+                    <button id="login-button" class="button is-primary">log in</button>
+                </div>
+            </form>
+            <h2 style="visibility: collapse;" id="login-status">You're logged in.</h2>
+        </div>
+
+        <div id="report" style="display: none" class="block">
+            <button id="report-button" class="button is-primary">Report this page</button>
+            <h2></h2>
+        </div>
    </div>
 </body>
--- a/src/browser-action.ts
+++ b/src/browser-action.ts
@@ -1,3 +1,4 @@
+import { getTextOfJSDocComment } from "../node_modules/typescript/lib/typescript.js"
 import { API_URL, send_message_to_background } from "./common.js"

 let popup_state: PopupState = null
@@ -10,19 +11,45 @@ class PopupState {

    page_elements: Map<string, HTMLElement>

-    constructor(logged_in: boolean, page_sections: Map<string, HTMLElement>, visible_section: string, page_elements: Map<string, HTMLElement>) {
+    visible_logged_in: Array<HTMLElement>
+    visible_logged_out: Array<HTMLElement>
+
+    constructor(logged_in: boolean, page_sections: Map<string, HTMLElement>, visible_section: string, page_elements: Map<string, HTMLElement>, visible_logged_in: Array<HTMLElement>, visible_logged_out: Array<HTMLElement>) {
        this.logged_in = logged_in
        this.page_sections = page_sections
        this.visible_section = visible_section
-        this.set_visible_section(logged_in ? "report" : "signup")
        this.page_elements = page_elements
+
+        this.visible_logged_in = visible_logged_in
+        this.visible_logged_out = visible_logged_out
+    }
+
+    update_login_visibility() {
+        this.visible_logged_in.forEach((element) => {
+            element.style.display = this.logged_in ? "block" : "none"
+        })
+        this.visible_logged_out.forEach((element) => {
+            element.style.display = this.logged_in ? "none" : "block"
+        })
    }

    set_visible_section(section_id: string) {
        this.visible_section = section_id
+        switch (section_id) {
+            case "signup":
+                this.page_elements.get("signup_button").setAttribute("class", "is-active")
+                this.page_elements.get("login_button").setAttribute("class", "")
+                break
+            case "login":
+                this.page_elements.get("login_button").setAttribute("class", "is-active")
+                this.page_elements.get("signup_button").setAttribute("class", "")
+                break
+        }
        this.page_sections.forEach((element, id) => {
-            element.style.visibility = id === section_id ? "visible" : "collapse"
+            element.style.display = id === section_id ? "block" : "none"
        })
+
+        this.update_login_visibility()
    }
 }

@@ -47,6 +74,8 @@ async function submit_login_form() {
        const status_el = document.getElementById("login-status")
        status_el.setAttribute("style", "visibility: visible;")

+        popup_state.logged_in = true
+
        popup_state.set_visible_section("report")
    }
    else {
@@ -66,10 +95,16 @@ async function submit_signup_form() {

    console.log(response)
    if (response.ok) {
-        
+        popup_state.page_elements.get("signup_status").textContent = "check your email for a verification link from slopfarmer@jack-case.pro. It may be in your spam folder."
    }
 }

+async function logout() {
+    const response = await send_message_to_background({type: "logout"})
+    popup_state.logged_in = false
+    popup_state.set_visible_section("login")
+}
+
 async function check_login(): Promise<boolean> {
    const response = await send_message_to_background({type: "islogged"})
    return response.logged_in
@@ -85,10 +120,12 @@ async function initialize_popup() {
    const login_section = document.getElementById("login")
    const report_section = document.getElementById("report")

-    const signup_button = document.getElementById("signup-select") as HTMLButtonElement
-    const login_button = document.getElementById("login-select") as HTMLButtonElement
+    const signup_button = document.getElementById("signup-tab")
+    const signup_status = signup_section.querySelector("h2")
+    const login_button = document.getElementById("login-tab")
    const report_button = document.getElementById("report-button") as HTMLButtonElement
    const report_status = report_section.querySelector("h2")
+    const logout_button = document.getElementById("logout-button")

    const page_sections = new Map()
    page_sections.set("signup", signup_section)
@@ -99,13 +136,19 @@ async function initialize_popup() {
    page_elements.set("login_form", login_form as HTMLElement)
    page_elements.set("login_status", login_status)
    page_elements.set("signup_form", signup_form as HTMLElement)
+    page_elements.set("signup_status", signup_status)
    page_elements.set("report_button", report_button)
    page_elements.set("report_status", report_status)
-    
+    page_elements.set("signup_button", signup_button)
+    page_elements.set("login_button", login_button)
+
+    const logged_in_items = Array.from(document.querySelectorAll(".logged-in")) as Array<HTMLElement>
+    const logged_out_items = Array.from(document.querySelectorAll(".not-logged-in")) as Array<HTMLElement>

    const logged_in = await check_login()

-    popup_state = new PopupState(logged_in, page_sections, "signup", page_elements)
+    popup_state = new PopupState(logged_in, page_sections, "signup", page_elements, logged_in_items, logged_out_items)
+    popup_state.set_visible_section(logged_in ? "report" : "signup")

    login_form.addEventListener("submit", (event) => { event.preventDefault(); submit_login_form() })
    signup_form.addEventListener("submit", (event) => { event.preventDefault(); submit_signup_form() })
@@ -117,6 +160,9 @@ async function initialize_popup() {
        popup_state.page_elements.get("report_status").textContent = "report accepted"
        setTimeout(() => { window.close() }, 1000)
    })
+    logout_button.addEventListener("click", async (event) => {
+        logout()
+    })
 }

 addEventListener("DOMContentLoaded", (event) => {
--- a/src/report-slop.ts
+++ b/src/report-slop.ts
@@ -225,6 +225,11 @@ function message_listener(message: any, sender: any, send_response: Function): P
            return new Promise((resolve, reject) => { resolve(response) })
            break

+        case "logout":
+            localStorage.removeItem("accessToken")
+            return new Promise((resolve, reject) => { resolve(true) })
+            break
+
        case "report":
            return new Promise((resolve, reject) => {
                browser.tabs.query({ active: true, currentWindow: true }).then((tabs) => {
--- a/styles/bulma/LICENSE
+++ b/styles/bulma/LICENSE
@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2023 Jeremy Thomas
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.
--- a/styles/bulma/bulma.min.css
+++ b/styles/bulma/bulma.min.css
Author	SHA1	Message	Date
Jack Case	47ad67c6d8	bump manifest version for fix to icon size	2025-11-23 14:31:04 +00:00
Jack Case	b602b79fe2	Merge pull request #9 from GandalfDG/icon_tweaks make 32px icons actually 32 px	2025-11-23 09:29:49 -05:00
Jack Case	c53c9a326f	make 32px icons actually 32 px	2025-11-23 14:29:05 +00:00
Jack Case	5ce34bec91	theme_icons works, it's just the opposite of what I thought.	2025-11-23 14:21:16 +00:00
Jack Case	1f04a6227f	Merge pull request #8 from GandalfDG/feat_bulma_ui Convert Browser Action Popup to use Bulma CSS	2025-11-23 09:17:50 -05:00
Jack Case	39d0b7ea23	Merge branch 'main' into feat_bulma_ui	2025-11-23 09:17:12 -05:00
Jack Case	0308aa85f4	remove default_icon key in the hope that theme_icons will work	2025-11-23 14:13:34 +00:00
Jack Case	d1a9cd04b3	add package.zip to .gitignore	2025-11-23 14:05:05 +00:00
Jack Case	d3531afa05	add a logout button and improve logged in ui state handling	2025-11-23 14:04:51 +00:00
Jack Case	f03a7ac85e	Merge pull request #7 from GandalfDG/package-script created script to zip the extension for uploading	2025-11-23 08:34:48 -05:00
Jack Case	8527a9252b	created script to zip the extension for uploading package-extension.sh	2025-11-23 13:32:05 +00:00
Jack Case	a29d43f226	bump minor version and remove a csp permission in manifest.json	2025-11-23 13:29:33 +00:00
Jack Case	b5aeee47ea	created script to zip the extension for uploading package-extension.sh	2025-11-23 13:27:42 +00:00
Jack Case	7faef08713	update manifest.json	2025-11-21 22:52:07 +00:00
Jack Case	e025f3995c	signup/login tabs are reactive	2025-11-21 14:07:11 +00:00
Jack Case	39fb3320c9	working on popup styling with bulma	2025-11-19 23:07:12 +00:00
Jack Case	bb68883781	add package/ to .gitignore	2025-11-17 12:32:47 +00:00
Jack Case	542b9f9dba	add a status notification to direct users to verify their email	2025-11-17 12:32:28 +00:00