diff --git a/README.md b/README.md index dd86544..eb9aeca 100644 --- a/README.md +++ b/README.md @@ -22,24 +22,30 @@ and in dark mode: ![](https://i.ibb.co/xzhdsbJ/Screenshot-20200812-172926.png) ## Installation -First of all clone the repository. -`git clone https://gitlab.heili.eu/lukas/openmediacenter.git` +Download the latest release .deb file from the Releases page and install it via `apt install ./OpenMediaCenter-0.1.x_amd64.deb` -Then build a production build via npm. - -`npm run build` - -Afterwards you can copy the content of the generated `build` folder as well as the `api` folder to your webserver root. - -You need also to setup a Database with the structure described in [SQL Style Reference](https://gitlab.heili.eu/lukas/openmediacenter/-/blob/master/database.sql). -The login data to this database needs to be specified in the `api/Database.php` file. - +Now you could optionally check if the service is up and running: `systemctl status OpenMediaCenter` ## Usage -Now you can access your MediaCenter via your servers global ip (: +Now you can access your MediaCenter via your servers global ip on port 8080 (: At the settings tab you can set the correct videopath on server and click reindex afterwards. + +## Development + +Build and start the go backend: + +`go build` + +Start frontend dev server: + +`npm start` + +### Environent Variables: + +`REACT_APP_CUST_BACK_DOMAIN` :: Set a custom movie domain + ## Contact Any contribution is appreciated. Feel free to contact me (lukas.heiligenbrunner@gmail.com), open an issue or request a new feature. diff --git a/src/pages/AuthenticationPage/AuthenticationPage.tsx b/src/pages/AuthenticationPage/AuthenticationPage.tsx index 64dd6af..fd743c6 100644 --- a/src/pages/AuthenticationPage/AuthenticationPage.tsx +++ b/src/pages/AuthenticationPage/AuthenticationPage.tsx @@ -1,6 +1,7 @@ import React from 'react'; import {Button} from '../../elements/GPElements/Button'; import style from './AuthenticationPage.module.css'; +import {addKeyHandler, removeKeyHandler} from '../../utils/ShortkeyHandler'; interface state { pwdText: string; @@ -17,6 +18,16 @@ class AuthenticationPage extends React.Component { this.state = { pwdText: '' }; + + this.keypress = this.keypress.bind(this); + } + + componentDidMount(): void { + addKeyHandler(this.keypress); + } + + componentWillUnmount(): void { + removeKeyHandler(this.keypress); } render(): JSX.Element { @@ -46,6 +57,20 @@ class AuthenticationPage extends React.Component { ); } + + /** + * key event handling + * @param event keyevent + */ + keypress(event: KeyboardEvent): void { + // hide if escape is pressed + if (event.key === 'Enter') { + // call a parentsubmit if defined + if (this.props.submit) { + this.props.submit(this.state.pwdText); + } + } + } } export default AuthenticationPage; diff --git a/src/pages/Player/Player.tsx b/src/pages/Player/Player.tsx index 516c1e8..a7d1f35 100644 --- a/src/pages/Player/Player.tsx +++ b/src/pages/Player/Player.tsx @@ -280,12 +280,18 @@ export class Player extends React.Component { {action: 'loadVideo', MovieId: parseInt(this.props.match.params.id, 10)}, (result: VideoTypes.loadVideoType) => { console.log(result); + console.log(process.env.REACT_APP_CUST_BACK_DOMAIN); this.setState({ sources: { type: 'video', sources: [ { - src: getBackendDomain() + GlobalInfos.getVideoPath() + result.MovieUrl, + src: + (process.env.REACT_APP_CUST_BACK_DOMAIN + ? process.env.REACT_APP_CUST_BACK_DOMAIN + : getBackendDomain()) + + GlobalInfos.getVideoPath() + + result.MovieUrl, type: 'video/mp4', size: 1080 }