Update file structure

src/Milieu.astro

@@ -1,84 +0,0 @@
-<canvas id="ambient-canvas-1"/>
-<canvas id="ambient-canvas-2"/>
-
-<script is:inline>
-/**
- * @licstart  The following is the entire license notice for the 
- *  JavaScript code in this page.
- *
- * Copyright (C) 2024 SudoVanilla
- *
- *
- * The JavaScript code in this page is free software: you can
- * redistribute it and/or modify it under the terms of the GNU
- * General Public License (GNU GPL) as published by the Free Software
- * Foundation, either version 3 of the License, or (at your option)
- * any later version.  The code is distributed WITHOUT ANY WARRANTY;
- * without even the implied warranty of MERCHANTABILITY or FITNESS
- * FOR A PARTICULAR PURPOSE.  See the GNU GPL for more details.
- *
- * As additional permission under GNU GPL version 3 section 7, you
- * may distribute non-source (e.g., minimized or compacted) forms of
- * that code without the copy of the GNU GPL normally required by
- * section 4, provided you include this license notice and a URL
- * through which recipients can access the Corresponding Source.
- *
- * @licend  The above is the entire license notice
- * for the JavaScript code in this page.
- *
- */
-const AMvideo = document.querySelector("video")
-const oddCanvas = document.getElementById("ambient-canvas-1")
-const evenCanvas = document.getElementById("ambient-canvas-2")
-const oddCtx = oddCanvas.getContext("2d")
-const evenCtx = evenCanvas.getContext("2d")
-
-const frameIntervalMs = 2000
-const canvasOpacity = "0.4"
-
-let intervalId
-let oddFrame = true
-const drawFrame = () => {
-    if (oddFrame) {
-    oddCtx.drawImage(AMvideo, 0, 0, oddCanvas.width, oddCanvas.height)
-    transitionToOddCanvas()
-    } else {
-    evenCtx.drawImage(AMvideo, 0, 0, evenCanvas.width, evenCanvas.height)
-    transitionToEvenCanvas()
-    }
-    oddFrame = !oddFrame
-}
-
-const transitionToOddCanvas = () => {
-    oddCanvas.style.opacity = canvasOpacity
-    evenCanvas.style.opacity = "0"
-}
-
-const transitionToEvenCanvas = () => {
-    evenCanvas.style.opacity = canvasOpacity
-    oddCanvas.style.opacity = "0"
-}
-
-const drawStart = () => {intervalId = window.setInterval(drawFrame, frameIntervalMs)}
-
-const drawPause = () => {if (intervalId) window.clearInterval(intervalId)}
-
-const init = () => {    
-    AMvideo.pause()
-    AMvideo.play()
-    AMvideo.addEventListener("play", drawStart, false)
-    AMvideo.addEventListener("pause", drawPause, false)
-    AMvideo.addEventListener("ended", drawPause, false)
-    oddCanvas.style.transition = evenCanvas.style.transition = `opacity ${frameIntervalMs}ms`
-}
-
-const cleanup = () => {
-    AMvideo.removeEventListener("play", drawStart)
-    AMvideo.removeEventListener("pause", drawPause)
-    AMvideo.removeEventListener("ended", drawPause)
-    drawPause()
-}
-
-window.addEventListener("load", init)
-window.addEventListener("unload", cleanup)
-</script>

src/Player.astro

@@ -14,21 +14,21 @@ const {
 
 // Components
 import Controls from './Controls.astro'
-import MilieuEffect from './Milieu.astro'
+import MilieuEffect from './Features/Milieu.astro'
 import Controller from './Controls/Controller.astro'
 import Seek from './Controls/Seek.astro'
 import Sync from './Controls/Sync.astro'
 
 // Icons and Styles
-import './Index.scss'
+import './Styles/Index.scss'
-import './Iconoir.css'
+import './Styles/Iconoir.css'
 ---
 
 <div class="video-container" id={"zorn-player-" + PlayerName}>
     <video class="main-video" {VideoAttributes} disableremoteplayback src={Video} poster={Poster} preload="auto"></video>
     {Audio ? <audio class="main-audio"><source {AudioAttributes} src={Audio} type="audio/mp3"/></audio> : null }
     {Audio ? <Sync PlayerName={PlayerName}/> : null }
-    {Milieu ? <MilieuEffect/> : null }
+    {Milieu ? <MilieuEffect PlayerName={PlayerName}/> : null }
     {SettingsMenu ?
         <Controls PlayerName={PlayerName} Live={Live}>
             <button id="open-zorn-settings-button" onclick="OpenZornMenu()"><i class="iconoir-settings"></i></button>