finishing my update of the quicknote extension, to get it to use the WebExtensions Storage API.

This commit is contained in:
chrisdavidmills
2016-04-08 16:37:03 +01:00
parent 66d9a2fc82
commit 3975b1cb1b
4 changed files with 56 additions and 20 deletions

BIN
.DS_Store vendored

Binary file not shown.

20
quicknote/README.md Normal file
View File

@@ -0,0 +1,20 @@
# Quicknote
A persistent note/to-do list application — click a button in your browser and record notes, which will persist even after browser restarts.
Works in Firefox 47+, and will also work as a Chrome extension, out of the box.
## What it does
This extension includes:
* A browser action that creates a popup — within the popup is:
* Two form elements for entering title and body text for a new note, along with a button to add a note, and a button to clear all notes.
* A list of the notes that have been added to the extension — each note includes a delete button to delete just that extension. You can also click on the note title and body to edit them. In edit mode, each note includes:
* An update button to submit an update.
* A cancel button to cancel the update.
Quicknote uses the WebExtensions [Storage API](https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API/storage) to persist the notes.
## What it shows
* How to persist data in a WebExtension using the Storage API.

View File

@@ -4,24 +4,30 @@
box-sizing: border-box;
}
html,body {
margin: 0;
}
html {
font-family: sans-serif;
font-size: 10px;
background: white;
background: background: rgb(240,240,240);
height: 300px;
}
body {
width: 300px;
background: rgb(240,240,240);
border: 1px solid #ccc;
margin: 0 auto;
padding: 2px;
height: inherit;
}
.outer-wrapper {
overflow: auto;
width: 100%;
height: 300px;
background: rgb(240,240,240);
}
.clearfix {

View File

@@ -20,7 +20,7 @@ initialize();
function initialize() {
chrome.storage.local.get(null,function(results) {
var noteKeys = Object.keys(results)
var noteKeys = Object.keys(results);
for(i = 0; i < noteKeys.length; i++) {
var curKey = noteKeys[i];
var curValue = results[curKey];
@@ -34,15 +34,26 @@ function initialize() {
function addNote() {
var noteTitle = inputTitle.value;
var noteBody = inputBody.value;
if(!chrome.storage.local.get(noteTitle) && noteTitle !== '' && noteBody !== '') {
inputTitle.value = '';
inputBody.value = '';
displayNote(noteTitle,noteBody);
storeNote(noteTitle,noteBody);
}
chrome.storage.local.get(noteTitle, function(result) {
var objTest = Object.keys(result);
if(objTest.length < 1 && noteTitle !== '' && noteBody !== '') {
inputTitle.value = '';
inputBody.value = '';
displayNote(noteTitle,noteBody);
storeNote(noteTitle,noteBody);
}
})
}
/* function to store a new note in storage */
function storeNote(title, body) {
chrome.storage.local.set({ [title] : body }, function() {
});
}
/* function to display a note in the note box */
function displayNote(title, body) {
/* create note display box */
@@ -133,18 +144,17 @@ function displayNote(title, body) {
}
/* functions to update and store notes */
/* function to update notes */
function updateNote(delNote,newTitle,newBody) {
chrome.storage.local.set({ newTitle : newBody }, function() {
chrome.storage.local.remove(delNote);
displayNote(newTitle, newBody);
});
}
function storeNote(title, body) {
chrome.storage.local.set({ title : body }, function() {
chrome.storage.local.set({ [newTitle] : newBody }, function() {
if(delNote !== newTitle) {
chrome.storage.local.remove(delNote, function() {
displayNote(newTitle, newBody);
});
} else {
displayNote(newTitle, newBody);
}
});
}