initial
This commit is contained in:
commit
48e3c3d4e0
62
.gitignore
vendored
Normal file
62
.gitignore
vendored
Normal file
@ -0,0 +1,62 @@
|
||||
# --------------------
|
||||
# OSX Files
|
||||
# --------------------
|
||||
.DS_Store
|
||||
.AppleDouble
|
||||
.LSOverride
|
||||
Icon
|
||||
._*
|
||||
.Spotlight-V100
|
||||
.Trashes
|
||||
|
||||
# --------------------
|
||||
# Windows Files
|
||||
# --------------------
|
||||
Thumbs.db
|
||||
ehthumbs.db
|
||||
Desktop.ini
|
||||
$RECYCLE.BIN/
|
||||
*.cab
|
||||
*.msi
|
||||
*.msm
|
||||
*.msp
|
||||
*.lnk
|
||||
|
||||
# --------------------
|
||||
# Sublime Text Files
|
||||
# --------------------
|
||||
*.sublime-project
|
||||
*.sublime-workspace
|
||||
|
||||
# --------------------
|
||||
# IntelliJ Files
|
||||
# --------------------
|
||||
*.iml
|
||||
*.ipr
|
||||
*.iws
|
||||
.idea/
|
||||
out/
|
||||
|
||||
# --------------------
|
||||
# Eclipse Files
|
||||
# --------------------
|
||||
.project
|
||||
.metadata
|
||||
*.bak
|
||||
.classpath
|
||||
.settings/
|
||||
|
||||
# --------------------
|
||||
# App Files
|
||||
# --------------------
|
||||
node_modules
|
||||
npm-debug.log
|
||||
.nyc_output
|
||||
coverage
|
||||
generated
|
||||
|
||||
# these files are generated anyway
|
||||
.nycrc
|
||||
index.js
|
||||
!.gitmodules
|
||||
!.travis.yml
|
21
LICENSE
Normal file
21
LICENSE
Normal file
@ -0,0 +1,21 @@
|
||||
MIT License
|
||||
|
||||
Copyright (c) 2020 Riot.js
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
53
app.riot
Normal file
53
app.riot
Normal file
@ -0,0 +1,53 @@
|
||||
<app>
|
||||
<filters></filters>
|
||||
<movie-container movieList="{state.currentMovieList.results}"></movie-container>
|
||||
<script>
|
||||
|
||||
export default {
|
||||
onBeforeMount(props, state) {
|
||||
this.state = {
|
||||
currentMovieList: [],
|
||||
}
|
||||
},
|
||||
|
||||
onMounted() {
|
||||
this.updateMovieList();
|
||||
console.log("helo")
|
||||
console.log(this.state.currentMovieList.results)
|
||||
},
|
||||
|
||||
async updateMovieList() {
|
||||
console.log("updating")
|
||||
switch(localStorage.getItem("currfilter")) {
|
||||
case "popular":
|
||||
console.log("loading popular")
|
||||
this.update ({
|
||||
currentMovieList : await movieUtils.getPopularMovies()
|
||||
})
|
||||
break
|
||||
|
||||
case "top_rated":
|
||||
console.log("loading top_rated")
|
||||
this.update ({
|
||||
currentMovieList : await movieUtils.getTopRatedMovies()
|
||||
})
|
||||
break
|
||||
|
||||
case "coming_soon":
|
||||
console.log("loading coming_soon")
|
||||
this.update ({
|
||||
currentMovieList : await movieUtils.getComingSoonMovies()
|
||||
})
|
||||
break
|
||||
|
||||
case "new":
|
||||
console.log("loading new")
|
||||
this.update ({
|
||||
currentMovieList : await movieUtils.getNewMovies()
|
||||
})
|
||||
break
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
</app>
|
22
filters.riot
Normal file
22
filters.riot
Normal file
@ -0,0 +1,22 @@
|
||||
<filters>
|
||||
<div class="buttons">
|
||||
<button onclick={setFilter} class="w3-button w3-blue w3-round" id="popular">Populaires</button>
|
||||
<button onclick={setFilter} class="w3-button w3-blue w3-round" id="top_rated">Mieux notés</button>
|
||||
<button onclick={setFilter} class="w3-button w3-blue w3-round" id="coming_soon">À venir</button>
|
||||
<button onclick={setFilter} class="w3-button w3-blue w3-round" id="new">À l'affiche</button>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
onBeforeMount (props,state) {
|
||||
console.log(localStorage.getItem('currfilter'));
|
||||
},
|
||||
|
||||
setFilter(e) {
|
||||
localStorage.setItem('currfilter', e.target.id);
|
||||
console.log("set")
|
||||
this.update()
|
||||
},
|
||||
}
|
||||
</script>
|
||||
</filters>
|
38
index.html
Normal file
38
index.html
Normal file
@ -0,0 +1,38 @@
|
||||
<!doctype html>
|
||||
|
||||
<html>
|
||||
<head>
|
||||
<title>Riot todo</title>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<script src="app.riot" type="riot"></script>
|
||||
<script src="filters.riot" type="riot"></script>
|
||||
<script src="movie.riot" type="riot"></script>
|
||||
<script src="movie-container.riot" type="riot"></script>
|
||||
<link rel="stylesheet" href="movie.css">
|
||||
<script src="movie.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/riot@6.1.2/riot+compiler.min.js"></script>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
|
||||
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<app></app>
|
||||
|
||||
<script>
|
||||
|
||||
/* Compile and Mount riot tag */
|
||||
(async () => {
|
||||
await riot.compile()
|
||||
movieUtils = getMovieUtils()
|
||||
|
||||
riot.install(function(component){
|
||||
component.movieUtils = movieUtils
|
||||
})
|
||||
|
||||
riot.mount('app')
|
||||
|
||||
})()
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
15
movie-container.riot
Normal file
15
movie-container.riot
Normal file
@ -0,0 +1,15 @@
|
||||
<movie-container>
|
||||
|
||||
<div class="movie-container">
|
||||
<movie each={ movie in props.movieList } class="movie-block" movie={movie}></movie>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
onBeforeMount (props,state) {
|
||||
},
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
</movie-container>
|
20
movie.css
Normal file
20
movie.css
Normal file
@ -0,0 +1,20 @@
|
||||
.movie-container {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.movie-block {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin: 1%;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.buttons {
|
||||
margin: 10px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-around;
|
||||
}
|
44
movie.js
Normal file
44
movie.js
Normal file
@ -0,0 +1,44 @@
|
||||
function getMovieUtils() {
|
||||
let currentMovieList;
|
||||
let currentFilter = 1337;
|
||||
let url = "https://api.themoviedb.org/3/";
|
||||
let api_key = "6c6af57a7dd83a4c720a50bb8f21853c";
|
||||
|
||||
let utils = {
|
||||
getTopRatedMovies,
|
||||
getPopularMovies,
|
||||
getComingSoonMovies,
|
||||
getNewMovies,
|
||||
getCurrentFilter
|
||||
};
|
||||
|
||||
function getTopRatedMovies(page_index) {
|
||||
return fetch(url + "movie/top_rated?api_key=" + api_key + "&page=" + page_index)
|
||||
.then(response => response.json())
|
||||
.then(data => data);
|
||||
}
|
||||
|
||||
function getPopularMovies(page_index) {
|
||||
return fetch(url + "movie/popular?api_key=" + api_key + "&page=" + page_index)
|
||||
.then(response => response.json())
|
||||
.then(data => data);
|
||||
}
|
||||
|
||||
function getComingSoonMovies(page_index) {
|
||||
return fetch(url + "movie/upcoming?api_key=" + api_key + "&page=" + page_index)
|
||||
.then(response => response.json())
|
||||
.then(data => data);
|
||||
}
|
||||
|
||||
function getNewMovies(page_index) {
|
||||
return fetch(url + "movie/now_playing?api_key=" + api_key + "&page=" + page_index)
|
||||
.then(response => response.json())
|
||||
.then(data => data);
|
||||
}
|
||||
|
||||
function getCurrentFilter() {
|
||||
return localStorage.getItem("currfilter");
|
||||
}
|
||||
|
||||
return utils;
|
||||
}
|
30
movie.riot
Normal file
30
movie.riot
Normal file
@ -0,0 +1,30 @@
|
||||
<movie>
|
||||
<a href="TODO">{props.movie.title}</a>
|
||||
<img src='https://image.tmdb.org/t/p/w300{props.movie.poster_path}'></img>
|
||||
<label>{props.movie.vote_average}/10</label>
|
||||
<label>{props.movie.vote_count} votes</label>
|
||||
<li each={ genre in props.movie.genres_id }>{genre}</li>
|
||||
|
||||
<script>
|
||||
|
||||
export default {
|
||||
onBeforeMount(props, state) {
|
||||
console.log(props)
|
||||
},
|
||||
|
||||
edit(e) {
|
||||
// update only the text state
|
||||
this.update({
|
||||
items : [{results: getPopularMovies()}]
|
||||
//getTopRatedMovies().then(data => items : data);
|
||||
})
|
||||
},
|
||||
|
||||
test(item) {
|
||||
items : [{results: getPopularMovies()}]
|
||||
console.log(item)
|
||||
this.update();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</movie>
|
6849
package-lock.json
generated
Normal file
6849
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
1
package.json
Normal file
1
package.json
Normal file
@ -0,0 +1 @@
|
||||
{"dependencies":{"riot":"^6.1.2"},"name":"cinema","version":"1.0.0","main":"index.js","devDependencies":{"@riotjs/cli":"^6.0.5","@riotjs/compiler":"^6.0.1","chai":"^4.3.4","esm":"^3.2.25","jsdom":"^16.6.0","jsdom-global":"^3.0.2","mocha":"^8.4.0","nyc":"^15.1.0","riot":"^6.0.2"},"scripts":{"test":"npm run build && nyc --require esm --require jsdom-global/register mocha test.js","cov":"nyc report --reporter=text-lcov","cov-html":"nyc report --reporter=html","build":"riot -c riot.config my-component.riot","prepublishOnly":"npm test"},"author":"Adil HAMMERSCHMIDT","license":"ISC","description":""}
|
Loading…
Reference in New Issue
Block a user