cinema/filters.riot

<filters>
    <div class="buttons-filters">
		<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>

    <ul class="filters">
        <li>
            <button onclick={toPreviousPage}><</button>
                {this.props.currentPageNum}/{this.props.maxPageNum}
            <button onclick={toNextPage}>></button>
        </li>
    </ul>

    <script>
        export default {
            onBeforeMount (props,state) {
                console.log(localStorage.getItem('currfilter'));
                console.log(props.getMovieList());
		    },

            setFilter(e) {
                localStorage.setItem('currfilter', e.target.id);
                this.props.updateMovieList();
            },

            toPreviousPage() {
                if (this.props.currentPageNum > 1) {
                    localStorage.setItem('curr_page', this.props.currentPageNum-1);
                    this.props.updateMovieList();
                }

                else {
                    localStorage.setItem('curr_page', this.props.maxPageNum);
                    this.props.updateMovieList();
                }
            },

            toNextPage() {
                if (this.props.currentPageNum < this.props.maxPageNum) {
                    localStorage.setItem('curr_page', this.props.currentPageNum+1);
                    this.props.updateMovieList();
                }

                else {
                    localStorage.setItem('curr_page', 1);
                    this.props.updateMovieList();
                }
            },
        }
    </script>
</filters>