lukas/OpenMediaCenter
1
0
Fork 0
Code Issues 8 Pull Requests Actions Packages Projects Releases Wiki Activity

correct redirect to search page, avoid duplicate keys on moviesettingspage

Browse Source
This commit is contained in:
lukas 2021-09-26 22:41:48 +02:00
parent 51ba86d13d
commit be4a7db4a0
2 changed files with 108 additions and 101 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

205
src/pages/HomePage/HomePage.tsx
View File

@ -67,6 +67,17 @@ export class HomePage extends React.Component<Props, state> {
this.fetchStartData(); this.fetchStartData();
} }
render(): JSX.Element {
return (
<Switch>
<Route path='/media/search/:name'>
<SearchHandling />
</Route>
<Route path='/media/'>{this.homepageContent()}</Route>
</Switch>
);
}
/** /**
* fetch available videos for specified tag * fetch available videos for specified tag
* this function clears all preview elements an reloads gravity with tag * this function clears all preview elements an reloads gravity with tag
@ -95,109 +106,105 @@ export class HomePage extends React.Component<Props, state> {
}); });
} }
render(): JSX.Element { /**
* main content of homepage
*/
homepageContent(): JSX.Element {
return ( return (
<> <>
<Switch> <PageTitle title='Home Page' subtitle={this.state.subtitle + ' - ' + this.state.selectionnr}>
<Route path='/search/:name'> <form
<SearchHandling /> className={'form-inline ' + style.searchform}
</Route> onSubmit={(e): void => {
<Route path='/'> e.preventDefault();
<PageTitle title='Home Page' subtitle={this.state.subtitle + ' - ' + this.state.selectionnr}> this.props.history.push('/media/search/' + this.keyword);
<form }}>
className={'form-inline ' + style.searchform} <input
onSubmit={(e): void => { data-testid='searchtextfield'
e.preventDefault(); className='form-control mr-sm-2'
this.props.history.push('/search/' + this.keyword); type='text'
}}> placeholder='Search'
<input onChange={(e): void => {
data-testid='searchtextfield' this.keyword = e.target.value;
className='form-control mr-sm-2' }}
type='text' />
placeholder='Search' <button data-testid='searchbtnsubmit' className='btn btn-success' type='submit'>
onChange={(e): void => { Search
this.keyword = e.target.value; </button>
}} </form>
/> </PageTitle>
<button data-testid='searchbtnsubmit' className='btn btn-success' type='submit'> <SideBar>
Search <SideBarTitle>Infos:</SideBarTitle>
</button> <Line />
</form> <SideBarItem>
</PageTitle> <b>{this.state.sideinfo.VideoNr}</b> Videos Total!
<SideBar> </SideBarItem>
<SideBarTitle>Infos:</SideBarTitle> <SideBarItem>
<Line /> <b>{this.state.sideinfo.FullHdNr}</b> FULL-HD Videos!
<SideBarItem> </SideBarItem>
<b>{this.state.sideinfo.VideoNr}</b> Videos Total! <SideBarItem>
</SideBarItem> <b>{this.state.sideinfo.HDNr}</b> HD Videos!
<SideBarItem> </SideBarItem>
<b>{this.state.sideinfo.FullHdNr}</b> FULL-HD Videos! <SideBarItem>
</SideBarItem> <b>{this.state.sideinfo.SDNr}</b> SD Videos!
<SideBarItem> </SideBarItem>
<b>{this.state.sideinfo.HDNr}</b> HD Videos! <SideBarItem>
</SideBarItem> <b>{this.state.sideinfo.DifferentTags}</b> different Tags!
<SideBarItem> </SideBarItem>
<b>{this.state.sideinfo.SDNr}</b> SD Videos! <Line />
</SideBarItem> <SideBarTitle>Default Tags:</SideBarTitle>
<SideBarItem> <Tag
<b>{this.state.sideinfo.DifferentTags}</b> different Tags! tagInfo={{TagName: 'All', TagId: DefaultTags.all.TagId}}
</SideBarItem> onclick={(): void => {
<Line /> this.tagState = DefaultTags.all;
<SideBarTitle>Default Tags:</SideBarTitle> this.fetchVideoData();
<Tag this.setState({subtitle: 'All Videos'});
tagInfo={{TagName: 'All', TagId: DefaultTags.all.TagId}} }}
onclick={(): void => { />
this.tagState = DefaultTags.all; <Tag
this.fetchVideoData(); tagInfo={{TagName: 'Full Hd', TagId: DefaultTags.fullhd.TagId}}
this.setState({subtitle: 'All Videos'}); onclick={(): void => {
}} this.tagState = DefaultTags.fullhd;
/> this.fetchVideoData();
<Tag this.setState({subtitle: 'Full Hd Videos'});
tagInfo={{TagName: 'Full Hd', TagId: DefaultTags.fullhd.TagId}} }}
onclick={(): void => { />
this.tagState = DefaultTags.fullhd; <Tag
this.fetchVideoData(); tagInfo={{TagName: 'Low Quality', TagId: DefaultTags.lowq.TagId}}
this.setState({subtitle: 'Full Hd Videos'}); onclick={(): void => {
}} this.tagState = DefaultTags.lowq;
/> this.fetchVideoData();
<Tag this.setState({subtitle: 'Low Quality Videos'});
tagInfo={{TagName: 'Low Quality', TagId: DefaultTags.lowq.TagId}} }}
onclick={(): void => { />
this.tagState = DefaultTags.lowq; <Tag
this.fetchVideoData(); tagInfo={{TagName: 'HD', TagId: DefaultTags.hd.TagId}}
this.setState({subtitle: 'Low Quality Videos'}); onclick={(): void => {
}} this.tagState = DefaultTags.hd;
/> this.fetchVideoData();
<Tag this.setState({subtitle: 'HD Videos'});
tagInfo={{TagName: 'HD', TagId: DefaultTags.hd.TagId}} }}
onclick={(): void => { />
this.tagState = DefaultTags.hd; </SideBar>
this.fetchVideoData(); <div>
this.setState({subtitle: 'HD Videos'}); <span className={style.sortbyLabel}>Sort By: </span>
}} <div className={style.dropdown}>
/> <span className={style.dropbtn}>
</SideBar> <span>{this.state.sortby}</span>
<div> <FontAwesomeIcon style={{marginLeft: 3, paddingBottom: 3}} icon={faSortDown} size='1x' />
<span className={style.sortbyLabel}>Sort By: </span> </span>
<div className={style.dropdown}> <div className={style.dropdownContent}>
<span className={style.dropbtn}> <span onClick={(): void => this.onDropDownItemClick(SortBy.date, 'Date Added')}>Date Added</span>
<span>{this.state.sortby}</span> <span onClick={(): void => this.onDropDownItemClick(SortBy.likes, 'Most likes')}>Most likes</span>
<FontAwesomeIcon style={{marginLeft: 3, paddingBottom: 3}} icon={faSortDown} size='1x' /> <span onClick={(): void => this.onDropDownItemClick(SortBy.random, 'Random')}>Random</span>
</span> <span onClick={(): void => this.onDropDownItemClick(SortBy.name, 'Name')}>Name</span>
<div className={style.dropdownContent}> <span onClick={(): void => this.onDropDownItemClick(SortBy.length, 'Length')}>Length</span>
<span onClick={(): void => this.onDropDownItemClick(SortBy.date, 'Date Added')}>Date Added</span>
<span onClick={(): void => this.onDropDownItemClick(SortBy.likes, 'Most likes')}>Most likes</span>
<span onClick={(): void => this.onDropDownItemClick(SortBy.random, 'Random')}>Random</span>
<span onClick={(): void => this.onDropDownItemClick(SortBy.name, 'Name')}>Name</span>
<span onClick={(): void => this.onDropDownItemClick(SortBy.length, 'Length')}>Length</span>
</div>
</div>
</div> </div>
</div>
</div>
<VideoContainer data={this.state.data} /> <VideoContainer data={this.state.data} />
<div className={style.rightinfo} /> <div className={style.rightinfo} />
</Route>
</Switch>
</> </>
); );
} }

4
src/pages/SettingsPage/MovieSettings.tsx
View File

@ -117,8 +117,8 @@ class MovieSettings extends React.Component<Props, state> {
TVShow Reindex TVShow Reindex
</button> </button>
<div className={style.indextextarea}> <div className={style.indextextarea}>
{this.state.text.map((m) => ( {this.state.text.map((m, i) => (
<div key={m} className='textarea-element'> <div key={i} className='textarea-element'>
{m} {m}
</div> </div>
))} ))}