diff --git a/assets/helllo_world.mp4 b/assets/helllo_world.mp4
new file mode 100644
index 0000000..b5bc4ed
Binary files /dev/null and b/assets/helllo_world.mp4 differ
diff --git a/assets/keta_laibach.jpg b/assets/keta_laibach.jpg
new file mode 100644
index 0000000..01f34f4
Binary files /dev/null and b/assets/keta_laibach.jpg differ
diff --git a/assets/test-js.mp4 b/assets/test-js.mp4
new file mode 100644
index 0000000..b14e453
Binary files /dev/null and b/assets/test-js.mp4 differ
diff --git a/cms.js b/cms.js
new file mode 100644
index 0000000..edf37f7
--- /dev/null
+++ b/cms.js
@@ -0,0 +1,107 @@
+const updatesContainer = document.getElementById("updates-container");
+let updates = [];
+
+// Fetc the updates from the array in updates.json
+// Each element of the array is structured like this:
+//
+// {
+// "date": "October the 21st, 2021",
+// "title": "2nd hand lifeboat script",
+// "text": "Labore eiusmod labore pariatur elit nostrud ut magna cupidatat minim amet deserunt cillum id. Lorem consectetur incididunt anim sit do eu minim nisi id.",
+// "media": {
+// "type": "video",
+// "src": "./assets/test-js.mp4",
+// "alt": "An excerpt from 'When did software gone wrong?' highlighted progressively as in karaoke",
+// "caption": "In every karaoke there are at least 2 voices: a text and a choir"
+// }
+// }
+//
+// Title, Text and Media are not mandatory.
+// If some are not present, the createUpdate function will skip them
+//
+// Note that the Date is required, but its format is up to the user
+//
+// All the media elements require an alt description.
+// This is for accessibility. It's a really good practice to provide quality alt text
+// and we must pay attention to this.
+
+fetch("./updates.json")
+ .then((response) => response.json())
+ .then((data) => {
+ updates = [...data.updates.reverse()];
+ populateContents();
+ });
+
+function populateContents() {
+ updates.forEach((update) => createUpdate(update));
+}
+
+function createUpdate(update) {
+ let card = document.createElement("div");
+ card.classList.add("update");
+
+ // DATE
+ let date = document.createElement("div");
+ date.classList.add("date");
+ date.innerHTML = update.date;
+ card.appendChild(date);
+
+ // TITLE, if present
+ if (update.title) {
+ let title = document.createElement("h3");
+ title.classList.add("title");
+ title.innerHTML = update.title;
+ card.appendChild(title);
+ }
+
+ // MEDIA CONTENTS, if present
+ if (update.media) {
+ let media;
+ // IMAGE
+ if (update.media.type == "img") {
+ media = document.createElement("media");
+ media.classList.add("media");
+
+ let img = document.createElement("img");
+ img.src = update.media.src;
+ img.alt = update.media.alt;
+ media.appendChild(img);
+
+ if (update.media.caption) {
+ let caption = document.createElement("figcaption");
+ caption.innerHTML = update.media.caption;
+ media.appendChild(caption);
+ }
+ }
+ // VIDEO
+ if (update.media.type == "video") {
+ media = document.createElement("div");
+ media.classList.add("media");
+
+ let video = document.createElement("video");
+ video.src = update.media.src;
+ video.alt = update.media.alt;
+ video.setAttribute("autoplay", true);
+ video.setAttribute("loop", true);
+ media.appendChild(video);
+
+ if (update.media.caption) {
+ let caption = document.createElement("p");
+ caption.classList.add("caption");
+ caption.innerHTML = update.media.caption;
+ media.appendChild(caption);
+ }
+ }
+ card.appendChild(media);
+ }
+
+ // TEXT, if present
+ if (update.text) {
+ let text = document.createElement("p");
+ text.classList.add("text");
+ text.innerHTML = update.text;
+ card.appendChild(text);
+ }
+
+ updatesContainer.appendChild(card);
+}
diff --git a/font/.ipynb_checkpoints/font-checkpoint.css b/font/.ipynb_checkpoints/font-checkpoint.css
deleted file mode 100644
index d8518f9..0000000
--- a/font/.ipynb_checkpoints/font-checkpoint.css
+++ /dev/null
@@ -1,20 +0,0 @@
-@font-face {
- font-family: "Grotezk";
- src: url("ApfelGrotezk-Regular.woff") format('woff');
-}
-@font-face {
- font-family: "Bluu";
- src: url("bluunext.woff") format('woff');
- font-weight:regular;
-}
-@font-face {
- font-family: "Bluu";
- src: url("bluunext-bold-webfont.woff") format('woff');
- font-weight:bold;
-}
-@font-face {
- font-family: "Bluu";
- src: url("bluunext-bolditalic-webfont.woff") format('woff');
- font-weight:bold-italic;
- font-style:italic;
-}
\ No newline at end of file
diff --git a/index.html b/index.html
index 44e0419..b6bb130 100644
--- a/index.html
+++ b/index.html
@@ -1,53 +1,89 @@
-
-
-
-
Battiato feat. Simone Weil Karaoke
-
- " To ascertain exactly what the miser whose treasure was stolen
- lost: thus we should learn much.
- Lauzun and the office of Captain of Musketeers. He preferred
- to be a prisoner and Captain of Musketeers rather than to go free
- and not be Captain.
- These are garments. ‘They were ashamed of their nakedness.’"
-
-
- "To lose someone: we suffer because the departed, the absent, has
- become something imaginary and unreal. But our desire for him
- is not imaginary. We have to go down into ourselves to the
- abode of the desire which is not imaginary. Hunger: we imagine
- kinds of food, but the hunger itself is real: we have to fasten on
- to the hunger. The presence of the dead person is imaginary, but
- his absence is very real: henceforward it is his way of appearing."
-
-
- "Man only escapes from the laws of this world in lightning
-flashes. Instants when everything stands still, instants of contemplation, of pure intuition, of mental void, of acceptance of the
-moral void. It is through such instants that he is capable of the
-supernatural.
-Whoever endures a moment of the void either receives the
-supernatural bread or falls. It is a terrible risk, but one that must
-be run—even during the instant when hope fails. But we must
-not throw ourselves into it."
-
-
-
-
an enchanting reading-choir featuring Simone Weil's diaries and Franco Battiato's songs.
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Semper viverra nam libero justo laoreet sit amet cursus. Ut faucibus pulvinar elementum integer. Feugiat scelerisque varius morbi enim. Purus semper eget duis at tellus at. Arcu non odio euismod lacinia. Malesuada fames ac turpis egestas integer eget aliquet. Sit amet consectetur adipiscing elit pellentesque habitant morbi tristique senectus. Leo urna molestie at elementum eu facilisis sed odio morbi. Tortor dignissim convallis aenean et tortor at risus viverra. Porttitor lacus luctus accumsan tortor posuere ac ut. Est pellentesque elit ullamcorper dignissim cras. Elit scelerisque mauris pellentesque pulvinar pellentesque. Ullamcorper sit amet risus nullam eget felis eget. Nec nam aliquam sem et. Sed velit dignissim sodales ut. Leo vel fringilla est ullamcorper eget nulla facilisi etiam. Nisl pretium fusce id velit ut. Proin sed libero enim sed faucibus turpis in.
-
-
tryouts with vvvv and Laibach feat. MissKeta
-
-
-
-
\ No newline at end of file
+
+
+
+
+ "To ascertain exactly what the miser whose treasure
+ was stolen lost: thus we should learn much. Lauzun and the office of Captain of
+ Musketeers. He preferred to be a prisoner and Captain of Musketeers rather than
+ to go free and not be Captain. These are garments. ‘They were ashamed of their
+ nakedness.’"
+
+
+ "To lose someone: we suffer because the departed, the absent, has become
+ something imaginary and unreal. But our desire for him is not imaginary. We have
+ to go down into ourselves to the abode of the desire which is not imaginary.
+ Hunger: we imagine kinds of food, but the hunger itself is real: we have to
+ fasten on to the hunger. The presence of the dead person is imaginary, but his
+ absence is very real: henceforward it is his way of appearing."
+
+
+ "Man only escapes from the laws of this world in lightning flashes. Instants
+ when everything stands still, instants of contemplation, of pure intuition, of
+ mental void, of acceptance of the moral void. It is through such instants that
+ he is capable of the supernatural. Whoever endures a moment of the void either
+ receives the supernatural bread or falls. It is a terrible risk, but one that
+ must be run—even during the instant when hope fails. But we must not throw
+ ourselves into it."
+
+
+
+
+
+ An enchanting reading-in-choir featuring Simone Weil's diaries through the
+ musical intuitions of Franco Battiato
+
+
+ Esse ex qui veniam irure excepteur consequat eu ad enim proident. Ut eiusmod
+ incididunt ex nostrud qui eu sunt laboris enim Lorem consectetur. Esse
+ pariatur irure enim dolore excepteur ullamco in excepteur in nisi eiusmod.
+ Officia ullamco ut eu aliqua anim. Dolor non id amet fugiat mollit sunt
+ cupidatat consectetur et aliqua sint sit.
+
+
+
+
+
+
+
+
+
+