diff --git a/README.md b/README.md
deleted file mode 100644
index 31fcb44..0000000
--- a/README.md
+++ /dev/null
@@ -1,175 +0,0 @@
-start it with a server, like : `alive-server`
-- https://www.npmjs.com/package/alive-server
-- install : `npm install -g alive-server`
-
----
-
-function replaceHtml(elementToReplace, contentToLoad) {
- let oldContent = elementToReplace.innerHTML;
- let newContent = deserialize_html(contentToLoad);
- let targetName = elementToReplace.dataset.target;
- let contentElement = findClassInHtmlcollection(newContent, targetName);
- if (contentElement)
- content_element.outerHTML = oldContent;
-
- elementToReplace.replaceWith(...newContent);
-};
-
-function loadHtml() {
- let elements = document.getElementsByClassName("load_html");
- for (let elementToReplace of elements) {
- let path = (elementToReplace.dataset.path);
- fetch(path)
- .then(response => response.text())
- .then(contentToLoad => replaceHtml(elementToReplace, contentToLoad))
- .catch(error => console.log('Error:', error));
- };
-}
-
----
-
-function replace_html(element_to_replace, content_to_load) {
- let old_content = element_to_replace.innerHTML;
- let new_content = deserialize_html(content_to_load);
- let target_name = element_to_replace.dataset.target;
- let content_element = find_class_in_htmlcollection(new_content, target_name);
- if (content_element)
- content_element.outerHTML = old_content;
-
- element_to_replace.replaceWith(...new_content);
-};
-
-function load_html() {
- let elements = document.getElementsByClassName("load_html");
- for (let element_to_replace of elements) {
- let path = (element_to_replace.dataset.path);
- fetch(path)
- .then(response => response.text())
- .then(content_to_load => replace_html(element_to_replace, content_to_load))
- .catch(error => console.log('Error:', error));
- };
-}
-
----
-
-https://www.youtube.com/watch?v=elt5zpcTlOE
-
-01. 00:00:00 Flowers (Miley Cyrus, 2022)
-02. 00:03:11 Calm Down (Rema, Selena Gomez)
-03. 00:07:07 Dusk Till Dawn (Zayn, Sia, cover ?)
-04. 00:10:17 Old Town Road (Lil Nas X, Billy Ray Cyrus, Jatayu cover)
-05. 00:12:47 Stay (The Kid Laroi, Justin Bieber, cover ?)
-06. 00:15:07 Kill Bill (Sza, cover ?)
-07. 00:17:41 Treat You Better (Shawn Mendes, cover ?)
-08. 00:20:34 We Don't Talk Anymore ()
-09. 00:23:35 Unstoppable ()
-10. 00:27:21 See You Again ()
-11. 00:30:11 24K Magic - Bruno Mars ()
-12. 00:33:39 Bad Habits ()
-13. 00:36:39 This Is What You Came For ()
-14. 00:40:35 Sugar ()
-15. 00:44:28 Side to Sise ()
-16. 00:47:58 Im The One ()
-17. 00:51:10 Sorry - Justin Bieber ()
-18. 00:54:16 Wthout Me - Halsey ()
-19. 00:55:57 Lose You To Love Me ()
-20. 00:58:08 Work From Home ()
-21. 01:00:35 Havana ()
-22. 01:02:54 Shivers ()
-23. 01:06:24 Save Your Tears ()
-24. 01:09:59 Peaches ()
-25. 01:12:01 Cheap Thrills ()
-26. 01:13:57 Rihanna - Work ()
-27. 01:17:23 Easy On Me ()
-28. 01:21:01 Señorita - Shawn Mendes ()
-29. 01:24:11 New Rules ()
-30. 01:27:40 The Greatest - Sia ()
-31. 01:29:50 Shape Of You ()
-32. 01:33:12 Attention ()
-33. 01:36:25 Monsters ()
-34. 01:37:52 Good 4 U ()
-35. 01:41:38 Faded ()
-36. 01:45:06 Send My Love ()
-37. 01:48:43 What About Us ()
-38. 01:53:14 Let Me Love You ()
-39. 01:56:48 I Don't Care ()
-40. 01:59:47 There's Nothing Holding Me Back ()
-41. 02:03:07
-42. 02:05:48
-43. 02:07:30
-44. 02:10:23
-45. 02:13:13
-46. 02:16:30
-47. 02:18:38
-48. 02:23:26
-49. 02:26:39
-50. 02:29:18
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
----
-
-01. 00:00:00 Flowers
-02. 00:03:11 Calm Down
-03. 00:07:07 Dusk Till Dawn
-04. 00:10:17 Old Town Road
-05. 00:12:47 Stay
-06. 00:15:07 Kill Bill
-07. 00:17:41 Treat You Better
-08. 00:20:34 We Don't Talk Anymore
-09. 00:23:35 Unstoppable
-10. 00:27:21 See You Again
-11. 00:30:11 24K Magic
-12. 00:33:39 Bad Habits
-13. 00:36:39 This Is What You Came For
-14. 00:40:35 Sugar
-15. 00:44:28 Side to Sise
-16. 00:47:58 Im The One
-17. 00:51:10 Sorry
-18. 00:54:16 Wthout Me
-19. 00:55:57 Lose You To Love Me
-20. 00:58:08 Work From Home
-21. 01:00:35 Havana
-22. 01:02:54 Shivers
-23. 01:06:24 Save Your Tears
-24. 01:09:59 Peaches
-25. 01:12:01 Cheap Thrills
-26. 01:13:57 Work
-27. 01:17:23 Easy On Me
-28. 01:21:01 Señorita
-29. 01:24:11 New Rules
-30. 01:27:40 The Greatest
-31. 01:29:50 Shape Of You
-32. 01:33:12 Attention
-33. 01:36:25 Monsters
-34. 01:37:52 Good 4 U
-35. 01:41:38 Faded
-36. 01:45:06 Send My Love
-37. 01:48:43 What About Us
-38. 01:53:14 Let Me Love You
-39. 01:56:48 I Don't Care
-40. 01:59:47 There's Nothing Holding Me Back
-41. 02:03:07 ?
-42. 02:05:48 ?
-43. 02:07:30 ?
-44. 02:10:23 ?
-45. 02:13:13 ?
-46. 02:16:30 ?
-47. 02:18:38 ?
-48. 02:23:26 ?
-49. 02:26:39 ?
-50. 02:29:18 ?
-
diff --git a/ascii_elements/banner_1.html b/ascii_elements/banner_1.html
deleted file mode 100644
index f5e23f6..0000000
--- a/ascii_elements/banner_1.html
+++ /dev/null
@@ -1,9 +0,0 @@
-
-
-
-• • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • •
- • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • •
- • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • •
-
-
-
- •
- •• ••••• •••••
- ••• • • • • ••
- •••• • •••• • • • •
- •• •• • • • • • • • •
- •• •• • • • ••• •••••
- •• •• • •• •
-•• •• • •• •
-•• ••••••••• • • •
-•• •• • •••• ••••• •
-•• •• • • • • • • •
-•• •• • • • • •• • •
-•••• • •• •• •• •
-••• • ••••••• • • •••
-•• • • •••••
-•••••••• • • •
-
-
diff --git a/ascii_elements/mouse_2.html b/ascii_elements/mouse_2.html
deleted file mode 100644
index a650c65..0000000
--- a/ascii_elements/mouse_2.html
+++ /dev/null
@@ -1,19 +0,0 @@
-
- •••• •
- • • •
- • • •
- • •••
- •••••
- • •
- • •
- • •
- ••• •••
- • • • •
- • • • •
- •••• ••••
- • • • • •
-••• • • •
- ••••••••
- •
-
-
diff --git a/ascii_elements/mouse_3.html b/ascii_elements/mouse_3.html
deleted file mode 100644
index c27a779..0000000
--- a/ascii_elements/mouse_3.html
+++ /dev/null
@@ -1,17 +0,0 @@
-
- •
- •
- •• •
- • • •••••••
- • •• • •
- • ••••• • • • •
- • • • • • •
- • • •• •
- • • • •
- ••• •• ••
- • •• • •
- • ••••
-•• •
- •
-
-
diff --git a/ascii_elements/mouse_4.html b/ascii_elements/mouse_4.html
deleted file mode 100644
index e0da065..0000000
--- a/ascii_elements/mouse_4.html
+++ /dev/null
@@ -1,252 +0,0 @@
-
-
-
-
-
- •
- •
- •• •
- • • •
- •••••••••
- • • ••
- • • •
- ••••• • • •
- • • •• •
- • • •
- • • ••
- • • • •
- • •• •
- ••• ••••
-
-
- •
- •
- •• •
- • • •
- •••••••••
- • • ••
- • • •
- ••••• • • •
- • • •• •
- • • •
- • • ••
- • • • •
- • •• •
- ••• ••••
-
-
- •
- •
- •• •
- • • •
- •••••••••
- • • ••
- • • •
- ••••• • • •
- • • •• •
- • •
- •• • ••
- • • • •
- • •• •
- ••• ••••
-
-
- •
- •
- •• •
- • • •
- •••••••••
- • • ••
- • • •
- ••••• • • •
- • • •• •
- • • •
- • • ••
- • • • •
- • •• •
- ••• ••••
-
-
- •
- •
- •• •
- • • •
- •••••••••
- • • ••
- • • •
- ••••• • • •
- • • •• •
- • • •
- • • ••
- • • • •
- • •• •
- ••• ••••
-
-
- •
- •
- •• •
- • • •
- •••••••••
- • • ••
- • • •
- ••••• • • •
- • • •• •
- • • •
- • • ••
- • • • •
- • •• •
- ••• ••••
-
-
- •
- •
- •• •
- • • •
- •••••••••
- • • ••
- • • •
- ••••• • • •
- • • •• •
-• • •
- • • ••
- • • • •
- • •• •
- ••• ••••
-
-
- ••
- • • •
- •• •
- • • •
- • • • •
- ••••• • ••
- • • •••••••••
- • • •
-•• • ••• •
- • • • •
- • •• • •
- ••• ••••
-
-
- ••
- • • •
- •• •
- • • •
- • • • •
- ••••• • ••
- • • •••••••••
- • • • •
- • • ••• •
- • • • •
- • •• • •
- ••• ••••
-
-
-
- ••
- • • •
- •• •
- • • •
- • • • •
- ••••• • ••
- • • •••••••••
- • • • •
- • • ••• •
- • • • •
- • •• • •
- ••• ••••
-
-
-
-
-
-
-
diff --git a/ascii_elements/name.html b/ascii_elements/name.html
deleted file mode 100644
index 875db72..0000000
--- a/ascii_elements/name.html
+++ /dev/null
@@ -1,8 +0,0 @@
-
-• • • • ••••• ••••• • ••• • • • •
-• • • • • • • • • • •• •• • •
-••••• • • • •• • • • ••••• • • • •
-• • • • • • • • • • • • • •
-• • ••••• ••••• ••••• ••••• • • • • •
-
-
diff --git a/index.html b/index.html
index 9e886a8..df98af3 100644
--- a/index.html
+++ b/index.html
@@ -8,39 +8,256 @@
hugulumu.fr
-
-
-
-
-
-
-
+
+• • • • ••••• ••••• • ••• • • • •
+• • • • • • • • • • •• •• • •
+••••• • • • •• • • • ••••• • • • •
+• • • • • • • • • • • • • •
+• • ••••• ••••• ••••• ••••• • • • • •
+
-
+
+
+
+ •
+ •
+ •• •
+ • • •
+ •••••••••
+ • • ••
+ • • •
+ ••••• • • •
+ • • •• •
+ • • •
+ • • ••
+ • • • •
+ • •• •
+ ••• ••••
+
+
+ •
+ •
+ •• •
+ • • •
+ •••••••••
+ • • ••
+ • • •
+ ••••• • • •
+ • • •• •
+ • • •
+ • • ••
+ • • • •
+ • •• •
+ ••• ••••
+
+
+ •
+ •
+ •• •
+ • • •
+ •••••••••
+ • • ••
+ • • •
+ ••••• • • •
+ • • •• •
+ • •
+ •• • ••
+ • • • •
+ • •• •
+ ••• ••••
+
+
+ •
+ •
+ •• •
+ • • •
+ •••••••••
+ • • ••
+ • • •
+ ••••• • • •
+ • • •• •
+ • • •
+ • • ••
+ • • • •
+ • •• •
+ ••• ••••
+
+
+ •
+ •
+ •• •
+ • • •
+ •••••••••
+ • • ••
+ • • •
+ ••••• • • •
+ • • •• •
+ • • •
+ • • ••
+ • • • •
+ • •• •
+ ••• ••••
+
+
+ •
+ •
+ •• •
+ • • •
+ •••••••••
+ • • ••
+ • • •
+ ••••• • • •
+ • • •• •
+ • • •
+ • • ••
+ • • • •
+ • •• •
+ ••• ••••
+
+
+ •
+ •
+ •• •
+ • • •
+ •••••••••
+ • • ••
+ • • •
+ ••••• • • •
+ • • •• •
+• • •
+ • • ••
+ • • • •
+ • •• •
+ ••• ••••
+
+
+ ••
+ • • •
+ •• •
+ • • •
+ • • • •
+ ••••• • ••
+ • • •••••••••
+ • • •
+•• • ••• •
+ • • • •
+ • •• • •
+ ••• ••••
+
+
+ ••
+ • • •
+ •• •
+ • • •
+ • • • •
+ ••••• • ••
+ • • •••••••••
+ • • • •
+ • • ••• •
+ • • • •
+ • •• • •
+ ••• ••••
+
+
+
+ ••
+ • • •
+ •• •
+ • • •
+ • • • •
+ ••••• • ••
+ • • •••••••••
+ • • • •
+ • • ••• •
+ • • • •
+ • •• • •
+ ••• ••••
+
+
+
+ •
+ •
+ •• •
+ • • •••••••
+ • •• • •
+ • ••••• • • • •
+ • • • • • •
+ • • •• •
+ • • • •
+ ••• •• ••
+ • •• • •
+ • ••••
+•• •
+ •
+
+
+
+ •••• •
+ • • •
+ • • •
+ • •••
+ •••••
+ • •
+ • •
+ • •
+ ••• •••
+ • • • •
+ • • • •
+ •••• ••••
+ • • • • •
+••• • • •
+ ••••••••
+ •
+
+
+
+ •
+ •• ••••• •••••
+ ••• • • • • ••
+ •••• • •••• • • • •
+ •• •• • • • • • • • •
+ •• •• • • • ••• •••••
+ •• •• • •• •
+•• •• • •• •
+•• ••••••••• • • •
+•• •• • •••• ••••• •
+•• •• • • • • • • •
+•• •• • • • • •• • •
+•••• • •• •• •• •
+••• • ••••••• • • •••
+•• • • •••••
+•••••••• • • •
+
+
+
+
+• • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • •
+ • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • •
+ • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • •
+
• • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • •
@@ -56,7 +273,13 @@
• • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • •
• • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • •
-
+
+
+• • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • •
+ • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • •
+ • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • •
+
+
• • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • •
• • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • •
@@ -68,6 +291,7 @@
• • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • •
• • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • •
+
• • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • •
• • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • •
diff --git a/scripts/build.sh b/scripts/build.sh
deleted file mode 100644
index 36f865e..0000000
--- a/scripts/build.sh
+++ /dev/null
@@ -1,16 +0,0 @@
-#!/bin/bash
-
-# Define the file to watch
-file_to_watch="./"
-
-# Watch for modification events on the file continuously, with a minimum interval of 1s
-last_modified=0
-while read -r directory events filename; do
- current_time=$(date +%s) # Get the current time in seconds
-
- if [ "$current_time" -gt "$last_modified" ]; then
- last_modified=$current_time
- echo "$current_time - The file $filename was modified."
- fi
-done < <(inotifywait -q --monitor --event modify "$file_to_watch")
-
diff --git a/scripts/load_html.js b/scripts/load_html.js
deleted file mode 100644
index 046bf71..0000000
--- a/scripts/load_html.js
+++ /dev/null
@@ -1,53 +0,0 @@
-
-// https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots
-
-customElements.define(
- "load-html",
- class extends HTMLElement {
- constructor() {
-
- super();
-
- let path = this.dataset.path;
-
- let load_content = (content_to_load) => {
- let template = document.createElement('template');
- template.innerHTML = content_to_load;
- let templateContent = template.content;
- //this.appendChild(templateContent.cloneNode(true));
- this.replaceWith(templateContent.cloneNode(true));
- }
-
- fetch(path)
- .then(response => response.text())
- .then(load_content)
- .catch(error => console.log('Error:', error));
- }
- },
-);
-
-customElements.define(
- "load-html-shadow",
- class extends HTMLElement {
- constructor() {
-
- super();
-
- let path = this.dataset.path;
-
- let load_content = (content_to_load) => {
- let template = document.createElement('template');
- template.innerHTML = content_to_load;
- let templateContent = template.content;
- const shadowRoot = this.attachShadow({ mode: "open" });
- shadowRoot.appendChild(templateContent.cloneNode(true));
- }
-
- fetch(path)
- .then(response => response.text())
- .then(load_content)
- .catch(error => console.log('Error:', error));
- }
- },
-);
-
diff --git a/scripts/old_load_html.js b/scripts/old_load_html.js
deleted file mode 100644
index 13fb9c8..0000000
--- a/scripts/old_load_html.js
+++ /dev/null
@@ -1,89 +0,0 @@
-
-// https://stackoverflow.com/questions/494143/creating-a-new-dom-element-from-an-html-string-using-built-in-dom-methods-or-pro
-function deserialize_html(html) {
- let template = document.createElement('template');
- template.innerHTML = html;
- return template.content.children;
- // use .children instead of childNodes to avoid #text elements :
- // https://stackoverflow.com/questions/35199729/javascript-meaning-of-text-in-htmlnode-childnodesi-nodename
- //return template.content.childNodes;
-}
-
-function fill_content(new_content, old_content, target_name) {
- if (!old_content)
- return;
- let elements_with_class = find_elements_by_class(new_content, "content_html");
- let elements_to_fill = find_elements_by_data(elements_with_class, target_name, "path_target");
- elements_to_fill.forEach(el => el.outerHTML = old_content);
-}
-
-function find_elements_by_class(html_collection, class_to_find) {
- for (element of html_collection) {
- if (element.nodeName === "STYLE")
- continue;
- if (element.nodeName === "SCRIPT")
- continue;
- return element.getElementsByClassName(class_to_find);
- }
- return null;
-}
-
-function find_elements_by_data(html_collection, data_to_compare, dataset_name) {
- let matching_elements = [];
- if (!data_to_compare)
- return matching_elements;
- for (element of html_collection) {
-
- let data = [...element.querySelectorAll(`[data-${dataset_name}='${data_to_compare}']`)];
- //let data = element.dataset[dataset_name];
-
- //if (data_to_compare === data)
- matching_elements.push(...data);
- }
-// if (data_to_compare === "banner")
- return matching_elements;
-}
-
-function transfert_class(element, new_content) {
- let class_target = element.dataset.class_target;
- let new_class = element.dataset.new_class;
- if (!class_target)
- return;
- if (!new_class)
- return;
- let elements_with_class = find_elements_by_data(new_content, class_target, "class_target");
- elements_with_class.forEach(el => el.classList.add(new_class));
-}
-
-function replace_html(element_to_replace, content_to_load) {
- let old_content = element_to_replace.innerHTML;
- let new_content = deserialize_html(content_to_load);
- let target_name = element_to_replace.dataset.path_target;
- transfert_class(element_to_replace, new_content);
-// console.log("new_content: ", new_content);
- fill_content(new_content, old_content, target_name);
- element_to_replace.replaceWith(...new_content);
-};
-
-function load_html() {
- let elements = document.getElementsByClassName("load_html");
- for (let element_to_replace of elements) {
- let path = (element_to_replace.dataset.path);
- if (!path)
- continue;
- fetch(path)
- .then(response => response.text())
- .then(content_to_load => replace_html(element_to_replace, content_to_load))
- .catch(error => console.log('Error:', error));
- };
-}
-
-// create an observer on everytime some HTML is loaded on the whole page (heavy solution...)
-const callback = (mutation_list, observer) => load_html();
-const observer = new MutationObserver(callback);
-const targetNode = document.body;
-const config = { attributes: true, childList: true, subtree: true };
-// Start observing the target node for configured mutations
-observer.observe(targetNode, config);
-
-
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..b7524d0
--- /dev/null
+++ b/style.css
@@ -0,0 +1,114 @@
+body {
+ overflow-x: hidden;
+}
+body * {
+ display: flex;
+ margin: auto;
+}
+script, style {
+ display: none;
+}
+p, pre {
+ line-height: 0.8;
+ font-size: 12px;
+ font-family: monospace;
+}
+pre {
+ margin: 10px 0px;
+}
+
+div.banner {
+ flex-wrap: wrap;
+ overflow: hidden;
+ width: 99vw;
+ margin: 10px 0px;
+}
+div.smallbanner {
+ height: 3.5ex;
+}
+div.bigbanner {
+ height: 21.5ex;
+}
+div.banner * {
+ margin: 0px;
+}
+div.banner p {
+ white-space: pre;
+}
+div.banner br {
+ display: block;
+}
+pre.banner {
+ position: relative;
+ margin-left: -100px;
+ animation-name: slide;
+ animation-iteration-count: infinite;
+ animation-duration: 2s;
+ animation-timing-function: linear;
+ animation-direction: normal;
+}
+pre.banner.pause {
+ animation-play-state: paused;
+}
+pre.banner.reverse {
+ animation-direction: reverse;
+}
+pre.banner.t0_5 {
+ animation-duration: 0.5s;
+}
+pre.banner.t1_0 {
+ animation-duration: 1s;
+}
+pre.banner.t1_5 {
+ animation-duration: 1.5s;
+}
+@keyframes slide {
+ from {left:0;}
+ to {left:2.4em;}
+}
+
+.mouse_container {
+ position: relative;
+ margin-left: 0px;
+ display: contents;
+ /*
+ border: 1px solid red;
+ margin-right: auto;
+ height: 8.5em;
+ width: 11.9em;
+ */
+ width: fit-content;
+}
+pre.mouse {
+ --tmouse: 2s;
+ position: absolute;
+ left: 0px;
+ bottom: 0px;
+ margin: 0px;
+ opacity: 0;
+ animation-name: mouse;
+ animation-iteration-count: infinite;
+ animation-duration: var(--tmouse);
+ animation-timing-function: linear;
+ animation-direction: normal;
+}
+pre.mouse:first-child {
+ position: relative;
+}
+
+pre.mouse.f2 {animation-delay: calc(var(--tmouse) * 10/100);}
+pre.mouse.f3 {animation-delay: calc(var(--tmouse) * 20/100);}
+pre.mouse.f4 {animation-delay: calc(var(--tmouse) * 30/100);}
+pre.mouse.f5 {animation-delay: calc(var(--tmouse) * 40/100);}
+pre.mouse.f6 {animation-delay: calc(var(--tmouse) * 50/100);}
+pre.mouse.f7 {animation-delay: calc(var(--tmouse) * 60/100);}
+pre.mouse.f8 {animation-delay: calc(var(--tmouse) * 70/100);}
+pre.mouse.f9 {animation-delay: calc(var(--tmouse) * 80/100);}
+pre.mouse.f10 {animation-delay: calc(var(--tmouse) * 90/100);}
+@keyframes mouse {
+ 0% {opacity: 1;}
+ 10% {opacity: 1;}
+ 10.1% {opacity: 0;}
+ 100% {opacity: 0;}
+}
+