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

new folder structure for php scripts

Browse Source 
renamed api nodes
php braces on same line
This commit is contained in:
Lukas Heiligenbrunner
2020-08-12 17:50:25 +00:00
parent 13336cbf1c
commit 1de36afb69
34 changed files with 457 additions and 238 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/elements/AddTagPopup/AddTagPopup.js
View File

@ -3,6 +3,9 @@ import Modal from 'react-bootstrap/Modal'
import Dropdown from "react-bootstrap/Dropdown";
import DropdownButton from "react-bootstrap/DropdownButton";
/**
* component creates overlay to add a new tag to a video
*/
class AddTagPopup extends React.Component {
constructor(props, context) {
super(props, context);
@ -22,7 +25,7 @@ class AddTagPopup extends React.Component {
const updateRequest = new FormData();
updateRequest.append('action', 'getAllTags');
fetch('/api/videoload.php', {method: 'POST', body: updateRequest})
fetch('/api/tags.php', {method: 'POST', body: updateRequest})
.then((response) => response.json())
.then((result) => {
this.setState({
@ -68,13 +71,16 @@ class AddTagPopup extends React.Component {
);
}
/**
* store the filled in form to the backend
*/
storeselection() {
const updateRequest = new FormData();
updateRequest.append('action', 'addTag');
updateRequest.append('id', this.state.selection.id);
updateRequest.append('movieid', this.props.movie_id);
fetch('/api/videoload.php', {method: 'POST', body: updateRequest})
fetch('/api/tags.php', {method: 'POST', body: updateRequest})
.then((response) => response.json()
.then((result) => {
if (result.result !== "success") {

8
src/elements/NewTagPopup/NewTagPopup.js
View File

@ -2,6 +2,9 @@ import React from "react";
import Modal from 'react-bootstrap/Modal'
import {Form} from "react-bootstrap";
/**
* creates modal overlay to define a new Tag
*/
class NewTagPopup extends React.Component {
constructor(props, context) {
super(props, context);
@ -45,12 +48,15 @@ class NewTagPopup extends React.Component {
);
}
/**
* store the filled in form to the backend
*/
storeselection() {
const updateRequest = new FormData();
updateRequest.append('action', 'createTag');
updateRequest.append('tagname', this.value);
fetch('/api/Tags.php', {method: 'POST', body: updateRequest})
fetch('/api/tags.php', {method: 'POST', body: updateRequest})
.then((response) => response.json())
.then((result) => {
if (result.result !== "success") {

10
src/elements/PageTitle/PageTitle.js
View File

@ -2,14 +2,10 @@ import React from "react";
import style from "./PageTitle.module.css"
import GlobalInfos from "../../GlobalInfos";
/**
* Component for generating PageTitle with bottom Line
*/
class PageTitle extends React.Component {
constructor(props) {
super(props);
this.props = props;
}
render() {
const themeStyle = GlobalInfos.getThemeStyle();
return (

2
src/elements/PageTitle/PageTitle.module.css
View File

@ -8,7 +8,7 @@
}
.pageheadersubtitle {
margin-left: 20px;
font-size: 23pt;
margin-left: 20px;
opacity: 0.6;
}

21
src/elements/Preview/Preview.js
View File

@ -4,6 +4,10 @@ import Player from "../../pages/Player/Player";
import {Spinner} from "react-bootstrap";
import GlobalInfos from "../../GlobalInfos";
/**
* Component for single preview tile
* floating side by side
*/
class Preview extends React.Component {
constructor(props, context) {
super(props, context);
@ -24,7 +28,7 @@ class Preview extends React.Component {
updateRequest.append('action', 'readThumbnail');
updateRequest.append('movieid', this.props.movie_id);
fetch('/api/videoload.php', {method: 'POST', body: updateRequest})
fetch('/api/video.php', {method: 'POST', body: updateRequest})
.then((response) => response.text()
.then((result) => {
this.setState({
@ -36,8 +40,8 @@ class Preview extends React.Component {
render() {
const themeStyle = GlobalInfos.getThemeStyle();
return (
<div className={style.videopreview + ' ' + themeStyle.secbackground + ' '+ themeStyle.preview} onClick={() => this.itemClick()}>
<div className={style.previewtitle + ' '+ themeStyle.lighttextcolor}>{this.state.name}</div>
<div className={style.videopreview + ' ' + themeStyle.secbackground + ' ' + themeStyle.preview} onClick={() => this.itemClick()}>
<div className={style.previewtitle + ' ' + themeStyle.lighttextcolor}>{this.state.name}</div>
<div className={style.previewpic}>
{this.state.previewpicture !== null ?
<img className={style.previewimage}
@ -53,6 +57,9 @@ class Preview extends React.Component {
);
}
/**
* handle the click event of a tile
*/
itemClick() {
console.log("item clicked!" + this.state.name);
@ -63,11 +70,14 @@ class Preview extends React.Component {
}
}
/**
* Component for a Tag-name tile (used in category page)
*/
export class TagPreview extends React.Component {
render() {
const themeStyle = GlobalInfos.getThemeStyle();
return (
<div className={style.videopreview + ' ' + style.tagpreview + ' ' + themeStyle.secbackground + ' '+ themeStyle.preview} onClick={() => this.itemClick()}>
<div className={style.videopreview + ' ' + style.tagpreview + ' ' + themeStyle.secbackground + ' ' + themeStyle.preview} onClick={() => this.itemClick()}>
<div className={style.tagpreviewtitle + ' ' + themeStyle.lighttextcolor}>
{this.props.name}
</div>
@ -75,6 +85,9 @@ export class TagPreview extends React.Component {
);
}
/**
* handle the click event of a Tag tile
*/
itemClick() {
this.props.categorybinding(this.props.name);
}

4
src/elements/Preview/Preview.module.css
View File

@ -1,11 +1,11 @@
.previewtitle {
height: 20px;
text-align: center;
font-size: smaller;
font-weight: bold;
height: 20px;
height: 20px;
max-width: 266px;
text-align: center;
text-align: center;
}
.previewpic {

13
src/elements/SideBar/SideBar.js
View File

@ -2,24 +2,33 @@ import React from "react";
import style from "./SideBar.module.css"
import GlobalInfos from "../../GlobalInfos";
/**
* component for sidebar-info
*/
class SideBar extends React.Component {
render() {
const themeStyle = GlobalInfos.getThemeStyle();
return (<div className={style.sideinfo + ' '+ themeStyle.secbackground}>
return (<div className={style.sideinfo + ' ' + themeStyle.secbackground}>
{this.props.children}
</div>);
}
}
/**
* The title of the sidebar
*/
export class SideBarTitle extends React.Component {
render() {
const themeStyle = GlobalInfos.getThemeStyle();
return (
<div className={style.sidebartitle + ' '+ themeStyle.subtextcolor}>{this.props.children}</div>
<div className={style.sidebartitle + ' ' + themeStyle.subtextcolor}>{this.props.children}</div>
);
}
}
/**
* An item of the sidebar
*/
export class SideBarItem extends React.Component {
render() {
const themeStyle = GlobalInfos.getThemeStyle();

7
src/elements/Tag/Tag.js
View File

@ -3,6 +3,9 @@ import React from "react";
import styles from "./Tag.module.css"
import CategoryPage from "../../pages/CategoryPage/CategoryPage";
/**
* A Component representing a single Category tag
*/
class Tag extends React.Component {
render() {
return (
@ -11,9 +14,13 @@ class Tag extends React.Component {
);
}
/**
* click handling for a Tag
*/
TagClick() {
const tag = this.props.children.toString().toLowerCase();
// call callback functin to switch to category page with specified tag
this.props.viewbinding.changeRootElement(
<CategoryPage
category={tag}

15
src/elements/VideoContainer/VideoContainer.js
View File

@ -2,6 +2,10 @@ import React from "react";
import Preview from "../Preview/Preview";
import style from "./VideoContainer.module.css"
/**
* A videocontainer storing lots of Preview elements
* includes scroll handling and loading of preview infos
*/
class VideoContainer extends React.Component {
// stores current index of loaded elements
loadindex = 0;
@ -43,9 +47,14 @@ class VideoContainer extends React.Component {
componentWillUnmount() {
this.setState({});
// unbind scroll listener when unmounting component
document.removeEventListener('scroll', this.trackScrolling);
}
/**
* load previews to the container
* @param nr number of previews to load
*/
loadPreviewBlock(nr) {
console.log("loadpreviewblock called ...")
let ret = [];
@ -67,9 +76,11 @@ class VideoContainer extends React.Component {
this.loadindex += nr;
}
/**
* scroll event handler -> load new previews if on bottom
*/
trackScrolling = () => {
// comparison if current scroll position is on bottom
// 200 stands for bottom offset to trigger load
// comparison if current scroll position is on bottom --> 200 is bottom offset to trigger load
if (window.innerHeight + document.documentElement.scrollTop + 200 >= document.documentElement.offsetHeight) {
this.loadPreviewBlock(8);
}