@inherits Dynamicweb.Rendering.ViewModelTemplate<Dynamicweb.Frontend.ParagraphViewModel>
@using Dynamicweb.Frontend

@if (Model.Item.TryGetItems("Items", out IList<ItemViewModel> items)) {
    AddStylesheet("/Files/Templates/Designs/Swift-v2/Assets/lib/swiffy-slider/dist/css/swiffy-slider.min.css");
    AddScript("/Files/Templates/Designs/Swift-v2/Assets/lib/swiffy-slider/dist/js/swiffy-slider.min.js");

    <div id="Slider_@Model.ID" class="
        swiffy-slider  
        slider-item-reveal  
        slider-nav-round 
        slider-nav-sm
        slider-nav-page 
        slider-indicators-sm
        slider-indicators-round 
        slider-indicators-outside">
        
        <ul class="slider-container pb-4" style="--swiffy-slider-item-width: min(calc(100% - var(--swiffy-slider-item-reveal)), 25rem);">
            @foreach (var item in items)
            {
                <li>
                    <div class="card shadow h-100" style="min-height:25rem;">
                        @if (item.TryGetImageFile("Image", out ImageFileViewModel image)) {
                            <figure class="m-0">
                                <img class="card-img-top" src="@image.ToGetImage(new(){ Width = 600, Quality = 95, Ratio = "4/3" })" title="@image.Name">                            
                            </figure>
                        }
                        <div class="card-body d-flex flex-column justify-content-between">
                            <div data-swift-text class="mb-0-last-child">
                                @if (item.TryGetString("Title", out string title)) {
                                    @title
                                }
                                @if (item.TryGetString("Subtitle", out string subtitle)) {
                                    @subtitle
                                }
                                @if (item.TryGetString("Text", out string text)) {
                                    @text
                                }
                            </div>
                            <div>
                                @if (item.TryGetButton("Button", out ButtonViewModel button)) {
                                    <a href="@button.Link.Url" class="btn btn-@button.Style align-self-start" data-dw-button="@button.Style">@button.Label</a>
                                }
                            </div>
                        </div>
                    </div>
                </li>
            }
        </ul>

        <button type="button" title="@Translate("Previous slide")" class="slider-nav" style="z-index:1;">
            <span class="visually-hidden">@Translate("Previous slide")</span>
        </button>
        <button type="button" title="@Translate("Next slide")" class="slider-nav slider-nav-next" style="z-index:1;">
            <span class="visually-hidden">@Translate("Next slide")</span>
        </button>
        
        <ul class="slider-indicators mb-2">

            @for (int slideCount = 1; items.Count >= slideCount; slideCount++)
            {
                <li title='@Translate("Go to slide") @slideCount'>
                    <span class="visually-hidden">@Translate("Go to slide") @slideCount</span>
                </li>
            }
        </ul>
    </div>

    <script>
        window.swiffyslider.initSlider(document.querySelector('#Slider_@Model.ID'));
    </script>
}
