ODWRTW/canape
2
2
Fork 0
Code Issues 3 Pull Requests 1 Releases Activity

More control on the poster component update

Browse Source
This commit is contained in:
Grégoire Delattre 2017-06-02 22:26:01 +02:00
parent 643bd3aa9a
commit e2445bc287
2 changed files with 15 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/public/js/components/list/poster.js
View File

@ -1,9 +1,15 @@
import React from "react"
export default class ListPoster extends React.PureComponent {
export default class Poster extends React.Component {
constructor(props) {
super(props);
}
shouldComponentUpdate(nextProps) {
if (nextProps.index !== this.props.index) { return true }
if (nextProps.selected !== this.props.selected) { return true }
if (nextProps.data.get("poster_url") !== this.props.data.get("poster_url")) { return true }
return false;
}
render() {
const selected = this.props.selected ? " thumbnail-selected" : "";
const imgClass = "thumbnail" + selected;

16
src/public/js/components/list/posters.js
View File

@ -5,7 +5,7 @@ import InfiniteScroll from "react-infinite-scroller";
import ListFilter from "./filter"
import ExplorerOptions from "./explorerOptions"
import ListPoster from "./poster"
import Poster from "./poster"
import Loader from "../loader/loader"
@ -58,12 +58,12 @@ export default class ListPosters extends React.PureComponent {
const listSize = elmts !== undefined ? elmts.size : 0;
const colSize = (listSize !== 0) ? "col-xs-5 col-md-8" : "col-xs-12";
// Filter the list of elements
if (this.props.filter !== "") {
elmts = elmts.filter((v) => fuzzy.test(this.props.filter, v.get("title")), this);
} else {
elmts = elmts.slice(0, this.state.items);
}
// Filter the list of elements
if (this.props.filter !== "") {
elmts = elmts.filter((v) => fuzzy.test(this.props.filter, v.get("title")), this);
} else {
elmts = elmts.slice(0, this.state.items);
}
// Chose when to display filter / explore options
let displayFilter = true;
@ -132,7 +132,7 @@ class Posters extends React.PureComponent {
const imdbId = movie.get("imdb_id");
const selected = (imdbId === this.props.selectedImdbId) ? true : false;
return (
<ListPoster
<Poster
index={index}
data={movie}
key={imdbId}