cinema/app.riot

<app>
    <filters currentPageNum="{state.currentMovieList.page}" maxPageNum="{state.currentMovieList.total_pages}"
            getMovieList="{getMovieList}" updateMovieList="{updateMovieList}"></filters>
    <movie-container getGenres="{movieUtils.getGenres()}" movieList="{state.currentMovieList.results}"></movie-container>
    <script>

    export default {
        onBeforeMount(props, state) {
            this.state = {
                currentMovieList: [],
            }
            this.initGenres();
        },

        onMounted() {
            this.updateMovieList();
        },

        async updateMovieList() {
            currentPage = localStorage.getItem("curr_page");
            localStorage.setItem('curr_page', 1);
            switch(localStorage.getItem("currfilter")) {
                case "popular":
                    console.log("loading popular")
                    this.update ({
                    currentMovieList : await movieUtils.getPopularMovies(currentPage)
                    })
                    break

                case "top_rated":
                    console.log("loading top_rated")
                    this.update ({
                    currentMovieList : await movieUtils.getTopRatedMovies(currentPage)
                    })
                    break

                case "coming_soon":
                    console.log("loading coming_soon")
                    this.update ({
                    currentMovieList : await movieUtils.getComingSoonMovies(currentPage)
                    })
                    break

                case "new":
                    console.log("loading new")
                    this.update ({
                    currentMovieList : await movieUtils.getNewMovies(currentPage)
                    })
                    break
                    
                default:
                    console.log("loading new")
                    this.update ({
                    currentMovieList : await movieUtils.getNewMovies(currentPage)
                    })
                    break
            }
        },

        getMovieList() {
            this.updateMovieList();
            return this.currentMovieList;
        },

        async initGenres() {
            let genres = [];
            console.log("genres")
            genres = await movieUtils.getGenres().then(data => localStorage.setItem("genres", JSON.stringify(data)));
        }
    }
</script>
</app>