@using Church.Net.Entity
@model List<Church.Net.Entity.NewVisitor>

@ViewBag.Title = "NLCC-歡迎新朋友";

<div class="ImageText-slider ">
    
    

    <div id=@($"ImageText-slider") name="ImageText-slider-generic" class="carousel slide carousel-fade">
        <!-- Indicators -->
        <ol class="carousel-indicators">
            @for (int i = 0; i < Model.Count(); i++)
            {
                <li data-target=@Html.Raw($"#ImageText-slider") data-slide-to="@i" @Html.Raw(i == 0 ? "class='active'" : "")></li>
            }
        </ol>
        <!-- Wrapper for slides -->
        <div class="carousel-inner" role="listbox" style="overflow:hidden;">
            
            
            @if (@Model.Count == 0)
            {
                <div class="text-center" style="border: 4px dashed #CCC; color: #CCC; background: none; height: 100%;">
                    <h1 style=@($"line-height:425px")>沒有新朋友</h1>
                </div>
            }
            else
            {
                bool firstActive = true;
                <!-- Item 1 -->
                int j = 0;
                foreach (var item in @Model)
                {
                    j++;

                    string thumbnailPath = $"/Images/login.jpg";
                    string productThumbnailPath = $"/NewVisitorsPics/{item.Id}.jpg";
                    //if (!string.IsNullOrWhiteSpace(item.BackgroundImage))
                    //{
                    //    WebSiteCache.CreateJpgThumbnailByWidth(item.BackgroundImage, thumbnailPath, 9999);
                    //}


                    //string productThumbnailPath = $"/User_Data/Thumbnail/{Model.Id}/{RainbowHybrid.Utility.Parse.Get32BaseGuid()}.jpg";
                    //if (!string.IsNullOrWhiteSpace(item.Image))
                    //{
                    //    WebSiteCache.CreateJpgThumbnailByWidth(item.Image, productThumbnailPath, 750, WebSiteCache.ImageType.Png);
                    //}

                    <img alt="" src="@(thumbnailPath)" style="display: none">

                    <img alt="" src="@(productThumbnailPath)" style="display: none">
                    <div class="item ImageText-slide @Html.Raw(firstActive ? "active" : "")" 
                         style="background: url(@(thumbnailPath))no-repeat center center;background-size: cover;">
                        <a href="#">
                            <div class="container">

                                @{
                                    string imgClss = "carousel-frontImg-bord";
                                    //switch (item.ImgBorderType)
                                    //{
                                    //    case Enumeration.ImgBorderType.None:
                                    //        break;
                                    //    case Enumeration.ImgBorderType.Normal:
                                    //        imgClss = "carousel-frontImg-bord";
                                    //        break;
                                    //    case Enumeration.ImgBorderType.Round:
                                    //        imgClss = "carousel-frontImg-bord round";
                                    //        break;
                                    //}
                                }
                                @if (item.Gender==Enumeration.Gender.Male)
                                {
                                    
                                    <div class="col-sm-7 @(item.RTL?"": "col-xs-push-12 col-sm-push-5")">
                                        <h3 data-animation="animated bounceInDown" style="@(string.IsNullOrEmpty(item.ForeColor) ? "" : $"color:rgb({item.ForeColor})")">
                                            @item.Title
                                        </h3>
                                        <h4 data-animation="animated bounceInUp" style="@(string.IsNullOrEmpty(item.ForeColor)?"":$"color:rgb({item.ForeColor})")">
                                                
                                            @Html.Raw(item.TextAreaContent??"".Replace(Environment.NewLine, "<br>"))
                                        </h4>
                                    </div>
                                    <div class="col-sm-5 @(item.RTL ? "" : " col-xs-pull-12 col-sm-pull-7")">
                                        <div class="ImageText-slider-card">
                                            <div class="ImageText-slider-FrontImg @RainbowHybrid.BLL.IndexModelBLL.GetModelsMediaClassName(Model)_img @(imgClss)"
                                                 style="background: url('@(string.IsNullOrWhiteSpace(item.Image) ?RainbowHybrid.BLL.ProductBLL.NONE_PIC : productThumbnailPath)'); background-size: cover; "
                                                 data-animation="animated zoomInLeft">
                                            </div>
                                        </div>
                                    </div>
                                }
                                else
                                {
                                    <div class="col-sm-5">
                                        <div class="ImageText-slider-card">
                                            <div class="ImageText-slider-FrontImg @RainbowHybrid.BLL.IndexModelBLL.GetModelsMediaClassName(Model)_img @(imgClss)"
                                                 style="background: url('@(string.IsNullOrWhiteSpace(item.Image) ?RainbowHybrid.BLL.ProductBLL.NONE_PIC : productThumbnailPath)'); background-size: cover;"
                                                 data-animation="animated zoomInLeft">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-sm-7">
                                        <h3 data-animation="animated bounceInDown" style="@(string.IsNullOrEmpty(item.ForeColor) ? "" : $"color:rgb({item.ForeColor})")">
                                            @item.Title
                                        </h3>
                                        <h4 data-animation="animated bounceInUp" style="@(string.IsNullOrEmpty(item.ForeColor)?"":$"color:rgb({item.ForeColor})")">
                                                
                                            @Html.Raw(item.TextAreaContent??"".Replace(Environment.NewLine, "<br>"))
                                        </h4>
                                    </div>
                                    
                                }
                            </div>
                        </a>
                    </div>
                    firstActive = false;
                }
            }


        </div>
        <!-- End Wrapper for slides-->
        <a class="left carousel-control" href=@($"#ImageText-slider") role="button" data-slide="prev">
            <i class="fa fa-angle-left"></i><span class="sr-only">Previous</span>
        </a>
        <a class="right carousel-control" href=@($"#ImageText-slider") role="button" data-slide="next">
            <i class="fa fa-angle-right"></i><span class="sr-only">Next</span>
        </a>
    </div>
</div>
<div class="bg-forRow"></div>