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

@functions {
	private string GetFontStack()
	{
		return "font-family:initial,Arial,Helvetica Neue,Helvetica,sans-serif;";
	}

	private string GetTableReset()
	{
		return "border:0;margin:0;outline:0;padding:0;";
	}

	public Dynamicweb.Frontend.ColorViewModel GetMutedColor(string? hex, int percent, double threshold = 0.5)
	{
		/// <summary>
		/// Return a color in either lighter or darker contrast based on the original color luminance.
		/// </summary>
		/// <param name="percent">The percent (1-100) to darken or light the color with - higher percentage will give higher contrast</param>
		/// <param name="threshold">The luminance threshold (0-1). Default is 0.5. 0 is black, 1 is white. Luminance threshold is used to decide wether the returned contrast color should be darker or lighter than the base color</param>
		/// <returns>A new color viewmodel with the contrasted color in either darker or lighter luminance compared to base color</returns>
		/// 
		if (threshold > 1)
			threshold = 1;
		if (threshold < 0)
			threshold = 0;
		if(hex == null)
		{
			return new Dynamicweb.Frontend.ColorViewModel() { Hex = "inherit" };
		}
		var color = Dynamicweb.Imaging.Colors.Color.FromHex(hex);
		var luminance = (0.2126 * color.BaseColor.R) + (0.7152 * color.BaseColor.G) + (0.0722 * color.BaseColor.B);
		/// == luminance = 0 is black, luminance = 1 is white == //
		luminance = color.Brightness / 255;
		return luminance < threshold ? new Dynamicweb.Frontend.ColorViewModel() { Hex = color.Lighten(percent).ToHex() } : new Dynamicweb.Frontend.ColorViewModel() { Hex = color.Darken(percent).ToHex() };
	}
}

@{
	string title = Model.Item.GetString("Title", string.Empty);
	string backgroundColor = $"background-color:{Model.ColorScheme?.BackgroundColor?.Hex ?? string.Empty};";
	string foregroundColor = $"color:{Model.ColorScheme?.ForegroundColor?.Hex ?? string.Empty};";
	string align = Model.Item.GetRawValueString("Align", "left");
	int padding = Dynamicweb.Core.Converter.ToInt32(Model.Item.GetRawValueString("Padding", "0"));
	int cellSpacing = 8;
	string text = Model.Item.GetString("Text", string.Empty);
	int layout = Dynamicweb.Core.Converter.ToInt32(Model.Item.GetRawValueString("Layout", "2"));
	var imageRatio = Model.Item.GetRawValueString("ImageAspectRatio", "4-3").ToLower();

	var imageParms = new Dictionary<string, object>();
	imageParms.Add("alt", "");
	imageParms.Add("columns", layout);
	imageParms.Add("gridColumns", Model.GridRowColumnCount);
	imageParms.Add("nested", Model.GridRowColumnCount > 1);
	imageParms.Add("padding", (padding * 2) + (8 * (layout - 1)));
	imageParms.Add("imageRatio", imageRatio);
}

<table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="mso-table-lspace:0pt;mso-table-rspace:0pt;@GetTableReset()color:inherit;width:100%;@(backgroundColor)">
	<tbody>
		<tr style="@GetTableReset()">
			<td style="@GetTableReset()padding:@(padding)px">
				<table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="mso-table-lspace:0pt;mso-table-rspace:0pt;@GetTableReset()color:inherit;width:100%;">
					<tbody>
						@if (Model.Item.TryGetValue<ProductListViewModel>("Products", out ProductListViewModel selectedProducts))
						{
							@:<tr style="@GetTableReset()">

							int index = 1;
							int totalProducts = selectedProducts.Products.Count();
							foreach (var product in selectedProducts.Products)
							{
								string link = product.GetProductLink(GetPageIdByNavigationTag("Shop"), false);
								bool hideProductPrice = Model.Item?.GetBoolean("HideProductPrice") ?? false;
								bool hideProductNumber = Model.Item?.GetBoolean("HideProductNumber") ?? false;

								<td valign="top" style="@GetTableReset()@GetFontStack()">
									<table style="border-collapse:collapse;table-layout:fixed;@GetTableReset()" cellpadding="0" cellspacing="0" width="100%" role="presentation">
										<tbody>
											<tr style="@GetTableReset()">
												<td style="@GetTableReset()">

													<div align="center" style="font-size:2px;">
														<a style="text-decoration:none;" href="@link" target="_blank">
															@if (product.DefaultImage is object)
															{
																imageParms["alt"] = product.Name;
																@RenderPartial("Swift-v2_Email/Components/Image.cshtml", new Dynamicweb.Frontend.FileViewModel() { Name = product.Name, Path = product.DefaultImage.Value }, imageParms);
															}
														</a>
													</div>

													<table style="border-collapse:collapse;table-layout:fixed;@GetTableReset()" cellpadding="0" cellspacing="0" width="100%" role="presentation">
														<tbody>
															<tr style="@GetTableReset()">
																<td style="@GetTableReset()padding-top:8px;text-align:@align;line-height:18px;font-size:13px;text-decoration:none;@(foregroundColor)">
																	<a style="text-decoration:none;@(foregroundColor)@GetTableReset()@GetFontStack()" href="@link" target="_blank">
																		@product.Name
																	</a>
																</td>
															</tr>

															@if (!hideProductNumber)
															{
																<tr>
																	<td style="@GetTableReset()@GetFontStack()padding-top:8px;text-align:@align;line-height:18px;font-size:11px;color:@(GetMutedColor(Model.ColorScheme?.ForegroundColor?.Hex, 20));">
																		@product.Number
																	</td>
																</tr>
															}

															@if (!hideProductPrice)
															{
																<tr>
																	<td style="@GetTableReset()@GetFontStack()padding-top:8px;text-align:@align;line-height:13px;font-size:13px;break-inside:avoid;word-break:keep-all;white-space:nowrap;@(foregroundColor);">
																		@product.Price.PriceFormatted

																		@if (product.Discount.Price > 0)
																		{
																			<span style="line-height:13px;font-size:13px;text-decoration:line-through;break-inside:avoid;word-break:keep-all;white-space:nowrap;color:@(GetMutedColor(Model.ColorScheme?.ForegroundColor?.Hex, 20));">@product.PriceBeforeDiscount.PriceFormatted</span>
																		}
																	</td>
																</tr>
															}
															<tr><td height="24" style="padding-top:24px;"></td></tr>
														</tbody>
													</table>
												</td>
											</tr>
										</tbody>
									</table>
								</td>

								if (index % layout == 0 && !(index == totalProducts))
								{
									@:</tr>
									@:<tr style="@GetTableReset()">
										@:<td style="@GetTableReset()" colspan="100%" height="@(cellSpacing * 4)">&nbsp;</td>
									@:</tr>
									@:<tr style="@GetTableReset()">
								}
								else
								{
									if(!(index == totalProducts))
									{ 
										@:<td width="@(cellSpacing)" style="@GetTableReset()">&nbsp;</td>
									}
								}

								index++;
							}
							@:</tr>
						}
						else
						{
							if (Pageview.IsVisualEditorMode)
							{
								<tr style="@GetTableReset()@GetFontStack()">
									<td style="@(foregroundColor)">@Translate("No products selected")</td>
								</tr>
							}
						}
					</tbody>
				</table>
				<!--[if mso]><br/><![endif]-->
			</td>
		</tr>
	</tbody>
</table>
