Improved look of action messages. (Save, Delete, Edit, etc...)

This commit is contained in:
Maxim Stewart 2019-03-01 01:20:25 -06:00
parent eaf366ca33
commit c84579000b
9 changed files with 179 additions and 161 deletions

View File

@ -4,8 +4,8 @@ Easy Session Manager allows you to manage your Firefox session by backing up or
# Download # Download
https://addons.mozilla.org/en-US/firefox/addon/easy-session-manager/ https://addons.mozilla.org/en-US/firefox/addon/easy-session-manager/
# Version: 0.0.7 # Version: 0.1.0
Added override message for session edits. Improved look of action messages. (Save, Delete, Edit, etc...)
# Images # Images
![1 Default interface with no sessions. ](images/pic1.png) ![1 Default interface with no sessions. ](images/pic1.png)

View File

@ -1,7 +1,7 @@
{ {
"manifest_version": 2, "manifest_version": 2,
"name": " Easy Session Manager", "name": " Easy Session Manager",
"version": "0.0.7", "version": "0.1.0",
"description": " Easy Session Manager allows you to manage your Firefox session by backing up or loading your saved sessions.", "description": " Easy Session Manager allows you to manage your Firefox session by backing up or loading your saved sessions.",
"applications": { "applications": {

View File

@ -29,6 +29,8 @@ body, html {
</span> </span>
<script src="../scripts/sweetalert.min.js"></script>
<script src="../scripts/background.js"></script> <script src="../scripts/background.js"></script>
</body> </body>
</html> </html>

View File

@ -34,11 +34,14 @@
<button type="button" name="delete"> <button type="button" name="delete">
Delete <img class="icon" src="../images/icons/delete.png" alt="Delete Image"/> Delete <img class="icon" src="../images/icons/delete.png" alt="Delete Image"/>
</button> </button>
</center> </center>
<a id="downloadAnchorElem" href="#"></a> <a id="downloadAnchorElem" href="#"></a>
<script src="../scripts/events.js"></script> <script src="../scripts/events.js"></script>
<script src="../scripts/sweetalert.min.js"></script>
<script src="../scripts/sessionManager.js"></script> <script src="../scripts/sessionManager.js"></script>
</body> </body>

View File

@ -1,53 +1,47 @@
const regexp = /^[a-zA-Z0-9-_]+$/; // Alphanumeric, dash, underscore const regexp = /^[a-zA-Z0-9-_]+$/; // Alphanumeric, dash, underscore
const processor = (obj, enteryName = '',
const alertMessage = (type, message) => { message = "What is this session's name? Allowed: a-z, A-Z, -, _") => {
let msgTag = document.getElementById("allertMessage");
let text = document.createTextNode(message);
let fontColor = "rgba(255, 255, 255, 1)";
let bgColor = "";
if (type === "success") {
bgColor = "rgba(72, 125, 25, 1)";
} else if (type === "warning") {
bgColor = "rgba(195, 123, 0, 1)";
} else if (type === "error") {
bgColor = "rgba(125, 45, 25, 1)";
}
msgTag.style.backgroundColor = bgColor;
msgTag.style.color = fontColor;
msgTag.style.display = "block";
msgTag.append(text);
setTimeout(function () {
let msgTag = document.getElementById("allertMessage");
msgTag.innerHTML = "";
msgTag.style.display = "none";
}, 4000);
}
const processor = (obj, enteryName = '') => {
let data = obj.target.result; let data = obj.target.result;
let inputTag = document.createElement("INPUT");
inputTag.value = enteryName;
do { swal(message, {
enteryName = prompt("What is this session's name? Allowed: a-z, A-Z, -, _", '' + enteryName); content: inputTag,
if (enteryName == null) break buttons: true,
} while (enteryName.search(regexp) == -1); }).then((value) => {
if (value) {
enteryName = inputTag.value.replace(/ /g, "_");
if (enteryName) { if (enteryName) {
if (enteryName.search(regexp) == -1) {
processor(obj, enteryName, "Please try again...\nAllowed: a-z, A-Z, -, _")
return ;
}
try { try {
console.log("Importing session..."); console.log("Importing session...");
JSON.parse(data); JSON.parse(data);
browser.storage.local.set({[enteryName]: data}); browser.storage.local.set({[enteryName]: data});
alertMessage("success", "Imported file successfully.") swal("Imported file successfully.", {
icon: "success",
});
} catch (e) { } catch (e) {
alertMessage("error", "Failed to import data. Not a JSON parsable file."); swal("Failed to import data. Not a JSON parsable file.", {
icon: "error",
});
return ; return ;
} }
} else { } else {
alertMessage("warning", "Canceled import."); swal("Canceled import.", {
icon: "warning",
});
} }
} else {
swal("Canceled import.", {
icon: "warning",
});
}
});
}; };
document.getElementById("inputId").onchange = (e) => { document.getElementById("inputId").onchange = (e) => {

View File

@ -26,8 +26,6 @@ document.addEventListener("click", (e) => {
deleteFromStorage(); deleteFromStorage();
else if (e.target.name == "edit") else if (e.target.name == "edit")
editSession(); editSession();
} else {
alertMessage("warning", "Select a session first...");
} }
} }
}); });

View File

@ -1,44 +1,24 @@
const regexp = /^[a-zA-Z0-9-_]+$/; // Alphanumeric, dash, underscore
const storage = browser.storage.local; const storage = browser.storage.local;
const windowSys = browser.windows; const windowSys = browser.windows;
const regexp = /^[a-zA-Z0-9-_]+$/; // Alphanumeric, dash, underscore
const alertMessage = (type, message) => {
let msgTag = document.getElementById("allertMessage");
let text = document.createTextNode(message);
let fontColor = "rgba(255, 255, 255, 1)";
let bgColor = "";
if (type === "success") { const saveSession = (message = "What is this session's name? Allowed: a-z, A-Z, -, _") => {
bgColor = "rgba(72, 125, 25, 1)"; let inputTag = document.createElement("INPUT");
} else if (type === "warning") { inputTag.value = new Date().toLocaleString().split(',')[0].replace(/\//g, '-');
bgColor = "rgba(195, 123, 0, 1)";
} else if (type === "error") {
bgColor = "rgba(125, 45, 25, 1)";
}
msgTag.style.backgroundColor = bgColor;
msgTag.style.color = fontColor;
msgTag.style.display = "block";
msgTag.innerHTML = "";
msgTag.append(text);
setTimeout(function () {
let msgTag = document.getElementById("allertMessage");
msgTag.innerHTML = "";
msgTag.style.display = "none";
}, 3000);
}
const saveSession = () => {
let enteryName = '';
do {
enteryName = prompt("What is this session's name? Allowed: a-z, A-Z, -, _",
new Date().toLocaleString().split(',')[0].replace(/\//g, '-'));
if (enteryName == null) break
} while (enteryName.search(regexp) == -1);
swal(message, {
content: inputTag,
buttons: true,
}).then((value) => {
if (value) {
let enteryName = inputTag.value.replace(/ /g, "_");
if (enteryName) { if (enteryName) {
if (enteryName.search(regexp) == -1) {
saveSession("Please try again...\nAllowed: a-z, A-Z, -, _")
return ;
}
console.log("Saving session..."); console.log("Saving session...");
windowSys.getAll({ populate: true, windowTypes: ["normal"] }).then((windows) => { windowSys.getAll({ populate: true, windowTypes: ["normal"] }).then((windows) => {
let sessionData = {}; let sessionData = {};
@ -61,24 +41,103 @@ const saveSession = () => {
} }
}); });
} else { } else {
alertMessage("warning", "Canceled save..."); swal("Canceled save...", {
icon: "warning",
});
} }
} else {
swal("Canceled save...", {
icon: "warning",
});
}
});
} }
const saveToStorage = (name, data) => { const editSession = (message = "Editing selected session... Allowed: a-z, A-Z, -, _") => {
let id = selectedItem.innerHTML;
let inputTag = document.createElement("INPUT");
inputTag.value = id;
swal(message, {
content: inputTag,
buttons: true,
}).then((value) => {
if (value) {
let newName = inputTag.value.replace(/ /g, "_");
if (newName) {
if (newName.search(regexp) == -1) {
editSession("Please try again...\nAllowed: a-z, A-Z, -, _")
return ;
}
storage.get(id).then((storageResults) => {
storage.remove(id);
json = JSON.parse(storageResults[id]);
saveToStorage(newName, JSON.stringify(json), true);
});
selectedItem.textContent = newName;
} else {
swal("Canceled edit...", {
icon: "warning",
});
}
} else {
swal("Canceled edit...", {
icon: "warning",
});
}
});
}
const saveToStorage = (name, data, fromEdit = false) => {
storage.get(name).then((storageResults) => { storage.get(name).then((storageResults) => {
let json = null; let json = null;
try { try {
json = JSON.parse(storageResults[name]); json = JSON.parse(storageResults[name]);
alertMessage("success", "Overwrote session..."); swal("Overwrote session...", {
icon: "warning",
});
} catch (e) { } catch (e) {
alertMessage("success", "Saved session..."); if (fromEdit) { // minor logic fix
swal("Overwrote session...", {
icon: "warning",
});
} else {
swal("Saved session...", {
icon: "success",
});
}
} finally { } finally {
storage.set({[name]: data}); storage.set({[name]: data});
} }
}); });
} }
const deleteFromStorage = () => {
swal({
title: "Are you sure?",
text: "Do you wish to delete session:\n" + selectedItem.innerHTML + "?",
icon: "warning",
buttons: true,
dangerMode: true,
}).then((willDelete) => {
if (willDelete) {
storage.remove(selectedItem.innerHTML).then(() => {
selectedItem.parentElement.removeChild(selectedItem);
});
swal("Deleted session successfully...", {
icon: "success",
});
} else {
swal("Canceled deletion...", {
icon: "warning",
});
}
});
}
const importSession = () => { const importSession = () => {
browser.tabs.create({ browser.tabs.create({
url: browser.extension.getURL("../pages/import.html"), url: browser.extension.getURL("../pages/import.html"),
@ -90,8 +149,7 @@ const downloadSession = () => {
var dlAnchorElem = document.getElementById('downloadAnchorElem'); var dlAnchorElem = document.getElementById('downloadAnchorElem');
let id = selectedItem.innerHTML; let id = selectedItem.innerHTML;
fileName = "session:" + id + ":" + fileName = "session:" + id + ":" +
new Date().toLocaleString().split(',')[0] new Date().toLocaleString().split(',')[0].replace(/\//g, "-") + ".json";
.replace(/\//g, "-") + ".json";
storage.get(id).then((storageResults) => { storage.get(id).then((storageResults) => {
let json = JSON.parse(storageResults[id]); let json = JSON.parse(storageResults[id]);
@ -103,40 +161,6 @@ const downloadSession = () => {
} }
const deleteFromStorage = () => {
let action = confirm("Do you wish to delete session: " + selectedItem.innerHTML + "?");
if (action) {
storage.remove(selectedItem.innerHTML).then(() => {
selectedItem.parentElement.removeChild(selectedItem);
});
alertMessage("success", "Deleted session successfully...");
} else {
alertMessage("warning", "Canceled deletion...");
}
}
const editSession = () => {
let id = selectedItem.innerHTML;
let newName = '';
do {
newName = prompt("Editing selected session... Allowed: a-z, A-Z, -, _", id);
if (newName == null) break
} while (newName.search(regexp) == -1);
if (newName) {
storage.get(id).then((storageResults) => {
storage.remove(id);
json = JSON.parse(storageResults[id]);
saveToStorage(newName, JSON.stringify(json));
});
selectedItem.textContent = newName;
} else {
alertMessage("warning", "Canceled edit...");
}
}
const loadSession = (id = null) => { const loadSession = (id = null) => {
console.log("Loading session..."); console.log("Loading session...");
try { try {

1
src/scripts/sweetalert.min.js vendored Normal file

File diff suppressed because one or more lines are too long

View File

@ -1,4 +1,9 @@
body { width: 450px; } body {
width: 450px;
height: 520px;
overflow-x: hidden;
}
ul, li { list-style: none; } ul, li { list-style: none; }
li { li {
@ -19,19 +24,10 @@ button {
color: #000000; color: #000000;
} }
#allertMessage {
position: absolute;
top: 5%;
z-index: 999;
width: 50%;
left: 25%;
padding: 0.5em;
text-align: center;
display: none;
}
#savedSessions { #savedSessions {
max-height: 15em; height: 445px;
min-height: 445px;
max-height: 445px;
overflow-x: hidden; overflow-x: hidden;
overflow-y: auto; overflow-y: auto;
} }