fauvet/SAE_RIOT_2024
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

modified code

Browse Source
This commit is contained in:
Matthis FAUVET 2024-06-21 14:32:31 +02:00
parent b26d9f1bf8
commit 7e2bb9a22e
3 changed files with 42 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
index.html
View File

@ -4,7 +4,6 @@
<meta charset="utf-8"> <meta charset="utf-8">
<title>Riot App</title> <title>Riot App</title>
<script src="https://cdn.tailwindcss.com"></script> <script src="https://cdn.tailwindcss.com"></script>
<script type="javascript" src="model.js"></script>
</head> </head>
<body class="bg-neutral-50"> <body class="bg-neutral-50">
@ -17,8 +16,17 @@
<script type="javascript" src="./onzer.riot"></script> <script type="javascript" src="./onzer.riot"></script>
<script type="text/javascript"> <script type="text/javascript">
async function fetch_data(){
return fetch("https://dwarves.iut-fbleau.fr/~fauvet/api/albums").then(response => {
return response.json();
} )
}
riot.compile().then(() => { riot.compile().then(() => {
riot.mount('onzer'); riot.mount('onzer', {
items : await fetch_data()
}
);
}) })
</script> </script>

5
model.js
View File

@ -1,5 +0,0 @@
function getSongs(){
return fetch(`https://dwarves.iut-fbleau.fr/~fauvet/api/songs`).then(response => {
return response;
})
}

65
onzer.riot
View File

@ -30,13 +30,12 @@
<script> <script>
export default { export default {
onBeforeMount(props){ onBeforeMount(props){
this.state = { this.state = {
placeholder: "Rechercher dans les albums", placeholder: "Rechercher dans les albums",
search: "albums" search: "albums"
}; };
this.paintButton();
this.paintButton(); this.album_style = "isActivate";
this.album_style = "isActivate";
}, },
onMounted(){ onMounted(){
this.update(); this.update();
@ -46,44 +45,44 @@
}, },
click(e) { click(e) {
e.preventDefault(); e.preventDefault();
this.paintButton(); this.paintButton();
const old_search = this.state.search; const old_search = this.state.search;
switch(e.target.value){ switch(e.target.value){
case "Albums": case "Albums":
this.state.placeholder = "Rechercher dans les albums"; this.state.placeholder = "Rechercher dans les albums";
this.album_style = "isActivate"; this.album_style = "isActivate";
this.state.search = "albums"; this.state.search = "albums";
break; break;
case "Artists": case "Artists":
this.state.placeholder = "Rechercher dans les artists"; this.state.placeholder = "Rechercher dans les artists";
this.artist_style = "isActivate"; this.artist_style = "isActivate";
this.state.search = "artists"; this.state.search = "artists";
break; break;
default: default:
this.placeholder = "Rechercher dans les songs"; this.placeholder = "Rechercher dans les songs";
this.song_style = "isActivate"; this.song_style = "isActivate";
this.state.search = "songs"; this.state.search = "songs";
} }
if(old_search != this.state.search){this.list();} if(old_search != this.state.search){this.list();}
this.update(); this.update();
}, },
async list(){ async list(){
this.state = { this.state = {
placeholder: "Rechercher dans les songs", placeholder: "Rechercher dans les songs",
items: await this.fetchData() items: await this.fetchData()
}; };
this.update(); this.update();
}, },
fetchData(){ fetchData(){
return fetch("https://dwarves.iut-fbleau.fr/~fauvet/api/"+this.state.search+"").then(response => { return fetch("https://dwarves.iut-fbleau.fr/~fauvet/api/"+this.state.search+"").then(response => {
return response.json(); return response.json();
}); });
}, },
paintButton(){ paintButton(){
this.album_style = "isDeactivate"; this.album_style = "isDeactivate";
this.artist_style = "isDeactivate"; this.artist_style = "isDeactivate";
this.song_style = "isDeactivate"; this.song_style = "isDeactivate";
} }
} }
</script> </script>
<style> <style>