parse genres from tmdb

popup to add a new tag manually
added some key props to prevent warnings

api/Database.php

@@ -1,5 +1,10 @@
 <?php
 
+/**
+ * Class Database
+ *
+ * Class with all neccessary stuff for the Database connections.
+ */
 class Database
 {
     private static ?Database $instance = null;
@@ -21,6 +26,12 @@ class Database
         }
     }
 
+    /**
+     * get an instance of this database class
+     * (only possible way to retrieve an object)
+     *
+     * @return Database dbobject
+     */
     public static function getInstance()
     {
         if (!self::$instance) {
@@ -30,11 +41,20 @@ class Database
         return self::$instance;
     }
 
+    /**
+     * get a connection instance of the database
+     *
+     * @return mysqli mysqli instance
+     */
     public function getConnection()
     {
         return $this->conn;
     }
 
+    /**
+     * get name of current active database
+     * @return string name
+     */
     public function getDatabaseName(){
         return $this->dbname;
     }

api/TMDBMovie.php

@@ -35,6 +35,3 @@ class TMDBMovie
         return $reply->genres;
     }
 }
-
-$temp = new TMDBMovie();
-$temp->searchMovie("007 - Ein quantum Trost");

api/Tags.php

@@ -17,5 +17,15 @@ if (isset($_POST['action'])) {
             echo json_encode($rows);
 
             break;
+
+        case "createTag":
+            $query = "INSERT INTO tags (tag_name) VALUES ('" . $_POST['tagname'] . "')";
+
+            if ($conn->query($query) === TRUE) {
+                echo('{"result":"success"}');
+            } else {
+                echo('{"result":"' . $conn->error . '"}');
+            }
+            break;
     }
-}
+}

api/extractvideopreviews.php

@@ -6,6 +6,8 @@ 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();
+// initial load off all available movie genres
+$tmdbgenres = $tmdb->getAllGenres();
 
 $conn = Database::getInstance()->getConnection();
 
@@ -82,6 +84,8 @@ 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");
+
+                    // add this entry to the default tags
                     $last_id = $conn->insert_id;
 
                     // full hd
@@ -93,6 +97,7 @@ foreach ($arr as $elem) {
                         }
                     }
 
+                    // HD
                     if ($width >= 1250 && $width < 1900) {
                         $query = "INSERT INTO video_tags(video_id,tag_id) VALUES ($last_id,4)";
                         if ($conn->query($query) !== TRUE) {
@@ -101,6 +106,7 @@ foreach ($arr as $elem) {
                         }
                     }
 
+                    // SD
                     if ($width < 1250 && $width > 0) {
                         $query = "INSERT INTO video_tags(video_id,tag_id) VALUES ($last_id,3)";
                         if ($conn->query($query) !== TRUE) {
@@ -111,9 +117,17 @@ foreach ($arr as $elem) {
 
                     // handle tmdb genres here!
                     if ($genres != -1) {
-                        foreach ($genres as $genre) {
+                        // transform genre ids in valid names
-                            // check if genre is already a tag in db
+                        foreach ($genres as $genreid) {
-//                            echo $genre."\n\n";
+                            // check if genre is already a tag in db if not insert it
+                            $tagname = array_column($tmdbgenres, 'name', 'id')[$genreid];
+                            $tagid = tagExists($tagname);
+
+                            $query = "INSERT INTO video_tags(video_id,tag_id) VALUES ($last_id,$tagid)";
+                            if ($conn->query($query) !== TRUE) {
+                                echo "failed to add $genreid tag here.\n";
+                                writeLog("failed to add $genreid tag here.\n");
+                            }
                         }
                     }
 
@@ -137,6 +151,7 @@ foreach ($arr as $elem) {
     }
 }
 
+// auto cleanup db entries
 $query = "SELECT COUNT(*) as count FROM videos";
 $result = $conn->query($query);
 $r = mysqli_fetch_assoc($result);
@@ -190,8 +205,15 @@ 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");
 
+writeLog("-42"); // terminating characters to stop webui requesting infos
+
+/**
+ * get all videoinfos of a video file
+ *
+ * @param $video string name including extension
+ * @return object all infos as object
+ */
 function _get_video_attributes($video)
 {
     $command = "mediainfo \"../videos/prn/$video\" --Output=JSON";
@@ -199,8 +221,38 @@ function _get_video_attributes($video)
     return json_decode($output);
 }
 
+/**
+ * write a line to the output log file
+ *
+ * @param string $message message to write
+ */
 function writeLog(string $message)
 {
     file_put_contents("/tmp/output.log", $message, FILE_APPEND);
     flush();
 }
+
+/**
+ * ckecks if tag exists -- if not creates it
+ * @param string $tagname the name of the tag
+ * @return integer the id of the inserted tag
+ */
+function tagExists(string $tagname)
+{
+    global $conn;
+
+    $query = "SELECT * FROM tags WHERE tag_name='$tagname'";
+
+    $result = $conn->query($query);
+    if ($result->num_rows == 0) {
+        // tag does not exist --> create it
+        $query = "INSERT INTO tags (tag_name) VALUES ('$tagname')";
+        if ($conn->query($query) !== TRUE) {
+            echo "failed to create $tagname tag in database\n";
+            writeLog("failed to create $tagname tag in database\n");
+        }
+        return $conn->insert_id;
+    } else {
+        return $result->fetch_assoc()['tag_id'];
+    }
+}

src/elements/AddTagPopup.js

@@ -50,7 +50,7 @@ class AddTagPopup extends React.Component {
                         <DropdownButton id="dropdown-basic-button" title={this.state.selection.name}>
                             {this.state.items ?
                                 this.state.items.map((i) => (
-                                    <Dropdown.Item onClick={() => {
+                                    <Dropdown.Item key={i.tag_name} onClick={() => {
                                         this.setState({selection: {name: i.tag_name, id: i.tag_id}})
                                     }}>{i.tag_name}</Dropdown.Item>
                                 )) :

src/elements/NewTagPopup.js

@@ -0,0 +1,76 @@
+import React from "react";
+import Modal from 'react-bootstrap/Modal'
+import {Form} from "react-bootstrap";
+
+class NewTagPopup extends React.Component {
+    constructor(props, context) {
+        super(props, context);
+
+        this.props = props;
+    }
+
+    componentDidMount() {
+        const updateRequest = new FormData();
+        updateRequest.append('action', 'getAllTags');
+
+        fetch('/api/videoload.php', {method: 'POST', body: updateRequest})
+            .then((response) => response.json())
+            .then((result) => {
+                this.setState({
+                    items: result
+                });
+            });
+    }
+
+    render() {
+        return (
+            <>
+                <Modal
+                    show={this.props.show}
+                    onHide={this.props.onHide}
+                    size="lg"
+                    aria-labelledby="contained-modal-title-vcenter"
+                    centered>
+                    <Modal.Header closeButton>
+                        <Modal.Title id="contained-modal-title-vcenter">
+                            Create a new Tag!
+                        </Modal.Title>
+                    </Modal.Header>
+                    <Modal.Body>
+                        <Form.Group>
+                            <Form.Label>Tag Name:</Form.Label>
+                            <Form.Control id='namefield' type="text" placeholder="Enter Tag name" />
+                            <Form.Text className="text-muted">
+                                This Tag will automatically show up on category page.
+                            </Form.Text>
+                        </Form.Group>
+                    </Modal.Body>
+                    <Modal.Footer>
+                        <button className='btn btn-primary' onClick={() => {
+                            this.storeselection();
+                        }}>Add
+                        </button>
+                    </Modal.Footer>
+                </Modal>
+            </>
+        );
+    }
+
+    storeselection() {
+        const updateRequest = new FormData();
+        updateRequest.append('action', 'createTag');
+        updateRequest.append('tagname', document.getElementById("namefield").value);
+
+        fetch('/api/Tags.php', {method: 'POST', body: updateRequest})
+            .then((response) => response.json())
+            .then((result) => {
+                if (result.result !== "success") {
+                    console.log("error occured while writing to db -- todo error handling");
+                    console.log(result.result);
+                }
+                this.props.onHide();
+            });
+    }
+}
+
+export default NewTagPopup;

src/elements/Preview.js

@@ -85,7 +85,7 @@ export class TagPreview extends React.Component {
                     this.props.categorybinding(
                         <VideoContainer
                             data={result}
-                            viewbinding={this.props.viewbinding}/>
+                            viewbinding={this.props.viewbinding}/>,tag
                     );
                 }))
             .catch(() => {

src/pages/CategoryPage.js

@@ -3,6 +3,7 @@ import SideBar from "../elements/SideBar";
 import Tag from "../elements/Tag";
 
 import {TagPreview} from "../elements/Preview";
+import NewTagPopup from "../elements/NewTagPopup";
 
 class CategoryPage extends React.Component {
     constructor(props, context) {
@@ -12,7 +13,7 @@ class CategoryPage extends React.Component {
 
         this.state = {
             loadedtags: [],
-            selected: false
+            selected: null
         };
     }
 
@@ -24,9 +25,9 @@ class CategoryPage extends React.Component {
         return (
             <>
                 <div className='pageheader'>
-                    <span className='pageheadertitle'>Category Page</span>
+                    <span className='pageheadertitle'>Categories</span>
                     <span
-                        className='pageheadersubtitle'>{this.state.loadedtags ? this.state.loadedtags.length + " different Tags" : ""}</span>
+                        className='pageheadersubtitle'>{!this.state.selected ? this.state.loadedtags.length + " different Tags" : this.state.selected}</span>
                     <hr/>
                 </div>
                 <SideBar>
@@ -36,7 +37,10 @@ class CategoryPage extends React.Component {
                     <Tag>LowQuality</Tag>
                     <Tag>HD</Tag>
                     <hr/>
-                    <button className='btn btn-success'>Add a new Tag!</button>
+                    <button className='btn btn-success' onClick={() => {
+                        this.setState({popupvisible: true})
+                    }}>Add a new Tag!
+                    </button>
                 </SideBar>
 
                 {!this.state.selected ?
@@ -44,6 +48,7 @@ class CategoryPage extends React.Component {
                         {this.state.loadedtags ?
                             this.state.loadedtags.map((m) => (
                                 <TagPreview
+                                    key={m.tag_name}
                                     name={m.tag_name}
                                     tag_id={m.tag_id}
                                     viewbinding={this.props.viewbinding}
@@ -51,18 +56,33 @@ class CategoryPage extends React.Component {
                             )) :
                             "loading"}
                     </div>) :
-                    this.selectionelements
+                    <>
+                        {this.selectionelements}
+                        <button className="btn btn-success" onClick={this.loadCategoryPageDefault}>Back</button>
+                    </>
                 }
 
+                {this.state.popupvisible ?
+                    <NewTagPopup show={this.state.popupvisible}
+                                 onHide={() => {
+                                     this.setState({popupvisible: false});
+                                     this.loadTags();
+                                 }}/> :
+                    null
+                }
 
             </>
         );
     }
 
-    setPage = (element) => {
+    setPage = (element, tagname) => {
         this.selectionelements = element;
 
-        this.setState({selected: true});
+        this.setState({selected: tagname});
+    };
+
+    loadCategoryPageDefault = () => {
+        this.setState({selected: null});
     };
 
     /**

src/pages/Player.js

@@ -66,7 +66,7 @@ class Player extends React.Component {
                     <hr/>
                     <div className='sidebartitle'>Tags:</div>
                     {this.state.tags.map((m) => (
-                        <Tag>{m.tag_name}</Tag>
+                        <Tag key={m.tag_name}>{m.tag_name}</Tag>
                     ))}
                 </SideBar>
 

src/pages/SettingsPage.js

@@ -50,7 +50,7 @@ class SettingsPage extends React.Component {
                     <hr/>
                 </div>
 
-                <button onClick={() => {
+                <button className='btn btn-success' onClick={() => {
                     this.startReindex()
                 }}>Reindex Movies
                 </button>