add api react library

fix type error on settingssave

Closes #71

See merge request lukas/openmediacenter!50

.codeclimate.yml

@@ -0,0 +1,65 @@
+version: "2"
+plugins:
+  csslint:
+    enabled: true
+  coffeelint:
+    enabled: true
+  duplication:
+    enabled: true
+    config:
+      languages:
+        - ruby
+        - javascript
+        - python
+        - php
+  eslint:
+    enabled: true
+    channel: __ESLINT_CHANNEL__
+  fixme:
+    enabled: true
+  rubocop:
+    enabled: true
+exclude_patterns:
+  - config/
+  - db/
+  - dist/
+  - features/
+  - "**/node_modules/"
+  - script/
+  - "**/spec/"
+  - "**/test/"
+  - "**/tests/"
+  - Tests/
+  - "**/vendor/"
+  - "**/*_test.go"
+  - "**/*.d.ts"
+  - "**/*.min.js"
+  - "**/*.min.css"
+  - "**/__tests__/"
+  - "**/__mocks__/"
+  - "**/*.test.js"
+checks:
+  argument-count:
+    config:
+      threshold: 5
+  complex-logic:
+    config:
+      threshold: 4
+  file-lines:
+    config:
+      threshold: 350
+  method-complexity:
+    config:
+      threshold: 5
+  method-count:
+    config:
+      threshold: 20
+  method-lines:
+    config:
+      threshold: 60
+  nested-control-flow:
+    config:
+      threshold: 4
+  return-statements:
+    config:
+      threshold: 4

.eslintrc.js

@@ -0,0 +1,292 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ */
+
+module.exports = {
+    env: {
+        es6: true
+    },
+
+    parserOptions: {
+        sourceType: 'module'
+    },
+
+    extends: [
+        'plugin:prettier/recommended', // https://github.com/prettier/eslint-plugin-prettier#recommended-configuration
+        'prettier'
+    ],
+
+    plugins: ['eslint-comments', 'react', 'react-hooks', 'jest'],
+
+    settings: {
+        react: {
+            version: 'detect'
+        }
+    },
+
+    ignorePatterns: ['node_modules/', '**/*.js'],
+
+    overrides: [
+        {
+            files: ['*.ts', '*.tsx'],
+            parser: '@typescript-eslint/parser',
+            plugins: ['@typescript-eslint/eslint-plugin'],
+            rules: {
+                '@typescript-eslint/no-unused-vars': ['error', {argsIgnorePattern: '^_'}],
+                'no-unused-vars': 'off'
+            }
+        }
+    ],
+
+    // Map from global var to bool specifying if it can be redefined
+    globals: {
+        jest: true,
+        __DEV__: true,
+        __dirname: false,
+        __fbBatchedBridgeConfig: false,
+        AbortController: false,
+        alert: false,
+        cancelAnimationFrame: false,
+        cancelIdleCallback: false,
+        clearImmediate: true,
+        clearInterval: false,
+        clearTimeout: false,
+        console: false,
+        document: false,
+        ErrorUtils: false,
+        escape: false,
+        Event: false,
+        EventTarget: false,
+        exports: false,
+        fetch: false,
+        FileReader: false,
+        FormData: false,
+        global: false,
+        Headers: false,
+        Intl: false,
+        Map: true,
+        module: false,
+        navigator: false,
+        process: false,
+        Promise: true,
+        requestAnimationFrame: true,
+        requestIdleCallback: true,
+        require: false,
+        Set: true,
+        setImmediate: true,
+        setInterval: false,
+        setTimeout: false,
+        URL: false,
+        URLSearchParams: false,
+        WebSocket: true,
+        window: false,
+        XMLHttpRequest: false,
+        JSX: true,
+        KeyboardEvent: true,
+        MouseEvent: true,
+        Node: true,
+        HTMLDivElement: true,
+        HTMLInputElement: true
+    },
+
+    rules: {
+        "@typescript-eslint/no-explicit-any": "error",
+        "@typescript-eslint/explicit-function-return-type": "error",
+
+        // General
+        'comma-dangle': [1, 'never'], // allow or disallow trailing commas
+        'no-cond-assign': 1, // disallow assignment in conditional expressions
+        'no-console': 0, // disallow use of console (off by default in the node environment)
+        'no-const-assign': 2, // disallow assignment to const-declared variables
+        'no-constant-condition': 0, // disallow use of constant expressions in conditions
+        'no-control-regex': 1, // disallow control characters in regular expressions
+        'no-debugger': 1, // disallow use of debugger
+        'no-dupe-class-members': 2, // Disallow duplicate name in class members
+        'no-dupe-keys': 2, // disallow duplicate keys when creating object literals
+        'no-empty': 0, // disallow empty statements
+        'no-ex-assign': 1, // disallow assigning to the exception in a catch block
+        'no-extra-boolean-cast': 1, // disallow double-negation boolean casts in a boolean context
+        'no-extra-parens': 0, // disallow unnecessary parentheses (off by default)
+        'no-extra-semi': 1, // disallow unnecessary semicolons
+        'no-func-assign': 1, // disallow overwriting functions written as function declarations
+        'no-inner-declarations': 0, // disallow function or variable declarations in nested blocks
+        'no-invalid-regexp': 1, // disallow invalid regular expression strings in the RegExp constructor
+        'no-negated-in-lhs': 1, // disallow negation of the left operand of an in expression
+        'no-obj-calls': 1, // disallow the use of object properties of the global object (Math and JSON) as functions
+        'no-regex-spaces': 1, // disallow multiple spaces in a regular expression literal
+        'no-reserved-keys': 0, // disallow reserved words being used as object literal keys (off by default)
+        'no-sparse-arrays': 1, // disallow sparse arrays
+        'no-unreachable': 2, // disallow unreachable statements after a return, throw, continue, or break statement
+        'use-isnan': 1, // disallow comparisons with the value NaN
+        'valid-jsdoc': 0, // Ensure JSDoc comments are valid (off by default)
+        'valid-typeof': 1, // Ensure that the results of typeof are compared against a valid string
+
+        // Best Practices
+        // These are rules designed to prevent you from making mistakes. They either prescribe a better way of doing something or help you avoid footguns.
+
+        'block-scoped-var': 0, // treat var statements as if they were block scoped (off by default)
+        complexity: 0, // specify the maximum cyclomatic complexity allowed in a program (off by default)
+        'consistent-return': 0, // require return statements to either always or never specify values
+        curly: 1, // specify curly brace conventions for all control statements
+        'default-case': 0, // require default case in switch statements (off by default)
+        'dot-notation': 1, // encourages use of dot notation whenever possible
+        eqeqeq: [1, 'allow-null'], // require the use of === and !==
+        'guard-for-in': 0, // make sure for-in loops have an if statement (off by default)
+        'no-alert': 1, // disallow the use of alert, confirm, and prompt
+        'no-caller': 1, // disallow use of arguments.caller or arguments.callee
+        'no-div-regex': 1, // disallow division operators explicitly at beginning of regular expression (off by default)
+        'no-else-return': 0, // disallow else after a return in an if (off by default)
+        'no-eq-null': 0, // disallow comparisons to null without a type-checking operator (off by default)
+        'no-eval': 2, // disallow use of eval()
+        'no-extend-native': 1, // disallow adding to native types
+        'no-extra-bind': 1, // disallow unnecessary function binding
+        'no-fallthrough': 1, // disallow fallthrough of case statements
+        'no-floating-decimal': 1, // disallow the use of leading or trailing decimal points in numeric literals (off by default)
+        'no-implied-eval': 1, // disallow use of eval()-like methods
+        'no-labels': 1, // disallow use of labeled statements
+        'no-iterator': 1, // disallow usage of __iterator__ property
+        'no-lone-blocks': 1, // disallow unnecessary nested blocks
+        'no-loop-func': 0, // disallow creation of functions within loops
+        'no-multi-str': 0, // disallow use of multiline strings
+        'no-native-reassign': 0, // disallow reassignments of native objects
+        'no-new': 1, // disallow use of new operator when not part of the assignment or comparison
+        'no-new-func': 2, // disallow use of new operator for Function object
+        'no-new-wrappers': 1, // disallows creating new instances of String,Number, and Boolean
+        'no-octal': 1, // disallow use of octal literals
+        'no-octal-escape': 1, // disallow use of octal escape sequences in string literals, such as var foo = "Copyright \251";
+        'no-proto': 1, // disallow usage of __proto__ property
+        'no-redeclare': 0, // disallow declaring the same variable more then once
+        'no-return-assign': 1, // disallow use of assignment in return statement
+        'no-script-url': 1, // disallow use of javascript: urls.
+        'no-self-compare': 1, // disallow comparisons where both sides are exactly the same (off by default)
+        'no-sequences': 1, // disallow use of comma operator
+        'no-unused-expressions': 0, // disallow usage of expressions in statement position
+        'no-useless-escape': 1, // disallow escapes that don't have any effect in literals
+        'no-void': 1, // disallow use of void operator (off by default)
+        'no-warning-comments': 0, // disallow usage of configurable warning terms in comments": 1,                        // e.g. TODO or FIXME (off by default)
+        'no-with': 1, // disallow use of the with statement
+        radix: 1, // require use of the second argument for parseInt() (off by default)
+        'semi-spacing': 1, // require a space after a semi-colon
+        'vars-on-top': 0, // requires to declare all vars on top of their containing scope (off by default)
+        'wrap-iife': 0, // require immediate function invocation to be wrapped in parentheses (off by default)
+        yoda: 1, // require or disallow Yoda conditions
+
+        // Variables
+        // These rules have to do with variable declarations.
+
+        'no-catch-shadow': 1, // disallow the catch clause parameter name being the same as a variable in the outer scope (off by default in the node environment)
+        'no-delete-var': 1, // disallow deletion of variables
+        'no-label-var': 1, // disallow labels that share a name with a variable
+        'no-shadow': 1, // disallow declaration of variables already declared in the outer scope
+        'no-shadow-restricted-names': 1, // disallow shadowing of names such as arguments
+        'no-undef': 2, // disallow use of undeclared variables unless mentioned in a /*global */ block
+        'no-undefined': 0, // disallow use of undefined variable (off by default)
+        'no-undef-init': 1, // disallow use of undefined when initializing variables
+        'no-unused-vars': [1, {vars: 'all', args: 'none', ignoreRestSiblings: true}], // disallow declaration of variables that are not used in the code
+        'no-use-before-define': 0, // disallow use of variables before they are defined
+
+        // Node.js
+        // These rules are specific to JavaScript running on Node.js.
+
+        'handle-callback-err': 1, // enforces error handling in callbacks (off by default) (on by default in the node environment)
+        'no-mixed-requires': 1, // disallow mixing regular variable and require declarations (off by default) (on by default in the node environment)
+        'no-new-require': 1, // disallow use of new operator with the require function (off by default) (on by default in the node environment)
+        'no-path-concat': 1, // disallow string concatenation with __dirname and __filename (off by default) (on by default in the node environment)
+        'no-process-exit': 0, // disallow process.exit() (on by default in the node environment)
+        'no-restricted-modules': 1, // restrict usage of specified node modules (off by default)
+        'no-sync': 0, // disallow use of synchronous methods (off by default)
+
+        // ESLint Comments Plugin
+        // The following rules are made available via `eslint-plugin-eslint-comments`
+        'eslint-comments/no-aggregating-enable': 1, // disallows eslint-enable comments for multiple eslint-disable comments
+        'eslint-comments/no-unlimited-disable': 1, // disallows eslint-disable comments without rule names
+        'eslint-comments/no-unused-disable': 1, // disallow disables that don't cover any errors
+        'eslint-comments/no-unused-enable': 1, // // disallow enables that don't enable anything or enable rules that weren't disabled
+
+        // Stylistic Issues
+        // These rules are purely matters of style and are quite subjective.
+
+        'key-spacing': 0,
+        'keyword-spacing': 1, // enforce spacing before and after keywords
+        'jsx-quotes': [1, 'prefer-single'], // enforces the usage of double quotes for all JSX attribute values which doesn’t contain a double quote
+        'comma-spacing': 0,
+        'no-multi-spaces': 0,
+        'brace-style': 0, // enforce one true brace style (off by default)
+        camelcase: 1, // require camel case names
+        'consistent-this': 1, // enforces consistent naming when capturing the current execution context (off by default)
+        'eol-last': 1, // enforce newline at the end of file, with no multiple empty lines
+        'func-names': 0, // require function expressions to have a name (off by default)
+        'func-style': 0, // enforces use of function declarations or expressions (off by default)
+        'new-cap': 0, // require a capital letter for constructors
+        'new-parens': 1, // disallow the omission of parentheses when invoking a constructor with no arguments
+        'no-nested-ternary': 0, // disallow nested ternary expressions (off by default)
+        'no-array-constructor': 1, // disallow use of the Array constructor
+        'no-empty-character-class': 1, // disallow the use of empty character classes in regular expressions
+        'no-lonely-if': 0, // disallow if as the only statement in an else block (off by default)
+        'no-new-object': 1, // disallow use of the Object constructor
+        'no-spaced-func': 1, // disallow space between function identifier and application
+        'no-ternary': 0, // disallow the use of ternary operators (off by default)
+        'no-trailing-spaces': 1, // disallow trailing whitespace at the end of lines
+        'no-underscore-dangle': 0, // disallow dangling underscores in identifiers
+        'no-mixed-spaces-and-tabs': 1, // disallow mixed spaces and tabs for indentation
+        quotes: [1, 'single', 'avoid-escape'], // specify whether double or single quotes should be used
+        'quote-props': 0, // require quotes around object literal property names (off by default)
+        semi: 1, // require or disallow use of semicolons instead of ASI
+        'sort-vars': 0, // sort variables within the same declaration block (off by default)
+        'space-in-brackets': 0, // require or disallow spaces inside brackets (off by default)
+        'space-in-parens': 0, // require or disallow spaces inside parentheses (off by default)
+        'space-infix-ops': 1, // require spaces around operators
+        'space-unary-ops': [1, {words: true, nonwords: false}], // require or disallow spaces before/after unary operators (words on by default, nonwords off by default)
+        'max-nested-callbacks': 0, // specify the maximum depth callbacks can be nested (off by default)
+        'one-var': 0, // allow just one var statement per function (off by default)
+        'wrap-regex': 0, // require regex literals to be wrapped in parentheses (off by default)
+
+        // Legacy
+        // The following rules are included for compatibility with JSHint and JSLint. While the names of the rules may not match up with the JSHint/JSLint counterpart, the functionality is the same.
+
+        'max-depth': 0, // specify the maximum depth that blocks can be nested (off by default)
+        'max-len': 0, // specify the maximum length of a line in your program (off by default)
+        'max-params': 0, // limits the number of parameters that can be used in the function declaration. (off by default)
+        'max-statements': 0, // specify the maximum number of statement allowed in a function (off by default)
+        'no-bitwise': 1, // disallow use of bitwise operators (off by default)
+        'no-plusplus': 0, // disallow use of unary operators, ++ and -- (off by default)
+
+        // React Plugin
+        // The following rules are made available via `eslint-plugin-react`.
+
+        'react/display-name': 0,
+        'react/jsx-boolean-value': 0,
+        'react/jsx-no-comment-textnodes': 2,
+        'react/jsx-no-duplicate-props': 2,
+        'react/jsx-no-undef': 2,
+        'react/jsx-sort-props': 0,
+        'react/jsx-uses-react': 1,
+        'react/jsx-uses-vars': 1,
+        'react/no-did-mount-set-state': 1,
+        'react/no-did-update-set-state': 1,
+        'react/no-multi-comp': 0,
+        'react/no-string-refs': 1,
+        'react/no-unknown-property': 0,
+        'react/prop-types': 0,
+        'react/react-in-jsx-scope': 1,
+        'react/self-closing-comp': 1,
+        'react/wrap-multilines': 0,
+
+        // React-Hooks Plugin
+        // The following rules are made available via `eslint-plugin-react-hooks`
+        'react-hooks/rules-of-hooks': 'error',
+        'react-hooks/exhaustive-deps': 'error',
+
+        // Jest Plugin
+        // The following rules are made available via `eslint-plugin-jest`.
+        'jest/no-disabled-tests': 1,
+        'jest/no-focused-tests': 1,
+        'jest/no-identical-title': 1,
+        'jest/valid-expect': 1
+    }
+};

.gitlab-ci.yml

@@ -1,34 +1,130 @@
-image: node:latest
+image: node:14
 
 stages:
+  - build_frontend
+  - build_backend
   - test
-  - coverage
-  - build
+  - packaging
+  - deploy
 
-cache:
-  paths:
-    - node_modules/
-
-test:
-  stage: test
+Minimize_Frontend:
+  stage: build_frontend
+  before_script:
+    - yarn install --cache-folder .yarn
   script:
-    - npm install
-    - CI=true npm run test
+    - yarn run build
+    - rm build/*/*/*.map
+  artifacts:
+    expire_in: 2 days
+    paths:
+      - build/
+  cache:
+    key: ${CI_COMMIT_REF_SLUG}
+    paths:
+      - .yarn/
+      - node_modules/
+
+Build_Backend:
+  image: golang:latest
+  stage: build_backend
+  script:
+    - cd apiGo
+    - go build -v -o openmediacenter
+    - cp -r ../build/ ./static/
+    - go build -v -tags static -o openmediacenter_full
+    - env GOOS=windows GOARCH=amd64 go build -v -tags static -o openmediacenter.exe
+  needs:
+    - Minimize_Frontend
+  artifacts:
+    expire_in: 2 days
+    paths:
+      - "./apiGo/openmediacenter*"
+
+Frontend_Tests:
+  stage: test
+  before_script:
+    - yarn install --cache-folder .yarn
+  script:
+    - yarn run test
+  needs: []
   artifacts:
     reports:
       junit:
         - ./junit.xml
+  cache:
+    key: ${CI_COMMIT_REF_SLUG}
+    paths:
+      - .yarn/
+      - node_modules/
 
-coverage:
-  stage: coverage
+Backend_Tests:
+  image: golang:latest
+  stage: test
   script:
-    - CI=true npm run coverage
+    - cd apiGo
+    - go get -u github.com/jstemmer/go-junit-report
+    - go test -v ./... 2>&1 | go-junit-report -set-exit-code > report.xml
+  needs: []
+  artifacts:
+    when: always
+    reports:
+      junit: ./apiGo/report.xml
+
+lint:
+  stage: test
+  before_script:
+    - yarn install --cache-folder .yarn
+  script:
+    - yarn run lint
+  cache:
+    key: ${CI_COMMIT_REF_SLUG}
+    paths:
+      - .yarn/
+      - ./node_modules/
   artifacts:
     reports:
-      cobertura:
-        - ./coverage/cobertura-coverage.xml
+      codequality: gl-codequality.json
+  needs: []
 
-build:
-  stage: build
+Debian_Server:
+  stage: packaging
+  image: debian
   script:
-    - npm run build
+    - vers=$(grep -Po '"version":.*?[^\\]",' package.json | grep -Po '[0-9]+\.[0-9]+\.[0-9]+') # parse the version out of package .json
+    - cd deb
+    - mkdir -p "./OpenMediaCenter/var/www/openmediacenter/videos/"
+    - mkdir -p "./OpenMediaCenter/tmp/"
+    - mkdir -p "./OpenMediaCenter/usr/bin/"
+    - cp -r ../build/* ./OpenMediaCenter/var/www/openmediacenter/
+    - cp ../apiGo/openmediacenter ./OpenMediaCenter/usr/bin/
+    - cp ../database.sql ./OpenMediaCenter/tmp/openmediacenter.sql
+    - 'echo "Version: ${vers}" >> ./OpenMediaCenter/DEBIAN/control'
+    - chmod -R 0775 *
+    - dpkg-deb --build OpenMediaCenter
+    - mv OpenMediaCenter.deb OpenMediaCenter-${vers}_amd64.deb
+  artifacts:
+    expire_in: 7 days
+    paths:
+      - deb/OpenMediaCenter-*.deb
+  needs:
+      - Minimize_Frontend
+      - Build_Backend
+
+Test_Server:
+  stage: deploy
+  image: luki42/ssh:latest
+  needs:
+    - Frontend_Tests
+    - Backend_Tests
+    - Debian_Server
+  only:
+    - master
+  script:
+    - eval $(ssh-agent -s)
+    - echo "$SSH_PRIVATE_KEY" | ssh-add -
+    - mkdir -p ~/.ssh
+    - '[[ -f /.dockerenv ]] && echo -e "Host *\n\tStrictHostKeyChecking no\n\n" > ~/.ssh/config'
+    - scp deb/OpenMediaCenter-*.deb root@192.168.0.42:/tmp/
+    - ssh root@192.168.0.42 "DEBIAN_FRONTEND=noninteractive apt-get --reinstall  -y -qq install /tmp/OpenMediaCenter-*.deb && rm /tmp/OpenMediaCenter-*.deb"
+  allow_failure: true
+

.prettierrc.js

@@ -0,0 +1,10 @@
+module.exports = {
+    bracketSpacing: false,
+    jsxBracketSameLine: true,
+    singleQuote: true,
+    tabWidth: 4,
+    trailingComma: 'none',
+    printWidth: 135,
+    semi: true,
+    jsxSingleQuote: true
+};

README.md

@@ -7,33 +7,44 @@ Feel free to contribute or open an issue here: https://gitlab.heili.eu/lukas/ope
 
 ## What is this?
 Open Media Center is an open source solution for a mediacenter in your home network.
-It's based on Reactjs and  uses PHP for backend.
+Transform your webserver into a mediaserver.
+It's based on Reactjs and golang is used for backend.
 It is optimized for general videos as well as for movies. 
 For grabbing movie data TMDB is used. 
-For organizing videos tags are used.
+With the help of tags you can organize your video gravity.
 
-Here you can see an example main page:
+Here you can see an example main page in light mode:
 
-![Image of OpenMediaCenter](https://i.ibb.co/2PC3fmk/Screenshot-20200604-163448.png)
+![Image of OpenMediaCenter](https://i.ibb.co/pnDjgNT/Screenshot-20200812-172945.png)
+
+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`
-
-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.
+Download the latest release .deb file from the Releases page and install it via `apt install ./OpenMediaCenter-0.1.x_amd64.deb`
 
+Now you could optionally check if the service is up and running: `systemctl status OpenMediaCenter`
 ## Usage
-To index Videos run on your server: `php extractvideopreviews.php`.
+Now you can access your MediaCenter via your servers global ip on port 8080 (:
 
-Now you can access your MediaCenter via the servers global ip (:
+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. 

api/Database.php

@@ -1,61 +0,0 @@
-<?php
-
-/**
- * Class Database
- *
- * Class with all neccessary stuff for the Database connections.
- */
-class Database
-{
-    private static ?Database $instance = null;
-    private mysqli $conn;
-
-    private string $servername = "192.168.0.30";
-    private string $username = "root";
-    private string $password = "1qayxsw2";
-    private string $dbname = "mediacenter";
-
-    // The db connection is established in the private constructor.
-    private function __construct()
-    {
-        // Create connection
-        $this->conn = new mysqli($this->servername, $this->username, $this->password, $this->dbname);
-
-        if ($this->conn->connect_errno) {
-            echo "connecton failed... nr: " . $this->conn->connect_errno . " -- " . $this->conn->connect_error;
-        }
-    }
-
-    /**
-     * get an instance of this database class
-     * (only possible way to retrieve an object)
-     *
-     * @return Database dbobject
-     */
-    public static function getInstance()
-    {
-        if (!self::$instance) {
-            self::$instance = new 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

@@ -1,37 +0,0 @@
-<?php
-
-class TMDBMovie
-{
-    private $apikey = "9fd90530b11447f5646f8e6fb4733fb4";
-    private $baseurl = "https://api.themoviedb.org/3/";
-    public $picturebase = "https://image.tmdb.org/t/p/w500";
-
-    /**
-     * search for a specific movie
-     *
-     * @param string $moviename moviename
-     * @return object movie object or null if not found
-     */
-    public function searchMovie(string $moviename)
-    {
-        $reply = json_decode(file_get_contents($this->baseurl . "search/movie?api_key=" . $this->apikey . "&query=" . urlencode($moviename)));
-        if ($reply->total_results == 0) {
-            // no results found
-            // todo maybe parse first pictures somehow
-            return null;
-        } else {
-            return $reply->results[0];
-        }
-    }
-
-    /**
-     * query all available genres from tmdb
-     *
-     * @return array of all available genres
-     */
-    public function getAllGenres()
-    {
-        $reply = json_decode(file_get_contents($this->baseurl . "genre/movie/list?api_key=" . $this->apikey));
-        return $reply->genres;
-    }
-}

api/Tags.php

@@ -1,31 +0,0 @@
-<?php
-require 'Database.php';
-
-$conn = Database::getInstance()->getConnection();
-
-if (isset($_POST['action'])) {
-    $action = $_POST['action'];
-    switch ($action) {
-        case "getAllTags":
-            $query = "SELECT tag_name,tag_id from tags";
-
-            $result = $conn->query($query);
-            $rows = array();
-            while ($r = mysqli_fetch_assoc($result)) {
-                array_push($rows, $r);
-            }
-            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/extractionData.php

@@ -1,18 +0,0 @@
-<?php
-$return = new stdClass();
-if (file_exists("/tmp/output.log")) {
-    $out = file_get_contents("/tmp/output.log");
-    // clear log file
-    file_put_contents("/tmp/output.log", "");
-    $return->message = $out;
-    $return->contentAvailable = true;
-
-    if (substr($out, -strlen("-42")) == "-42") {
-        unlink("/tmp/output.log");
-    }
-} else {
-    $return->contentAvailable = false;
-}
-
-
-echo json_encode($return);

api/extractvideopreviews.php

@@ -1,265 +0,0 @@
-<?php
-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();
-// initial load of all available movie genres
-$tmdbgenres = $tmdb->getAllGenres();
-
-$conn = Database::getInstance()->getConnection();
-
-$scandir = "../videos/prn/";
-$arr = scandir($scandir);
-
-$all = 0;
-$added = 0;
-$deleted = 0;
-$failed = 0;
-
-foreach ($arr as $elem) {
-    if ($elem != "." && $elem != "..") {
-        if (strpos($elem, '.mp4') !== false) {
-            $moviename = substr($elem, 0, -4);
-
-            $query = "SELECT * FROM videos WHERE movie_name = '" . mysqli_real_escape_string($conn, $moviename) . "'";
-            $result = $conn->query($query);
-
-            // insert if not available in db
-            if (!mysqli_fetch_assoc($result)) {
-                // try to fetch data from TMDB
-                $poster = -1;
-                $genres = -1;
-                if (!is_null($dta = $tmdb->searchMovie($moviename))) {
-                    $pic = file_get_contents($tmdb->picturebase . $dta->poster_path);
-                    $poster = 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");
-
-                    // error handling for download error
-                    if (!$pic) {
-                        $pic = $poster;
-                        $poster = -1;
-                        echo "Failed to load Picture from TMDB!  \n";
-                    }
-
-                    $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");
-                }
-
-                //convert video to base64
-                $image_base64 = base64_encode($pic);
-                // add base64 fileinfo
-                $image = 'data:image/jpeg;base64,' . $image_base64;
-
-                // extract other video attributes
-                $video_attributes = _get_video_attributes($elem);
-                $duration = 0;
-                $size = 0;
-                $width = 0;
-
-                if ($video_attributes) {
-                    $duration = $video_attributes->media->track[0]->Duration; // in seconds
-                    $size = $video_attributes->media->track[0]->FileSize; // in Bytes
-                    $width = $video_attributes->media->track[1]->Width; // width
-                }
-
-
-                if ($poster != -1) {
-                    $poster_base64 = 'data:image/jpeg;base64,' . base64_encode($poster);
-
-                    $query = "INSERT INTO videos(movie_name,movie_url,poster,thumbnail,quality,length) 
-                            VALUES ('" . mysqli_real_escape_string($conn, $moviename) . "',
-                            '" . mysqli_real_escape_string($conn, 'videos/prn/' . $elem) . "',
-                            '$poster_base64',
-                            '$image',
-                            '$width',
-                            '$duration')";
-                } else {
-                    $query = "INSERT INTO videos(movie_name,movie_url,thumbnail,quality,length) 
-                            VALUES ('" . mysqli_real_escape_string($conn, $moviename) . "',
-                            '" . mysqli_real_escape_string($conn, 'videos/prn/' . $elem) . "',
-                            '$image',
-                            '$width',
-                            '$duration')";
-                }
-
-
-                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
-                    if ($width >= 1900) {
-                        $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");
-                        }
-                    }
-
-                    // HD
-                    if ($width >= 1250 && $width < 1900) {
-                        $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");
-                        }
-                    }
-
-                    // SD
-                    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) {
-                        // transform genre ids in valid names
-                        foreach ($genres as $genreid) {
-                            // 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");
-                            }
-                        }
-                    }
-
-
-                    $added++;
-                    $all++;
-                } else {
-                    echo('errored item: ' . $elem . "\n");
-                    writeLog('errored item: ' . $elem . "\n");
-                    echo('{"data":"' . $conn->error . '"}\n');
-                    writeLog('{"data":"' . $conn->error . '"}\n');
-                    $failed++;
-                }
-            } else {
-                $all++;
-            }
-        } else {
-            echo($elem . " does not contain a .mp4 extension! - skipping \n");
-            writeLog($elem . " does not contain a .mp4 extension! - skipping \n");
-        }
-    }
-}
-
-// auto cleanup db entries
-$query = "SELECT COUNT(*) as count FROM videos";
-$result = $conn->query($query);
-$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);
-
-    while ($r = mysqli_fetch_assoc($result)) {
-        if (!file_exists("../" . $r['movie_url'])) {
-            $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");
-            }
-        }
-    }
-}
-
-// calculate size of databse here
-$size = -1;
-$query = "SELECT table_schema AS \"Database\", 
-                        ROUND(SUM(data_length + index_length) / 1024 / 1024, 3) AS \"Size\" 
-                        FROM information_schema.TABLES 
-                        WHERE TABLE_SCHEMA='" . Database::getInstance()->getDatabaseName() . "'
-                        GROUP BY table_schema;";
-$result = $conn->query($query);
-if ($result->num_rows == 1) {
-    $row = $result->fetch_assoc();
-    $size = $row["Size"];
-}
-
-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"); // 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";
-    $output = shell_exec($command);
-    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'];
-    }
-}

api/videoload.php

@@ -1,232 +0,0 @@
-<?php
-require 'Database.php';
-
-$conn = Database::getInstance()->getConnection();
-
-//$_POST['action'] = "getRandomMovies";$_POST['number'] =6;
-if (isset($_POST['action'])) {
-    $action = $_POST['action'];
-    switch ($action) {
-        case "getMovies":
-            $query = "SELECT movie_id,movie_name FROM videos ORDER BY likes DESC, create_date DESC, movie_name ASC";
-            if (isset($_POST['tag'])) {
-                $tag = $_POST['tag'];
-                if ($_POST['tag'] != "all") {
-                    $query = "SELECT movie_id,movie_name FROM videos 
-                            INNER JOIN video_tags vt on videos.movie_id = vt.video_id
-                            INNER JOIN tags t on vt.tag_id = t.tag_id
-                            WHERE t.tag_name = '$tag'
-                            ORDER BY likes DESC, create_date ASC, movie_name ASC";
-                }
-            }
-            $result = $conn->query($query);
-            $rows = array();
-            while ($r = mysqli_fetch_assoc($result)) {
-                array_push($rows, $r);
-            }
-
-            echo(json_encode($rows));
-            break;
-        case "getRandomMovies":
-            $return = new stdClass();
-            $query = "SELECT movie_id,movie_name FROM videos ORDER BY RAND() LIMIT " . $_POST['number'];
-            $result = $conn->query($query);
-            $return->rows = array();
-
-            // get tags of random videos
-            $ids = [];
-            while ($r = mysqli_fetch_assoc($result)) {
-                array_push($return->rows, $r);
-                array_push($ids, "video_tags.video_id=" . $r['movie_id']);
-            }
-
-            $idstring = implode(" OR ", $ids);
-
-            $return->tags = array();
-            $query = "SELECT t.tag_name FROM video_tags 
-                        INNER JOIN tags t on video_tags.tag_id = t.tag_id
-                        WHERE $idstring
-                        GROUP BY t.tag_name";
-            $result = $conn->query($query);
-            while ($r = mysqli_fetch_assoc($result)) {
-                array_push($return->tags, $r);
-            }
-
-            echo(json_encode($return));
-            break;
-        case "getSearchKeyWord":
-            $search = $_POST['keyword'];
-
-            $query = "SELECT movie_id,movie_name FROM videos 
-                        WHERE movie_name LIKE '%$search%'
-                        ORDER BY likes DESC, create_date DESC, movie_name ASC";
-            $result = $conn->query($query);
-            $rows = array();
-            while ($r = mysqli_fetch_assoc($result)) {
-                array_push($rows, $r);
-            }
-
-            echo(json_encode($rows));
-
-            break;
-        case "loadVideo":
-            $query = "SELECT movie_name,movie_id,movie_url,thumbnail,poster,likes,quality,length FROM videos WHERE movie_id='" . $_POST['movieid'] . "'";
-
-            $result = $conn->query($query);
-            $row = $result->fetch_assoc();
-
-            $arr = array();
-            if ($row["poster"] == null) {
-                $arr["thumbnail"] = $row["thumbnail"];
-            } else {
-                $arr["thumbnail"] = $row["poster"];
-            }
-
-            $arr["movie_id"] = $row["movie_id"];
-            $arr["movie_name"] = $row["movie_name"];
-            $arr["movie_url"] = str_replace("?","%3F",$row["movie_url"]);
-            $arr["likes"] = $row["likes"];
-            $arr["quality"] = $row["quality"];
-            $arr["length"] = $row["length"];
-
-            // load tags of this video
-            $arr['tags'] = array();
-            $query = "SELECT t.tag_name FROM video_tags 
-                        INNER JOIN tags t on video_tags.tag_id = t.tag_id
-                        WHERE video_tags.video_id=" . $_POST['movieid'] . "
-                        GROUP BY t.tag_name";
-            $result = $conn->query($query);
-            while ($r = mysqli_fetch_assoc($result)) {
-                array_push($arr['tags'], $r);
-            }
-
-            echo(json_encode($arr));
-
-            break;
-        case "getDbSize":
-            $query = "SELECT table_schema AS \"Database\", 
-                        ROUND(SUM(data_length + index_length) / 1024 / 1024, 2) AS \"Size\" 
-                        FROM information_schema.TABLES 
-                        WHERE TABLE_SCHEMA='hub'
-                        GROUP BY table_schema;";
-            $result = $conn->query($query);
-
-            if ($result->num_rows == 1) {
-                $row = $result->fetch_assoc();
-                echo '{"data":"' . $row["Size"] . 'MB"}';
-            }
-
-            break;
-        case "readThumbnail":
-            $query = "SELECT thumbnail FROM videos WHERE movie_id='" . $_POST['movieid'] . "'";
-
-            $result = $conn->query($query);
-            $row = $result->fetch_assoc();
-
-            echo($row["thumbnail"]);
-
-            break;
-        case "getTags":
-            // todo add this to loadVideo maybe
-            $movieid = $_POST['movieid'];
-
-            $query = "SELECT tag_name FROM video_tags 
-                        INNER JOIN tags t on video_tags.tag_id = t.tag_id 
-                        WHERE video_id='$movieid'";
-
-            $result = $conn->query($query);
-
-            $rows = array();
-            $rows['tags'] = array();
-            while ($r = mysqli_fetch_assoc($result)) {
-                array_push($rows['tags'], $r['tag_name']);
-            }
-
-            echo(json_encode($rows));
-            break;
-        case "addLike":
-            $movieid = $_POST['movieid'];
-
-            $query = "update videos set likes = likes + 1 where movie_id = '$movieid'";
-
-            if ($conn->query($query) === TRUE) {
-                echo('{"result":"success"}');
-            } else {
-                echo('{"result":"' . $conn->error . '"}');
-            }
-            break;
-        case "getStartData":
-            $query = "SELECT COUNT(*) as nr FROM videos";
-            $result = $conn->query($query);
-            $r = mysqli_fetch_assoc($result);
-
-            $arr = array();
-            $arr['total'] = $r['nr'];
-
-            $query = "SELECT COUNT(*) as nr FROM videos
-                        INNER JOIN video_tags vt on videos.movie_id = vt.video_id
-                        INNER JOIN tags t on vt.tag_id = t.tag_id";
-            $result = $conn->query($query);
-            $r = mysqli_fetch_assoc($result);
-            $arr['tagged'] = $r['nr'];
-
-            $query = "SELECT COUNT(*) as nr FROM videos
-                        INNER JOIN video_tags vt on videos.movie_id = vt.video_id
-                        INNER JOIN tags t on vt.tag_id = t.tag_id
-                        WHERE t.tag_name='hd'";
-            $result = $conn->query($query);
-            $r = mysqli_fetch_assoc($result);
-            $arr['hd'] = $r['nr'];
-
-            $query = "SELECT COUNT(*) as nr FROM videos
-                        INNER JOIN video_tags vt on videos.movie_id = vt.video_id
-                        INNER JOIN tags t on vt.tag_id = t.tag_id
-                        WHERE t.tag_name='fullhd'";
-            $result = $conn->query($query);
-            $r = mysqli_fetch_assoc($result);
-            $arr['fullhd'] = $r['nr'];
-
-            $query = "SELECT COUNT(*) as nr FROM videos
-                        INNER JOIN video_tags vt on videos.movie_id = vt.video_id
-                        INNER JOIN tags t on vt.tag_id = t.tag_id
-                        WHERE t.tag_name='lowquality'";
-            $result = $conn->query($query);
-            $r = mysqli_fetch_assoc($result);
-            $arr['sd'] = $r['nr'];
-
-            $query = "SELECT COUNT(*) as nr FROM tags";
-            $result = $conn->query($query);
-            $r = mysqli_fetch_assoc($result);
-            $arr['tags'] = $r['nr'];
-
-            echo(json_encode($arr));
-            break;
-
-        case "getAllTags":
-            $query = "SELECT tag_name,tag_id from tags";
-            $result = $conn->query($query);
-
-            $rows = array();
-            while ($r = mysqli_fetch_assoc($result)) {
-                array_push($rows, $r);
-            }
-            echo(json_encode($rows));
-            break;
-        case "addTag":
-            $movieid = $_POST['movieid'];
-            $tagid = $_POST['id'];
-
-            $query = "INSERT INTO video_tags(tag_id, video_id) VALUES ('$tagid','$movieid')";
-
-            if ($conn->query($query) === TRUE) {
-                echo('{"result":"success"}');
-            } else {
-                echo('{"result":"' . $conn->error . '"}');
-            }
-            break;
-    }
-} else {
-    echo('{data:"error"}');
-}
-return;
-

apiGo/api/API.go

@@ -0,0 +1,48 @@
+package api
+
+import (
+	gws "github.com/gowebsecure/goWebSecure-go"
+	"github.com/gowebsecure/goWebSecure-go/oauth"
+	"openmediacenter/apiGo/database/settings"
+)
+
+const (
+	VideoNode    = iota
+	TagNode      = iota
+	SettingsNode = iota
+	ActorNode    = iota
+	TVShowNode   = iota
+)
+
+func Init() {
+	AddVideoHandlers()
+	AddSettingsHandlers()
+	AddTagHandlers()
+	AddActorsHandlers()
+	AddTvshowHandlers()
+
+	gws.AddAPINode("video", VideoNode, true)
+	gws.AddAPINode("tags", TagNode, true)
+	gws.AddAPINode("settings", SettingsNode, true)
+	gws.AddAPINode("actor", ActorNode, true)
+	gws.AddAPINode("tvshow", TVShowNode, true)
+
+	// serverinit is blocking
+	gws.ServerInit(func(id string) (oauth.CustomClientInfo, error) {
+		password := settings.GetPassword()
+		// if password not set assign default password
+		if password == nil {
+			defaultpassword := "openmediacenter"
+			password = &defaultpassword
+		}
+
+		clientinfo := oauth.CustomClientInfo{
+			ID:     "openmediacenter",
+			Secret: *password,
+			Domain: "http://localhost:8081",
+			UserID: "openmediacenter",
+		}
+
+		return clientinfo, nil
+	}, 8080)
+}

apiGo/api/Actors.go

@@ -0,0 +1,155 @@
+package api
+
+import (
+	"fmt"
+	gws "github.com/gowebsecure/goWebSecure-go"
+	"openmediacenter/apiGo/api/types"
+	"openmediacenter/apiGo/database"
+)
+
+func AddActorsHandlers() {
+	saveActorsToDB()
+	getActorsFromDB()
+}
+
+func getActorsFromDB() {
+	/**
+	 * @api {post} /api/actor [getAllActors]
+	 * @apiDescription Get all available Actors
+	 * @apiName getAllActors
+	 * @apiGroup Actor
+	 *
+	 * @apiSuccess {Object[]} . Array of Actors available
+	 * @apiSuccess {uint32} .ActorId Actor Id
+	 * @apiSuccess {string} .Name Actor Name
+	 * @apiSuccess {string} .Thumbnail Portrait Thumbnail
+	 */
+	gws.AddHandler("getAllActors", ActorNode, func(info *gws.HandlerInfo) []byte {
+		query := "SELECT actor_id, name, thumbnail FROM actors"
+		return jsonify(readActorsFromResultset(database.Query(query)))
+	})
+
+	/**
+	 * @api {post} /api/actor [getActorsOfVideo]
+	 * @apiDescription Get all actors playing in one video
+	 * @apiName getActorsOfVideo
+	 * @apiGroup Actor
+	 *
+	 * @apiParam {int} MovieId ID of video
+	 *
+	 * @apiSuccess {Object[]} . Array of Actors available
+	 * @apiSuccess {uint32} .ActorId Actor Id
+	 * @apiSuccess {string} .Name Actor Name
+	 * @apiSuccess {string} .Thumbnail Portrait Thumbnail
+	 */
+	gws.AddHandler("getActorsOfVideo", ActorNode, func(info *gws.HandlerInfo) []byte {
+		var args struct {
+			MovieId int
+		}
+		if err := FillStruct(&args, info.Data); err != nil {
+			fmt.Println(err.Error())
+			return nil
+		}
+
+		query := fmt.Sprintf(`SELECT a.actor_id, name, thumbnail FROM actors_videos
+									JOIN actors a on actors_videos.actor_id = a.actor_id
+									WHERE actors_videos.video_id=%d`, args.MovieId)
+
+		return jsonify(readActorsFromResultset(database.Query(query)))
+	})
+
+	/**
+	 * @api {post} /api/actor [getActorInfo]
+	 * @apiDescription Get all infos for an actor
+	 * @apiName getActorInfo
+	 * @apiGroup Actor
+	 *
+	 * @apiParam {int} ActorId ID of Actor
+	 *
+	 * @apiSuccess {VideoUnloadedType[]} Videos Array of Videos this actor plays in
+	 * @apiSuccess {uint32} Videos.MovieId Video Id
+	 * @apiSuccess {string} Videos.MovieName Video Name
+	 *
+	 * @apiSuccess {Info} Info Infos about the actor
+	 * @apiSuccess {uint32} Info.ActorId Actor Id
+	 * @apiSuccess {string} Info.Name Actor Name
+	 * @apiSuccess {string} Info.Thumbnail Actor Thumbnail
+	 */
+	gws.AddHandler("getActorInfo", ActorNode, func(info *gws.HandlerInfo) []byte {
+		var args struct {
+			ActorId int
+		}
+		if err := FillStruct(&args, info.Data); err != nil {
+			fmt.Println(err.Error())
+			return nil
+		}
+
+		query := fmt.Sprintf(`SELECT movie_id, movie_name FROM actors_videos
+										JOIN videos v on v.movie_id = actors_videos.video_id
+										WHERE actors_videos.actor_id=%d`, args.ActorId)
+		videos := readVideosFromResultset(database.Query(query))
+
+		query = fmt.Sprintf("SELECT actor_id, name, thumbnail FROM actors WHERE actor_id=%d", args.ActorId)
+		actor := readActorsFromResultset(database.Query(query))[0]
+
+		var result = struct {
+			Videos []types.VideoUnloadedType
+			Info   types.Actor
+		}{
+			Videos: videos,
+			Info:   actor,
+		}
+
+		return jsonify(result)
+	})
+}
+
+func saveActorsToDB() {
+	/**
+	 * @api {post} /api/video [createActor]
+	 * @apiDescription Create a new Actor
+	 * @apiName createActor
+	 * @apiGroup Actor
+	 *
+	 * @apiParam {string} ActorName Name of new Actor
+	 *
+	 * @apiSuccess {string} result 'success' if successfully or error message if not
+	 */
+	gws.AddHandler("createActor", ActorNode, func(info *gws.HandlerInfo) []byte {
+		var args struct {
+			ActorName string
+		}
+		if err := FillStruct(&args, info.Data); err != nil {
+			fmt.Println(err.Error())
+			return nil
+		}
+
+		query := "INSERT IGNORE INTO actors (name) VALUES (?)"
+		return database.SuccessQuery(query, args.ActorName)
+	})
+
+	/**
+	 * @api {post} /api/video [addActorToVideo]
+	 * @apiDescription Add Actor to Video
+	 * @apiName addActorToVideo
+	 * @apiGroup Actor
+	 *
+	 * @apiParam {int} ActorId Id of Actor
+	 * @apiParam {int} MovieId Id of Movie to add to
+	 *
+	 * @apiSuccess {string} result 'success' if successfully or error message if not
+	 */
+	gws.AddHandler("addActorToVideo", ActorNode, func(info *gws.HandlerInfo) []byte {
+		var args struct {
+			ActorId int
+			MovieId int
+		}
+		if err := FillStruct(&args, info.Data); err != nil {
+			fmt.Println(err.Error())
+			return nil
+		}
+
+		query := fmt.Sprintf("INSERT IGNORE INTO actors_videos (actor_id, video_id) VALUES (%d,%d)", args.ActorId, args.MovieId)
+		return database.SuccessQuery(query)
+	})
+}

apiGo/api/Helpers.go

@@ -0,0 +1,130 @@
+package api
+
+import (
+	"database/sql"
+	"encoding/json"
+	"fmt"
+	"openmediacenter/apiGo/api/types"
+	"reflect"
+)
+
+// MovieId - MovieName : pay attention to the order!
+func readVideosFromResultset(rows *sql.Rows) []types.VideoUnloadedType {
+	result := []types.VideoUnloadedType{}
+	for rows.Next() {
+		var vid types.VideoUnloadedType
+		err := rows.Scan(&vid.MovieId, &vid.MovieName)
+		if err != nil {
+			panic(err.Error()) // proper error handling instead of panic in your app
+		}
+		result = append(result, vid)
+	}
+	rows.Close()
+
+	return result
+}
+
+// TagID - TagName : pay attention to the order!
+func readTagsFromResultset(rows *sql.Rows) []types.Tag {
+	// initialize with empty array!
+	result := []types.Tag{}
+	for rows.Next() {
+		var tag types.Tag
+		err := rows.Scan(&tag.TagId, &tag.TagName)
+		if err != nil {
+			panic(err.Error()) // proper error handling instead of panic in your app
+		}
+		result = append(result, tag)
+	}
+	rows.Close()
+
+	return result
+}
+
+// ActorId - ActorName - Thumbnail : pay attention to the order!
+func readActorsFromResultset(rows *sql.Rows) []types.Actor {
+	var result []types.Actor
+	for rows.Next() {
+		var actor types.Actor
+		var thumbnail []byte
+
+		err := rows.Scan(&actor.ActorId, &actor.Name, &thumbnail)
+		if len(thumbnail) != 0 {
+			actor.Thumbnail = string(thumbnail)
+		}
+		if err != nil {
+			panic(err.Error()) // proper error handling instead of panic in your app
+		}
+		result = append(result, actor)
+	}
+	rows.Close()
+
+	return result
+}
+
+// ID - Name : pay attention to the order!
+func readTVshowsFromResultset(rows *sql.Rows) []types.TVShow {
+	result := []types.TVShow{}
+	for rows.Next() {
+		var vid types.TVShow
+		err := rows.Scan(&vid.Id, &vid.Name)
+		if err != nil {
+			panic(err.Error()) // proper error handling instead of panic in your app
+		}
+		result = append(result, vid)
+	}
+	rows.Close()
+
+	return result
+}
+
+func jsonify(v interface{}) []byte {
+	// jsonify results
+	str, err := json.Marshal(v)
+	if err != nil {
+		fmt.Println("Error while Jsonifying return object: " + err.Error())
+	}
+	return str
+}
+
+// setField set a specific field of an object with an object provided
+func setField(obj interface{}, name string, value interface{}) error {
+	structValue := reflect.ValueOf(obj).Elem()
+	structFieldValue := structValue.FieldByName(name)
+
+	if !structFieldValue.IsValid() {
+		return fmt.Errorf("no such field: %s in obj", name)
+	}
+
+	if !structFieldValue.CanSet() {
+		return fmt.Errorf("cannot set %s field value", name)
+	}
+
+	structFieldType := structFieldValue.Type()
+	val := reflect.ValueOf(value)
+
+	if structFieldType != val.Type() {
+		if val.Type().ConvertibleTo(structFieldType) {
+			// if type is convertible - convert and set
+			structFieldValue.Set(val.Convert(structFieldType))
+		} else {
+			return fmt.Errorf("provided value %s type didn't match obj field type and isn't convertible", name)
+		}
+	} else {
+		// set value if type is the same
+		structFieldValue.Set(val)
+	}
+
+	return nil
+}
+
+// FillStruct fill a custom struct with objects of a map
+func FillStruct(i interface{}, m map[string]interface{}) error {
+	for k, v := range m {
+		err := setField(i, k, v)
+		if err != nil {
+			return err
+		}
+	}
+	return nil
+}

apiGo/api/Settings.go

@@ -0,0 +1,175 @@
+package api
+
+import (
+	"encoding/json"
+	"fmt"
+	gws "github.com/gowebsecure/goWebSecure-go"
+	"openmediacenter/apiGo/api/types"
+	"openmediacenter/apiGo/database"
+	"openmediacenter/apiGo/database/settings"
+	"openmediacenter/apiGo/videoparser"
+	"regexp"
+	"strings"
+)
+
+func AddSettingsHandlers() {
+	saveSettingsToDB()
+	getSettingsFromDB()
+	reIndexHandling()
+}
+
+func getSettingsFromDB() {
+	/**
+	 * @api {post} /api/settings [loadGeneralSettings]
+	 * @apiDescription Get the settings object
+	 * @apiName loadGeneralSettings
+	 * @apiGroup Settings
+	 *
+	 * @apiSuccess {Object} Settings Settings object
+	 * @apiSuccess {string} Settings.VideoPath webserver path to the videos
+	 * @apiSuccess {string} Settings.EpisodePath webserver path to the tvshows
+	 * @apiSuccess {string} Settings.MediacenterName overall name of the mediacenter
+	 * @apiSuccess {string} Settings.Password new server password (-1 if no password set)
+	 * @apiSuccess {bool} Settings.TMDBGrabbing TMDB grabbing support to grab tag info and thumbnails
+	 * @apiSuccess {bool} Settings.DarkMode Darkmode enabled?
+	 * @apiSuccess {Object} Sizes Sizes object
+	 * @apiSuccess {uint32} Sizes.VideoNr total number of videos
+	 * @apiSuccess {float32} Sizes.DBSize total size of database
+	 * @apiSuccess {uint32} Sizes.DifferentTags number of different tags available
+	 * @apiSuccess {uint32} Sizes.TagsAdded number of different tags added to videos
+	 */
+	gws.AddHandler("loadGeneralSettings", SettingsNode, func(info *gws.HandlerInfo) []byte {
+		result, _, sizes := database.GetSettings()
+
+		var ret = struct {
+			Settings *types.SettingsType
+			Sizes    *types.SettingsSizeType
+		}{
+			Settings: &result,
+			Sizes:    &sizes,
+		}
+		return jsonify(ret)
+	})
+
+	/**
+	 * @api {post} /api/settings [loadInitialData]
+	 * @apiDescription load startdata to display on homepage
+	 * @apiName loadInitialData
+	 * @apiGroup Settings
+	 *
+	 * @apiSuccess {string} VideoPath webserver path to the videos
+	 * @apiSuccess {string} EpisodePath webserver path to the tvshows
+	 * @apiSuccess {string} MediacenterName overall name of the mediacenter
+	 * @apiSuccess {string} Pasword new server password (-1 if no password set)
+	 * @apiSuccess {bool} DarkMode Darkmode enabled?
+	 * @apiSuccess {bool} TVShowEnabled is are TVShows enabled
+	 */
+	gws.AddHandler("loadInitialData", SettingsNode, func(info *gws.HandlerInfo) []byte {
+		sett := settings.LoadSettings()
+
+		type InitialDataTypeResponse struct {
+			DarkMode        bool
+			Pasword         bool
+			MediacenterName string
+			VideoPath       string
+			TVShowPath      string
+			TVShowEnabled   bool
+		}
+
+		regexMatchUrl := regexp.MustCompile("^http(|s)://([0-9]){1,3}\\.([0-9]){1,3}\\.([0-9]){1,3}\\.([0-9]){1,3}:[0-9]{1,5}")
+		videoUrl := regexMatchUrl.FindString(sett.VideoPath)
+		tvshowurl := regexMatchUrl.FindString(sett.TVShowPath)
+		serverVideoPath := strings.TrimPrefix(sett.VideoPath, videoUrl)
+		serverTVShowPath := strings.TrimPrefix(sett.TVShowPath, tvshowurl)
+
+		res := InitialDataTypeResponse{
+			DarkMode:        sett.DarkMode,
+			Pasword:         sett.Pasword != "-1",
+			MediacenterName: sett.MediacenterName,
+			VideoPath:       serverVideoPath,
+			TVShowPath:      serverTVShowPath,
+			TVShowEnabled:   settings.TVShowsEnabled(),
+		}
+
+		str, _ := json.Marshal(res)
+		return str
+	})
+}
+
+func saveSettingsToDB() {
+	/**
+	 * @api {post} /api/settings [saveGeneralSettings]
+	 * @apiDescription Save the global settings provided
+	 * @apiName saveGeneralSettings
+	 * @apiGroup Settings
+	 *
+	 * @apiParam {string} VideoPath webserver path to the videos
+	 * @apiParam {string} EpisodePath webserver path to the tvshows
+	 * @apiParam {string} MediacenterName overall name of the mediacenter
+	 * @apiParam {string} Password new server password (-1 if no password set)
+	 * @apiParam {bool} TMDBGrabbing TMDB grabbing support to grab tag info and thumbnails
+	 * @apiParam {bool} DarkMode Darkmode enabled?
+	 *
+	 * @apiSuccess {string} result 'success' if successfully or error message if not
+	 */
+	gws.AddHandler("saveGeneralSettings", SettingsNode, func(info *gws.HandlerInfo) []byte {
+		var args types.SettingsType
+		if err := FillStruct(&args, info.Data); err != nil {
+			fmt.Println(err.Error())
+			return nil
+		}
+
+		query := `
+					UPDATE settings SET 
+                        video_path=?,
+                        episode_path=?,
+                        password=?,
+                        mediacenter_name=?,
+                        TMDB_grabbing=?, 
+                        DarkMode=?
+                    WHERE 1`
+		return database.SuccessQuery(query,
+			args.VideoPath, args.EpisodePath, args.Password,
+			args.MediacenterName, args.TMDBGrabbing, args.DarkMode)
+	})
+}
+
+// methods for handling reindexing and cleanup of db gravity
+func reIndexHandling() {
+	/**
+	 * @api {post} /api/settings [startReindex]
+	 * @apiDescription Start Database video reindex Job
+	 * @apiName startReindex
+	 * @apiGroup Settings
+	 *
+	 * @apiSuccess {string} result 'success' if successfully or error message if not
+	 */
+	gws.AddHandler("startReindex", SettingsNode, func(info *gws.HandlerInfo) []byte {
+		videoparser.StartReindex()
+		return database.ManualSuccessResponse(nil)
+	})
+
+	/**
+	 * @api {post} /api/settings [startTVShowReindex]
+	 * @apiDescription Start Database TVShow reindex job
+	 * @apiName startTVShowReindex
+	 * @apiGroup Settings
+	 *
+	 * @apiSuccess {string} result 'success' if successfully or error message if not
+	 */
+	gws.AddHandler("startTVShowReindex", SettingsNode, func(info *gws.HandlerInfo) []byte {
+		videoparser.StartTVShowReindex()
+		return database.ManualSuccessResponse(nil)
+	})
+
+	/**
+	 * @api {post} /api/settings [cleanupGravity]
+	 * @apiDescription Start Database cleanup job
+	 * @apiName cleanupGravity
+	 * @apiGroup Settings
+	 */
+	gws.AddHandler("cleanupGravity", SettingsNode, func(info *gws.HandlerInfo) []byte {
+		videoparser.StartCleanup()
+		return nil
+	})
+}

apiGo/api/TVShows.go

@@ -0,0 +1,162 @@
+package api
+
+import (
+	"fmt"
+	gws "github.com/gowebsecure/goWebSecure-go"
+	"openmediacenter/apiGo/database"
+	"openmediacenter/apiGo/database/settings"
+)
+
+func AddTvshowHandlers() {
+	// do not add handlers if tvshows not enabled
+	if !settings.TVShowsEnabled() {
+		return
+	}
+
+	/**
+	 * @api {post} /api/tvshow [getTVShows]
+	 * @apiDescription get all available tv shows
+	 * @apiName getTVShows
+	 * @apiGroup TVshow
+	 *
+	 * @apiSuccess {Object[]} .
+	 * @apiSuccess {uint32} .Id tvshow id
+	 * @apiSuccess {string} .Name tvshow name
+	 */
+	gws.AddHandler("getTVShows", TVShowNode, func(info *gws.HandlerInfo) []byte {
+		query := "SELECT id, name FROM tvshow"
+		rows := database.Query(query)
+		return jsonify(readTVshowsFromResultset(rows))
+	})
+
+	/**
+	 * @api {post} /api/tvshow [getEpisodes]
+	 * @apiDescription get all Episodes of a TVShow
+	 * @apiName getEpisodes
+	 * @apiGroup TVshow
+	 *
+	 * @apiParam {uint32} ShowID id of tvshow to get episodes from
+	 *
+	 * @apiSuccess {Object[]} .
+	 * @apiSuccess {uint32} .ID episode id
+	 * @apiSuccess {string} .Name episode name
+	 * @apiSuccess {uint8} .Season Season number
+	 * @apiSuccess {uint8} .Episode Episode number
+	 */
+	gws.AddHandler("getEpisodes", TVShowNode, func(info *gws.HandlerInfo) []byte {
+		var args struct {
+			ShowID uint32
+		}
+		if err := FillStruct(&args, info.Data); err != nil {
+			fmt.Println(err.Error())
+			return nil
+		}
+
+		query := fmt.Sprintf("SELECT id, name, season, episode FROM tvshow_episodes WHERE tvshow_id=%d", args.ShowID)
+		rows := database.Query(query)
+
+		type Episode struct {
+			ID      uint32
+			Name    string
+			Season  uint8
+			Episode uint8
+		}
+
+		episodes := []Episode{}
+		for rows.Next() {
+			var ep Episode
+			err := rows.Scan(&ep.ID, &ep.Name, &ep.Season, &ep.Episode)
+			if err != nil {
+				fmt.Println(err.Error())
+				continue
+			}
+
+			episodes = append(episodes, ep)
+		}
+
+		return jsonify(episodes)
+	})
+
+	/**
+	 * @api {post} /api/tvshow [loadEpisode]
+	 * @apiDescription load all info of episode
+	 * @apiName loadEpisode
+	 * @apiGroup TVshow
+	 *
+	 * @apiParam {uint32} ID id of episode
+	 *
+	 * @apiSuccess {uint32} TVShowID episode id
+	 * @apiSuccess {string} Name episode name
+	 * @apiSuccess {uint8} Season Season number
+	 * @apiSuccess {uint8} Episode Episode number
+	 * @apiSuccess {string} Path webserver path of video file
+	 */
+	gws.AddHandler("loadEpisode", TVShowNode, func(info *gws.HandlerInfo) []byte {
+		var args struct {
+			ID uint32
+		}
+		if err := FillStruct(&args, info.Data); err != nil {
+			fmt.Println(err.Error())
+			return nil
+		}
+
+		query := fmt.Sprintf(`
+SELECT tvshow_episodes.name, season, tvshow_id, episode, filename, t.foldername
+FROM tvshow_episodes 
+JOIN tvshow t on t.id = tvshow_episodes.tvshow_id
+WHERE tvshow_episodes.id=%d`, args.ID)
+		row := database.QueryRow(query)
+
+		var ret struct {
+			Name     string
+			Season   uint8
+			Episode  uint8
+			TVShowID uint32
+			Path     string
+		}
+		var filename string
+		var foldername string
+
+		err := row.Scan(&ret.Name, &ret.Season, &ret.TVShowID, &ret.Episode, &filename, &foldername)
+		if err != nil {
+			fmt.Println(err.Error())
+			return nil
+		}
+
+		ret.Path = foldername + "/" + filename
+
+		return jsonify(ret)
+	})
+
+	/**
+	 * @api {post} /api/tvshow [readThumbnail]
+	 * @apiDescription Load Thubnail of specific episode
+	 * @apiName readThumbnail
+	 * @apiGroup TVshow
+	 *
+	 * @apiParam {int} Id id of episode to load thumbnail
+	 *
+	 * @apiSuccess {string} . Base64 encoded Thubnail
+	 */
+	gws.AddHandler("readThumbnail", TVShowNode, func(info *gws.HandlerInfo) []byte {
+		var args struct {
+			Id int
+		}
+		if err := FillStruct(&args, info.Data); err != nil {
+			fmt.Println(err.Error())
+			return nil
+		}
+
+		var pic []byte
+
+		query := fmt.Sprintf("SELECT thumbnail FROM tvshow WHERE id=%d", args.Id)
+
+		err := database.QueryRow(query).Scan(&pic)
+		if err != nil {
+			fmt.Printf("the thumbnail of movie id %d couldn't be found", args.Id)
+			return nil
+		}
+
+		return pic
+	})
+}

apiGo/api/Tags.go

@@ -0,0 +1,132 @@
+package api
+
+import (
+	"fmt"
+	gws "github.com/gowebsecure/goWebSecure-go"
+	"openmediacenter/apiGo/database"
+	"regexp"
+)
+
+func AddTagHandlers() {
+	getFromDB()
+	addToDB()
+	deleteFromDB()
+}
+
+func deleteFromDB() {
+	/**
+	 * @api {post} /api/tags [deleteTag]
+	 * @apiDescription Start Database video reindex Job
+	 * @apiName deleteTag
+	 * @apiGroup Tags
+	 *
+	 * @apiParam {bool} [Force] force delete tag with its constraints
+	 * @apiParam {int} TagId id of tag to delete
+	 *
+	 * @apiSuccess {string} result 'success' if successfully or error message if not
+	 */
+	gws.AddHandler("deleteTag", TagNode, func(info *gws.HandlerInfo) []byte {
+		var args struct {
+			TagId int
+			Force bool
+		}
+		if err := FillStruct(&args, info.Data); err != nil {
+			fmt.Println(err.Error())
+			return nil
+		}
+
+		// delete key constraints first
+		if args.Force {
+			query := fmt.Sprintf("DELETE FROM video_tags WHERE tag_id=%d", args.TagId)
+			err := database.Edit(query)
+
+			// respond only if result not successful
+			if err != nil {
+				return database.ManualSuccessResponse(err)
+			}
+		}
+
+		query := fmt.Sprintf("DELETE FROM tags WHERE tag_id=%d", args.TagId)
+		err := database.Edit(query)
+
+		if err == nil {
+			// return if successful
+			return database.ManualSuccessResponse(err)
+		} else {
+			// check with regex if its the key constraint error
+			r := regexp.MustCompile("^.*a foreign key constraint fails.*$")
+			if r.MatchString(err.Error()) {
+				return database.ManualSuccessResponse(fmt.Errorf("not empty tag"))
+			} else {
+				return database.ManualSuccessResponse(err)
+			}
+		}
+	})
+}
+
+func getFromDB() {
+	/**
+	 * @api {post} /api/tags [getAllTags]
+	 * @apiDescription get all available Tags
+	 * @apiName getAllTags
+	 * @apiGroup Tags
+	 *
+	 * @apiSuccess {Object[]} array of tag objects
+	 * @apiSuccess {uint32} TagId
+	 * @apiSuccess {string} TagName name of the Tag
+	 */
+	gws.AddHandler("getAllTags", TagNode, func(info *gws.HandlerInfo) []byte {
+		query := "SELECT tag_id,tag_name from tags"
+		return jsonify(readTagsFromResultset(database.Query(query)))
+	})
+}
+
+func addToDB() {
+	/**
+	 * @api {post} /api/tags [createTag]
+	 * @apiDescription create a new tag
+	 * @apiName createTag
+	 * @apiGroup Tags
+	 *
+	 * @apiParam {string} TagName name of the tag
+	 *
+	 * @apiSuccess {string} result 'success' if successfully or error message if not
+	 */
+	gws.AddHandler("createTag", TagNode, func(info *gws.HandlerInfo) []byte {
+		var args struct {
+			TagName string
+		}
+		if err := FillStruct(&args, info.Data); err != nil {
+			fmt.Println(err.Error())
+			return nil
+		}
+
+		query := "INSERT IGNORE INTO tags (tag_name) VALUES (?)"
+		return database.SuccessQuery(query, args.TagName)
+	})
+
+	/**
+	 * @api {post} /api/tags [addTag]
+	 * @apiDescription Add new tag to video
+	 * @apiName addTag
+	 * @apiGroup Tags
+	 *
+	 * @apiParam {int} TagId Tag id to add to video
+	 * @apiParam {int} MovieId Video Id of video to add tag to
+	 *
+	 * @apiSuccess {string} result 'success' if successfully or error message if not
+	 */
+	gws.AddHandler("addTag", TagNode, func(info *gws.HandlerInfo) []byte {
+		var args struct {
+			MovieId int
+			TagId   int
+		}
+		if err := FillStruct(&args, info.Data); err != nil {
+			fmt.Println(err.Error())
+			return nil
+		}
+
+		query := "INSERT IGNORE INTO video_tags(tag_id, video_id) VALUES (?,?)"
+		return database.SuccessQuery(query, args.TagId, args.MovieId)
+	})
+}

apiGo/api/Video.go

@@ -0,0 +1,450 @@
+package api
+
+import (
+	"encoding/json"
+	"fmt"
+	gws "github.com/gowebsecure/goWebSecure-go"
+	"net/url"
+	"openmediacenter/apiGo/api/types"
+	"openmediacenter/apiGo/database"
+	"strconv"
+)
+
+func AddVideoHandlers() {
+	getVideoHandlers()
+	loadVideosHandlers()
+	addToVideoHandlers()
+}
+
+func getVideoHandlers() {
+	/**
+	 * @api {post} /api/video [getMovies]
+	 * @apiDescription Request available Videos
+	 * @apiName GetMovies
+	 * @apiGroup video
+	 *
+	 * @apiParam {int} [Tag=1] id of VideoTag to get videos (1=all)
+	 *
+	 * @apiSuccess {Object[]} Videos List of Videos
+	 * @apiSuccess {number} Videos.MovieId Id of Video
+	 * @apiSuccess {String} Videos.MovieName  Name of video
+	 * @apiSuccess {String} TagName Name of the Tag returned
+	 */
+	gws.AddHandler("getMovies", VideoNode, func(info *gws.HandlerInfo) []byte {
+		var args struct {
+			Tag  uint32
+			Sort uint8
+		}
+		if err := FillStruct(&args, info.Data); err != nil {
+			fmt.Println(err.Error())
+			return nil
+		}
+
+		const (
+			date   = iota
+			likes  = iota
+			random = iota
+			names  = iota
+			length = iota
+		)
+
+		// if wrong number passed no sorting is performed
+		var SortClause = ""
+		switch args.Sort {
+		case date:
+			SortClause = "ORDER BY create_date DESC, movie_name"
+			break
+		case likes:
+			SortClause = "ORDER BY likes DESC"
+			break
+		case random:
+			SortClause = "ORDER BY RAND()"
+			break
+		case names:
+			SortClause = "ORDER BY movie_name"
+			break
+		case length:
+			SortClause = "ORDER BY length DESC"
+			break
+		}
+
+		var query string
+		// 1 is the id of the ALL tag
+		if args.Tag != 1 {
+			query = fmt.Sprintf(`SELECT movie_id,movie_name,t.tag_name FROM videos
+					INNER JOIN video_tags vt on videos.movie_id = vt.video_id
+					INNER JOIN tags t on vt.tag_id = t.tag_id
+					WHERE t.tag_id = %d %s`, args.Tag, SortClause)
+		} else {
+			query = fmt.Sprintf("SELECT movie_id,movie_name, (SELECT 'All' as tag_name) FROM videos %s", SortClause)
+		}
+
+		var result struct {
+			Videos  []types.VideoUnloadedType
+			TagName string
+		}
+
+		rows := database.Query(query)
+		vids := []types.VideoUnloadedType{}
+		var name string
+		for rows.Next() {
+			var vid types.VideoUnloadedType
+			err := rows.Scan(&vid.MovieId, &vid.MovieName, &name)
+			if err != nil {
+				return nil
+			}
+			vids = append(vids, vid)
+		}
+		if rows.Close() != nil {
+			return nil
+		}
+
+		// if the tag id doesn't exist the query won't return a name
+		if name == "" {
+			return nil
+		}
+
+		result.Videos = vids
+		result.TagName = name
+		// jsonify results
+		str, _ := json.Marshal(result)
+		return str
+	})
+
+	/**
+	 * @api {post} /api/video [readThumbnail]
+	 * @apiDescription Load Thubnail of specific Video
+	 * @apiName readThumbnail
+	 * @apiGroup video
+	 *
+	 * @apiParam {int} Movieid id of video to load thumbnail
+	 *
+	 * @apiSuccess {string} . Base64 encoded Thubnail
+	 */
+	gws.AddHandler("readThumbnail", VideoNode, func(info *gws.HandlerInfo) []byte {
+		var args struct {
+			Movieid int
+		}
+		if err := FillStruct(&args, info.Data); err != nil {
+			fmt.Println(err.Error())
+			return nil
+		}
+
+		var pic []byte
+
+		query := fmt.Sprintf("SELECT thumbnail FROM videos WHERE movie_id=%d", args.Movieid)
+
+		err := database.QueryRow(query).Scan(&pic)
+		if err != nil {
+			fmt.Printf("the thumbnail of movie id %d couldn't be found", args.Movieid)
+			return nil
+		}
+
+		return pic
+	})
+
+	/**
+	 * @api {post} /api/video [getRandomMovies]
+	 * @apiDescription Load random videos
+	 * @apiName getRandomMovies
+	 * @apiGroup video
+	 *
+	 * @apiParam {int} Number number of random videos to load
+	 *
+	 * @apiSuccess {Object[]} Tags Array of tags occuring in selection
+	 * @apiSuccess {string} Tags.TagName Tagname
+	 * @apiSuccess {uint32} Tags.TagId Tag ID
+	 *
+	 * @apiSuccess {Object[]} Videos Array of the videos
+	 * @apiSuccess {string} Videos.MovieName Video Name
+	 * @apiSuccess {int} Videos.MovieId Video ID
+	 */
+	gws.AddHandler("getRandomMovies", VideoNode, func(info *gws.HandlerInfo) []byte {
+		var args struct {
+			Number int
+		}
+		if err := FillStruct(&args, info.Data); err != nil {
+			fmt.Println(err.Error())
+			return nil
+		}
+
+		var result struct {
+			Tags   []types.Tag
+			Videos []types.VideoUnloadedType
+		}
+
+		query := fmt.Sprintf("SELECT movie_id,movie_name FROM videos ORDER BY RAND() LIMIT %d", args.Number)
+		result.Videos = readVideosFromResultset(database.Query(query))
+
+		var ids string
+		for i := range result.Videos {
+			ids += "video_tags.video_id=" + strconv.Itoa(result.Videos[i].MovieId)
+
+			if i < len(result.Videos)-1 {
+				ids += " OR "
+			}
+		}
+
+		// add the corresponding tags
+		query = fmt.Sprintf(`SELECT t.tag_name,t.tag_id FROM video_tags
+									INNER JOIN tags t on video_tags.tag_id = t.tag_id
+									WHERE %s
+									GROUP BY t.tag_id`, ids)
+
+		rows := database.Query(query)
+
+		for rows.Next() {
+			var tag types.Tag
+			err := rows.Scan(&tag.TagName, &tag.TagId)
+			if err != nil {
+				panic(err.Error()) // proper error handling instead of panic in your app
+			}
+			// append to final array
+			result.Tags = append(result.Tags, tag)
+		}
+
+		// jsonify results
+		str, _ := json.Marshal(result)
+		return str
+	})
+
+	/**
+	 * @api {post} /api/video [getSearchKeyWord]
+	 * @apiDescription Get videos for search keyword
+	 * @apiName getSearchKeyWord
+	 * @apiGroup video
+	 *
+	 * @apiParam {string} KeyWord Keyword to search for
+	 *
+	 * @apiSuccess {Object[]} . List of Videos
+	 * @apiSuccess {number} .MovieId Id of Video
+	 * @apiSuccess {String} .MovieName  Name of video
+	 */
+	gws.AddHandler("getSearchKeyWord", VideoNode, func(info *gws.HandlerInfo) []byte {
+		var args struct {
+			KeyWord string
+		}
+		if err := FillStruct(&args, info.Data); err != nil {
+			fmt.Println(err.Error())
+			return nil
+		}
+
+		query := fmt.Sprintf(`SELECT movie_id,movie_name FROM videos 
+					WHERE movie_name LIKE '%%%s%%'
+					ORDER BY likes DESC, create_date DESC, movie_name`, args.KeyWord)
+
+		result := readVideosFromResultset(database.Query(query))
+		// jsonify results
+		str, _ := json.Marshal(result)
+		return str
+	})
+}
+
+// function to handle stuff for loading specific videos and startdata
+func loadVideosHandlers() {
+	/**
+	 * @api {post} /api/video [loadVideo]
+	 * @apiDescription Load all data for a specific video
+	 * @apiName loadVideo
+	 * @apiGroup video
+	 *
+	 * @apiParam {int} MovieId ID of video
+	 *
+	 * @apiSuccess {string} MovieName Videoname
+	 * @apiSuccess {uint32} MovieId Video ID
+	 * @apiSuccess {string} MovieUrl Url to video file
+	 * @apiSuccess {string} Poster Base64 encoded Poster
+	 * @apiSuccess {uint64} Likes Number of likes
+	 * @apiSuccess {uint16} Quality Video FrameWidth
+	 * @apiSuccess {uint16} Length Video Length in seconds
+	 *
+	 *
+	 * @apiSuccess {Object[]} Tags Array of tags of video
+	 * @apiSuccess {string} Tags.TagName Tagname
+	 * @apiSuccess {uint32} Tags.TagId Tag ID
+	 *
+	 * @apiSuccess {Object[]} SuggestedTag Array of tags for quick add suggestions
+	 * @apiSuccess {string} SuggestedTag.TagName Tagname
+	 * @apiSuccess {uint32} SuggestedTag.TagId Tag ID
+	 *
+	 * @apiSuccess {Object[]} Actors Array of Actors playing in this video
+	 * @apiSuccess {uint32} Actors.ActorId Actor Id
+	 * @apiSuccess {string} Actors.Name Actor Name
+	 * @apiSuccess {string} Actors.Thumbnail Portrait Thumbnail
+	 */
+	gws.AddHandler("loadVideo", VideoNode, func(info *gws.HandlerInfo) []byte {
+		var args struct {
+			MovieId int
+		}
+		if err := FillStruct(&args, info.Data); err != nil {
+			fmt.Println(err.Error())
+			return nil
+		}
+
+		query := fmt.Sprintf(`SELECT movie_name,movie_url,movie_id,thumbnail,poster,likes,quality,length 
+										FROM videos WHERE movie_id=%d`, args.MovieId)
+
+		var res types.FullVideoType
+		var poster []byte
+		var thumbnail []byte
+
+		err := database.QueryRow(query).Scan(&res.MovieName, &res.MovieUrl, &res.MovieId, &thumbnail, &poster, &res.Likes, &res.Quality, &res.Length)
+		if err != nil {
+			fmt.Printf("error getting full data list of videoid - %d", args.MovieId)
+			fmt.Println(err.Error())
+			return nil
+		}
+
+		// we ned to urlencode the movieurl
+		res.MovieUrl = url.PathEscape(res.MovieUrl)
+
+		// we need to stringify the pic byte array
+		res.Poster = string(poster)
+
+		// if poster in db is empty we use the thumbnail
+		if res.Poster == "" {
+			res.Poster = string(thumbnail)
+		}
+
+		// now add the tags of this video
+		query = fmt.Sprintf(`SELECT t.tag_id, t.tag_name FROM video_tags 
+					INNER JOIN tags t on video_tags.tag_id = t.tag_id
+					WHERE video_tags.video_id=%d
+					GROUP BY t.tag_id`, args.MovieId)
+
+		res.Tags = readTagsFromResultset(database.Query(query))
+
+		query = fmt.Sprintf(`SELECT * FROM tags
+					WHERE tag_id NOT IN (
+						SELECT video_tags.tag_id FROM video_tags
+					WHERE video_id=%d)
+					ORDER BY rand()
+					LIMIT 5`, args.MovieId)
+
+		res.SuggestedTag = readTagsFromResultset(database.Query(query))
+
+		// query the actors corresponding to video
+		query = fmt.Sprintf(`SELECT a.actor_id, name, thumbnail FROM actors_videos
+					JOIN actors a on actors_videos.actor_id = a.actor_id
+					WHERE actors_videos.video_id=%d`, args.MovieId)
+
+		res.Actors = readActorsFromResultset(database.Query(query))
+
+		// jsonify results
+		str, _ := json.Marshal(res)
+		return str
+	})
+
+	/**
+	 * @api {post} /api/video [getStartData]
+	 * @apiDescription Get general video informations at start
+	 * @apiName getStartData
+	 * @apiGroup video
+	 *
+	 * @apiSuccess {uint32} VideoNr Total nr of videos
+	 * @apiSuccess {uint32} FullHdNr number of FullHD videos
+	 * @apiSuccess {uint32} HDNr number of HD videos
+	 * @apiSuccess {uint32} SDNr number of SD videos
+	 * @apiSuccess {uint32} DifferentTags number of different Tags available
+	 * @apiSuccess {uint32} Tagged number of different Tags assigned
+	 */
+	gws.AddHandler("getStartData", VideoNode, func(info *gws.HandlerInfo) []byte {
+		var result types.StartData
+		// query settings and infotile values
+		query := `
+					SELECT (
+						SELECT COUNT(*) FROM videos
+					) AS videonr,
+					(
+						SELECT COUNT(*) FROM videos
+                        INNER JOIN video_tags vt on videos.movie_id = vt.video_id
+                        INNER JOIN tags t on vt.tag_id = t.tag_id
+					) AS tagged,
+					(
+						SELECT COUNT(*) FROM video_tags as vt
+                        INNER JOIN tags t on vt.tag_id = t.tag_id
+                        WHERE t.tag_name='hd'
+					) AS hd,
+					(
+						SELECT COUNT(*) FROM video_tags as vt
+                        INNER JOIN tags t on vt.tag_id = t.tag_id
+                        WHERE t.tag_name='fullhd'
+					) AS fullhd,
+					(
+						SELECT COUNT(*) FROM video_tags as vt
+                        INNER JOIN tags t on vt.tag_id = t.tag_id
+                        WHERE t.tag_name='lowquality'
+					) AS lq,
+					(
+						SELECT COUNT(*) as nr FROM tags
+					) as tags 
+					LIMIT 1`
+
+		_ = database.QueryRow(query).Scan(&result.VideoNr, &result.Tagged, &result.HDNr, &result.FullHdNr, &result.SDNr, &result.DifferentTags)
+
+		// jsonify results
+		str, _ := json.Marshal(result)
+		return str
+	})
+}
+
+func addToVideoHandlers() {
+	/**
+	 * @api {post} /api/video [addLike]
+	 * @apiDescription Add a like to a video
+	 * @apiName addLike
+	 * @apiGroup video
+	 *
+	 * @apiParam {int} MovieId ID of video
+	 *
+	 * @apiSuccess {string} result 'success' if successfully or error message if not
+	 */
+	gws.AddHandler("addLike", VideoNode, func(info *gws.HandlerInfo) []byte {
+		var args struct {
+			MovieId int
+		}
+		if err := FillStruct(&args, info.Data); err != nil {
+			fmt.Println(err.Error())
+			return nil
+		}
+
+		query := fmt.Sprintf("update videos set likes = likes + 1 where movie_id = %d", args.MovieId)
+		return database.SuccessQuery(query)
+	})
+
+	/**
+	 * @api {post} /api/video [deleteVideo]
+	 * @apiDescription Delete a specific video from database
+	 * @apiName deleteVideo
+	 * @apiGroup video
+	 *
+	 * @apiParam {int} MovieId ID of video
+	 *
+	 * @apiSuccess {string} result 'success' if successfully or error message if not
+	 */
+	gws.AddHandler("deleteVideo", VideoNode, func(info *gws.HandlerInfo) []byte {
+		var args struct {
+			MovieId int
+		}
+		if err := FillStruct(&args, info.Data); err != nil {
+			fmt.Println(err.Error())
+			return nil
+		}
+
+		// delete tag constraints
+		query := fmt.Sprintf("DELETE FROM video_tags WHERE video_id=%d", args.MovieId)
+		err := database.Edit(query)
+
+		// delete actor constraints
+		query = fmt.Sprintf("DELETE FROM actors_videos WHERE video_id=%d", args.MovieId)
+		err = database.Edit(query)
+
+		// respond only if result not successful
+		if err != nil {
+			return database.ManualSuccessResponse(err)
+		}
+
+		query = fmt.Sprintf("DELETE FROM videos WHERE movie_id=%d", args.MovieId)
+		return database.SuccessQuery(query)
+	})
+}

apiGo/api/types/Types.go

@@ -0,0 +1,61 @@
+package types
+
+type VideoUnloadedType struct {
+	MovieId   int
+	MovieName string
+}
+
+type FullVideoType struct {
+	MovieName    string
+	MovieId      uint32
+	MovieUrl     string
+	Poster       string
+	Likes        uint64
+	Quality      uint16
+	Length       uint16
+	Tags         []Tag
+	SuggestedTag []Tag
+	Actors       []Actor
+}
+
+type Tag struct {
+	TagName string
+	TagId   uint32
+}
+
+type Actor struct {
+	ActorId   uint32
+	Name      string
+	Thumbnail string
+}
+
+type StartData struct {
+	VideoNr       uint32
+	FullHdNr      uint32
+	HDNr          uint32
+	SDNr          uint32
+	DifferentTags uint32
+	Tagged        uint32
+}
+
+type SettingsType struct {
+	VideoPath       string
+	EpisodePath     string
+	MediacenterName string
+	Password        string
+	PasswordEnabled bool
+	TMDBGrabbing    bool
+	DarkMode        bool
+}
+
+type SettingsSizeType struct {
+	VideoNr       uint32
+	DBSize        float32
+	DifferentTags uint32
+	TagsAdded     uint32
+}
+
+type TVShow struct {
+	Id   uint32
+	Name string
+}

apiGo/database/Database.go

@@ -0,0 +1,133 @@
+package database
+
+import (
+	"database/sql"
+	"fmt"
+	_ "github.com/go-sql-driver/mysql"
+	"openmediacenter/apiGo/api/types"
+)
+
+var db *sql.DB
+var DBName string
+
+// store the command line parameter for Videoprefix
+var SettingsVideoPrefix = ""
+
+type DatabaseConfig struct {
+	DBHost     string
+	DBPort     int
+	DBUser     string
+	DBPassword string
+	DBName     string
+}
+
+func InitDB(dbconf *DatabaseConfig) {
+	DBName = dbconf.DBName
+
+	// Open up our database connection.
+	var err error
+	db, err = sql.Open("mysql", fmt.Sprintf("%s:%s@tcp(%s:%d)/%s", dbconf.DBUser, dbconf.DBPassword, dbconf.DBHost, dbconf.DBPort, dbconf.DBName))
+
+	// if there is an error opening the connection, handle it
+	if err != nil {
+		fmt.Printf("Error while connecting to database! - %s\n", err.Error())
+	}
+
+	if db != nil {
+		ping := db.Ping()
+		if ping != nil {
+			fmt.Printf("Error while connecting to database! - %s\n", ping.Error())
+		}
+	}
+}
+
+func Query(query string, args ...interface{}) *sql.Rows {
+	// perform a db.Query insert
+	res, err := db.Query(query, args...)
+
+	// if there is an error inserting, handle it
+	if err != nil {
+		fmt.Printf("Error while requesting data! - %s\n", err.Error())
+	}
+
+	return res
+}
+
+func QueryRow(SQL string, args ...interface{}) *sql.Row {
+	return db.QueryRow(SQL, args...)
+}
+
+// edit something in the DB  and give only an error response
+func Edit(query string, args ...interface{}) error {
+	_, err := db.Exec(query, args...)
+	return err
+}
+
+// insert/edit a query and return last insert id
+func Insert(query string, args ...interface{}) (error, int64) {
+	resp, err := db.Exec(query, args...)
+	var id int64 = 0
+	if err == nil {
+		id, err = resp.LastInsertId()
+	}
+
+	return err, id
+}
+
+func SuccessQuery(query string, args ...interface{}) []byte {
+	return ManualSuccessResponse(Edit(query, args...))
+}
+
+func ManualSuccessResponse(err error) []byte {
+	if err == nil {
+		return []byte(`{"result":"success"}`)
+	} else {
+		return []byte(fmt.Sprintf(`{"result":"%s"}`, err.Error()))
+	}
+}
+
+func Close() {
+	db.Close()
+}
+
+func GetSettings() (result types.SettingsType, PathPrefix string, sizes types.SettingsSizeType) {
+	// query settings and infotile values
+	query := fmt.Sprintf(`
+                SELECT (
+                           SELECT COUNT(*)
+                           FROM videos
+                       ) AS videonr,
+                       (
+                           SELECT ROUND(SUM(data_length + index_length) / 1024 / 1024, 2) AS Size
+                           FROM information_schema.TABLES
+                           WHERE TABLE_SCHEMA = '%s'
+                           GROUP BY table_schema
+                       ) AS dbsize,
+                       (
+                           SELECT COUNT(*)
+                           FROM tags
+                       ) AS difftagnr,
+                       (
+                           SELECT COUNT(*)
+                           FROM video_tags
+                       ) AS tagsadded,
+                       video_path, episode_path, password, mediacenter_name, TMDB_grabbing, DarkMode
+                FROM settings
+                LIMIT 1`, DBName)
+
+	var DarkMode int
+	var TMDBGrabbing int
+
+	err := QueryRow(query).Scan(&sizes.VideoNr, &sizes.DBSize, &sizes.DifferentTags, &sizes.TagsAdded,
+		&result.VideoPath, &result.EpisodePath, &result.Password, &result.MediacenterName, &TMDBGrabbing, &DarkMode)
+
+	if err != nil {
+		fmt.Println(err.Error())
+	}
+
+	result.TMDBGrabbing = TMDBGrabbing != 0
+	result.PasswordEnabled = result.Password != "-1"
+	result.DarkMode = DarkMode != 0
+	PathPrefix = SettingsVideoPrefix
+	return
+}

apiGo/database/settings/DBSettings.go

@@ -0,0 +1,38 @@
+package settings
+
+import (
+	"fmt"
+	"openmediacenter/apiGo/database"
+)
+
+func GetPassword() *string {
+	pwd := LoadSettings().Pasword
+	if pwd == "-1" {
+		return nil
+	} else {
+		return &pwd
+	}
+}
+
+type SettingsType struct {
+	DarkMode        bool
+	Pasword         string
+	MediacenterName string
+	VideoPath       string
+	TVShowPath      string
+}
+
+func LoadSettings() *SettingsType {
+	query := "SELECT DarkMode, password, mediacenter_name, video_path, episode_path from settings"
+
+	result := SettingsType{}
+	var darkmode uint8
+
+	err := database.QueryRow(query).Scan(&darkmode, &result.Pasword, &result.MediacenterName, &result.VideoPath, &result.TVShowPath)
+	if err != nil {
+		fmt.Println("error while parsing db data: " + err.Error())
+	}
+
+	result.DarkMode = darkmode != 0
+	return &result
+}

apiGo/database/settings/Settings.go

@@ -0,0 +1,11 @@
+package settings
+
+var tvShowEnabled bool
+
+func TVShowsEnabled() bool {
+	return tvShowEnabled
+}
+
+func SetTVShowEnabled(enabled bool) {
+	tvShowEnabled = enabled
+}

apiGo/go.mod

@@ -0,0 +1,9 @@
+module openmediacenter/apiGo
+
+go 1.16
+
+require (
+	github.com/go-sql-driver/mysql v1.5.0
+	github.com/gowebsecure/goWebSecure-go v0.1.0-beta.1
+	nhooyr.io/websocket v1.8.7
+)

apiGo/go.sum

@@ -0,0 +1,160 @@
+cloud.google.com/go v0.34.0/go.mod h1:aQUYkXzVsufM+DwF1aE+0xfcU+56JwCaLick0ClmMTw=
+github.com/ajg/form v1.5.1 h1:t9c7v8JUKu/XxOGBU0yjNpaMloxGEJhUkqFRq0ibGeU=
+github.com/ajg/form v1.5.1/go.mod h1:uL1WgH+h2mgNtvBq0339dVnzXdBETtL2LeUXaIv25UY=
+github.com/davecgh/go-spew v1.1.0/go.mod h1:J7Y8YcW2NihsgmVo/mv3lAwl/skON4iLHjSsI+c5H38=
+github.com/davecgh/go-spew v1.1.1 h1:vj9j/u1bqnvCEfJOwUhtlOARqs3+rkHYY13jYWTU97c=
+github.com/davecgh/go-spew v1.1.1/go.mod h1:J7Y8YcW2NihsgmVo/mv3lAwl/skON4iLHjSsI+c5H38=
+github.com/dgrijalva/jwt-go v3.2.0+incompatible h1:7qlOGliEKZXTDg6OTjfoBKDXWrumCAMpl/TFQ4/5kLM=
+github.com/dgrijalva/jwt-go v3.2.0+incompatible/go.mod h1:E3ru+11k8xSBh+hMPgOLZmtrrCbhqsmaPHjLKYnJCaQ=
+github.com/fasthttp-contrib/websocket v0.0.0-20160511215533-1f3b11f56072/go.mod h1:duJ4Jxv5lDcvg4QuQr0oowTf7dz4/CR8NtyCooz9HL8=
+github.com/fatih/structs v1.1.0 h1:Q7juDM0QtcnhCpeyLGQKyg4TOIghuNXrkL32pHAUMxo=
+github.com/fatih/structs v1.1.0/go.mod h1:9NiDSp5zOcgEDl+j00MP/WkGVPOlPRLejGD8Ga6PJ7M=
+github.com/fsnotify/fsnotify v1.4.7/go.mod h1:jwhsz4b93w/PPRr/qN1Yymfu8t87LnFCMoQvtojpjFo=
+github.com/gavv/httpexpect v2.0.0+incompatible h1:1X9kcRshkSKEjNJJxX9Y9mQ5BRfbxU5kORdjhlA1yX8=
+github.com/gavv/httpexpect v2.0.0+incompatible/go.mod h1:x+9tiU1YnrOvnB725RkpoLv1M62hOWzwo5OXotisrKc=
+github.com/gin-contrib/sse v0.1.0 h1:Y/yl/+YNO8GZSjAhjMsSuLt29uWRFHdHYUb5lYOV9qE=
+github.com/gin-contrib/sse v0.1.0/go.mod h1:RHrZQHXnP2xjPF+u1gW/2HnVO7nvIa9PG3Gm+fLHvGI=
+github.com/gin-gonic/gin v1.6.3 h1:ahKqKTFpO5KTPHxWZjEdPScmYaGtLo8Y4DMHoEsnp14=
+github.com/gin-gonic/gin v1.6.3/go.mod h1:75u5sXoLsGZoRN5Sgbi1eraJ4GU3++wFwWzhwvtwp4M=
+github.com/go-playground/assert/v2 v2.0.1/go.mod h1:VDjEfimB/XKnb+ZQfWdccd7VUvScMdVu0Titje2rxJ4=
+github.com/go-playground/locales v0.13.0 h1:HyWk6mgj5qFqCT5fjGBuRArbVDfE4hi8+e8ceBS/t7Q=
+github.com/go-playground/locales v0.13.0/go.mod h1:taPMhCMXrRLJO55olJkUXHZBHCxTMfnGwq/HNwmWNS8=
+github.com/go-playground/universal-translator v0.17.0 h1:icxd5fm+REJzpZx7ZfpaD876Lmtgy7VtROAbHHXk8no=
+github.com/go-playground/universal-translator v0.17.0/go.mod h1:UkSxE5sNxxRwHyU+Scu5vgOQjsIJAF8j9muTVoKLVtA=
+github.com/go-playground/validator/v10 v10.2.0 h1:KgJ0snyC2R9VXYN2rneOtQcw5aHQB1Vv0sFl1UcHBOY=
+github.com/go-playground/validator/v10 v10.2.0/go.mod h1:uOYAAleCW8F/7oMFd6aG0GOhaH6EGOAJShg8Id5JGkI=
+github.com/go-session/session v3.1.2+incompatible/go.mod h1:8B3iivBQjrz/JtC68Np2T1yBBLxTan3mn/3OM0CyRt0=
+github.com/go-sql-driver/mysql v1.5.0 h1:ozyZYNQW3x3HtqT1jira07DN2PArx2v7/mN66gGcHOs=
+github.com/go-sql-driver/mysql v1.5.0/go.mod h1:DCzpHaOWr8IXmIStZouvnhqoel9Qv2LBy8hT2VhHyBg=
+github.com/gobwas/httphead v0.0.0-20180130184737-2c6c146eadee h1:s+21KNqlpePfkah2I+gwHF8xmJWRjooY+5248k6m4A0=
+github.com/gobwas/httphead v0.0.0-20180130184737-2c6c146eadee/go.mod h1:L0fX3K22YWvt/FAX9NnzrNzcI4wNYi9Yku4O0LKYflo=
+github.com/gobwas/pool v0.2.0 h1:QEmUOlnSjWtnpRGHF3SauEiOsy82Cup83Vf2LcMlnc8=
+github.com/gobwas/pool v0.2.0/go.mod h1:q8bcK0KcYlCgd9e7WYLm9LpyS+YeLd8JVDW6WezmKEw=
+github.com/gobwas/ws v1.0.2 h1:CoAavW/wd/kulfZmSIBt6p24n4j7tHgNVCjsfHVNUbo=
+github.com/gobwas/ws v1.0.2/go.mod h1:szmBTxLgaFppYjEmNtny/v3w89xOydFnnZMcgRRu/EM=
+github.com/golang/protobuf v1.2.0/go.mod h1:6lQm79b+lXiMfvg/cZm0SGofjICqVBUtrP5yJMmIC1U=
+github.com/golang/protobuf v1.3.3/go.mod h1:vzj43D7+SQXF/4pzW/hwtAqwc6iTitCiVSaWz5lYuqw=
+github.com/golang/protobuf v1.3.5 h1:F768QJ1E9tib+q5Sc8MkdJi1RxLTbRcTf8LJV56aRls=
+github.com/golang/protobuf v1.3.5/go.mod h1:6O5/vntMXwX2lRkT1hjjk0nAC1IDOTvTlVgjlRvqsdk=
+github.com/google/go-cmp v0.4.0 h1:xsAVV57WRhGj6kEIi8ReJzQlHHqcBYCElAvkovg3B/4=
+github.com/google/go-cmp v0.4.0/go.mod h1:v8dTdLbMG2kIc/vJvl+f65V22dbkXbowE6jgT/gNBxE=
+github.com/google/go-querystring v1.0.0 h1:Xkwi/a1rcvNg1PPYe5vI8GbeBY/jrVuDX5ASuANWTrk=
+github.com/google/go-querystring v1.0.0/go.mod h1:odCYkC5MyYFN7vkCjXpyrEuKhc/BUO6wN/zVPAxq5ck=
+github.com/google/gofuzz v1.0.0/go.mod h1:dBl0BpW6vV/+mYPU4Po3pmUjxk6FQPldtuIdl/M65Eg=
+github.com/gopherjs/gopherjs v0.0.0-20181017120253-0766667cb4d1 h1:EGx4pi6eqNxGaHF6qqu48+N2wcFQ5qg5FXgOdqsJ5d8=
+github.com/gopherjs/gopherjs v0.0.0-20181017120253-0766667cb4d1/go.mod h1:wJfORRmW1u3UXTncJ5qlYoELFm8eSnnEO6hX4iZ3EWY=
+github.com/gorilla/websocket v1.4.1 h1:q7AeDBpnBk8AogcD4DSag/Ukw/KV+YhzLj2bP5HvKCM=
+github.com/gorilla/websocket v1.4.1/go.mod h1:YR8l580nyteQvAITg2hZ9XVh4b55+EU/adAjf1fMHhE=
+github.com/gowebsecure/goWebSecure-go v0.1.0-beta.1 h1:lMaNWyk5udtOAc8U+mUo2FTgNqRwT+Aj5mxDfP5qtx0=
+github.com/gowebsecure/goWebSecure-go v0.1.0-beta.1/go.mod h1:uEM+/1LS6hSBby7VKx2cHZ9btvQ/LC4K3HWKgqDRPs0=
+github.com/hpcloud/tail v1.0.0/go.mod h1:ab1qPbhIpdTxEkNHXyeSf5vhxWSCs/tWer42PpOxQnU=
+github.com/imkira/go-interpol v1.1.0 h1:KIiKr0VSG2CUW1hl1jpiyuzuJeKUUpC8iM1AIE7N1Vk=
+github.com/imkira/go-interpol v1.1.0/go.mod h1:z0h2/2T3XF8kyEPpRgJ3kmNv+C43p+I/CoI+jC3w2iA=
+github.com/json-iterator/go v1.1.9 h1:9yzud/Ht36ygwatGx56VwCZtlI/2AD15T1X2sjSuGns=
+github.com/json-iterator/go v1.1.9/go.mod h1:KdQUCv79m/52Kvf8AW2vK1V8akMuk1QjK/uOdHXbAo4=
+github.com/jtolds/gls v4.20.0+incompatible h1:xdiiI2gbIgH/gLH7ADydsJ1uDOEzR8yvV7C0MuV77Wo=
+github.com/jtolds/gls v4.20.0+incompatible/go.mod h1:QJZ7F/aHp+rZTRtaJ1ow/lLfFfVYBRgL+9YlvaHOwJU=
+github.com/k0kubun/colorstring v0.0.0-20150214042306-9440f1994b88/go.mod h1:3w7q1U84EfirKl04SVQ/s7nPm1ZPhiXd34z40TNz36k=
+github.com/klauspost/compress v1.8.2/go.mod h1:RyIbtBH6LamlWaDj8nUwkbUhJ87Yi3uG0guNDohfE1A=
+github.com/klauspost/compress v1.10.3 h1:OP96hzwJVBIHYU52pVTI6CczrxPvrGfgqF9N5eTO0Q8=
+github.com/klauspost/compress v1.10.3/go.mod h1:aoV0uJVorq1K+umq18yTdKaF57EivdYsUV+/s2qKfXs=
+github.com/klauspost/cpuid v1.2.1/go.mod h1:Pj4uuM528wm8OyEC2QMXAi2YiTZ96dNQPGgoMS4s3ek=
+github.com/leodido/go-urn v1.2.0 h1:hpXL4XnriNwQ/ABnpepYM/1vCLWNDfUNts8dX3xTG6Y=
+github.com/leodido/go-urn v1.2.0/go.mod h1:+8+nEpDfqqsY+g338gtMEUOtuK+4dEMhiQEgxpxOKII=
+github.com/mattn/go-colorable v0.1.4/go.mod h1:U0ppj6V5qS13XJ6of8GYAs25YV2eR4EVcfRqFIhoBtE=
+github.com/mattn/go-isatty v0.0.8/go.mod h1:Iq45c/XA43vh69/j3iqttzPXn0bhXyGjM0Hdxcsrc5s=
+github.com/mattn/go-isatty v0.0.12 h1:wuysRhFDzyxgEmMf5xjvJ2M9dZoWAXNNr5LSBS7uHXY=
+github.com/mattn/go-isatty v0.0.12/go.mod h1:cbi8OIDigv2wuxKPP5vlRcQ1OAZbq2CE4Kysco4FUpU=
+github.com/modern-go/concurrent v0.0.0-20180228061459-e0a39a4cb421 h1:ZqeYNhU3OHLH3mGKHDcjJRFFRrJa6eAM5H+CtDdOsPc=
+github.com/modern-go/concurrent v0.0.0-20180228061459-e0a39a4cb421/go.mod h1:6dJC0mAP4ikYIbvyc7fijjWJddQyLn8Ig3JB5CqoB9Q=
+github.com/modern-go/reflect2 v0.0.0-20180701023420-4b7aa43c6742 h1:Esafd1046DLDQ0W1YjYsBW+p8U2u7vzgW2SQVmlNazg=
+github.com/modern-go/reflect2 v0.0.0-20180701023420-4b7aa43c6742/go.mod h1:bx2lNnkwVCuqBIxFjflWJWanXIb3RllmbCylyMrvgv0=
+github.com/moul/http2curl v1.0.0 h1:dRMWoAtb+ePxMlLkrCbAqh4TlPHXvoGUSQ323/9Zahs=
+github.com/moul/http2curl v1.0.0/go.mod h1:8UbvGypXm98wA/IqH45anm5Y2Z6ep6O31QGOAZ3H0fQ=
+github.com/onsi/ginkgo v1.6.0/go.mod h1:lLunBs/Ym6LB5Z9jYTR76FiuTmxDTDusOGeTQH+WWjE=
+github.com/onsi/ginkgo v1.10.2/go.mod h1:lLunBs/Ym6LB5Z9jYTR76FiuTmxDTDusOGeTQH+WWjE=
+github.com/onsi/gomega v1.7.0/go.mod h1:ex+gbHU/CVuBBDIJjb2X0qEXbFg53c61hWP/1CpauHY=
+github.com/pmezard/go-difflib v1.0.0 h1:4DBwDE0NGyQoBHbLQYPwSUPoCMWR5BEzIk/f1lZbAQM=
+github.com/pmezard/go-difflib v1.0.0/go.mod h1:iKH77koFhYxTK1pcRnkKkqfTogsbg7gZNVY4sRDYZ/4=
+github.com/sergi/go-diff v1.0.0 h1:Kpca3qRNrduNnOQeazBd0ysaKrUJiIuISHxogkT9RPQ=
+github.com/sergi/go-diff v1.0.0/go.mod h1:0CfEIISq7TuYL3j771MWULgwwjU+GofnZX9QAmXWZgo=
+github.com/smartystreets/assertions v0.0.0-20180927180507-b2de0cb4f26d h1:zE9ykElWQ6/NYmHa3jpm/yHnI4xSofP+UP6SpjHcSeM=
+github.com/smartystreets/assertions v0.0.0-20180927180507-b2de0cb4f26d/go.mod h1:OnSkiWE9lh6wB0YB77sQom3nweQdgAjqCqsofrRNTgc=
+github.com/smartystreets/goconvey v1.6.4 h1:fv0U8FUIMPNf1L9lnHLvLhgicrIVChEkdzIKYqbNC9s=
+github.com/smartystreets/goconvey v1.6.4/go.mod h1:syvi0/a8iFYH4r/RixwvyeAJjdLS9QV7WQ/tjFTllLA=
+github.com/stretchr/objx v0.1.0/go.mod h1:HFkY916IF+rwdDfMAkV7OtwuqBVzrE8GR6GFx+wExME=
+github.com/stretchr/testify v1.3.0/go.mod h1:M5WIy9Dh21IEIfnGCwXGc5bZfKNJtfHm1UVUgZn+9EI=
+github.com/stretchr/testify v1.4.0 h1:2E4SXV/wtOkTonXsotYi4li6zVWxYlZuYNCXe9XRJyk=
+github.com/stretchr/testify v1.4.0/go.mod h1:j7eGeouHqKxXV5pUuKE4zz7dFj8WfuZ+81PSLYec5m4=
+github.com/tidwall/btree v0.0.0-20170113224114-9876f1454cf0 h1:QnyrPZZvPmR0AtJCxxfCtI1qN+fYpKTKJ/5opWmZ34k=
+github.com/tidwall/btree v0.0.0-20170113224114-9876f1454cf0/go.mod h1:huei1BkDWJ3/sLXmO+bsCNELL+Bp2Kks9OLyQFkzvA8=
+github.com/tidwall/buntdb v1.1.0 h1:H6LzK59KiNjf1nHVPFrYj4Qnl8d8YLBsYamdL8N+Bao=
+github.com/tidwall/buntdb v1.1.0/go.mod h1:Y39xhcDW10WlyYXeLgGftXVbjtM0QP+/kpz8xl9cbzE=
+github.com/tidwall/gjson v1.3.2 h1:+7p3qQFaH3fOMXAJSrdZwGKcOO/lYdGS0HqGhPqDdTI=
+github.com/tidwall/gjson v1.3.2/go.mod h1:P256ACg0Mn+j1RXIDXoss50DeIABTYK1PULOJHhxOls=
+github.com/tidwall/grect v0.0.0-20161006141115-ba9a043346eb h1:5NSYaAdrnblKByzd7XByQEJVT8+9v0W/tIY0Oo4OwrE=
+github.com/tidwall/grect v0.0.0-20161006141115-ba9a043346eb/go.mod h1:lKYYLFIr9OIgdgrtgkZ9zgRxRdvPYsExnYBsEAd8W5M=
+github.com/tidwall/match v1.0.1 h1:PnKP62LPNxHKTwvHHZZzdOAOCtsJTjo6dZLCwpKm5xc=
+github.com/tidwall/match v1.0.1/go.mod h1:LujAq0jyVjBy028G1WhWfIzbpQfMO8bBZ6Tyb0+pL9E=
+github.com/tidwall/pretty v1.0.0 h1:HsD+QiTn7sK6flMKIvNmpqz1qrpP3Ps6jOKIKMooyg4=
+github.com/tidwall/pretty v1.0.0/go.mod h1:XNkn88O1ChpSDQmQeStsy+sBenx6DDtFZJxhVysOjyk=
+github.com/tidwall/rtree v0.0.0-20180113144539-6cd427091e0e h1:+NL1GDIUOKxVfbp2KoJQD9cTQ6dyP2co9q4yzmT9FZo=
+github.com/tidwall/rtree v0.0.0-20180113144539-6cd427091e0e/go.mod h1:/h+UnNGt0IhNNJLkGikcdcJqm66zGD/uJGMRxK/9+Ao=
+github.com/tidwall/tinyqueue v0.0.0-20180302190814-1e39f5511563 h1:Otn9S136ELckZ3KKDyCkxapfufrqDqwmGjcHfAyXRrE=
+github.com/tidwall/tinyqueue v0.0.0-20180302190814-1e39f5511563/go.mod h1:mLqSmt7Dv/CNneF2wfcChfN1rvapyQr01LGKnKex0DQ=
+github.com/ugorji/go v1.1.7 h1:/68gy2h+1mWMrwZFeD1kQialdSzAb432dtpeJ42ovdo=
+github.com/ugorji/go v1.1.7/go.mod h1:kZn38zHttfInRq0xu/PH0az30d+z6vm202qpg1oXVMw=
+github.com/ugorji/go/codec v1.1.7 h1:2SvQaVZ1ouYrrKKwoSk2pzd4A9evlKJb9oTL+OaLUSs=
+github.com/ugorji/go/codec v1.1.7/go.mod h1:Ax+UKWsSmolVDwsd+7N3ZtXu+yMGCf907BLYF3GoBXY=
+github.com/valyala/bytebufferpool v1.0.0 h1:GqA5TC/0021Y/b9FG4Oi9Mr3q7XYx6KllzawFIhcdPw=
+github.com/valyala/bytebufferpool v1.0.0/go.mod h1:6bBcMArwyJ5K/AmCkWv1jt77kVWyCJ6HpOuEn7z0Csc=
+github.com/valyala/fasthttp v1.6.0 h1:uWF8lgKmeaIewWVPwi4GRq2P6+R46IgYZdxWtM+GtEY=
+github.com/valyala/fasthttp v1.6.0/go.mod h1:FstJa9V+Pj9vQ7OJie2qMHdwemEDaDiSdBnvPM1Su9w=
+github.com/valyala/tcplisten v0.0.0-20161114210144-ceec8f93295a/go.mod h1:v3UYOV9WzVtRmSR+PDvWpU/qWl4Wa5LApYYX4ZtKbio=
+github.com/xeipuuv/gojsonpointer v0.0.0-20180127040702-4e3ac2762d5f h1:J9EGpcZtP0E/raorCMxlFGSTBrsSlaDGf3jU/qvAE2c=
+github.com/xeipuuv/gojsonpointer v0.0.0-20180127040702-4e3ac2762d5f/go.mod h1:N2zxlSyiKSe5eX1tZViRH5QA0qijqEDrYZiPEAiq3wU=
+github.com/xeipuuv/gojsonreference v0.0.0-20180127040603-bd5ef7bd5415 h1:EzJWgHovont7NscjpAxXsDA8S8BMYve8Y5+7cuRE7R0=
+github.com/xeipuuv/gojsonreference v0.0.0-20180127040603-bd5ef7bd5415/go.mod h1:GwrjFmJcFw6At/Gs6z4yjiIwzuJ1/+UwLxMQDVQXShQ=
+github.com/xeipuuv/gojsonschema v1.2.0 h1:LhYJRs+L4fBtjZUfuSZIKGeVu0QRy8e5Xi7D17UxZ74=
+github.com/xeipuuv/gojsonschema v1.2.0/go.mod h1:anYRn/JVcOK2ZgGU+IjEV4nwlhoK5sQluxsYJ78Id3Y=
+github.com/yalp/jsonpath v0.0.0-20180802001716-5cc68e5049a0 h1:6fRhSjgLCkTD3JnJxvaJ4Sj+TYblw757bqYgZaOq5ZY=
+github.com/yalp/jsonpath v0.0.0-20180802001716-5cc68e5049a0/go.mod h1:/LWChgwKmvncFJFHJ7Gvn9wZArjbV5/FppcK2fKk/tI=
+github.com/yudai/gojsondiff v1.0.0 h1:27cbfqXLVEJ1o8I6v3y9lg8Ydm53EKqHXAOMxEGlCOA=
+github.com/yudai/gojsondiff v1.0.0/go.mod h1:AY32+k2cwILAkW1fbgxQ5mUmMiZFgLIV+FBNExI05xg=
+github.com/yudai/golcs v0.0.0-20170316035057-ecda9a501e82 h1:BHyfKlQyqbsFN5p3IfnEUduWvb9is428/nNb5L3U01M=
+github.com/yudai/golcs v0.0.0-20170316035057-ecda9a501e82/go.mod h1:lgjkn3NuSvDfVJdfcVVdX+jpBxNmX4rDAzaS45IcYoM=
+github.com/yudai/pp v2.0.1+incompatible/go.mod h1:PuxR/8QJ7cyCkFp/aUDS+JY727OFEZkTdatxwunjIkc=
+golang.org/x/crypto v0.0.0-20190308221718-c2843e01d9a2/go.mod h1:djNgcEr1/C05ACkg1iLfiJU5Ep61QUkGW8qpdssI0+w=
+golang.org/x/net v0.0.0-20180724234803-3673e40ba225/go.mod h1:mL1N/T3taQHkDXs73rZJwtUhF3w3ftmwwsq0BUmARs4=
+golang.org/x/net v0.0.0-20180906233101-161cd47e91fd/go.mod h1:mL1N/T3taQHkDXs73rZJwtUhF3w3ftmwwsq0BUmARs4=
+golang.org/x/net v0.0.0-20190108225652-1e06a53dbb7e/go.mod h1:mL1N/T3taQHkDXs73rZJwtUhF3w3ftmwwsq0BUmARs4=
+golang.org/x/net v0.0.0-20190311183353-d8887717615a/go.mod h1:t9HGtf8HONx5eT2rtn7q6eTqICYqUVnKs3thJo3Qplg=
+golang.org/x/net v0.0.0-20190827160401-ba9fcec4b297 h1:k7pJ2yAPLPgbskkFdhRCsA77k2fySZ1zf2zCjvQCiIM=
+golang.org/x/net v0.0.0-20190827160401-ba9fcec4b297/go.mod h1:z5CRVTTTmAJ677TzLLGU+0bjPO0LkuOLi4/5GtJWs/s=
+golang.org/x/oauth2 v0.0.0-20190604053449-0f29369cfe45/go.mod h1:gOpvHmFTYa4IltrdGE7lF6nIHvwfUNPOp7c8zoXwtLw=
+golang.org/x/sync v0.0.0-20180314180146-1d60e4601c6f/go.mod h1:RxMgew5VJxzue5/jJTE5uejpjVlOe/izrB70Jof72aM=
+golang.org/x/sync v0.0.0-20181221193216-37e7f081c4d4/go.mod h1:RxMgew5VJxzue5/jJTE5uejpjVlOe/izrB70Jof72aM=
+golang.org/x/sys v0.0.0-20180909124046-d0be0721c37e/go.mod h1:STP8DvDyc/dI5b8T5hshtkjS+E42TnysNCUPdjciGhY=
+golang.org/x/sys v0.0.0-20190215142949-d0b11bdaac8a/go.mod h1:STP8DvDyc/dI5b8T5hshtkjS+E42TnysNCUPdjciGhY=
+golang.org/x/sys v0.0.0-20190222072716-a9d3bda3a223/go.mod h1:STP8DvDyc/dI5b8T5hshtkjS+E42TnysNCUPdjciGhY=
+golang.org/x/sys v0.0.0-20200116001909-b77594299b42 h1:vEOn+mP2zCOVzKckCZy6YsCtDblrpj/w7B9nxGNELpg=
+golang.org/x/sys v0.0.0-20200116001909-b77594299b42/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
+golang.org/x/text v0.3.0/go.mod h1:NqM8EUOU14njkJ3fqMW+pc6Ldnwhi/IjpwHt7yyuwOQ=
+golang.org/x/text v0.3.2/go.mod h1:bEr9sfX3Q8Zfm5fL9x+3itogRgK3+ptLWKqgva+5dAk=
+golang.org/x/time v0.0.0-20191024005414-555d28b269f0/go.mod h1:tRJNPiyCQ0inRvYxbN9jk5I+vvW/OXSQhTDSoE431IQ=
+golang.org/x/tools v0.0.0-20180917221912-90fa682c2a6e/go.mod h1:n7NCudcB/nEzxVGmLbDWY5pfWTLqBcC2KZ6jyYvM4mQ=
+golang.org/x/tools v0.0.0-20190328211700-ab21143f2384/go.mod h1:LCzVGOaR6xXOjkQ3onu1FJEFr0SW1gC7cKk1uF8kGRs=
+golang.org/x/xerrors v0.0.0-20191204190536-9bdfabe68543 h1:E7g+9GITq07hpfrRu66IVDexMakfv52eLZ2CXBWiKr4=
+golang.org/x/xerrors v0.0.0-20191204190536-9bdfabe68543/go.mod h1:I/5z698sn9Ka8TeJc9MKroUUfqBBauWjQqLJ2OPfmY0=
+google.golang.org/appengine v1.4.0/go.mod h1:xpcJRLb0r/rnEns0DIKYYv+WjYCduHsrkT7/EB5XEv4=
+gopkg.in/check.v1 v0.0.0-20161208181325-20d25e280405/go.mod h1:Co6ibVJAznAaIkqp8huTwlJQCZ016jof/cbN4VW5Yz0=
+gopkg.in/fsnotify.v1 v1.4.7/go.mod h1:Tz8NjZHkW78fSQdbUxIjBTcgA1z1m8ZHf0WmKUhAMys=
+gopkg.in/oauth2.v3 v3.12.0 h1:yOffAPoolH/i2JxwmC+pgtnY3362iPahsDpLXfDFvNg=
+gopkg.in/oauth2.v3 v3.12.0/go.mod h1:XEYgKqWX095YiPT+Aw5y3tCn+7/FMnlTFKrupgSiJ3I=
+gopkg.in/tomb.v1 v1.0.0-20141024135613-dd632973f1e7/go.mod h1:dt/ZhP58zS4L8KSrWDmTeBkI65Dw0HsyUHuEVlX15mw=
+gopkg.in/yaml.v2 v2.2.1/go.mod h1:hI93XBmqTisBFMUTm0b8Fm+jr3Dg1NNxqwp+5A1VGuI=
+gopkg.in/yaml.v2 v2.2.2/go.mod h1:hI93XBmqTisBFMUTm0b8Fm+jr3Dg1NNxqwp+5A1VGuI=
+gopkg.in/yaml.v2 v2.2.8 h1:obN1ZagJSUGI0Ek/LBmuj4SNLPfIny3KsKFopxRdj10=
+gopkg.in/yaml.v2 v2.2.8/go.mod h1:hI93XBmqTisBFMUTm0b8Fm+jr3Dg1NNxqwp+5A1VGuI=
+nhooyr.io/websocket v1.8.7 h1:usjR2uOr/zjjkVMy0lW+PPohFok7PCow5sDjLgX4P4g=
+nhooyr.io/websocket v1.8.7/go.mod h1:B70DZP8IakI65RVQ51MsWP/8jndNma26DVA/nFSCgW0=

apiGo/main.go

@@ -0,0 +1,66 @@
+package main
+
+import (
+	"flag"
+	"fmt"
+	"log"
+	"net/http"
+	"openmediacenter/apiGo/api"
+	"openmediacenter/apiGo/database"
+	settings2 "openmediacenter/apiGo/database/settings"
+	"openmediacenter/apiGo/static"
+	"openmediacenter/apiGo/videoparser"
+)
+
+func main() {
+	fmt.Println("init OpenMediaCenter server")
+	port := 8081
+
+	db, verbose, pathPrefix := handleCommandLineArguments()
+	// todo some verbosity logger or sth
+
+	fmt.Printf("Use verbose output: %t\n", verbose)
+	fmt.Printf("Videopath prefix: %s\n", *pathPrefix)
+
+	// set pathprefix in database settings object
+	database.SettingsVideoPrefix = *pathPrefix
+
+	database.InitDB(db)
+	defer database.Close()
+
+	videoparser.SetupSettingsWebsocket()
+
+	// add the static files
+	static.ServeStaticFiles()
+
+	api.Init()
+
+	fmt.Printf("OpenMediacenter server up and running on port %d\n", port)
+	log.Fatal(http.ListenAndServe(fmt.Sprintf(":%d", port), nil))
+}
+
+func handleCommandLineArguments() (*database.DatabaseConfig, bool, *string) {
+	dbhostPtr := flag.String("DBHost", "127.0.0.1", "database host name")
+	dbPortPtr := flag.Int("DBPort", 3306, "database port")
+	dbUserPtr := flag.String("DBUser", "mediacenteruser", "database username")
+	dbPassPtr := flag.String("DBPassword", "mediapassword", "database username")
+	dbNamePtr := flag.String("DBName", "mediacenter", "database name")
+
+	verbosePtr := flag.Bool("v", true, "Verbose log output")
+
+	pathPrefix := flag.String("ReindexPrefix", "/var/www/openmediacenter", "Prefix path for videos to reindex")
+
+	disableTVShowSupport := flag.Bool("DisableTVSupport", false, "Disable the TVShow support and pages")
+
+	flag.Parse()
+
+	settings2.SetTVShowEnabled(!*disableTVShowSupport)
+
+	return &database.DatabaseConfig{
+		DBHost:     *dbhostPtr,
+		DBPort:     *dbPortPtr,
+		DBUser:     *dbUserPtr,
+		DBPassword: *dbPassPtr,
+		DBName:     *dbNamePtr,
+	}, *verbosePtr, pathPrefix
+}

apiGo/static/StaticServe.go

@@ -0,0 +1,89 @@
+// +build static
+
+package static
+
+import (
+	"embed"
+	"fmt"
+	"io/fs"
+	"net/http"
+	"net/http/httputil"
+	"net/url"
+	"openmediacenter/apiGo/database/settings"
+	"regexp"
+	"strings"
+)
+
+//go:embed build
+var staticFiles embed.FS
+
+func ServeStaticFiles() {
+	// http.FS can be used to create a http Filesystem
+	subfs, _ := fs.Sub(staticFiles, "build")
+	staticFS := http.FS(subfs)
+	fs := http.FileServer(staticFS)
+
+	// Serve static files
+	http.Handle("/", validatePrefix(fs))
+
+	// we need to proxy the videopath to somewhere in a standalone binary
+	proxyVideoURL()
+}
+
+type handler struct {
+	proxy *httputil.ReverseProxy
+}
+
+func (h handler) ServeHTTP(w http.ResponseWriter, r *http.Request) {
+	h.proxy.ServeHTTP(w, r)
+}
+
+func proxyVideoURL() {
+	conf := settings.LoadSettings()
+
+	// match base url
+	regexMatchUrl := regexp.MustCompile("^http(|s):\\/\\/([0-9]){1,3}\\.([0-9]){1,3}\\.([0-9]){1,3}\\.([0-9]){1,3}:[0-9]{1,5}")
+
+	var videoUrl *url.URL
+	if regexMatchUrl.MatchString(conf.VideoPath) {
+		fmt.Println("matches string...")
+		var err error
+		videoUrl, err = url.Parse(regexMatchUrl.FindString(conf.VideoPath))
+		if err != nil {
+			panic(err)
+		}
+	} else {
+		videoUrl, _ = url.Parse("http://127.0.0.1:8081")
+	}
+
+	director := func(req *http.Request) {
+		req.URL.Scheme = videoUrl.Scheme
+		req.URL.Host = videoUrl.Host
+	}
+
+	serverVideoPath := strings.TrimPrefix(conf.VideoPath, regexMatchUrl.FindString(conf.VideoPath))
+
+	reverseProxy := &httputil.ReverseProxy{Director: director}
+	handler := handler{proxy: reverseProxy}
+	http.Handle(serverVideoPath, handler)
+}
+
+// ValidatePrefix check if requested path is a file -- if not proceed with index.html
+func validatePrefix(h http.Handler) http.Handler {
+	return http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
+		regex := regexp.MustCompile("\\..*$")
+		matchFile := regex.MatchString(r.URL.Path)
+
+		if matchFile {
+			h.ServeHTTP(w, r)
+		} else {
+			r2 := new(http.Request)
+			*r2 = *r
+			r2.URL = new(url.URL)
+			*r2.URL = *r.URL
+			r2.URL.Path = "/"
+			r2.URL.RawPath = "/"
+			h.ServeHTTP(w, r2)
+		}
+	})
+}

apiGo/static/StaticServe_apionly.go

@@ -0,0 +1,6 @@
+// +build !static
+
+package static
+
+// add nothing on no static build
+func ServeStaticFiles() {}

apiGo/videoparser/CleanUp.go

@@ -0,0 +1 @@
+package videoparser

apiGo/videoparser/Helpers.go

@@ -0,0 +1,120 @@
+package videoparser
+
+import (
+	"encoding/base64"
+	"encoding/json"
+	"fmt"
+	"os/exec"
+	"strconv"
+)
+
+func AppendMessage(message string) {
+	msger := TextMessage{
+		MessageBase: MessageBase{Action: "message"},
+		Message:     message,
+	}
+	marshal, err := json.Marshal(msger)
+	if err != nil {
+		return
+	}
+
+	IndexSender.Publish(marshal)
+}
+
+func SendEvent(message string) {
+	msger := ReindexEvent{
+		MessageBase: MessageBase{Action: "reindexAction"},
+		Event:       message,
+	}
+	marshal, err := json.Marshal(msger)
+	if err != nil {
+		return
+	}
+
+	IndexSender.Publish(marshal)
+}
+
+// ext dependency support check
+func checkExtDependencySupport() *ExtDependencySupport {
+	var extDepsAvailable ExtDependencySupport
+
+	extDepsAvailable.FFMpeg = commandExists("ffmpeg")
+	extDepsAvailable.MediaInfo = commandExists("mediainfo")
+
+	return &extDepsAvailable
+}
+
+// check if a specific system command is available
+func commandExists(cmd string) bool {
+	_, err := exec.LookPath(cmd)
+	return err == nil
+}
+
+// parse the thumbail picture from video file
+func parseFFmpegPic(path string) (*string, error) {
+	app := "ffmpeg"
+
+	cmd := exec.Command(app,
+		"-hide_banner",
+		"-loglevel", "panic",
+		"-ss", "00:04:00",
+		"-i", path,
+		"-vframes", "1",
+		"-q:v", "2",
+		"-f", "singlejpeg",
+		"pipe:1")
+
+	stdout, err := cmd.Output()
+
+	if err != nil {
+		fmt.Println(err.Error())
+		fmt.Println(string(err.(*exec.ExitError).Stderr))
+		return nil, err
+	}
+
+	strEncPic := base64.StdEncoding.EncodeToString(stdout)
+	if strEncPic == "" {
+		return nil, nil
+	}
+	backpic64 := fmt.Sprintf("data:image/jpeg;base64,%s", strEncPic)
+
+	return &backpic64, nil
+}
+
+func getVideoAttributes(path string) *VideoAttributes {
+	app := "mediainfo"
+
+	arg0 := path
+	arg1 := "--Output=JSON"
+
+	cmd := exec.Command(app, arg1, "-f", arg0)
+	stdout, err := cmd.Output()
+
+	var t struct {
+		Media struct {
+			Track []struct {
+				Duration string
+				FileSize string
+				Width    string
+			}
+		}
+	}
+	err = json.Unmarshal(stdout, &t)
+
+	if err != nil {
+		fmt.Println(err.Error())
+		return nil
+	}
+
+	duration, err := strconv.ParseFloat(t.Media.Track[0].Duration, 32)
+	filesize, err := strconv.Atoi(t.Media.Track[0].FileSize)
+	width, err := strconv.Atoi(t.Media.Track[1].Width)
+
+	ret := VideoAttributes{
+		Duration: float32(duration),
+		FileSize: uint(filesize),
+		Width:    uint(width),
+	}
+
+	return &ret
+}

apiGo/videoparser/ReIndexTVShows.go

@@ -0,0 +1,138 @@
+package videoparser
+
+import (
+	"fmt"
+	"openmediacenter/apiGo/database"
+	"openmediacenter/apiGo/videoparser/tmdb"
+	"regexp"
+	"strconv"
+	"strings"
+)
+
+func startTVShowReindex(files []Show) {
+	allTVshows := getAllTVShows()
+
+	for _, file := range files {
+		// insert new TVShow entry if not existing.
+		insertShowIfNotExisting(file, allTVshows)
+		AppendMessage("Processing show: " + file.Name)
+
+		insertEpisodesIfNotExisting(file)
+	}
+
+	AppendMessage("reindex finished successfully!")
+	SendEvent("stop")
+}
+
+func insertEpisodesIfNotExisting(show Show) {
+	query := "SELECT tvshow_episodes.name, season, episode FROM tvshow_episodes JOIN tvshow t on t.id = tvshow_episodes.tvshow_id WHERE t.name=?"
+	rows := database.Query(query, show.Name)
+
+	var dbepisodes []string
+	for rows.Next() {
+		var epname string
+		var season int
+		var episode int
+		err := rows.Scan(&epname, &season, &episode)
+		if err != nil {
+			fmt.Println(err.Error())
+		}
+
+		dbepisodes = append(dbepisodes, fmt.Sprintf("%s S%02dE%02d.mp4", epname, season, episode))
+	}
+
+	// get those episodes that are missing in db
+	diff := difference(show.files, dbepisodes)
+
+	for _, s := range diff {
+		AppendMessage("Adding Episode: " + s)
+		insertEpisode(s, show.Name)
+	}
+}
+
+func insertEpisode(path string, ShowName string) {
+	seasonRegex := regexp.MustCompile("S[0-9][0-9]")
+	episodeRegex := regexp.MustCompile("E[0-9][0-9]")
+	matchENDPattern := regexp.MustCompile(" S[0-9][0-9]E[0-9][0-9].+$")
+
+	seasonStr := seasonRegex.FindString(path)
+	episodeStr := episodeRegex.FindString(path)
+	extString := matchENDPattern.FindString(path)
+	// handle invalid matches
+	if len(seasonStr) != 3 || len(episodeStr) != 3 || len(extString) < 8 {
+		fmt.Printf("Error inserting episode: %s  -- %s/%s/%s\n", path, seasonStr, episodeStr, extString)
+		return
+	}
+
+	name := strings.TrimSuffix(path, extString)
+
+	season, err := strconv.ParseInt(seasonStr[1:], 10, 8)
+	episode, err := strconv.ParseInt(episodeStr[1:], 10, 8)
+	if err != nil {
+		fmt.Println(err.Error())
+	}
+
+	query := `
+INSERT INTO tvshow_episodes (name, season, poster, tvshow_id, episode, filename)
+VALUES (?, ?, ?, (SELECT tvshow.id FROM tvshow WHERE tvshow.name=?), ?, ?)`
+	err = database.Edit(query, name, season, "", ShowName, episode, path)
+	if err != nil {
+		fmt.Println(err.Error())
+	}
+}
+
+// difference returns the elements in `a` that aren't in `b`.
+func difference(a, b []string) []string {
+	mb := make(map[string]struct{}, len(b))
+	for _, x := range b {
+		mb[x] = struct{}{}
+	}
+	var diff []string
+	for _, x := range a {
+		if _, found := mb[x]; !found {
+			diff = append(diff, x)
+		}
+	}
+	return diff
+}
+
+func insertShowIfNotExisting(show Show, allShows *[]string) {
+	// if show already exists return
+	fmt.Println(*allShows)
+	for _, s := range *allShows {
+		if s == show.Name {
+			return
+		}
+	}
+
+	// insert empty thubnail if tmdb fails
+	thubnail := ""
+
+	// load tmdb infos
+	tmdbInfo := tmdb.SearchTVShow(show.Name)
+	if tmdbInfo != nil {
+		thubnail = tmdbInfo.Thumbnail
+	}
+
+	// currently the foldernamme == name which mustn't necessarily be
+	query := "INSERT INTO tvshow (name, thumbnail, foldername) VALUES (?, ?, ?)"
+	err := database.Edit(query, show.Name, thubnail, show.Name)
+	if err != nil {
+		fmt.Println(err.Error())
+	}
+}
+
+func getAllTVShows() *[]string {
+	query := "SELECT name FROM tvshow"
+	rows := database.Query(query)
+
+	var res []string
+	for rows.Next() {
+		var show string
+		rows.Scan(&show)
+
+		res = append(res, show)
+	}
+
+	return &res
+}

apiGo/videoparser/ReIndexTVShows_test.go

@@ -0,0 +1,13 @@
+package videoparser
+
+import "testing"
+
+func TestDifference(t *testing.T) {
+	arr1 := []string{"test1", "test2", "test3"}
+	arr2 := []string{"test1", "test3"}
+
+	res := difference(arr1, arr2)
+	if len(res) != 1 || res[0] != "test2" {
+		t.Errorf("wrong difference result.")
+	}
+}

apiGo/videoparser/ReIndexVideos.go

@@ -0,0 +1,244 @@
+package videoparser
+
+import (
+	"database/sql"
+	"fmt"
+	"openmediacenter/apiGo/api/types"
+	"openmediacenter/apiGo/database"
+	"openmediacenter/apiGo/videoparser/tmdb"
+	"regexp"
+	"strconv"
+	"strings"
+)
+
+var mSettings types.SettingsType
+var mExtDepsAvailable *ExtDependencySupport
+
+// default Tag ids
+const (
+	FullHd     = 2
+	Hd         = 4
+	LowQuality = 3
+)
+
+type ExtDependencySupport struct {
+	FFMpeg    bool
+	MediaInfo bool
+}
+
+type VideoAttributes struct {
+	Duration float32
+	FileSize uint
+	Width    uint
+}
+
+func ReIndexVideos(path []string, sett types.SettingsType) {
+	mSettings = sett
+	// check if the extern dependencies are available
+	mExtDepsAvailable = checkExtDependencySupport()
+	fmt.Printf("FFMPEG support: %t\n", mExtDepsAvailable.FFMpeg)
+	fmt.Printf("MediaInfo support: %t\n", mExtDepsAvailable.MediaInfo)
+
+	// filter out those urls which are already existing in db
+	nonExisting := filterExisting(path)
+
+	fmt.Printf("There are %d videos not existing in db.\n", len(*nonExisting))
+
+	for _, s := range *nonExisting {
+		processVideo(s)
+	}
+
+	AppendMessage("reindex finished successfully!")
+	SendEvent("stop")
+	fmt.Println("Reindexing finished!")
+}
+
+// filter those entries from array which are already existing!
+func filterExisting(paths []string) *[]string {
+	var nameStr string
+
+	// build the query string with files on disk
+	for i, s := range paths {
+		// escape ' in url name
+		s = strings.Replace(s, "'", "\\'", -1)
+		nameStr += "SELECT '" + s + "' "
+
+		// if first index add as url
+		if i == 0 {
+			nameStr += "AS url "
+		}
+
+		// if not last index add union all
+		if i != len(paths)-1 {
+			nameStr += "UNION ALL "
+		}
+	}
+
+	query := fmt.Sprintf("SELECT * FROM (%s) urls WHERE urls.url NOT IN(SELECT movie_url FROM videos)", nameStr)
+	rows := database.Query(query)
+
+	var resultarr []string
+	// parse the result rows into a array
+	for rows.Next() {
+		var url string
+		err := rows.Scan(&url)
+		if err != nil {
+			continue
+		}
+		resultarr = append(resultarr, url)
+	}
+	rows.Close()
+
+	return &resultarr
+}
+
+func processVideo(fileNameOrig string) {
+	fmt.Printf("Processing %s video-", fileNameOrig)
+
+	// match the file extension
+	r := regexp.MustCompile(`\.[a-zA-Z0-9]+$`)
+	fileName := r.ReplaceAllString(fileNameOrig, "")
+
+	// match the year and cut year from name
+	year, fileName := matchYear(fileName)
+
+	fmt.Printf("The Video %s doesn't exist! Adding it to database.\n", fileName)
+	addVideo(fileName, fileNameOrig, year)
+}
+
+// add a video to the database
+func addVideo(videoName string, fileName string, year int) {
+	var ppic *string
+	var poster *string
+	var tmdbData *tmdb.VideoTMDB
+	var err error
+
+	// initialize defaults
+	vidAtr := &VideoAttributes{
+		Duration: 0,
+		FileSize: 0,
+		Width:    0,
+	}
+
+	if mExtDepsAvailable.FFMpeg {
+		ppic, err = parseFFmpegPic(mSettings.VideoPath + fileName)
+		if err != nil {
+			fmt.Printf("FFmpeg error occured: %s\n", err.Error())
+		} else {
+			fmt.Println("successfully extracted thumbnail!!")
+		}
+	}
+
+	if mExtDepsAvailable.MediaInfo {
+		atr := getVideoAttributes(mSettings.VideoPath + fileName)
+		if atr != nil {
+			vidAtr = atr
+		}
+	}
+
+	// if TMDB grabbing is enabled serach in api for video...
+	if mSettings.TMDBGrabbing {
+		tmdbData = tmdb.SearchVideo(videoName, year)
+		if tmdbData != nil {
+			// reassign parsed pic as poster
+			poster = ppic
+			// and tmdb pic as thumbnail
+			ppic = &tmdbData.Thumbnail
+		}
+	}
+
+	query := `INSERT INTO videos(movie_name,movie_url,poster,thumbnail,quality,length) VALUES (?,?,?,?,?,?)`
+	err, insertId := database.Insert(query, videoName, fileName, poster, ppic, vidAtr.Width, vidAtr.Duration)
+	if err != nil {
+		fmt.Printf("Failed to insert video into db: %s\n", err.Error())
+		return
+	}
+
+	// add default tags
+	if vidAtr.Width != 0 {
+		insertSizeTag(vidAtr.Width, uint(insertId))
+	}
+
+	// add tmdb tags
+	if mSettings.TMDBGrabbing && tmdbData != nil {
+		insertTMDBTags(tmdbData.GenreIds, insertId)
+	}
+
+	AppendMessage(fmt.Sprintf("%s - added!", videoName))
+}
+
+func matchYear(fileName string) (int, string) {
+	r := regexp.MustCompile(`\([0-9]{4}?\)`)
+	years := r.FindAllString(fileName, -1)
+	if len(years) == 0 {
+		return -1, fileName
+	}
+	yearStr := years[len(years)-1]
+	// get last year occurance and cut first and last char
+	year, err := strconv.Atoi(yearStr[1 : len(yearStr)-1])
+
+	if err != nil {
+		return -1, fileName
+	}
+
+	// cut out year from filename
+	return year, r.ReplaceAllString(fileName, "")
+}
+
+// insert the default size tags to corresponding video
+func insertSizeTag(width uint, videoId uint) {
+	var tagType uint
+
+	if width >= 1080 {
+		tagType = FullHd
+	} else if width >= 720 {
+		tagType = Hd
+	} else {
+		tagType = LowQuality
+	}
+
+	query := fmt.Sprintf("INSERT INTO video_tags(video_id,tag_id) VALUES (%d,%d)", videoId, tagType)
+	err := database.Edit(query)
+	if err != nil {
+		fmt.Printf("Eror occured while adding default Tag: %s\n", err.Error())
+	}
+}
+
+// insert id array of tmdb geners to database
+func insertTMDBTags(ids []int, videoId int64) {
+	genres := tmdb.GetGenres()
+
+	for _, id := range ids {
+		var idGenre *tmdb.TMDBGenre
+		for _, genre := range *genres {
+			if genre.Id == id {
+				idGenre = &genre
+				break
+			}
+		}
+		// skip tag if name couldn't be found
+		if idGenre == nil {
+			continue
+		}
+
+		// now we check if the tag we want to add already exists
+		tagId := createTagToDB(idGenre.Name)
+
+		// now we add the tag
+		query := fmt.Sprintf("INSERT INTO video_tags(video_id,tag_id) VALUES (%d,%d)", videoId, tagId)
+		_ = database.Edit(query)
+	}
+}
+
+// returns id of tag or creates it if not existing
+func createTagToDB(tagName string) int64 {
+	query := fmt.Sprintf("SELECT tag_id FROM tags WHERE tag_name = %s", tagName)
+	var id int64
+	err := database.QueryRow(query).Scan(&id)
+	if err == sql.ErrNoRows {
+		// tag doesn't exist -- add it
+		query = fmt.Sprintf("INSERT INTO tags (tag_name) VALUES (%s)", tagName)
+		err, id = database.Insert(query)
+	}
+	return id
+}

apiGo/videoparser/VideoParser.go

@@ -0,0 +1,126 @@
+package videoparser
+
+import (
+	"fmt"
+	"io/ioutil"
+	"openmediacenter/apiGo/database"
+	"os"
+	"path/filepath"
+	"strings"
+)
+
+type StatusMessage struct {
+	Messages         []string
+	ContentAvailable bool
+}
+
+func StartReindex() bool {
+	fmt.Println("starting reindex..")
+	SendEvent("start")
+	AppendMessage("starting reindex..")
+
+	mSettings, PathPrefix, _ := database.GetSettings()
+	// add the path prefix to videopath
+	mSettings.VideoPath = PathPrefix + mSettings.VideoPath
+
+	// check if path even exists
+	if _, err := os.Stat(mSettings.VideoPath); os.IsNotExist(err) {
+		fmt.Println("Reindex path doesn't exist!")
+		AppendMessage(fmt.Sprintf("Reindex path doesn't exist! :%s", mSettings.VideoPath))
+		SendEvent("stop")
+		return false
+	}
+
+	var files []string
+	err := filepath.Walk(mSettings.VideoPath, func(path string, info os.FileInfo, err error) error {
+		if err != nil {
+			fmt.Println(err.Error())
+			return err
+		}
+
+		if !info.IsDir() && strings.HasSuffix(info.Name(), ".mp4") {
+			files = append(files, info.Name())
+		}
+		return nil
+	})
+
+	if err != nil {
+		fmt.Println(err.Error())
+	}
+	// start reindex process
+	AppendMessage("Starting Reindexing!")
+	go ReIndexVideos(files, mSettings)
+	return true
+}
+
+type Show struct {
+	Name  string
+	files []string
+}
+
+// StartTVShowReindex reindex dir walks for TVShow reindex
+func StartTVShowReindex() {
+	fmt.Println("starting tvshow reindex..")
+	SendEvent("start")
+	AppendMessage("starting tvshow reindex...")
+
+	mSettings, PathPrefix, _ := database.GetSettings()
+	// add the path prefix to videopath
+	mSettings.EpisodePath = PathPrefix + mSettings.EpisodePath
+
+	// add slash suffix if not existing
+	if !strings.HasSuffix(mSettings.EpisodePath, "/") {
+		mSettings.EpisodePath += "/"
+	}
+
+	// check if path even exists
+	if _, err := os.Stat(mSettings.EpisodePath); os.IsNotExist(err) {
+		msg := fmt.Sprintf("Reindex path doesn't exist! :%s", mSettings.EpisodePath)
+		fmt.Println(msg)
+		AppendMessage(msg)
+		SendEvent("stop")
+		return
+	}
+
+	var files []Show
+
+	filess, err := ioutil.ReadDir(mSettings.EpisodePath)
+	if err != nil {
+		fmt.Println(err.Error())
+	}
+
+	for _, file := range filess {
+		if file.IsDir() {
+			elem := Show{
+				Name:  file.Name(),
+				files: nil,
+			}
+
+			fmt.Println(file.Name())
+
+			episodefiles, err := ioutil.ReadDir(mSettings.EpisodePath + file.Name())
+			if err != nil {
+				fmt.Println(err.Error())
+			}
+
+			for _, epfile := range episodefiles {
+				if strings.HasSuffix(epfile.Name(), ".mp4") {
+					elem.files = append(elem.files, epfile.Name())
+				}
+			}
+			files = append(files, elem)
+		}
+	}
+
+	if err != nil {
+		fmt.Println(err.Error())
+	}
+
+	// start reindex process
+	AppendMessage("Starting Reindexing!")
+	go startTVShowReindex(files)
+}
+
+func StartCleanup() {
+	// todo start cleanup
+}

apiGo/videoparser/WebSocketConnector.go

@@ -0,0 +1,135 @@
+package videoparser
+
+import (
+	"context"
+	"errors"
+	"fmt"
+	"net/http"
+	"nhooyr.io/websocket"
+	"sync"
+	"time"
+)
+
+// subscriber represents a subscriber.
+// Messages are sent on the msgs channel and if the client
+// cannot keep up with the messages, closeSlow is called.
+type subscriber struct {
+	msgs      chan []byte
+	closeSlow func()
+}
+
+type ChatSender struct {
+	subscribersMu sync.Mutex
+	subscribers   map[*subscriber]struct{}
+}
+
+func newChatSender() *ChatSender {
+	return &ChatSender{
+		subscribers: make(map[*subscriber]struct{}),
+	}
+}
+
+func (t *ChatSender) ServeHTTP(w http.ResponseWriter, r *http.Request) {
+	c, err := websocket.Accept(w, r, &websocket.AcceptOptions{
+		OriginPatterns: []string{"*"},
+	})
+	if err != nil {
+		fmt.Println(err.Error())
+		return
+	}
+	defer c.Close(websocket.StatusInternalError, "")
+
+	err = t.subscribe(r.Context(), c)
+	if errors.Is(err, context.Canceled) {
+		return
+	}
+	if websocket.CloseStatus(err) == websocket.StatusNormalClosure ||
+		websocket.CloseStatus(err) == websocket.StatusGoingAway {
+		return
+	}
+	if err != nil {
+		fmt.Println(err.Error())
+		return
+	}
+}
+
+func (t *ChatSender) subscribe(ctx context.Context, c *websocket.Conn) error {
+	ctx = c.CloseRead(ctx)
+
+	s := &subscriber{
+		msgs: make(chan []byte, 16),
+		closeSlow: func() {
+			c.Close(websocket.StatusPolicyViolation, "connection too slow to keep up with messages")
+		},
+	}
+	t.addSubscriber(s)
+	defer t.deleteSubscriber(s)
+
+	for {
+		select {
+		case msg := <-s.msgs:
+			err := writeTimeout(ctx, time.Second*5, c, msg)
+			if err != nil {
+				return err
+			}
+		case <-ctx.Done():
+			return ctx.Err()
+		}
+	}
+}
+
+type MessageBase struct {
+	Action string
+}
+
+type TextMessage struct {
+	MessageBase
+
+	Message string
+}
+
+type ReindexEvent struct {
+	MessageBase
+
+	Event string
+}
+
+func (t *ChatSender) Publish(msg []byte) {
+	t.subscribersMu.Lock()
+	defer t.subscribersMu.Unlock()
+
+	for s := range t.subscribers {
+		select {
+		case s.msgs <- msg:
+		default:
+			go s.closeSlow()
+		}
+	}
+}
+
+var IndexSender = newChatSender()
+
+func SetupSettingsWebsocket() {
+	http.Handle("/subscribe", IndexSender)
+}
+
+// addSubscriber registers a subscriber.
+func (t *ChatSender) addSubscriber(s *subscriber) {
+	t.subscribersMu.Lock()
+	t.subscribers[s] = struct{}{}
+	t.subscribersMu.Unlock()
+}
+
+// deleteSubscriber deletes the given subscriber.
+func (t *ChatSender) deleteSubscriber(s *subscriber) {
+	t.subscribersMu.Lock()
+	delete(t.subscribers, s)
+	t.subscribersMu.Unlock()
+}
+
+func writeTimeout(ctx context.Context, timeout time.Duration, c *websocket.Conn, msg []byte) error {
+	ctx, cancel := context.WithTimeout(ctx, timeout)
+	defer cancel()
+
+	return c.Write(ctx, websocket.MessageText, msg)
+}

apiGo/videoparser/tmdb/TMDBApi.go

@@ -0,0 +1,220 @@
+package tmdb
+
+import (
+	"encoding/base64"
+	"encoding/json"
+	"fmt"
+	"io/ioutil"
+	"net/http"
+	"net/url"
+	"regexp"
+)
+
+const apiKey = "9fd90530b11447f5646f8e6fb4733fb4"
+const baseUrl = "https://api.themoviedb.org/3/"
+const pictureBase = "https://image.tmdb.org/t/p/w500"
+
+type VideoTMDB struct {
+	Thumbnail string
+	Overview  string
+	Title     string
+	GenreIds  []int
+}
+
+type TVShowTMDB struct {
+	Thumbnail string
+	Overview  string
+	GenreIds  []int
+}
+
+type tmdbVidResult struct {
+	PosterPath       *string `json:"poster_path"`
+	Adult            bool    `json:"adult"`
+	Overview         string  `json:"overview"`
+	ReleaseDate      string  `json:"release_date"`
+	GenreIds         []int   `json:"genre_ids"`
+	Id               int     `json:"id"`
+	OriginalTitle    string  `json:"original_title"`
+	OriginalLanguage string  `json:"original_language"`
+	Title            string  `json:"title"`
+	BackdropPath     *string `json:"backdrop_path"`
+	Popularity       int     `json:"popularity"`
+	VoteCount        int     `json:"vote_count"`
+	Video            bool    `json:"video"`
+	VoteAverage      int     `json:"vote_average"`
+}
+
+type tmdbTvResult struct {
+	PosterPath       *string  `json:"poster_path"`
+	Popularity       int      `json:"popularity"`
+	Id               int      `json:"id"`
+	BackdropPath     *string  `json:"backdrop_path"`
+	VoteAverage      int      `json:"vote_average"`
+	Overview         string   `json:"overview"`
+	FirstAirDate     string   `json:"first_air_date"`
+	OriginCountry    []string `json:"origin_country"`
+	GenreIds         []int    `json:"genre_ids"`
+	OriginalLanguage string   `json:"original_language"`
+	VoteCount        int      `json:"vote_count"`
+	Name             string   `json:"name"`
+	OriginalName     string   `json:"original_name"`
+}
+
+type TMDBGenre struct {
+	Id   int
+	Name string
+}
+
+func SearchVideo(MovieName string, year int) *VideoTMDB {
+	fmt.Printf("Searching TMDB for: Moviename: %s, year:%d \n", MovieName, year)
+	queryURL := fmt.Sprintf("%ssearch/movie?api_key=%s&query=%s", baseUrl, apiKey, url.QueryEscape(MovieName))
+	resp, err := http.Get(queryURL)
+	if err != nil {
+		fmt.Println(err.Error())
+		return nil
+	}
+
+	body, err := ioutil.ReadAll(resp.Body)
+	if err != nil {
+		fmt.Println(err.Error())
+		return nil
+	}
+
+	var t struct {
+		Results []tmdbVidResult
+	}
+	err = json.Unmarshal(body, &t)
+
+	fmt.Println(len(t.Results))
+
+	// if there was no match with tmdb return 0
+	if len(t.Results) == 0 {
+		return nil
+	}
+
+	var tmdbVid tmdbVidResult
+	if year != -1 {
+		for _, result := range t.Results {
+			r, _ := regexp.Compile(fmt.Sprintf(`^%d-[0-9]{2}?-[0-9]{2}?$`, year))
+			if r.MatchString(result.ReleaseDate) {
+				tmdbVid = result
+				// continue parsing
+				goto cont
+			}
+		}
+		// if there is no match use first one
+		tmdbVid = t.Results[0]
+	} else {
+		tmdbVid = t.Results[0]
+	}
+
+	// continue label
+cont:
+
+	var thumbnail = ""
+	if tmdbVid.PosterPath != nil {
+		pic := fetchPoster(*tmdbVid.PosterPath)
+		if pic != nil {
+			thumbnail = *pic
+		}
+	}
+
+	result := VideoTMDB{
+		Thumbnail: thumbnail,
+		Overview:  tmdbVid.Overview,
+		Title:     tmdbVid.Title,
+		GenreIds:  tmdbVid.GenreIds,
+	}
+
+	return &result
+}
+
+func SearchTVShow(Name string) *TVShowTMDB {
+	fmt.Printf("Searching TMDB for: TVShow: %s\n", Name)
+	queryURL := fmt.Sprintf("%ssearch/tv?api_key=%s&query=%s", baseUrl, apiKey, url.QueryEscape(Name))
+	resp, err := http.Get(queryURL)
+	if err != nil {
+		fmt.Println(err.Error())
+		return nil
+	}
+
+	body, err := ioutil.ReadAll(resp.Body)
+	if err != nil {
+		fmt.Println(err.Error())
+		return nil
+	}
+
+	var t struct {
+		Results []tmdbTvResult `json:"results"`
+	}
+	err = json.Unmarshal(body, &t)
+
+	fmt.Println(len(t.Results))
+
+	if len(t.Results) == 0 {
+		return nil
+	}
+
+	res := TVShowTMDB{
+		Thumbnail: "",
+		Overview:  t.Results[0].Overview,
+		GenreIds:  t.Results[0].GenreIds,
+	}
+
+	if t.Results[0].PosterPath != nil {
+		pic := fetchPoster(*t.Results[0].PosterPath)
+		if pic != nil {
+			res.Thumbnail = *pic
+		}
+	}
+
+	return &res
+}
+
+func fetchPoster(posterPath string) *string {
+	posterURL := fmt.Sprintf("%s%s", pictureBase, posterPath)
+	resp, err := http.Get(posterURL)
+	if err != nil {
+		fmt.Println(err.Error())
+		return nil
+	}
+
+	body, err := ioutil.ReadAll(resp.Body)
+	if err != nil {
+		fmt.Println(err.Error())
+		return nil
+	}
+
+	backpic64 := "data:image/jpeg;base64," + base64.StdEncoding.EncodeToString(body)
+	return &backpic64
+}
+
+var tmdbGenres *[]TMDBGenre
+
+func fetchGenres() *[]TMDBGenre {
+	posterURL := fmt.Sprintf("%sgenre/movie/list?api_key=%s", baseUrl, apiKey)
+	resp, err := http.Get(posterURL)
+	if err != nil {
+		fmt.Println(err.Error())
+		return nil
+	}
+
+	body, err := ioutil.ReadAll(resp.Body)
+	if err != nil {
+		fmt.Println(err.Error())
+		return nil
+	}
+
+	var t []TMDBGenre
+	err = json.Unmarshal(body, &t)
+
+	return &t
+}
+
+func GetGenres() *[]TMDBGenre {
+	// if generes are nil fetch them once
+	if tmdbGenres == nil {
+		tmdbGenres = fetchGenres()
+	}
+	return tmdbGenres
+}

database.sql

@@ -1,3 +1,22 @@
+create table if not exists actors
+(
+    actor_id  int auto_increment
+        primary key,
+    name      varchar(50) null,
+    thumbnail mediumblob  null
+)
+    comment 'informations about different actors';
+
+create table if not exists settings
+(
+    video_path       varchar(255)                          null,
+    episode_path     varchar(255)                          null,
+    password         varchar(32) default '-1'              null,
+    mediacenter_name varchar(32) default 'OpenMediaCenter' null,
+    TMDB_grabbing    tinyint                               null,
+    DarkMode         tinyint     default 0                 null
+);
+
 create table if not exists tags
 (
     tag_id   int auto_increment
@@ -5,20 +24,59 @@ create table if not exists tags
     tag_name varchar(50) null
 );
 
+create table if not exists tvshow
+(
+    name       varchar(100) null,
+    thumbnail  mediumblob   null,
+    id         int auto_increment
+        primary key,
+    foldername varchar(100) null
+);
+
+create table if not exists tvshow_episodes
+(
+    id        int auto_increment
+        primary key,
+    name      varchar(100) null,
+    season    int          null,
+    poster    mediumblob   null,
+    tvshow_id int          null,
+    episode   int          null,
+    filename  varchar(100) null,
+    constraint tvshow_episodes_tvshow_id_fk
+        foreign key (tvshow_id) references tvshow (id)
+);
+
 create table if not exists videos
 (
     movie_id    int auto_increment
         primary key,
-    movie_name  varchar(200)                       null,
-    movie_url   varchar(250)                       null,
-    thumbnail   mediumblob                         null,
-    poster      mediumblob                         null,
-    likes       int      default 0                 null,
-    quality     int                                null,
-    length      int                                null comment 'in seconds',
-    create_date datetime default CURRENT_TIMESTAMP null
+    movie_name  varchar(200)                         null,
+    movie_url   varchar(250)                         null,
+    thumbnail   mediumblob                           null,
+    poster      mediumblob                           null,
+    likes       int      default 0                   null,
+    quality     int                                  null,
+    length      int                                  null comment 'in seconds',
+    create_date datetime default current_timestamp() null
 );
 
+create table if not exists actors_videos
+(
+    actor_id int null,
+    video_id int null,
+    constraint actors_videos_actors_id_fk
+        foreign key (actor_id) references actors (actor_id),
+    constraint actors_videos_videos_movie_id_fk
+        foreign key (video_id) references videos (movie_id)
+);
+
+create index if not exists actors_videos_actor_id_index
+    on actors_videos (actor_id);
+
+create index if not exists actors_videos_video_id_index
+    on actors_videos (video_id);
+
 create table if not exists video_tags
 (
     tag_id   int null,
@@ -27,11 +85,16 @@ create table if not exists video_tags
         foreign key (tag_id) references tags (tag_id),
     constraint video_tags_videos_movie_id_fk
         foreign key (video_id) references videos (movie_id)
+            on delete cascade
 );
 
-INSERT INTO tags (tag_id, tag_name)
+
+INSERT IGNORE INTO tags (tag_id, tag_name)
 VALUES (2, 'fullhd');
-INSERT INTO tags (tag_id, tag_name)
+INSERT IGNORE INTO tags (tag_id, tag_name)
 VALUES (3, 'lowquality');
-INSERT INTO tags (tag_id, tag_name)
+INSERT IGNORE INTO tags (tag_id, tag_name)
 VALUES (4, 'hd');
+
+INSERT IGNORE INTO settings (video_path, episode_path, password, mediacenter_name)
+VALUES ('./videos/', './tvshows/', -1, 'OpenMediaCenter');

deb/OpenMediaCenter/DEBIAN/control

@@ -0,0 +1,9 @@
+Package: OpenMediaCenter
+Depends: nginx, mariadb-server, mediainfo
+Section: web
+Priority: optional
+Architecture: all
+Essential: no
+Installed-Size: 1024
+Maintainer: heili.eu
+Description: OpenMediaCenter

deb/OpenMediaCenter/DEBIAN/postinst

@@ -0,0 +1,21 @@
+#!/bin/bash
+# enable nginx site
+ln -sf /etc/nginx/sites-available/OpenMediaCenter.conf /etc/nginx/sites-enabled/OpenMediaCenter.conf
+
+# setup database
+mysql -uroot -pPASS -e "CREATE DATABASE IF NOT EXISTS mediacenter;"
+mysql -uroot -pPASS -e "CREATE USER IF NOT EXISTS 'mediacenteruser'@'localhost' IDENTIFIED BY 'mediapassword';"
+mysql -uroot -pPASS -e "GRANT ALL PRIVILEGES ON mediacenter . * TO 'mediacenteruser'@'localhost';"
+mysql -u mediacenteruser -pmediapassword mediacenter < /tmp/openmediacenter.sql
+
+# removed unused sql style file
+rm /tmp/openmediacenter.sql
+
+# correct user rights
+chown -R www-data:www-data /var/www/openmediacenter
+
+# restart services
+systemctl restart nginx
+
+systemctl enable OpenMediaCenter.service
+systemctl restart OpenMediaCenter.service

deb/OpenMediaCenter/DEBIAN/preinst

@@ -0,0 +1,4 @@
+#!/bin/bash
+#preset db password
+debconf-set-selections <<< 'mariadb-server-10.0 mysql-server/root_password password PASS'
+debconf-set-selections <<< 'mariadb-server-10.0 mysql-server/root_password_again password PASS'

deb/OpenMediaCenter/etc/nginx/sites-available/OpenMediaCenter.conf

@@ -0,0 +1,26 @@
+server {
+    listen 8080 default_server;
+    listen [::]:8080 default_server;
+
+    root /var/www/openmediacenter;
+
+    index index.html;
+
+    access_log /var/log/nginx/openmediacenter.access.log;
+    error_log /var/log/nginx/openmediacenter.error.log;
+
+    location / {
+        try_files $uri /index.html;
+    }
+
+    location ~* ^/(api/|token) {
+        proxy_pass http://127.0.0.1:8081;
+    }
+    location /subscribe {
+        proxy_pass http://127.0.0.1:8081;
+        proxy_http_version 1.1;
+        proxy_set_header Upgrade $http_upgrade;
+        proxy_set_header Connection "Upgrade";
+        proxy_set_header Host $host;
+    }
+}

deb/OpenMediaCenter/lib/systemd/system/OpenMediaCenter.service

@@ -0,0 +1,12 @@
+[Unit]
+Description=OpenMediaCenter start job
+After=network.target
+
+[Service]
+Type=simple
+ExecStart=openmediacenter
+Restart=always
+User=root
+
+[Install]
+WantedBy=default.target

declaration.d.ts

@@ -0,0 +1 @@
+declare module '*.css';

package.json

@@ -1,21 +1,34 @@
 {
   "name": "openmediacenter",
-  "version": "0.1.0",
+  "version": "0.1.3",
   "private": true,
+  "author": {
+    "email": "lukas.heiligenbrunner@gmail.com",
+    "name": "Lukas Heiligenbrunner",
+    "url": "https://heili.eu"
+  },
   "dependencies": {
-    "bootstrap": "^4.5.0",
-    "plyr-react": "^2.2.0",
-    "react": "^16.13.1",
-    "react-bootstrap": "^1.0.1",
-    "react-dom": "^16.13.1",
-    "react-scripts": "^3.4.1"
+    "@fortawesome/fontawesome-svg-core": "^1.2.32",
+    "@fortawesome/free-regular-svg-icons": "^5.15.1",
+    "@fortawesome/free-solid-svg-icons": "^5.15.1",
+    "@fortawesome/react-fontawesome": "^0.1.13",
+    "bootstrap": "^5.0.2",
+    "plyr-react": "^3.0.7",
+    "react": "^17.0.1",
+    "react-bootstrap": "^1.4.0",
+    "react-dom": "^17.0.1",
+    "react-router": "^5.2.0",
+    "react-router-dom": "^5.2.0",
+    "typescript": "^4.3.5",
+    "gowebsecure": "0.1.1-beta.2",
+    "gowebsecure-react": "0.1.0-beta.3"
   },
   "scripts": {
     "start": "react-scripts start",
-    "build": "react-scripts build",
-    "test": "react-scripts test --reporters=jest-junit --reporters=default",
-    "coverage": "react-scripts test --coverage --watchAll=false",
-    "eject": "react-scripts eject"
+    "build": "CI=false react-scripts build",
+    "test": "CI=true react-scripts test --reporters=jest-junit --verbose --silent --coverage --reporters=default",
+    "lint": "eslint --format gitlab src/",
+    "apidoc": "apidoc -i apiGo/ -o doc/"
   },
   "jest": {
     "collectCoverageFrom": [
@@ -27,11 +40,8 @@
       "text-summary"
     ]
   },
-  "proxy": "http://192.168.0.248",
+  "proxy": "http://127.0.0.1:8080",
   "homepage": "/",
-  "eslintConfig": {
-    "extends": "react-app"
-  },
   "browserslist": {
     "production": [
       ">0.2%",
@@ -45,11 +55,37 @@
     ]
   },
   "devDependencies": {
-    "@testing-library/jest-dom": "^4.2.4",
-    "@testing-library/react": "^9.5.0",
-    "@testing-library/user-event": "^7.2.1",
+    "@testing-library/jest-dom": "^5.14.1",
+    "@testing-library/react": "^12.0.0",
+    "@testing-library/user-event": "^13.2.1",
+    "@types/jest": "^26.0.24",
+    "@types/node": "^16.4.7",
+    "@types/react": "^17.0.15",
+    "@types/react-dom": "^17.0.9",
+    "@types/react-router": "5.1.16",
+    "@types/react-router-dom": "^5.1.8",
+    "@typescript-eslint/eslint-plugin": "^4.28.5",
+    "@typescript-eslint/parser": "^4.28.5",
+    "apidoc": "^0.28.1",
     "enzyme": "^3.11.0",
-    "enzyme-adapter-react-16": "^1.15.2",
-    "jest-junit": "^10.0.0"
+    "enzyme-adapter-react-16": "^1.15.5",
+    "eslint": "^7.31.0",
+    "eslint-config-prettier": "^8.1.0",
+    "eslint-formatter-gitlab": "^2.2.0",
+    "eslint-plugin-eslint-comments": "^3.2.0",
+    "eslint-plugin-jest": "^24.4.0",
+    "eslint-plugin-prettier": "^3.3.1",
+    "eslint-plugin-react": "^7.22.0",
+    "eslint-plugin-react-hooks": "^4.2.0",
+    "jest-junit": "^12.0.0",
+    "prettier": "^2.3.2",
+    "prettier-config": "^1.0.0",
+    "react-scripts": "4.0.3"
+  },
+  "apidoc": {
+    "name": "OpenMediaCenter",
+    "description": "API Documentation of OpenMediaCenter",
+    "title": "OpenMediaCenter Doc",
+    "sampleUrl": null
   }
 }

public/index.html

@@ -2,14 +2,14 @@
 <html lang="en">
   <head>
     <meta charset="utf-8" />
-    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
+    <link rel="icon" href="%PUBLIC_URL%/logo_circle.png" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="theme-color" content="#000000" />
     <meta
       name="description"
       content="A Application to run a Mediacenter in your local network"
     />
-    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
+    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo_circle.png" />
     <!--
       manifest.json provides metadata used when your web app is installed on a
       user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/

public/manifest.json

@@ -3,19 +3,9 @@
   "name": "Create React App Sample",
   "icons": [
     {
-      "src": "favicon.ico",
-      "sizes": "64x64 32x32 24x24 16x16",
-      "type": "image/x-icon"
-    },
-    {
-      "src": "logo192.png",
+      "src": "logo_circle.png",
       "type": "image/png",
       "sizes": "192x192"
-    },
-    {
-      "src": "logo512.png",
-      "type": "image/png",
-      "sizes": "512x512"
     }
   ],
   "start_url": ".",

src/App.js

@@ -1,105 +0,0 @@
-import React from 'react';
-import "./css/App.css"
-import HomePage from "./pages/HomePage/HomePage";
-import RandomPage from "./pages/RandomPage/RandomPage";
-
-// include bootstraps css
-import 'bootstrap/dist/css/bootstrap.min.css';
-import SettingsPage from "./pages/SettingsPage/SettingsPage";
-import CategoryPage from "./pages/CategoryPage/CategoryPage";
-
-class App extends React.Component {
-    constructor(props, context) {
-        super(props, context);
-        this.state = {page: "default"};
-
-        // bind this to the method for being able to call methods such as this.setstate
-        this.showVideo = this.showVideo.bind(this);
-        this.hideVideo = this.hideVideo.bind(this);
-    }
-
-    videoelement = null;
-
-    MainBody() {
-        let page;
-        if (this.state.page === "default") {
-            page = <HomePage viewbinding={{showVideo: this.showVideo, hideVideo: this.hideVideo}}/>;
-            this.mypage = page;
-        } else if (this.state.page === "random") {
-            page = <RandomPage viewbinding={{showVideo: this.showVideo, hideVideo: this.hideVideo}}/>;
-            this.mypage = page;
-        } else if (this.state.page === "settings") {
-            page = <SettingsPage/>;
-            this.mypage = page;
-        } else if (this.state.page === "categories") {
-            page = <CategoryPage viewbinding={{showVideo: this.showVideo, hideVideo: this.hideVideo}}/>;
-            this.mypage = page;
-        } else if (this.state.page === "video") {
-            // show videoelement if neccessary
-            page = this.videoelement;
-
-            console.log(page);
-        } else if (this.state.page === "lastpage") {
-            // return back to last page
-            page = this.mypage;
-        } else {
-            page = <div>unimplemented yet!</div>;
-        }
-        return (page);
-    }
-
-    render() {
-        return (
-            <div className="App">
-                <nav className="navbar navbar-expand-sm bg-primary navbar-dark">
-                    <div className="navbar-brand">OpenMediaCenter</div>
-
-                    <ul className="navbar-nav">
-                        <li className="nav-item">
-                            <div className="nav-link"
-                                 style={this.state.page === "default" ? {color: "rgba(255,255,255,.75"} : {}}
-                                 onClick={() => this.setState({page: "default"})}>Home
-                            </div>
-                        </li>
-                        <li className="nav-item">
-                            <div className="nav-link"
-                                 style={this.state.page === "random" ? {color: "rgba(255,255,255,.75"} : {}}
-                                 onClick={() => this.setState({page: "random"})}>Random Video
-                            </div>
-                        </li>
-                        <li className="nav-item">
-                            <div className="nav-link"
-                                 style={this.state.page === "categories" ? {color: "rgba(255,255,255,.75"} : {}}
-                                 onClick={() => this.setState({page: "categories"})}>Categories
-                            </div>
-                        </li>
-                        <li className="nav-item">
-                            <div className="nav-link"
-                                 style={this.state.page === "settings" ? {color: "rgba(255,255,255,.75"} : {}}
-                                 onClick={() => this.setState({page: "settings"})}>Settings
-                            </div>
-                        </li>
-                    </ul>
-                </nav>
-                {this.MainBody()}
-            </div>
-        );
-    }
-
-    showVideo(element) {
-        this.videoelement = element;
-
-        this.setState({
-            page: "video"
-        });
-    }
-
-    hideVideo() {
-        this.setState({
-            page: "lastpage"
-        });
-        this.element = null;
-    }
-}
-
-export default App;

src/App.module.css

@@ -0,0 +1,59 @@
+.app {
+    user-select: none;
+}
+
+.navitem {
+    cursor: pointer;
+    float: left;
+
+    font-size: large;
+    font-weight: bold;
+
+    margin-left: 20px;
+    opacity: 0.6;
+    text-transform: capitalize;
+    text-decoration: none;
+}
+
+.navitem:hover {
+    opacity: 1;
+    text-decoration: none;
+    transition: opacity .5s;
+}
+
+.navitem::after {
+    content: '';
+    display: block;
+    height: 2px;
+    transition: width .3s;
+    width: 0;
+}
+
+.navitem:hover::after {
+    width: 100%;
+}
+
+
+.navitemselected {
+    opacity: 0.85;
+}
+
+.navcontainer {
+    border-style: dotted;
+    border-width: 0 0 2px 0;
+
+    padding-bottom: 40px;
+    padding-top: 20px;
+    width: 100%;
+}
+
+.navbrand {
+    float: left;
+    font-size: large;
+    font-weight: bold;
+    margin-left: 20px;
+    margin-right: 20px;
+    text-transform: capitalize;
+}
+
+

src/App.test.js

@@ -1,6 +1,7 @@
 import React from 'react';
 import App from './App';
-import {shallow} from 'enzyme'
+import {shallow} from 'enzyme';
+import GlobalInfos from "./utils/GlobalInfos";
 
 describe('<App/>', function () {
     it('renders without crashing ', function () {
@@ -10,11 +11,42 @@ describe('<App/>', function () {
 
     it('renders title', () => {
         const wrapper = shallow(<App/>);
-        expect(wrapper.find('.navbar-brand').text()).toBe('OpenMediaCenter');
+        wrapper.setState({password: false});
+        expect(wrapper.find('.navbrand').text()).toBe('OpenMediaCenter');
     });
 
     it('are navlinks correct', function () {
         const wrapper = shallow(<App/>);
-        expect(wrapper.find('nav').find('li')).toHaveLength(4);
+        wrapper.setState({password: false});
+        expect(wrapper.find('.navitem')).toHaveLength(4);
+
+        GlobalInfos.setTVShowsEnabled(true);
+
+        wrapper.instance().forceUpdate();
+        expect(wrapper.find('.navitem')).toHaveLength(5);
+    });
+
+    it('test initial fetch from api', done => {
+        callAPIMock({
+            MediacenterName: 'testname'
+        })
+
+        GlobalInfos.enableDarkTheme = jest.fn((r) => {})
+
+        const wrapper = shallow(<App/>);
+
+        process.nextTick(() => {
+            expect(document.title).toBe('testname');
+
+            global.fetch.mockClear();
+            done();
+        });
+    });
+
+    it('test render of password page', function () {
+        const wrapper = shallow(<App/>);
+        wrapper.setState({password: true});
+
+        expect(wrapper.find('AuthenticationPage')).toHaveLength(1);
     });
 });

src/App.tsx

@@ -0,0 +1,214 @@
+import React from 'react';
+import HomePage from './pages/HomePage/HomePage';
+import RandomPage from './pages/RandomPage/RandomPage';
+import GlobalInfos from './utils/GlobalInfos';
+
+// include bootstraps css
+import 'bootstrap/dist/css/bootstrap.min.css';
+import style from './App.module.css';
+
+import SettingsPage from './pages/SettingsPage/SettingsPage';
+import CategoryPage from './pages/CategoryPage/CategoryPage';
+
+import {BrowserRouter as Router, NavLink, Route, Switch} from 'react-router-dom';
+import Player from './pages/Player/Player';
+import ActorOverviewPage from './pages/ActorOverviewPage/ActorOverviewPage';
+import ActorPage from './pages/ActorPage/ActorPage';
+import {APINode, SettingsTypes} from './types/ApiTypes';
+import AuthenticationPage from './pages/AuthenticationPage/AuthenticationPage';
+import TVShowPage from './pages/TVShowPage/TVShowPage';
+import TVPlayer from './pages/TVShowPage/TVPlayer';
+import {CookieTokenStore, token} from 'gowebsecure';
+import {callAPI} from 'gowebsecure';
+
+interface state {
+    password: boolean | null; // null if uninitialized - true if pwd needed false if not needed
+    mediacentername: string;
+}
+
+/**
+ * The main App handles the main tabs and which content to show
+ */
+class App extends React.Component<{}, state> {
+    constructor(props: {}) {
+        super(props);
+
+        token.init(new CookieTokenStore());
+
+        let pwdneeded: boolean | null = null;
+
+        if (token.apiTokenValid()) {
+            pwdneeded = false;
+        } else {
+            token.refreshAPIToken(
+                (err) => {
+                    if (err === 'invalid_client') {
+                        this.setState({password: true});
+                    } else if (err === '') {
+                        this.setState({password: false});
+                    } else {
+                        console.log('unimplemented token error: ' + err);
+                    }
+                },
+                true,
+                'openmediacenter',
+                '0'
+            );
+        }
+
+        this.state = {
+            mediacentername: 'OpenMediaCenter',
+            password: pwdneeded
+        };
+
+        // force an update on theme change
+        GlobalInfos.onThemeChange(() => {
+            this.forceUpdate();
+        });
+
+        // set the hook to load passwordfield on global func call
+        GlobalInfos.loadPasswordPage = (callback?: () => void): void => {
+            // try refreshing the token
+            token.refreshAPIToken((err) => {
+                if (err !== '') {
+                    this.setState({password: true});
+                } else {
+                    // call callback if request was successful
+                    if (callback) {
+                        callback();
+                    }
+                }
+            }, true);
+        };
+    }
+
+    initialAPICall(): void {
+        // this is the first api call so if it fails we know there is no connection to backend
+        callAPI(APINode.Settings, {action: 'loadInitialData'}, (result: SettingsTypes.initialApiCallData) => {
+            // set theme
+            GlobalInfos.enableDarkTheme(result.DarkMode);
+
+            GlobalInfos.setVideoPaths(result.VideoPath, result.TVShowPath);
+
+            GlobalInfos.setTVShowsEnabled(result.TVShowEnabled);
+
+            this.setState({
+                mediacentername: result.MediacenterName
+            });
+            // set tab title to received mediacenter name
+            document.title = result.MediacenterName;
+        });
+    }
+
+    componentDidMount(): void {
+        this.initialAPICall();
+    }
+
+    render(): JSX.Element {
+        // add the main theme to the page body
+        document.body.className = GlobalInfos.getThemeStyle().backgroundcolor;
+
+        if (this.state.password === true) {
+            // render authentication page if auth is neccessary
+            return (
+                <AuthenticationPage
+                    onSuccessLogin={(): void => {
+                        this.setState({password: false});
+                        // reinit general infos
+                        this.initialAPICall();
+                    }}
+                />
+            );
+        } else if (this.state.password === false) {
+            return (
+                <Router>
+                    <div className={style.app}>
+                        {this.navBar()}
+                        {this.routing()}
+                    </div>
+                </Router>
+            );
+        } else {
+            return <>still loading...</>;
+        }
+    }
+
+    /**
+     * render the top navigation bar
+     */
+    navBar(): JSX.Element {
+        const themeStyle = GlobalInfos.getThemeStyle();
+
+        return (
+            <div className={[style.navcontainer, themeStyle.backgroundcolor, themeStyle.textcolor, themeStyle.hrcolor].join(' ')}>
+                <div className={style.navbrand}>{this.state.mediacentername}</div>
+                <NavLink className={[style.navitem, themeStyle.navitem].join(' ')} to={'/'} activeStyle={{opacity: '0.85'}}>
+                    Home
+                </NavLink>
+                <NavLink className={[style.navitem, themeStyle.navitem].join(' ')} to={'/random'} activeStyle={{opacity: '0.85'}}>
+                    Random Video
+                </NavLink>
+
+                <NavLink className={[style.navitem, themeStyle.navitem].join(' ')} to={'/categories'} activeStyle={{opacity: '0.85'}}>
+                    Categories
+                </NavLink>
+
+                {GlobalInfos.isTVShowEnabled() ? (
+                    <NavLink className={[style.navitem, themeStyle.navitem].join(' ')} to={'/tvshows'} activeStyle={{opacity: '0.85'}}>
+                        TV Shows
+                    </NavLink>
+                ) : null}
+
+                <NavLink className={[style.navitem, themeStyle.navitem].join(' ')} to={'/settings'} activeStyle={{opacity: '0.85'}}>
+                    Settings
+                </NavLink>
+            </div>
+        );
+    }
+
+    /**
+     * render the react router elements
+     */
+    routing(): JSX.Element {
+        return (
+            <Switch>
+                <Route path='/random'>
+                    <RandomPage />
+                </Route>
+                <Route path='/categories'>
+                    <CategoryPage />
+                </Route>
+                <Route path='/settings'>
+                    <SettingsPage />
+                </Route>
+                <Route exact path='/player/:id'>
+                    <Player />
+                </Route>
+                <Route exact path='/actors'>
+                    <ActorOverviewPage />
+                </Route>
+                <Route path='/actors/:id'>
+                    <ActorPage />
+                </Route>
+
+                {GlobalInfos.isTVShowEnabled() ? (
+                    <Route path='/tvshows'>
+                        <TVShowPage />
+                    </Route>
+                ) : null}
+
+                {GlobalInfos.isTVShowEnabled() ? (
+                    <Route exact path='/tvplayer/:id'>
+                        <TVPlayer />
+                    </Route>
+                ) : null}
+
+                <Route path='/'>
+                    <HomePage />
+                </Route>
+            </Switch>
+        );
+    }
+}
+
+export default App;

src/AppDarkTheme.module.css

@@ -0,0 +1,48 @@
+/**
+ * The coloring elements for dark theme
+ */
+
+.backgroundcolor {
+    background-color: #141520;
+}
+
+.textcolor {
+    color: white;
+}
+
+.subtextcolor {
+    color: #dedad6;
+}
+
+.lighttextcolor {
+    color: #d5d5d5;
+}
+
+.navitem::after {
+    background: white;
+}
+
+.navitem {
+    color: white;
+}
+
+.navitem:hover {
+    color: white;
+}
+
+.hrcolor {
+    border-color: rgba(255, 255, 255, .1);
+}
+
+.secbackground {
+    background-color: #3c3d48;
+}
+
+.thirdbackground {
+    background-color: #141520;
+}
+
+.preview:hover {
+    box-shadow: rgba(255, 255, 255, 0.7) 0 0 0 5px;
+}
+

src/AppLightTheme.module.css

@@ -0,0 +1,47 @@
+/**
+ * The coloring elements for light theme
+ */
+
+.navitem {
+    color: black;
+}
+
+.navitem:hover {
+    color: black;
+}
+
+.navitem::after {
+    background: black;
+}
+
+.backgroundcolor {
+    background-color: white;
+}
+
+.textcolor {
+    color: black;
+}
+
+.subtextcolor {
+    color: #212529;
+}
+
+.lighttextcolor {
+    color: #3d3d3d;
+}
+
+.hrcolor {
+    border-color: rgba(0, 0, 0, 0.1);
+}
+
+.secbackground {
+    background-color: #a8c3ff;
+}
+
+.thirdbackground {
+    background-color: #8ca3fc;
+}
+
+.preview:hover {
+    box-shadow: rgba(2, 12, 27, 0.7) 0 0 0 5px;
+}

src/css/App.css

@@ -1,12 +0,0 @@
-.nav-item {
-    cursor: pointer;
-}
-
-.nav-link {
-    color: rgba(255, 255, 255, .5);
-    font-weight: bold;
-}
-
-.nav-link:hover {
-    color: rgba(255, 255, 255, 1);
-}

src/css/index.css

@@ -1,8 +0,0 @@
-body {
-    margin: 0;
-    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
-    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
-    sans-serif;
-    -webkit-font-smoothing: antialiased;
-    -moz-osx-font-smoothing: grayscale;
-}

src/elements/ActorTile/ActorTile.module.css

@@ -0,0 +1,29 @@
+.actortile {
+    background-color: #179017;
+    border-radius: 10px;
+    cursor: pointer;
+    float: left;
+    height: 200px;
+    margin: 3px;
+    transition: opacity ease 0.5s;
+
+    width: 130px;
+}
+
+.actortile:hover {
+    opacity: 0.7;
+    transition: opacity ease 0.5s;
+}
+
+.actortile_thumbnail {
+    color: #c6c6c6;
+    height: 160px;
+    margin-top: 10px;
+    text-align: center;
+}
+
+.actortile_name {
+    color: white;
+    text-align: center;
+    /*todo dynamic text coloring dependent on theme*/
+}

src/elements/ActorTile/ActorTile.test.js

@@ -0,0 +1,19 @@
+import {shallow} from 'enzyme';
+import React from 'react';
+import ActorTile from './ActorTile';
+
+describe('<ActorTile/>', function () {
+    it('renders without crashing ', function () {
+        const wrapper = shallow(<ActorTile actor={{Thumbnail: '-1', Name: 'testname', id: 3}}/>);
+        wrapper.unmount();
+    });
+
+    it('simulate click with custom handler', function () {
+        const func = jest.fn((_) => {});
+        const wrapper = shallow(<ActorTile actor={{Thumbnail: '-1', Name: 'testname', id: 3}} onClick={() => func()}/>);
+
+        wrapper.simulate('click');
+
+        expect(func).toBeCalledTimes(1);
+    });
+});

src/elements/ActorTile/ActorTile.tsx

@@ -0,0 +1,52 @@
+import style from './ActorTile.module.css';
+import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
+import {faUser} from '@fortawesome/free-solid-svg-icons';
+import React from 'react';
+import {Link} from 'react-router-dom';
+import {ActorType} from '../../types/VideoTypes';
+
+interface Props {
+    actor: ActorType;
+    onClick?: (actor: ActorType) => void;
+}
+
+class ActorTile extends React.Component<Props> {
+    constructor(props: Props) {
+        super(props);
+
+        this.state = {};
+    }
+
+    render(): JSX.Element {
+        if (this.props.onClick) {
+            return this.renderActorTile(this.props.onClick);
+        } else {
+            return <Link to={{pathname: '/actors/' + this.props.actor.ActorId}}>{this.renderActorTile(() => {})}</Link>;
+        }
+    }
+
+    renderActorTile(customclickhandler: (actor: ActorType) => void): JSX.Element {
+        return (
+            <div className={style.actortile} onClick={(): void => customclickhandler(this.props.actor)}>
+                <div className={style.actortile_thumbnail}>
+                    {
+                        this.props.actor.Thumbnail === '' ? (
+                            <FontAwesomeIcon
+                                style={{
+                                    lineHeight: '130px'
+                                }}
+                                icon={faUser}
+                                size='5x'
+                            />
+                        ) : (
+                            'dfdf'
+                        ) /* todo render picture provided here! */
+                    }
+                </div>
+                <div className={style.actortile_name}>{this.props.actor.Name}</div>
+            </div>
+        );
+    }
+}
+
+export default ActorTile;

src/elements/AddTagPopup/AddTagPopup.js

@@ -1,89 +0,0 @@
-import React from "react";
-import Modal from 'react-bootstrap/Modal'
-import Dropdown from "react-bootstrap/Dropdown";
-import DropdownButton from "react-bootstrap/DropdownButton";
-
-class AddTagPopup extends React.Component {
-    constructor(props, context) {
-        super(props, context);
-
-        this.state = {
-            selection: {
-                name: "nothing selected",
-                id: -1
-            },
-            items: []
-        };
-
-        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">
-                            Add to Tag
-                        </Modal.Title>
-                    </Modal.Header>
-                    <Modal.Body>
-                        <h4>Select a Tag:</h4>
-                        <DropdownButton id="dropdown-basic-button" title={this.state.selection.name}>
-                            {this.state.items ?
-                                this.state.items.map((i) => (
-                                    <Dropdown.Item key={i.tag_name} onClick={() => {
-                                        this.setState({selection: {name: i.tag_name, id: i.tag_id}})
-                                    }}>{i.tag_name}</Dropdown.Item>
-                                )) :
-                                <Dropdown.Item>loading tags...</Dropdown.Item>}
-                        </DropdownButton>
-                    </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', 'addTag');
-        updateRequest.append('id', this.state.selection.id);
-        updateRequest.append('movieid', this.props.movie_id);
-
-        fetch('/api/videoload.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 AddTagPopup;

src/elements/AddTagPopup/AddTagPopup.test.js

@@ -1,60 +0,0 @@
-import React from "react";
-
-import {shallow} from 'enzyme'
-import "@testing-library/jest-dom"
-
-import AddTagPopup from "./AddTagPopup";
-
-describe('<AddTagPopup/>', function () {
-    it('renders without crashing ', function () {
-        const wrapper = shallow(<AddTagPopup/>);
-        wrapper.unmount();
-    });
-
-    it('test dropdown insertion', function () {
-        const wrapper = shallow(<AddTagPopup/>);
-        wrapper.setState({items: ["test1", "test2", "test3"]});
-        expect(wrapper.find('DropdownItem')).toHaveLength(3);
-    });
-
-    it('test storeseletion click event', done => {
-        const mockSuccessResponse = {};
-        const mockJsonPromise = Promise.resolve(mockSuccessResponse);
-        const mockFetchPromise = Promise.resolve({
-            json: () => mockJsonPromise,
-        });
-        global.fetch = jest.fn().mockImplementation(() => mockFetchPromise);
-
-        const func = jest.fn();
-
-        const wrapper = shallow(<AddTagPopup/>);
-        wrapper.setProps({
-            onHide: () => {
-                func()
-            }
-        });
-
-        wrapper.setState({
-            items: ["test1", "test2", "test3"],
-            selection: {
-                name: "test1",
-                id: 42
-            }
-        });
-
-        // first call of fetch is getting of available tags
-        expect(global.fetch).toHaveBeenCalledTimes(1);
-        wrapper.find('ModalFooter').find('button').simulate('click');
-
-        // now called 2 times
-        expect(global.fetch).toHaveBeenCalledTimes(2);
-
-        process.nextTick(() => {
-            //callback to close window should have called
-            expect(func).toHaveBeenCalledTimes(1);
-
-            global.fetch.mockClear();
-            done();
-        });
-    });
-});

src/elements/DynamicContentContainer/DynamicContentContainer.module.css

@@ -0,0 +1,5 @@
+.maincontent {
+    float: left;
+    width: 70%;
+    flex: 1;
+}

src/elements/DynamicContentContainer/DynamicContentContainer.test.js

@@ -0,0 +1,49 @@
+import {shallow} from 'enzyme';
+import React from 'react';
+import DynamicContentContainer from './DynamicContentContainer';
+
+describe('<DynamicContentContainer/>', function () {
+    it('renders without crashing ', function () {
+        const wrapper = shallow(<DynamicContentContainer data={[]} renderElement={(el) => (<></>)}/>);
+        wrapper.unmount();
+    });
+
+    it('inserts tiles correctly if enough available', () => {
+        const wrapper = shallow(<DynamicContentContainer data={[
+            {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}
+        ]} renderElement={(el) => (<a/>)}/>);
+        expect(wrapper.find('a')).toHaveLength(16);
+    });
+
+    it('inserts tiles correctly if not enough available', () => {
+        const wrapper = shallow(<DynamicContentContainer data={[
+            {}, {}, {}, {}
+        ]} renderElement={(el) => (<a/>)}/>);
+        expect(wrapper.find('a')).toHaveLength(4);
+    });
+
+    it('no items available', () => {
+        const wrapper = shallow(<DynamicContentContainer data={[]} renderElement={(el) => (<a/>)}/>);
+        expect(wrapper.find('a')).toHaveLength(0);
+        expect(wrapper.find('.maincontent').text()).toBe('no items to show!');
+    });
+
+    it('test clean', function () {
+        const wrapper = shallow(<DynamicContentContainer data={[{}, {}, {}]} renderElement={(el) => (<a/>)}/>);
+        expect(wrapper.find('a')).toHaveLength(3);
+        wrapper.instance().clean();
+        expect(wrapper.find('a')).toHaveLength(0);
+    });
+
+    it('test update', function () {
+        const wrapper = shallow(<DynamicContentContainer data={[{}, {}, {}]} renderElement={(el) => (<a/>)}/>);
+
+        const func = jest.fn();
+        wrapper.instance().clean = func;
+
+        // perform component update
+        wrapper.setProps({data: [{}, {}]});
+
+        expect(func).toHaveBeenCalledTimes(1);
+    });
+});

src/elements/DynamicContentContainer/DynamicContentContainer.tsx

@@ -0,0 +1,113 @@
+import React from 'react';
+import style from './DynamicContentContainer.module.css';
+
+interface Props<T> {
+    renderElement: (elem: T) => JSX.Element;
+    data: T[];
+    initialLoadNr?: number;
+}
+
+interface state<T> {
+    loadeditems: T[];
+}
+
+/**
+ * A videocontainer storing lots of Preview elements
+ * includes scroll handling and loading of preview infos
+ */
+class DynamicContentContainer<T> extends React.Component<Props<T>, state<T>> {
+    // stores current index of loaded elements
+    loadindex: number = 0;
+
+    readonly InitialLoadNR = this.props.initialLoadNr
+        ? this.props.initialLoadNr === -1
+            ? this.props.data.length
+            : this.props.initialLoadNr
+        : 16;
+
+    constructor(props: Props<T>) {
+        super(props);
+
+        this.state = {
+            loadeditems: []
+        };
+    }
+
+    componentDidMount(): void {
+        document.addEventListener('scroll', this.trackScrolling);
+
+        this.loadPreviewBlock(this.InitialLoadNR);
+    }
+
+    componentDidUpdate(prevProps: Props<T>): void {
+        // when source props change force update!
+        if (
+            // diff the two arrays
+            this.props.data
+                .filter((x) => !prevProps.data.includes(x))
+                .concat(prevProps.data.filter((x) => !this.props.data.includes(x))).length !== 0
+        ) {
+            this.clean((): void => {
+                this.loadPreviewBlock(this.InitialLoadNR);
+            });
+        }
+    }
+
+    /**
+     * clear all elements rendered...
+     */
+    clean(callback: () => void): void {
+        this.loadindex = 0;
+        this.setState({loadeditems: []}, callback);
+    }
+
+    render(): JSX.Element {
+        return (
+            <div className={style.maincontent}>
+                {this.state.loadeditems.map((elem) => {
+                    return this.props.renderElement(elem);
+                })}
+                {/*todo css for no items to show*/}
+                {this.state.loadeditems.length === 0 ? 'no items to show!' : null}
+                {this.props.children}
+            </div>
+        );
+    }
+
+    componentWillUnmount(): void {
+        // 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: number): void {
+        let ret = [];
+        for (let i = 0; i < nr; i++) {
+            // only add if not end
+            if (this.props.data.length > this.loadindex + i) {
+                ret.push(this.props.data[this.loadindex + i]);
+            }
+        }
+
+        this.setState({
+            loadeditems: [...this.state.loadeditems, ...ret]
+        });
+
+        this.loadindex += nr;
+    }
+
+    /**
+     * scroll event handler -> load new previews if on bottom
+     */
+    trackScrolling = (): void => {
+        // 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);
+        }
+    };
+}
+
+export default DynamicContentContainer;

src/elements/FilterButton/FilterButton.test.js

@@ -0,0 +1,64 @@
+import {shallow} from 'enzyme';
+import React from 'react';
+import FilterButton from './FilterButton';
+import RandomPage from "../../pages/RandomPage/RandomPage";
+import {callAPI} from "../../utils/Api";
+
+describe('<FilterButton/>', function () {
+    it('renders without crashing ', function () {
+        const wrapper = shallow(<FilterButton onFilterChange={() => {}}/>);
+        wrapper.unmount();
+    });
+
+    it('test initial render ', function () {
+        const wrapper = shallow(<FilterButton onFilterChange={() => {}}/>);
+        expect(wrapper.find('input')).toHaveLength(0);
+    });
+
+    it('test clicking', function () {
+        const wrapper = shallow(<FilterButton onFilterChange={() => {}}/>);
+        wrapper.simulate('click');
+
+        expect(wrapper.find('input')).toHaveLength(1);
+    });
+
+    it('test call of callback on textfield change', function () {
+        let val = '';
+        const func = jest.fn((vali => {val = vali}));
+
+        const wrapper = shallow(<FilterButton onFilterChange={func}/>);
+        wrapper.simulate('click');
+
+        wrapper.find('input').simulate('change', {target: {value: 'test'}});
+
+        expect(func).toHaveBeenCalledTimes(1);
+        expect(val).toBe('test')
+    });
+
+    it('test closing on x button click', function () {
+        const wrapper = shallow(<FilterButton onFilterChange={() => {}}/>);
+        wrapper.simulate('click');
+
+        expect(wrapper.find('input')).toHaveLength(1);
+
+        wrapper.find('Button').simulate('click');
+
+        expect(wrapper.find('input')).toHaveLength(0);
+    });
+
+    it('test shortkey press', function () {
+        let events = [];
+        document.addEventListener = jest.fn((event, cb) => {
+            events[event] = cb;
+        });
+
+        shallow(<RandomPage/>);
+
+        const wrapper = shallow(<FilterButton onFilterChange={() => {}}/>);
+        expect(wrapper.find('input')).toHaveLength(0);
+        // trigger the keypress event
+        events.keyup({key: 'f'});
+
+        expect(wrapper.find('input')).toHaveLength(1);
+    });
+});

src/elements/FilterButton/FilterButton.tsx

@@ -0,0 +1,121 @@
+import React from 'react';
+import style from '../Popups/AddActorPopup/AddActorPopup.module.css';
+import {Button} from '../GPElements/Button';
+import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
+import {faFilter, faTimes} from '@fortawesome/free-solid-svg-icons';
+import {addKeyHandler, removeKeyHandler} from '../../utils/ShortkeyHandler';
+
+interface Props {
+    onFilterChange: (filter: string) => void;
+}
+
+interface state {
+    filtervisible: boolean;
+    filter: string;
+}
+
+class FilterButton extends React.Component<Props, state> {
+    // filterfield anchor, needed to focus after filter btn click
+    private filterfield: HTMLInputElement | null | undefined;
+
+    constructor(props: Props) {
+        super(props);
+
+        this.state = {
+            filtervisible: false,
+            filter: ''
+        };
+
+        this.keypress = this.keypress.bind(this);
+        this.enableFilterField = this.enableFilterField.bind(this);
+    }
+
+    componentWillUnmount(): void {
+        removeKeyHandler(this.keypress);
+    }
+
+    componentDidMount(): void {
+        addKeyHandler(this.keypress);
+    }
+
+    render(): JSX.Element {
+        if (this.state.filtervisible) {
+            return (
+                <>
+                    <input
+                        className={'form-control mr-sm-2 ' + style.searchinput}
+                        type='text'
+                        placeholder='Filter'
+                        value={this.state.filter}
+                        onChange={(e): void => {
+                            this.props.onFilterChange(e.target.value);
+                            this.setState({filter: e.target.value});
+                        }}
+                        ref={(input): void => {
+                            this.filterfield = input;
+                        }}
+                    />
+                    <Button
+                        title={
+                            <FontAwesomeIcon
+                                style={{
+                                    verticalAlign: 'middle',
+                                    lineHeight: '130px'
+                                }}
+                                icon={faTimes}
+                                size='1x'
+                            />
+                        }
+                        color={{backgroundColor: 'red'}}
+                        onClick={(): void => {
+                            this.setState({filter: '', filtervisible: false});
+                        }}
+                    />
+                </>
+            );
+        } else {
+            return (
+                <Button
+                    title={
+                        <span>
+                            Filter{' '}
+                            <FontAwesomeIcon
+                                style={{
+                                    verticalAlign: 'middle',
+                                    lineHeight: '130px'
+                                }}
+                                icon={faFilter}
+                                size='1x'
+                            />
+                        </span>
+                    }
+                    color={{backgroundColor: 'cornflowerblue', color: 'white'}}
+                    onClick={this.enableFilterField}
+                />
+            );
+        }
+    }
+
+    /**
+     * enable filterfield and focus into searchbar
+     */
+    private enableFilterField(): void {
+        this.setState({filtervisible: true}, () => {
+            // focus filterfield after state update
+            this.filterfield?.focus();
+        });
+    }
+
+    /**
+     * key event handling
+     * @param event keyevent
+     */
+    private keypress(event: KeyboardEvent): void {
+        // hide if escape is pressed
+        if (event.key === 'f') {
+            this.enableFilterField();
+        }
+    }
+}
+
+export default FilterButton;

src/elements/GPElements/Button.module.css

@@ -0,0 +1,8 @@
+.button {
+    background-color: green;
+    border-radius: 5px;
+    border-width: 0;
+    color: white;
+    margin-right: 15px;
+    padding: 6px;
+}

src/elements/GPElements/Button.test.js

@@ -0,0 +1,32 @@
+import {shallow} from 'enzyme';
+import React from 'react';
+import {Button} from './Button';
+
+function prepareFetchApi(response) {
+    const mockJsonPromise = Promise.resolve(response);
+    const mockFetchPromise = Promise.resolve({
+        json: () => mockJsonPromise
+    });
+    return (jest.fn().mockImplementation(() => mockFetchPromise));
+}
+
+describe('<Button/>', function () {
+    it('renders without crashing ', function () {
+        const wrapper = shallow(<Button onClick={() => {}} title='test'/>);
+        wrapper.unmount();
+    });
+
+    it('renders title', function () {
+        const wrapper = shallow(<Button onClick={() => {}} title='test1'/>);
+        expect(wrapper.text()).toBe('test1');
+    });
+
+    it('test onclick handling', () => {
+        const func = jest.fn();
+        const wrapper = shallow(<Button onClick={func} title='test1'/>);
+
+        wrapper.find('button').simulate('click');
+
+        expect(func).toHaveBeenCalledTimes(1);
+    });
+});

src/elements/GPElements/Button.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+import style from './Button.module.css';
+
+interface ButtonProps {
+    title: string | JSX.Element;
+    onClick?: () => void;
+    color?: React.CSSProperties;
+}
+
+export function Button(props: ButtonProps): JSX.Element {
+    return (
+        <button className={style.button} style={props.color} onClick={props.onClick}>
+            {props.title}
+        </button>
+    );
+}

src/elements/InfoHeaderItem/InfoHeaderItem.module.css

@@ -0,0 +1,58 @@
+/* styling for tile */
+.infoheaderitem {
+    background-color: lightblue;
+    border-radius: 5px;
+    flex: calc(25% - 10px);
+    margin: 5px;
+}
+
+/* On screens that are 1317px wide or less, go from four columns to two columns */
+@media screen and (max-width: 1317px) {
+    .infoheaderitem {
+        flex: calc(50% - 10px);
+    }
+}
+
+/* change opacity of icon when hovering whole tile */
+.infoheaderitem:hover .icon {
+    opacity: 0.75;
+    transition: opacity linear 0.4s;
+}
+
+/* change cursor on hover */
+.infoheaderitem:hover {
+    cursor: pointer;
+}
+
+.icon {
+    float: left;
+    height: 130px;
+    margin-left: 5px;
+    margin-right: 17px;
+    margin-top: 20px;
+    opacity: 0.5;
+    text-align: center;
+
+    width: 30%;
+}
+
+/* big main text in tile */
+.maintext {
+    font-size: x-large;
+    font-weight: bold;
+    margin-top: 30px;
+}
+
+/* small subtext in tile */
+.subtext {
+    font-size: large;
+    margin-top: 5px;
+    opacity: 0.7;
+}
+
+.loadAnimation {
+    display: inline-block;
+    line-height: 145px;
+    margin-left: calc(25% - 15px);
+    vertical-align: middle;
+}

src/elements/InfoHeaderItem/InfoHeaderItem.test.js

@@ -0,0 +1,43 @@
+import {shallow} from 'enzyme';
+import React from 'react';
+import InfoHeaderItem from './InfoHeaderItem';
+
+describe('<InfoHeaderItem/>', function () {
+    it('renders without crashing ', function () {
+        const wrapper = shallow(<InfoHeaderItem/>);
+        wrapper.unmount();
+    });
+
+    it('renders correct text', function () {
+        const wrapper = shallow(<InfoHeaderItem text='mytext'/>);
+        expect(wrapper.find('.maintext').text()).toBe('mytext');
+    });
+
+    it('renders correct subtext', function () {
+        const wrapper = shallow(<InfoHeaderItem text='mimi' subtext='testtext'/>);
+        expect(wrapper.find('.subtext').text()).toBe('testtext');
+    });
+
+    it('test no subtext if no text defined', function () {
+        const wrapper = shallow(<InfoHeaderItem subtext='testi'/>);
+        expect(wrapper.find('.subtext')).toHaveLength(0);
+    });
+
+    it('test custom click handler', function () {
+        const func = jest.fn();
+        const wrapper = shallow(<InfoHeaderItem onClick={() => func()}/>);
+        expect(func).toBeCalledTimes(0);
+        wrapper.simulate('click');
+        expect(func).toBeCalledTimes(1);
+    });
+
+    it('test insertion of loading spinner', function () {
+        const wrapper = shallow(<InfoHeaderItem text={null}/>);
+        expect(wrapper.find('Spinner').length).toBe(1);
+    });
+
+    it('test loading spinner if undefined', function () {
+        const wrapper = shallow(<InfoHeaderItem/>);
+        expect(wrapper.find('Spinner').length).toBe(1);
+    });
+});

src/elements/InfoHeaderItem/InfoHeaderItem.tsx

@@ -0,0 +1,55 @@
+import React from 'react';
+import style from './InfoHeaderItem.module.css';
+import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
+import {Spinner} from 'react-bootstrap';
+import {IconDefinition} from '@fortawesome/fontawesome-common-types';
+
+interface props {
+    onClick?: () => void;
+    backColor: string;
+    icon: IconDefinition;
+    text: string | number;
+    subtext: string | number;
+}
+
+/**
+ * a component to display one of the short quickinfo tiles on dashboard
+ */
+class InfoHeaderItem extends React.Component<props> {
+    render(): JSX.Element {
+        return (
+            <div
+                onClick={(): void => {
+                    // call clicklistener if defined
+                    if (this.props.onClick != null) {
+                        this.props.onClick();
+                    }
+                }}
+                className={style.infoheaderitem}
+                style={{backgroundColor: this.props.backColor}}>
+                <div className={style.icon}>
+                    <FontAwesomeIcon
+                        style={{
+                            verticalAlign: 'middle',
+                            lineHeight: '130px'
+                        }}
+                        icon={this.props.icon}
+                        size='5x'
+                    />
+                </div>
+                {this.props.text !== null && this.props.text !== undefined ? (
+                    <>
+                        <div className={style.maintext}>{this.props.text}</div>
+                        <div className={style.subtext}>{this.props.subtext}</div>
+                    </>
+                ) : (
+                    <span className={style.loadAnimation}>
+                        <Spinner animation='border' />
+                    </span>
+                )}
+            </div>
+        );
+    }
+}
+
+export default InfoHeaderItem;

src/elements/KeyComponent.tsx

@@ -0,0 +1,32 @@
+import React from 'react';
+
+interface Props {
+    listenKey: string;
+    onKey: () => void;
+}
+
+export default class KeyComponent extends React.Component<Props> {
+    constructor(props: Props) {
+        super(props);
+
+        this.handler = this.handler.bind(this);
+    }
+
+    render(): JSX.Element {
+        return <>{this.props.children}</>;
+    }
+
+    componentDidMount(): void {
+        document.addEventListener('keyup', this.handler);
+    }
+
+    componentWillUnmount(): void {
+        document.removeEventListener('keyup', this.handler);
+    }
+
+    private handler(e: KeyboardEvent): void {
+        if (e.key === this.props.listenKey) {
+            this.props.onKey();
+        }
+    }
+}

src/elements/NewTagPopup/NewTagPopup.js

@@ -1,65 +0,0 @@
-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;
-    }
-
-    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" onChange={(v) => {
-                                this.value = v.target.value
-                            }}/>
-                            <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', this.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/PageTitle/PageTitle.module.css

@@ -1,8 +1,5 @@
 .pageheader {
-    margin-top: 20px;
-    margin-bottom: 20px;
-    padding-left: 22%;
-    padding-right: 12%;
+    padding: 20px 12% 20px 22%;
 }
 
 .pageheadertitle {
@@ -11,8 +8,7 @@
 }
 
 .pageheadersubtitle {
-    margin-left: 20px;
     font-size: 23pt;
+    margin-left: 20px;
     opacity: 0.6;
 }
-

src/elements/PageTitle/PageTitle.test.js

@@ -0,0 +1,38 @@
+import React from 'react';
+import {shallow} from 'enzyme';
+
+import PageTitle, {Line} from './PageTitle';
+
+describe('<Preview/>', function () {
+    it('renders without crashing ', function () {
+        const wrapper = shallow(<PageTitle/>);
+        wrapper.unmount();
+    });
+
+    it('renders childs correctly', function () {
+        const wrapper = shallow(<PageTitle>heyimachild</PageTitle>);
+
+        const children = wrapper.children();
+        expect(children.at(children.length - 2).text()).toBe('heyimachild');
+    });
+
+    it('renders pagetitle prop', function () {
+        const wrapper = shallow(<PageTitle title='testtitle'/>);
+
+        expect(wrapper.find('.pageheader').text()).toBe('testtitle<Line />');
+    });
+
+    it('renders subtitle prop', function () {
+        const wrapper = shallow(<PageTitle subtitle='testsubtitle'/>);
+
+        expect(wrapper.find('.pageheadersubtitle').text()).toBe('testsubtitle');
+    });
+});
+
+describe('<Line/>', () => {
+    it('renders without crashing', function () {
+        const wrapper = shallow(<Line/>);
+        wrapper.unmount();
+    });
+});
+

src/elements/PageTitle/PageTitle.tsx

@@ -0,0 +1,42 @@
+import React from 'react';
+import style from './PageTitle.module.css';
+import GlobalInfos from '../../utils/GlobalInfos';
+
+interface props {
+    title: string;
+    subtitle: string | number | null;
+}
+
+/**
+ * Component for generating PageTitle with bottom Line
+ */
+class PageTitle extends React.Component<props> {
+    render(): JSX.Element {
+        const themeStyle = GlobalInfos.getThemeStyle();
+        return (
+            <div className={style.pageheader + ' ' + themeStyle.backgroundcolor}>
+                <span className={style.pageheadertitle + ' ' + themeStyle.textcolor}>{this.props.title}</span>
+                <span className={style.pageheadersubtitle + ' ' + themeStyle.textcolor}>{this.props.subtitle}</span>
+                <>{this.props.children}</>
+                <Line />
+            </div>
+        );
+    }
+}
+
+/**
+ * class to override default <hr> color and styling
+ * use this for horizontal lines to use the current active theming
+ */
+export class Line extends React.Component {
+    render(): JSX.Element {
+        const themeStyle = GlobalInfos.getThemeStyle();
+        return (
+            <>
+                <hr className={themeStyle.hrcolor} />
+            </>
+        );
+    }
+}
+
+export default PageTitle;

src/elements/Popups/AddActorPopup/AddActorPopup.module.css

@@ -0,0 +1,19 @@
+.newactorbutton {
+    background-color: green;
+    border-radius: 5px;
+    border-width: 0;
+    color: white;
+    margin-right: 15px;
+    margin-top: 12px;
+    padding: 6px;
+    width: 140px;
+}
+
+.searchinput {
+    float: left;
+    width: 120px;
+}
+
+.searchbar {
+    margin-bottom: 13px;
+}

src/elements/Popups/AddActorPopup/AddActorPopup.test.js

@@ -0,0 +1,89 @@
+import {shallow} from 'enzyme';
+import React from 'react';
+import AddActorPopup from './AddActorPopup';
+import {callAPI} from 'gowebsecure';
+
+describe('<AddActorPopup/>', function () {
+    it('renders without crashing ', function () {
+        const wrapper = shallow(<AddActorPopup/>);
+        wrapper.unmount();
+    });
+
+    it('simulate change to other page', function () {
+        const wrapper = shallow(<AddActorPopup/>);
+
+        expect(wrapper.find('NewActorPopupContent')).toHaveLength(0);
+        wrapper.find('PopupBase').props().banner.props.onClick();
+
+        // check if new content is showing
+        expect(wrapper.find('NewActorPopupContent')).toHaveLength(1);
+    });
+
+    it('hide new actor page', function () {
+        const wrapper = shallow(<AddActorPopup/>);
+        wrapper.find('PopupBase').props().banner.props.onClick();
+
+        // call onhide event listener manually
+        wrapper.find('NewActorPopupContent').props().onHide();
+
+        // expect other page to be hidden again
+        expect(wrapper.find('NewActorPopupContent')).toHaveLength(0);
+    });
+
+    it('test api call and insertion of actor tiles', function () {
+        global.callAPIMock([{Id: 1, Name: 'test'}, {Id: 2, Name: 'test2'}]);
+
+        const wrapper = shallow(<AddActorPopup/>);
+
+        expect(wrapper.find('ActorTile')).toHaveLength(2);
+    });
+
+    it('simulate actortile click', function () {
+        const func = jest.fn();
+        const wrapper = shallow(<AddActorPopup onHide={() => {func();}} movieId={1}/>);
+
+        global.callAPIMock({result: 'success'});
+
+        wrapper.setState({actors: [{ActorId: 1, Name: 'test'}]}, () => {
+            wrapper.find('ActorTile').dive().simulate('click');
+
+            expect(callAPI).toHaveBeenCalledTimes(1);
+
+            expect(func).toHaveBeenCalledTimes(1);
+        });
+    });
+
+    it('test failing actortile click', function () {
+        const func = jest.fn();
+        const wrapper = shallow(<AddActorPopup onHide={() => {func();}}/>);
+
+        global.callAPIMock({result: 'nosuccess'});
+
+        wrapper.setState({actors: [{ActorId: 1, Name: 'test'}]}, () => {
+            wrapper.find('ActorTile').dive().simulate('click');
+
+            expect(callAPI).toHaveBeenCalledTimes(1);
+
+            // hide funtion should not have been called on error!
+            expect(func).toHaveBeenCalledTimes(0);
+        });
+    });
+
+    it('test no actor on loading', function () {
+        const wrapper = shallow(<AddActorPopup/>);
+
+        expect(wrapper.find('PopupBase').find('ActorTile')).toHaveLength(0);
+    });
+
+    it('test Enter submit if only one element left', function () {
+        const wrapper = shallow(<AddActorPopup/>);
+
+        callAPIMock({});
+
+        wrapper.setState({actors: [{Name: 'test', ActorId: 1}]});
+
+        wrapper.find('PopupBase').props().ParentSubmit();
+
+        expect(callAPI).toHaveBeenCalledTimes(1);
+    });
+});

src/elements/Popups/AddActorPopup/AddActorPopup.tsx

@@ -0,0 +1,169 @@
+import PopupBase from '../PopupBase';
+import React from 'react';
+import ActorTile from '../../ActorTile/ActorTile';
+import style from './AddActorPopup.module.css';
+import {NewActorPopupContent} from '../NewActorPopup/NewActorPopup';
+import {ActorType} from '../../../types/VideoTypes';
+import {GeneralSuccess} from '../../../types/GeneralTypes';
+import FilterButton from '../../FilterButton/FilterButton';
+import {callAPI} from 'gowebsecure';
+import {APINode} from '../../../types/ApiTypes';
+
+interface Props {
+    onHide: () => void;
+    movieId: number;
+}
+
+interface state {
+    contentDefault: boolean;
+    actors: ActorType[];
+    filter: string;
+}
+
+/**
+ * Popup for Adding a new Actor to a Video
+ */
+class AddActorPopup extends React.Component<Props, state> {
+    // filterfield anchor, needed to focus after filter btn click
+    private filterfield: HTMLInputElement | null | undefined;
+
+    constructor(props: Props) {
+        super(props);
+
+        this.state = {
+            contentDefault: true,
+            actors: [],
+            filter: ''
+        };
+
+        this.tileClickHandler = this.tileClickHandler.bind(this);
+        this.filterSearch = this.filterSearch.bind(this);
+        this.parentSubmit = this.parentSubmit.bind(this);
+    }
+    componentDidMount(): void {
+        // fetch the available actors
+        this.loadActors();
+    }
+
+    render(): JSX.Element {
+        return (
+            <>
+                {/* todo render actor tiles here and add search field*/}
+                <PopupBase
+                    title='Add new Actor to Video'
+                    onHide={this.props.onHide}
+                    banner={
+                        <button
+                            className={style.newactorbutton}
+                            onClick={(): void => {
+                                this.setState({contentDefault: false});
+                            }}>
+                            Create new Actor
+                        </button>
+                    }
+                    ParentSubmit={this.parentSubmit}>
+                    {this.resolvePage()}
+                </PopupBase>
+            </>
+        );
+    }
+
+    /**
+     * selector for current showing popup page
+     * @returns {JSX.Element}
+     */
+    resolvePage(): JSX.Element {
+        if (this.state.contentDefault) {
+            return this.getContent();
+        } else {
+            return (
+                <NewActorPopupContent
+                    onHide={(): void => {
+                        this.loadActors();
+                        this.setState({contentDefault: true});
+                    }}
+                />
+            );
+        }
+    }
+
+    /**
+     * returns content for the newActor popup
+     * @returns {JSX.Element}
+     */
+    getContent(): JSX.Element {
+        if (this.state.actors.length !== 0) {
+            return (
+                <>
+                    <div className={style.searchbar}>
+                        <FilterButton
+                            onFilterChange={(filter): void => {
+                                this.setState({filter: filter});
+                            }}
+                        />
+                    </div>
+                    {this.state.actors.filter(this.filterSearch).map((el) => (
+                        <ActorTile actor={el} onClick={this.tileClickHandler} />
+                    ))}
+                </>
+            );
+        } else {
+            return <div>somekind of loading</div>;
+        }
+    }
+
+    /**
+     * event handling for ActorTile Click
+     */
+    tileClickHandler(actor: ActorType): void {
+        // fetch the available actors
+        callAPI<GeneralSuccess>(
+            APINode.Actor,
+            {
+                action: 'addActorToVideo',
+                ActorId: actor.ActorId,
+                MovieId: this.props.movieId
+            },
+            (result) => {
+                if (result.result === 'success') {
+                    // return back to player page
+                    this.props.onHide();
+                } else {
+                    console.error('an error occured while fetching actors: ' + result);
+                }
+            }
+        );
+    }
+
+    /**
+     * load the actors from backend and set state
+     */
+    loadActors(): void {
+        callAPI<ActorType[]>(APINode.Actor, {action: 'getAllActors'}, (result) => {
+            this.setState({actors: result});
+        });
+    }
+
+    /**
+     * filter the actor array for search matches
+     * @param actor
+     */
+    private filterSearch(actor: ActorType): boolean {
+        return actor.Name.toLowerCase().includes(this.state.filter.toLowerCase());
+    }
+
+    /**
+     * handle a Popupbase parent submit action
+     */
+    private parentSubmit(): void {
+        // allow submit only if one item is left in selection
+        const filteredList = this.state.actors.filter(this.filterSearch);
+
+        if (filteredList.length === 1) {
+            // simulate click if parent submit
+            this.tileClickHandler(filteredList[0]);
+        }
+    }
+}
+
+export default AddActorPopup;

src/elements/Popups/AddTagPopup/AddTagPopup.module.css

@@ -0,0 +1,3 @@
+.actionbar{
+    margin-bottom: 15px;
+}

src/elements/Popups/AddTagPopup/AddTagPopup.test.js

@@ -0,0 +1,61 @@
+import React from 'react';
+
+import {shallow} from 'enzyme';
+import '@testing-library/jest-dom';
+
+import AddTagPopup from './AddTagPopup';
+
+describe('<AddTagPopup/>', function () {
+    it('renders without crashing ', function () {
+        const wrapper = shallow(<AddTagPopup/>);
+        wrapper.unmount();
+    });
+
+    it('test tag insertion', function () {
+        const wrapper = shallow(<AddTagPopup/>);
+        wrapper.setState({
+            items: [{TagId: 1, TagName: 'test'}, {TagId: 2, TagName: 'ee'}]
+        }, () => {
+            expect(wrapper.find('Tag')).toHaveLength(2);
+            expect(wrapper.find('Tag').first().dive().text()).toBe('test');
+        });
+    });
+
+    it('test tag click', function () {
+        const wrapper = shallow(<AddTagPopup submit={jest.fn()} onHide={jest.fn()}/>);
+
+        wrapper.setState({
+            items: [{TagId: 1, TagName: 'test'}]
+        }, () => {
+            wrapper.find('Tag').first().dive().simulate('click');
+            expect(wrapper.instance().props.submit).toHaveBeenCalledTimes(1);
+            expect(wrapper.instance().props.onHide).toHaveBeenCalledTimes(1);
+        });
+    });
+
+    it('test parent submit if one item left', function () {
+        const onhide = jest.fn();
+        const submit = jest.fn();
+
+        const wrapper = shallow(<AddTagPopup submit={submit} onHide={onhide}/>);
+
+        wrapper.setState({
+            items: [{TagId: 1, TagName: 'test'}]
+        }, () => {
+            wrapper.instance().parentSubmit();
+
+            expect(onhide).toHaveBeenCalledTimes(1);
+            expect(submit).toHaveBeenCalledTimes(1);
+
+            wrapper.setState({
+                items: [{TagId: 1, TagName: 'test'}, {TagId: 3, TagName: 'test3'}]
+            }, () => {
+                wrapper.instance().parentSubmit();
+
+                // expect no submit if there are more than 1 item left...
+                expect(onhide).toHaveBeenCalledTimes(1);
+                expect(submit).toHaveBeenCalledTimes(1);
+            })
+        });
+    });
+});

src/elements/Popups/AddTagPopup/AddTagPopup.tsx

@@ -0,0 +1,75 @@
+import React from 'react';
+import Tag from '../../Tag/Tag';
+import PopupBase from '../PopupBase';
+import {TagType} from '../../../types/VideoTypes';
+import FilterButton from '../../FilterButton/FilterButton';
+import styles from './AddTagPopup.module.css';
+import {callAPI} from 'gowebsecure/lib/Api';
+import {APINode} from '../../../types/ApiTypes';
+
+interface Props {
+    onHide: () => void;
+    submit: (tagId: number, tagName: string) => void;
+}
+
+interface state {
+    items: TagType[];
+    filter: string;
+}
+
+/**
+ * component creates overlay to add a new tag to a video
+ */
+class AddTagPopup extends React.Component<Props, state> {
+    constructor(props: Props) {
+        super(props);
+
+        this.state = {items: [], filter: ''};
+
+        this.tagFilter = this.tagFilter.bind(this);
+        this.parentSubmit = this.parentSubmit.bind(this);
+        this.onItemClick = this.onItemClick.bind(this);
+    }
+
+    componentDidMount(): void {
+        callAPI(APINode.Tags, {action: 'getAllTags'}, (result: TagType[]) => {
+            this.setState({
+                items: result
+            });
+        });
+    }
+
+    render(): JSX.Element {
+        return (
+            <PopupBase title='Add a Tag to this Video:' onHide={this.props.onHide} ParentSubmit={this.parentSubmit}>
+                <div className={styles.actionbar}>
+                    <FilterButton onFilterChange={(filter): void => this.setState({filter: filter})} />
+                </div>
+                {this.state.items
+                    ? this.state.items.filter(this.tagFilter).map((i) => <Tag tagInfo={i} onclick={(): void => this.onItemClick(i)} />)
+                    : null}
+            </PopupBase>
+        );
+    }
+
+    private onItemClick(tag: TagType): void {
+        this.props.submit(tag.TagId, tag.TagName);
+        this.props.onHide();
+    }
+
+    private tagFilter(tag: TagType): boolean {
+        return tag.TagName.toLowerCase().includes(this.state.filter.toLowerCase());
+    }
+
+    private parentSubmit(): void {
+        // allow submit only if one item is left in selection
+        const filteredList = this.state.items.filter(this.tagFilter);
+
+        if (filteredList.length === 1) {
+            // simulate click if parent submit
+            this.onItemClick(filteredList[0]);
+        }
+    }
+}
+
+export default AddTagPopup;

src/elements/Popups/NewActorPopup/NewActorPopup.module.css

@@ -0,0 +1,8 @@
+.savebtn {
+    background-color: greenyellow;
+    border: 0;
+    border-radius: 4px;
+    float: right;
+    margin-top: 30px;
+    padding: 3px;
+}

src/elements/Popups/NewActorPopup/NewActorPopup.test.js

@@ -0,0 +1,60 @@
+import React from 'react';
+
+import {shallow} from 'enzyme';
+import '@testing-library/jest-dom';
+import NewActorPopup, {NewActorPopupContent} from './NewActorPopup';
+import {callAPI} from 'gowebsecure';
+
+describe('<NewActorPopup/>', function () {
+    it('renders without crashing ', function () {
+        const wrapper = shallow(<NewActorPopup/>);
+        wrapper.unmount();
+    });
+});
+
+describe('<NewActorPopupContent/>', () => {
+    it('renders without crashing', function () {
+        const wrapper = shallow(<NewActorPopupContent/>);
+        wrapper.unmount();
+    });
+
+    it('simulate button click', function () {
+        global.callAPIMock({});
+
+        const func = jest.fn();
+        const wrapper = shallow(<NewActorPopupContent onHide={() => {func();}}/>);
+
+        // manually set typed in actorname
+        wrapper.instance().value = 'testactorname';
+
+        global.fetch = prepareFetchApi({});
+
+        expect(callAPI).toBeCalledTimes(0);
+        wrapper.find('button').simulate('click');
+
+        // fetch should have been called once now
+        expect(callAPI).toBeCalledTimes(1);
+
+        expect(func).toHaveBeenCalledTimes(1);
+    });
+
+    it('test not allowing request if textfield is empty', function () {
+        const wrapper = shallow(<NewActorPopupContent/>);
+
+        global.fetch = prepareFetchApi({});
+
+        expect(global.fetch).toBeCalledTimes(0);
+        wrapper.find('button').simulate('click');
+
+        // fetch should not be called now
+        expect(global.fetch).toBeCalledTimes(0);
+    });
+
+    it('test input change', function () {
+        const wrapper = shallow(<NewActorPopupContent/>);
+
+        wrapper.find('input').simulate('change', {target: {value: 'testinput'}});
+
+        expect(wrapper.instance().value).toBe('testinput');
+    });
+});

src/elements/Popups/NewActorPopup/NewActorPopup.tsx

@@ -0,0 +1,66 @@
+import React from 'react';
+import PopupBase from '../PopupBase';
+import style from './NewActorPopup.module.css';
+import {callAPI} from 'gowebsecure';
+import {GeneralSuccess} from '../../../types/GeneralTypes';
+import {APINode} from '../../../types/ApiTypes';
+
+interface NewActorPopupProps {
+    onHide: () => void;
+}
+
+/**
+ * creates modal overlay to define a new Tag
+ */
+class NewActorPopup extends React.Component<NewActorPopupProps> {
+    render(): JSX.Element {
+        return (
+            <PopupBase title='Add new Tag' onHide={this.props.onHide} height='200px' width='400px'>
+                <NewActorPopupContent onHide={this.props.onHide} />
+            </PopupBase>
+        );
+    }
+}
+
+export class NewActorPopupContent extends React.Component<NewActorPopupProps> {
+    value: string | undefined;
+
+    render(): JSX.Element {
+        return (
+            <>
+                <div>
+                    <input
+                        type='text'
+                        placeholder='Actor Name'
+                        onChange={(v): void => {
+                            this.value = v.target.value;
+                        }}
+                    />
+                </div>
+                <button className={style.savebtn} onClick={(): void => this.storeselection()}>
+                    Save
+                </button>
+            </>
+        );
+    }
+
+    /**
+     * store the filled in form to the backend
+     */
+    storeselection(): void {
+        // check if user typed in name
+        if (this.value === '' || this.value === undefined) {
+            return;
+        }
+
+        callAPI(APINode.Actor, {action: 'createActor', actorname: this.value}, (result: GeneralSuccess) => {
+            if (result.result !== 'success') {
+                console.log('error occured while writing to db -- todo error handling');
+                console.log(result.result);
+            }
+            this.props.onHide();
+        });
+    }
+}
+
+export default NewActorPopup;

src/elements/Popups/NewTagPopup/NewTagPopup.module.css

@@ -0,0 +1,8 @@
+.savebtn {
+    background-color: greenyellow;
+    border: 0;
+    border-radius: 4px;
+    float: right;
+    margin-top: 30px;
+    padding: 3px;
+}

src/elements/Popups/NewTagPopup/NewTagPopup.test.js

@@ -1,8 +1,8 @@
-import React from "react";
+import React from 'react';
 
-import {shallow} from 'enzyme'
-import "@testing-library/jest-dom"
-import NewTagPopup from "./NewTagPopup";
+import {shallow} from 'enzyme';
+import '@testing-library/jest-dom';
+import NewTagPopup from './NewTagPopup';
 
 describe('<NewTagPopup/>', function () {
     it('renders without crashing ', function () {
@@ -11,23 +11,20 @@ describe('<NewTagPopup/>', function () {
     });
 
     it('test storeseletion click event', done => {
-        const mockSuccessResponse = {};
-        const mockJsonPromise = Promise.resolve(mockSuccessResponse);
-        const mockFetchPromise = Promise.resolve({
-            json: () => mockJsonPromise,
-        });
-        global.fetch = jest.fn().mockImplementation(() => mockFetchPromise);
+        global.fetch = prepareFetchApi({});
 
         const func = jest.fn();
 
         const wrapper = shallow(<NewTagPopup/>);
         wrapper.setProps({
             onHide: () => {
-                func()
+                func();
             }
         });
 
-        wrapper.find('ModalFooter').find('button').simulate('click');
+        wrapper.instance().value = 'testvalue';
+
+        wrapper.find('button').simulate('click');
         expect(global.fetch).toHaveBeenCalledTimes(1);
 
         process.nextTick(() => {
@@ -38,4 +35,12 @@ describe('<NewTagPopup/>', function () {
             done();
         });
     });
+
+    it('simulate textfield change', function () {
+        const wrapper = shallow(<NewTagPopup/>);
+
+        wrapper.find('input').simulate('change', {target: {value: 'testvalue'}});
+
+        expect(wrapper.instance().value).toBe('testvalue');
+    });
 });

src/elements/Popups/NewTagPopup/NewTagPopup.tsx

@@ -0,0 +1,56 @@
+import React from 'react';
+import PopupBase from '../PopupBase';
+import style from './NewTagPopup.module.css';
+import {GeneralSuccess} from '../../../types/GeneralTypes';
+import {callAPI} from 'gowebsecure';
+import {APINode} from '../../../types/ApiTypes';
+
+interface props {
+    onHide: () => void;
+}
+
+/**
+ * creates modal overlay to define a new Tag
+ */
+class NewTagPopup extends React.Component<props> {
+    private value: string = '';
+
+    render(): JSX.Element {
+        return (
+            <PopupBase
+                title='Add new Tag'
+                onHide={this.props.onHide}
+                height='200px'
+                width='400px'
+                ParentSubmit={(): void => this.storeselection()}>
+                <div>
+                    <input
+                        type='text'
+                        placeholder='Tagname'
+                        onChange={(v): void => {
+                            this.value = v.target.value;
+                        }}
+                    />
+                </div>
+                <button className={style.savebtn} onClick={(): void => this.storeselection()}>
+                    Save
+                </button>
+            </PopupBase>
+        );
+    }
+
+    /**
+     * store the filled in form to the backend
+     */
+    storeselection(): void {
+        callAPI(APINode.Tags, {action: 'createTag', TagName: this.value}, (result: GeneralSuccess) => {
+            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/Popups/PopupBase.module.css

@@ -0,0 +1,45 @@
+.popup {
+    border: 3px #3574fe solid;
+    border-radius: 18px;
+    height: fit-content;
+    left: 20%;
+    min-height: 80%;
+    opacity: 0.95;
+    position: absolute;
+    top: 10%;
+    width: 60%;
+    z-index: 2;
+}
+
+.header {
+    cursor: move;
+    display: flex;
+    flex-direction: row;
+    flex-wrap: nowrap;
+    justify-content: space-between;
+}
+
+.title {
+    float: left;
+    font-size: x-large;
+    margin-left: 15px;
+    margin-top: 10px;
+    opacity: 1;
+    width: 60%;
+}
+
+.banner {
+    display: flex;
+    flex-direction: row;
+    float: left;
+    justify-content: flex-end;
+    width: 40%;
+}
+
+.content {
+    margin-left: 20px;
+    margin-right: 20px;
+    margin-top: 10px;
+    opacity: 1;
+    overflow: auto;
+}

src/elements/Popups/PopupBase.test.js

@@ -0,0 +1,34 @@
+import {shallow} from 'enzyme';
+import React from 'react';
+import PopupBase from './PopupBase';
+
+describe('<PopupBase/>', function () {
+    it('renders without crashing ', function () {
+        const wrapper = shallow(<PopupBase/>);
+        wrapper.unmount();
+    });
+
+    it('simulate keypress', function () {
+        mockKeyPress();
+        const func = jest.fn();
+        const events = mockKeyPress();
+
+        shallow(<PopupBase onHide={() => func()}/>);
+
+        // trigger the keypress event
+        events.keyup({key: 'Escape'});
+
+        expect(func).toBeCalledTimes(1);
+    });
+
+    it('test an Enter sumit', function () {
+        const events = mockKeyPress();
+        const func = jest.fn();
+        shallow(<PopupBase ParentSubmit={() => func()}/>);
+
+        // trigger the keypress event
+        events.keyup({key: 'Enter'});
+
+        expect(func).toBeCalledTimes(1);
+    });
+});

src/elements/Popups/PopupBase.tsx

@@ -0,0 +1,147 @@
+import GlobalInfos from '../../utils/GlobalInfos';
+import style from './PopupBase.module.css';
+import {Line} from '../PageTitle/PageTitle';
+import React, {RefObject} from 'react';
+import {addKeyHandler, removeKeyHandler} from '../../utils/ShortkeyHandler';
+
+interface Props {
+    width?: string;
+    height?: string;
+    banner?: JSX.Element;
+    title: string;
+    onHide: () => void;
+    ParentSubmit?: () => void;
+}
+
+/**
+ * wrapper class for generic types of popups
+ */
+class PopupBase extends React.Component<Props> {
+    private wrapperRef: RefObject<HTMLDivElement>;
+    private framedimensions: {minHeight: string | undefined; width: string | undefined; height: string | undefined};
+
+    constructor(props: Props) {
+        super(props);
+
+        this.state = {items: []};
+
+        this.wrapperRef = React.createRef();
+
+        this.handleClickOutside = this.handleClickOutside.bind(this);
+        this.keypress = this.keypress.bind(this);
+
+        // parse style props
+        this.framedimensions = {
+            width: this.props.width ? this.props.width : undefined,
+            height: this.props.height ? this.props.height : undefined,
+            minHeight: this.props.height ? this.props.height : undefined
+        };
+    }
+
+    componentDidMount(): void {
+        document.addEventListener('mousedown', this.handleClickOutside);
+        addKeyHandler(this.keypress);
+
+        // add element drag drop events
+        if (this.wrapperRef != null) {
+            this.dragElement();
+        }
+    }
+
+    componentWillUnmount(): void {
+        // remove the appended listeners
+        document.removeEventListener('mousedown', this.handleClickOutside);
+        removeKeyHandler(this.keypress);
+    }
+
+    render(): JSX.Element {
+        const themeStyle = GlobalInfos.getThemeStyle();
+        return (
+            <div style={this.framedimensions} className={[style.popup, themeStyle.thirdbackground].join(' ')} ref={this.wrapperRef}>
+                <div className={style.header}>
+                    <div className={[style.title, themeStyle.textcolor].join(' ')}>{this.props.title}</div>
+                    <div className={style.banner}>{this.props.banner}</div>
+                </div>
+
+                <Line />
+                <div className={style.content}>{this.props.children}</div>
+            </div>
+        );
+    }
+
+    /**
+     * Alert if clicked on outside of element
+     */
+    handleClickOutside(event: MouseEvent): void {
+        if (this.wrapperRef && this.wrapperRef.current && !this.wrapperRef.current.contains(event.target as Node)) {
+            this.props.onHide();
+        }
+    }
+
+    /**
+     * key event handling
+     * @param event keyevent
+     */
+    keypress(event: KeyboardEvent): void {
+        // hide if escape is pressed
+        if (event.key === 'Escape') {
+            this.props.onHide();
+        } else if (event.key === 'Enter') {
+            // call a parentsubmit if defined
+            if (this.props.ParentSubmit) {
+                this.props.ParentSubmit();
+            }
+        }
+    }
+
+    /**
+     * make the element drag and droppable
+     */
+    dragElement(): void {
+        let xOld = 0,
+            yOld = 0;
+
+        const elmnt = this.wrapperRef.current;
+        if (elmnt === null) {
+            return;
+        }
+        if (elmnt.firstChild === null) {
+            return;
+        }
+
+        (elmnt.firstChild as HTMLDivElement).onmousedown = dragMouseDown;
+
+        function dragMouseDown(e: MouseEvent): void {
+            e.preventDefault();
+            // get the mouse cursor position at startup:
+            xOld = e.clientX;
+            yOld = e.clientY;
+            document.onmouseup = closeDragElement;
+            // call a function whenever the cursor moves:
+            document.onmousemove = elementDrag;
+        }
+
+        function elementDrag(e: MouseEvent): void {
+            e.preventDefault();
+            // calculate the new cursor position:
+            const dx = xOld - e.clientX;
+            const dy = yOld - e.clientY;
+            xOld = e.clientX;
+            yOld = e.clientY;
+            // set the element's new position:
+            if (elmnt === null) {
+                return;
+            }
+            elmnt.style.top = elmnt.offsetTop - dy + 'px';
+            elmnt.style.left = elmnt.offsetLeft - dx + 'px';
+        }
+
+        function closeDragElement(): void {
+            // stop moving when mouse button is released:
+            document.onmouseup = null;
+            document.onmousemove = null;
+        }
+    }
+}
+
+export default PopupBase;

src/elements/Popups/SubmitPopup/SubmitPopup.test.js

@@ -0,0 +1,28 @@
+import {shallow} from 'enzyme';
+import React from 'react';
+import SubmitPopup from './SubmitPopup';
+
+describe('<SubmitPopup/>', function () {
+    it('renders without crashing ', function () {
+        const wrapper = shallow(<SubmitPopup/>);
+        wrapper.unmount();
+    });
+
+    it('test submit click', function () {
+        const func = jest.fn();
+        const wrapper = shallow(<SubmitPopup submit={() => func()}/>);
+
+        wrapper.find('Button').findWhere(p => p.props().title === 'Submit').simulate('click');
+
+        expect(func).toHaveBeenCalledTimes(1);
+    });
+
+    it('test cancel click', function () {
+        const func = jest.fn();
+        const wrapper = shallow(<SubmitPopup onHide={() => func()}/>);
+
+        wrapper.find('Button').findWhere(p => p.props().title === 'Cancel').simulate('click');
+
+        expect(func).toHaveBeenCalledTimes(1);
+    });
+});

src/elements/Popups/SubmitPopup/SubmitPopup.tsx

@@ -0,0 +1,17 @@
+import React from 'react';
+import PopupBase from '../PopupBase';
+import {Button} from '../../GPElements/Button';
+
+interface Props {
+    onHide: (_: void) => void;
+    submit: (_: void) => void;
+}
+
+export default function SubmitPopup(props: Props): JSX.Element {
+    return (
+        <PopupBase title='Are you sure?' onHide={props.onHide} height='160px' width='300px'>
+            <Button title='Submit' color={{backgroundColor: 'green'}} onClick={(): void => props.submit()} />
+            <Button title='Cancel' color={{backgroundColor: 'red'}} onClick={(): void => props.onHide()} />
+        </PopupBase>
+    );
+}

src/elements/Preview/Preview.js

@@ -1,112 +0,0 @@
-import React from "react";
-import "./Preview.css";
-import Player from "../../pages/Player/Player";
-import VideoContainer from "../VideoContainer/VideoContainer";
-
-class Preview extends React.Component {
-    constructor(props, context) {
-        super(props, context);
-        this.props = props;
-
-        this.state = {
-            previewpicture: null,
-            name: null
-        };
-    }
-
-    componentWillUnmount() {
-        this.setState({});
-    }
-
-    componentDidMount() {
-        this.setState({
-            previewpicture: null,
-            name: this.props.name
-        });
-
-        const updateRequest = new FormData();
-        updateRequest.append('action', 'readThumbnail');
-        updateRequest.append('movieid', this.props.movie_id);
-
-        fetch('/api/videoload.php', {method: 'POST', body: updateRequest})
-            .then((response) => response.text()
-                .then((result) => {
-                    this.setState(prevState => ({
-                        ...prevState.previewpicture, previewpicture: result
-                    }));
-                }));
-    }
-
-    render() {
-        return (
-            <div className='videopreview' onClick={() => this.itemClick()}>
-                <div className='previewtitle'>{this.state.name}</div>
-                <div className='previewpic'>
-                    <img className='previewimage'
-                         src={this.state.previewpicture}
-                         alt='Pic loading.'/>
-                </div>
-                <div className='previewbottom'>
-
-                </div>
-            </div>
-        );
-    }
-
-    itemClick() {
-        console.log("item clicked!" + this.state.name);
-
-        this.props.viewbinding.showVideo(<Player
-            viewbinding={this.props.viewbinding}
-            movie_id={this.props.movie_id}/>);
-    }
-}
-
-export class TagPreview extends React.Component {
-    constructor(props, context) {
-        super(props, context);
-
-        this.props = props;
-    }
-
-    fetchVideoData(tag) {
-        console.log(tag);
-        const updateRequest = new FormData();
-        updateRequest.append('action', 'getMovies');
-        updateRequest.append('tag', tag);
-
-        console.log("fetching data");
-
-        // fetch all videos available
-        fetch('/api/videoload.php', {method: 'POST', body: updateRequest})
-            .then((response) => response.json()
-                .then((result) => {
-                    console.log(result);
-                    this.props.categorybinding(
-                        <VideoContainer
-                            data={result}
-                            viewbinding={this.props.viewbinding}/>, tag
-                    );
-                }))
-            .catch(() => {
-                console.log("no connection to backend");
-            });
-    }
-
-
-    render() {
-        return (
-            <div className='videopreview tagpreview' onClick={() => this.itemClick()}>
-                <div className='tagpreviewtitle'>
-                    {this.props.name}
-                </div>
-            </div>
-        );
-    }
-
-    itemClick() {
-        this.fetchVideoData(this.props.name);
-    }
-}
-
-export default Preview;

src/elements/Preview/Preview.module.css

@@ -1,22 +1,30 @@
 .previewtitle {
-    height: 20px;
-    color: #3d3d3d;
-    text-align: center;
-    font-weight: bold;
-    max-width: 266px;
     font-size: smaller;
+    font-weight: bold;
+    height: 20px;
+    max-width: 266px;
+    text-align: center;
 }
 
 .previewpic {
     height: 80%;
+    min-height: 150px;
+    min-width: 266px;
     overflow: hidden;
+    text-align: center;
+}
+
+.loadAnimation {
+    display: inline-block;
+    line-height: 150px;
+    vertical-align: middle;
 }
 
 .previewimage {
-    min-height: 150px;
     max-height: 400px;
-    min-width: 266px;
     max-width: 410px;
+    min-height: 150px;
+    min-width: 266px;
 }
 
 .previewbottom {
@@ -24,28 +32,25 @@
 }
 
 .videopreview {
+    border-radius: 20px;
+    cursor: pointer;
     float: left;
     margin-left: 25px;
     margin-top: 25px;
-    /*background-color: #7F7F7F;*/
-    background-color: #a8c3ff;
-    cursor: pointer;
     opacity: 0.85;
-    border-radius: 20px;
 }
 
 .videopreview:hover {
     opacity: 1;
-    box-shadow: rgba(2, 12, 27, 0.7) 0px 0px 0px 5px;
     transition: all 300ms;
 }
 
 .tagpreview {
-    text-transform: uppercase;
-    font-weight: bolder;
     font-size: x-large;
-    text-align: center;
+    font-weight: bolder;
     height: 150px;
+    text-align: center;
+    text-transform: uppercase;
     width: 266px;
 }
 

src/elements/Preview/Preview.tsx

@@ -0,0 +1,98 @@
+import React from 'react';
+import style from './Preview.module.css';
+import {Spinner} from 'react-bootstrap';
+import {Link} from 'react-router-dom';
+import GlobalInfos from '../../utils/GlobalInfos';
+import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
+import {faPhotoVideo} from '@fortawesome/free-solid-svg-icons';
+
+interface PreviewProps {
+    name: string;
+    picLoader: (callback: (pic: string) => void) => void;
+    linkPath?: string;
+    onClick?: () => void;
+}
+
+interface PreviewState {
+    picLoaded: boolean | null;
+}
+
+/**
+ * Component for single preview tile
+ * floating side by side
+ */
+class Preview extends React.Component<PreviewProps, PreviewState> {
+    // store the picture to display
+    pic?: string;
+
+    constructor(props: PreviewProps) {
+        super(props);
+
+        this.state = {
+            picLoaded: null
+        };
+    }
+
+    componentDidMount(): void {
+        this.props.picLoader((result) => {
+            this.pic = result;
+            this.setState({
+                picLoaded: result !== ''
+            });
+        });
+    }
+
+    render(): JSX.Element {
+        if (this.props.linkPath !== undefined) {
+            return <Link to={this.props.linkPath}>{this.content()}</Link>;
+        } else {
+            return this.content();
+        }
+    }
+
+    content(): JSX.Element {
+        const themeStyle = GlobalInfos.getThemeStyle();
+        return (
+            <div
+                className={style.videopreview + ' ' + themeStyle.secbackground + ' ' + themeStyle.preview}
+                onClick={this.props.onClick}>
+                <div className={style.previewtitle + ' ' + themeStyle.lighttextcolor}>{this.props.name}</div>
+                <div className={style.previewpic}>
+                    {this.state.picLoaded === false ? (
+                        <FontAwesomeIcon
+                            style={{
+                                color: 'white',
+                                marginTop: '55px'
+                            }}
+                            icon={faPhotoVideo}
+                            size='5x'
+                        />
+                    ) : this.state.picLoaded === null ? (
+                        <span className={style.loadAnimation}>
+                            <Spinner animation='border' />
+                        </span>
+                    ) : (
+                        <img className={style.previewimage} src={this.pic} alt='Pic loading.' />
+                    )}
+                </div>
+                <div className={style.previewbottom} />
+            </div>
+        );
+    }
+}
+
+/**
+ * Component for a Tag-name tile (used in category page)
+ */
+export class TagPreview extends React.Component<{name: string}> {
+    render(): JSX.Element {
+        const themeStyle = GlobalInfos.getThemeStyle();
+        return (
+            <div className={style.videopreview + ' ' + style.tagpreview + ' ' + themeStyle.secbackground + ' ' + themeStyle.preview}>
+                <div className={style.tagpreviewtitle + ' ' + themeStyle.lighttextcolor}>{this.props.name}</div>
+            </div>
+        );
+    }
+}
+
+export default Preview;

src/elements/Preview/Previw.test.js

@@ -1,60 +1,36 @@
 import React from 'react';
-import {shallow} from 'enzyme'
+import {shallow} from 'enzyme';
 
-import Preview, {TagPreview} from "./Preview";
+import Preview, {TagPreview} from './Preview';
 
 describe('<Preview/>', function () {
     it('renders without crashing ', function () {
-        const wrapper = shallow(<Preview/>);
+        const wrapper = shallow(<Preview movieId={1} name='test' picLoader={callback => callback('')}/>);
         wrapper.unmount();
     });
 
-    // check if preview title renders correctly
-    it('renders title', () => {
-        const wrapper = shallow(<Preview name='test'/>);
+    it('picture rendered correctly', () => {
+        const func = jest.fn();
+        const wrapper = shallow(<Preview movieId={1} name='test' picLoader={callback => {
+            func();
+            callback('42');
+        }}/>);
+
+        // expect picloader tobe called once
+        expect(func).toHaveBeenCalledTimes(1)
+
+        // received picture should be rendered into wrapper
+        expect(wrapper.find('.previewimage').props().src).toBe('42');
+        // check if preview title renders correctly
         expect(wrapper.find('.previewtitle').text()).toBe('test');
     });
 
+    it('spinner loads correctly', function () {
+        // if callback is never called --> infinite spinner
+        const wrapper = shallow(<Preview movieId={1} name='test' picLoader={callback => {}}/>);
 
-    it('click event triggered', () => {
-        const func = jest.fn();
-
-        const wrapper = shallow(<Preview/>);
-        wrapper.setProps({
-            viewbinding: {
-                showVideo: () => {
-                    func()
-                }
-            }
-        });
-
-        wrapper.find('.videopreview').simulate('click');
-
-        //callback to open player should have called
-        expect(func).toHaveBeenCalledTimes(1);
-    });
-
-    it('picture rendered correctly', done => {
-        const mockSuccessResponse = 'testsrc';
-        const mockJsonPromise = Promise.resolve(mockSuccessResponse);
-        const mockFetchPromise = Promise.resolve({
-            text: () => mockJsonPromise,
-        });
-        global.fetch = jest.fn().mockImplementation(() => mockFetchPromise);
-
-        const wrapper = shallow(<Preview/>);
-
-        // now called 1 times
-        expect(global.fetch).toHaveBeenCalledTimes(1);
-
-        process.nextTick(() => {
-            // received picture should be rendered into wrapper
-            expect(wrapper.find(".previewimage").props().src).not.toBeNull();
-
-            global.fetch.mockClear();
-            done();
-        });
-
+        // expect load animation to be visible
+        expect(wrapper.find('.loadAnimation')).toHaveLength(1);
     });
 });
 
@@ -69,39 +45,5 @@ describe('<TagPreview/>', function () {
         const wrapper = shallow(<TagPreview name='test'/>);
         expect(wrapper.find('.tagpreviewtitle').text()).toBe('test');
     });
-
-
-    it('click event triggered', done => {
-        const mockSuccessResponse = {};
-        const mockJsonPromise = Promise.resolve(mockSuccessResponse);
-        const mockFetchPromise = Promise.resolve({
-            json: () => mockJsonPromise,
-        });
-        global.fetch = jest.fn().mockImplementation(() => mockFetchPromise);
-
-        const func = jest.fn();
-
-        const wrapper = shallow(<TagPreview/>);
-        wrapper.setProps({
-            categorybinding: () => {
-                func()
-            }
-        });
-
-        // first call of fetch is getting of available tags
-        expect(global.fetch).toHaveBeenCalledTimes(0);
-        wrapper.find('.videopreview').simulate('click');
-
-        // now called 1 times
-        expect(global.fetch).toHaveBeenCalledTimes(1);
-
-        process.nextTick(() => {
-            //callback to close window should have called
-            expect(func).toHaveBeenCalledTimes(1);
-
-            global.fetch.mockClear();
-            done();
-        });
-    });
 });
 

src/elements/SideBar/SideBar.js

@@ -1,12 +0,0 @@
-import React from "react";
-import "./SideBar.css"
-
-class SideBar extends React.Component {
-    render() {
-        return (<div className='sideinfo'>
-            {this.props.children}
-        </div>);
-    }
-}
-
-export default SideBar;