diff --git a/assets/js/index.js b/assets/js/index.js index 53917e6..e08d6ec 100644 --- a/assets/js/index.js +++ b/assets/js/index.js @@ -1,13 +1,18 @@ +//Carousel let next = document.querySelector(".next"); let prev = document.querySelector(".prev"); let pages = document.getElementById("pages"); -let pgctrl = [document.querySelector(".pgctrl")]; +let pgctrl = document.querySelector(".pgctrl"); let slider = document.querySelector(".slider"); let carousel = document.querySelector(".carousel"); let bg = document.querySelector(".slider-bg"); +//Album-cards +let album_cards = document.querySelector(".album-cards"); + +//The Database call. import { createClient } from "https://cdn.jsdelivr.net/npm/@supabase/supabase-js/+esm"; const supabaseUrl = "https://owbamcqdmqetrgcznxva.supabase.co"; @@ -18,6 +23,7 @@ const supabaseKey = //the moment you notice you need an API endpoint. const supabase = createClient(supabaseUrl, supabaseKey); +//the elements for the carousel if (!document) console.log("press f"); if (!next) console.log("Class next missing."); if (!prev) console.log("Class prev missing."); @@ -36,79 +42,40 @@ let highlights = [], "https://cdn.glitch.com/f6cb427c-2cdb-4693-bc00-9d3e2991008c%2FScreenshot%20(36).png?v=1633031087464", url: "/", title: "This page is still under construction.", - context: + preview: "The page is still under development. In cases, this page will change after reload or after a few days and a reload.", }, - { - img_url: - "https://cdn.glitch.global/f594d6b7-e72e-477c-b5cb-d71abbd39f44/oblitus-requiem.png?v=1717353087051", - url: "release/Oblitus_Requiem", - title: "Oblitus Requiem \\\\Against the Forsaken Legacy//", - context: - '"Even if you don\'t remember me now, I will bring the you I once knew back from them."', - }, - { - img_url: - "https://cdn.glitch.global/2d9e31c1-a947-46cd-9fd2-8c92be70abe2/A_Lake_With_Endless_Stars.png", - url: "release/A_Lake_With_Endless_Stars", - title: "A Lake With Endless Stars", - context: - '"Under the coruscating night sky, gaze into the kaleidoscopic waters..."', - }, ]; -//create pages and add buttons -start_page(); +let path_name = window.location.pathname; +//Start building the page by calling data +if (path_name === "/") build_event(0); +if (path_name === "/" || path_name === "/release") build_event(1); +if (path_name === "/" || path_name === "/activity") build_event(2); -pgctrl.push(document.querySelectorAll(".pgctrl li")); -if (pgctrl[1]) - pgctrl[1].forEach((m, n) => - m.addEventListener("click", function () { - reset(); - slider_index = n; - set(); - }) - ); +// #region Slider section -async function fetch_releases() { - let { data, error } = await supabase - .from("events") - .select("url, title, subtitle, context, img_src") - .eq("event_type", "release"); //note it only shows u public stuffs - if (error) { - console.error("Error fetching data:", error); - } else { - return (releases = data); - } -} -async function fetch_activities() { - let { data, error } = await supabase - .from("events") - .select("url, title, subtitle, context, img_src") - .eq("event_type", "activity"); //note it only shows u public stuffs - if (error) { - console.error("Error fetching data:", error); - } else { - return (activities = data); - } -} - -function start_page() { - fetch_releases(); - fetch_activities(); +function build_event(i) { + let conditions = [ + "event_type.eq.highlight,event_type.eq.highlight_activity,event_type.eq.highlight_release", + "event_type.eq.release,event_type.eq.highlight_release", + "event_type.eq.activity,event_type.eq.highlight_activity", + ], + inits = [init_highlights, init_releases, init_activities]; supabase .from("events") - .select("url, title, subtitle, context, img_src") - .eq("event_type", "highlight") - .then(init_page); + .select("url, title, subtitle, preview, img_src") + .order("id", i < 1 ? { ascending: true } : { descending: true }) + .limit(10) + .or(conditions[i]) + .then(inits[i]); } -function init_page(d) { +function init_highlights(d) { if (d.error) { console.error("Error fetching data:", d.error); } else { highlights = d.data; - if (d.data.length === 0) highlights = default_highlights; highlights.forEach((a) => { @@ -121,7 +88,7 @@ function init_page(d) { _h1.textContent = a.title; _p.classList.add("desc"); - _p.textContent = a.context; + _p.textContent = a.preview; _div.appendChild(_h1); _div.appendChild(_p); @@ -162,23 +129,30 @@ function pg_ctrl() { let button = document.createElement("li"); let n = i; button.textContent = "•"; //• not · - pgctrl[0].append(button); + pgctrl.appendChild(button); } + if (pgctrl) + [].slice.call(pgctrl.children).forEach((m, n) => + m.addEventListener("click", function () { + reset(); + slider_index = n; + set(); + }) + ); } function set() { slider.children[slider_index].style.opacity = 1; slider.children[slider_index].style.zIndex = 1; - pgctrl[0].children[slider_index].style.opacity = 1; + [].slice.call(pgctrl.children)[slider_index].style.opacity = 1; if (bg) bg.style.backgroundImage = `url('${highlights[slider_index].img_src}')`; } - function reset() { for (var i = 0; i < slider.children.length; i++) { slider.children[i].style.opacity = 0; slider.children[i].style.zIndex = 0; - pgctrl[0].children[i].style.opacity = 0.4; + [].slice.call(pgctrl.children)[i].style.opacity = 0.4; if (bg) bg.style.backgroundImage = null; } } @@ -210,3 +184,147 @@ function checkX() { if (touchendX < touchstartX && touchstartX - touchendX > 60) nxt(); if (touchendX > touchstartX && touchendX - touchstartX > 60) prv(); } + +// #endregion + +async function init_releases(d) { + if (d.error) { + console.error("Error fetching data:", d.error); + } else { + releases = d.data; + /* + +
+

PoΣΣεssion (Possession)

+

Formerly "Mayonaka Dancehall!!!" (:DACHiTRAX) Release.

+

Ghost and monsters are gathering you...

+ + +
+

Hyper Liminality

+

t404:null & trung-nova & AXiS

+

"until you reach it... the two hyper sides."

+ + +
+

A Lake With Endless Stars

+

"Under the coruscating night sky, gaze into the kaleidoscopic waters..."

+ + +
+

Oblitus Requiem \\Against the Forsaken Legacy//

+

VNMC2023 Grand Finals Tiebreaker.

+

"Even if you don't remember me now, I will bring the you I once knew back from them."

+ +*/ + releases.forEach((a) => { + let _card = document.createElement("a"), + _bg_img = document.createElement("div"), + _h2 = document.createElement("h2"), + _p_subtitle = document.createElement("p"), + _p_preview = document.createElement("p"); + _card.href = a.url; + + _card.classList.add("card"); + + _bg_img.classList.add("bg-img"); + _bg_img.style = "background-image: url(" + a.img_src + ");"; + + _h2.textContent = a.title; + + _p_subtitle.textContent = a.subtitle; + _p_preview.textContent = a.preview; + + _card.appendChild(_bg_img); + _card.appendChild(_h2); + _card.appendChild(_p_subtitle); + _card.appendChild(_p_preview); + album_cards.appendChild(_card); + }); + } +} +async function init_activities(d) { + if (d.error) { + console.error("Error fetching data:", d.error); + } else { + releases = d.data; + /* +
+

Fanmade of Fighters I: Genesis

+

BOF-like Contest Releases.

+

Our team (Sine Fine Stellae) Achieved #2 :D
+
+ A Lake With Endless Stars is one of the soundtracks from Sine Fine Stellae produced by me, thanks to the help of Riprider500 and more people :D +

+ + +
+

VNMC 2023

+

(Vietnamese National Mania Championship 2023) Grand Finals Tiebreaker by me (t404:null)

+

+ Oblitus Requiem \\Against the Forsaken Legacy// +
+
"Even if you don't remember me now, I will bring the you I once knew back from them."
+
Sivelia (the host of VNMC) has asked me making a custom soundtrack round for the tourney. The soundtrack get much likes and subscribers on Youtube within 2 weeks as the tournament got a big impact gained. Big thank you to all VNMC staffs for that! +

+ + +
+

VNMC 2024 (???)

+

???

+

Li4tLiAuLS0gLS4uIC0tLi4u
\-...-4buoe2v1qZuiULSrOPuzXZBn
YZt0ULSr9PuzvfuiaZwo5ZBseZB39
fuzpLxn9PurYZtz4PtzpVSlC3u3UrviaZO

+ + +
+

VNMC 2024 (???) (w/ ??? as ???)

+

???

+ + +
+

???? 5 (????2024) (w/ ??? as ???)

+

???

+

???

+ */ + releases.forEach((a) => { + let _card = document.createElement("a"), + _bg_img = document.createElement("div"), + _h2 = document.createElement("h2"), + _p_subtitle = document.createElement("p"), + _p_preview = document.createElement("p"); + _card.href = a.url; + _card.classList.add("card"); + + _bg_img.classList.add("bg-img"); + _bg_img.style = "background-image: url(" + a.img_src + ");"; + + _h2.textContent = a.title; + + _p_subtitle.textContent = a.subtitle; + _p_preview.textContent = a.preview; + + _card.appendChild(_bg_img); + _card.appendChild(_h2); + _card.appendChild(_p_subtitle); + _card.appendChild(_p_preview); + album_cards.appendChild(_card); + }); + } +} diff --git a/index.html b/index.html index 7e9bcfb..8a2aeda 100644 --- a/index.html +++ b/index.html @@ -207,107 +207,21 @@ I write/make/produce EDM music(DTM), and for every releases I'll post my music o
-

Releases (Click for more)

- -
-

hello.world(Zer/O)

-

First Release

-

What do I see... a new world...?

- - -
-

PoΣΣεssion (Possession)

-

Formerly "Mayonaka Dancehall!!!" (:DACHiTRAX) Release.

-

Ghost and monsters are gathering you...

- - -
-

Hyper Liminality

-

t404:null & trung-nova & AXiS

-

"until you reach it... the two hyper sides."

- - -
-

A Lake With Endless Stars

-

"Under the coruscating night sky, gaze into the kaleidoscopic waters..."

- - -
-

Oblitus Requiem \\Against the Forsaken Legacy//

-

VNMC2023 Grand Finals Tiebreaker.

-

"Even if you don't remember me now, I will bring the you I once knew back from them."

-

Activities

- -
-

Fanmade of Fighters I: Genesis

-

BOF-like Contest Releases.

-

Our team (Sine Fine Stellae) Achieved #2 :D
-
- A Lake With Endless Stars is one of the soundtracks from Sine Fine Stellae produced by me, thanks to the help of Riprider500 and more people :D -

- - -
-

VNMC 2023

-

(Vietnamese National Mania Championship 2023) Grand Finals Tiebreaker by me (t404:null)

-

- Oblitus Requiem \\Against the Forsaken Legacy// -
-
"Even if you don't remember me now, I will bring the you I once knew back from them."
-
Sivelia (the host of VNMC) has asked me making a custom soundtrack round for the tourney. The soundtrack get much likes and subscribers on Youtube within 2 weeks as the tournament got a big impact gained. Big thank you to all VNMC staffs for that! -

- - -
-

VNMC 2024 (???)

-

???

-

Li4tLiAuLS0gLS4uIC0tLi4u
\-...-4buoe2v1qZuiULSrOPuzXZBn
YZt0ULSr9PuzvfuiaZwo5ZBseZB39
fuzpLxn9PurYZtz4PtzpVSlC3u3UrviaZO

- - -
-

VNMC 2024 (???) (w/ ??? as ???)

-

???

- - -
-

???? 5 (????2024) (w/ ??? as ???)

-

???

-

???

-
+
© t404:null 2021-2024 - All Rights Reserved
\ No newline at end of file diff --git a/release/index.html b/release/index.html index d08d76b..a4abdf7 100644 --- a/release/index.html +++ b/release/index.html @@ -192,46 +192,8 @@ I write/make/produce EDM music(DTM), and for every releases I'll post my music o

Releases

- -
-

hello.world(Zer/O)

-

First Release

-

What do I see... a new world...?

- - -
-

PoΣΣεssion (Possession)

-

Formerly "Mayonaka Dancehall!!!" (:DACHiTRAX) Release.

-

Ghost and monsters are gathering you...

- - -
-

Hyper Liminality

-

t404:null & trung-nova & AXiS

-

"until you reach it... the two hyper sides."

- - -
-

A Lake With Endless Stars

-

"Under the coruscating night sky, gaze into the kaleidoscopic waters..."

- - -
-

Oblitus Requiem \\Against the Forsaken Legacy//

-

VNMC2023 Grand Finals Tiebreaker.

-

"Even if you don't remember me now, I will bring the you I once knew back from them."

-
+
© t404:null 2021-2024 - All Rights Reserved