From 7b044f97b861d651df80a1e91d2d48297231d588 Mon Sep 17 00:00:00 2001 From: lukas Date: Thu, 4 Jun 2020 22:19:18 +0200 Subject: [PATCH] created settings page set html title poll infos about current reindex better hover effect of preview tiles hide non existing infos in Player fixed wrong tagging of lq resolutions --- README.md | 4 +- api/Database.php | 2 +- api/extractionData.php | 18 ++++++++ api/extractvideopreviews.php | 33 ++++++++++++-- public/index.html | 4 +- src/App.js | 4 ++ src/Player.js | 8 +++- src/RandomPage.js | 2 +- src/SettingsPage.js | 84 ++++++++++++++++++++++++++++++++++++ src/css/Preview.css | 9 ++-- 10 files changed, 152 insertions(+), 16 deletions(-) create mode 100644 api/extractionData.php create mode 100644 src/SettingsPage.js diff --git a/README.md b/README.md index a4943a9..e81edf5 100644 --- a/README.md +++ b/README.md @@ -12,7 +12,7 @@ For organizing videos tags are used. Here you can see an example main page: -![Image of OpenMediaCenter](https://i.ibb.co/pZMj9GL/Screenshot-20200604-163448.png) +![Image of OpenMediaCenter](https://i.ibb.co/2PC3fmk/Screenshot-20200604-163448.png) ## Installation First of all clone the repository. @@ -35,5 +35,5 @@ Now you can access your MediaCenter via the servers global ip (: ## Contact Any contribution is appreciated. -Feel free to contact me (lukas.heiligenbrunner@gmail.com), open an issue or request a new featur. +Feel free to contact me (lukas.heiligenbrunner@gmail.com), open an issue or request a new feature. diff --git a/api/Database.php b/api/Database.php index 583289f..6a9a0d1 100644 --- a/api/Database.php +++ b/api/Database.php @@ -8,7 +8,7 @@ class Database private string $servername = "192.168.0.30"; private string $username = "root"; private string $password = "1qayxsw2"; - private string $dbname = "mediacenter"; + private string $dbname = "hub"; // The db connection is established in the private constructor. private function __construct() diff --git a/api/extractionData.php b/api/extractionData.php new file mode 100644 index 0000000..4f02334 --- /dev/null +++ b/api/extractionData.php @@ -0,0 +1,18 @@ +message = $out; + $return->contentAvailable = true; + + if (substr($out, -strlen("-42")) == "-42") { + unlink("/tmp/output.log"); + } +} else { + $return->contentAvailable = false; +} + + +echo json_encode($return); diff --git a/api/extractvideopreviews.php b/api/extractvideopreviews.php index 0ab44c6..3061284 100755 --- a/api/extractvideopreviews.php +++ b/api/extractvideopreviews.php @@ -2,6 +2,8 @@ require 'Database.php'; require 'TMDBMovie.php'; +writeLog("starting extraction!\n"); + $ffmpeg = 'ffmpeg'; //or: /usr/bin/ffmpeg , or /usr/local/bin/ffmpeg - depends on your installation (type which ffmpeg into a console to find the install path) $tmdb = new TMDBMovie(); @@ -35,6 +37,7 @@ foreach ($arr as $elem) { $genres = $dta->genre_ids; } else { echo "nothing found with TMDB!\n"; + writeLog("nothing found with TMDB!\n"); $pic = shell_exec("ffmpeg -hide_banner -loglevel panic -ss 00:04:00 -i \"../videos/prn/$elem\" -vframes 1 -q:v 2 -f singlejpeg pipe:1 2>/dev/null"); } @@ -78,6 +81,7 @@ foreach ($arr as $elem) { if ($conn->query($query) === TRUE) { echo('successfully added ' . $elem . " to video gravity\n"); + writeLog('successfully added ' . $elem . " to video gravity\n"); $last_id = $conn->insert_id; // full hd @@ -85,6 +89,7 @@ foreach ($arr as $elem) { $query = "INSERT INTO video_tags(video_id,tag_id) VALUES ($last_id,2)"; if ($conn->query($query) !== TRUE) { echo "failed to add default tag here.\n"; + writeLog("failed to add default tag here.\n"); } } @@ -92,21 +97,23 @@ foreach ($arr as $elem) { $query = "INSERT INTO video_tags(video_id,tag_id) VALUES ($last_id,4)"; if ($conn->query($query) !== TRUE) { echo "failed to add default tag here.\n"; + writeLog("failed to add default tag here.\n"); } } - if ($width < 1250) { + if ($width < 1250 && $width > 0) { $query = "INSERT INTO video_tags(video_id,tag_id) VALUES ($last_id,3)"; if ($conn->query($query) !== TRUE) { echo "failed to add default tag here.\n"; + writeLog("failed to add default tag here.\n"); } } // handle tmdb genres here! - if($genres != -1){ + if ($genres != -1) { foreach ($genres as $genre) { // check if genre is already a tag in db - echo $genre."\n\n"; +// echo $genre."\n\n"; } } @@ -115,7 +122,9 @@ foreach ($arr as $elem) { $all++; } else { echo('errored item: ' . $elem . "\n"); + writeLog('errored item: ' . $elem . "\n"); echo('{"data":"' . $conn->error . '"}\n'); + writeLog('{"data":"' . $conn->error . '"}\n'); $failed++; } } else { @@ -123,6 +132,7 @@ foreach ($arr as $elem) { } } else { echo($elem . " does not contain a .mp4 extension! - skipping \n"); + writeLog($elem . " does not contain a .mp4 extension! - skipping \n"); } } } @@ -133,8 +143,11 @@ $r = mysqli_fetch_assoc($result); if ($all < $r['count']) { echo "should be in gravity: " . $all . "\n"; + writeLog("should be in gravity: " . $all . "\n"); echo "really in gravity: " . $r['count'] . "\n"; + writeLog("really in gravity: " . $r['count'] . "\n"); echo "cleaning up gravity\n"; + writeLog("cleaning up gravity\n"); $query = "SELECT movie_id,movie_url FROM videos"; $result = $conn->query($query); @@ -144,9 +157,11 @@ if ($all < $r['count']) { $query = "DELETE FROM videos WHERE movie_id='" . $r['movie_id'] . "'"; if ($conn->query($query) === TRUE) { echo('successfully deleted ' . $r['movie_url'] . " from video gravity\n"); + writeLog('successfully deleted ' . $r['movie_url'] . " from video gravity\n"); $deleted++; } else { echo "failed to delete " . $r['movie_url'] . " from gravity: " . $conn->error . "\n"; + writeLog("failed to delete " . $r['movie_url'] . " from gravity: " . $conn->error . "\n"); } } } @@ -166,10 +181,16 @@ if ($result->num_rows == 1) { } echo "Total gravity: " . $all . "\n"; +writeLog("Total gravity: " . $all . "\n"); echo "Size of Databse is: " . $size . "MB\n"; +writeLog("Size of Databse is: " . $size . "MB\n"); echo "added in this run: " . $added . "\n"; +writeLog("added in this run: " . $added . "\n"); echo "deleted in this run: " . $deleted . "\n"; +writeLog("deleted in this run: " . $deleted . "\n"); echo "errored in this run: " . $failed . "\n"; +writeLog("errored in this run: " . $failed . "\n"); +writeLog("-42"); function _get_video_attributes($video) { @@ -177,3 +198,9 @@ function _get_video_attributes($video) $output = shell_exec($command); return json_decode($output); } + +function writeLog(string $message) +{ + file_put_contents("/tmp/output.log", $message, FILE_APPEND); + flush(); +} diff --git a/public/index.html b/public/index.html index aa069f2..92fbfdd 100644 --- a/public/index.html +++ b/public/index.html @@ -7,7 +7,7 @@ - React App + OpenMediaCenter diff --git a/src/App.js b/src/App.js index 7212793..5ef49e4 100644 --- a/src/App.js +++ b/src/App.js @@ -5,6 +5,7 @@ import RandomPage from "./RandomPage"; // include bootstraps css import 'bootstrap/dist/css/bootstrap.min.css'; +import SettingsPage from "./SettingsPage"; class App extends React.Component { constructor(props, context) { @@ -26,6 +27,9 @@ class App extends React.Component { } else if (this.state.page === "random") { page = ; this.mypage = page; + } else if (this.state.page === "settings") { + page = ; + this.mypage = page; } else if (this.state.page === "video") { // show videoelement if neccessary page = this.videoelement; diff --git a/src/Player.js b/src/Player.js index b954f8c..f01b523 100644 --- a/src/Player.js +++ b/src/Player.js @@ -54,8 +54,12 @@ class Player extends React.Component {
Infos:

{this.state.likes} Likes!
-
{this.state.quality}p Quality!
-
{this.state.length} Minutes of length!
+ {this.state.quality != 0 ? +
{this.state.quality}p Quality! +
: null} + {this.state.length != 0 ? +
{Math.round(this.state.length / 60)} Minutes of length! +
: null}
Tags:
{this.state.tags.map((m) => ( diff --git a/src/RandomPage.js b/src/RandomPage.js index 6b4bfd5..c0f814b 100644 --- a/src/RandomPage.js +++ b/src/RandomPage.js @@ -23,7 +23,7 @@ class RandomPage extends React.Component {
Random Videos - 6pc + 4pc
diff --git a/src/SettingsPage.js b/src/SettingsPage.js new file mode 100644 index 0000000..0cda3e0 --- /dev/null +++ b/src/SettingsPage.js @@ -0,0 +1,84 @@ +import React from "react"; +import "./css/DefaultPage.css" + + +class SettingsPage extends React.Component { + constructor(props, context) { + super(props, context); + this.state = { + text: [] + }; + } + + updateStatus = () => { + const updateRequest = new FormData(); + fetch('/api/extractionData.php', {method: 'POST', body: updateRequest}) + .then((response) => response.json() + .then((result) => { + if (result.contentAvailable === true) { + console.log(result); + this.setState({ + text: [...result.message.split("\n"), + ...this.state.text] + }); + } else { + clearInterval(this.myinterval); + } + })) + .catch(() => { + console.log("no connection to backend"); + }); + }; + + componentDidMount() { + if(this.myinterval){ + clearInterval(this.myinterval); + } + this.myinterval = setInterval(this.updateStatus, 1000); + } + + componentWillUnmount() { + clearInterval(this.myinterval); + } + + render() { + return ( +
+
+ Settings Page + todo +
+
+ + +
{this.state.text.map(m => ( +
{m}
+ ))}
+
+ ); + } + + startReindex() { + console.log("starting"); + const updateRequest = new FormData(); + // fetch all videos available + fetch('/api/extractvideopreviews.php', {method: 'POST', body: updateRequest}) + .then((response) => response.json() + .then((result) => { + console.log("returned"); + })) + .catch(() => { + console.log("no connection to backend"); + }); + if(this.myinterval){ + clearInterval(this.myinterval); + } + this.myinterval = setInterval(this.updateStatus, 1000); + console.log("sent"); + } +} + +export default SettingsPage; diff --git a/src/css/Preview.css b/src/css/Preview.css index 5119342..3373a75 100644 --- a/src/css/Preview.css +++ b/src/css/Preview.css @@ -18,24 +18,23 @@ max-width: 410px; } -.previewbottom{ +.previewbottom { height: 20px; } .videopreview { - /*width: 250px;*/ float: left; margin-left: 25px; margin-top: 25px; /*background-color: #7F7F7F;*/ background-color: #a8c3ff; cursor: pointer; - opacity: 0.9; - border: 10px; + opacity: 0.85; border-radius: 20px; } .videopreview:hover { opacity: 1; - transition: opacity 0.5s; + box-shadow: rgba(2, 12, 27, 0.7) 0px 0px 0px 5px; + transition: all 300ms; }