bachir/ouatterrir-app
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

some fixes on paysage sonore #2146

Browse Source
This commit is contained in:
Bachir Soussi Chiadmi 2023-07-12 13:18:37 +02:00
parent 109705d11a
commit 9e523af2ff
3 changed files with 23 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/assets/main.scss
View File

@ -405,8 +405,8 @@ body{
}
&.recit-opened section.concernement {
padding-bottom: 4rem;
&.recit-opened {
padding-bottom: 3rem;
}
}

30
src/components/RecitPlayer.vue
View File

@ -14,24 +14,30 @@ export default {
}
},
computed: {
...mapState(ConcernementsStore,['opened_recit', 'recit_player']),
...mapState(ConcernementsStore,['opened_recit', 'recit_plyr_player']),
// ...mapState(CommonStore,['hover_elmt'])
},
mounted() {
console.log('RecitPlayer mounted', this.$refs);
this.setRecitPlayer(this.$refs.plyr_player.player)
this.setRecitPlayer(this.$refs.plyr_player.player);
this.recit_plyr_player.on('ended', ()=>{
this.setOpenedRecit(null);
})
this.recit_plyr_player.play();
},
watch: {
opened_recit: {
handler (n,o){
console.log('recitPlayer watch opened_recit o, n', o, n);
let fadeInterval = setInterval(()=>{
if (this.recit_player.volume > 0) {
// console.log(`fading volume:${this.recit_player.volume}`);
this.recit_player.volume -= 0.8;
if (this.recit_plyr_player.volume > 0) {
// console.log(`fading volume:${this.recit_plyr_player.volume}`);
this.recit_plyr_player.volume -= 0.8;
}else{
// console.log(`switching source`);
this.recit_player.source = {
this.recit_plyr_player.source = {
type: 'audio',
sources: [
{
@ -40,8 +46,8 @@ export default {
}
]
}
this.recit_player.volume = 1;
this.recit_player.play();
this.recit_plyr_player.volume = 1;
this.recit_plyr_player.play();
clearInterval(fadeInterval);
}
}, 1);
@ -51,11 +57,7 @@ export default {
}
},
methods: {
...mapActions(ConcernementsStore, ['setRecitPlayer']),
// setPlayer(player){
// console.log('setPlayer', player);
// this.setRecitPlayer(player);
// }
...mapActions(ConcernementsStore, ['setOpenedRecit', 'setRecitPlayer'])
},
}
@ -66,7 +68,7 @@ export default {
<aside
id="recit-player">
<vue-plyr ref="plyr_player" :options="plyr_options">
<audio playsinline autoplay>
<audio playsinline>
<source :src="opened_recit.file.url" :type="opened_recit.file.filemime" />
</audio>
</vue-plyr>

7
src/stores/concernements.js
View File

@ -24,7 +24,7 @@ export const ConcernementsStore = defineStore({
opened_concernement: false,
opened_entite_id: null,
opened_recit: false,
recit_player: null,
recit_plyr_player: null,
ct_concernement: {},
ct_entite: {},
ct_cercle_politique: {},
@ -287,9 +287,12 @@ export const ConcernementsStore = defineStore({
field_index: index
};
},
setOpenedRecit (recit) {
this.opened_recit = recit;
},
setRecitPlayer (player) {
console.log('concernement store setRecitPlayer', player);
this.recit_player = player;
this.recit_plyr_player = player;
}
}
})