Skip to content
This repository has been archived by the owner on Feb 28, 2022. It is now read-only.

Commit

Permalink
Use SimpleNotification instead of VanillaNotify
Browse files Browse the repository at this point in the history
  • Loading branch information
Glagan committed Dec 28, 2018
1 parent 05dfaa6 commit 50b0235
Show file tree
Hide file tree
Showing 15 changed files with 393 additions and 313 deletions.
4 changes: 2 additions & 2 deletions build.js
Expand Up @@ -12,8 +12,8 @@ const [,, ...args] = process.argv;
let files = {
".": ["options.html"],
"third_party": [
"vanilla-notify.css",
"vanilla-notify.min.js"
"simpleNotification.min.css",
"simpleNotification.min.js"
],
"scripts": {
".": ["defaultOptions.js"],
Expand Down
2 changes: 1 addition & 1 deletion manifests/chrome.json
Expand Up @@ -3,7 +3,7 @@

"content_scripts": [{
"js": [
"third_party/vanilla-notify.min.js",
"third_party/simpleNotification.min.js",
"scripts/defaultOptions.js",
"third_party/chrome-extension-async.js",
"scripts/minified/sharedFunctions.js",
Expand Down
2 changes: 1 addition & 1 deletion manifests/firefox.json
Expand Up @@ -16,7 +16,7 @@

"content_scripts": [{
"js": [
"third_party/vanilla-notify.min.js",
"third_party/simpleNotification.min.js",
"scripts/defaultOptions.js",
"scripts/minified/sharedFunctions.js",
"scripts/minified/myMangaDex.js"
Expand Down
2 changes: 1 addition & 1 deletion manifests/manifest.json
Expand Up @@ -36,6 +36,6 @@
"https://mangadex.org/user*",
"https://mangadex.org/list*"
],
"css": ["third_party/vanilla-notify.css", "css/mymangadex.css"]
"css": ["third_party/simpleNotification.min.css", "css/mymangadex.css"]
}]
}
2 changes: 1 addition & 1 deletion scripts/minified/myMangaDex.js

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion scripts/minified/sharedFunctions.js

Large diffs are not rendered by default.

10 changes: 4 additions & 6 deletions scripts/myMangaDex.js
@@ -1,4 +1,4 @@
const NOTIFY = {ERROR: "error", INFO: "info", SUCCESS: "success"};
const NOTIFY = {ERROR: "error", INFO: "info", SUCCESS: "success", WARNING: "warning", MESSAGE: "message"};
class MyMangaDex {
constructor() {
this.pageUrl = window.location.href;
Expand Down Expand Up @@ -152,9 +152,9 @@ class MyMangaDex {
"X-Requested-With": "XMLHttpRequest"
}
});
this.notification(NOTIFY.SUCCESS, "Status on MangaDex updated");
this.notification(NOTIFY.SUCCESS, undefined, "Status on MangaDex updated");
} catch (error) {
this.notification(NOTIFY.ERROR, "Error updating MDList");
this.notification(NOTIFY.ERROR, undefined, "Error updating MDList");
}
}

Expand Down Expand Up @@ -720,12 +720,10 @@ class MyMangaDex {
notification(type, title, text=undefined, image=undefined, sticky=false) {
if (this.options.showNotifications || (type == NOTIFY.ERROR && this.options.showErrors)) {
let data = {
title: title,
text: text,
image: image,
sticky: sticky
};
vNotify[type].call(null, data);
SimpleNotification[type](title, text, data);
}
}

Expand Down
48 changes: 26 additions & 22 deletions scripts/sharedFunctions.js
Expand Up @@ -61,11 +61,13 @@ async function loadOptions() {
let data = await storageGet("options");
// If there is nothing in the storage, default options
if (data === undefined) {
vNotify.info({
title: "First time using MyMangaDex",
text: "It looks like it is your first time using MyMangaDex, for any help go to https://github.com/Glagan/MyMangaDex, and don't forget to look at the settings !",
sticky: true
});
SimpleNotification.info(
"First time using MyMangaDex",
"It looks like it is your first time using MyMangaDex, for any help go to https://github.com/Glagan/MyMangaDex, and don't forget to look at the settings !",
{
sticky: true
}
);

await storageSet("options", defaultOptions);
return JSON.parse(JSON.stringify(defaultOptions));
Expand Down Expand Up @@ -99,10 +101,10 @@ async function loadOptions() {
data.showErrors = defaultOptions.showErrors;
data.version = 1.9;

vNotify.info({
title: "MyMangaDex as been updated to 1.9",
text: "You can see the changelog on https://github.com/Glagan/MyMangaDex, new options have been added, you should check them out !"
});
SimpleNotificatin.info(
"MyMangaDex as been updated to 1.9",
"You can see the changelog on https://github.com/Glagan/MyMangaDex, new options have been added, you should check them out !"
);
}

if (data.version < 2.0) {
Expand All @@ -114,10 +116,10 @@ async function loadOptions() {
data.token = defaultOptions.token;
data.version = 2.0;

vNotify.info({
title: "MyMangaDex as been updated to 2.0",
text: "Online Save as been added, if you wish to use it you need to manually enable it. You can see the changelog on https://github.com/Glagan/MyMangaDex."
});
SimpleNotificatin.info(
"MyMangaDex as been updated to 2.0",
"Online Save as been added, if you wish to use it you need to manually enable it. You can see the changelog on https://github.com/Glagan/MyMangaDex."
);
}

await storageSet("options", data);
Expand Down Expand Up @@ -146,11 +148,13 @@ async function updateLocalStorage(manga, options) {
});
// Show a notification for updated last opened if there is no MyAnimeList id
if (options.showNotifications && manga.myAnimeListId == 0 && manga.currentChapter.chapter > manga.lastMangaDexChapter) {
vNotify.success({
title: "Manga updated",
text: manga.name + " last open Chapter as been updated to " + manga.lastMangaDexChapter,
image: "https://mangadex.org/images/manga/" + manga.mangaDexId + ".thumb.jpg"
});
SimpleNotificatin.success(
"Manga updated",
manga.name + " last open Chapter as been updated to " + manga.lastMangaDexChapter,
{
image: "https://mangadex.org/images/manga/" + manga.mangaDexId + ".thumb.jpg"
}
);
}
// Update online
if (options.onlineSave && options.isLoggedIn) {
Expand Down Expand Up @@ -186,10 +190,10 @@ async function updateLocalStorage(manga, options) {

if (options.isLoggedIn == false) {
if (options.showErrors) {
vNotify.error({
title: "Couldn't save Online",
text: "The Online Service might have a problem, or your credentials has been changed. Go to the options to update it."
});
SimpleNotification.error(
"Couldn't save Online",
"The Online Service might have a problem, or your credentials has been changed. Go to the options to update it."
);
}
await storageSet("options", options);
}
Expand Down
151 changes: 151 additions & 0 deletions third_party/simpleNotification.css
@@ -0,0 +1,151 @@
@keyframes fadeout {
from {
opacity: 1;
}
to {
opacity: 0;
}
}

@keyframes shorten {
from {
width: 100%;
}
to {
width: 0;
}
}

.gn-wrapper {
position: fixed;
overflow: hidden;
pointer-events: none;
display: flex;
flex-direction: column;
flex-wrap: wrap;
z-index: 1080;
}

.gn-top-right,
.gn-bottom-right {
align-items: flex-end;
}
.gn-top-left,
.gn-bottom-left {
align-items: flex-start;
}

.gn-top-right {
top: 0;
right: 0;
}

.gn-top-left {
top: 0;
left: 0;
}

.gn-bottom-right {
bottom: 0;
right: 0;
}

.gn-bottom-left {
bottom: 0;
left: 0;
}

.gn-notification {
/*border: 1px solid black;*/
box-shadow: 1px 1px 3px black;
border-radius: 3px;
overflow: hidden;
margin: 1rem;
cursor: pointer;
animation-duration: 1000ms;
animation-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
animation-fill-mode: forwards;
pointer-events: all;
min-width: 20rem;
max-width: 30rem;
}

.gn-notification h1 {
background-color: rgba(0, 0, 0, 0.2);
border-bottom: 1px solid rgba(0, 0, 0, 0.4);
}

.gn-fadeout {
animation-name: fadeout;
animation-timing-function: linear;
animation-fill-mode: forwards;
}

.gn-content {
display: flex;
flex: 1;
align-content: space-between;
align-items: center;
}

.gn-content img {
max-width: 40%;
max-height: 20rem;
flex-shrink: 0;
}

.gn-content p {
max-width: 100%;
white-space: pre-line;
}

.gn-content img:only-child,
.gn-content p:only-child {
max-width: 100%;
}

.gn-notification h1,
.gn-content p {
padding: 0.5rem;
margin: 0;
}

.gn-lifespan {
display: block;
height: 3px;
width: 100%;
background-color: #4dd0e1;
transition-property: width;
transition-timing-function: linear;
}

.gn-extinguish {
animation-name: shorten;
animation-timing-function: linear;
animation-fill-mode: forwards;
}

.gn-success {
background-color: #689f38;
color: white;
}

.gn-info {
background-color: #0288d1;
color: white;
}

.gn-error {
background-color: #e53935;
color: white;
}

.gn-warning {
background-color: #ff8f00;
color: white;
}

.gn-message {
background-color: #333333;
color: white;
}

0 comments on commit 50b0235

Please sign in to comment.