Merge pull request #28 from DaniloNovakovic/v2

v2.4.0

README.md

@@ -64,6 +64,8 @@ Lets start off by clicking on the extension icon on top right. <br>
 Here we need to enter a name of the bookmark we wish to create,
 and a regular expression (regExp) based on which our bookmark will be updated. <br />
 
+> Note: Since v2.4.0 regExp is automatically generated / suggested.
+
 But WHAT is a **regular expression**? It simply **is a sequence of characters that define a search pattern**. Ever did CTRL+F to find something on page? Well it's preety much the same thing, but with extra special characters that let your search be more flexible.
 
 Once the form is submited a dynamic bookmark will be created inside `Other bookmarks` folder.

package.json

@@ -1,6 +1,6 @@
 {
   "name": "chrome-dynamic-bookmarks",
-  "version": "2.3.1",
+  "version": "2.4.0",
   "description": "Chrome extension which dynamically updates bookmarks based on the specified regular expression.",
   "scripts": {
     "dev": "webpack --mode development",

src/css/popup.css

@@ -1,5 +1,6 @@
 #popup-form {
   min-width: 320px;
-  min-height: 200px;
+  min-height: 260px;
   padding-right: 2em;
+  padding-bottom: 1em;
 }

src/js/bookmarkManager/folderInfo.js

@@ -125,7 +125,7 @@ function createFolderInfoChild(
   let hostName = url.match(/^(http[s]?:\/\/.*?\/)/i);
   let faviconLink;
   if (hostName) {
-    hostName = hostName[0].replace(/http[s]:\/\//, '');
+    hostName = hostName[0].replace(/http[s]?:\/\//, '');
     faviconLink = 'https://www.google.com/s2/favicons?domain=' + hostName;
   } else {
     // i used this instead of ../images/ because default_favicon is located

src/js/bookmarkManager/selectHandler.js

@@ -39,7 +39,11 @@ class SelectHandler {
             console.warn(chrome.runtime.lastError.message);
           } else {
             openAllParentFolders(bookmarks[0].parentId);
-            window.location = '#' + id;
+            element.scrollIntoView({
+              behavior: 'smooth',
+              block: 'center',
+              inline: 'nearest'
+            });
           }
         });
       }

src/js/popup/index.js

@@ -13,10 +13,40 @@ document.addEventListener('DOMContentLoaded', function() {
   // url to use in case of error
   const defaultUrl = 'https://www.google.com';
 
+  chrome.tabs.query(
+    {
+      active: true,
+      currentWindow: true
+    },
+    function(tabs) {
+      const url = tabs[0].url || defaultUrl;
+
+      // fill form
+      const urlInput = document.getElementById('url-input');
+      const regExpInput = document.getElementById('regexp-input');
+
+      if (urlInput) {
+        urlInput.value = url;
+      }
+      if (/youtube\.com\/.*list=\w+/.test(url)) {
+        const regExpString = url.match(/list=\w+/i);
+        regExpInput.value = `youtube\.com\/.*${regExpString}`;
+      } else {
+        const subUrl = url.match(/^(http[s]?:\/\/)?(.*\/)|(.*$)/);
+        if (subUrl) {
+          const regExpString = subUrl[0].replace(/http[s]?:\/\/(www\.)?/, '');
+          regExpInput.value = `${regExpString.replace(/[.]/g, `\.`)}.*`;
+        }
+      }
+      M.updateTextFields();
+    }
+  );
+
   function popupSubmit(event) {
     event.preventDefault();
 
     // extract values from form
+    const url = event.target['url'].value;
     const title = event.target['bookmark_name'].value;
     let regExpString = event.target.regexp.value;
     try {
@@ -27,25 +57,15 @@ document.addEventListener('DOMContentLoaded', function() {
       return false;
     }
 
-    chrome.tabs.query(
-      {
-        active: true,
-        currentWindow: true
-      },
-      function(tabs) {
-        const url = tabs[0].url || defaultUrl;
-        handleBookmarkSubmit(title, url, regExpString, (err) => {
-          if (err) {
-            console.warn(err);
-            formResponse.textContent = err;
-          } else {
-            formResponse.textContent =
-              'Bookmark has been submitted successfully.!';
-          }
-          popupModalInstance.open();
-        });
+    handleBookmarkSubmit(title, url, regExpString, (err) => {
+      if (err) {
+        console.warn(err);
+        formResponse.textContent = err;
+      } else {
+        formResponse.textContent = 'Bookmark has been submitted successfully.!';
       }
-    );
+      popupModalInstance.open();
+    });
   }
 
   function handleBookmarkSubmit(title, url, regExp, done) {

src/manifest.json

@@ -2,7 +2,7 @@
   "manifest_version": 2,
   "name": "Dynamic Bookmarks",
   "description": "Chrome extension which dynamically updates bookmarks based on the specified regular expression.",
-  "version": "2.3.1",
+  "version": "2.4.0",
   "permissions": ["tabs", "bookmarks", "storage"],
   "background": {
     "page": "background.html"

src/popup.html

@@ -16,6 +16,12 @@
         <input type="text" id="bookmark-name-input" name="bookmark_name" required>
       </div>
 
+      <div class="input-field">
+        <label for="url-input">Url: </label>
+        <input type="url" class="validate" id="url-input" name="url" required>
+        <span class="helper-text" data-error="url must be in form http[s]://..."></span>
+      </div>
+
       <div class="input-field">
         <label for="regexp-input">RegExp: </label>
         <input type="text" id="regexp-input" name="regexp" required>