Work on the requests page mostly done.

RequestPlex.UI/Bootstrapper.cs

@@ -35,6 +35,7 @@ namespace RequestPlex.UI
 
 
             container.Register<ISettingsService<RequestPlexSettings>, SettingsServiceV2<RequestPlexSettings>>();
+            container.Register<IRepository<RequestedModel>, GenericRepository<RequestedModel>>();
 
 
 

RequestPlex.UI/Content/requests.js

@@ -0,0 +1,71 @@
+Handlebars.registerHelper('if_eq', function (a, b, opts) {
+    if (a == b)
+        return opts.fn(this);
+    else
+        return opts.inverse(this);
+});
+
+var searchSource = $("#search-template").html();
+var searchTemplate = Handlebars.compile(searchSource);
+var movieTimer = 0;
+var tvimer = 0;
+
+movieLoad();
+tvLoad();
+
+
+function movieLoad() {
+    $("#movieList").html("");
+
+    $.ajax("/requests/movies/").success(function (results) {
+        results.forEach(function (result) {
+            var context = buildMovieRequestContext(result);
+
+            var html = searchTemplate(context);
+            $("#movieList").append(html);
+        });
+    });
+};
+
+function tvLoad() {
+    $("#tvList").html("");
+
+    $.ajax("/requests/tvshows/").success(function (results) {
+        results.forEach(function (result) {
+            var context = buildTvShowRequestContext(result);
+            var html = searchTemplate(context);
+            $("#tvList").append(html);
+        });
+    });
+};
+
+function buildMovieRequestContext(result) {
+    var date = new Date(result.releaseDate);
+    var year = date.getFullYear();
+    var context = {
+        posterPath: result.posterPath,
+        id: result.tmdbid,
+        title: result.title,
+        overview: result.overview,
+        year: year,
+        type: "movie"
+    };
+
+    return context;
+}
+
+function buildTvShowRequestContext(result) {
+    var date = new Date(result.releaseDate);
+    var year = date.getFullYear();
+    var context = {
+        posterPath: result.posterPath,
+        id: result.tmdbid,
+        title: result.name,
+        overview: result.overview,
+        voteCount: result.voteCount,
+        voteAverage: result.voteAverage,
+        year: year,
+        type: "tv"
+    };
+    return context;
+}

RequestPlex.UI/Content/search.js

@@ -25,18 +25,15 @@ $("#tvSearchContent").keypress(function (e) {
 });
 
 $(document).on("click", ".dropdownTv", function (e) {
-    var formData = [];
+
     e.preventDefault();
     console.log(e.target.id);
     var $form = $('#form'+e.target.id);
     var data = $form.serialize();
     var seasons = $(this).attr("season-select");
     console.log(data);
-    formData.push(data);
     if (seasons === "1") {
-        formData.push("latest=true");
-    } else {
-        data.latest = false;
+        data = data + "&latest=true";
     }
 
     $.ajax({
@@ -60,7 +57,7 @@ $(document).on("click", ".dropdownTv", function (e) {
 
 });
 
-$(document).on("click", ".requesttv", function (e) {
+$(document).on("click", ".requestMovie", function (e) {
     e.preventDefault();
     console.log(e.target.id);
     var $form = $('#form' + e.target.id);
@@ -114,35 +111,3 @@ function tvSearch() {
     });
 };
 
-function buildMovieContext(result) {
-    var date = new Date(result.releaseDate);
-    var year = date.getFullYear();
-    var context = {
-        posterPath: result.posterPath,
-        id: result.id,
-        title: result.title,
-        overview: result.overview,
-        voteCount: result.voteCount,
-        voteAverage: result.voteAverage,
-        year: year,
-        type : "movie"
-    };
-
-    return context;
-}
-
-function buildTvShowContext(result) {
-    var date = new Date(result.firstAirDate);
-    var year = date.getFullYear();
-    var context = {
-        posterPath: result.posterPath,
-        id: result.id,
-        title: result.name,
-        overview: result.overview,
-        voteCount: result.voteCount,
-        voteAverage: result.voteAverage,
-        year: year,
-        type: "tv"
-    };
-    return context;
-}

RequestPlex.UI/Content/site.js

@@ -7,4 +7,37 @@
         // settings
         type: type
     });
-}
+}
+
+function buildMovieContext(result) {
+    var date = new Date(result.releaseDate);
+    var year = date.getFullYear();
+    var context = {
+        posterPath: result.posterPath,
+        id: result.id,
+        title: result.title,
+        overview: result.overview,
+        voteCount: result.voteCount,
+        voteAverage: result.voteAverage,
+        year: year,
+        type: "movie"
+    };
+
+    return context;
+}
+
+function buildTvShowContext(result) {
+    var date = new Date(result.firstAirDate);
+    var year = date.getFullYear();
+    var context = {
+        posterPath: result.posterPath,
+        id: result.id,
+        title: result.name,
+        overview: result.overview,
+        voteCount: result.voteCount,
+        voteAverage: result.voteAverage,
+        year: year,
+        type: "tv"
+    };
+    return context;
+}

RequestPlex.UI/Modules/IndexModule.cs

@@ -1,4 +1,6 @@
 using Nancy;
+using Nancy.Extensions;
+using Nancy.Responses;
 
 namespace RequestPlex.UI.Modules
 {
@@ -6,8 +8,8 @@ namespace RequestPlex.UI.Modules
     {
         public IndexModule()
         {
-            Get["/"] = parameters => View["Index"];
-            Get["/Index"] = parameters => View["Index"];
+            Get["/"] = parameters => Context.GetRedirect("~/search");
+            Get["/Index"] = parameters => Context.GetRedirect("~/search");
         }
     }
 }

RequestPlex.UI/Modules/RequestsModule.cs

@@ -1,28 +1,43 @@
-using Nancy;
+using System.Linq;
 
+using Nancy;
+using Nancy.Responses.Negotiation;
+
+using RequestPlex.Api;
 using RequestPlex.Core;
 using RequestPlex.Core.SettingModels;
+using RequestPlex.Store;
 
 namespace RequestPlex.UI.Modules
 {
     public class RequestsModule : NancyModule
     {
-        public RequestsModule(ISettingsService<RequestPlexSettings>  s)
+        private IRepository<RequestedModel> Service { get; set; }
+        public RequestsModule(IRepository<RequestedModel> service)
         {
-            Get["requests/"] = _ => "Hello!";
-            Get["requests/test"] = _ =>
-            {
-                var se = new RequestPlexSettings
-                {
-                    PlexAuthToken = "abc",
-                    Port = 2344,
-                    UserAuthentication = false
-                };
-                s.SaveSettings(se);
-                var a = s.GetSettings();
-                return "Hi!";
-            };
+            Service = service;
 
+            Get["requests/"] = _ => LoadRequests();
+            Get["requests/movies"] = _ => GetMovies();
+            Get["requests/tvshows"] = _ => GetTvShows();
+        }
+
+
+        private Negotiator LoadRequests()
+        {
+            return View["Requests/Index"];
+        }
+
+        private Response GetMovies()
+        {
+            var dbMovies = Service.GetAll().Where(x => x.Type == RequestType.Movie);
+            return Response.AsJson(dbMovies);
+        }
+
+        private Response GetTvShows()
+        {
+            var dbTv = Service.GetAll().Where(x => x.Type == RequestType.TvShow);
+            return Response.AsJson(dbTv);
         }
     }
 }

RequestPlex.UI/Modules/SearchModule.cs

@@ -86,10 +86,17 @@ namespace RequestPlex.UI.Modules
             {
                 return Response.AsJson(new { Result = false, Message = "Movie has already been requested!" });
             }
+            
             s.AddRequest(movieId, RequestType.Movie);
             return Response.AsJson(new { Result = true });
         }
 
+        /// <summary>
+        /// Requests the tv show.
+        /// </summary>
+        /// <param name="showId">The show identifier.</param>
+        /// <param name="latest">if set to <c>true</c> [latest].</param>
+        /// <returns></returns>
         private Response RequestTvShow(int showId, bool latest)
         {
             // Latest send to Sonarr and no need to store in DB

RequestPlex.UI/RequestPlex.UI.csproj

@@ -138,6 +138,9 @@
     <Content Include="Content\jquery-2.2.1.min.js">
       <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
     </Content>
+    <Content Include="Content\requests.js">
+      <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
+    </Content>
     <Content Include="Content\site.js">
       <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
     </Content>
@@ -189,6 +192,9 @@
     <Content Include="Views\Login\Register.cshtml">
       <CopyToOutputDirectory>Always</CopyToOutputDirectory>
     </Content>
+    <Content Include="Views\Requests\Index.cshtml">
+      <CopyToOutputDirectory>Always</CopyToOutputDirectory>
+    </Content>
     <None Include="Web.Debug.config">
       <DependentUpon>web.config</DependentUpon>
     </None>
@@ -198,7 +204,6 @@
   </ItemGroup>
   <ItemGroup>
     <Folder Include="Auth\" />
-    <Folder Include="Views\Requests\" />
   </ItemGroup>
   <ItemGroup>
     <ProjectReference Include="..\RequestPlex.Api\RequestPlex.Api.csproj">

RequestPlex.UI/Views/Admin/Settings.cshtml

@@ -2,7 +2,7 @@
 @{
     int port;
     var authToken = string.Empty;
-    if (Model.Port == null)
+    if (Model.Port == 0)
     {
         port = 3579;
     }

RequestPlex.UI/Views/Requests/Index.cshtml

@@ -0,0 +1,62 @@
+<div>
+    <h2>Requests</h2>
+    <!-- Nav tabs -->
+    <ul id="nav-tabs" class="nav nav-tabs" role="tablist">
+        <li role="presentation" class="active"><a href="#MoviesTab" aria-controls="home" role="tab" data-toggle="tab">Movies</a></li>
+        <li role="presentation"><a href="#TvShowTab" aria-controls="profile" role="tab" data-toggle="tab">TV Shows</a></li>
+
+    </ul>
+
+    <!-- Tab panes -->
+    <div class="tab-content">
+
+        <!-- Movie tab -->
+        <div role="tabpanel" class="tab-pane active" id="MoviesTab">
+           <br />
+            <br />
+            <!-- Movie content -->
+            <div id="movieList">
+            </div>
+        </div>
+
+        <!-- TV tab -->
+        <div role="tabpanel" class="tab-pane" id="TvShowTab">
+            <br />
+            <br />
+            <!-- TV content -->
+            <div id="tvList">
+            </div>
+        </div>
+    </div>
+
+</div>
+
+
+<script id="search-template" type="text/x-handlebars-template">
+    <div class="row">
+        <div class="col-sm-2">
+            {{#if posterPath}}
+            <img src="http://image.tmdb.org/t/p/w150/{{posterPath}}" alt="poster">
+            {{/if}}
+        </div>
+        <div class="col-sm-5 ">
+            <div>
+                <a href="https://www.themoviedb.org/{{type}}/{{id}}">
+                    <h4>{{title}} ({{year}})</h4>
+                </a>
+            </div>
+            <p>{{overview}}</p>
+        </div>
+        <div class="col-sm-2 col-sm-push-3">
+            <form method="POST" action="/search/request/{{type}}" id="form{{id}}">
+                <input name="{{type}}Id" type="text" value="{{id}}" hidden="hidden" />
+                <button id="{{id}}" style="text-align: right" class="btn btn-primary requestMovie" type="submit"><i class="fa fa-plus"></i> TestBtn</button>            
+            </form>
+        </div>
+
+    </div>
+    <hr />
+</script>
+
+
+<script src="/Content/requests.js" type="text/javascript"></script>

RequestPlex.UI/Views/Search/Index.cshtml

@@ -51,34 +51,37 @@
             <img src="http://image.tmdb.org/t/p/w150/{{posterPath}}" alt="poster">
             {{/if}}
         </div>
-        <div class="col-sm-5">
+        <div class="col-sm-5 ">
             <div>
                 <a href="https://www.themoviedb.org/{{type}}/{{id}}">
                     <h4>{{title}} ({{year}})</h4>
                 </a>
             </div>
-            <p>{{overview}}.</p>
+            <p>{{overview}}</p>
         </div>
-        <div class="col-sm-5">
-            <small>Vote Average: {{voteAverage}}</small>
-            <small>Vote Count: {{voteCount}}</small>
+        <div class="col-sm-2 col-sm-push-3">
             <form method="POST" action="/search/request/{{type}}" id="form{{id}}">
                 <input name="{{type}}Id" type="text" value="{{id}}" hidden="hidden" />
                 {{#if_eq type "movie"}}
-                <button id="{{id}}" style="text-align: right" class="btn btn-primary bottom-align-text requestMovie" type="submit"><i class="fa fa-plus"></i>Request</button>
+                <button id="{{id}}" style="text-align: right" class="btn btn-primary requestMovie" type="submit"><i class="fa fa-plus"></i> Request</button>
                 {{/if_eq}}
                 {{#if_eq type "tv"}}
                 <div class="dropdown">
-                    <button class="btn btn-primary bottom-align-text dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
-                        <i class="fa fa-plus"></i>Request
+                    <button class="btn btn-primary dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+                        <i class="fa fa-plus"></i> Request
                         <span class="caret"></span>
                     </button>
                     <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
-                        <li><a id="{{id}}" season-select="0" class="dropdownTv" href="#">All Seasons</a></li>
+                        <li><a id="{{id}}" season-select="0" class="dropdownTv " href="#">All Seasons</a></li>
                         <li><a id="{{id}}" season-select="1" class="dropdownTv" href="#">Latest Season</a></li>
                     </ul>
                 </div>
                 {{/if_eq}}
+                <br />
+                <br />
+                <br />
+                <small class="row">Vote Average: {{voteAverage}}</small>
+                <small class="row">Vote Count: {{voteCount}}</small>
             </form>
         </div>