From a632701b08d1541b7be0e9f8ab072ea52529fbdb Mon Sep 17 00:00:00 2001 From: dsernst Date: Fri, 5 Dec 2014 21:57:45 -0800 Subject: [PATCH] add: options page to store user email --- manifest.json | 5 +++-- options.html | 17 +++++++++++++++++ options.js | 27 ++++++++++++++++++++++++++ style.css | 53 ++++++++++++++++++++++++++++++++++++++++++++++----- 4 files changed, 95 insertions(+), 7 deletions(-) create mode 100644 options.html create mode 100644 options.js diff --git a/manifest.json b/manifest.json index 01e2503..1c22cde 100644 --- a/manifest.json +++ b/manifest.json @@ -1,9 +1,10 @@ { "name": "Share with Letsfix.net", "description": "Post the current URL to letsfix.net", - "version": "0.3", + "version": "0.5", + "options_page": "options.html", "permissions": [ - "tabs", "http://*/*", "https://*/*", "*://*.amazonaws.com/*" + "tabs", "http://*/*", "https://*/*", "*://*.amazonaws.com/*", "storage" ], "content_security_policy": "script-src 'self' https://ajax.googleapis.com; object-src 'self'", "icons": { "16": "icon16.png", diff --git a/options.html b/options.html new file mode 100644 index 0000000..500228b --- /dev/null +++ b/options.html @@ -0,0 +1,17 @@ + + + + Lfx-Post Options + + + +
+ Your email address: + +
+ +
+ + + + \ No newline at end of file diff --git a/options.js b/options.js new file mode 100644 index 0000000..e649d03 --- /dev/null +++ b/options.js @@ -0,0 +1,27 @@ +// Saves options to chrome.storage +function save_options() { + var email = document.getElementById('userEmail').value; + chrome.storage.sync.set({ + user: email, + }, function () { + // Update status to let user know options were saved. + var status = document.getElementById('status'); + status.textContent = 'Options saved.'; + setTimeout(function () { + status.textContent = ''; + }, 750); + }); +} + +// Restores the preferences stored in chrome.storage. +function restore_options() { + // Use default value user = ''. + chrome.storage.sync.get({ + user: '', + }, function (items) { + document.getElementById('userEmail').value = items.user; + }); +} +document.addEventListener('DOMContentLoaded', restore_options); +document.getElementById('save').addEventListener('click', + save_options); \ No newline at end of file diff --git a/style.css b/style.css index e14653e..571fa10 100644 --- a/style.css +++ b/style.css @@ -8,12 +8,55 @@ width: 100%; } -.userInfo { - min-width: 239px; - min-height: 70px; - width: 97.5%; -} .hidden { display: none; +} + +.optionsPage { + background-color: #283544; +} + +.userInfo { + width: 500px; + margin: 20px auto; + padding: 30px; + background-color: white; + border-radius: 6px; + box-shadow: 0px 6px 30px 0px rgba(0,0,0,0.6); +} + +.userInfo span { + font-size: 16px; +} + +#userEmail { + width: 53%; + padding: 6px 12px; + font-size: 14px; + line-height: 1.42857143; + color: #555; + background-color: #fff; + border: 1px solid #ccc; + border-radius: 4px; + box-shadow: inset 0 1px 1px rgba(0,0,0,.075); + transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; +} + +.userInfo #save { + font-size: 16px; + padding: 6px 12px; + border-radius: 5px; + border: 0px; + color: #fff; + background-color: #337ab7; + border-color: #2e6da4; + position: relative; + left: 88%; + top: 14px; +} + +.userInfo #save:hover { + background-color: #286090; + border-color: #204d74; } \ No newline at end of file