From 7632caf19428d394b308fe53c6b208ce790edd5c Mon Sep 17 00:00:00 2001 From: Mhykol Date: Mon, 27 May 2024 10:16:57 -0400 Subject: Added blogitem.js --- assets/js/blogitem.js | 58 +++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 58 insertions(+) create mode 100644 assets/js/blogitem.js diff --git a/assets/js/blogitem.js b/assets/js/blogitem.js new file mode 100644 index 0000000..a827970 --- /dev/null +++ b/assets/js/blogitem.js @@ -0,0 +1,58 @@ +const body = { + content: document.getElementsByClassName('fullscreenImg')[0], + images: document.querySelectorAll('img:not([class])'), + buttons: `
` +} + +const blogImage = () => { + body.content.style.opacity = 0 + body.images.forEach((img, index) => { + img.addEventListener('click', () => { + body.content.innerHTML = `${body.buttons}` + body.content.style.opacity = 1 + listener(index) + }) + }) +} + +const drawImage = (src) => { + try { + body.content.innerHTML = `${body.buttons}` + } catch (err) { + //console.log(src) + } +} + +const listener = (index) => { + const buttons = { + close: document.getElementsByClassName('closeFullscreenImage')[0], + left: document.getElementsByClassName('navleft')[0], + right: document.getElementsByClassName('navright')[0] + } + buttons.close.addEventListener('click', () => { + body.content.style.opacity = 0 + setTimeout(() => { + body.content.innerHTML = '' + }, '1000') + }) + buttons.left.addEventListener('click', () => { + if (index > 0) { + console.log(index) + drawImage(body.images[index - 1].src) + listener(index - 1) + } else { + drawImage(body.images[body.images.length - 1].src) + listener(body.images.length) + } + }) + buttons.right.addEventListener('click', () => { + if (index < body.images.length - 1) { + drawImage(body.images[index + 1].src) + listener(index + 1) + } else { + drawImage(body.images[0].src) + listener(0) + } + }) +} +blogImage() -- cgit v1.2.3-70-g09d2