edit: lien entre panneau à propos et mastodon pour permettre à artiste et orga d'y déposer du contenu
This commit is contained in:
@@ -1,125 +1,6 @@
|
|||||||
[
|
[
|
||||||
{
|
{
|
||||||
"type": "folder",
|
"name": "vega",
|
||||||
"date": "33/33",
|
"folder": 2
|
||||||
"isSelected": false,
|
|
||||||
"caption": "Artistes DRAGs",
|
|
||||||
"description": "Si tu veux en savoir plus sur nos artistes drags, c'est par ici !",
|
|
||||||
"children": [
|
|
||||||
{
|
|
||||||
"type": "folder",
|
|
||||||
"date": "33/33",
|
|
||||||
"isSelected": false,
|
|
||||||
"caption": "Urazoria",
|
|
||||||
"description": "Urazoria est une Drag Creature de Limoges, et aussi une des fondatrice de drags & nerds, host de la 1ère édition",
|
|
||||||
"children": [
|
|
||||||
{
|
|
||||||
"type": "image",
|
|
||||||
"date": "33/33",
|
|
||||||
"isSelected": false,
|
|
||||||
"caption": "Urazoria003.star",
|
|
||||||
"description": "Urazoria dans son show à XXXX pour XXXX en 2025",
|
|
||||||
"src":"./DATA/Images/ura-bleu.png",
|
|
||||||
"like": 0,
|
|
||||||
"isLiked": false
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"type": "text",
|
|
||||||
"date": "33/33",
|
|
||||||
"isSelected": false,
|
|
||||||
"caption": "Urazoria.loveMsg",
|
|
||||||
"description": "Coucou !"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"type": "text",
|
|
||||||
"date": "33/33",
|
|
||||||
"isSelected": false,
|
|
||||||
"caption": "Urazoria.loveMsg",
|
|
||||||
"description": "Coucou !"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"type": "folder",
|
|
||||||
"date": "33/33",
|
|
||||||
"isSelected": false,
|
|
||||||
"caption": "Artistes NERDs",
|
|
||||||
"description": "Si tu veux en savoir plus sur nos artistes nerds, c'est par là !",
|
|
||||||
"children": [
|
|
||||||
{
|
|
||||||
"type": "folder",
|
|
||||||
"date": "33/33",
|
|
||||||
"isSelected": false,
|
|
||||||
"caption": "Théo",
|
|
||||||
"description": "Theo est un musicien qui construit des synthés modulaires",
|
|
||||||
"children": [
|
|
||||||
{
|
|
||||||
"type": "link",
|
|
||||||
"date": "33/33",
|
|
||||||
"isSelected": false,
|
|
||||||
"caption": "Theo.web",
|
|
||||||
"description": "Réseaux de Theo",
|
|
||||||
"links":[
|
|
||||||
{
|
|
||||||
"caption":"site web",
|
|
||||||
"url":"https://drags-nerds.net"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"caption":"site web",
|
|
||||||
"url":"https://drags-nerds.net"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"type": "text",
|
|
||||||
"date": "33/33",
|
|
||||||
"isSelected": false,
|
|
||||||
"caption": "Theo.loveMsg",
|
|
||||||
"description": "Hello !"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"type": "folder",
|
|
||||||
"date": "33/33",
|
|
||||||
"isSelected": false,
|
|
||||||
"caption": "Autres",
|
|
||||||
"description": "Dans ce dossier on met en vrac plein de trucs, qu'on trouve cool, sur nous (ou pas), nos valeurs etc. Allez fouiller si vous avez le temps ^^",
|
|
||||||
"children": [
|
|
||||||
{
|
|
||||||
"type": "link",
|
|
||||||
"date": "33/33",
|
|
||||||
"isSelected": false,
|
|
||||||
"caption": "Background.web",
|
|
||||||
"description": "Site internet du fond animé, en open source, allez checker ça l'équipe ! (et payer un café à son créateur si vous pouvez hihi)",
|
|
||||||
"links":[
|
|
||||||
{
|
|
||||||
"caption":"site web",
|
|
||||||
"url":"https://collidingscopes.github.io/liquid-shape-distortions"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"type": "text",
|
|
||||||
"date": "33/33",
|
|
||||||
"isSelected": false,
|
|
||||||
"caption": "DNN.loveMsg",
|
|
||||||
"description": "Hello again!"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"type": "image",
|
|
||||||
"date": "33/33",
|
|
||||||
"isSelected": false,
|
|
||||||
"caption": "Urazoria003.star",
|
|
||||||
"description": "Urazoria dans son show à XXXX pour XXXX en 2025",
|
|
||||||
"src":"./DATA/Images/ura-vert.png",
|
|
||||||
"like": 0,
|
|
||||||
"isLiked": false
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
|
|||||||
@@ -1,4 +1,173 @@
|
|||||||
export async function loadPeopleData() {
|
function idAndDate(str){
|
||||||
const pData = await fetch('./DATA/peopleData.json');
|
let data = str.split("T");
|
||||||
return await pData.json();
|
let date = data[0].split("-");
|
||||||
|
return {
|
||||||
|
date: date[2] +'/'+ date[1],
|
||||||
|
id: date[2] + date[1]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function inlineContent(str){
|
||||||
|
let data = str.split("<br>");
|
||||||
|
let content = "";
|
||||||
|
for (let line of data){
|
||||||
|
content += line + '\n';
|
||||||
|
}
|
||||||
|
return content
|
||||||
|
}
|
||||||
|
|
||||||
|
function titleAndContent(str){
|
||||||
|
let data = str.split(" :");
|
||||||
|
let title = data[0];
|
||||||
|
let contentData = data[1].split("<br>").filter(e => e);
|
||||||
|
let content = "";
|
||||||
|
let src = [];
|
||||||
|
for(let line of contentData){
|
||||||
|
if(line.includes('http')){
|
||||||
|
let linkData = line.split("@");
|
||||||
|
let linkNoFormat = linkData[1].split("\"");
|
||||||
|
let url = "";
|
||||||
|
for(let el of linkNoFormat){
|
||||||
|
if(el.includes('http')){
|
||||||
|
url = el;
|
||||||
|
break
|
||||||
|
} else {
|
||||||
|
continue
|
||||||
|
}
|
||||||
|
}
|
||||||
|
src.push({
|
||||||
|
caption: linkData[0],
|
||||||
|
url: url
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
content += line + '\n';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return {
|
||||||
|
title: title,
|
||||||
|
content: content,
|
||||||
|
links: src,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function loadPeopleData() {
|
||||||
|
const usernamesRes = await fetch('./DATA/peopleData.json');
|
||||||
|
const pData = await usernamesRes.json();
|
||||||
|
const res = await fetch("https://pouet.drags-nerds.net/api/v1/timelines/public?local=true&limit=40");
|
||||||
|
|
||||||
|
if (!res.ok)
|
||||||
|
throw new Error(`Server responded with ${res.status} ${res.statusText}`);
|
||||||
|
|
||||||
|
const pouets = await res.json();
|
||||||
|
const filtered = pouets.filter(p => pData.some(user => p.account.display_name === user.name));
|
||||||
|
const files = {};
|
||||||
|
for (const user of pData) {
|
||||||
|
files[user.name] = [];
|
||||||
|
}
|
||||||
|
const description = {};
|
||||||
|
for (const user of pData){
|
||||||
|
const pouet = filtered.find(p => p.account.display_name === user.name);
|
||||||
|
if (pouet){
|
||||||
|
description[user.name] = pouet.account.note;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
for (const pouet of filtered) {
|
||||||
|
const username = pouet.account.display_name;
|
||||||
|
let infos = idAndDate(pouet.created_at);
|
||||||
|
let entry;
|
||||||
|
|
||||||
|
//ignorer autres que images
|
||||||
|
if (pouet.media_attachments?.length > 0 &&
|
||||||
|
!pouet.media_attachments[0].type.includes('image')) {
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (pouet.content.includes('http')) {
|
||||||
|
let textInfos = titleAndContent(pouet.content);
|
||||||
|
entry = {
|
||||||
|
id: 'link' + username + infos.id,
|
||||||
|
date: infos.date,
|
||||||
|
dateInfo: pouet.created_at,
|
||||||
|
type: "link",
|
||||||
|
author: username,
|
||||||
|
caption: textInfos.title + '.liens',
|
||||||
|
links: textInfos.links,
|
||||||
|
description: textInfos.content,
|
||||||
|
isSelected: false
|
||||||
|
};
|
||||||
|
} else if (pouet.media_attachments?.length > 0) {
|
||||||
|
let textInfos = titleAndContent(pouet.content);
|
||||||
|
entry = {
|
||||||
|
id: 'img' + username + infos.id,
|
||||||
|
date: infos.date,
|
||||||
|
dateInfo: pouet.created_at,
|
||||||
|
type: "image",
|
||||||
|
author: username,
|
||||||
|
caption: textInfos.title + '.star',
|
||||||
|
src: pouet.media_attachments[0].url,
|
||||||
|
description: textInfos.content,
|
||||||
|
like: pouet.favourites_count,
|
||||||
|
isSelected: false
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
let textInfos = titleAndContent(pouet.content);
|
||||||
|
entry = {
|
||||||
|
id: 'txt' + username + infos.id,
|
||||||
|
date: infos.date,
|
||||||
|
dateInfo: pouet.created_at,
|
||||||
|
type: "text",
|
||||||
|
author: username,
|
||||||
|
caption: textInfos.title + '.msg',
|
||||||
|
description: textInfos.content,
|
||||||
|
isSelected: false
|
||||||
|
};
|
||||||
|
}
|
||||||
|
files[username].push(entry);
|
||||||
|
}
|
||||||
|
|
||||||
|
const dragContent = pData.filter(user => user.folder === 0).map(user => (
|
||||||
|
{
|
||||||
|
type: "folder",
|
||||||
|
caption: user.name + '.info',
|
||||||
|
children: files[user.name],
|
||||||
|
description: description[user.name],
|
||||||
|
isSelected: false
|
||||||
|
}));
|
||||||
|
const nerdContent = pData.filter(user => user.folder === 1).map(user => (
|
||||||
|
{
|
||||||
|
type: "folder",
|
||||||
|
caption: user.name + '.info',
|
||||||
|
children: files[user.name],
|
||||||
|
description: description[user.name],
|
||||||
|
isSelected: false
|
||||||
|
}));
|
||||||
|
|
||||||
|
const otherContent = pData.filter(user => user.folder === 2).flatMap(user => files[user.name]);
|
||||||
|
|
||||||
|
|
||||||
|
const sortedContent = [
|
||||||
|
{
|
||||||
|
type: "folder",
|
||||||
|
caption : "Artistes Drags",
|
||||||
|
description:"Pour en savoir plus sur nos artistes drags, c'est par ici !",
|
||||||
|
children: dragContent,
|
||||||
|
isSelected: false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: "folder",
|
||||||
|
caption : "Artistes Nerds",
|
||||||
|
description:"Pour en savoir plus sur nos artistes nerds, c'est par là !",
|
||||||
|
children: nerdContent,
|
||||||
|
isSelected: false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: "folder",
|
||||||
|
caption : "Autres contenus",
|
||||||
|
description:"Dans cette section, on place pleins de contenu, en vrac, \n sur nous, nos copaines, des trucs qu'on trouve cool, etc.",
|
||||||
|
children: otherContent,
|
||||||
|
isSelected: false
|
||||||
|
}
|
||||||
|
];
|
||||||
|
return sortedContent;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -35,17 +35,17 @@
|
|||||||
<div class="windowContent" id="artistContent">
|
<div class="windowContent" id="artistContent">
|
||||||
<p id="emptyFolderText" v-show="emptyFolder">Oops! There is nothing to display here...</p>
|
<p id="emptyFolderText" v-show="emptyFolder">Oops! There is nothing to display here...</p>
|
||||||
<div v-show="gridDisplay" class="theMatrix" @mousedown.stop @touchstart.stop @reload="dataFirstLoad" @click="deselectAll">
|
<div v-show="gridDisplay" class="theMatrix" @mousedown.stop @touchstart.stop @reload="dataFirstLoad" @click="deselectAll">
|
||||||
<div class="itemStyle" v-for="item in displayedItems" :class="{selectedItemStyle:item.isSelected, displayStyle: !item.isSelected}" :key="item.caption" @click.stop="itemIsClicked(item)">
|
<div class="itemStyle" v-for="item in displayedItems" :class="{selectedItemStyle:item.isSelected, displayStyle: !item.isSelected}" :key="item.id" @click.stop="itemIsClicked(item)">
|
||||||
<component :is="item.type==='folder'? FolderIcon : item.type === 'text'? TextIcon : item.type === 'link'? LinkIcon : ImgIcon" class="icon"/>
|
<component :is="item.type==='folder'? FolderIcon : item.type === 'text'? TextIcon : item.type === 'link'? LinkIcon : ImgIcon" class="icon"/>
|
||||||
<p class="itemCaption">{{item.caption}}</p>
|
<p class="itemCaption">{{item.caption}}</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div v-show="listDisplay" class="nevrEndingList" @mousedown.stop @touchstart.stop @reload="dataFirstLoad" @click="deselectAll">
|
<div v-show="listDisplay" class="nevrEndingList" @mousedown.stop @touchstart.stop @reload="dataFirstLoad" @click="deselectAll">
|
||||||
<div class="listItemStyle" v-for="item in displayedItems" :class="{selectedItemStyle:item.isSelected, displayStyle: !item.isSelected}" :key="item.caption" @click.stop="itemIsClicked(item)">
|
<div class="listItemStyle" v-for="item in displayedItems" :class="{selectedItemStyle:item.isSelected, displayStyle: !item.isSelected}" :key="item.id" @click.stop="itemIsClicked(item)">
|
||||||
<component :is="item.type==='folder'? FolderIcon : item.type === 'text'? TextIcon : item.type === 'link'? LinkIcon : ImgIcon" class="icon"/>
|
<component :is="item.type==='folder'? FolderIcon : item.type === 'text'? TextIcon : item.type === 'link'? LinkIcon : ImgIcon" class="icon"/>
|
||||||
<p class="itemCaption" id="listTitle">{{item.caption}}</p>
|
<p class="itemCaption" id="listTitle">{{item.caption}}</p>
|
||||||
<p class="itemCaption">*auteurice*</p>
|
<p class="itemCaption">{{item.author}}</p>
|
||||||
<p class="itemCaption">{{item.date}}</p>
|
<p class="itemCaption"><time :timedate="item.dateInfo">{{item.date}}</time></p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div v-show="displayedItems" class="itemDesc" @touchstart.stop @click.stop>
|
<div v-show="displayedItems" class="itemDesc" @touchstart.stop @click.stop>
|
||||||
@@ -258,7 +258,7 @@
|
|||||||
border-width: thin;
|
border-width: thin;
|
||||||
border-color: transparent;
|
border-color: transparent;
|
||||||
border-radius: 16.1px;
|
border-radius: 16.1px;
|
||||||
overflow-x: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
.listItemStyle:hover{
|
.listItemStyle:hover{
|
||||||
@@ -358,9 +358,10 @@
|
|||||||
this.isNotRoot = true;
|
this.isNotRoot = true;
|
||||||
this.displayedDescription = e.description
|
this.displayedDescription = e.description
|
||||||
this.fileName += e.caption + '/';
|
this.fileName += e.caption + '/';
|
||||||
if (e.caption === 'Autres'){
|
if (e.caption === 'Autres contenus'){
|
||||||
this.gridDisplay = false;
|
this.gridDisplay = false;
|
||||||
this.listDisplay = true;
|
this.listDisplay = true;
|
||||||
|
this.organizeItems();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
if(e.type === 'image'){
|
if(e.type === 'image'){
|
||||||
@@ -387,9 +388,11 @@
|
|||||||
|
|
||||||
},
|
},
|
||||||
selectFile(e){
|
selectFile(e){
|
||||||
this.displayedItems.forEach(it => {
|
console.log(e);
|
||||||
|
if(!this.emptyFolder){
|
||||||
|
this.displayedItems.forEach(it => {
|
||||||
it.isSelected = false;
|
it.isSelected = false;
|
||||||
})
|
})}
|
||||||
e.isSelected = true;
|
e.isSelected = true;
|
||||||
this.displayedDescription = e.description;
|
this.displayedDescription = e.description;
|
||||||
},
|
},
|
||||||
@@ -419,20 +422,27 @@
|
|||||||
this.emptyFolder = false;
|
this.emptyFolder = false;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
organizeItems(){
|
||||||
|
this.displayedItems.sort((a,b) => b.dateInfo.localeCompare(a.dateInfo));
|
||||||
|
},
|
||||||
backToRoot(){
|
backToRoot(){
|
||||||
this.displayedItems = this.rootFolderContent.at(-1).content;
|
this.displayedItems = this.rootFolderContent.at(-1).content;
|
||||||
this.fileName = this.rootFolderContent.at(-1).directory;
|
this.fileName = this.rootFolderContent.at(-1).directory;
|
||||||
this.rootDepth = this.rootFolderContent.length
|
if(this.emptyFolder){
|
||||||
if (this.rootDepth === 0){
|
this.emptyFolder = false;
|
||||||
this.isNotRoot = false;
|
this.gridDisplay = true;
|
||||||
}
|
}
|
||||||
this.checkEmptyFolder();
|
|
||||||
if(this.listDisplay){
|
if(this.listDisplay){
|
||||||
this.listDisplay = false;
|
this.listDisplay = false;
|
||||||
this.gridDisplay = true;
|
this.gridDisplay = true;
|
||||||
}
|
}
|
||||||
this.deselectAll();
|
this.deselectAll();
|
||||||
this.rootFolderContent.splice(this.rootFolderContent.length-1,1);
|
this.rootFolderContent.splice(this.rootFolderContent.length-1,1);
|
||||||
|
this.rootDepth = this.rootFolderContent.length
|
||||||
|
if (this.rootDepth === 0){
|
||||||
|
this.isNotRoot = false;
|
||||||
|
}
|
||||||
|
console.log(this.rootDepth);
|
||||||
},
|
},
|
||||||
closeClicked(){
|
closeClicked(){
|
||||||
this.dataFirstLoad();
|
this.dataFirstLoad();
|
||||||
|
|||||||
Reference in New Issue
Block a user