extract thubnail picture size from raw bytes in backend

load videopath from backend
correctly redirect to login page if login fails
2021-05-12 23:29:47 +02:00 · 2021-05-09 19:38:59 +02:00 · 2021-05-08 16:38:01 +02:00 · 2021-05-08 15:19:13 +02:00 · 2021-05-07 17:31:35 +02:00 · 2021-05-01 17:38:12 +02:00
66 changed files with 1901 additions and 906 deletions
--- a/apiGo/api/ApiBase.go
+++ b/apiGo/api/ApiBase.go
@@ -15,7 +15,7 @@ const (
 	TagNode      = iota
 	SettingsNode = iota
 	ActorNode    = iota
-	InitNode     = iota
+	TVShowNode   = iota
 )

 type actionStruct struct {
@@ -37,13 +37,11 @@ func AddHandler(action string, apiNode int, n interface{}, h func() []byte) {
 }

 func ServerInit() {
-	http.Handle(APIPREFIX+"/video", oauth.ValidateToken(videoHandler))
-	http.Handle(APIPREFIX+"/tags", oauth.ValidateToken(tagHandler))
-	http.Handle(APIPREFIX+"/settings", oauth.ValidateToken(settingsHandler))
-	http.Handle(APIPREFIX+"/actor", oauth.ValidateToken(actorHandler))
-
-	// initialization api calls to check if password is neccessaray
-	http.Handle(APIPREFIX+"/init", http.HandlerFunc(initHandler))
+	http.Handle(APIPREFIX+"/video", oauth.ValidateToken(handlefunc, VideoNode))
+	http.Handle(APIPREFIX+"/tags", oauth.ValidateToken(handlefunc, TagNode))
+	http.Handle(APIPREFIX+"/settings", oauth.ValidateToken(handlefunc, SettingsNode))
+	http.Handle(APIPREFIX+"/actor", oauth.ValidateToken(handlefunc, ActorNode))
+	http.Handle(APIPREFIX+"/tvshow", oauth.ValidateToken(handlefunc, TVShowNode))

 	// initialize oauth service and add corresponding auth routes
 	oauth.InitOAuth()
@@ -69,26 +67,6 @@ func handleAPICall(action string, requestBody string, apiNode int) []byte {
 	return nil
 }

-func actorHandler(rw http.ResponseWriter, req *http.Request) {
-	handlefunc(rw, req, ActorNode)
-}
-
-func videoHandler(rw http.ResponseWriter, req *http.Request) {
-	handlefunc(rw, req, VideoNode)
-}
-
-func tagHandler(rw http.ResponseWriter, req *http.Request) {
-	handlefunc(rw, req, TagNode)
-}
-
-func settingsHandler(rw http.ResponseWriter, req *http.Request) {
-	handlefunc(rw, req, SettingsNode)
-}
-
-func initHandler(rw http.ResponseWriter, req *http.Request) {
-	handlefunc(rw, req, InitNode)
-}
-
 func handlefunc(rw http.ResponseWriter, req *http.Request, node int) {
 	// only allow post requests
 	if req.Method != "POST" {
--- a/apiGo/api/Helpers.go
+++ b/apiGo/api/Helpers.go
@@ -61,6 +61,22 @@ func readActorsFromResultset(rows *sql.Rows) []types.Actor {
 	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)
--- a/apiGo/api/Init.go
+++ b/apiGo/api/Init.go
@@ -1,39 +0,0 @@
-package api
-
-import (
-	"encoding/json"
-	"openmediacenter/apiGo/database/settings"
-	"regexp"
-	"strings"
-)
-
-func AddInitHandlers() {
-	passwordNeeded()
-}
-
-func passwordNeeded() {
-	AddHandler("loadInitialData", InitNode, nil, func() []byte {
-		sett := settings.LoadSettings()
-
-		type InitialDataTypeResponse struct {
-			DarkMode        bool
-			Pasword         bool
-			MediacenterName string
-			VideoPath       string
-		}
-
-		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)
-		serverVideoPath := strings.TrimPrefix(sett.VideoPath, videoUrl)
-
-		res := InitialDataTypeResponse{
-			DarkMode:        sett.DarkMode,
-			Pasword:         sett.Pasword != "-1",
-			MediacenterName: sett.Mediacenter_name,
-			VideoPath:       serverVideoPath,
-		}
-
-		str, _ := json.Marshal(res)
-		return str
-	})
-}
--- a/apiGo/api/Settings.go
+++ b/apiGo/api/Settings.go
@@ -1,9 +1,13 @@
 package api

 import (
+	"encoding/json"
 	"openmediacenter/apiGo/api/types"
 	"openmediacenter/apiGo/database"
+	"openmediacenter/apiGo/database/settings"
 	"openmediacenter/apiGo/videoparser"
+	"regexp"
+	"strings"
 )

 func AddSettingsHandlers() {
@@ -17,6 +21,34 @@ func getSettingsFromDB() {
 		result := database.GetSettings()
 		return jsonify(result)
 	})
+	AddHandler("loadInitialData", SettingsNode, nil, func() []byte {
+		sett := settings.LoadSettings()
+
+		type InitialDataTypeResponse struct {
+			DarkMode        bool
+			Pasword         bool
+			MediacenterName string
+			VideoPath       string
+			TVShowPath      string
+		}
+
+		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,
+		}
+
+		str, _ := json.Marshal(res)
+		return str
+	})
 }

 func saveSettingsToDB() {
@@ -46,12 +78,13 @@ func reIndexHandling() {
 		return database.ManualSuccessResponse(nil)
 	})

+	AddHandler("startTVShowReindex", SettingsNode, nil, func() []byte {
+		videoparser.StartTVShowReindex()
+		return database.ManualSuccessResponse(nil)
+	})
+
 	AddHandler("cleanupGravity", SettingsNode, nil, func() []byte {
 		videoparser.StartCleanup()
 		return nil
 	})
-
-	AddHandler("getStatusMessage", SettingsNode, nil, func() []byte {
-		return jsonify(videoparser.GetStatusMessage())
-	})
 }
--- a/apiGo/api/TVShows.go
+++ b/apiGo/api/TVShows.go
@@ -0,0 +1,92 @@
+package api
+
+import (
+	"fmt"
+	"openmediacenter/apiGo/database"
+)
+
+func AddTvshowHandlers() {
+	AddHandler("getTVShows", TVShowNode, nil, func() []byte {
+		query := "SELECT id, name FROM tvshow"
+		rows := database.Query(query)
+		return jsonify(readTVshowsFromResultset(rows))
+	})
+
+	var ge struct {
+		ShowID uint32
+	}
+	AddHandler("getEpisodes", TVShowNode, &ge, func() []byte {
+		query := fmt.Sprintf("SELECT id, name, season, episode FROM tvshow_episodes WHERE tvshow_id=%d", ge.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)
+	})
+
+	var le struct {
+		ID uint32
+	}
+	AddHandler("loadEpisode", TVShowNode, &le, func() []byte {
+		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`, le.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)
+	})
+
+	var rtn struct {
+		Id int
+	}
+	AddHandler("readThumbnail", TVShowNode, &rtn, func() []byte {
+		var pic []byte
+
+		query := fmt.Sprintf("SELECT thumbnail FROM tvshow WHERE id=%d", rtn.Id)
+
+		err := database.QueryRow(query).Scan(&pic)
+		if err != nil {
+			fmt.Printf("the thumbnail of movie id %d couldn't be found", rtn.Id)
+			return nil
+		}
+
+		return pic
+	})
+}
--- a/apiGo/api/Tags.go
+++ b/apiGo/api/Tags.go
@@ -37,7 +37,7 @@ func deleteFromDB() {
 			return database.ManualSuccessResponse(err)
 		} else {
 			// check with regex if its the key constraint error
-			r, _ := regexp.Compile("^.*a foreign key constraint fails.*$")
+			r := regexp.MustCompile("^.*a foreign key constraint fails.*$")
 			if r.MatchString(err.Error()) {
 				return []byte(`{"result":"not empty tag"}`)
 			} else {
--- a/apiGo/api/Video.go
+++ b/apiGo/api/Video.go
@@ -44,7 +44,7 @@ func getVideoHandlers() {
 	AddHandler("readThumbnail", VideoNode, &rtn, func() []byte {
 		var pic []byte

-		query := fmt.Sprintf("SELECT thumbnail FROM videos WHERE movie_id='%d'", rtn.Movieid)
+		query := fmt.Sprintf("SELECT thumbnail FROM videos WHERE movie_id=%d", rtn.Movieid)

 		err := database.QueryRow(query).Scan(&pic)
 		if err != nil {
--- a/apiGo/api/oauth/Oauth.go
+++ b/apiGo/api/oauth/Oauth.go
@@ -48,7 +48,7 @@ func InitOAuth() {
 	})
 }

-func ValidateToken(f http.HandlerFunc) http.HandlerFunc {
+func ValidateToken(f func(rw http.ResponseWriter, req *http.Request, node int), node int) http.HandlerFunc {
 	return func(w http.ResponseWriter, r *http.Request) {
 		_, err := srv.ValidationBearerToken(r)
 		if err != nil {
@@ -56,6 +56,6 @@ func ValidateToken(f http.HandlerFunc) http.HandlerFunc {
 			return
 		}

-		f.ServeHTTP(w, r)
+		f(w, r, node)
 	}
 }
--- a/apiGo/api/types/Types.go
+++ b/apiGo/api/types/Types.go
@@ -7,12 +7,12 @@ type VideoUnloadedType struct {

 type FullVideoType struct {
 	MovieName    string
-	MovieId      int
+	MovieId      uint32
 	MovieUrl     string
 	Poster       string
-	Likes        int
-	Quality      int
-	Length       int
+	Likes        uint64
+	Quality      uint16
+	Length       uint16
 	Tags         []Tag
 	SuggestedTag []Tag
 	Actors       []Actor
@@ -20,22 +20,22 @@ type FullVideoType struct {

 type Tag struct {
 	TagName string
-	TagId   int
+	TagId   uint32
 }

 type Actor struct {
-	ActorId   int
+	ActorId   uint32
 	Name      string
 	Thumbnail string
 }

 type StartData struct {
-	VideoNr       int
-	FullHdNr      int
-	HDNr          int
-	SDNr          int
-	DifferentTags int
-	Tagged        int
+	VideoNr       uint32
+	FullHdNr      uint32
+	HDNr          uint32
+	SDNr          uint32
+	DifferentTags uint32
+	Tagged        uint32
 }

 type SettingsType struct {
@@ -47,10 +47,15 @@ type SettingsType struct {
 	TMDBGrabbing    bool
 	DarkMode        bool

-	VideoNr       int
+	VideoNr       uint32
 	DBSize        float32
-	DifferentTags int
-	TagsAdded     int
+	DifferentTags uint32
+	TagsAdded     uint32

 	PathPrefix string
 }
+
+type TVShow struct {
+	Id   uint32
+	Name string
+}
--- a/apiGo/database/settings/DBSettings.go
+++ b/apiGo/database/settings/DBSettings.go
@@ -15,35 +15,24 @@ func GetPassword() *string {
 }

 type SettingsType struct {
-	DarkMode         bool
-	Pasword          string
-	Mediacenter_name string
-	VideoPath        string
+	DarkMode        bool
+	Pasword         string
+	MediacenterName string
+	VideoPath       string
+	TVShowPath      string
 }

 func LoadSettings() *SettingsType {
-	query := "SELECT DarkMode, password, mediacenter_name, video_path from settings"
+	query := "SELECT DarkMode, password, mediacenter_name, video_path, episode_path from settings"

-	type RawSettingsType struct {
-		DarkMode         int
-		Pasword          string
-		Mediacenter_name string
-		VideoPath        string
-	}
+	result := SettingsType{}
+	var darkmode uint8

-	result := RawSettingsType{}
-
-	err := database.QueryRow(query).Scan(&result.DarkMode, &result.Pasword, &result.Mediacenter_name, &result.VideoPath)
+	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())
 	}

-	res := SettingsType{
-		DarkMode:         result.DarkMode != 0,
-		Pasword:          result.Pasword,
-		Mediacenter_name: result.Mediacenter_name,
-		VideoPath:        result.VideoPath,
-	}
-
-	return &res
+	result.DarkMode = darkmode != 0
+	return &result
 }
--- a/apiGo/go.mod
+++ b/apiGo/go.mod
@@ -5,4 +5,5 @@ go 1.16
 require (
 	github.com/go-sql-driver/mysql v1.5.0
 	gopkg.in/oauth2.v3 v3.12.0
+	nhooyr.io/websocket v1.8.7
 )
--- a/apiGo/go.sum
+++ b/apiGo/go.sum
@@ -1,54 +1,58 @@
 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 h1:ZDRjVQ15GmhC3fiQ8ni8+OwkZQO4DARzQgrnXU1Liz8=
 github.com/davecgh/go-spew v1.1.0/go.mod h1:J7Y8YcW2NihsgmVo/mv3lAwl/skON4iLHjSsI+c5H38=
+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/go.mod h1:RHrZQHXnP2xjPF+u1gW/2HnVO7nvIa9PG3Gm+fLHvGI=
+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/go.mod h1:taPMhCMXrRLJO55olJkUXHZBHCxTMfnGwq/HNwmWNS8=
+github.com/go-playground/universal-translator v0.17.0/go.mod h1:UkSxE5sNxxRwHyU+Scu5vgOQjsIJAF8j9muTVoKLVtA=
+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/go.mod h1:L0fX3K22YWvt/FAX9NnzrNzcI4wNYi9Yku4O0LKYflo=
+github.com/gobwas/pool v0.2.0/go.mod h1:q8bcK0KcYlCgd9e7WYLm9LpyS+YeLd8JVDW6WezmKEw=
+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/google/go-querystring v1.0.0 h1:Xkwi/a1rcvNg1PPYe5vI8GbeBY/jrVuDX5ASuANWTrk=
+github.com/golang/protobuf v1.3.3/go.mod h1:vzj43D7+SQXF/4pzW/hwtAqwc6iTitCiVSaWz5lYuqw=
+github.com/golang/protobuf v1.3.5/go.mod h1:6O5/vntMXwX2lRkT1hjjk0nAC1IDOTvTlVgjlRvqsdk=
+github.com/google/go-cmp v0.4.0/go.mod h1:v8dTdLbMG2kIc/vJvl+f65V22dbkXbowE6jgT/gNBxE=
 github.com/google/go-querystring v1.0.0/go.mod h1:odCYkC5MyYFN7vkCjXpyrEuKhc/BUO6wN/zVPAxq5ck=
-github.com/gopherjs/gopherjs v0.0.0-20181017120253-0766667cb4d1 h1:EGx4pi6eqNxGaHF6qqu48+N2wcFQ5qg5FXgOdqsJ5d8=
+github.com/google/gofuzz v1.0.0/go.mod h1:dBl0BpW6vV/+mYPU4Po3pmUjxk6FQPldtuIdl/M65Eg=
 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/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/jtolds/gls v4.20.0+incompatible h1:xdiiI2gbIgH/gLH7ADydsJ1uDOEzR8yvV7C0MuV77Wo=
+github.com/json-iterator/go v1.1.9/go.mod h1:KdQUCv79m/52Kvf8AW2vK1V8akMuk1QjK/uOdHXbAo4=
 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 h1:Bx0qjetmNjdFXASH02NSAREKpiaDwkO1DRZ3dV2KCcs=
 github.com/klauspost/compress v1.8.2/go.mod h1:RyIbtBH6LamlWaDj8nUwkbUhJ87Yi3uG0guNDohfE1A=
-github.com/klauspost/cpuid v1.2.1 h1:vJi+O/nMdFt0vqm8NZBI6wzALWdA2X+egi0ogNyrC/w=
+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/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/moul/http2curl v1.0.0 h1:dRMWoAtb+ePxMlLkrCbAqh4TlPHXvoGUSQ323/9Zahs=
+github.com/mattn/go-isatty v0.0.12/go.mod h1:cbi8OIDigv2wuxKPP5vlRcQ1OAZbq2CE4Kysco4FUpU=
+github.com/modern-go/concurrent v0.0.0-20180228061459-e0a39a4cb421/go.mod h1:6dJC0mAP4ikYIbvyc7fijjWJddQyLn8Ig3JB5CqoB9Q=
+github.com/modern-go/reflect2 v0.0.0-20180701023420-4b7aa43c6742/go.mod h1:bx2lNnkwVCuqBIxFjflWJWanXIb3RllmbCylyMrvgv0=
 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=
@@ -66,22 +70,16 @@ github.com/tidwall/rtree v0.0.0-20180113144539-6cd427091e0e h1:+NL1GDIUOKxVfbp2K
 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/valyala/bytebufferpool v1.0.0 h1:GqA5TC/0021Y/b9FG4Oi9Mr3q7XYx6KllzawFIhcdPw=
+github.com/ugorji/go v1.1.7/go.mod h1:kZn38zHttfInRq0xu/PH0az30d+z6vm202qpg1oXVMw=
+github.com/ugorji/go/codec v1.1.7/go.mod h1:Ax+UKWsSmolVDwsd+7N3ZtXu+yMGCf907BLYF3GoBXY=
 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=
@@ -89,7 +87,6 @@ golang.org/x/net v0.0.0-20180724234803-3673e40ba225/go.mod h1:mL1N/T3taQHkDXs73r
 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=
@@ -97,8 +94,13 @@ golang.org/x/sync v0.0.0-20181221193216-37e7f081c4d4/go.mod h1:RxMgew5VJxzue5/jJ
 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/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/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=
@@ -106,5 +108,7 @@ 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 h1:ZCJp+EgiOT7lHqUV2J862kp8Qj64Jo6az82+3Td9dZw=
 gopkg.in/yaml.v2 v2.2.2/go.mod h1:hI93XBmqTisBFMUTm0b8Fm+jr3Dg1NNxqwp+5A1VGuI=
+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=
--- a/apiGo/main.go
+++ b/apiGo/main.go
@@ -8,6 +8,7 @@ import (
 	"openmediacenter/apiGo/api"
 	"openmediacenter/apiGo/database"
 	"openmediacenter/apiGo/static"
+	"openmediacenter/apiGo/videoparser"
 )

 func main() {
@@ -30,7 +31,9 @@ func main() {
 	api.AddSettingsHandlers()
 	api.AddTagHandlers()
 	api.AddActorsHandlers()
-	api.AddInitHandlers()
+	api.AddTvshowHandlers()
+
+	videoparser.SetupSettingsWebsocket()

 	// add the static files
 	static.ServeStaticFiles()
--- a/apiGo/videoparser/Helpers.go
+++ b/apiGo/videoparser/Helpers.go
@@ -0,0 +1,138 @@
+package videoparser
+
+import (
+	"bytes"
+	"encoding/base64"
+	"encoding/json"
+	"fmt"
+	"image/jpeg"
+	"log"
+	"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
+	}
+
+	// extract dimensions of picture
+	reader := bytes.NewReader(stdout)
+	im, err := jpeg.DecodeConfig(reader)
+	if err != nil {
+		log.Fatal(err)
+	}
+	fmt.Printf("%d %d\n", im.Width, im.Height)
+	// todo use this information somewhere...
+
+	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
+	}
+
+	// nil slice check of track array
+	if len(t.Media.Track) == 0 {
+		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
+}
--- a/apiGo/videoparser/ReIndexTVShows.go
+++ b/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
+}
--- a/apiGo/videoparser/ReIndexTVShows_test.go
+++ b/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.")
+	}
+}
--- a/apiGo/videoparser/ReIndexVideos.go
+++ b/apiGo/videoparser/ReIndexVideos.go
@@ -2,13 +2,10 @@ package videoparser

 import (
 	"database/sql"
-	"encoding/base64"
-	"encoding/json"
 	"fmt"
 	"openmediacenter/apiGo/api/types"
 	"openmediacenter/apiGo/database"
 	"openmediacenter/apiGo/videoparser/tmdb"
-	"os/exec"
 	"regexp"
 	"strconv"
 	"strings"
@@ -51,9 +48,8 @@ func ReIndexVideos(path []string, sett types.SettingsType) {
 		processVideo(s)
 	}

-	AppendMessageBuffer("reindex finished successfully!")
-
-	contentAvailable = false
+	AppendMessage("reindex finished successfully!")
+	SendEvent("stop")
 	fmt.Println("Reindexing finished!")
 }

@@ -100,7 +96,7 @@ func processVideo(fileNameOrig string) {
 	fmt.Printf("Processing %s video-", fileNameOrig)

 	// match the file extension
-	r, _ := regexp.Compile(`\.[a-zA-Z0-9]+$`)
+	r := regexp.MustCompile(`\.[a-zA-Z0-9]+$`)
 	fileName := r.ReplaceAllString(fileNameOrig, "")

 	// match the year and cut year from name
@@ -125,7 +121,7 @@ func addVideo(videoName string, fileName string, year int) {
 	}

 	if mExtDepsAvailable.FFMpeg {
-		ppic, err = parseFFmpegPic(fileName)
+		ppic, err = parseFFmpegPic(mSettings.VideoPath + fileName)
 		if err != nil {
 			fmt.Printf("FFmpeg error occured: %s\n", err.Error())
 		} else {
@@ -134,7 +130,7 @@ func addVideo(videoName string, fileName string, year int) {
 	}

 	if mExtDepsAvailable.MediaInfo {
-		atr := getVideoAttributes(fileName)
+		atr := getVideoAttributes(mSettings.VideoPath + fileName)
 		if atr != nil {
 			vidAtr = atr
 		}
@@ -168,11 +164,11 @@ func addVideo(videoName string, fileName string, year int) {
 		insertTMDBTags(tmdbData.GenreIds, insertId)
 	}

-	AppendMessageBuffer(fmt.Sprintf("%s - added!", videoName))
+	AppendMessage(fmt.Sprintf("%s - added!", videoName))
 }

 func matchYear(fileName string) (int, string) {
-	r, _ := regexp.Compile(`\([0-9]{4}?\)`)
+	r := regexp.MustCompile(`\([0-9]{4}?\)`)
 	years := r.FindAllString(fileName, -1)
 	if len(years) == 0 {
 		return -1, fileName
@@ -189,95 +185,6 @@ func matchYear(fileName string) (int, string) {
 	return year, r.ReplaceAllString(fileName, "")
 }

-// parse the thumbail picture from video file
-func parseFFmpegPic(fileName string) (*string, error) {
-	app := "ffmpeg"
-
-	cmd := exec.Command(app,
-		"-hide_banner",
-		"-loglevel", "panic",
-		"-ss", "00:04:00",
-		"-i", mSettings.VideoPath+fileName,
-		"-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(fileName string) *VideoAttributes {
-	app := "mediainfo"
-
-	arg0 := mSettings.VideoPath + fileName
-	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
-}
-
-func AppendMessageBuffer(message string) {
-	messageBuffer = append(messageBuffer, message)
-}
-
-// 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
-}
-
 // insert the default size tags to corresponding video
 func insertSizeTag(width uint, videoId uint) {
 	var tagType uint
--- a/apiGo/videoparser/VideoParser.go
+++ b/apiGo/videoparser/VideoParser.go
@@ -2,25 +2,22 @@ package videoparser

 import (
 	"fmt"
+	"io/ioutil"
 	"openmediacenter/apiGo/database"
 	"os"
 	"path/filepath"
 	"strings"
 )

-var messageBuffer []string
-var contentAvailable = false
-
 type StatusMessage struct {
 	Messages         []string
 	ContentAvailable bool
 }

 func StartReindex() bool {
-	messageBuffer = []string{}
-	contentAvailable = true
-
 	fmt.Println("starting reindex..")
+	SendEvent("start")
+	AppendMessage("starting reindex..")

 	mSettings := database.GetSettings()
 	// add the path prefix to videopath
@@ -29,6 +26,8 @@ func StartReindex() bool {
 	// 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
 	}

@@ -49,20 +48,77 @@ func StartReindex() bool {
 		fmt.Println(err.Error())
 	}
 	// start reindex process
-	AppendMessageBuffer("Starting Reindexing!")
+	AppendMessage("Starting Reindexing!")
 	go ReIndexVideos(files, mSettings)
 	return true
 }

-func GetStatusMessage() *StatusMessage {
-	msg := StatusMessage{
-		Messages:         messageBuffer,
-		ContentAvailable: contentAvailable,
+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 := database.GetSettings()
+	// add the path prefix to videopath
+	mSettings.EpisodePath = mSettings.PathPrefix + mSettings.EpisodePath
+
+	// add slash suffix if not existing
+	if !strings.HasSuffix(mSettings.EpisodePath, "/") {
+		mSettings.EpisodePath += "/"
 	}

-	messageBuffer = []string{}
+	// 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
+	}

-	return &msg
+	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() {
--- a/apiGo/videoparser/WebSocketConnector.go
+++ b/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)
+}
--- a/apiGo/videoparser/tmdb/TMDBApi.go
+++ b/apiGo/videoparser/tmdb/TMDBApi.go
@@ -21,21 +21,43 @@ type VideoTMDB struct {
 	GenreIds  []int
 }

+type TVShowTMDB struct {
+	Thumbnail string
+	Overview  string
+	GenreIds  []int
+}
+
 type tmdbVidResult struct {
-	Poster_path       string
-	Adult             bool
-	Overview          string
-	Release_date      string
-	Genre_ids         []int
-	Id                int
-	Original_title    string
-	Original_language string
-	Title             string
-	Backdrop_path     string
-	Popularity        int
-	Vote_count        int
-	Video             bool
-	Vote_average      int
+	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 {
@@ -74,7 +96,7 @@ func SearchVideo(MovieName string, year int) *VideoTMDB {
 	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.Release_date) {
+			if r.MatchString(result.ReleaseDate) {
 				tmdbVid = result
 				// continue parsing
 				goto cont
@@ -89,22 +111,61 @@ func SearchVideo(MovieName string, year int) *VideoTMDB {
 	// continue label
 cont:

-	thumbnail := fetchPoster(tmdbVid)
+	thumbnail := fetchPoster(tmdbVid.PosterPath)

 	result := VideoTMDB{
 		Thumbnail: *thumbnail,
 		Overview:  tmdbVid.Overview,
 		Title:     tmdbVid.Title,
-		GenreIds:  tmdbVid.Genre_ids,
+		GenreIds:  tmdbVid.GenreIds,
 	}

 	return &result
 }

-func fetchPoster(vid tmdbVidResult) *string {
-	url := fmt.Sprintf("%s%s", pictureBase, vid.Poster_path)
+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
+	}

-	resp, err := http.Get(url)
+	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,
+	}
+
+	thumbnail := fetchPoster(t.Results[0].PosterPath)
+	if thumbnail != nil {
+		res.Thumbnail = *thumbnail
+	}
+
+	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
@@ -123,8 +184,8 @@ func fetchPoster(vid tmdbVidResult) *string {
 var tmdbGenres *[]TMDBGenre

 func fetchGenres() *[]TMDBGenre {
-	url := fmt.Sprintf("%sgenre/movie/list?api_key=%s", baseUrl, apiKey)
-	resp, err := http.Get(url)
+	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
--- a/database.sql
+++ b/database.sql
@@ -9,12 +9,12 @@ create table if not exists actors

 create table if not exists settings
 (
-    video_path       varchar(255)      null,
-    episode_path     varchar(255)      null,
-    password         varchar(32)       null,
-    mediacenter_name varchar(32)       null,
-    TMDB_grabbing    tinyint           null,
-    DarkMode         tinyint default 0 null
+    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
@@ -24,18 +24,41 @@ 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,
-    likes       int      default 0                 null,
-    create_date datetime default CURRENT_TIMESTAMP null,
-    quality     int                                null,
-    length      int                                null comment 'in seconds',
-    poster      mediumblob                         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
--- a/deb/OpenMediaCenter/etc/nginx/sites-available/OpenMediaCenter.conf
+++ b/deb/OpenMediaCenter/etc/nginx/sites-available/OpenMediaCenter.conf
@@ -16,4 +16,11 @@ server {
    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;
+    }
 }
--- a/public/favicon.ico
+++ b/public/favicon.ico
--- a/public/index.html
+++ b/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/
--- a/public/logo192.png
+++ b/public/logo192.png
--- a/public/logo512.png
+++ b/public/logo512.png
--- a/public/logo_circle.png
+++ b/public/logo_circle.png
--- a/public/manifest.json
+++ b/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": ".",
--- a/src/App.test.js
+++ b/src/App.test.js
@@ -18,7 +18,7 @@ describe('<App/>', function () {
    it('are navlinks correct', function () {
        const wrapper = shallow(<App/>);
        wrapper.setState({password: false});
-        expect(wrapper.find('.navitem')).toHaveLength(4);
+        expect(wrapper.find('.navitem')).toHaveLength(5);
    });

    it('test initial fetch from api', done => {
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -9,7 +9,7 @@ import style from './App.module.css';

 import SettingsPage from './pages/SettingsPage/SettingsPage';
 import CategoryPage from './pages/CategoryPage/CategoryPage';
-import {APINode, apiTokenValid, callApiUnsafe, refreshAPIToken} from './utils/Api';
+import {APINode, callAPI} from './utils/Api';

 import {BrowserRouter as Router, NavLink, Route, Switch} from 'react-router-dom';
 import Player from './pages/Player/Player';
@@ -17,6 +17,10 @@ import ActorOverviewPage from './pages/ActorOverviewPage/ActorOverviewPage';
 import ActorPage from './pages/ActorPage/ActorPage';
 import {SettingsTypes} from './types/ApiTypes';
 import AuthenticationPage from './pages/AuthenticationPage/AuthenticationPage';
+import TVShowPage from './pages/TVShowPage/TVShowPage';
+import TVPlayer from './pages/TVShowPage/TVPlayer';
+import {CookieTokenStore} from './utils/TokenStore/CookieTokenStore';
+import {token} from './utils/TokenHandler';

 interface state {
    password: boolean | null; // null if uninitialized - true if pwd needed false if not needed
@@ -30,12 +34,14 @@ class App extends React.Component<{}, state> {
    constructor(props: {}) {
        super(props);

+        token.init(new CookieTokenStore());
+
        let pwdneeded: boolean | null = null;

-        if (apiTokenValid()) {
+        if (token.apiTokenValid()) {
            pwdneeded = false;
        } else {
-            refreshAPIToken((err) => {
+            token.refreshAPIToken((err) => {
                if (err === 'invalid_client') {
                    this.setState({password: true});
                } else if (err === '') {
@@ -59,7 +65,7 @@ class App extends React.Component<{}, state> {
        // set the hook to load passwordfield on global func call
        GlobalInfos.loadPasswordPage = (callback?: () => void): void => {
            // try refreshing the token
-            refreshAPIToken((err) => {
+            token.refreshAPIToken((err) => {
                if (err !== '') {
                    this.setState({password: true});
                } else {
@@ -74,11 +80,11 @@ class App extends React.Component<{}, state> {

    initialAPICall(): void {
        // this is the first api call so if it fails we know there is no connection to backend
-        callApiUnsafe(APINode.Init, {action: 'loadInitialData'}, (result: SettingsTypes.initialApiCallData) => {
+        callAPI(APINode.Settings, {action: 'loadInitialData'}, (result: SettingsTypes.initialApiCallData) => {
            // set theme
            GlobalInfos.enableDarkTheme(result.DarkMode);

-            GlobalInfos.setVideoPath(result.VideoPath);
+            GlobalInfos.setVideoPaths(result.VideoPath, result.TVShowPath);

            this.setState({
                mediacentername: result.MediacenterName
@@ -93,48 +99,25 @@ class App extends React.Component<{}, state> {
    }

    render(): JSX.Element {
-        const themeStyle = GlobalInfos.getThemeStyle();
        // add the main theme to the page body
-        document.body.className = themeStyle.backgroundcolor;
+        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})} />;
+            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}>
-                        <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>
-                            <NavLink
-                                className={[style.navitem, themeStyle.navitem].join(' ')}
-                                to={'/settings'}
-                                activeStyle={{opacity: '0.85'}}>
-                                Settings
-                            </NavLink>
-                        </div>
+                        {this.navBar()}
                        {this.routing()}
                    </div>
                </Router>
@@ -144,6 +127,38 @@ class App extends React.Component<{}, state> {
        }
    }

+    /**
+     * 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>
+                <NavLink className={[style.navitem, themeStyle.navitem].join(' ')} to={'/tvshows'} activeStyle={{opacity: '0.85'}}>
+                    TV Shows
+                </NavLink>
+                <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>
@@ -153,12 +168,18 @@ class App extends React.Component<{}, state> {
                <Route path='/categories'>
                    <CategoryPage />
                </Route>
+                <Route path='/tvshows'>
+                    <TVShowPage />
+                </Route>
                <Route path='/settings'>
                    <SettingsPage />
                </Route>
                <Route exact path='/player/:id'>
                    <Player />
                </Route>
+                <Route exact path='/tvplayer/:id'>
+                    <TVPlayer />
+                </Route>
                <Route exact path='/actors'>
                    <ActorOverviewPage />
                </Route>
--- a/src/elements/DynamicContentContainer/DynamicContentContainer.module.css
+++ b/src/elements/DynamicContentContainer/DynamicContentContainer.module.css
@@ -1,4 +1,5 @@
 .maincontent {
    float: left;
    width: 70%;
-}
+    flex: 1;
+}
--- a/src/elements/DynamicContentContainer/DynamicContentContainer.test.js
+++ b/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);
+    });
+});
--- a/src/elements/DynamicContentContainer/DynamicContentContainer.tsx
+++ b/src/elements/DynamicContentContainer/DynamicContentContainer.tsx
@@ -0,0 +1,107 @@
+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 (prevProps.data.length !== this.props.data.length) {
+            this.clean();
+            this.loadPreviewBlock(this.InitialLoadNR);
+        }
+    }
+
+    /**
+     * clear all elements rendered...
+     */
+    clean(): void {
+        this.loadindex = 0;
+        this.setState({loadeditems: []});
+    }
+
+    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;
--- a/src/elements/Preview/Preview.module.css
+++ b/src/elements/Preview/Preview.module.css
@@ -1,19 +1,9 @@
-.previewText {
-    font-size: 15px;
+.previewtitle {
+    font-size: smaller;
    font-weight: bold;
-    height: 42px;
-    width: 100%;
+    height: 20px;
+    max-width: 266px;
    text-align: center;
-    position: absolute;
-    bottom: 0;
-    background-color: rgba(60, 61, 72, 0.7);
-    color: white;
-    border-bottom-left-radius: 20px;
-    border-bottom-right-radius: 20px;
-
-    border-top-width: 1px;
-    border-top-color: #3c3d48;
-    border-top-style: solid;
 }

 .previewpic {
@@ -22,8 +12,6 @@
    min-width: 266px;
    overflow: hidden;
    text-align: center;
-
-    border-radius: 20px;
 }

 .loadAnimation {
@@ -50,7 +38,6 @@
    margin-left: 25px;
    margin-top: 25px;
    opacity: 0.85;
-    position: relative;
 }

 .videopreview:hover {
--- a/src/elements/Preview/Preview.tsx
+++ b/src/elements/Preview/Preview.tsx
@@ -3,17 +3,18 @@ import style from './Preview.module.css';
 import {Spinner} from 'react-bootstrap';
 import {Link} from 'react-router-dom';
 import GlobalInfos from '../../utils/GlobalInfos';
-import {APINode, callAPIPlain} from '../../utils/Api';
 import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
 import {faPhotoVideo} from '@fortawesome/free-solid-svg-icons';

 interface PreviewProps {
    name: string;
-    movieId: number;
+    picLoader: (callback: (pic: string) => void) => void;
+    linkPath?: string;
+    onClick?: () => void;
 }

 interface PreviewState {
-    previewpicture: string | null;
+    picLoaded: boolean | null;
 }

 /**
@@ -21,55 +22,62 @@ interface PreviewState {
 * 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 = {
-            previewpicture: null
+            picLoaded: null
        };
    }

    componentDidMount(): void {
-        callAPIPlain(APINode.Video, {action: 'readThumbnail', movieid: this.props.movieId}, (result) => {
+        this.props.picLoader((result) => {
+            this.pic = result;
            this.setState({
-                previewpicture: result
+                picLoaded: result !== ''
            });
        });
    }

    render(): JSX.Element {
-        const themeStyle = GlobalInfos.getThemeStyle();
-        return (
-            <Link to={'/player/' + this.props.movieId}>
-                <div className={style.videopreview + ' ' + themeStyle.secbackground + ' ' + themeStyle.preview}>
-                    <div className={style.previewpic}>{this.renderPic()}</div>
-                    <div className={style.previewText + ' ' + themeStyle.lighttextcolor}>{this.props.name}</div>
-                </div>
-            </Link>
-        );
+        if (this.props.linkPath !== undefined) {
+            return <Link to={this.props.linkPath}>{this.content()}</Link>;
+        } else {
+            return this.content();
+        }
    }

-    private renderPic(): JSX.Element {
-        if (this.state.previewpicture === '') {
-            return (
-                <FontAwesomeIcon
-                    style={{
-                        color: 'white',
-                        marginTop: '55px'
-                    }}
-                    icon={faPhotoVideo}
-                    size='5x'
-                />
-            );
-        } else if (this.state.previewpicture === null) {
-            return (
-                <span className={style.loadAnimation}>
-                    <Spinner animation='border' />
-                </span>
-            );
-        } else {
-            return <img className={style.previewimage} src={this.state.previewpicture} alt='Pic loading.' />;
-        }
+    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>
+        );
    }
 }

--- a/src/elements/Preview/Previw.test.js
+++ b/src/elements/Preview/Previw.test.js
@@ -5,37 +5,29 @@ import Preview, {TagPreview} from './Preview';

 describe('<Preview/>', function () {
    it('renders without crashing ', function () {
-        const wrapper = shallow(<Preview movieId={1}/>);
+        const wrapper = shallow(<Preview movieId={1} name='test' picLoader={callback => callback('')}/>);
        wrapper.unmount();
    });

-    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);
+    it('picture rendered correctly', () => {
+        const func = jest.fn();
+        const wrapper = shallow(<Preview movieId={1} name='test' picLoader={callback => {
+            func();
+            callback('42');
+        }}/>);

-        const wrapper = shallow(<Preview name='test' movieId={1}/>);
-
-        // 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();
-            // check if preview title renders correctly
-            expect(wrapper.find('.previewtitle').text()).toBe('test');
-
-            global.fetch.mockClear();
-            done();
-        });
+        // 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 () {
-        const wrapper = shallow(<Preview movieId={1}/>);
+        // if callback is never called --> infinite spinner
+        const wrapper = shallow(<Preview movieId={1} name='test' picLoader={callback => {}}/>);

        // expect load animation to be visible
        expect(wrapper.find('.loadAnimation')).toHaveLength(1);
--- a/src/elements/VideoContainer/VideoContainer.test.js
+++ b/src/elements/VideoContainer/VideoContainer.test.js
@@ -7,24 +7,4 @@ describe('<VideoContainer/>', function () {
        const wrapper = shallow(<VideoContainer data={[]}/>);
        wrapper.unmount();
    });
-
-    it('inserts tiles correctly if enough available', () => {
-        const wrapper = shallow(<VideoContainer data={[
-            {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}
-        ]}/>);
-        expect(wrapper.find('Preview')).toHaveLength(16);
-    });
-
-    it('inserts tiles correctly if not enough available', () => {
-        const wrapper = shallow(<VideoContainer data={[
-            {}, {}, {}, {}
-        ]}/>);
-        expect(wrapper.find('Preview')).toHaveLength(4);
-    });
-
-    it('no items available', () => {
-        const wrapper = shallow(<VideoContainer data={[]}/>);
-        expect(wrapper.find('Preview')).toHaveLength(0);
-        expect(wrapper.find('.maincontent').text()).toBe('no items to show!');
-    });
 });
--- a/src/elements/VideoContainer/VideoContainer.tsx
+++ b/src/elements/VideoContainer/VideoContainer.tsx
@@ -1,89 +1,38 @@
 import React from 'react';
 import Preview from '../Preview/Preview';
-import style from './VideoContainer.module.css';
 import {VideoTypes} from '../../types/ApiTypes';
+import DynamicContentContainer from '../DynamicContentContainer/DynamicContentContainer';
+import {APINode, callAPIPlain} from '../../utils/Api';

 interface Props {
    data: VideoTypes.VideoUnloadedType[];
+    children?: JSX.Element;
 }

-interface state {
-    loadeditems: VideoTypes.VideoUnloadedType[];
-    selectionnr: number;
-}
-
-/**
- * A videocontainer storing lots of Preview elements
- * includes scroll handling and loading of preview infos
- */
-class VideoContainer extends React.Component<Props, state> {
-    // stores current index of loaded elements
-    loadindex: number = 0;
-
-    constructor(props: Props) {
-        super(props);
-
-        this.state = {
-            loadeditems: [],
-            selectionnr: 0
-        };
-    }
-
-    componentDidMount(): void {
-        document.addEventListener('scroll', this.trackScrolling);
-
-        this.loadPreviewBlock(16);
-    }
-
-    render(): JSX.Element {
-        return (
-            <div className={style.maincontent}>
-                {this.state.loadeditems.map((elem) => (
-                    <Preview key={elem.MovieId} name={elem.MovieName} movieId={elem.MovieId} />
-                ))}
-                {/*todo css for no items to show*/}
-                {this.state.loadeditems.length === 0 ? 'no items to show!' : null}
-                {this.props.children}
-            </div>
-        );
-    }
-
-    componentWillUnmount(): void {
-        this.setState({});
-        // unbind scroll listener when unmounting component
-        document.removeEventListener('scroll', this.trackScrolling);
-    }
-
-    /**
-     * load previews to the container
-     * @param nr number of previews to load
-     */
-    loadPreviewBlock(nr: number): void {
-        console.log('loadpreviewblock called ...');
-        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);
-        }
-    };
-}
+const VideoContainer = (props: Props): JSX.Element => {
+    return (
+        <DynamicContentContainer
+            renderElement={(el): JSX.Element => (
+                <Preview
+                    key={el.MovieId}
+                    picLoader={(callback: (pic: string) => void): void => {
+                        callAPIPlain(
+                            APINode.Video,
+                            {
+                                action: 'readThumbnail',
+                                movieid: el.MovieId
+                            },
+                            (result) => callback(result)
+                        );
+                    }}
+                    name={el.MovieName}
+                    linkPath={'/player/' + el.MovieId}
+                />
+            )}
+            data={props.data}>
+            {props.children}
+        </DynamicContentContainer>
+    );
+};

 export default VideoContainer;
--- a/src/pages/ActorOverviewPage/ActorOverviewPage.test.js
+++ b/src/pages/ActorOverviewPage/ActorOverviewPage.test.js
@@ -8,20 +8,6 @@ describe('<ActorOverviewPage/>', function () {
        wrapper.unmount();
    });

-    it('test inerstion of actor tiles', function () {
-        const wrapper = shallow(<ActorOverviewPage/>);
-
-        wrapper.setState({
-            actors: [{
-                thumbnail: '',
-                name: 'testname',
-                actor_id: 42
-            }]
-        });
-
-        expect(wrapper.find('ActorTile')).toHaveLength(1);
-    });
-
    it('test newtagpopup visibility', function () {
        const wrapper = shallow(<ActorOverviewPage/>);

--- a/src/pages/ActorOverviewPage/ActorOverviewPage.tsx
+++ b/src/pages/ActorOverviewPage/ActorOverviewPage.tsx
@@ -4,9 +4,10 @@ import {ActorType} from '../../types/VideoTypes';
 import ActorTile from '../../elements/ActorTile/ActorTile';
 import PageTitle from '../../elements/PageTitle/PageTitle';
 import SideBar from '../../elements/SideBar/SideBar';
-import style from './ActorOverviewPage.module.css';
+// import style from './ActorOverviewPage.module.css';
 import {Button} from '../../elements/GPElements/Button';
 import NewActorPopup from '../../elements/Popups/NewActorPopup/NewActorPopup';
+import DynamicContentContainer from '../../elements/DynamicContentContainer/DynamicContentContainer';

 interface Props {}

@@ -36,11 +37,12 @@ class ActorOverviewPage extends React.Component<Props, state> {
                <SideBar>
                    <Button title='Add Actor' onClick={(): void => this.setState({NActorPopupVisible: true})} />
                </SideBar>
-                <div className={style.container}>
-                    {this.state.actors.map((el) => (
-                        <ActorTile key={el.ActorId} actor={el} />
-                    ))}
-                </div>
+                <DynamicContentContainer
+                    renderElement={(el): JSX.Element => <ActorTile key={el.ActorId} actor={el} />}
+                    data={this.state.actors}
+                    initialLoadNr={36}
+                />
+
                {this.state.NActorPopupVisible ? (
                    <NewActorPopup
                        onHide={(): void => {
--- a/src/pages/ActorPage/ActorPage.tsx
+++ b/src/pages/ActorPage/ActorPage.tsx
@@ -48,7 +48,7 @@ export class ActorPage extends React.Component<Props, state> {
                    </div>
                    <SideBarTitle>Attention: This is an early preview!</SideBarTitle>
                </SideBar>
-                {this.state.data.length !== 0 ? <VideoContainer data={this.state.data} /> : <div>No Data found!</div>}
+                <VideoContainer data={this.state.data} />
            </>
        );
    }
--- a/src/pages/AuthenticationPage/AuthenticationPage.test.js
+++ b/src/pages/AuthenticationPage/AuthenticationPage.test.js
@@ -1,6 +1,7 @@
 import React from 'react';
 import AuthenticationPage from './AuthenticationPage';
 import {shallow} from 'enzyme';
+import {token} from "../../utils/TokenHandler";

 describe('<AuthenticationPage/>', function () {
    it('renders without crashing ', function () {
@@ -25,8 +26,7 @@ describe('<AuthenticationPage/>', function () {
    it('test fail authenticate', function () {
        const events = mockKeyPress();

-        const helpers = require('../../utils/Api');
-        helpers.refreshAPIToken = jest.fn().mockImplementation((callback, force, pwd) => {
+        token.refreshAPIToken = jest.fn().mockImplementation((callback, force, pwd) => {
            callback('there was an error')
        });

@@ -41,8 +41,7 @@ describe('<AuthenticationPage/>', function () {
        const events = mockKeyPress();
        const func = jest.fn()

-        const helpers = require('../../utils/Api');
-        helpers.refreshAPIToken = jest.fn().mockImplementation((callback, force, pwd) => {
+        token.refreshAPIToken = jest.fn().mockImplementation((callback, force, pwd) => {
            callback('')
        });

--- a/src/pages/AuthenticationPage/AuthenticationPage.tsx
+++ b/src/pages/AuthenticationPage/AuthenticationPage.tsx
@@ -2,7 +2,7 @@ import React from 'react';
 import {Button} from '../../elements/GPElements/Button';
 import style from './AuthenticationPage.module.css';
 import {addKeyHandler, removeKeyHandler} from '../../utils/ShortkeyHandler';
-import {refreshAPIToken} from '../../utils/Api';
+import {token} from '../../utils/TokenHandler';
 import {faTimes} from '@fortawesome/free-solid-svg-icons';
 import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';

@@ -76,7 +76,7 @@ class AuthenticationPage extends React.Component<Props, state> {
     * request a new token and check if pwd was valid
     */
    authenticate(): void {
-        refreshAPIToken(
+        token.refreshAPIToken(
            (error) => {
                if (error !== '') {
                    this.setState({wrongPWDInfo: true});
--- a/src/pages/CategoryPage/TagView.test.js
+++ b/src/pages/CategoryPage/TagView.test.js
@@ -8,13 +8,6 @@ describe('<TagView/>', function () {
        wrapper.unmount();
    });

-    it('test Tag insertion', function () {
-        const wrapper = shallow(<TagView/>);
-        wrapper.setState({loadedtags: [{tag_name: 'test', tag_id: 42}]});
-
-        expect(wrapper.find('TagPreview')).toHaveLength(1);
-    });
-
    it('test new tag popup', function () {
        const wrapper = shallow(<TagView/>);

--- a/src/pages/CategoryPage/TagView.tsx
+++ b/src/pages/CategoryPage/TagView.tsx
@@ -1,6 +1,5 @@
 import {TagType} from '../../types/VideoTypes';
 import React from 'react';
-import videocontainerstyle from '../../elements/VideoContainer/VideoContainer.module.css';
 import {Link} from 'react-router-dom';
 import {TagPreview} from '../../elements/Preview/Preview';
 import {APINode, callAPI} from '../../utils/Api';
@@ -9,6 +8,7 @@ import SideBar, {SideBarTitle} from '../../elements/SideBar/SideBar';
 import Tag from '../../elements/Tag/Tag';
 import {DefaultTags} from '../../types/GeneralTypes';
 import NewTagPopup from '../../elements/Popups/NewTagPopup/NewTagPopup';
+import DynamicContentContainer from '../../elements/DynamicContentContainer/DynamicContentContainer';

 interface TagViewState {
    loadedtags: TagType[];
@@ -53,15 +53,15 @@ class TagView extends React.Component<Props, TagViewState> {
                        Add a new Tag!
                    </button>
                </SideBar>
-                <div className={videocontainerstyle.maincontent}>
-                    {this.state.loadedtags
-                        ? this.state.loadedtags.map((m) => (
-                              <Link to={'/categories/' + m.TagId} key={m.TagId}>
-                                  <TagPreview name={m.TagName} />
-                              </Link>
-                          ))
-                        : 'loading'}
-                </div>
+                <DynamicContentContainer
+                    data={this.state.loadedtags}
+                    renderElement={(m): JSX.Element => (
+                        <Link to={'/categories/' + m.TagId} key={m.TagId}>
+                            <TagPreview name={m.TagName} />
+                        </Link>
+                    )}
+                    initialLoadNr={20}
+                />
                {this.handlePopups()}
            </>
        );
--- a/src/pages/HomePage/HomePage.test.js
+++ b/src/pages/HomePage/HomePage.test.js
@@ -10,21 +10,6 @@ describe('<HomePage/>', function () {
        wrapper.unmount();
    });

-    it('test data insertion', function () {
-        const wrapper = shallow(<HomePage/>);
-
-        expect(wrapper.find('VideoContainer')).toHaveLength(0);
-
-        wrapper.setState({
-            data: [
-                {}, {}
-            ]
-        });
-
-        // there shoud be loaded the Videocontainer element into dom after fetching videos correctly
-        expect(wrapper.find('VideoContainer')).toHaveLength(1);
-    });
-
    it('test title and nr insertions', function () {
        const wrapper = shallow(<HomePage/>);

--- a/src/pages/HomePage/HomePage.tsx
+++ b/src/pages/HomePage/HomePage.tsx
@@ -157,7 +157,7 @@ export class HomePage extends React.Component<Props, state> {
                                }}
                            />
                        </SideBar>
-                        {this.state.data.length !== 0 ? <VideoContainer data={this.state.data} /> : <div>No Data found!</div>}
+                        <VideoContainer data={this.state.data} />
                        <div className={style.rightinfo} />
                    </Route>
                </Switch>
--- a/src/pages/Player/Player.tsx
+++ b/src/pages/Player/Player.tsx
@@ -15,14 +15,14 @@ import ActorTile from '../../elements/ActorTile/ActorTile';
 import {withRouter} from 'react-router-dom';
 import {APINode, callAPI} from '../../utils/Api';
 import {RouteComponentProps} from 'react-router';
-import {GeneralSuccess} from '../../types/GeneralTypes';
+import {DefaultPlyrOptions, GeneralSuccess} from '../../types/GeneralTypes';
 import {ActorType, TagType} from '../../types/VideoTypes';
 import PlyrJS from 'plyr';
 import {Button} from '../../elements/GPElements/Button';
 import {VideoTypes} from '../../types/ApiTypes';
 import GlobalInfos from '../../utils/GlobalInfos';

-interface myprops extends RouteComponentProps<{id: string}> {}
+interface Props extends RouteComponentProps<{id: string}> {}

 interface mystate {
    sources?: PlyrJS.SourceInfo;
@@ -42,25 +42,8 @@ interface mystate {
 * Player page loads when a video is selected to play and handles the video view
 * and actions such as tag adding and liking
 */
-export class Player extends React.Component<myprops, mystate> {
-    options: PlyrJS.Options = {
-        controls: [
-            'play-large', // The large play button in the center
-            'play', // Play/pause playback
-            'progress', // The progress bar and scrubber for playback and buffering
-            'current-time', // The current time of playback
-            'duration', // The full duration of the media
-            'mute', // Toggle mute
-            'volume', // Volume control
-            'captions', // Toggle captions
-            'settings', // Settings menu
-            'airplay', // Airplay (currently Safari only)
-            'download', // Show a download button with a link to either the current source or a custom URL you specify in your options
-            'fullscreen' // Toggle fullscreen
-        ]
-    };
-
-    constructor(props: myprops) {
+export class Player extends React.Component<Props, mystate> {
+    constructor(props: Props) {
        super(props);

        this.state = {
@@ -94,7 +77,7 @@ export class Player extends React.Component<myprops, mystate> {
                <div className={style.videowrapper}>
                    {/* video component is added here */}
                    {this.state.sources ? (
-                        <Plyr style={plyrstyle} source={this.state.sources} options={this.options} />
+                        <Plyr style={plyrstyle} source={this.state.sources} options={DefaultPlyrOptions} />
                    ) : (
                        <div>not loaded yet</div>
                    )}
@@ -279,17 +262,15 @@ export class Player extends React.Component<myprops, mystate> {
            APINode.Video,
            {action: 'loadVideo', MovieId: parseInt(this.props.match.params.id, 10)},
            (result: VideoTypes.loadVideoType) => {
-                console.log(result);
-                console.log(process.env.REACT_APP_CUST_BACK_DOMAIN);
                this.setState({
                    sources: {
                        type: 'video',
                        sources: [
                            {
                                src:
-                                    (process.env.REACT_APP_CUST_BACK_DOMAIN
-                                        ? process.env.REACT_APP_CUST_BACK_DOMAIN
-                                        : GlobalInfos.getVideoPath()) + result.MovieUrl,
+                                    (process.env.REACT_APP_CUST_BACK_DOMAIN ? process.env.REACT_APP_CUST_BACK_DOMAIN : '') +
+                                    GlobalInfos.getVideoPath() +
+                                    result.MovieUrl,
                                type: 'video/mp4',
                                size: 1080
                            }
--- a/src/pages/RandomPage/RandomPage.tsx
+++ b/src/pages/RandomPage/RandomPage.tsx
@@ -23,6 +23,8 @@ interface GetRandomMoviesType {
 * Randompage shuffles random viedeopreviews and provides a shuffle btn
 */
 class RandomPage extends React.Component<{}, state> {
+    readonly LoadNR = 3;
+
    constructor(props: {}) {
        super(props);

@@ -37,7 +39,7 @@ class RandomPage extends React.Component<{}, state> {
    componentDidMount(): void {
        addKeyHandler(this.keypress);

-        this.loadShuffledvideos(4);
+        this.loadShuffledvideos(this.LoadNR);
    }

    componentWillUnmount(): void {
@@ -75,7 +77,7 @@ class RandomPage extends React.Component<{}, state> {
     * click handler for shuffle btn
     */
    shuffleclick(): void {
-        this.loadShuffledvideos(4);
+        this.loadShuffledvideos(this.LoadNR);
    }

    /**
--- a/src/pages/SettingsPage/MovieSettings.test.js
+++ b/src/pages/SettingsPage/MovieSettings.test.js
@@ -1,7 +1,7 @@
 import {shallow} from 'enzyme';
 import React from 'react';
 import MovieSettings from './MovieSettings';
-import {callAPI} from "../../utils/Api";
+import {callAPI} from '../../utils/Api';

 describe('<MovieSettings/>', function () {
    it('renders without crashing ', function () {
@@ -23,106 +23,55 @@ describe('<MovieSettings/>', function () {
    });

    it('test simulate reindex', function () {
-        global.fetch = global.prepareFetchApi({success: true});
+        callAPIMock({success: true})
        const wrapper = shallow(<MovieSettings/>);

        wrapper.find('button').findWhere(e => e.text() === 'Reindex Movie' && e.type() === 'button').simulate('click');

-        // initial send of reindex request to server
-        expect(global.fetch).toBeCalledTimes(1);
-    });
-
-    it('test failing reindex start', done => {
-        global.fetch = global.prepareFetchApi({success: false});
-        const wrapper = shallow(<MovieSettings/>);
-
-        wrapper.find('button').findWhere(e => e.text() === 'Reindex Movie' && e.type() === 'button').simulate('click');
-
-        // initial send of reindex request to server
-        expect(global.fetch).toBeCalledTimes(1);
-
-        process.nextTick(() => {
-            // reindex already running --> so disable startbdn
-            expect(wrapper.state()).toMatchObject({startbtnDisabled: true});
-
-            global.fetch.mockClear();
-            done();
-        });
-    });
-
-    it('content available received and in state', () => {
-        const wrapper = shallow(<MovieSettings/>);
-        callAPIMock({
-            ContentAvailable: true,
-            Messages: ['firstline', 'secondline']
-        })
-
-        wrapper.instance().updateStatus();
-
-        expect(wrapper.state()).toMatchObject({
-            text: [
-                'firstline',
-                'secondline'
-            ]
-        });
-    });
-
-    it('test reindex with no content available', () => {
-        callAPIMock({
-            Messages: [],
-            ContentAvailable: false
-        })
-
-        global.clearInterval = jest.fn();
-
-        const wrapper = shallow(<MovieSettings/>);
-        wrapper.instance().updateStatus();
-
-        // expect the refresh interval to be cleared
-        expect(global.clearInterval).toBeCalledTimes(1);
-
-        // expect startbtn to be reenabled
-        expect(wrapper.state()).toMatchObject({startbtnDisabled: false});
-    });
-
-    it('test simulate gravity cleanup', () => {
-        // global.fetch = global.prepareFetchApi('mmi');
-        callAPIMock({})
-        const wrapper = shallow(<MovieSettings/>);
-        wrapper.instance().setState = jest.fn();
-
-        wrapper.find('button').findWhere(e => e.text() === 'Cleanup Gravity' && e.type() === 'button').simulate('click');
-
        // initial send of reindex request to server
        expect(callAPI).toBeCalledTimes(1);
-
-        expect(wrapper.instance().setState).toBeCalledTimes(1);
    });

-    it('expect insertion before existing ones', function () {
+    it('test simulate tvshow reindex', function () {
+        callAPIMock({success: true})
        const wrapper = shallow(<MovieSettings/>);

-        callAPIMock({
-            ContentAvailable: true,
-            Messages: ['test']
-        })
+        wrapper.find('button').findWhere(e => e.text() === 'TVShow Reindex' && e.type() === 'button').simulate('click');

-        wrapper.instance().updateStatus();
+        // initial send of reindex request to server
+        expect(callAPI).toBeCalledTimes(1);
+    });

-        expect(wrapper.state()).toMatchObject({
-            text: ['test']
-        });
+    it('test handlemessage ', function () {
+        const wrapper = shallow(<MovieSettings/>);
+        const func = jest.fn((str) => {})
+        wrapper.instance().appendLog = func
+        wrapper.instance().handleMessage('{"Action":"message", "Message":"testmsg"}')

-        // expect an untouched state if we try to add an empty string...
-        callAPIMock({
-            ContentAvailable: true,
-            Messages: ['']
-        })
+        expect(func).toHaveBeenCalledTimes(1);
+        expect(func).toHaveBeenLastCalledWith('testmsg')

-        wrapper.instance().updateStatus();
+        wrapper.setState({startbtnDisabled: false});

-        expect(wrapper.state()).toMatchObject({
-            text: ['', 'test']
-        });
+        // expect button to get disabled!
+        wrapper.instance().handleMessage('{"Action":"reindexAction", "Event":"start"}');
+        expect(wrapper.state().startbtnDisabled).toBeTruthy()
+
+        // expect button to get enabled
+        wrapper.instance().handleMessage('{"Action":"reindexAction", "Event":"stop"}');
+        expect(wrapper.state().startbtnDisabled).not.toBeTruthy()
+    });
+
+    it('test appendlog', function () {
+        const wrapper = shallow(<MovieSettings/>);
+
+        wrapper.instance().appendLog("testmsg");
+        expect(wrapper.state().text).toHaveLength(1)
+        expect(wrapper.state().text[0]).toBe('testmsg')
+
+        wrapper.instance().appendLog("testmsg2");
+        expect(wrapper.state().text).toHaveLength(2)
+        expect(wrapper.state().text[0]).toBe('testmsg2')
+        expect(wrapper.state().text[1]).toBe('testmsg')
    });
 });
--- a/src/pages/SettingsPage/MovieSettings.tsx
+++ b/src/pages/SettingsPage/MovieSettings.tsx
@@ -2,7 +2,6 @@ import React from 'react';
 import style from './MovieSettings.module.css';
 import {APINode, callAPI} from '../../utils/Api';
 import {GeneralSuccess} from '../../types/GeneralTypes';
-import {SettingsTypes} from '../../types/ApiTypes';

 interface state {
    text: string[];
@@ -11,13 +10,23 @@ interface state {

 interface Props {}

+interface MessageBase {
+    Action: string;
+}
+
+interface TextMessage extends MessageBase {
+    Message: string;
+}
+
+interface ReindexEvent extends MessageBase {
+    Event: string;
+}
+
 /**
 * Component for MovieSettings on Settingspage
 * handles settings concerning to movies in general
 */
 class MovieSettings extends React.Component<Props, state> {
-    myinterval: number = -1;
-
    constructor(props: Props) {
        super(props);

@@ -28,12 +37,64 @@ class MovieSettings extends React.Component<Props, state> {
    }

    componentDidMount(): void {
-        this.myinterval = window.setInterval(this.updateStatus, 1000);
+        // expectingMessage is set to true
+        this.dial();
    }

-    componentWillUnmount(): void {
-        if (this.myinterval !== -1) {
-            clearInterval(this.myinterval);
+    dial(): void {
+        console.log('trying to connect...');
+        // check which ws protocol we need
+        const wsProt = window.location.protocol === 'http:' ? 'ws' : 'wss';
+
+        const conn = new WebSocket(`${wsProt}://${window.location.host}/subscribe`);
+        conn.addEventListener('close', (ev) => {
+            this.appendLog(`WebSocket Disconnected code: ${ev.code}, reason: ${ev.reason}`, true);
+            if (ev.code !== 1001) {
+                this.appendLog('Reconnecting in 1s', true);
+                setTimeout((): void => this.dial(), 1000);
+            }
+        });
+        conn.addEventListener('open', (_ev) => {
+            console.info('websocket connected');
+        });
+
+        // This is where we handle messages received.
+        conn.addEventListener('message', (ev) => {
+            if (typeof ev.data !== 'string') {
+                console.error('unexpected message type', typeof ev.data);
+                return;
+            }
+            this.handleMessage(ev.data);
+        });
+    }
+
+    handleMessage(message: string): void {
+        const obj: MessageBase = JSON.parse(message);
+
+        if (obj.Action === 'message') {
+            const msg = obj as TextMessage;
+            this.appendLog(msg.Message);
+        } else if (obj.Action === 'reindexAction') {
+            const msg = obj as ReindexEvent;
+            if (msg.Event === 'start') {
+                this.setState({startbtnDisabled: true});
+            } else if (msg.Event === 'stop') {
+                this.setState({startbtnDisabled: false});
+            }
+        } else {
+            console.error('unexpected response from server: ' + message);
+        }
+    }
+
+    // appendLog appends the passed text to messageLog.
+    appendLog(text: string, error?: boolean): void {
+        this.setState({
+            // insert a string for each line
+            text: [text, ...this.state.text]
+        });
+
+        if (error) {
+            console.log('heyy err');
        }
    }

@@ -51,9 +112,9 @@ class MovieSettings extends React.Component<Props, state> {
                <button
                    className='btn btn-warning'
                    onClick={(): void => {
-                        this.cleanupGravity();
+                        this.startTVShowReindex();
                    }}>
-                    Cleanup Gravity
+                    TVShow Reindex
                </button>
                <div className={style.indextextarea}>
                    {this.state.text.map((m) => (
@@ -70,44 +131,15 @@ class MovieSettings extends React.Component<Props, state> {
     * starts the reindex process of the videos in the specified folder
     */
    startReindex(): void {
+        this.setState({text: []});
        // clear output text before start
-        this.setState({text: [], startbtnDisabled: true});
-
        callAPI(APINode.Settings, {action: 'startReindex'}, (result: GeneralSuccess): void => {
-            console.log(result);
            if (result.result === 'success') {
                console.log('started successfully');
-            } else {
-                console.log('error, reindex already running');
-                this.setState({startbtnDisabled: true});
            }
        });
-
-        if (this.myinterval !== -1) {
-            clearInterval(this.myinterval);
-        }
-        this.myinterval = window.setInterval(this.updateStatus, 1000);
    }

-    /**
-     * This interval function reloads the current status of reindexing from backend
-     */
-    updateStatus = (): void => {
-        callAPI(APINode.Settings, {action: 'getStatusMessage'}, (result: SettingsTypes.getStatusMessageType) => {
-            this.setState({
-                // insert a string for each line
-                text: [...result.Messages, ...this.state.text]
-            });
-            // todo 2020-07-4: scroll to bottom of div here
-            if (!result.ContentAvailable) {
-                // clear refresh interval if no content available
-                clearInterval(this.myinterval);
-
-                this.setState({startbtnDisabled: false});
-            }
-        });
-    };
-
    /**
     * send request to cleanup db gravity
     */
@@ -118,6 +150,15 @@ class MovieSettings extends React.Component<Props, state> {
            });
        });
    }
+
+    private startTVShowReindex(): void {
+        this.setState({text: []});
+        callAPI(APINode.Settings, {action: 'startTVShowReindex'}, (result: GeneralSuccess): void => {
+            if (result.result === 'success') {
+                console.log('started successfully');
+            }
+        });
+    }
 }

 export default MovieSettings;
--- a/src/pages/TVShowPage/EpisodePage.test.js
+++ b/src/pages/TVShowPage/EpisodePage.test.js
@@ -0,0 +1,43 @@
+import {shallow} from 'enzyme';
+import React from 'react';
+import {EpisodePage, EpisodeTile} from './EpisodePage';
+
+describe('<EpisodePage/>', function () {
+    it('renders without crashing ', function () {
+        const wrapper = shallow(<EpisodePage  history={{}} location={{}} match={{params: {id: 42}}}/>);
+        wrapper.unmount();
+    });
+
+    it('content showing when loaded', function () {
+        const wrapper = shallow(<EpisodePage  history={{}} location={{}} match={{params: {id: 42}}}/>);
+
+        expect(wrapper.find('DynamicContentContainer')).toHaveLength(0)
+
+        wrapper.setState({loaded: true});
+
+        expect(wrapper.find('DynamicContentContainer')).toHaveLength(1)
+    });
+});
+
+describe('<EpisodeTile/>', () => {
+    it('renders without crashing', function () {
+        const wrapper = shallow(<EpisodeTile  episode={{
+            ID: 0,
+            Name: 'testname',
+            Season: 0,
+            Episode: 0
+        }}/>);
+        wrapper.unmount();
+    });
+
+    it('renders text', function () {
+        const wrapper = shallow(<EpisodeTile  episode={{
+            ID: 0,
+            Name: 'testname',
+            Season: 0,
+            Episode: 0
+        }}/>);
+
+        expect(wrapper.findWhere(e => e.text() === 'testname')).toHaveLength(1)
+    });
+})
--- a/src/pages/TVShowPage/EpisodePage.tsx
+++ b/src/pages/TVShowPage/EpisodePage.tsx
@@ -0,0 +1,84 @@
+import * as React from 'react';
+import {RouteComponentProps} from 'react-router';
+import {withRouter} from 'react-router-dom';
+import {APINode, callAPI} from '../../utils/Api';
+import {Link} from 'react-router-dom';
+import DynamicContentContainer from '../../elements/DynamicContentContainer/DynamicContentContainer';
+import tileStyle from './EpisodeTile.module.css';
+import GlobalInfos from '../../utils/GlobalInfos';
+import {faPlay} from '@fortawesome/free-solid-svg-icons';
+import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
+import PageTitle, {Line} from '../../elements/PageTitle/PageTitle';
+import SideBar, {SideBarItem, SideBarTitle} from '../../elements/SideBar/SideBar';
+
+interface Props extends RouteComponentProps<{id: string}> {}
+
+interface State {
+    loaded: boolean;
+}
+
+interface Episode {
+    ID: number;
+    Name: string;
+    Season: number;
+    Episode: number;
+}
+
+export class EpisodePage extends React.Component<Props, State> {
+    episodes: Episode[] = [];
+
+    state = {
+        loaded: false
+    };
+
+    componentDidMount(): void {
+        callAPI(APINode.TVShow, {action: 'getEpisodes', ShowID: parseInt(this.props.match.params.id, 10)}, (episodes: Episode[]) => {
+            this.episodes = episodes;
+            this.setState({loaded: true});
+        });
+    }
+
+    render(): JSX.Element {
+        if (!this.state.loaded) {
+            return <>loading...</>;
+        }
+
+        return (
+            <>
+                <PageTitle title='TV Shows' subtitle='' />
+                <SideBar>
+                    <SideBarTitle>Infos:</SideBarTitle>
+                    <Line />
+                    <SideBarItem>
+                        <b>{this.episodes.length}</b> Episodes Total!
+                    </SideBarItem>
+                </SideBar>
+                <DynamicContentContainer
+                    renderElement={(el): JSX.Element => <EpisodeTile key={el.ID} episode={el} />}
+                    data={this.episodes}
+                    initialLoadNr={-1}
+                />
+            </>
+        );
+    }
+}
+
+export const EpisodeTile = (props: {episode: Episode}): JSX.Element => {
+    const themestyle = GlobalInfos.getThemeStyle();
+    return (
+        <Link to={'/tvplayer/' + props.episode.ID}>
+            <div className={tileStyle.tile + ' ' + themestyle.secbackground + ' ' + themestyle.textcolor}>
+                <FontAwesomeIcon
+                    style={{
+                        marginRight: '10px'
+                    }}
+                    icon={faPlay}
+                    size='1x'
+                />
+                Season: {props.episode.Season} Episode: {props.episode.Episode} {props.episode.Name}
+            </div>
+        </Link>
+    );
+};
+
+export default withRouter(EpisodePage);
--- a/src/pages/TVShowPage/EpisodeTile.module.css
+++ b/src/pages/TVShowPage/EpisodeTile.module.css
@@ -0,0 +1,15 @@
+.tile {
+    margin: 15px;
+    padding-top: 15px;
+    padding-bottom: 15px;
+    width: 50%;
+    padding-left: 15px;
+}
+
+.tile:hover {
+    opacity: 0.7;
+}
+
+.tile:hover svg {
+    color: dodgerblue;
+}
--- a/src/pages/TVShowPage/TVPlayer.test.js
+++ b/src/pages/TVShowPage/TVPlayer.test.js
@@ -0,0 +1,10 @@
+import {shallow} from 'enzyme';
+import {TVPlayer} from './TVPlayer';
+import React from 'react';
+
+describe('<TVPlayer/>', () => {
+    it('renders without crashing', function () {
+        const wrapper = shallow(<TVPlayer match={{params: {id: 42}}}/>);
+        wrapper.unmount();
+    });
+})
--- a/src/pages/TVShowPage/TVPlayer.tsx
+++ b/src/pages/TVShowPage/TVPlayer.tsx
@@ -0,0 +1,97 @@
+import * as React from 'react';
+import {RouteComponentProps} from 'react-router';
+import {withRouter} from 'react-router-dom';
+import PageTitle from '../../elements/PageTitle/PageTitle';
+import style from '../Player/Player.module.css';
+import {Plyr} from 'plyr-react';
+import plyrstyle from 'plyr-react/dist/plyr.css';
+import {DefaultPlyrOptions} from '../../types/GeneralTypes';
+import {APINode, callAPI} from '../../utils/Api';
+import GlobalInfos from '../../utils/GlobalInfos';
+import PlyrJS from 'plyr';
+
+interface Props extends RouteComponentProps<{id: string}> {}
+
+interface State {
+    loaded: boolean;
+}
+
+interface EpisodeData {
+    Name: string;
+    Season: number;
+    Episode: number;
+    TVShowID: number;
+    Path: string;
+}
+
+export class TVPlayer extends React.Component<Props, State> {
+    state = {
+        loaded: false
+    };
+
+    data: EpisodeData | null = null;
+
+    componentDidMount(): void {
+        this.loadVideo();
+    }
+
+    loadVideo(): void {
+        callAPI(
+            APINode.TVShow,
+            {
+                action: 'loadEpisode',
+                ID: parseInt(this.props.match.params.id, 10)
+            },
+            (data: EpisodeData) => {
+                console.log(data);
+                this.data = data;
+                this.setState({loaded: true});
+            }
+        );
+    }
+
+    assemblePlyrObject(): JSX.Element {
+        if (this.state.loaded && this.data !== null) {
+            const sources: PlyrJS.SourceInfo = {
+                type: 'video',
+                sources: [
+                    {
+                        src:
+                            (process.env.REACT_APP_CUST_BACK_DOMAIN ? process.env.REACT_APP_CUST_BACK_DOMAIN : '') +
+                            GlobalInfos.getTVShowPath() +
+                            this.data.Path,
+                        type: 'video/mp4',
+                        size: 1080
+                    }
+                ],
+                poster: ''
+            };
+
+            return <Plyr style={plyrstyle} source={sources} options={DefaultPlyrOptions} />;
+        } else {
+            return <div>not loaded yet</div>;
+        }
+    }
+
+    render(): JSX.Element {
+        return (
+            <div id='videocontainer'>
+                <PageTitle title='Watch' subtitle='todo' />
+
+                <div className={style.videowrapper}>
+                    {/* video component is added here */}
+                    {this.assemblePlyrObject()}
+                </div>
+                <button className={style.closebutton} onClick={(): void => this.closebtn()}>
+                    Close
+                </button>
+            </div>
+        );
+    }
+
+    private closebtn(): void {
+        this.props.history.goBack();
+    }
+}
+
+export default withRouter(TVPlayer);
--- a/src/pages/TVShowPage/TVShowPage.test.js
+++ b/src/pages/TVShowPage/TVShowPage.test.js
@@ -0,0 +1,10 @@
+import {shallow} from 'enzyme';
+import {TVShowPage} from './TVShowPage';
+import React from 'react';
+
+describe('<TVShowPage/>', () => {
+    it('renders without crashing', function () {
+        const wrapper = shallow(<TVShowPage />);
+        wrapper.unmount();
+    });
+})
--- a/src/pages/TVShowPage/TVShowPage.tsx
+++ b/src/pages/TVShowPage/TVShowPage.tsx
@@ -0,0 +1,83 @@
+import React from 'react';
+import Preview from '../../elements/Preview/Preview';
+import {APINode, callAPI, callAPIPlain} from '../../utils/Api';
+import {TVShow} from '../../types/ApiTypes';
+import DynamicContentContainer from '../../elements/DynamicContentContainer/DynamicContentContainer';
+import {Route, Switch, useRouteMatch} from 'react-router-dom';
+import EpisodePage from './EpisodePage';
+import PageTitle, {Line} from '../../elements/PageTitle/PageTitle';
+import SideBar, {SideBarItem, SideBarTitle} from '../../elements/SideBar/SideBar';
+
+interface State {
+    loading: boolean;
+}
+
+interface Props {}
+
+export class TVShowPage extends React.Component<Props, State> {
+    state = {
+        loading: true
+    };
+
+    data: TVShow.TVshowType[] = [];
+
+    componentDidMount(): void {
+        callAPI(APINode.TVShow, {action: 'getTVShows'}, (resp: TVShow.TVshowType[]) => {
+            this.data = resp;
+            this.setState({loading: false});
+        });
+    }
+
+    render(): JSX.Element {
+        return (
+            <>
+                <PageTitle title='TV Shows' subtitle='' />
+                <SideBar>
+                    <SideBarTitle>Infos:</SideBarTitle>
+                    <Line />
+                    <SideBarItem>
+                        <b>{this.data.length}</b> TV-Shows Total!
+                    </SideBarItem>
+                </SideBar>
+                <div>
+                    <DynamicContentContainer
+                        renderElement={(elem): JSX.Element => (
+                            <Preview
+                                key={elem.Id}
+                                name={elem.Name}
+                                picLoader={(callback: (pic: string) => void): void => {
+                                    callAPIPlain(
+                                        APINode.TVShow,
+                                        {
+                                            action: 'readThumbnail',
+                                            Id: elem.Id
+                                        },
+                                        (result) => callback(result)
+                                    );
+                                }}
+                                linkPath={'/tvshows/' + elem.Id}
+                            />
+                        )}
+                        data={this.state.loading ? [] : this.data}
+                        initialLoadNr={20}
+                    />
+                </div>
+            </>
+        );
+    }
+}
+
+export default function (): JSX.Element {
+    let match = useRouteMatch();
+
+    return (
+        <Switch>
+            <Route path={`${match.path}/:id`}>
+                <EpisodePage />
+            </Route>
+            <Route path={match.path}>
+                <TVShowPage />
+            </Route>
+        </Switch>
+    );
+}
--- a/src/setupTests.js
+++ b/src/setupTests.js
@@ -6,7 +6,8 @@ import '@testing-library/jest-dom/extend-expect';

 import {configure} from 'enzyme';
 import Adapter from 'enzyme-adapter-react-16';
-import GlobalInfos from './utils/GlobalInfos';
+import {CookieTokenStore} from "./utils/TokenStore/CookieTokenStore";
+import {token} from "./utils/TokenHandler";

 configure({adapter: new Adapter()});

@@ -44,6 +45,7 @@ global.callAPIMock = (resonse) => {
 global.beforeEach(() => {
    // empty fetch response implementation for each test
    global.fetch = prepareFetchApi({});
+    token.init(new CookieTokenStore());
    // todo with callAPIMock
 });

--- a/src/types/ApiTypes.ts
+++ b/src/types/ApiTypes.ts
@@ -35,6 +35,7 @@ export namespace SettingsTypes {
        Password: boolean;
        MediacenterName: string;
        VideoPath: string;
+        TVShowPath: string;
    }

    export interface loadGeneralSettingsType {
@@ -58,6 +59,16 @@ export namespace SettingsTypes {
    }
 }

+export namespace TVShow {
+    /**
+     * result of actor fetch
+     */
+    export interface TVshowType {
+        Id: number;
+        Name: string;
+    }
+}
+
 export namespace ActorTypes {
    /**
     * result of actor fetch
--- a/src/types/GeneralTypes.ts
+++ b/src/types/GeneralTypes.ts
@@ -1,4 +1,5 @@
 import {TagType} from './VideoTypes';
+import PlyrJS from 'plyr';

 export interface GeneralSuccess {
    result: string;
@@ -14,3 +15,20 @@ export const DefaultTags: TagarrayType = {
    lowq: {TagId: 3, TagName: 'lowquality'},
    hd: {TagId: 4, TagName: 'hd'}
 };
+
+export const DefaultPlyrOptions: PlyrJS.Options = {
+    controls: [
+        'play-large', // The large play button in the center
+        'play', // Play/pause playback
+        'progress', // The progress bar and scrubber for playback and buffering
+        'current-time', // The current time of playback
+        'duration', // The full duration of the media
+        'mute', // Toggle mute
+        'volume', // Volume control
+        'captions', // Toggle captions
+        'settings', // Settings menu
+        'airplay', // Airplay (currently Safari only)
+        'download', // Show a download button with a link to either the current source or a custom URL you specify in your options
+        'fullscreen' // Toggle fullscreen
+    ]
+};
--- a/src/utils/Api.ts
+++ b/src/utils/Api.ts
@@ -1,4 +1,5 @@
 import GlobalInfos from './GlobalInfos';
+import {token} from './TokenHandler';

 const APIPREFIX: string = '/api/';

@@ -11,169 +12,6 @@ interface ApiBaseRequest {
    [_: string]: string | number | boolean | object;
 }

-// store api token - empty if not set
-let apiToken = '';
-
-// a callback que to be called after api token refresh
-let callQue: ((error: string) => void)[] = [];
-// flag to check wheter a api refresh is currently pending
-let refreshInProcess = false;
-// store the expire seconds of token
-let expireSeconds = -1;
-
-/**
- * refresh the api token or use that one in cookie if still valid
- * @param callback to be called after successful refresh
- * @param password
- * @param force
- */
-export function refreshAPIToken(callback: (error: string) => void, force?: boolean, password?: string): void {
-    callQue.push(callback);
-
-    // check if already is a token refresh is in process
-    if (refreshInProcess) {
-        // if yes return
-        return;
-    } else {
-        // if not set flat
-        refreshInProcess = true;
-    }
-
-    if (apiTokenValid() && !force) {
-        console.log('token still valid...');
-        callFuncQue('');
-        return;
-    }
-
-    const formData = new FormData();
-    formData.append('grant_type', 'client_credentials');
-    formData.append('client_id', 'openmediacenter');
-    formData.append('client_secret', password ? password : 'openmediacenter');
-    formData.append('scope', 'all');
-
-    interface APIToken {
-        error?: string;
-        // eslint-disable-next-line camelcase
-        access_token: string; // no camel case allowed because of backendlib
-        // eslint-disable-next-line camelcase
-        expires_in: number; // no camel case allowed because of backendlib
-        scope: string;
-        // eslint-disable-next-line camelcase
-        token_type: string; // no camel case allowed because of backendlib
-    }
-
-    fetch('/token', {method: 'POST', body: formData}).then((response) =>
-        response.json().then((result: APIToken) => {
-            if (result.error) {
-                callFuncQue(result.error);
-                return;
-            }
-            console.log(result);
-            // set api token
-            apiToken = result.access_token;
-            // set expire time
-            expireSeconds = new Date().getTime() / 1000 + result.expires_in;
-            setTokenCookie(apiToken, expireSeconds);
-            // call all handlers and release flag
-            callFuncQue('');
-        })
-    );
-}
-
-export function apiTokenValid(): boolean {
-    // check if a cookie with token is available
-    const token = getTokenCookie();
-    if (token !== null) {
-        // check if token is at least valid for the next minute
-        if (token.expire > new Date().getTime() / 1000 + 60) {
-            apiToken = token.token;
-            expireSeconds = token.expire;
-
-            return true;
-        }
-    }
-    return false;
-}
-
-/**
- * call all qued callbacks
- */
-function callFuncQue(error: string): void {
-    // call all pending handlers
-    callQue.map((func) => {
-        return func(error);
-    });
-    // reset pending que
-    callQue = [];
-    // release flag to be able to start new refresh
-    refreshInProcess = false;
-}
-
-/**
- * set the cookie for the currently gotten token
- * @param token token string
- * @param validSec second time when the token will be invalid
- */
-function setTokenCookie(token: string, validSec: number): void {
-    let d = new Date();
-    d.setTime(validSec * 1000);
-    console.log('token set' + d.toUTCString());
-    let expires = 'expires=' + d.toUTCString();
-    document.cookie = 'token=' + token + ';' + expires + ';path=/';
-    document.cookie = 'token_expire=' + validSec + ';' + expires + ';path=/';
-}
-
-/**
- * get all required cookies for the token
- */
-function getTokenCookie(): {token: string; expire: number} | null {
-    const token = decodeCookie('token');
-    const expireInString = decodeCookie('token_expire');
-    const expireIn = parseInt(expireInString, 10);
-
-    if (expireIn !== 0 && token !== '') {
-        return {token: token, expire: expireIn};
-    } else {
-        return null;
-    }
-}
-
-/**
- * decode a simple cookie with key specified
- * @param key cookie key
- */
-function decodeCookie(key: string): string {
-    let name = key + '=';
-    let decodedCookie = decodeURIComponent(document.cookie);
-    let ca = decodedCookie.split(';');
-    for (let i = 0; i < ca.length; i++) {
-        let c = ca[i];
-        while (c.charAt(0) === ' ') {
-            c = c.substring(1);
-        }
-        if (c.indexOf(name) === 0) {
-            return c.substring(name.length, c.length);
-        }
-    }
-    return '';
-}
-
-/**
- * check if api token is valid -- if not request new one
- * when finished call callback
- * @param callback function to be called afterwards
- */
-function checkAPITokenValid(callback: () => void): void {
-    // check if token is valid and set
-    if (apiToken === '' || expireSeconds <= new Date().getTime() / 1000) {
-        refreshAPIToken(() => {
-            callback();
-        });
-    } else {
-        callback();
-    }
-}
-
 /**
 * A backend api call
 * @param apinode which api backend handler to call
@@ -187,14 +25,13 @@ export function callAPI<T>(
    callback: (_: T) => void,
    errorcallback: (_: string) => void = (_: string): void => {}
 ): void {
-    checkAPITokenValid(() => {
-        console.log(apiToken);
+    token.checkAPITokenValid((mytoken) => {
        fetch(APIPREFIX + apinode, {
            method: 'POST',
            body: JSON.stringify(fd),
            headers: new Headers({
                'Content-Type': 'application/json',
-                Authorization: 'Bearer ' + apiToken
+                Authorization: 'Bearer ' + mytoken
            })
        })
            .then((response) => {
@@ -254,13 +91,13 @@ export function callApiUnsafe<T>(
 * @param callback the callback with PLAIN text reply from backend
 */
 export function callAPIPlain(apinode: APINode, fd: ApiBaseRequest, callback: (_: string) => void): void {
-    checkAPITokenValid(() => {
+    token.checkAPITokenValid((mytoken) => {
        fetch(APIPREFIX + apinode, {
            method: 'POST',
            body: JSON.stringify(fd),
            headers: new Headers({
                'Content-Type': 'application/json',
-                Authorization: 'Bearer ' + apiToken
+                Authorization: 'Bearer ' + mytoken
            })
        }).then((response) =>
            response.text().then((result) => {
@@ -280,5 +117,5 @@ export enum APINode {
    Tags = 'tags',
    Actor = 'actor',
    Video = 'video',
-    Init = 'init'
+    TVShow = 'tvshow'
 }
--- a/src/utils/GlobalInfos.ts
+++ b/src/utils/GlobalInfos.ts
@@ -8,6 +8,7 @@ import lighttheme from '../AppLightTheme.module.css';
 class StaticInfos {
    private darktheme: boolean = true;
    private videopath: string = '';
+    private tvshowpath: string = '';

    /**
     * check if the current theme is the dark theme
@@ -26,7 +27,7 @@ class StaticInfos {

        // trigger onThemeChange handlers
        this.handlers.map((func) => {
-            return func();
+            func();
        });
    }

@@ -47,8 +48,9 @@ class StaticInfos {
     * set the current videopath
     * @param vidpath videopath with beginning and ending slash
     */
-    setVideoPath(vidpath: string): void {
+    setVideoPaths(vidpath: string, tvshowpath: string): void {
        this.videopath = vidpath;
+        this.tvshowpath = tvshowpath;
    }

    /**
@@ -58,6 +60,13 @@ class StaticInfos {
        return this.videopath;
    }

+    /**
+     * return the current tvshow path
+     */
+    getTVShowPath(): string {
+        return this.tvshowpath;
+    }
+
    /**
     * load the Password page manually
     */
--- a/src/utils/TokenHandler.ts
+++ b/src/utils/TokenHandler.ts
@@ -0,0 +1,135 @@
+import {TokenStore} from './TokenStore/TokenStore';
+
+export namespace token {
+    // store api token - empty if not set
+    let apiToken = '';
+
+    // a callback que to be called after api token refresh
+    let callQue: ((error: string) => void)[] = [];
+    // flag to check wheter a api refresh is currently pending
+    let refreshInProcess = false;
+    // store the expire seconds of token
+    let expireSeconds = -1;
+
+    let tokenStore: TokenStore;
+    let APiHost: string = '/';
+
+    export function init(ts: TokenStore, apiHost?: string): void {
+        tokenStore = ts;
+        if (apiHost) {
+            APiHost = apiHost;
+        }
+    }
+
+    /**
+     * refresh the api token or use that one in cookie if still valid
+     * @param callback to be called after successful refresh
+     * @param password
+     * @param force
+     */
+    export function refreshAPIToken(callback: (error: string) => void, force?: boolean, password?: string): void {
+        callQue.push(callback);
+
+        // check if already is a token refresh is in process
+        if (refreshInProcess) {
+            // if yes return
+            return;
+        } else {
+            // if not set flat
+            refreshInProcess = true;
+        }
+
+        if (apiTokenValid() && !force) {
+            console.log('token still valid...');
+            callFuncQue('');
+            return;
+        }
+
+        const formData = new FormData();
+        formData.append('grant_type', 'client_credentials');
+        formData.append('client_id', 'openmediacenter');
+        formData.append('client_secret', password ? password : 'openmediacenter');
+        formData.append('scope', 'all');
+
+        interface APIToken {
+            error?: string;
+            // eslint-disable-next-line camelcase
+            access_token: string; // no camel case allowed because of backendlib
+            // eslint-disable-next-line camelcase
+            expires_in: number; // no camel case allowed because of backendlib
+            scope: string;
+            // eslint-disable-next-line camelcase
+            token_type: string; // no camel case allowed because of backendlib
+        }
+
+        console.log(APiHost);
+
+        fetch(APiHost + 'token', {method: 'POST', body: formData})
+            .then((response) =>
+                response.json().then((result: APIToken) => {
+                    if (result.error) {
+                        callFuncQue(result.error);
+                        return;
+                    }
+                    // set api token
+                    apiToken = result.access_token;
+                    // set expire time
+                    expireSeconds = new Date().getTime() / 1000 + result.expires_in;
+                    // setTokenCookie(apiToken, expireSeconds);
+                    tokenStore.setToken({accessToken: apiToken, expireTime: expireSeconds, tokenType: '', scope: ''});
+                    // call all handlers and release flag
+                    callFuncQue('');
+                })
+            )
+            .catch((e) => {
+                callback(e);
+            });
+    }
+
+    export function apiTokenValid(): boolean {
+        // check if a cookie with token is available
+        // const token = getTokenCookie();
+        const tmptoken = tokenStore.loadToken();
+        if (tmptoken !== null) {
+            // check if token is at least valid for the next minute
+            if (tmptoken.expireTime > new Date().getTime() / 1000 + 60) {
+                apiToken = tmptoken.accessToken;
+                expireSeconds = tmptoken.expireTime;
+
+                return true;
+            }
+        }
+        return false;
+    }
+
+    /**
+     * call all qued callbacks
+     */
+    function callFuncQue(error: string): void {
+        // call all pending handlers
+        callQue.map((func) => {
+            return func(error);
+        });
+        // reset pending que
+        callQue = [];
+        // release flag to be able to start new refresh
+        refreshInProcess = false;
+    }
+
+    /**
+     * check if api token is valid -- if not request new one
+     * when finished call callback
+     * @param callback function to be called afterwards
+     */
+    export function checkAPITokenValid(callback: (mytoken: string) => void): void {
+        // check if token is valid and set
+        if (apiToken === '' || expireSeconds <= new Date().getTime() / 1000) {
+            console.log('token not valid...');
+            refreshAPIToken(() => {
+                callback(apiToken);
+            });
+        } else {
+            callback(apiToken);
+        }
+    }
+}
--- a/src/utils/TokenStore/CookieTokenStore.ts
+++ b/src/utils/TokenStore/CookieTokenStore.ts
@@ -0,0 +1,48 @@
+import {Token, TokenStore} from './TokenStore';
+
+export class CookieTokenStore extends TokenStore {
+    loadToken(): Token | null {
+        const token = this.decodeCookie('token');
+        const expireInString = this.decodeCookie('token_expire');
+        const expireIn = parseInt(expireInString, 10);
+
+        if (expireIn !== 0 && token !== '') {
+            return {accessToken: token, expireTime: expireIn, scope: '', tokenType: ''};
+        } else {
+            return null;
+        }
+    }
+
+    /**
+     * set the cookie for the currently gotten token
+     * @param token the token to set
+     */
+    setToken(token: Token): void {
+        let d = new Date();
+        d.setTime(token.expireTime * 1000);
+        console.log('token set' + d.toUTCString());
+        let expires = 'expires=' + d.toUTCString();
+        document.cookie = 'token=' + token.accessToken + ';' + expires + ';path=/';
+        document.cookie = 'token_expire=' + token.expireTime + ';' + expires + ';path=/';
+    }
+
+    /**
+     * decode a simple cookie with key specified
+     * @param key cookie key
+     */
+    decodeCookie(key: string): string {
+        let name = key + '=';
+        let decodedCookie = decodeURIComponent(document.cookie);
+        let ca = decodedCookie.split(';');
+        for (let i = 0; i < ca.length; i++) {
+            let c = ca[i];
+            while (c.charAt(0) === ' ') {
+                c = c.substring(1);
+            }
+            if (c.indexOf(name) === 0) {
+                return c.substring(name.length, c.length);
+            }
+        }
+        return '';
+    }
+}
--- a/src/utils/TokenStore/TokenStore.ts
+++ b/src/utils/TokenStore/TokenStore.ts
@@ -0,0 +1,11 @@
+export interface Token {
+    accessToken: string;
+    expireTime: number; // second time when token will be invalidated
+    scope: string;
+    tokenType: string;
+}
+
+export abstract class TokenStore {
+    abstract loadToken(): Token | null;
+    abstract setToken(token: Token): void;
+}
Author	SHA1	Message	Date
lukas	ef5bc2f597	extract thubnail picture size from raw bytes in backend	2021-05-12 23:29:47 +02:00
lukas	da07dc04bd	load videopath from backend correctly redirect to login page if login fails	2021-05-09 19:38:59 +02:00
lukas	f7705aef98	fix failing tests	2021-05-08 16:38:01 +02:00
lukas	b13a10f37b	outsource Token namespace in seperate file to release dependency to GlobalInfos	2021-05-08 15:19:13 +02:00
lukas	0797632c44	abstract tokenstore to support different storage methods of tokenstore	2021-05-07 17:31:35 +02:00
lukas	ab02a49b8f	fix wrong ws protocol on https	2021-05-01 17:38:12 +02:00
Lukas Heiligenbrunner	7f89392b30	Merge branch 'tvshowspage' into 'master' new tvshowspage Closes #37, #23, and #17 See merge request lukas/openmediacenter!45	2021-05-01 14:38:58 +00:00
lukas	5295f0b182	add go unit test send status messages when tvshow reindexing	2021-05-01 16:25:32 +02:00
lukas	d6fd2cbd9c	add some MovieSettings unit tests	2021-05-01 15:57:58 +02:00
lukas	5fac3a0780	add some unit tests	2021-05-01 15:18:38 +02:00
lukas	4ae9f27902	add some unit tests pretify episodepage	2021-04-28 17:31:38 +02:00
lukas	8c44a931de	some reformattings remove test code from main	2021-04-23 21:37:57 +02:00
lukas	d952538f0a	implement thubnail loading from tmdb fix lots of errors if ' char occurs in path strings correct reverse proxy for websocket	2021-04-23 21:23:51 +02:00
lukas	f72a3e5fb4	add a new TVPlayer component, add tv episode path to db	2021-04-22 20:31:36 +02:00
lukas	c30c193ce0	fix failing tests / remove obsolente ones add basic structure of episode page	2021-04-20 21:17:34 +02:00
lukas	6d41b86120	new logo, partly implement tvshow reindex * add tvshow to db * add episodes to db new route switcher for tvshows	2021-04-19 20:31:56 +02:00
lukas	5656428de7	implement websocket to send reindex messages	2021-04-18 21:16:38 +02:00
lukas	32c7e8a01b	rename file	2021-04-16 22:48:41 +02:00
lukas	4539147208	add tvshow syntax to db basic tvshow api request to show available tvshows limit randompage videos to 3 improve settings object to remove one useless copy	2021-04-16 22:44:56 +02:00
lukas	fdcecb0a75	* no unauthorized init * more dynamic Preview element	2021-04-16 21:12:56 +02:00
lukas	57a7a9a827	abstract dynamic video tile load within new dynamicloader class to allow to load other elements dynamically.	2021-04-16 18:20:39 +02:00
lukas	dfd92b1730	new tvshowspage	2021-04-09 12:59:28 +02:00