Less jank and now also using a more flexbile backend for fetching json data !!! Error handling required as there is barely any safety atm
104 lines
3.3 KiB
TypeScript
104 lines
3.3 KiB
TypeScript
// This module serves as convenience for admin users to upload/remove videos
|
|
// from their clippable instance. There are no fancy tricks as this is meant
|
|
// purely to be a UX thing.
|
|
//import { fetch_category_videos } from './category'
|
|
//import { fetch_categories } from './index'
|
|
|
|
|
|
let UID: null|string = null
|
|
let KEY: null|string = null
|
|
|
|
/*
|
|
* Requests to admin endpoints require the uid and api key be in the headers
|
|
* rather than the query string
|
|
*/
|
|
function setHeaders(uid?: string, key?: string) : Headers {
|
|
UID = (uid) ? uid : UID
|
|
KEY = (key) ? key : KEY
|
|
|
|
return new Headers({
|
|
'ADMIN-API-UID': UID,
|
|
'ADMIN-API-KEY': KEY
|
|
})
|
|
}
|
|
|
|
function ok(resp: Response) {
|
|
return resp.headers.get('Content-Type') == 'application/json' && resp.status == 200
|
|
}
|
|
|
|
function fetch_creds() :[string, string] {
|
|
let uid = (document.getElementById('uid') as HTMLTextAreaElement).value
|
|
let key = (document.getElementById('apikey') as HTMLTextAreaElement).value
|
|
return [uid, key]
|
|
|
|
}
|
|
async function confirm_auth() {
|
|
const [uid, key] = fetch_creds()
|
|
|
|
const url = window.location.origin + '/admin/dashboard'
|
|
const response = await fetch(url, {
|
|
method: 'POST',
|
|
headers: setHeaders(uid, key)
|
|
})
|
|
|
|
if(ok(response)) {
|
|
document.getElementById('login-display').hidden = true
|
|
document.getElementById('dashboard').hidden = false
|
|
document.getElementById('error').hidden = true
|
|
} else if(response.status == 403) {
|
|
document.getElementById('error').hidden = false
|
|
document.getElementById('error').textContent = 'Invalid credenentials'
|
|
} else {
|
|
document.getElementById('error').hidden = false
|
|
document.getElementById('error').textContent = `${response.statusText}`
|
|
}
|
|
}
|
|
|
|
async function upload_video() {
|
|
const video_file = document.getElementById('video-file') as HTMLInputElement
|
|
const filename = video_file.files[0].name
|
|
const category_el = document.getElementById('category') as HTMLInputElement
|
|
const cat = category_el.value
|
|
|
|
const url = window.location.origin + `/admin/upload-video/${cat}/${filename}`
|
|
const [uid, key] = fetch_creds()
|
|
const response = await fetch(url , {
|
|
method: 'POST',
|
|
headers: setHeaders(uid, key),
|
|
body: video_file.files[0]
|
|
})
|
|
|
|
if(ok(response)) {
|
|
video_file.value = ''
|
|
document.getElementById('video-meta').hidden = true
|
|
document.getElementById('upload-response').textContent = `${filename} uploaded`
|
|
}
|
|
}
|
|
|
|
export function populate_meta_form() {
|
|
let file = document.getElementById('video-file') as HTMLInputElement
|
|
|
|
// When we remove the file this array becomes 0 so the check is required
|
|
console.log('files found', file.files.length)
|
|
if(file.files.length == 0) {
|
|
document.getElementById('video-meta').hidden = true
|
|
} else {
|
|
// Size in MB
|
|
let size = file.files[0].size / 1024 / 1000
|
|
document.getElementById('vmn').textContent = `${file.files[0].name}`
|
|
document.getElementById('vms').textContent = `${size} MB`
|
|
document.getElementById('vmt').textContent = `${file.files[0].type}`
|
|
|
|
document.getElementById('video-meta').hidden = false
|
|
}
|
|
}
|
|
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
/*
|
|
* Setting up hooks required for functionality
|
|
*/
|
|
document.getElementById('video-file').onchange = populate_meta_form
|
|
document.getElementById('verify-login-btn').onclick = confirm_auth
|
|
document.getElementById('confirm-upload-btn').onclick = upload_video
|
|
})
|