From fdba460e901972fe51462421dc83da4aec054ec0 Mon Sep 17 00:00:00 2001 From: Swapnil Srivastava <142904704+Swapnilden@users.noreply.github.com> Date: Fri, 17 May 2024 10:16:15 +0530 Subject: [PATCH] feat: Fixes:#148 Add Bookmark Manager Extension This commit introduces the Enhanced Bookmark Manager extension, which provides advanced bookmark management capabilities within the browser. The extension includes the following features: - **Bookmark Management**: Users can add bookmarks along with custom tags for better organization. - **Bookmark Display Options**: Users can choose whether to display tags with bookmarks. - **Sync Options**: Enables bookmark syncing across devices. - **Notification Options**: Users can opt to receive notifications for new bookmarks. ### Files and Directories - `manifest.json`: Defines the extension's metadata, permissions, and configurations. - `popup.html`: Provides the user interface for adding bookmarks and customizing options. - `popup.js`: Handles interactions in the popup interface. - `background.js`: Manages background tasks such as syncing bookmarks. - `options.html`: Allows users to customize their extension settings. - `styles.css`: Contains the styling for the popup interface to enhance user experience. - `icons`: Directory containing icon images (`icon16.png`, `icon48.png`, `icon128.png`). ### Features 1. **Add Bookmarks with Tags**: Users can add bookmarks directly from the popup, including custom tags for better categorization. 2. **Customization Options**: - **Bookmark Display Options**: Users can toggle the display of tags with bookmarks. - **Sync Options**: Users can enable or disable bookmark syncing across devices. - **Notification Options**: Users can enable or disable notifications for new bookmarks. 3. **Background Syncing**: Automatically sync bookmarks across devices using Chrome's storage API. 4. **Stylish and Responsive UI**: The popup and options pages are styled with CSS for a modern and responsive user interface. ### Future Enhancements - **Search Functionality**: Allow users to search bookmarks by tags or URLs. - **Advanced Tag Management**: Implement features for managing and organizing tags more effectively. - **Nested Folders**: Enable creating and managing nested folders for better bookmark organization. ### Commit Overview This commit lays the groundwork for an advanced bookmark management system within the browser. It provides a robust set of features for managing bookmarks more efficiently and sets the stage for future enhancements. --- Bookmark Extension/background.js | 27 +++++++++++++++++++++++++++ Bookmark Extension/icon128.png | Bin 0 -> 1301 bytes Bookmark Extension/icon16.png | Bin 0 -> 346 bytes Bookmark Extension/icon48.png | Bin 0 -> 1638 bytes Bookmark Extension/manifest.json | 24 ++++++++++++++++++++++++ Bookmark Extension/options.html | 27 +++++++++++++++++++++++++++ Bookmark Extension/popup.html | 18 ++++++++++++++++++ Bookmark Extension/popup.js | 17 +++++++++++++++++ Bookmark Extension/styles.css | 20 ++++++++++++++++++++ 9 files changed, 133 insertions(+) create mode 100644 Bookmark Extension/background.js create mode 100644 Bookmark Extension/icon128.png create mode 100644 Bookmark Extension/icon16.png create mode 100644 Bookmark Extension/icon48.png create mode 100644 Bookmark Extension/manifest.json create mode 100644 Bookmark Extension/options.html create mode 100644 Bookmark Extension/popup.html create mode 100644 Bookmark Extension/popup.js create mode 100644 Bookmark Extension/styles.css diff --git a/Bookmark Extension/background.js b/Bookmark Extension/background.js new file mode 100644 index 00000000..97d3af36 --- /dev/null +++ b/Bookmark Extension/background.js @@ -0,0 +1,27 @@ +// background.js + +// Listen for changes to bookmarks and update stored bookmarks +chrome.bookmarks.onCreated.addListener(updateStoredBookmarks); +chrome.bookmarks.onRemoved.addListener(updateStoredBookmarks); +chrome.bookmarks.onChanged.addListener(updateStoredBookmarks); + +// Sync bookmarks across devices using Chrome Storage API +function syncBookmarks() { + chrome.bookmarks.getTree(function(bookmarkTreeNodes) { + chrome.storage.sync.set({ 'bookmarks': bookmarkTreeNodes }, function() { + console.log('Bookmarks synced successfully.'); + }); + }); +} + +// Update stored bookmarks when changes occur +function updateStoredBookmarks() { + syncBookmarks(); +} + +// Initialize bookmark syncing on extension install or update +chrome.runtime.onInstalled.addListener(function(details) { + if (details.reason === 'install' || details.reason === 'update') { + syncBookmarks(); + } +}); diff --git a/Bookmark Extension/icon128.png b/Bookmark Extension/icon128.png new file mode 100644 index 0000000000000000000000000000000000000000..929c8cff924661fb53c68fb0bcaa2916886b106a GIT binary patch literal 1301 zcmeAS@N?(olHy`uVBq!ia0vp^4Is?H1|$#LC7uRSoCO|{#S9Gcbs)_6Mplg-C@5Lt z8c`CQpH@mmtT}V`<;yx0|Uzow;lBu1sFh5wJ#X$x*qGTZ_aVyK28(dPV6<_cdq#vrE5Sx-?s%Lg4K} zael6*6;tOOk#kvNzWBDAOYEBV3A55RuVrF)p~B`|SIn!rkH-`(NiU-nh_o{{OSJ+P?WWbuR2@n9pwTc7r~z z#cuxj{{^ZquHpK~=pS14w(Ykj!}lZimI||fn0)?mdj3M*_?Mf+9=y+Ch^uFOo_4KZ zZ)m67f&P>0%w_8KaO^I*)b`kV{^9xe&Q+b>F1lsjt?tkJzZ9*{bNzc^xt4W&)8oA} ztW&=3jd#8rz4Kk+1MLIb-yh$(ziLa^^+^%@c?r)2WR@q}+V|hDRs8;txq&fS_(1`G z7?)ZU!`dT!%o1H+|JX>`?SEA*TlU0c-a57z^%WV65;gv7(w`f4o25UuGV8yYe^Xp}gAF8f$`&F%9C<@pSjsQ+@}EB?OEZSmKR$lrZ_*SDUpH-4ip zul*(Z|Du1pj~i6of3_}-=ib(jACJwR?^Ck7yV@vr{rB43w4d=FVFGUiqBX1feAG&I_>&* zSIt(HkKbqWJ)tAfk!eN9AB~2C0-IGPNA2!itjN|{#aUx=LFVMUjRMY2tOdafEGOMP ztJvo9+qyxdnMq+e!wF4>BCduxgO+*c7pH<@LW#yVv89{sm<*hY-Y`t!_djsV{Mfx^ zA*bXUBqyC@-XK1|C0DAg)_~J>LhMfFh@u}ar;9l1J>^Z9dDwsdQVt{SbOu>I`@JrL zDM9-fjAZJnRx0gSSj0Nv@rTRNB987)ITJ+N=igh!5f;+Nu*>34NsCfM*hglLf*&t6 zTtCCdk;c%)TL*D$B58<7<1) zf5Hc=`jz|`wrWihUjI+{&nHZ|9zN&86#br^jXmLfUh~_Va@A|+Z4z*n z>fLG2@Z$f*YuBb$?X8O5?%eg6Pa#l)vWOJdYA6Gyj@Sw3Z9Ev#X7Cxh7wr^D@|eJI zr%>&P%*k_in`@pqGR>GNX~B6TT`|p5>|5sMNL$gApbkZbf`?7t`+LsFvV5>fnC*Oa v>e8B9vgxzWzPcT~?MBU;T$d$p{;_?U|2gXD+#|ujB8|b*)z4*}Q$iB}T_G^r literal 0 HcmV?d00001 diff --git a/Bookmark Extension/icon16.png b/Bookmark Extension/icon16.png new file mode 100644 index 0000000000000000000000000000000000000000..5c6e7144738cc12aae593db973f3d6d687d62147 GIT binary patch literal 346 zcmeAS@N?(olHy`uVBq!ia0vp^0wB!61|;P_|4#%`oCO|{#S9G0??IUHx&0RrprB-l zYeY$Kep*R+Vo@qXd3m{BW?pu2a$-TMUVc&f>~}U&Kt<0zT^vI!dXrNenDiy??AUL( z@m#`>^9qc@zmFd{P&EDF^Xbq3|KI!L=nYoSqm?upB6wBt~rOfi~Md{bM#a lH#XZOlfVDZ7jPb9W0>w}Jl`-Z>=Dq*44$rjF6*2UngHCfjT-;} literal 0 HcmV?d00001 diff --git a/Bookmark Extension/icon48.png b/Bookmark Extension/icon48.png new file mode 100644 index 0000000000000000000000000000000000000000..2d15541a163bd364b0efdca9e1c782e3859fe94a GIT binary patch literal 1638 zcmZ`%2~d+q6y5|WXCM|8GMAZUwnBk4w~Gmg`pxBK3{{l0m}z6@6vCz`5`Dgc1S zW-;BdX2`d)0zUmZR4TAC3}CtQ07zI4KvD_-lh~Ei2S5x44)_6JbrJyWh@9(gHULn6 zapm$IFaQB|C*T$W+jC%JcehL`l_4}qw*7;i4nLMolbxev#|T0bB#C7bAz5#)tg8!S z#z}Il1Mn~xQk)4Y77i9j<+M}T_b5)4fLRRe^MPFw6n@8@|tb*HQOi%*aTp;Yx_J5&uu;`ZaVdQ(}|n% zoG&yJUWcHT7X&N_9Ert&sPGPY_C_AJYl1v`2T5MTSv)vz8>DZAv$$}aUdlL1&Mbare1~Qq9 zo7vNdNA?GiyNd_bpD#sywlHRI-2UXm@Qqpu)TJ?n71d&~__v!k%CkcjP?gka3wKDS zXWllk=g{z?P}Nr1JA@PuJt~U(w;Zh&^XZDZ9MN899mSm)F-15Bia*DRDK+u8UWG3z5iIX$0F(&%rrdX6r(&m) zh|P0Q>Qki8o^L#)RTYUjjcn#7KC3anFNx~txZKS&QiZ*0{*kPoGmjthbmjX83j`Y# zO2bMA^>Xfhb#d2#&S^$|aarM|5}{v6eM58Iy?c!&hKArt&GL{i|6Rd*1d;=@wrwjb zZGRRPHZ-WOmz$Hr^Yu!lTU1{cC&nejPn9nT?duyHc-h}SGV)qeSy^2@N>gLg(;5Sv zc?Po=%+-ICUR3b?t$Oyc6`L~-{NJaZ$jpJD*l? zzCie}YZ-_A@QO$>JlDvxLaVIcyOGlsFWQ7&%%Ze|9LsQcEoP>2$a-GItEF~zmpc>N z20JZ<12YQkmU9P9WzmBeC?UhxI=vo*oDMI5J$4V;0Y-vYx6M6?nqo14j z)|UuorejVRe=AWsekNh0W_0(H`{W~r5Z=K(7R!*$12@6-o|zS})~JP&KP znwwc3#OE9{i}yk9UPzN*&H_2d rLl`WI6+{Jr*w|R(&^^1O0|XI4#=@wb*)MH$FbJ?6T$q>b{F46#69qr+ literal 0 HcmV?d00001 diff --git a/Bookmark Extension/manifest.json b/Bookmark Extension/manifest.json new file mode 100644 index 00000000..097c78cd --- /dev/null +++ b/Bookmark Extension/manifest.json @@ -0,0 +1,24 @@ +{ + "manifest_version": 3, + "name": "Enhanced Bookmark Manager", + "version": "1.0", + "description": "An extension to enhance bookmark management in the browser.", + "permissions": ["storage", "bookmarks"], + "action": { + "default_popup": "popup.html", + "default_icon": "icon16.png" + }, + "background": { + "service_worker": "background.js" + }, + "icons": { + "16": "icon16.png", + "48": "icon48.png", + "128": "icon128.png" + }, + "options_ui": { + "page": "options.html", + "open_in_tab": true + } + } + \ No newline at end of file diff --git a/Bookmark Extension/options.html b/Bookmark Extension/options.html new file mode 100644 index 00000000..336a2c14 --- /dev/null +++ b/Bookmark Extension/options.html @@ -0,0 +1,27 @@ + + + + + + Extension Options + + +

Extension Options

+

This is where you can customize your extension settings.

+ +

Bookmark Display Options

+ + +

Sync Options

+ + +

Notification Options

+ + + diff --git a/Bookmark Extension/popup.html b/Bookmark Extension/popup.html new file mode 100644 index 00000000..9860a528 --- /dev/null +++ b/Bookmark Extension/popup.html @@ -0,0 +1,18 @@ + + + + Bookmark Manager + + + + +
+

Bookmark Manager

+ Extension Logo + + + +
+
+ + diff --git a/Bookmark Extension/popup.js b/Bookmark Extension/popup.js new file mode 100644 index 00000000..91da7ebb --- /dev/null +++ b/Bookmark Extension/popup.js @@ -0,0 +1,17 @@ +document.addEventListener('DOMContentLoaded', function() { + document.getElementById('addBookmark').addEventListener('click', function() { + var url = document.getElementById('bookmarkUrl').value; + var tags = document.getElementById('bookmarkTags').value.split(',').map(tag => tag.trim()); + + chrome.bookmarks.create({ 'title': url, 'url': url }, function(newBookmark) { + chrome.storage.sync.get('bookmarks', function(result) { + var bookmarks = result.bookmarks || []; + bookmarks.push({ id: newBookmark.id, url: url, tags: tags }); + chrome.storage.sync.set({ 'bookmarks': bookmarks }, function() { + document.getElementById('status').textContent = 'Bookmark added successfully.'; + }); + }); + }); + }); + }); + \ No newline at end of file diff --git a/Bookmark Extension/styles.css b/Bookmark Extension/styles.css new file mode 100644 index 00000000..88a615cd --- /dev/null +++ b/Bookmark Extension/styles.css @@ -0,0 +1,20 @@ +/* styles.css */ +.container { + text-align: center; + padding: 20px; + } + + .btn { + background-color: #007bff; + color: #fff; + border: none; + padding: 10px 20px; + font-size: 16px; + border-radius: 5px; + cursor: pointer; + } + + .btn:hover { + background-color: #0056b3; + } + \ No newline at end of file