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

reformattings

Browse Source 
no redirect on tagclick on homepage
no multiple add of same tag possible
This commit is contained in:
Lukas Heiligenbrunner
2020-10-25 18:48:23 +00:00
parent 812c45cb13
commit 777cc2a712
43 changed files with 493 additions and 448 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
src/pages/SettingsPage/GeneralSettings.js
View File

@ -1,10 +1,10 @@
import React from "react";
import {Button, Col, Form} from "react-bootstrap";
import style from "./GeneralSettings.module.css"
import GlobalInfos from "../../GlobalInfos";
import InfoHeaderItem from "../../elements/InfoHeaderItem/InfoHeaderItem";
import {faArchive, faBalanceScaleLeft, faRulerVertical} from "@fortawesome/free-solid-svg-icons";
import {faAddressCard} from "@fortawesome/free-regular-svg-icons";
import React from 'react';
import {Button, Col, Form} from 'react-bootstrap';
import style from './GeneralSettings.module.css';
import GlobalInfos from '../../GlobalInfos';
import InfoHeaderItem from '../../elements/InfoHeaderItem/InfoHeaderItem';
import {faArchive, faBalanceScaleLeft, faRulerVertical} from '@fortawesome/free-solid-svg-icons';
import {faAddressCard} from '@fortawesome/free-regular-svg-icons';
/**
* Component for Generalsettings tag on Settingspage
@ -18,10 +18,10 @@ class GeneralSettings extends React.Component {
passwordsupport: false,
tmdbsupport: null,
videopath: "",
tvshowpath: "",
mediacentername: "",
password: "",
videopath: '',
tvshowpath: '',
mediacentername: '',
password: '',
videonr: null,
dbsize: null,
@ -44,7 +44,7 @@ class GeneralSettings extends React.Component {
subtext='Videos in Gravity'
icon={faArchive}/>
<InfoHeaderItem backColor='yellow'
text={this.state.dbsize !== undefined ? this.state.dbsize + " MB" : undefined}
text={this.state.dbsize !== undefined ? this.state.dbsize + ' MB' : undefined}
subtext='Database size'
icon={faRulerVertical}/>
<InfoHeaderItem backColor='green'
@ -83,7 +83,7 @@ class GeneralSettings extends React.Component {
label='Enable Password support'
checked={this.state.passwordsupport}
onChange={() => {
this.setState({passwordsupport: !this.state.passwordsupport})
this.setState({passwordsupport: !this.state.passwordsupport});
}}
/>
@ -102,7 +102,7 @@ class GeneralSettings extends React.Component {
label='Enable TMDB video grabbing support'
checked={this.state.tmdbsupport}
onChange={() => {
this.setState({tmdbsupport: !this.state.tmdbsupport})
this.setState({tmdbsupport: !this.state.tmdbsupport});
}}
/>
@ -168,21 +168,21 @@ class GeneralSettings extends React.Component {
const updateRequest = new FormData();
updateRequest.append('action', 'saveGeneralSettings');
updateRequest.append('password', this.state.passwordsupport ? this.state.password : "-1");
updateRequest.append('password', this.state.passwordsupport ? this.state.password : '-1');
updateRequest.append('videopath', this.state.videopath);
updateRequest.append('tvshowpath', this.state.tvshowpath);
updateRequest.append('mediacentername', this.state.mediacentername);
updateRequest.append("tmdbsupport", this.state.tmdbsupport);
updateRequest.append("darkmodeenabled", GlobalInfos.isDarkTheme().toString());
updateRequest.append('tmdbsupport', this.state.tmdbsupport);
updateRequest.append('darkmodeenabled', GlobalInfos.isDarkTheme().toString());
fetch('/api/settings.php', {method: 'POST', body: updateRequest})
.then((response) => response.json()
.then((result) => {
if (result.success) {
console.log("successfully saved settings");
console.log('successfully saved settings');
// todo 2020-07-10: popup success
} else {
console.log("failed to save settings");
console.log('failed to save settings');
// todo 2020-07-10: popup error
}
}));

56
src/pages/SettingsPage/GeneralSettings.test.js
View File

@ -1,7 +1,7 @@
import {shallow} from "enzyme";
import React from "react";
import GeneralSettings from "./GeneralSettings";
import GlobalInfos from "../../GlobalInfos";
import {shallow} from 'enzyme';
import React from 'react';
import GeneralSettings from './GeneralSettings';
import GlobalInfos from '../../GlobalInfos';
describe('<GeneralSettings/>', function () {
it('renders without crashing ', function () {
@ -12,10 +12,10 @@ describe('<GeneralSettings/>', function () {
it('test password hide/show switchbutton', function () {
const wrapper = shallow(<GeneralSettings/>);
expect(wrapper.find("[data-testid='passwordfield']")).toHaveLength(0);
wrapper.find("FormCheck").findWhere(it => it.props().label === "Enable Password support").simulate("change");
expect(wrapper.find('[data-testid=\'passwordfield\']')).toHaveLength(0);
wrapper.find('FormCheck').findWhere(it => it.props().label === 'Enable Password support').simulate('change');
expect(wrapper.find("[data-testid='passwordfield']")).toHaveLength(1);
expect(wrapper.find('[data-testid=\'passwordfield\']')).toHaveLength(1);
});
it('test theme switchbutton', function () {
@ -23,7 +23,7 @@ describe('<GeneralSettings/>', function () {
GlobalInfos.enableDarkTheme(false);
expect(GlobalInfos.isDarkTheme()).toBe(false);
wrapper.find("[data-testid='darktheme-switch']").simulate("change");
wrapper.find('[data-testid=\'darktheme-switch\']').simulate('change');
expect(GlobalInfos.isDarkTheme()).toBe(true);
});
@ -34,7 +34,7 @@ describe('<GeneralSettings/>', function () {
expect(global.fetch).toBeCalledTimes(0);
const fakeEvent = {preventDefault: () => console.log('preventDefault')};
wrapper.find("[data-testid='mainformsettings']").simulate("submit", fakeEvent);
wrapper.find('[data-testid=\'mainformsettings\']').simulate('submit', fakeEvent);
expect(global.fetch).toBeCalledTimes(1);
process.nextTick(() => {
@ -52,7 +52,7 @@ describe('<GeneralSettings/>', function () {
expect(global.fetch).toBeCalledTimes(0);
const fakeEvent = {preventDefault: () => console.log('preventDefault')};
wrapper.find("[data-testid='mainformsettings']").simulate("submit", fakeEvent);
wrapper.find('[data-testid=\'mainformsettings\']').simulate('submit', fakeEvent);
expect(global.fetch).toBeCalledTimes(1);
process.nextTick(() => {
@ -66,39 +66,39 @@ describe('<GeneralSettings/>', function () {
it('test videopath change event', function () {
const wrapper = shallow(<GeneralSettings/>);
expect(wrapper.state().videopath).not.toBe("test");
expect(wrapper.state().videopath).not.toBe('test');
const event = {target: {name: "pollName", value: "test"}};
wrapper.find("[data-testid='videpathform']").find("FormControl").simulate("change", event);
expect(wrapper.state().videopath).toBe("test");
const event = {target: {name: 'pollName', value: 'test'}};
wrapper.find('[data-testid=\'videpathform\']').find('FormControl').simulate('change', event);
expect(wrapper.state().videopath).toBe('test');
});
it('test tvshowpath change event', function () {
const wrapper = shallow(<GeneralSettings/>);
const event = {target: {name: "pollName", value: "test"}};
expect(wrapper.state().tvshowpath).not.toBe("test");
wrapper.find("[data-testid='tvshowpath']").find("FormControl").simulate("change", event);
expect(wrapper.state().tvshowpath).toBe("test");
const event = {target: {name: 'pollName', value: 'test'}};
expect(wrapper.state().tvshowpath).not.toBe('test');
wrapper.find('[data-testid=\'tvshowpath\']').find('FormControl').simulate('change', event);
expect(wrapper.state().tvshowpath).toBe('test');
});
it('test mediacentername-form change event', function () {
const wrapper = shallow(<GeneralSettings/>);
const event = {target: {name: "pollName", value: "test"}};
expect(wrapper.state().mediacentername).not.toBe("test");
wrapper.find("[data-testid='nameform']").find("FormControl").simulate("change", event);
expect(wrapper.state().mediacentername).toBe("test");
const event = {target: {name: 'pollName', value: 'test'}};
expect(wrapper.state().mediacentername).not.toBe('test');
wrapper.find('[data-testid=\'nameform\']').find('FormControl').simulate('change', event);
expect(wrapper.state().mediacentername).toBe('test');
});
it('test password-form change event', function () {
const wrapper = shallow(<GeneralSettings/>);
wrapper.setState({passwordsupport: true});
const event = {target: {name: "pollName", value: "test"}};
expect(wrapper.state().password).not.toBe("test");
wrapper.find("[data-testid='passwordfield']").find("FormControl").simulate("change", event);
expect(wrapper.state().password).toBe("test");
const event = {target: {name: 'pollName', value: 'test'}};
expect(wrapper.state().password).not.toBe('test');
wrapper.find('[data-testid=\'passwordfield\']').find('FormControl').simulate('change', event);
expect(wrapper.state().password).toBe('test');
});
it('test tmdbsupport change event', function () {
@ -106,12 +106,12 @@ describe('<GeneralSettings/>', function () {
wrapper.setState({tmdbsupport: true});
expect(wrapper.state().tmdbsupport).toBe(true);
wrapper.find("[data-testid='tmdb-switch']").simulate("change");
wrapper.find('[data-testid=\'tmdb-switch\']').simulate('change');
expect(wrapper.state().tmdbsupport).toBe(false);
});
it('test insertion of 4 infoheaderitems', function () {
const wrapper = shallow(<GeneralSettings/>);
expect(wrapper.find("InfoHeaderItem").length).toBe(4);
expect(wrapper.find('InfoHeaderItem').length).toBe(4);
});
});

28
src/pages/SettingsPage/MovieSettings.js
View File

@ -1,5 +1,5 @@
import React from "react";
import style from "./MovieSettings.module.css"
import React from 'react';
import style from './MovieSettings.module.css';
/**
* Component for MovieSettings on Settingspage
@ -28,10 +28,10 @@ class MovieSettings extends React.Component {
<>
<button disabled={this.state.startbtnDisabled}
className='btn btn-success'
onClick={() => {this.startReindex()}}>Reindex Movie
onClick={() => {this.startReindex();}}>Reindex Movie
</button>
<button className='btn btn-warning'
onClick={() => {this.cleanupGravity()}}>Cleanup Gravity
onClick={() => {this.cleanupGravity();}}>Cleanup Gravity
</button>
<div className={style.indextextarea}>{this.state.text.map(m => (
<div className='textarea-element'>{m}</div>
@ -49,23 +49,23 @@ class MovieSettings extends React.Component {
this.setState({startbtnDisabled: true});
console.log("starting");
console.log('starting');
const request = new FormData();
request.append("action", "startReindex");
request.append('action', 'startReindex');
// fetch all videos available
fetch('/api/settings.php', {method: 'POST', body: request})
.then((response) => response.json()
.then((result) => {
console.log(result);
if (result.success) {
console.log("started successfully");
console.log('started successfully');
} else {
console.log("error, reindex already running");
console.log('error, reindex already running');
this.setState({startbtnDisabled: true});
}
}))
.catch(() => {
console.log("no connection to backend");
console.log('no connection to backend');
});
if (this.myinterval) {
clearInterval(this.myinterval);
@ -78,7 +78,7 @@ class MovieSettings extends React.Component {
*/
updateStatus = () => {
const request = new FormData();
request.append("action", "getStatusMessage");
request.append('action', 'getStatusMessage');
fetch('/api/settings.php', {method: 'POST', body: request})
.then((response) => response.json()
@ -88,7 +88,7 @@ class MovieSettings extends React.Component {
// todo 2020-07-4: scroll to bottom of div here
this.setState({
// insert a string for each line
text: [...result.message.split("\n"),
text: [...result.message.split('\n'),
...this.state.text]
});
} else {
@ -99,7 +99,7 @@ class MovieSettings extends React.Component {
}
}))
.catch(() => {
console.log("no connection to backend");
console.log('no connection to backend');
});
};
@ -108,7 +108,7 @@ class MovieSettings extends React.Component {
*/
cleanupGravity() {
const request = new FormData();
request.append("action", "cleanupGravity");
request.append('action', 'cleanupGravity');
fetch('/api/settings.php', {method: 'POST', body: request})
.then((response) => response.text()
@ -118,7 +118,7 @@ class MovieSettings extends React.Component {
});
}))
.catch(() => {
console.log("no connection to backend");
console.log('no connection to backend');
});
}
}

28
src/pages/SettingsPage/MovieSettings.test.js
View File

@ -1,6 +1,6 @@
import {shallow} from "enzyme";
import React from "react";
import MovieSettings from "./MovieSettings";
import {shallow} from 'enzyme';
import React from 'react';
import MovieSettings from './MovieSettings';
describe('<MovieSettings/>', function () {
it('renders without crashing ', function () {
@ -13,19 +13,19 @@ describe('<MovieSettings/>', function () {
wrapper.setState({
text: [
"firstline",
"secline"
'firstline',
'secline'
]
});
expect(wrapper.find(".indextextarea").find(".textarea-element")).toHaveLength(2);
expect(wrapper.find('.indextextarea').find('.textarea-element')).toHaveLength(2);
});
it('test simulate reindex', function () {
global.fetch = global.prepareFetchApi({success: true});
const wrapper = shallow(<MovieSettings/>);
wrapper.find("button").findWhere(e => e.text() === "Reindex Movie" && e.type() === "button").simulate("click");
wrapper.find('button').findWhere(e => e.text() === 'Reindex Movie' && e.type() === 'button').simulate('click');
// initial send of reindex request to server
expect(global.fetch).toBeCalledTimes(1);
@ -35,7 +35,7 @@ describe('<MovieSettings/>', function () {
global.fetch = global.prepareFetchApi({success: false});
const wrapper = shallow(<MovieSettings/>);
wrapper.find("button").findWhere(e => e.text() === "Reindex Movie" && e.type() === "button").simulate("click");
wrapper.find('button').findWhere(e => e.text() === 'Reindex Movie' && e.type() === 'button').simulate('click');
// initial send of reindex request to server
expect(global.fetch).toBeCalledTimes(1);
@ -52,7 +52,7 @@ describe('<MovieSettings/>', function () {
it('content available received and in state', done => {
global.fetch = global.prepareFetchApi({
contentAvailable: true,
message: "firstline\nsecondline"
message: 'firstline\nsecondline'
});
const wrapper = shallow(<MovieSettings/>);
wrapper.instance().updateStatus();
@ -60,8 +60,8 @@ describe('<MovieSettings/>', function () {
process.nextTick(() => {
expect(wrapper.state()).toMatchObject({
text: [
"firstline",
"secondline"
'firstline',
'secondline'
]
});
@ -70,7 +70,7 @@ describe('<MovieSettings/>', function () {
});
});
it('test reindex with no content available', done=> {
it('test reindex with no content available', done => {
global.fetch = global.prepareFetchApi({
contentAvailable: false
});
@ -93,11 +93,11 @@ describe('<MovieSettings/>', function () {
});
it('test simulate gravity cleanup', done => {
global.fetch = global.prepareFetchApi("mmi");
global.fetch = global.prepareFetchApi('mmi');
const wrapper = shallow(<MovieSettings/>);
wrapper.instance().setState = jest.fn(),
wrapper.find("button").findWhere(e => e.text() === "Cleanup Gravity" && e.type() === "button").simulate("click");
wrapper.find('button').findWhere(e => e.text() === 'Cleanup Gravity' && e.type() === 'button').simulate('click');
// initial send of reindex request to server
expect(global.fetch).toBeCalledTimes(1);

26
src/pages/SettingsPage/SettingsPage.js
View File

@ -1,8 +1,8 @@
import React from "react";
import MovieSettings from "./MovieSettings";
import GeneralSettings from "./GeneralSettings";
import style from "./SettingsPage.module.css"
import GlobalInfos from "../../GlobalInfos";
import React from 'react';
import MovieSettings from './MovieSettings';
import GeneralSettings from './GeneralSettings';
import style from './SettingsPage.module.css';
import GlobalInfos from '../../GlobalInfos';
/**
* The Settingspage handles all kinds of settings for the mediacenter
@ -13,7 +13,7 @@ class SettingsPage extends React.Component {
super(props, context);
this.state = {
currentpage: "general"
currentpage: 'general'
};
}
@ -23,14 +23,14 @@ class SettingsPage extends React.Component {
*/
getContent() {
switch (this.state.currentpage) {
case "general":
case 'general':
return <GeneralSettings/>;
case "movies":
case 'movies':
return <MovieSettings/>;
case "tv":
case 'tv':
return <span/>; // todo this page
default:
return "unknown button clicked";
return 'unknown button clicked';
}
}
@ -40,13 +40,13 @@ class SettingsPage extends React.Component {
<div>
<div className={style.SettingsSidebar + ' ' + themestyle.secbackground}>
<div className={style.SettingsSidebarTitle + ' ' + themestyle.lighttextcolor}>Settings</div>
<div onClick={() => this.setState({currentpage: "general"})}
<div onClick={() => this.setState({currentpage: 'general'})}
className={style.SettingSidebarElement}>General
</div>
<div onClick={() => this.setState({currentpage: "movies"})}
<div onClick={() => this.setState({currentpage: 'movies'})}
className={style.SettingSidebarElement}>Movies
</div>
<div onClick={() => this.setState({currentpage: "tv"})}
<div onClick={() => this.setState({currentpage: 'tv'})}
className={style.SettingSidebarElement}>TV Shows
</div>
</div>

32
src/pages/SettingsPage/SettingsPage.test.js
View File

@ -1,6 +1,6 @@
import {shallow} from "enzyme";
import React from "react";
import SettingsPage from "./SettingsPage";
import {shallow} from 'enzyme';
import React from 'react';
import SettingsPage from './SettingsPage';
describe('<RandomPage/>', function () {
it('renders without crashing ', function () {
@ -11,30 +11,30 @@ describe('<RandomPage/>', function () {
it('simulate topic clicka', function () {
const wrapper = shallow(<SettingsPage/>);
simulateSideBarClick("General", wrapper);
expect(wrapper.state().currentpage).toBe("general");
expect(wrapper.find(".SettingsContent").find("GeneralSettings")).toHaveLength(1);
simulateSideBarClick('General', wrapper);
expect(wrapper.state().currentpage).toBe('general');
expect(wrapper.find('.SettingsContent').find('GeneralSettings')).toHaveLength(1);
simulateSideBarClick("Movies", wrapper);
expect(wrapper.state().currentpage).toBe("movies");
expect(wrapper.find(".SettingsContent").find("MovieSettings")).toHaveLength(1);
simulateSideBarClick('Movies', wrapper);
expect(wrapper.state().currentpage).toBe('movies');
expect(wrapper.find('.SettingsContent').find('MovieSettings')).toHaveLength(1);
simulateSideBarClick("TV Shows", wrapper);
expect(wrapper.state().currentpage).toBe("tv");
expect(wrapper.find(".SettingsContent").find("span")).toHaveLength(1);
simulateSideBarClick('TV Shows', wrapper);
expect(wrapper.state().currentpage).toBe('tv');
expect(wrapper.find('.SettingsContent').find('span')).toHaveLength(1);
});
function simulateSideBarClick(name, wrapper) {
wrapper.find(".SettingSidebarElement").findWhere(it =>
wrapper.find('.SettingSidebarElement').findWhere(it =>
it.text() === name &&
it.type() === "div").simulate("click");
it.type() === 'div').simulate('click');
}
it('simulate unknown topic', function () {
const wrapper = shallow(<SettingsPage/>);
wrapper.setState({currentpage: "unknown"});
wrapper.setState({currentpage: 'unknown'});
expect(wrapper.find(".SettingsContent").text()).toBe("unknown button clicked");
expect(wrapper.find('.SettingsContent').text()).toBe('unknown button clicked');
});
});