summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--background.js21
-rw-r--r--data-viewer/data-viewer.css61
-rw-r--r--data-viewer/data-viewer.html31
-rw-r--r--data-viewer/data-viewer.js146
-rw-r--r--popup/popup.js28
5 files changed, 253 insertions, 34 deletions
diff --git a/background.js b/background.js
index 60fd68e..19ef0fe 100644
--- a/background.js
+++ b/background.js
@@ -818,11 +818,20 @@ function stopAutoUpdate() {
async function refetchCSS() {
if (logging) console.log("refetchCSS called");
try {
- const response = await fetch(
- "https://sameerasw.github.io/my-internet/styles.json",
- { headers: { "Cache-Control": "no-cache" } }
- );
- if (!response.ok) throw new Error("Failed to fetch styles.json");
+ // Get the repository URL from storage or use the default one
+ const DEFAULT_REPOSITORY_URL =
+ "https://sameerasw.github.io/my-internet/styles.json";
+ const repoUrlData = await browser.storage.local.get("stylesRepositoryUrl");
+ const repositoryUrl =
+ repoUrlData.stylesRepositoryUrl || DEFAULT_REPOSITORY_URL;
+
+ console.log("Background: Fetching styles from:", repositoryUrl);
+
+ const response = await fetch(repositoryUrl, {
+ headers: { "Cache-Control": "no-cache" },
+ });
+ if (!response.ok)
+ throw new Error(`Failed to fetch styles (Status: ${response.status})`);
const styles = await response.json();
await browser.storage.local.set({ styles });
@@ -849,7 +858,7 @@ async function refetchCSS() {
await browser.storage.local.set({ lastFetchedTime: Date.now() });
}
- console.info("All styles refetched and updated from GitHub.");
+ console.info(`All styles refetched and updated from ${repositoryUrl}`);
// Preload the new styles
preloadStyles();
diff --git a/data-viewer/data-viewer.css b/data-viewer/data-viewer.css
index 84f0131..17edbda 100644
--- a/data-viewer/data-viewer.css
+++ b/data-viewer/data-viewer.css
@@ -6,7 +6,7 @@
background-color: var(--secondary-bg);
border-radius: var(--radius-md);
padding: 16px;
- margin-bottom: 24px;
+ margin-bottom: 4px;
border-left: 3px solid var(--accent-color);
}
@@ -14,7 +14,7 @@
margin-top: 8px;
color: var(--text-secondary);
font-size: 13px;
- padding-left: 58px;
+ /* padding-left: 58px; */
}
/* General layout adjustments */
@@ -36,7 +36,7 @@ body {
/* Data section styling */
.data-section {
- margin-bottom: 24px;
+ margin-bottom: 4px;
background-color: var(--secondary-bg);
border-radius: var(--radius-md);
padding: 16px;
@@ -109,7 +109,7 @@ body {
}
.website-panel {
- margin-bottom: 8px;
+ margin-bottom: 4px;
background-color: var(--bg-color);
border-radius: var(--radius-md);
overflow: hidden;
@@ -362,7 +362,7 @@ body {
/* Danger zone styling */
.danger-zone {
- margin-top: 24px;
+ margin-top: 8px;
padding: 16px;
background-color: var(--danger-bg-color);
border: 1px solid var(--danger-border-color);
@@ -524,7 +524,8 @@ body {
margin-bottom: 16px;
}
-.import-container, #export-settings {
+.import-container,
+#export-settings {
flex: 1;
}
@@ -552,10 +553,56 @@ body {
font-weight: 500;
}
+/* Repository URL styling */
+.repository-url-container {
+ background-color: var(--bg-color);
+ border-radius: var(--radius-sm);
+ padding: 16px;
+ border-left: 3px solid var(--accent-color);
+}
+
+.repository-url-controls {
+ display: flex;
+ flex-direction: column;
+ gap: 12px;
+ margin-bottom: 16px;
+}
+
+.repository-url-input {
+ /* width: 100%; */
+ padding: 10px 12px;
+ border: 1px solid var(--border-color);
+ border-radius: var(--radius-md);
+ background-color: var(--bg-color);
+ color: var(--text-primary);
+ font-size: 14px;
+}
+
+.repository-url-input:focus {
+ outline: none;
+ border-color: var(--accent-color);
+}
+
+.repository-url-buttons {
+ display: flex;
+ gap: 12px;
+}
+
+.repository-url-status {
+ font-size: 14px;
+ margin-top: 8px;
+ padding: 8px 0;
+ border-radius: var(--radius-sm);
+}
+
/* Add responsive adjustments for mobile */
@media (max-width: 768px) {
- .backup-actions {
+ .repository-url-buttons {
flex-direction: column;
gap: 8px;
}
+
+ .repository-url-buttons button {
+ width: 100%;
+ }
}
diff --git a/data-viewer/data-viewer.html b/data-viewer/data-viewer.html
index 9400a53..5a7274e 100644
--- a/data-viewer/data-viewer.html
+++ b/data-viewer/data-viewer.html
@@ -27,11 +27,6 @@
</header>
<main class="app-content">
- <div class="actions">
- <button id="back-button" class="action-button secondary">
- <i class="fas fa-arrow-left"></i> Back to Extension
- </button>
- </div>
<div class="toggle-setting-container">
<div class="toggle-container">
@@ -46,6 +41,32 @@
</div>
</div>
+ <!-- New section for custom repository URL -->
+ <div class="data-section">
+ <h2 class="section-title">Custom Styles Repository</h2>
+ <div class="repository-url-container">
+ <p class="setting-description">
+ Change the URL where styles are fetched from. Use this if you want to use a different styles
+ repository.
+ <br><strong>Note:</strong> After changing the URL, you should clear existing styles data for
+ best results.
+ </p>
+ <div class="repository-url-controls">
+ <input type="text" id="repository-url" class="repository-url-input"
+ placeholder="Enter repository URL...">
+ <div class="repository-url-buttons">
+ <button id="set-repository-url" class="action-button primary">
+ <i class="fas fa-save"></i> Set URL
+ </button>
+ <button id="reset-repository-url" class="action-button secondary">
+ <i class="fas fa-undo"></i> Reset to Default
+ </button>
+ </div>
+ </div>
+ <div id="repository-url-status" class="repository-url-status"></div>
+ </div>
+ </div>
+
<!-- New section for backup/restore -->
<div class="data-section">
<h2 class="section-title">Backup & Restore ✨</h2>
diff --git a/data-viewer/data-viewer.js b/data-viewer/data-viewer.js
index 55ec808..fc76787 100644
--- a/data-viewer/data-viewer.js
+++ b/data-viewer/data-viewer.js
@@ -2,19 +2,29 @@ document.addEventListener("DOMContentLoaded", function () {
const BROWSER_STORAGE_KEY = "transparentZenSettings";
const SKIP_FORCE_THEMING_KEY = "skipForceThemingList";
const SKIP_THEMING_KEY = "skipThemingList";
+ const REPOSITORY_URL_KEY = "stylesRepositoryUrl";
+ const DEFAULT_REPOSITORY_URL =
+ "https://sameerasw.github.io/my-internet/styles.json";
const globalSettingsElement = document.getElementById("global-settings-data");
const skipListElement = document.getElementById("skip-list-data");
const combinedWebsitesElement = document.getElementById(
"combined-websites-data"
);
- const backButton = document.getElementById("back-button");
const deleteAllButton = document.getElementById("delete-all-data");
const versionElement = document.getElementById("addon-version");
const disableTransparencyToggle = document.getElementById(
"disable-transparency"
);
+ // Repository URL Elements
+ const repositoryUrlInput = document.getElementById("repository-url");
+ const setRepositoryUrlButton = document.getElementById("set-repository-url");
+ const resetRepositoryUrlButton = document.getElementById(
+ "reset-repository-url"
+ );
+ const repositoryUrlStatus = document.getElementById("repository-url-status");
+
// Backup & Restore Elements
const exportButton = document.getElementById("export-settings");
const importFileInput = document.getElementById("import-file");
@@ -26,11 +36,6 @@ document.addEventListener("DOMContentLoaded", function () {
// Display addon version
displayAddonVersion();
- // Event listener for the back button
- backButton.addEventListener("click", function () {
- window.close();
- });
-
// Event listener for disable transparency toggle
disableTransparencyToggle.addEventListener("change", function () {
saveTransparencySettings(this.checked);
@@ -47,10 +52,132 @@ document.addEventListener("DOMContentLoaded", function () {
}
});
+ // Repository URL event listeners
+ setRepositoryUrlButton.addEventListener("click", setRepositoryUrl);
+ resetRepositoryUrlButton.addEventListener("click", resetRepositoryUrl);
+
// New event listeners for export and import functionality
exportButton.addEventListener("click", exportSettings);
importFileInput.addEventListener("change", importSettings);
+ // Load the repository URL from storage
+ loadRepositoryUrl();
+
+ async function loadRepositoryUrl() {
+ try {
+ const data = await browser.storage.local.get(REPOSITORY_URL_KEY);
+ const repositoryUrl = data[REPOSITORY_URL_KEY] || DEFAULT_REPOSITORY_URL;
+ repositoryUrlInput.value = repositoryUrl;
+ } catch (error) {
+ console.error("Error loading repository URL:", error);
+ repositoryUrlInput.value = DEFAULT_REPOSITORY_URL;
+ }
+ }
+
+ async function setRepositoryUrl() {
+ try {
+ const newUrl = repositoryUrlInput.value.trim();
+
+ if (!newUrl) {
+ showRepositoryUrlStatus("Repository URL cannot be empty", "error");
+ return;
+ }
+
+ // Simple URL validation
+ try {
+ new URL(newUrl);
+ } catch (e) {
+ showRepositoryUrlStatus("Invalid URL format", "error");
+ return;
+ }
+
+ // Save the new URL to storage
+ await browser.storage.local.set({ [REPOSITORY_URL_KEY]: newUrl });
+
+ showRepositoryUrlStatus("Repository URL saved successfully", "success");
+
+ // Prompt the user to clear styles data
+ if (
+ confirm(
+ "Would you like to clear existing styles data to avoid conflicts with the new repository?\n\nThis will clear saved styles and website-specific settings, but keep your global settings."
+ )
+ ) {
+ await clearStylesData();
+ }
+ } catch (error) {
+ console.error("Error setting repository URL:", error);
+ showRepositoryUrlStatus(`Error saving URL: ${error.message}`, "error");
+ }
+ }
+
+ async function resetRepositoryUrl() {
+ try {
+ repositoryUrlInput.value = DEFAULT_REPOSITORY_URL;
+ await browser.storage.local.set({
+ [REPOSITORY_URL_KEY]: DEFAULT_REPOSITORY_URL,
+ });
+
+ showRepositoryUrlStatus("Repository URL reset to default", "success");
+
+ // Prompt to clear styles data
+ if (
+ confirm(
+ "Would you like to clear existing styles data to avoid conflicts?\n\nThis will clear saved styles and website-specific settings, but keep your global settings."
+ )
+ ) {
+ await clearStylesData();
+ }
+ } catch (error) {
+ console.error("Error resetting repository URL:", error);
+ showRepositoryUrlStatus(`Error resetting URL: ${error.message}`, "error");
+ }
+ }
+
+ async function clearStylesData() {
+ try {
+ // Get all storage data to filter what to keep and what to remove
+ const allData = await browser.storage.local.get(null);
+
+ // Create a new object with just the data we want to keep
+ const dataToKeep = {};
+
+ // Keep global settings
+ if (allData[BROWSER_STORAGE_KEY]) {
+ dataToKeep[BROWSER_STORAGE_KEY] = allData[BROWSER_STORAGE_KEY];
+ }
+
+ // Keep repository URL
+ if (allData[REPOSITORY_URL_KEY]) {
+ dataToKeep[REPOSITORY_URL_KEY] = allData[REPOSITORY_URL_KEY];
+ }
+
+ // Clear all storage first
+ await browser.storage.local.clear();
+
+ // Then restore the data we want to keep
+ await browser.storage.local.set(dataToKeep);
+
+ // Refresh the data display
+ loadAllData();
+
+ showRepositoryUrlStatus("Styles data cleared successfully", "success");
+ } catch (error) {
+ console.error("Error clearing styles data:", error);
+ showRepositoryUrlStatus(`Error clearing data: ${error.message}`, "error");
+ }
+ }
+
+ function showRepositoryUrlStatus(message, type) {
+ repositoryUrlStatus.textContent = message;
+ repositoryUrlStatus.className = `repository-url-status status-${type}`;
+
+ // Clear the message after 5 seconds
+ setTimeout(() => {
+ repositoryUrlStatus.textContent = "";
+ repositoryUrlStatus.className = "repository-url-status";
+ }, 5000);
+ }
+
async function deleteAllData() {
try {
// Clear all storage data
@@ -103,6 +230,8 @@ document.addEventListener("DOMContentLoaded", function () {
[BROWSER_STORAGE_KEY]: allData[BROWSER_STORAGE_KEY] || {},
[SKIP_FORCE_THEMING_KEY]: allData[SKIP_FORCE_THEMING_KEY] || [],
[SKIP_THEMING_KEY]: allData[SKIP_THEMING_KEY] || [],
+ [REPOSITORY_URL_KEY]:
+ allData[REPOSITORY_URL_KEY] || DEFAULT_REPOSITORY_URL,
};
// Also extract site-specific settings (keys that start with BROWSER_STORAGE_KEY.)
@@ -178,12 +307,15 @@ document.addEventListener("DOMContentLoaded", function () {
`Are you sure you want to import settings from ${importData.exportDate}? This will overwrite your current settings.`
)
) {
- // First store the global settings and lists
+ // First store the global settings, lists, and repository URL
const importOperations = {
[BROWSER_STORAGE_KEY]: importData.settings[BROWSER_STORAGE_KEY],
[SKIP_FORCE_THEMING_KEY]:
importData.settings[SKIP_FORCE_THEMING_KEY] || [],
[SKIP_THEMING_KEY]: importData.settings[SKIP_THEMING_KEY] || [],
+ [REPOSITORY_URL_KEY]:
+ importData.settings[REPOSITORY_URL_KEY] ||
+ DEFAULT_REPOSITORY_URL,
};
// Then add any site-specific settings if they exist
diff --git a/popup/popup.js b/popup/popup.js
index 5f8071d..6844415 100644
--- a/popup/popup.js
+++ b/popup/popup.js
@@ -666,15 +666,24 @@ new (class ExtensionPopup {
if (logging) console.log("refetchCSS called");
this.refetchCSSButton.textContent = "Fetching...";
try {
- const response = await fetch(
- "https://sameerasw.github.io/my-internet/styles.json",
- {
- headers: {
- "Cache-Control": "no-cache",
- },
- }
+ // Get the repository URL from storage or use the default one
+ const DEFAULT_REPOSITORY_URL =
+ "https://sameerasw.github.io/my-internet/styles.json";
+ const repoUrlData = await browser.storage.local.get(
+ "stylesRepositoryUrl"
);
- if (!response.ok) throw new Error("Failed to fetch styles.json");
+ const repositoryUrl =
+ repoUrlData.stylesRepositoryUrl || DEFAULT_REPOSITORY_URL;
+
+ console.log("Fetching styles from:", repositoryUrl);
+
+ const response = await fetch(repositoryUrl, {
+ headers: {
+ "Cache-Control": "no-cache",
+ },
+ });
+ if (!response.ok)
+ throw new Error(`Failed to fetch styles (Status: ${response.status})`);
const styles = await response.json();
await browser.storage.local.set({ styles });
@@ -723,7 +732,7 @@ new (class ExtensionPopup {
setTimeout(() => {
this.refetchCSSButton.textContent = "Refetch latest styles";
}, 2000);
- console.info("All styles refetched and updated from GitHub." + styles);
+ console.info(`All styles refetched and updated from ${repositoryUrl}`);
this.displayLastFetchedTime();
} catch (error) {
this.refetchCSSButton.textContent = "Error!";
@@ -731,6 +740,7 @@ new (class ExtensionPopup {
this.refetchCSSButton.textContent = "Refetch latest styles";
}, 2000);
console.error("Error refetching styles:", error);
+ alert(`Error fetching styles: ${error.message}`);
}
}