You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
127 lines
4.1 KiB
127 lines
4.1 KiB
<!DOCTYPE html>
|
|
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<title>My awesome team</title>
|
|
|
|
<link rel="icon" href="/favicon.ico">
|
|
<link rel="stylesheet" href="/css/style.css" />
|
|
</head>
|
|
|
|
<body>
|
|
<div id="app">
|
|
|
|
<div id="FIRST">
|
|
<navbar></navbar>
|
|
</div>
|
|
|
|
<div id="SECOND" style="overflow-y: scroll; height:100%;">
|
|
|
|
<div id="HOME" style="display: none">
|
|
|
|
<div id="newsList"></div>
|
|
|
|
<!-- <newscard v-for="news in this.allNews"
|
|
:title="news.title"
|
|
:publishedAt="news.publishedAt">
|
|
</newscard> -->
|
|
|
|
</div>
|
|
|
|
<div id="TEAM" style="display: none">
|
|
|
|
<div class="team">
|
|
<team @add-team="addTeam"></team>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="RESULTS" style="display: none">
|
|
<team-fight ref="addTeam"></team-fight>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
<script src="./src/misc/constant.js"></script>
|
|
<script src="./src/error/required_field_error.js"></script>
|
|
<script src="./src/error/string_size.js"></script>
|
|
<script src="./src/error/connection_error.js"></script>
|
|
<script src="./src/service/api_service.js"></script>
|
|
<script src="./src/service/news-service.js"></script>
|
|
<script>
|
|
function showHome(){
|
|
document.getElementById("TEAM").style.display="none";
|
|
document.getElementById("RESULTS").style.display="none";
|
|
document.getElementById("HOME").style.display="block";
|
|
}
|
|
function showTeam(){
|
|
document.getElementById("TEAM").style.display="block";
|
|
document.getElementById("RESULTS").style.display="none";
|
|
document.getElementById("HOME").style.display="none";
|
|
}
|
|
function showResults(){
|
|
document.getElementById("TEAM").style.display="none";
|
|
document.getElementById("RESULTS").style.display="block";
|
|
document.getElementById("HOME").style.display="none";
|
|
}
|
|
const newsService = new NewsService();
|
|
newsService.getNews().then(news => {
|
|
news.forEach(n => {
|
|
const newsArticle = document.createElement('article');
|
|
const span = document.createElement('span');
|
|
const p = document.createElement('p');
|
|
span.innerText = n.title;
|
|
p.innerText = new Date(n.publishedAt).toLocaleString('fr-FR',{day: '2-digit',month: '2-digit',year: 'numeric',hour: '2-digit',minute: '2-digit',hour12: false});
|
|
newsArticle.appendChild(span);
|
|
newsArticle.appendChild(p);
|
|
newsArticle.setAttribute("class","card");
|
|
document.querySelector('#newsList').appendChild(newsArticle);
|
|
});
|
|
})
|
|
.catch(error => {
|
|
console.error(error);
|
|
});
|
|
</script>
|
|
|
|
<script type="module">
|
|
|
|
import { createApp } from 'https://unpkg.com/vue@3/dist/vue.esm-browser.js';
|
|
|
|
import Team from './src/view/team.js';
|
|
import Navbar from '/src/view/navbar.js';
|
|
import TeamAdd from '/src/view/team-add.js';
|
|
import Teamcard from '/src/view/teamcard.js';
|
|
import Newscard from '/src/view/newscard.js';
|
|
import TeamFight from '/src/view/team-fight.js';
|
|
|
|
const app = createApp({
|
|
data() {
|
|
return {
|
|
allTeam: [],
|
|
allNews: new NewsService().getNews()
|
|
}
|
|
},
|
|
methods:{
|
|
addTeam: function(team){
|
|
this.allTeam.push(team);
|
|
this.$refs.addTeam.getTeam(team);
|
|
}
|
|
}
|
|
})
|
|
app.component('Navbar', Navbar)
|
|
.component('TeamAdd', TeamAdd)
|
|
.component('Teamcard',Teamcard)
|
|
.component('TeamFight',TeamFight)
|
|
.component('Newscard',Newscard)
|
|
.component('Team', Team);
|
|
|
|
app.mount('#app');
|
|
</script>
|
|
</body>
|
|
|
|
</html>
|
|
|