web/notify.moe
Code Issues Pull Requests Activity

Refactor

Browse Source
This commit is contained in:
Eduard Urbach 2017-10-14 12:45:22 +02:00
parent db15a0eb72
commit 1126e6ae6b
6 changed files with 46 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
pages/anime/anime.pixy
View File

@ -31,7 +31,7 @@ component Anime(anime *arn.Anime, friends []*arn.User, listItems map[*arn.User]*
Icon("pencil")
span Edit in collection
else
button.action(data-api="/api/animelist/" + user.ID, data-action="arrayAppend", data-trigger="click", data-field="Items", data-object="{\"AnimeID\": \"" + anime.ID + "\"}")
button.action(data-api="/api/animelist/" + user.ID, data-action="addAnimeToCollection", data-trigger="click", data-anime-id=anime.ID)
Icon("plus")
span Add to collection

2
pages/animelist/animelist.scarlet
View File

@ -38,6 +38,7 @@
:hover
.plus-episode
opacity 1
pointer-events all
.anime-list-item-episodes-watched
flex 0.4
@ -48,6 +49,7 @@
display inline-block
cursor pointer
opacity 0
pointer-events none
margin-left 1px
transition opacity transition-speed ease

2
pages/animelistitem/animelistitem.pixy
View File

@ -33,6 +33,6 @@ component AnimeListItem(viewUser *arn.User, item *arn.AnimeListItem, anime *arn.
a.ajax.button(href=anime.Link())
Icon("search-plus")
span View anime
button.action(data-action="removeAnimeFromCollection", data-trigger="click", data-api="/api/animelist/" + viewUser.ID, data-field="Items", data-index="AnimeID=\"" + anime.ID + "\"", data-nick=viewUser.Nick)
button.action(data-action="removeAnimeFromCollection", data-trigger="click", data-api="/api/animelist/" + viewUser.ID, data-anime-id=anime.ID, data-nick=viewUser.Nick)
Icon("trash")
span Remove from collection

50
scripts/Actions.ts
View File

@ -26,12 +26,14 @@ export function toggleSidebar(arn: AnimeNotifier) {
// Save new data from an input field
export function save(arn: AnimeNotifier, input: HTMLElement) {
arn.loading(true)
let isContentEditable = input.isContentEditable
let obj = {}
let isContentEditable = input.isContentEditable
let value = isContentEditable ? input.innerText : (input as HTMLInputElement).value
if(value === undefined) {
return
}
if((input as HTMLInputElement).type === "number" || input.dataset.type === "number") {
if(input.getAttribute("step") === "1" || input.dataset.step === "1") {
obj[input.dataset.field] = parseInt(value)
@ -50,21 +52,9 @@ export function save(arn: AnimeNotifier, input: HTMLElement) {
let apiEndpoint = arn.findAPIEndpoint(input)
fetch(apiEndpoint, {
method: "POST",
body: JSON.stringify(obj),
credentials: "same-origin"
})
.then(response => response.text())
.then(body => {
if(body !== "ok") {
throw body
}
})
arn.post(apiEndpoint, obj)
.catch(err => arn.statusMessage.showError(err))
.then(() => {
arn.loading(false)
if(isContentEditable) {
input.contentEditable = "true"
} else {
@ -82,6 +72,10 @@ export function closeStatusMessage(arn: AnimeNotifier) {
// Increase episode
export function increaseEpisode(arn: AnimeNotifier, element: HTMLElement) {
if(arn.isLoading) {
return
}
let prev = element.previousSibling as HTMLElement
let episodes = parseInt(prev.innerText)
prev.innerText = String(episodes + 1)
@ -254,12 +248,26 @@ export function testNotification(arn: AnimeNotifier) {
})
}
// Remove anime from collection
export function removeAnimeFromCollection(arn: AnimeNotifier, element: HTMLElement) {
let {field, index, nick} = element.dataset
let apiEndpoint = arn.findAPIEndpoint(element)
// Add anime to collection
export function addAnimeToCollection(arn: AnimeNotifier, button: HTMLElement) {
button.innerText = "Adding..."
let {animeId} = button.dataset
let apiEndpoint = arn.findAPIEndpoint(button)
arn.post(apiEndpoint + "/field/" + field + "/remove/" + index, "")
arn.post(apiEndpoint + "/add/" + animeId, "")
.then(() => arn.reloadContent())
.catch(err => arn.statusMessage.showError(err))
}
// Remove anime from collection
export function removeAnimeFromCollection(arn: AnimeNotifier, button: HTMLElement) {
button.innerText = "Removing..."
let {animeId, nick} = button.dataset
let apiEndpoint = arn.findAPIEndpoint(button)
arn.post(apiEndpoint + "/remove/" + animeId, "")
.then(() => arn.app.load("/animelist/" + (arn.app.find("Status") as HTMLSelectElement).value))
.catch(err => arn.statusMessage.showError(err))
}

18
scripts/AnimeNotifier.ts
View File

@ -23,6 +23,7 @@ export class AnimeNotifier {
touchController: TouchController
sideBar: SideBar
mainPageLoaded: boolean
isLoading: boolean
lastReloadContentPath: string
elementFound: MutationQueue
@ -33,6 +34,7 @@ export class AnimeNotifier {
this.app = app
this.user = null
this.title = "Anime Notifier"
this.isLoading = true
this.elementFound = new MutationQueue(elem => elem.classList.add("element-found"))
this.elementNotFound = new MutationQueue(elem => elem.classList.add("element-not-found"))
@ -123,9 +125,9 @@ export class AnimeNotifier {
// Sidebar control
this.sideBar = new SideBar(this.app.find("sidebar"))
// Let"s start
this.app.run()
// Loading
this.loading(false)
}
onContentLoaded() {
@ -446,8 +448,10 @@ export class AnimeNotifier {
.then(() => this.loading(false)) // Because our loading element gets reset due to full page diff
}
loading(isLoading: boolean) {
if(isLoading) {
loading(newState: boolean) {
this.isLoading = newState
if(this.isLoading) {
document.documentElement.style.cursor = "progress"
this.app.loading.classList.remove(this.app.fadeOutClass)
} else {
@ -666,6 +670,10 @@ export class AnimeNotifier {
}
post(url: string, body: any) {
if(this.isLoading) {
return Promise.resolve()
}
if(typeof body !== "string") {
body = JSON.stringify(body)
}

4
scripts/Application.ts
View File

@ -30,10 +30,6 @@ export class Application {
})
}
run() {
this.loading.classList.add(this.fadeOutClass)
}
find(id: string): HTMLElement {
return document.getElementById(id)
}