diff options
Diffstat (limited to 'assets/js/main.js')
| -rw-r--r-- | assets/js/main.js | 174 |
1 files changed, 39 insertions, 135 deletions
diff --git a/assets/js/main.js b/assets/js/main.js index f0910eb..bcd6af6 100644 --- a/assets/js/main.js +++ b/assets/js/main.js @@ -1,145 +1,49 @@ -const main = { - body: document.getElementById('main'), - url: window.location.href -} -const test = () => { - const links = document.getElementsByClassName('footer-links') - - for (let i = 0; i < links.length; i++) { - links[i].addEventListener('click', () => { - copy(links[i].textContent) - }) - } -} -const copy = (x) => { - navigator.clipboard.writeText(x).then(() => { - console.log('copied') - }).catch((err) => { - console.error(err) - }) -} +class Main { + constructor() {} -const getPage = async () => { - const object = { - session: document.cookie, - url: window.location.href + async Init() { + await this.Get() } - await fetch('/', { - method: 'post', - body: JSON.stringify(object), - headers: new Headers({ - 'Content-Type': 'application/json' - }) - }) - .then(response => response.text()) - .then(text => { - main.body.innerHTML = DOMPurify.sanitize(text) - test() - }) -} - -// ! Loading screen -const loading = () => {} -// ! Add event listener and loading screen -const init = () => { - loading() - getPage().then(output => { - eventListener() - }) -} -init() + #Loading() {} + async Get(x) { + this.object = { + session: document.cookie, + url: window.location.href + } + this.fetch = '/' + if (x) this.fetch = x -// ! Menu -const openMenu = (menuList, menuIcon, closeButton, list) => { - menuIcon.style.opacity = 0 - setTimeout(() => { - menuList.style.display = 'flex' - menuList.style.zindex = 999 - setTimeout(() => { - menuList.style.opacity = 0.9 - }, '250') - }, '250') -} -const closeMenu = (menuList, menuIcon, closeButton, list) => { - //closeButton.style.fontSize = '15rem' - menuList.style.opacity = 0 - setTimeout(() => { - menuList.style.display = 'none' - menuList.style.zIndex = -9999 - setTimeout(() => { - menuIcon.style.opacity = 1 - }, '250') - }, '500') -} + await fetch(this.fetch, { + method: 'post', + body: JSON.stringify(this.object), + headers: new Headers({ + 'Content-Type': 'application/json' + }) + }) + .then(res => res.json()) + .then(output => { + const head = document.getElementsByTagName('head')[0] + const body = document.getElementsByTagName('body')[0] + const section = document.getElementById('main') -// Blog -const blogButtonList = document.getElementsByClassName('bloglistbutton') + for (let i = 0; i < output.css.length; i++) { + const link = document.createElement('link') + link.rel = 'stylesheet' + link.type = 'text/css' + link.href = `${window.location.origin}/css/${output.css[i]}` + head.appendChild(link) + } + for (let i = 0; i < output.js.length; i++) { + const script = document.createElement('script') + script.src = `${window.location.origin}/js/${output.js[i]}` + body.appendChild(script) + } -const getUrl = () => { - if (window.location.href.endsWith('/')) { - return `${window.location.href}item` - } else { - return `${window.location.href}/item` + section.innerHTML = DOMPurify.sanitize(output.html) + }) } } -const getBlog = async (x) => { - const object = { - session: document.cookie, - url: getUrl(), - value: x - } - await fetch('/blog/item', { - method: 'post', - body: JSON.stringify(object), - headers: new Headers({ - 'Content-Type': 'application/json' - }) - }) - .then(response => response.text()) - .then(text => { - const prism = new Promise((res, rej) => { - const script = document.createElement('script') - script.src = `${window.location.origin}/js/prism.js` - document.head.appendChild(script) - res('success') - }) - prism.then(output => { - const script = document.createElement('script') - main.body.innerHTML = DOMPurify.sanitize(text, { ADD_TAGS: ["iframe"], ADD_ATTR: ['allow', 'allowfullscreen', 'frameborder', 'scrolling'] }) - script.src = `${window.location.origin}/js/blogitem.js` - document.head.appendChild(script) - eventListener() - window.scrollTo(0, 0) - }) - }) -} - -// Event listeners -const eventListener = () => { - const menuList = document.getElementById('menu-list') - const menuIcon = document.getElementById('menu-icon') - const closeButton = document.getElementsByClassName('close') - const list = document.getElementsByClassName('list') - const readblogs = document.getElementsByClassName('index-readblogs') - const about = document.getElementById('index-about') - const websites = { - helpinghands: document.getElementById('helpinghands'), - goodhandhauling: document.getElementById('goodhandhauling') - } - console.log(readblogs) - - menuIcon.addEventListener('click', () => openMenu(menuList, menuIcon, closeButton, list)) - closeButton[0].addEventListener('click', () => closeMenu(menuList, menuIcon, closeButton, list)) - try{ - for (let i = 0; i < readblogs.length; i++) readblogs[i].addEventListener('click', () => window.location.href = '/blog') - about.addEventListener('click', () => window.location.href = '/about') - websites.helpinghands.addEventListener('click', () => window.location.href = 'https://helpinghandsadultcare.org/') - websites.goodhandhauling.addEventListener('click', () => window.location.href = 'https://goodhandhauling.com/') - - } catch (err) {} - for (let i = 0; i < list.length; i++) list[i].addEventListener('click', () => closeMenu(menuList, menuIcon, closeButton, list)) - for (let i = 0; i < blogButtonList.length; i++) blogButtonList[i].addEventListener('click', () => getBlog(blogButtonList[i].value)) -} +new Main().Init() |