100 lines
2.4 KiB
TypeScript
Raw Normal View History

2018-04-02 05:34:16 +00:00
import AnimeNotifier from "../AnimeNotifier"
import StatusMessage from "../StatusMessage"
2018-03-02 16:18:29 +00:00
// Select file
export function selectFile(arn: AnimeNotifier, button: HTMLButtonElement) {
2018-03-16 21:40:38 +00:00
if(button.dataset.endpoint === "/api/upload/cover" && arn.user.dataset.pro !== "true") {
alert("Please buy a PRO account to use this feature.")
return
}
2018-03-02 16:18:29 +00:00
let preview = document.getElementById(button.dataset.previewImageId) as HTMLImageElement
2018-03-07 13:00:14 +00:00
let endpoint = button.dataset.endpoint
// Click on virtual file input element
let input = document.createElement("input")
2018-03-02 16:18:29 +00:00
input.setAttribute("type", "file")
input.onchange = () => {
2018-03-02 20:42:34 +00:00
let file = input.files[0]
2018-03-03 17:38:21 +00:00
if(!file) {
return
}
2018-03-03 18:58:18 +00:00
if(!file.type.startsWith("image/")) {
arn.statusMessage.showError(file.name + " is not an image file!")
return
}
2018-03-07 13:00:14 +00:00
previewImage(file, endpoint, preview)
uploadFile(file, endpoint, arn)
2018-03-02 16:18:29 +00:00
}
input.click()
}
// Preview image
2018-03-07 13:00:14 +00:00
function previewImage(file: File, endpoint: string, preview: HTMLImageElement) {
2018-03-02 16:18:29 +00:00
let reader = new FileReader()
reader.onloadend = () => {
2018-03-07 13:00:14 +00:00
if(endpoint === "/api/upload/avatar") {
let svgPreview = document.getElementById("avatar-input-preview-svg") as HTMLImageElement
2018-03-03 17:29:39 +00:00
2018-03-07 13:00:14 +00:00
if(svgPreview) {
svgPreview.classList.add("hidden")
}
2018-03-03 17:29:39 +00:00
}
2018-03-02 16:18:29 +00:00
preview.classList.remove("hidden")
preview.src = reader.result
}
2018-03-03 17:38:21 +00:00
reader.readAsDataURL(file)
2018-03-02 16:18:29 +00:00
}
2018-03-02 23:20:10 +00:00
// Upload file
2018-03-03 15:03:18 +00:00
function uploadFile(file: File, endpoint: string, arn: AnimeNotifier) {
2018-03-02 20:42:34 +00:00
let reader = new FileReader()
reader.onloadend = async () => {
2018-03-07 13:00:14 +00:00
arn.statusMessage.showInfo("Uploading image...", 60000)
2018-03-03 15:03:18 +00:00
let response = await fetch(endpoint, {
2018-03-02 20:42:34 +00:00
method: "POST",
credentials: "include",
headers: {
"Content-Type": "application/octet-stream"
},
body: reader.result
})
2018-03-03 15:03:18 +00:00
2018-03-07 13:00:14 +00:00
if(endpoint === "/api/upload/avatar") {
let newURL = await response.text()
updateSideBarAvatar(newURL)
}
2018-03-03 15:03:18 +00:00
if(response.ok) {
2018-03-07 13:00:14 +00:00
arn.statusMessage.showInfo("Successfully uploaded your new image.")
2018-03-03 15:03:18 +00:00
} else {
2018-03-07 13:00:14 +00:00
arn.statusMessage.showError("Failed uploading your new image.")
2018-03-03 15:03:18 +00:00
}
2018-03-02 20:42:34 +00:00
}
2018-03-02 16:18:29 +00:00
2018-03-02 23:04:54 +00:00
reader.readAsArrayBuffer(file)
2018-03-03 17:29:39 +00:00
}
// Update sidebar avatar
function updateSideBarAvatar(url: string) {
let sidebar = document.getElementById("sidebar")
let userImage = sidebar.getElementsByClassName("user-image")[0] as HTMLImageElement
let lazyLoad = userImage["became visible"]
if(lazyLoad) {
userImage.dataset.src = url
lazyLoad()
} else {
location.reload()
}
2018-03-02 16:18:29 +00:00
}