Moved the videos into a carousel and outside of the accordion on the movies page

src/Ombi/Attributes/WizardActionFilter.cs

@@ -0,0 +1,26 @@
+using Microsoft.AspNetCore.Mvc;
+using Microsoft.AspNetCore.Mvc.Filters;
+using Microsoft.Extensions.DependencyInjection;
+using Ombi.Core.Settings;
+using Ombi.Settings.Settings.Models;
+using System.Threading.Tasks;
+
+namespace Ombi.Attributes
+{
+    public class WizardActionFilter : IAsyncActionFilter
+    {
+        public async Task OnActionExecutionAsync(ActionExecutingContext context, ActionExecutionDelegate next)
+        {
+            var settingsService = context.HttpContext.RequestServices.GetRequiredService<ISettingsService<OmbiSettings>>();
+
+            var settings = await settingsService.GetSettingsAsync();
+
+            if (!settings.Wizard)
+            {
+                await next();
+                return;
+            }
+            context.Result = new UnauthorizedResult();
+        }
+    }
+}

src/Ombi/ClientApp/src/app/media-details/components/movie/movie-details.component.html

@@ -125,6 +125,23 @@
                         </div>
                     </div>
 
+                    <!-- <div class="row card-spacer" *ngIf="movie.videos?.results?.length > 0">
+
+                        <div class="col-md-6" *ngFor="let video of movie.videos?.results">
+                            <iframe width="100%" height="315px" [src]="'https://www.youtube.com/embed/' + video.key | safe" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+                        </div>
+                    </div> -->
+
+                    <div class="row" *ngIf="movie.videos?.results?.length > 0">
+                        <div class="col-12">
+                            <p-carousel class="no-indicator" [numVisible]="10" [numScroll]="10" [page]="0" [value]="movie.videos?.results">
+                                <ng-template let-result pTemplate="item">
+                                    <iframe width="98%" height="100%" [src]="'https://www.youtube.com/embed/' + result.key | safe" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+                                </ng-template>
+                            </p-carousel>
+                        </div>
+                    </div>
+
                     <div class="row">
                         <div class="col-12">
                             <div class="issuesPanel">
@@ -172,20 +189,6 @@
                                         </div>
                                     </div>
                                 </mat-expansion-panel>
-                                <mat-expansion-panel>
-                                    <mat-expansion-panel-header>
-                                        <mat-panel-title>
-                                            {{'MediaDetails.VideosTitle' | translate}}
-                                        </mat-panel-title>
-                                    </mat-expansion-panel-header>
-
-                                    <div class="row card-spacer" *ngIf="movie.videos?.results?.length > 0">
-
-                                        <div class="col-md-6" *ngFor="let video of movie.videos?.results">
-                                            <iframe width="100%" height="315px" [src]="'https://www.youtube.com/embed/' + video.key | safe" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
-                                        </div>
-                                    </div>
-                                </mat-expansion-panel>
                             </mat-accordion>
                         </div>
                     </div>

src/Ombi/ClientApp/src/app/media-details/media-details.component.scss

@@ -255,3 +255,7 @@
     border: 1px solid #00a4dc;
     color: #00a4dc;
 }
+
+::ng-deep .p-carousel-indicators {
+    display: none !important;
+    }

src/Ombi/ClientApp/src/styles/primeng-overrides.scss

@@ -9,10 +9,10 @@
 
 .ui-carousel-viewport {
     border:0 !important;
-    background-color:transparent !important; 
+    background-color:transparent !important;
 }
 
 .ui-carousel .ui-carousel-header {
     background-color:transparent !important;
-    border: 0 !important; 
-}
+    border: 0 !important;
+}

src/Ombi/Controllers/V2/WizardController.cs

@@ -0,0 +1,35 @@
+using Microsoft.AspNetCore.Authorization;
+using Microsoft.AspNetCore.Mvc;
+using Microsoft.AspNetCore.Mvc.Filters;
+using Microsoft.Extensions.DependencyInjection;
+using Ombi.Attributes;
+using Ombi.Core.Settings;
+using Ombi.Settings.Settings.Models;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Threading.Tasks;
+
+namespace Ombi.Controllers.V2
+{
+    [ServiceFilter(typeof(WizardActionFilter))]
+    [AllowAnonymous]
+    public class WizardController : V2Controller
+    {
+
+        private ISettingsService<OmbiSettings> _ombiSettings { get; }
+        
+
+        [HttpGet]
+        public IActionResult Ok()
+        {
+            return Ok();
+        }
+
+
+
+
+    }
+
+
+}

src/Ombi/Startup.cs

@@ -30,6 +30,7 @@ using Newtonsoft.Json;
 using ILogger = Serilog.ILogger;
 using Microsoft.AspNetCore.Diagnostics.HealthChecks;
 using Ombi.HealthChecks;
+using Ombi.Attributes;
 
 namespace Ombi
 {
@@ -97,6 +98,7 @@ namespace Ombi
             services.RegisterApplicationDependencies(); // Ioc and EF
             services.AddSwagger();
             services.AddAppSettingsValues(Configuration);
+            services.AddScoped<WizardActionFilter>();
 
             services.AddCors(o => o.AddPolicy("MyPolicy", builder =>
             {