diff --git a/README.md b/README.md index 20d4e46..475eea2 100644 --- a/README.md +++ b/README.md @@ -1,19 +1,19 @@ -# Zen-Haven +# Zen Library A new way to organize Zen [(PR](https://github.com/zen-browser/desktop/pull/7550)) ## To-Do -An Optimistic To-Do list for Zen Haven +An Optimistic To-Do list for Zen Librat ### Downloads - [x] Functioning search - [ ] Image Preview - [ ] Media Player (MP3, MP4, etc.) - [ ] Vertical Time Slider -- [ ] Rename Files +- [x] Rename Files ### Workspaces -- [ ] Rearrange Workspaces by Drag-and-Drop -- [ ] Tab Groups are Displayed in Haven -- [ ] Copy Link Button (in place of reset pinned tab button) +- [x] Rearrange Workspaces by Drag-and-Drop +- [x] Tab Groups are Displayed in Haven +- [x] Copy Link Button - [ ] intigration with other userChrome.js mods like [Tab Sorters](https://github.com/Darsh-A/Ai-TabGroups-ZenBrowser) -- [ ] More Workspace Control Like Deltion, Creation, Renaming, etc. +- [x] More Workspace Control Like Deltion, Creation, Renaming, etc. ### History - [x] Functioning Search - [x] Filter History by date @@ -21,31 +21,5 @@ An Optimistic To-Do list for Zen Haven - [ ] Vertical Time Slider - [x] Delete History Items ### Integration -- [ ] Build a functioning mod store so people can submit there own sections to haven and incorperate addons -## Current -[Anoms12](https://github.com/Anoms12) -![image](https://github.com/user-attachments/assets/f0b3fa70-dc28-4df7-ae19-895add558de8) - -[ferrocyante](https://github.com/ferrocyante) - -https://github.com/user-attachments/assets/1ba2dca1-cdd4-4236-a96b-b83c414f85c7 - -[logicsec](https://github.com/logicsec) - - -https://github.com/user-attachments/assets/3b528fc9-849c-45d8-bed1-3adeb279b1a2 - - -**Downloads Concept** - -![image](https://github.com/user-attachments/assets/a8fde0b7-4e75-476f-a1d3-f72dc3f16f92) - - -**Download Concept 2** -Organized into the main download types only -![Frame 1](https://github.com/user-attachments/assets/b0ade386-871d-4225-b001-7434bcd5b4b8) - - -## The Goal -![Arc-Browser-Spaces](https://github.com/user-attachments/assets/b7e4e9ee-5d52-4112-bc75-1895d77aa40a) - +- [ ] Create addon section +- [ ] Create PR to zen-browser/desktop to add a native version of Library diff --git a/icons/copy-url.svg b/icons/copy-url.svg new file mode 100644 index 0000000..6bc6e4a --- /dev/null +++ b/icons/copy-url.svg @@ -0,0 +1,19 @@ + + + + + url [#1424] + Created with Sketch. + + + + + + + + + + + + + \ No newline at end of file diff --git a/icons/library.svg b/icons/library.svg new file mode 100644 index 0000000..f88e6f9 --- /dev/null +++ b/icons/library.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/sections/download.js b/sections/download.js index 431b3ee..ff95b21 100644 --- a/sections/download.js +++ b/sections/download.js @@ -8,7 +8,7 @@ export const downloadsSection = { `, init: function() { const downloadsViewContainer = parseElement( - `
`, + `
`, ); // --- Data Store and State --- @@ -181,22 +181,22 @@ export const downloadsSection = { const IMAGES_SVG = ``; const MEDIA_SVG = ``; - const header = parseElement(`
-
-

Downloads

+ const header = parseElement(`
+
+

Downloads

`); - const controls = parseElement(`
`); + const controls = parseElement(`
`); const searchFilterRow = parseElement( - `
`, + `
`, ); - const searchBox = parseElement(`
- ${SEARCH_SVG} - + const searchBox = parseElement(`
+ ${SEARCH_SVG} +
`); - // const searchInput = searchBox.querySelector(".haven-dl-search-input"); + // const searchInput = searchBox.querySelector(".library-dl-search-input"); searchFilterRow.appendChild(searchBox); const optionsHTML = ["all", "completed", "paused", "failed", "deleted"] @@ -212,15 +212,15 @@ export const downloadsSection = { ) .join(""); const statusFilter = parseElement( - ``, + ``, ); searchFilterRow.appendChild(statusFilter); // Remove view toggle and related logic - // const viewToggle = parseElement(`
- // - // //
`); // searchFilterRow.appendChild(viewToggle); @@ -235,26 +235,26 @@ export const downloadsSection = { const categoriesHTML = categories .map( (cat) => - ``, ) .join(""); const categoryTabsContainer = - parseElement(`
-
+ parseElement(`
+
${categoriesHTML}
`); categoryActiveIndicatorEl = categoryTabsContainer.querySelector( - ".haven-dl-category-active-indicator", + ".library-dl-category-active-indicator", ); controls.appendChild(categoryTabsContainer); - const stats = parseElement(`
-
Total: 0 Active: 0 Completed: 0
-
All downloads grouped by date
+ const stats = parseElement(`
+
Total: 0 Active: 0 Completed: 0
+
All downloads grouped by date
`); downloadsViewContainer.appendChild(header); @@ -262,7 +262,7 @@ export const downloadsSection = { downloadsViewContainer.appendChild(stats); const listContainer = parseElement( - `
`, + `
`, ); downloadsViewContainer.appendChild(listContainer); @@ -270,7 +270,7 @@ export const downloadsSection = { attachEventListeners(); const initialActiveTab = categoryTabsContainer.querySelector( - `.haven-dl-category-tab[data-category="${currentCategoryFilter}"]`, + `.library-dl-category-tab[data-category="${currentCategoryFilter}"]`, ); if (initialActiveTab) { requestAnimationFrame(() => @@ -320,8 +320,8 @@ export const downloadsSection = { if (viewInfoTextEl) viewInfoTextEl.textContent = "All downloads grouped by date"; if (filteredDisplayDownloads.length === 0) { - const emptyState = parseElement(`
- 📥 + const emptyState = parseElement(`
+ 📥

No downloads found.

`); listArea.appendChild(emptyState); @@ -347,7 +347,7 @@ export const downloadsSection = { }) .forEach((dateKey) => { const dateSeparator = parseElement( - `
${dateKey}
`, + `
${dateKey}
`, ); listArea.appendChild(dateSeparator); groupedByDate[dateKey] @@ -453,24 +453,24 @@ export const downloadsSection = { } } // NOTE: If you want previews to persist even if the file is deleted, you must cache a thumbnail at download time. - const el = parseElement(`
-
${iconHtml}
-
-
${iconHtml}
+
+
${item.filename || "Unknown Filename"}
-
+
${formatBytes(item.totalBytes)} • ${timeAgo(new Date(item.timestamp))} - ${item.url || "Unknown URL"} + ${item.url || "Unknown URL"}
-
-
-
+
+
+
-
${item.status === "deleted" ? "Deleted" : statusInfo.text}
+
${item.status === "deleted" ? "Deleted" : statusInfo.text}
`); @@ -480,7 +480,7 @@ export const downloadsSection = { showXULContextMenu(item, e.screenX, e.screenY); }); // Double-click to open file if completed - el.querySelector(".haven-dl-item-info").addEventListener("dblclick", (e) => { + el.querySelector(".library-dl-item-info").addEventListener("dblclick", (e) => { if (item.status === "completed") handleItemAction(item, "open", e); }); return el; @@ -494,7 +494,7 @@ export const downloadsSection = { } function createActionButton(action, title, svgPathD) { const button = document.createElement("button"); - button.className = "haven-dl-action-btn"; + button.className = "library-dl-action-btn"; button.dataset.action = action; button.title = title; button.appendChild(createSVGIcon(svgPathD)); @@ -769,10 +769,10 @@ export const downloadsSection = { renderUI(); } catch (err) { console.error( - "[ZenHaven Downloads] Error fetching or processing download history:", + "[Zenlibrary Downloads] Error fetching or processing download history:", err, ); - downloadsViewContainer.innerHTML = `

Error loading download history.

${err.message}\n${err.stack}
`; + downloadsViewContainer.innerHTML = `

Error loading download history.

${err.message}\n${err.stack}
`; } })(); } @@ -822,7 +822,7 @@ export const downloadsSection = { } function attachEventListeners() { const searchInputEl = downloadsViewContainer.querySelector( - ".haven-dl-search-input", + ".library-dl-search-input", ); if (searchInputEl) searchInputEl.addEventListener("input", (e) => { @@ -838,28 +838,28 @@ export const downloadsSection = { }); // Remove all currentViewMode logic and state // downloadsViewContainer - // .querySelectorAll(".haven-dl-view-btn") + // .querySelectorAll(".library-dl-view-btn") // .forEach((btn) => { // btn.addEventListener("click", (e) => { // currentViewMode = e.currentTarget.dataset.view; // downloadsViewContainer - // .querySelectorAll(".haven-dl-view-btn") + // .querySelectorAll(".library-dl-view-btn") // .forEach((b) => b.classList.remove("active")); // e.currentTarget.classList.add("active"); // updateAndRenderDownloadsList(); // }); // }); const categoryTabsContainerEl = downloadsViewContainer.querySelector( - ".haven-dl-category-tabs-container", + ".library-dl-category-tabs-container", ); categoryTabsContainerEl - .querySelectorAll(".haven-dl-category-tab") + .querySelectorAll(".library-dl-category-tab") .forEach((tab) => { tab.addEventListener("click", (e) => { const clickedTab = e.currentTarget; currentCategoryFilter = clickedTab.dataset.category; categoryTabsContainerEl - .querySelectorAll(".haven-dl-category-tab") + .querySelectorAll(".library-dl-category-tab") .forEach((t) => t.classList.remove("active")); clickedTab.classList.add("active"); updateCategoryIndicatorPosition(clickedTab); @@ -867,7 +867,7 @@ export const downloadsSection = { }); }); const initialActiveCatTab = categoryTabsContainerEl.querySelector( - `.haven-dl-category-tab[data-category="${currentCategoryFilter}"]`, + `.library-dl-category-tab[data-category="${currentCategoryFilter}"]`, ); if (initialActiveCatTab) { updateCategoryIndicatorPosition(initialActiveCatTab); @@ -1020,7 +1020,7 @@ export const downloadsSection = { renderUI(); } } catch (err) { - console.error("[ZenHaven Downloads] Error polling downloads:", err); + console.error("[Zenlibrary Downloads] Error polling downloads:", err); } } @@ -1073,7 +1073,7 @@ export const downloadsSection = { } } catch (e) { console.warn( - "[ZenHaven Downloads] Error creating nsIFile or getting leafName from path:", + "[Zenlibrary Downloads] Error creating nsIFile or getting leafName from path:", d.target.path, e, ); @@ -1106,7 +1106,7 @@ export const downloadsSection = { } } catch (e) { console.warn( - "[ZenHaven Downloads] Error extracting filename from URL:", + "[Zenlibrary Downloads] Error extracting filename from URL:", d.source.url, e, ); @@ -1180,16 +1180,16 @@ export const downloadsSection = { .filter((d) => d.timestamp); console.log( - "[ZenHaven Downloads] Processed Download Items:", + "[Zenlibrary Downloads] Processed Download Items:", allFetchedDownloads.length, ); renderUI(); } catch (err) { console.error( - "[ZenHaven Downloads] Error fetching or processing download history:", + "[Zenlibrary Downloads] Error fetching or processing download history:", err, ); - downloadsViewContainer.innerHTML = `

Error loading download history.

${err.message}\n${err.stack}
`; + downloadsViewContainer.innerHTML = `

Error loading download history.

${err.message}\n${err.stack}
`; } })(); @@ -1199,7 +1199,7 @@ export const downloadsSection = { function ensureXULContextMenu() { if (xulContextMenu) return xulContextMenu; const menuXML = ` - + @@ -1245,10 +1245,10 @@ export const downloadsSection = { // --- Rename Dialog --- function showRenameDialog(item) { // Remove any existing dialog - const existing = document.getElementById('haven-dl-rename-dialog'); + const existing = document.getElementById('library-dl-rename-dialog'); if (existing) existing.remove(); const overlay = parseElement(` -
+
Rename File
diff --git a/sections/history.js b/sections/history.js index 8366c73..d9b6635 100644 --- a/sections/history.js +++ b/sections/history.js @@ -7,11 +7,11 @@ export const historySection = { `, init: function() { - console.log("[ZenHaven] History init triggered"); + console.log("[Zenlibrary] History init triggered"); // Create main container with loading message const historyContainer = parseElement( - `
+ `
@@ -24,7 +24,7 @@ export const historySection = {
-
+
Loading history...
@@ -32,17 +32,17 @@ export const historySection = { ); const loadingIndicator = parseElement( - `