show video previews on tag click

This commit is contained in:
lukas 2020-06-07 22:17:55 +02:00
parent 836f5f342a
commit ed0df26a79
3 changed files with 24 additions and 10 deletions

View File

@ -63,7 +63,7 @@ class Preview extends React.Component {
}
export class TagPreview extends React.Component {
constructor(props: P, context: any) {
constructor(props, context) {
super(props, context);
this.props = props;
@ -82,7 +82,7 @@ export class TagPreview extends React.Component {
.then((response) => response.json()
.then((result) => {
console.log(result);
this.props.viewbinding.showVideo(
this.props.categorybinding(
<VideoContainer
data={result}
viewbinding={this.props.viewbinding}/>

View File

@ -2,7 +2,7 @@ import React from "react";
import Preview from "./Preview";
class VideoContainer extends React.Component {
constructor(props: P, context: any) {
constructor(props, context) {
super(props, context);
this.data = props.data;
@ -12,6 +12,7 @@ class VideoContainer extends React.Component {
selectionnr: null
};
}
// stores current index of loaded elements
loadindex = 0;
@ -31,6 +32,9 @@ class VideoContainer extends React.Component {
movie_id={elem.movie_id}
viewbinding={this.props.viewbinding}/>
))}
{/*todo css for no items to show*/}
{this.state.loadeditems.length === 0 ?
"no items to show!" : null}
</div>
);
}

View File

@ -6,13 +6,14 @@ import "../css/CategoryPage.css"
import {TagPreview} from "../elements/Preview";
class CategoryPage extends React.Component {
constructor(props: P, context: any) {
constructor(props, context) {
super(props, context);
this.props = props;
this.state = {
loadedtags: []
loadedtags: [],
selected: false
};
}
@ -39,14 +40,17 @@ class CategoryPage extends React.Component {
<button className='btn btn-success'>Add a new Tag!</button>
</SideBar>
<div id='categorycontent'>
{this.state.loadedtags ?
{!this.state.selected ?
(this.state.loadedtags ?
this.state.loadedtags.map((m) => (
<TagPreview
name={m.tag_name}
tag_id={m.tag_id}
viewbinding={this.props.viewbinding}/>
viewbinding={this.props.viewbinding}
categorybinding={this.setPage}/>
)) :
"loading"
"loading") :
this.selectionelements
}
</div>
@ -54,6 +58,12 @@ class CategoryPage extends React.Component {
);
}
setPage = (element) => {
this.selectionelements = element;
this.setState({selected: true});
};
/**
* load all available tags from db.
*/