diff --git a/api/SSettings.php b/api/SSettings.php
new file mode 100644
index 0000000..5d09fa8
--- /dev/null
+++ b/api/SSettings.php
@@ -0,0 +1,22 @@
+<?php
+
+class SSettings
+{
+    private $database;
+
+    /**
+     * SSettings constructor.
+     */
+    public function __construct() {
+        $this->database = Database::getInstance();
+    }
+
+    public function getVideoPath() {
+        $query = "SELECT video_path from settings";
+
+        $result = $this->database->getConnection()->query($query);
+
+        $r = mysqli_fetch_assoc($result);
+        return $r['video_path'];
+    }
+}
\ No newline at end of file
diff --git a/api/videoload.php b/api/videoload.php
index 7796caf..800258e 100755
--- a/api/videoload.php
+++ b/api/videoload.php
@@ -1,9 +1,15 @@
 <?php
 require 'Database.php';
+require 'SSettings.php';
 
+// establish initial db connection
 $conn = Database::getInstance()->getConnection();
+$settings = new SSettings();
+
+// load video path from settings
+$videopath = $settings->getVideoPath();
+
 
-//$_POST['action'] = "getRandomMovies";$_POST['number'] =6;
 if (isset($_POST['action'])) {
     $action = $_POST['action'];
     switch ($action) {
@@ -84,7 +90,9 @@ if (isset($_POST['action'])) {
 
             $arr["movie_id"] = $row["movie_id"];
             $arr["movie_name"] = $row["movie_name"];
-            $arr["movie_url"] = str_replace("?","%3F",$row["movie_url"]);
+            // todo drop video url from db -- maybe one with and one without extension
+            // extension hardcoded here!!!
+            $arr["movie_url"] = str_replace("?", "%3F", $videopath . $row["movie_name"] . ".mp4");
             $arr["likes"] = $row["likes"];
             $arr["quality"] = $row["quality"];
             $arr["length"] = $row["length"];
diff --git a/src/App.js b/src/App.js
index fd943e1..e3a4350 100644
--- a/src/App.js
+++ b/src/App.js
@@ -14,7 +14,8 @@ class App extends React.Component {
         this.state = {
             page: "default",
             generalSettingsLoaded: false,
-            passwordsupport: null
+            passwordsupport: null,
+            mediacentername: "OpenMediaCenter"
         };
 
         // bind this to the method for being able to call methods such as this.setstate
@@ -22,8 +23,6 @@ class App extends React.Component {
         this.returnToLastElement = this.returnToLastElement.bind(this);
     }
 
-    generaldata = {};
-
     componentDidMount() {
         const updateRequest = new FormData();
         updateRequest.append('action', 'loadInitialData');
@@ -31,16 +30,13 @@ class App extends React.Component {
         fetch('/api/Settings.php', {method: 'POST', body: updateRequest})
             .then((response) => response.json()
                 .then((result) => {
-                    this.generaldata = {
-                        videopath: result.video_path,
-                        tvshowpath: result.episode_path,
-                        mediacentername: result.mediacenter_name
-                    };
-
+                    console.log(result);
                     this.setState({
                         generalSettingsLoaded: true,
-                        passwordsupport: result.passwordEnabled
+                        passwordsupport: result.passwordEnabled,
+                        mediacentername: result.mediacenter_name
                     });
+                    console.log(this.state);
                 }));
     }
 
@@ -49,8 +45,7 @@ class App extends React.Component {
     constructViewBinding(){
         return {
             changeRootElement: this.changeRootElement,
-            returnToLastElement: this.returnToLastElement,
-            generalsettings: this.generaldata
+            returnToLastElement: this.returnToLastElement
         };
     }
 
@@ -86,7 +81,7 @@ class App extends React.Component {
         return (
             <div className="App">
                 <nav className="navbar navbar-expand-sm bg-primary navbar-dark">
-                    <div className="navbar-brand">OpenMediaCenter</div>
+                    <div className="navbar-brand">{this.state.mediacentername}</div>
 
                     <ul className="navbar-nav">
                         <li className="nav-item">
diff --git a/src/App.test.js b/src/App.test.js
index 97d2c3f..60f58e3 100644
--- a/src/App.test.js
+++ b/src/App.test.js
@@ -2,6 +2,14 @@ import React from 'react';
 import App from './App';
 import {shallow} from 'enzyme'
 
+function prepareFetchApi(response) {
+    const mockJsonPromise = Promise.resolve(response);
+    const mockFetchPromise = Promise.resolve({
+        json: () => mockJsonPromise,
+    });
+    return (jest.fn().mockImplementation(() => mockFetchPromise));
+}
+
 describe('<App/>', function () {
     it('renders without crashing ', function () {
         const wrapper = shallow(<App/>);
@@ -82,4 +90,28 @@ describe('<App/>', function () {
         wrapper.find(".nav-link").findWhere(t => t.text() === "Settings" && t.type() === "div").simulate("click");
         expect(wrapper.find("SettingsPage")).toHaveLength(1);
     });
+
+    it('test initial fetch from api', done => {
+        global.fetch = prepareFetchApi({
+            generalSettingsLoaded: true,
+            passwordsupport: true,
+            mediacentername: "testname"
+        });
+
+        const wrapper = shallow(<App/>);
+
+        expect(global.fetch).toBeCalledTimes(1);
+
+        process.nextTick(() => {
+            console.log(wrapper.state());
+
+            // todo state lifecycle not triggered
+            wrapper.update();
+            console.log(wrapper.state());
+            expect(wrapper.state('passwordsupport')).toBe(true);
+
+            global.fetch.mockClear();
+            done();
+        });
+    });
 });