correct load of categorypage on tag click

improved failing tests
This commit is contained in:
2020-06-24 21:47:22 +02:00
parent e640b36ce4
commit 753ea99693
8 changed files with 64 additions and 116 deletions

View File

@ -5,13 +5,12 @@ import Tag from "../../elements/Tag/Tag";
import {TagPreview} from "../../elements/Preview/Preview";
import NewTagPopup from "../../elements/NewTagPopup/NewTagPopup";
import PageTitle from "../../elements/PageTitle/PageTitle";
import VideoContainer from "../../elements/VideoContainer/VideoContainer";
class CategoryPage extends React.Component {
constructor(props, context) {
super(props, context);
this.props = props;
this.state = {
loadedtags: [],
selected: null
@ -19,7 +18,12 @@ class CategoryPage extends React.Component {
}
componentDidMount() {
this.loadTags();
// check if predefined category is set
if (this.props.category) {
this.fetchVideoData(this.props.category);
} else {
this.loadTags();
}
}
render() {
@ -31,10 +35,10 @@ class CategoryPage extends React.Component {
<SideBar>
<div className='sidebartitle'>Default Tags:</div>
<Tag viewbinding={this.props.viewbinding} contentbinding={this.setPage}>All</Tag>
<Tag viewbinding={this.props.viewbinding} contentbinding={this.setPage}>FullHd</Tag>
<Tag viewbinding={this.props.viewbinding} contentbinding={this.setPage}>LowQuality</Tag>
<Tag viewbinding={this.props.viewbinding} contentbinding={this.setPage}>HD</Tag>
<Tag viewbinding={this.props.viewbinding} contentbinding={this.loadTag}>All</Tag>
<Tag viewbinding={this.props.viewbinding} contentbinding={this.loadTag}>FullHd</Tag>
<Tag viewbinding={this.props.viewbinding} contentbinding={this.loadTag}>LowQuality</Tag>
<Tag viewbinding={this.props.viewbinding} contentbinding={this.loadTag}>HD</Tag>
<hr/>
<button data-testid='btnaddtag' className='btn btn-success' onClick={() => {
this.setState({popupvisible: true})
@ -51,12 +55,12 @@ class CategoryPage extends React.Component {
name={m.tag_name}
tag_id={m.tag_id}
viewbinding={this.props.viewbinding}
categorybinding={this.setPage}/>
categorybinding={this.loadTag}/>
)) :
"loading"}
</div>) :
<>
{this.selectionelements}
{this.selectionelements ? this.selectionelements : null}
<button data-testid='backbtn' className="btn btn-success"
onClick={this.loadCategoryPageDefault}>Back
</button>
@ -76,12 +80,35 @@ class CategoryPage extends React.Component {
);
}
setPage = (element, tagname) => {
this.selectionelements = element;
this.setState({selected: null}); // todo save this change trigger better
this.setState({selected: tagname});
loadTag = (tagname) => {
// this.selectionelements = element;
// this.setState({selected: null}); // todo save this change trigger better
this.fetchVideoData(tagname);
};
fetchVideoData(tag) {
console.log(tag);
const updateRequest = new FormData();
updateRequest.append('action', 'getMovies');
updateRequest.append('tag', tag);
console.log("fetching data");
// fetch all videos available
fetch('/api/videoload.php', {method: 'POST', body: updateRequest})
.then((response) => response.json()
.then((result) => {
this.selectionelements =
<VideoContainer
data={result}
viewbinding={this.props.viewbinding}/>;
this.setState({selected: tag});
}))
.catch(() => {
console.log("no connection to backend");
});
}
loadCategoryPageDefault = () => {
this.setState({selected: null});
};