Skip to content

Commit

Permalink
Merge branch 'master' of https://github.com/DaniloNovakovic/chrome-dy…
Browse files Browse the repository at this point in the history 
…namic-bookmarks
  • Loading branch information
@DaniloNovakovic
DaniloNovakovic committed Aug 29, 2019
2 parents b182cd4 + a662378 commit 20a983f
Show file tree
Hide file tree
Showing 5 changed files with 99 additions and 67 deletions.
2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "chrome-dynamic-bookmarks",
"version": "2.6.0",
"version": "2.7.0",
"description": "Chrome extension which dynamically updates bookmarks based on the specified regular expression.",
"scripts": {
"dev": "webpack --mode development",
Expand Down
18 changes: 13 additions & 5 deletions src/css/popup.css
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,14 @@
#popup-form {
min-width: 320px;
min-height: 260px;
padding-right: 2em;
padding-bottom: 1em;
.popup-wrapper {
min-width: 400px;
min-height: 200px;
margin: 0;
overflow: hidden;
}

.popup-form {
padding-top: 1.5em;
}

.popup-form-btn-wrapper {
padding: 1em 0;
}
36 changes: 18 additions & 18 deletions src/js/popup/index.js
View file
Original file line number Diff line number Diff line change
@@ -1,17 +1,17 @@
import * as dynBookmarks from '../lib/dynBookmarks';
import * as dynBookmarks from "../lib/dynBookmarks";

document.addEventListener('DOMContentLoaded', function() {
document.addEventListener("DOMContentLoaded", function() {
// materializecss modal
const popupModalEl = document.querySelector('#popup-modal');
const popupModalEl = document.querySelector("#popup-modal");
const popupModalInstance = M.Modal.init(popupModalEl, { dismissible: true });
const formResponse = document.getElementById('form-response');
const formResponse = document.getElementById("form-response");

// update storage on form submit
const popupForm = document.getElementById('popup-form');
popupForm.addEventListener('submit', popupSubmit);
const popupForm = document.getElementById("popup-form");
popupForm.addEventListener("submit", popupSubmit);

// url to use in case of error
const defaultUrl = 'https://www.google.com';
const defaultUrl = "https://www.google.com";

chrome.tabs.query(
{
Expand All @@ -20,12 +20,12 @@ document.addEventListener('DOMContentLoaded', function() {
},
function(tabs) {
const url = tabs[0].url || defaultUrl;
const title = tabs[0].title || '';
const title = tabs[0].title || "";

// fill form
const bookmarkNameInput = document.getElementById('bookmark-name-input');
const urlInput = document.getElementById('url-input');
const regExpInput = document.getElementById('regexp-input');
const bookmarkNameInput = document.getElementById("bookmark-name-input");
const urlInput = document.getElementById("url-input");
const regExpInput = document.getElementById("regexp-input");

if (bookmarkNameInput) {
bookmarkNameInput.value = title;
Expand All @@ -39,7 +39,7 @@ document.addEventListener('DOMContentLoaded', function() {
} else {
const regExpString = url.replace(
/(^(http[s]?:\/\/)?(www\.)?)|(\/[^/]*?(\?.*)?$)|(\/[^/?]+\/$)/g,
''
""
);
regExpInput.value = regExpString.replace(/\./g, `\\.`);
}
Expand All @@ -51,31 +51,31 @@ document.addEventListener('DOMContentLoaded', function() {
event.preventDefault();

// extract values from form
const url = event.target['url'].value;
const title = event.target['bookmark_name'].value;
const url = event.target["url"].value;
const title = event.target["bookmark_name"].value;
let regExpString = event.target.regexp.value;
try {
new RegExp(event.target.regexp.value);
} catch {
formResponse.textContent = 'Invalid regular expression';
formResponse.textContent = "Invalid regular expression";
popupModalInstance.open();
return false;
}

handleBookmarkSubmit(title, url, regExpString, (err) => {
handleBookmarkSubmit(title, url, regExpString, err => {
if (err) {
console.warn(err);
formResponse.textContent = err;
} else {
formResponse.textContent = 'Bookmark has been submitted successfully.!';
formResponse.textContent = "Bookmark has been submitted successfully.!";
}
popupModalInstance.open();
});
}

function handleBookmarkSubmit(title, url, regExp, done) {
const newUrl = url || defaultUrl;
chrome.bookmarks.create({ title, url: newUrl }, (newBookmark) => {
chrome.bookmarks.create({ title, url: newUrl }, newBookmark => {
if (chrome.runtime.lastError) {
done(chrome.runtime.lastError.message);
} else {
Expand Down
3 changes: 0 additions & 3 deletions src/manifest.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,8 +24,5 @@
"64": "icons8_Books_64.png",
"128": "icons8_Books_128.png"
},
"chrome_url_overrides": {
"bookmarks": "bookmarkManager.html"
},
"content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'"
}
107 changes: 67 additions & 40 deletions src/popup.html
View file
Original file line number Diff line number Diff line change
@@ -1,49 +1,76 @@
<!DOCTYPE html>
<html lang="en">
<html lang="en" class="popup-wrapper">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>DynBookmark Popup Form</title>
</head>

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>DynBookmark Popup Form</title>
</head>

<body>
<div class="container">
<form action="#" id="popup-form">
<div class="input-field">
<label for="bookmark-name-input">Bookmark name: </label>
<input type="text" id="bookmark-name-input" name="bookmark_name" required>
<body class="popup-wrapper">
<nav class="nav-extended">
<div class="nav-content">
<ul class="tabs tabs-transparent">
<li class="tab"><a class="active">Add Bookmark</a></li>
<li class="tab">
<a id="open-manager" target="_blank" href="bookmarkManager.html"
>Open Manager</a
>
</li>
</ul>
</div>
</nav>
<div class="container">
<form action="#" id="popup-form" class="popup-form">
<div class="input-field">
<label for="bookmark-name-input">Bookmark name: </label>
<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="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>
</div>
<div class="input-field">
<label for="regexp-input">RegExp: </label>
<input type="text" id="regexp-input" name="regexp" required />
</div>

<button class="btn waves-effect waves-light green" type="submit">
Submit
<i class="material-icons right">send</i>
</button>
</form>
<div class="input-field popup-form-btn-wrapper">
<button class="btn waves-effect waves-light green" type="submit">
Submit
<i class="material-icons right">send</i>
</button>
</div>
</form>

<!-- Modal Structure -->
<div id="popup-modal" class="modal">
<div class="modal-content">
<p id="form-response"></p>
</div>
<div class="modal-footer">
<a href="#!" class="modal-close waves-effect waves-green btn-flat">Close</a>
<!-- Modal Structure -->
<div id="popup-modal" class="modal">
<div class="modal-content">
<p id="form-response"></p>
</div>
<div class="modal-footer">
<a href="#!" class="modal-close waves-effect waves-green btn-flat"
>Close</a
>
</div>
</div>
</div>

</div>
</body>

</html>
</body>
</html>

0 comments on commit 20a983f

Please sign in to comment.