subsonics/chopin-frontend
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Version 1.4.0 - Correction de bugs

Browse Source
This commit is contained in:
Raphael
2025-12-06 22:20:16 +01:00
parent 9359d0d8aa
commit 6e71ef6bfa
9 changed files with 43 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@@ -1,6 +1,6 @@
{
"name": "chopin-frontend",
"version": "1.3.0",
"version": "1.4.0",
"private": true,
"scripts": {
"dev": "vite --host --port 8080",

6
src/assets/Global.scss
View File

@@ -28,9 +28,9 @@
--primary: #FFFFFF;
--primary-inverse: #111210;
--primary-hover: #292b26;
--secondary: #EAEAEA;
--tertiary: #d3d3d3;
--quaternary: #b8b8b8;
--secondary: #cccccc;
--tertiary: #9b9a9a;
--quaternary: #9f9f9f;
--text: #111210;
--text-inverse: #FFFFFF;
--text-secondary: #404040;

24
src/components/Layout/Player.vue
View File

@@ -10,21 +10,21 @@
<DurationBar ref="durationBar" :buffering="buffering" :pause="pause" class="duration-bar" @seek="seek" :offline="!online || !video" :current-time="currentTime" :total-duration="totalDuration" />
<div class="actions">
<div v-if="online" class="actions-div">
<CustomIcon :active="loop" @click="toggleLoop"><Loop active icon="fa-solid fa-sync"/></CustomIcon>
<CustomIcon :active="shuffle" @click="toggleShuffle"><Shuffle icon="fa-solid fa-shuffle"/></CustomIcon>
<CustomIcon title="En boucle" :active="loop" @click="toggleLoop"><Loop active icon="fa-solid fa-sync"/></CustomIcon>
<CustomIcon title="Lecture aléatoire" :active="shuffle" @click="toggleShuffle"><Shuffle icon="fa-solid fa-shuffle"/></CustomIcon>
</div>
<span v-else></span>
<div :class="{'actions-div': true, 'offline': !online || !video}" >
<Backward @click="backward" :class="{'playIcon': online && video, 'itm-sec': true, 'enabled': online}" class="itm-sec" icon="fa-solid fa-backward-step"/>
<Backward title="Précédent" @click="backward" :class="{'playIcon': online && video, 'itm-sec': true, 'enabled': online}" class="itm-sec" icon="fa-solid fa-backward-step"/>
<div @click="togglePause()" :class="{'playIcon': online && video, 'itm-main': true}">
<Play v-if="pause || !online"/>
<Pause v-else/>
</div>
<Forward @click="forward" :class="{'playIcon': online && video, 'itm-sec': true, 'enabled': online}" class="itm-sec" icon="fa-solid fa-forward-step"/>
<Forward title="Suivant" @click="forward" :class="{'playIcon': online && video, 'itm-sec': true, 'enabled': online}" class="itm-sec" icon="fa-solid fa-forward-step"/>
</div>
<div v-if="online" class="actions-div">
<CustomIcon @click="changeChannel"><Hand icon="fa-solid fa-hand"/></CustomIcon>
<CustomIcon @click="disconnect"><Disconnect icon="fa-solid fa-phone-slash"/></CustomIcon>
<CustomIcon title="Changer de salon" @click="changeChannel"><Hand icon="fa-solid fa-hand"/></CustomIcon>
<CustomIcon title="Déconnecter" @click="disconnect"><Disconnect icon="fa-solid fa-phone-slash"/></CustomIcon>
</div>
<span v-else></span>
</div>
@@ -38,20 +38,20 @@
<DurationBar ref="durationBar" mobile :buffering="buffering" :pause="pause" class="duration-bar" @seek="seek" :offline="!online || !video" :current-time="currentTime" :total-duration="totalDuration" />
<span class="actions-container">
<div :class="{'actions-div': true, 'offline': !online || !video}" >
<Backward @click="backward" :class="{'playIcon': online && video, 'itm-sec': true, 'enabled': online}" class="itm-sec" icon="fa-solid fa-backward-step"/>
<Backward title="Précédent" @click="backward" :class="{'playIcon': online && video, 'itm-sec': true, 'enabled': online}" class="itm-sec" icon="fa-solid fa-backward-step"/>
<div @click="togglePause()" :class="{'playIcon': online && video, 'itm-main': true}">
<Play v-if="pause || !online"/>
<Pause v-else/>
</div>
<Forward @click="forward" :class="{'playIcon': online && video, 'itm-sec': true, 'enabled': online}" class="itm-sec" icon="fa-solid fa-forward-step"/>
<Forward title="Suivant" @click="forward" :class="{'playIcon': online && video, 'itm-sec': true, 'enabled': online}" class="itm-sec" icon="fa-solid fa-forward-step"/>
</div>
</span>
<ActualChannel/>
<div class="button-div" v-if="online" >
<CustomIcon :active="loop" @click="toggleLoop"><Loop active icon="fa-solid fa-sync"/></CustomIcon>
<CustomIcon :active="shuffle" @click="toggleShuffle"><Shuffle icon="fa-solid fa-shuffle"/></CustomIcon>
<CustomIcon @click="changeChannel"><Hand icon="fa-solid fa-hand"/></CustomIcon>
<CustomIcon @click="disconnect"><Disconnect icon="fa-solid fa-phone-slash"/></CustomIcon>
<CustomIcon title="En boucle" :active="loop" @click="toggleLoop"><Loop active icon="fa-solid fa-sync"/></CustomIcon>
<CustomIcon title="Lecture aléatoire" :active="shuffle" @click="toggleShuffle"><Shuffle icon="fa-solid fa-shuffle"/></CustomIcon>
<CustomIcon title="Changer de salon" @click="changeChannel"><Hand icon="fa-solid fa-hand"/></CustomIcon>
<CustomIcon title="Déconnecter" @click="disconnect"><Disconnect icon="fa-solid fa-phone-slash"/></CustomIcon>
</div>
</div>
<div :class="{'player-mobile-bar': playerOpen, 'player-mobile-fold': !playerOpen}">

1
src/components/Layout/Playlist.vue
View File

@@ -52,7 +52,6 @@ const error = ref(null);
const globalStore = useGlobalStore();
const userStore = useUserStore();
//FIXME: Fix Ralentissement lors de grosses Playlists
//TODO: Faire la synchro google
//TODO: Faire la possibilité d'envoyer une playlist

4
src/components/UI/Carousel.vue
View File

@@ -127,6 +127,7 @@ function updateSlots() {
if(props.onlyMobile) {
if (window.innerWidth > 1280) {
direction.value = '';
allSlots.value = allSlots.value[0] ? [allSlots.value[0]] : [];
actualIndex.value = 0; // Reset index when resizing to desktop
return;
} else {
@@ -144,6 +145,9 @@ function updateSlots() {
});
}
if(actualIndex.value >= allSlots.value.length) {
actualIndex.value = 0; // Reset index when resizing to desktop
}
}
ready.value = true;
}, 100)

1
src/components/Widget/Guild/GuildSettings.vue
View File

@@ -25,6 +25,7 @@ const userStore = useUserStore();
const modal = ref(null);
//TODO: Ajout de Log pour serveur
//FIXME: Duration Bug sur stats
const props = defineProps({
server: {

10
src/components/Widget/Queue/NextList.vue
View File

@@ -25,7 +25,7 @@
<Icon icon="fa-solid fa-list-ol"/>
<p>Déplacer en première position</p>
</div>
<div @click="savePlaylist()">
<div v-if="!isAFile" @click="savePlaylist()">
<Icon icon="fa-solid fa-floppy-disk"/>
<p>Sauvegarder dans une playlist</p>
</div>
@@ -49,7 +49,7 @@
<script setup>
import VideoQueue from '@/components/UI/VideoQueue.vue';
import IconAction from '@/components/UI/IconAction.vue';
import { useId, ref, onMounted, watch } from 'vue';
import { useId, ref, onMounted, watch, computed } from 'vue';
import ContextMenu from '@/components/UI/ContextMenu.vue';
import Button from '@/components/UI/Button.vue';
import { IORequest } from '@/utils/IORequest';
@@ -68,6 +68,12 @@ const userStore = useUserStore()
const playlistSelector = ref(null)
const localNextList = ref([])
const isAFile = computed(() => {
if(selectedIndex.value == null) return false;
const video = props.nextList[selectedIndex.value];
return video.type === "attachment";
})
const dragOptions = {
animation: 200,
disabled: false,

12
src/components/Widget/Queue/PreviousList.vue
View File

@@ -17,7 +17,7 @@
<Icon icon="fa-solid fa-play"/>
<p>Jouer maintenant</p>
</div>
<div @click="savePlaylist()">
<div v-if="!isAFile" @click="savePlaylist()">
<Icon icon="fa-solid fa-floppy-disk"/>
<p>Sauvegarder dans une playlist</p>
</div>
@@ -37,7 +37,7 @@
<script setup>
import VideoQueue from '@/components/UI/VideoQueue.vue';
import IconAction from '@/components/UI/IconAction.vue';
import { ref, onMounted, watch, useId } from 'vue';
import { ref, computed, useId } from 'vue';
import ContextMenu from '@/components/UI/ContextMenu.vue';
import Button from '@/components/UI/Button.vue';
import { IORequest } from '@/utils/IORequest';
@@ -58,6 +58,12 @@ const contextMenu = ref(null)
const saveModal = ref(null)
const playlistSelector = ref(null)
const isAFile = computed(() => {
if(selectedIndex.value == null) return false;
const video = props.previousList[selectedIndex.value];
return video.type === "attachment";
})
function setSelectedIndex(index) {
selectedIndex.value = index;
contextMenu.value.show()
@@ -74,7 +80,7 @@ function savePlaylist() {
}
defineProps({
const props = defineProps({
selectedTab: Number,
online: {},
previousList: Array

12
src/components/Widget/View/Home/History.vue
View File

@@ -3,7 +3,7 @@
<h2>🔄️ Historique personnel</h2>
<p class="info">Voici les derniers titres que tu as écoutés (tout serveur confondu) !</p>
<div v-if="history && history.length" class="history-list">
<VideoComposable v-for="video in history" :key="id" :video="video" />
<VideoComposable v-for="video in history.reverse()" :key="id" :video="video" />
</div>
<p v-else-if="loading" class="none"><Icon icon="fa-spinner" spin-pulse /> Chargement en cours</p>
<p v-else class="none">
@@ -14,10 +14,10 @@
</template>
<script setup>
import { onMounted, ref } from 'vue';
import { IORequest } from '@/utils/IORequest';
import { IORequest } from '@/utils/IORequest';
import VideoComposable from '@/components/Widget/VideoComposable.vue';
import Events from '@/utils/Events';
import { useId } from 'vue'
import { useId, watch } from 'vue'
const id = useId()
@@ -26,19 +26,17 @@ const loading = ref(true);
onMounted(() => {
IORequest('/USER/HISTORY', data => {
history.value = data.reverse();
loading.value = false;
history.value = data;
});
})
Events.on("player:update", () => {
loading.value = true;
IORequest('/USER/HISTORY', data => {
history.value = data.reverse();
loading.value = false;
history.value = data;
});
//FIXME: Error on the history
//FIXME: Remove the possibility to add file to playlist
})
</script>