edit: lien entre player & message + mastodon
This commit is contained in:
Binary file not shown.
|
Before Width: | Height: | Size: 580 KiB |
@@ -225,7 +225,7 @@ canvas {
|
||||
}
|
||||
/*==================Reaction Bar for indi pannels*/
|
||||
.reactBar{
|
||||
margin-left: -16.1%;
|
||||
margin-left: 3.33%;
|
||||
width: 77%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
@@ -1,4 +1,56 @@
|
||||
export async function loadAudioData() {
|
||||
const aData = await fetch('./DATA/audioData.json');
|
||||
return await aData.json();
|
||||
function inlineContent(str){
|
||||
let data = str.split("<br>");
|
||||
let content = "";
|
||||
for (let line of data){
|
||||
content += line + '\n';
|
||||
}
|
||||
return content
|
||||
}
|
||||
|
||||
function creditsContent(str){
|
||||
let data = str.split("<br>")
|
||||
let credits = data[0].split(" - ");
|
||||
return {
|
||||
track: credits[0],
|
||||
artist: credits[1]
|
||||
}
|
||||
}
|
||||
|
||||
export async function loadAudioData() {
|
||||
const audioRes = await fetch('./DATA/audioData.json');
|
||||
const aData = await audioRes.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 => aData.some(user => p.account.display_name === user));
|
||||
console.log(filtered);
|
||||
const files = {};
|
||||
for (const user of aData) {
|
||||
files[user] = [];
|
||||
}
|
||||
|
||||
let audioFiles = [];
|
||||
|
||||
for (const pouet of filtered){
|
||||
//ignorer les PJ autres que audio
|
||||
if (pouet.media_attachments?.length > 0 &&
|
||||
!pouet.media_attachments[0].type.includes('audio')) {
|
||||
continue;
|
||||
}
|
||||
|
||||
if(pouet.media_attachments?.length > 0){
|
||||
let credits = creditsContent(pouet.content);
|
||||
let entry = {
|
||||
track: credits.track,
|
||||
artist: credits.artist,
|
||||
src: pouet.media_attachments[0].url
|
||||
}
|
||||
audioFiles.push(entry);
|
||||
}
|
||||
}
|
||||
|
||||
console.log(audioFiles);
|
||||
return audioFiles
|
||||
}
|
||||
|
||||
@@ -1,10 +1,51 @@
|
||||
//ecrire les messages dans /public/DATA/msgData.json avec 6 paramètres : title, content, likes, going, isSelected, isEvent
|
||||
// like & going à 0 par défaut (fonctionnel)
|
||||
// isLiked & isGoing local pour cette session: false par default (fonctionnel)
|
||||
// isSelected: false par défault (fonctionnel)
|
||||
// wasRead: false par défault (fonctionnel)
|
||||
// isEvent: true si le message concerne un évènement
|
||||
export async function loadMsgData() {
|
||||
const data = await fetch('./DATA/msgData.json');
|
||||
return await data.json();
|
||||
function idAndDate(str){
|
||||
let data = str.split("T");
|
||||
let date = data[0].split("-");
|
||||
return {
|
||||
date: date[2] +'/'+ date[1],
|
||||
id: date[2] + date[1]
|
||||
}
|
||||
}
|
||||
|
||||
function titleAndContent(str){
|
||||
let data = str.split(" :");
|
||||
let title = data[0];
|
||||
let contentData = data[1].split("<br>").filter(e => e);
|
||||
let content = "";
|
||||
for(let line of contentData){
|
||||
content += line + '\n';
|
||||
}
|
||||
return {
|
||||
title: title,
|
||||
content: content
|
||||
}
|
||||
}
|
||||
|
||||
export async function loadMsgData() {
|
||||
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 => p.account.display_name === 'Drags and Nerds /Live');
|
||||
console.log(filtered);
|
||||
|
||||
let msgContent = [];
|
||||
|
||||
for (let pouet of filtered){
|
||||
let textInfos = titleAndContent(pouet.content);
|
||||
let dateInfos = idAndDate(pouet.created_at);
|
||||
let entry = {
|
||||
title: textInfos.title,
|
||||
date: dateInfos.date,
|
||||
content: textInfos.content,
|
||||
like: pouet.favourites_count,
|
||||
isLiked: false,
|
||||
wasRead: false,
|
||||
isSelected: false
|
||||
}
|
||||
msgContent.push(entry);
|
||||
}
|
||||
|
||||
return msgContent;
|
||||
}
|
||||
|
||||
@@ -7,15 +7,6 @@ function idAndDate(str){
|
||||
}
|
||||
}
|
||||
|
||||
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];
|
||||
@@ -76,13 +67,17 @@ export async function loadPeopleData() {
|
||||
const username = pouet.account.display_name;
|
||||
let infos = idAndDate(pouet.created_at);
|
||||
let entry;
|
||||
|
||||
//console.log(pouet);
|
||||
//ignorer autres que images
|
||||
if (pouet.media_attachments?.length > 0 &&
|
||||
!pouet.media_attachments[0].type.includes('image')) {
|
||||
continue;
|
||||
}
|
||||
|
||||
if (pouet.in_reply_to_account_id) {
|
||||
continue;
|
||||
}
|
||||
|
||||
if (pouet.content.includes('http')) {
|
||||
let textInfos = titleAndContent(pouet.content);
|
||||
entry = {
|
||||
|
||||
@@ -1,17 +1,14 @@
|
||||
import { reactive } from 'vue'
|
||||
|
||||
export const dataStorage = reactive({
|
||||
selectedMsg: { //empty msg template
|
||||
selectedMsg: {
|
||||
title: '',
|
||||
date: '',
|
||||
content: '',
|
||||
like: 0,
|
||||
isLiked: false,
|
||||
going: 0,
|
||||
isGoing: false,
|
||||
wasRead: false,
|
||||
isSelected: false,
|
||||
isEvent: false
|
||||
isSelected: false
|
||||
},
|
||||
selectedImg: {
|
||||
src: "",
|
||||
|
||||
@@ -22,16 +22,12 @@
|
||||
<CloseIcon name="close" class="icon"/>
|
||||
</button>
|
||||
</div>
|
||||
<div class="windowContent">
|
||||
<div class="windowContent" id="msgContent">
|
||||
<div class="reactBar">
|
||||
<p class="reactStatStyle">{{selectedMsg.like}}</p>
|
||||
<button data-tooltip="j'aime bien" type="button" class="iconBtnStyle" :class="{reactedStyle: selectedMsg.isLiked}" @mousedown.capture="likeMsg" @touchstart.capture="likeMsg">
|
||||
<LikeIcon name="test" class="icon"/>
|
||||
</button>
|
||||
<p v-show="selectedMsg.isEvent" class="reactStatStyle">{{selectedMsg.going}}</p>
|
||||
<button v-show="selectedMsg.isEvent" type="button" class="textBtnStyle" :class="{reactedStyle: selectedMsg.isGoing}" @mousedown.capture="goingToEvent" @touchstart.capture="goingToEvent">
|
||||
JE PARTICIPE!
|
||||
</button>
|
||||
</div>
|
||||
<p id="selectedMsgText" @touchstart.stop>{{selectedMsg.content}}</p>
|
||||
</div>
|
||||
@@ -58,6 +54,14 @@
|
||||
width: 333px;
|
||||
height: 333px;
|
||||
}
|
||||
|
||||
#msgContent{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
align-items: flex-start;
|
||||
}
|
||||
/*================ PC LARGE*/
|
||||
@media(min-width:1000px){
|
||||
#msgVisualizer{
|
||||
@@ -107,9 +111,6 @@
|
||||
likeMsg(){
|
||||
dataStorage.selectedMsg.isLiked = !dataStorage.selectedMsg.isLiked
|
||||
},
|
||||
goingToEvent(){
|
||||
dataStorage.selectedMsg.isGoing = !dataStorage.selectedMsg.isGoing;
|
||||
},
|
||||
closeMsg(){
|
||||
this.$emit('close');
|
||||
dataStorage.selectedMsg.isSelected = false;
|
||||
|
||||
@@ -25,8 +25,6 @@
|
||||
<p class="reactStatStyle">{{item.like}}</p>
|
||||
<LikeIcon name="testLike" class="icon" :class="{reactedStyle: item.isLiked}"/>
|
||||
<p class="reactStatStyle"v-show="item.isEvent">{{item.going}}</p>
|
||||
<p v-show="item.isEvent && !item.isGoing" >PARTICIPAN.X.S</p>
|
||||
<p v-show="item.isEvent && item.isGoing" class="reactedStyle">JE PARTICIPE!</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -248,11 +246,8 @@
|
||||
content: '',
|
||||
like: 0,
|
||||
isLiked: false,
|
||||
going: 0,
|
||||
isGoing: false,
|
||||
wasRead: false,
|
||||
isSelected: false,
|
||||
isEvent: false
|
||||
isSelected: false
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
@@ -162,6 +162,7 @@
|
||||
async mounted(){
|
||||
this.audioData = await loadAudioData();
|
||||
this.target = this.$refs.selectedAudio;
|
||||
console.log('AUDIO/', this.audioData);
|
||||
this.loadAudio();
|
||||
console.log("Music player is loaded!");
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user