screenshit v1

.env

@@ -1,3 +1,4 @@
 DOMAIN=virages.io
 PORT=7828
 DASHBOARD_HIDDEN=false
+REDIRECTIONS=screenshit.erudi.fr->/screenshit

components/atropos.vue

@@ -0,0 +1,17 @@
+<template>
+  <article class="atropos">
+    there shoudlbe atropos
+    <atropos-component class="my-atropos">
+    </atropos-component>
+  </article>
+</template>
+
+<style>
+.atropos {
+  background-color: red;
+}
+.my-atropos {
+  width: 320px;
+  height: 460px;
+}
+</style>

components/openseadragon.vue

@@ -0,0 +1,5 @@
+<template>
+  <div>
+    wait for openseadragon
+  </div>
+</template>

package-lock.json

@@ -8,6 +8,7 @@
       "hasInstallScript": true,
       "dependencies": {
         "atropos": "^2.0.2",
+        "cheerio": "^1.0.0",
         "nuxt": "^3.12.3",
         "unhead": "^1.9.15",
         "vue": "^3.4.31",
@@ -2500,6 +2501,54 @@
         "node": ">=0.8.0"
       }
     },
+    "node_modules/cheerio": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/cheerio/-/cheerio-1.0.0.tgz",
+      "integrity": "sha512-quS9HgjQpdaXOvsZz82Oz7uxtXiy6UIsIQcpBj7HRw2M63Skasm9qlDocAM7jNuaxdhpPU7c4kJN+gA5MCu4ww==",
+      "dependencies": {
+        "cheerio-select": "^2.1.0",
+        "dom-serializer": "^2.0.0",
+        "domhandler": "^5.0.3",
+        "domutils": "^3.1.0",
+        "encoding-sniffer": "^0.2.0",
+        "htmlparser2": "^9.1.0",
+        "parse5": "^7.1.2",
+        "parse5-htmlparser2-tree-adapter": "^7.0.0",
+        "parse5-parser-stream": "^7.1.2",
+        "undici": "^6.19.5",
+        "whatwg-mimetype": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=18.17"
+      },
+      "funding": {
+        "url": "https://github.com/cheeriojs/cheerio?sponsor=1"
+      }
+    },
+    "node_modules/cheerio-select": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/cheerio-select/-/cheerio-select-2.1.0.tgz",
+      "integrity": "sha512-9v9kG0LvzrlcungtnJtpGNxY+fzECQKhK4EGJX2vByejiMX84MFNQw4UxPJl3bFbTMw+Dfs37XaIkCwTZfLh4g==",
+      "dependencies": {
+        "boolbase": "^1.0.0",
+        "css-select": "^5.1.0",
+        "css-what": "^6.1.0",
+        "domelementtype": "^2.3.0",
+        "domhandler": "^5.0.3",
+        "domutils": "^3.0.1"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/fb55"
+      }
+    },
+    "node_modules/cheerio/node_modules/undici": {
+      "version": "6.19.8",
+      "resolved": "https://registry.npmjs.org/undici/-/undici-6.19.8.tgz",
+      "integrity": "sha512-U8uCCl2x9TK3WANvmBavymRzxbfFYG+tAu+fgx3zxQy3qdagQqBLwJVrdyO1TBfUXvfKveMKJZhpvUYoOjM+4g==",
+      "engines": {
+        "node": ">=18.17"
+      }
+    },
     "node_modules/chokidar": {
       "version": "3.6.0",
       "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz",
@@ -3285,6 +3334,18 @@
         "node": ">= 0.8"
       }
     },
+    "node_modules/encoding-sniffer": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/encoding-sniffer/-/encoding-sniffer-0.2.0.tgz",
+      "integrity": "sha512-ju7Wq1kg04I3HtiYIOrUrdfdDvkyO9s5XM8QAj/bN61Yo/Vb4vgJxy5vi4Yxk01gWHbrofpPtpxM8bKger9jhg==",
+      "dependencies": {
+        "iconv-lite": "^0.6.3",
+        "whatwg-encoding": "^3.1.1"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/encoding-sniffer?sponsor=1"
+      }
+    },
     "node_modules/enhanced-resolve": {
       "version": "5.17.0",
       "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.17.0.tgz",
@@ -3846,6 +3907,24 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/htmlparser2": {
+      "version": "9.1.0",
+      "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-9.1.0.tgz",
+      "integrity": "sha512-5zfg6mHUoaer/97TxnGpxmbR7zJtPwIYFMZ/H5ucTlPZhKvtum05yiPK3Mgai3a0DyVxv7qYqoweaEd2nrYQzQ==",
+      "funding": [
+        "https://github.com/fb55/htmlparser2?sponsor=1",
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/fb55"
+        }
+      ],
+      "dependencies": {
+        "domelementtype": "^2.3.0",
+        "domhandler": "^5.0.3",
+        "domutils": "^3.1.0",
+        "entities": "^4.5.0"
+      }
+    },
     "node_modules/http-errors": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-2.0.0.tgz",
@@ -3895,6 +3974,17 @@
         "node": ">=14.18.0"
       }
     },
+    "node_modules/iconv-lite": {
+      "version": "0.6.3",
+      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz",
+      "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==",
+      "dependencies": {
+        "safer-buffer": ">= 2.1.2 < 3.0.0"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/ieee754": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.2.1.tgz",
@@ -5293,6 +5383,40 @@
         "parse-path": "^7.0.0"
       }
     },
+    "node_modules/parse5": {
+      "version": "7.1.2",
+      "resolved": "https://registry.npmjs.org/parse5/-/parse5-7.1.2.tgz",
+      "integrity": "sha512-Czj1WaSVpaoj0wbhMzLmWD69anp2WH7FXMB9n1Sy8/ZFF9jolSQVMu1Ij5WIyGmcBmhk7EOndpO4mIpihVqAXw==",
+      "dependencies": {
+        "entities": "^4.4.0"
+      },
+      "funding": {
+        "url": "https://github.com/inikulin/parse5?sponsor=1"
+      }
+    },
+    "node_modules/parse5-htmlparser2-tree-adapter": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/parse5-htmlparser2-tree-adapter/-/parse5-htmlparser2-tree-adapter-7.0.0.tgz",
+      "integrity": "sha512-B77tOZrqqfUfnVcOrUvfdLbz4pu4RopLD/4vmu3HUPswwTA8OH0EMW9BlWR2B0RCoiZRAHEUu7IxeP1Pd1UU+g==",
+      "dependencies": {
+        "domhandler": "^5.0.2",
+        "parse5": "^7.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/inikulin/parse5?sponsor=1"
+      }
+    },
+    "node_modules/parse5-parser-stream": {
+      "version": "7.1.2",
+      "resolved": "https://registry.npmjs.org/parse5-parser-stream/-/parse5-parser-stream-7.1.2.tgz",
+      "integrity": "sha512-JyeQc9iwFLn5TbvvqACIF/VXG6abODeB3Fwmv/TGdLk2LfbWkaySGY72at4+Ty7EkPZj854u4CrICqNk2qIbow==",
+      "dependencies": {
+        "parse5": "^7.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/inikulin/parse5?sponsor=1"
+      }
+    },
     "node_modules/parseurl": {
       "version": "1.3.3",
       "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.3.tgz",
@@ -6314,6 +6438,11 @@
         }
       ]
     },
+    "node_modules/safer-buffer": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
+      "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
+    },
     "node_modules/sass": {
       "version": "1.77.6",
       "resolved": "https://registry.npmjs.org/sass/-/sass-1.77.6.tgz",
@@ -7899,6 +8028,25 @@
       "resolved": "https://registry.npmjs.org/webpack-virtual-modules/-/webpack-virtual-modules-0.6.1.tgz",
       "integrity": "sha512-poXpCylU7ExuvZK8z+On3kX+S8o/2dQ/SVYueKA0D4WEMXROXgY8Ez50/bQEUmvoSMMrWcrJqCHuhAbsiwg7Dg=="
     },
+    "node_modules/whatwg-encoding": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-3.1.1.tgz",
+      "integrity": "sha512-6qN4hJdMwfYBtE3YBTTHhoeuUrDBPZmbQaxWAqSALV/MeEnR5z1xd8UKud2RAkFoPkmB+hli1TZSnyi84xz1vQ==",
+      "dependencies": {
+        "iconv-lite": "0.6.3"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/whatwg-mimetype": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-4.0.0.tgz",
+      "integrity": "sha512-QaKxh0eNIi2mE9p2vEdzfagOKHCcj1pJ56EEHGQOVxp8r9/iszLUUV7v89x9O1p/T+NlTM5W7jW6+cz4Fq1YVg==",
+      "engines": {
+        "node": ">=18"
+      }
+    },
     "node_modules/whatwg-url": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-5.0.0.tgz",

package.json

@@ -11,6 +11,7 @@
   },
   "dependencies": {
     "atropos": "^2.0.2",
+    "cheerio": "^1.0.0",
     "nuxt": "^3.12.3",
     "unhead": "^1.9.15",
     "vue": "^3.4.31",

pages/index.vue

@@ -1,8 +1,7 @@
 <template>
-  <div class="flex justify-center main">
+  <div class="main">
     <Article />
-    <!-- <Annotorious /> -->
-    <Openseadragon />
+    <!-- <Openseadragon /> -->
   </div>
 </template>
 

pages/screenshit.vue

@@ -0,0 +1,58 @@
+<template>
+  <div class="masonry">
+    <figure v-for="file in files">
+      <img :src="file.replace('./', 'https://files.erudi.fr/screenshit/')">
+    </figure>
+  </div>
+</template>
+
+<script setup>
+const { data: files } = await useFetch('/api/screenshit')
+</script>
+
+<style>
+body {
+  background-color: #000;
+  font: 1.1em Arial, Helvetica, sans-serif;
+}
+
+img {
+  max-width: 100%;
+  display: block;
+}
+
+figure {
+  margin: 0;
+  display: grid;
+  grid-template-rows: 1fr auto;
+}
+
+figure > img {
+  grid-row: 1 / -1;
+  grid-column: 1;
+}
+
+figure a {
+  color: black;
+  text-decoration: none;
+}
+
+figcaption {
+  grid-row: 2;
+  grid-column: 1;
+  background-color: rgba(255,255,255,.5);
+  padding: .2em .5em;
+  justify-self: start;
+}
+
+.masonry {
+  display: grid;
+  grid-template-columns: repeat(4, 1fr);
+  grid-auto-flow: dense;
+  gap: 10px;
+}
+
+.landscape {
+  grid-column-end: span 2;
+}
+</style>

plugins/atropos.js

@@ -0,0 +1,9 @@
+import { defineNuxtPlugin } from '#app'
+
+export default defineNuxtPlugin(() => {
+  if (process.client) {
+    import('atropos/element').then(({ default: AtroposComponent }) => {
+      customElements.define('atropos-component', AtroposComponent)
+    })
+  }
+})

server/api/artists.ts

@@ -1,70 +0,0 @@
-export default eventHandler(() => {
-    return [
-        {
-            id: 0,
-            name: "L'efondras",
-            link: "https://leffondras.bandcamp.com/music",
-            style: [0, 1, 2]
-        },
-        {
-            id: 1,
-            name: "The kundalini genie",
-            link: "https://the-kundalini-genie.bandcamp.com",
-            style: [0, 1, 2]
-        },
-        {
-            id: 2,
-            name: "Fontaines D.C.",
-            link: "https://fontainesdc.bandcamp.com",
-            style: [0, 1, 2]
-        },
-        {
-            id: 3,
-            name: "Fontanarosa",
-            link: "https://fontanarosa.bandcamp.com",
-            style: [0, 1, 2]
-        },
-        {
-            id: 4,
-            name: "Johnny mafia",
-            link: "https://johnnymafia.bandcamp.com",
-            style: [0, 1, 2]
-        },
-        {
-            id: 5,
-            name: "New candys",
-            link: "https://newcandys.bandcamp.com",
-            style: [0, 1, 2]
-        },
-        {
-            id: 6,
-            name: "Magic shoppe",
-            link: "https://magicshoppe.bandcamp.com",
-            style: [0, 1, 2]
-        },
-        {
-            id: 7,
-            name: "Les jaguars",
-            link: "https://radiomartiko.bandcamp.com/album/surf-qu-b-cois",
-            style: [0, 1, 2]
-        },
-        {
-            id: 8,
-            name: "TRAAMS",
-            link: "https://traams.bandcamp.com",
-            style: [0, 1, 2]
-        },
-        {
-            id: 9,
-            name: "Blue orchid",
-            link: "https://blue-orchid.bandcamp.com",
-            style: [0, 1, 2]
-        },
-        {
-            id: 10,
-            name: "I love UFO",
-            link: "https://bruitblanc.bandcamp.com",
-            style: [0, 1, 2]
-        }
-    ]
-})

server/api/compilations.ts

@@ -1,12 +0,0 @@
-export default eventHandler(() => {
-    return [
-        {
-            id: 'ES00',
-            name: 'Zero'
-        },
-        {
-            id: 'ES01',
-            name: 'Zero B-Side'
-        }
-    ]
-})

server/api/screenshit.ts

@@ -0,0 +1,8 @@
+import * as cheerio from 'cheerio'
+
+export default defineEventHandler(async (event) => {
+  const data = await $fetch('https://files.erudi.fr/screenshit/')
+  const $ = cheerio.load(data)
+  let links = []
+  return $('table a').map((i, el) => $(el).attr('href')).get()
+})

server/api/styles.ts

@@ -1,16 +0,0 @@
-export default eventHandler(() => {
-    return [
-    {
-        "id": 0,
-        "name": "post-rock"
-    },
-    {
-        "id": 1,
-        "name": "math-rock"
-    },
-    {
-        "id": 2,
-        "name": "indie-pop"
-    }
-]
-})

server/api/tracks.ts

@@ -1,114 +0,0 @@
-export default eventHandler(() => {
-    return [
-        {
-            id: 0,
-            number: 1,
-            compilation: 'ES00',
-            title: 'The grinding wheel',
-            artist: 0,
-            duration: 392,
-            bpm: 0,
-            link: 'https://arakirecords.bandcamp.com/track/the-grinding-wheel'
-        },
-        {
-            id: 1,
-            number: 2,
-            compilation: 'ES00',
-            title: 'Bleach',
-            artist: 1,
-            duration: 500,
-            bpm: 0,
-            link: 'https://the-kundalini-genie.bandcamp.com/track/bleach-2'
-        },
-        {
-            id: 2,
-            number: 3,
-            compilation: 'ES00',
-            title: 'Televised mind',
-            artist: 2,
-            duration: 0,
-            bpm: 0,
-            link: 'https://fontainesdc.bandcamp.com/track/televised-mind'
-        },
-        {
-            id: 3,
-            number: 4,
-            compilation: 'ES00',
-            title: 'In it',
-            artist: 3,
-            duration: 0,
-            bpm: 0,
-            link: 'https://howlinbananarecords.bandcamp.com/track/in-it'
-        },
-        {
-            id: 4,
-            number: 5,
-            compilation: 'ES00',
-            title: 'Bad michel',
-            artist: 4,
-            duration: 0,
-            bpm: 0,
-            link: 'https://johnnymafia.bandcamp.com/track/bad-michel-3'
-        },
-        {
-            id: 5,
-            number: 6,
-            compilation: 'ES00',
-            title: 'Overall',
-            artist: 5,
-            duration: 0,
-            bpm: 0,
-            link: 'https://newcandys.bandcamp.com/track/overall'
-        },
-        {
-            id: 6,
-            number: 6,
-            compilation: 'ES00',
-            title: 'Guitar jet',
-            artist: 5,
-            duration: 0,
-            bpm: 0,
-            link: 'https://radiomartiko.bandcamp.com/track/guitare-jet'
-        },
-        {
-            id: 7,
-            number: 6,
-            compilation: 'ES00',
-            title: 'Blowup',
-            artist: 5,
-            duration: 0,
-            bpm: 0,
-            link: 'https://magicshoppe.bandcamp.com/track/blowup'
-        },
-        {
-            id: 8,
-            number: 6,
-            compilation: 'ES00',
-            title: 'Intercontinental radio waves',
-            artist: 5,
-            duration: 0,
-            bpm: 0,
-            link: 'https://traams.bandcamp.com/track/intercontinental-radio-waves'
-        },
-        {
-            id: 9,
-            number: 6,
-            compilation: 'ES00',
-            title: 'Here comes the sun',
-            artist: 5,
-            duration: 0,
-            bpm: 0,
-            link: 'https://blue-orchid.bandcamp.com/track/here-come-the-sun'
-        },
-        {
-            id: 10,
-            number: 11,
-            compilation: 'ES00',
-            title: 'Like in the movies',
-            artist: 5,
-            duration: 0,
-            bpm: 0,
-            link: 'https://bruitblanc.bandcamp.com/track/like-in-the-movies-2'
-        },
-    ]
-})