Error executing template "Designs/Rapido/Paragraph/ParagraphContainer.cshtml"
System.NullReferenceException: Object reference not set to an instance of an object.
   at CompiledRazorTemplates.Dynamic.RazorEngine_7c0e8316bfe74cb2a7bf62f59ab374e9.Execute() in D:\dynamicweb.net\Solutions\Novicell\Færch\Files\Templates\Designs\Rapido\Paragraph\ParagraphContainer.cshtml:line 2420
   at RazorEngine.Templating.TemplateBase.RazorEngine.Templating.ITemplate.Run(ExecuteContext context, TextWriter reader)
   at RazorEngine.Templating.RazorEngineService.RunCompile(ITemplateKey key, TextWriter writer, Type modelType, Object model, DynamicViewBag viewBag)
   at RazorEngine.Templating.RazorEngineServiceExtensions.<>c__DisplayClass16_0.b__0(TextWriter writer)
   at RazorEngine.Templating.RazorEngineServiceExtensions.WithWriter(Action`1 withWriter)
   at Dynamicweb.Rendering.Template.RenderRazorTemplate()


  1     @inherits Dynamicweb.Rendering.ViewModelTemplate<Dynamicweb.Frontend.ParagraphViewModel>
  2     @using System.Collections.Generic
  3     @using System
  4     @using System.Text.RegularExpressions
  5     @using Dynamicweb.Core
  6     @using Dynamicweb.Rapido.Blocks.Components.General
  7     @using Dynamicweb.Rapido.Blocks.Components
  8     
  9     @functions {
 10         public string GenerateRgba(string color, double opacity)
 11         {
 12             color = color.Replace("#", "");
 13             if (color.Length == 6) {
 14                 return "rgba(" + Convert.ToInt32(color.Substring(0, 2), 16) + ", " + Convert.ToInt32(color.Substring(2, 2), 16) + ", " + Convert.ToInt32(color.Substring(4, 2), 16) + ", " + opacity + ");";
 15             } else {
 16                 return Convert.ToInt16(color).ToString();
 17             }
 18         }
 19     }
 20     
 21     @* Include the required Grid builder (Contains the methods @RenderBlockList and @RenderBlock) *@
 22     @using System.Text.RegularExpressions
 23     @using System.Collections.Generic
 24     @using System.Reflection
 25     @using System.Web
 26     @using System.Web.UI.HtmlControls
 27     @using Dynamicweb.Rapido.Blocks.Components
 28     @using Dynamicweb.Rapido.Blocks.Components.Articles
 29     @using Dynamicweb.Rapido.Blocks.Components.Documentation
 30     @using Dynamicweb.Rapido.Blocks
 31     
 32     
 33     @*--- START: Base block renderers ---*@
 34     
 35     @helper RenderBlockList(List<Block> blocks)
 36     {
 37         bool debug = !String.IsNullOrEmpty(HttpContext.Current.Request.QueryString.Get("debug")) ? Convert.ToBoolean(HttpContext.Current.Request.QueryString.Get("debug")) : false;
 38         blocks = blocks.OrderBy(item => item.SortId).ToList();
 39     
 40         foreach (Block item in blocks)
 41         {
 42             if (debug) {
 43             <!-- Block START: @item.Id -->
 44             }
 45     
 46             if (item.Design == null)
 47             {
 48                 @RenderBlock(item)
 49             }
 50             else if (item.Design.RenderType == RenderType.None) {
 51                 string cssClass = item.Design.CssClass != null ? item.Design.CssClass : "";
 52     
 53                 <div class="@cssClass dw-mod">
 54                    @RenderBlock(item)
 55                 </div>
 56             }
 57             else if (item.Design.RenderType != RenderType.Hide)
 58             {
 59                 string cssClass = item.Design.CssClass != null ? item.Design.CssClass : "";
 60     
 61                 if (!item.SkipRenderBlocksList) {
 62                     if (item.Design.RenderType == RenderType.Row)
 63                     {
 64                         <div class="grid grid--align-content-start @cssClass dw-mod" id="Block__@item.Id">
 65                             @RenderBlock(item)
 66                         </div>
 67                     }
 68     
 69                     if (item.Design.RenderType == RenderType.Column)
 70                     {
 71                         string hidePadding = item.Design.HidePadding ? "u-no-padding" : "";
 72                         string size = item.Design.Size ?? "12";
 73                         size = Regex.IsMatch(size, @"\d") ? "md-" + item.Design.Size : item.Design.Size;
 74     
 75                         <div class="grid__col-lg-@item.Design.Size grid__col-md-@item.Design.Size grid__col-sm-12 grid__col-xs-12 @hidePadding @cssClass dw-mod" id="Block__@item.Id">
 76                             @RenderBlock(item)
 77                         </div>
 78                     }
 79     
 80                     if (item.Design.RenderType == RenderType.Table)
 81                     {
 82                         <table class="table @cssClass dw-mod" id="Block__@item.Id">
 83                             @RenderBlock(item)
 84                         </table>
 85                     }
 86     
 87                     if (item.Design.RenderType == RenderType.TableRow)
 88                     {
 89                         <tr class="@cssClass dw-mod" id="Block__@item.Id">
 90                             @RenderBlock(item)
 91                         </tr>
 92                     }
 93     
 94                     if (item.Design.RenderType == RenderType.TableColumn)
 95                     {
 96                         <td class="@cssClass dw-mod" id="Block__@item.Id">
 97                             @RenderBlock(item)
 98                         </td>
 99                     }
100     
101                     if (item.Design.RenderType == RenderType.CardHeader)
102                     {
103                         <div class="card-header @cssClass dw-mod">
104                             @RenderBlock(item)
105                         </div>
106                     }
107     
108                     if (item.Design.RenderType == RenderType.CardBody)
109                     {
110                         <div class="card @cssClass dw-mod">
111                             @RenderBlock(item)
112                         </div>
113                     }
114     
115                     if (item.Design.RenderType == RenderType.CardFooter)
116                     {
117                         <div class="card-footer @cssClass dw-mod">
118                             @RenderBlock(item)
119                         </div>
120                     }
121                 }
122                 else 
123                 {
124                     @RenderBlock(item)
125                 }
126             }
127     
128             if (debug) {
129             <!-- Block END: @item.Id -->
130             }
131         }
132     }
133     
134     @helper RenderBlock(Block item)
135     {
136         bool debug = !String.IsNullOrEmpty(HttpContext.Current.Request.QueryString.Get("debug")) ? Convert.ToBoolean(HttpContext.Current.Request.QueryString.Get("debug")) : false;
137     
138         if (item.Template != null)
139         {
140             @BlocksPage.RenderTemplate(item.Template)
141         }
142     
143         if (item.Component != null)
144         {
145             string customSufix = "Custom";
146             string methodName = item.Component.HelperName;
147     
148             ComponentBase[] methodParameters = new ComponentBase[1]; 
149             methodParameters[0] = item.Component; 
150             Type methodType = this.GetType();
151     
152             MethodInfo customMethod = methodType.GetMethod(methodName + customSufix);
153             MethodInfo generalMethod = methodType.GetMethod(methodName);
154     
155             try {
156                 if (debug) {
157                 <!-- Component: @methodName.Replace("Render", "") -->
158                 }
159                 @customMethod.Invoke(this, methodParameters).ToString();
160             } catch {
161                 try {
162                     @generalMethod.Invoke(this, methodParameters).ToString();
163                 } catch(Exception ex) {
164                     throw new Exception(item.Component.GetType().Name + " method '" + methodName +"' could not be invoked", ex);
165                 }
166             }
167         }
168     
169         if (item.BlocksList.Count > 0 && !item.SkipRenderBlocksList)
170         {
171             @RenderBlockList(item.BlocksList)
172         }
173     }
174     
175     @*--- END: Base block renderers ---*@
176     
177     
178     @* Include the components *@
179     @using Dynamicweb.Rapido.Blocks.Components
180     @using Dynamicweb.Rapido.Blocks.Components.General
181     @using Dynamicweb.Rapido.Blocks
182     @using System.IO
183     
184     @* Required *@
185     @using Dynamicweb.Rapido.Blocks.Components
186     @using Dynamicweb.Rapido.Blocks.Components.General
187     @using Dynamicweb.Rapido.Blocks
188     
189     
190     @helper Render(ComponentBase component)
191     {
192         if (component != null)
193         {
194             @component.Render(this)
195         }
196     }
197     
198     
199     @* Components *@
200     @using System.Reflection
201     @using Dynamicweb.Rapido.Blocks.Components.General
202     
203     
204     @* Component *@
205     
206     @helper RenderIcon(Icon settings)
207     {
208         if (settings != null)
209         {
210             string color = settings.Color != null ? "style=\"color: " + settings.Color + "\"" : "";
211     
212             if (settings.Name != null)
213             {
214                 if (string.IsNullOrEmpty(settings.Label))
215                 {
216                     <i class="@settings.Prefix @settings.Name @settings.CssClass" @color></i>
217                 }
218                 else
219                 {
220                     if (settings.LabelPosition == IconLabelPosition.Before)
221                     {
222                         <span>@settings.Label <i class="@settings.Prefix @settings.Name @settings.CssClass" @color></i></span>
223                     }
224                     else
225                     {
226                         <span><i class="@settings.Prefix @settings.Name @settings.CssClass" @color></i> @settings.Label</span>
227                     }
228                 }
229             }
230             else if (!string.IsNullOrEmpty(settings.Label))
231             {
232                 @settings.Label
233             }
234         }
235     }
236     @using System.Reflection
237     @using Dynamicweb.Rapido.Blocks.Components.General
238     @using Dynamicweb.Rapido.Blocks.Components
239     @using Dynamicweb.Core
240     
241     @* Component *@
242     
243     @helper RenderButton(Button settings)
244     {
245         if (settings != null && (!string.IsNullOrEmpty(settings.Title) || settings.Icon != null))
246         {
247             Dictionary<string, string> attributes = new Dictionary<string, string>();
248             List<string> classList = settings.CssClass != null ? settings.CssClass.Split(' ').ToList() : new List<string>();
249             if (settings.Disabled) {
250                 attributes.Add("disabled", "true");
251                 classList.Add("disabled");
252             }
253             
254             if (!string.IsNullOrEmpty(settings.ConfirmText) || !string.IsNullOrEmpty(settings.ConfirmTitle))
255             {
256                 settings.Id = !string.IsNullOrEmpty(settings.Id) ? settings.Id : Guid.NewGuid().ToString("N");
257                 @RenderConfirmDialog(settings);
258             settings.OnClick = "document.getElementById('" + settings.Id + "ModalTrigger').checked = true";
259         }
260     
261         if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
262         if (!string.IsNullOrEmpty(settings.Name)) { attributes.Add("name", settings.Name); }
263         if (!string.IsNullOrEmpty(settings.AltText))
264         {
265             attributes.Add("title", settings.AltText);
266         }
267         else if (!string.IsNullOrEmpty(settings.Title))
268         {
269             attributes.Add("title", settings.Title);
270         }
271     
272         var onClickEvents = new List<string>();
273         if (!string.IsNullOrEmpty(settings.OnClick))
274         {
275             onClickEvents.Add(settings.OnClick);
276         }
277         if (!string.IsNullOrEmpty(settings.Href))
278         {
279             onClickEvents.Add("location.href='" + settings.Href + "'");
280         }
281         if (onClickEvents.Count > 0)
282         {
283             attributes.Add("onClick", string.Join(";", onClickEvents));
284         }
285     
286         if (settings.ButtonLayout != ButtonLayout.None)
287         {
288             classList.Add("btn");
289             string btnLayout = Enum.GetName(typeof(ButtonLayout), settings.ButtonLayout).ToLower();
290             if (btnLayout == "linkclean")
291             {
292                 btnLayout = "link-clean"; //fix
293             }
294             classList.Add("btn--" + btnLayout);
295         }
296     
297         if (settings.Icon == null)
298         {
299             settings.Icon = new Icon();
300         }
301         settings.Icon.Label = settings.Title;
302     
303         attributes.Add("type", Enum.GetName(typeof(ButtonType), settings.ButtonType).ToLower());
304     
305             <button class="@string.Join(" ", classList) dw-mod" @ComponentMethods.AddAttributes(attributes) @ComponentMethods.AddAttributes(settings.ExtraAttributes)>@Render(settings.Icon)</button>
306         }
307     }
308     
309     @helper RenderConfirmDialog(Button settings)
310     {
311         Modal confirmDialog = new Modal {
312             Id = settings.Id,
313             Width = ModalWidth.Sm,
314             Heading = new Heading
315             {
316                 Level = 2,
317                 Title = settings.ConfirmTitle
318             },
319             BodyText = settings.ConfirmText
320         };
321     
322         confirmDialog.AddAction(new Button { Title = Translate("Cancel"), ButtonLayout = ButtonLayout.Secondary, OnClick = "document.getElementById('" + settings.Id + "ModalTrigger').checked = false"});
323         confirmDialog.AddAction(new Button { Title = Translate("OK"), ButtonLayout = ButtonLayout.Primary, OnClick = "document.getElementById('" + settings.Id + "ModalTrigger').checked = false;" + settings.OnClick });
324     
325         @Render(confirmDialog)
326     }
327     @using Dynamicweb.Rapido.Blocks.Components.General
328     @using Dynamicweb.Rapido.Blocks.Components
329     @using Dynamicweb.Core
330     
331     @helper RenderDashboard(Dashboard settings)
332     {
333         var widgets = settings.GetWidgets();
334     
335         if (!string.IsNullOrEmpty(settings.WidgetsBaseBackgroundColor))
336         {
337             //set bg color for them
338     
339             System.Drawing.Color color = System.Drawing.ColorTranslator.FromHtml(settings.WidgetsBaseBackgroundColor);
340             int r = Convert.ToInt16(color.R);
341             int g = Convert.ToInt16(color.G);
342             int b = Convert.ToInt16(color.B);
343     
344             var count = widgets.Length;
345             var max = Math.Max(r, Math.Max(g, b));
346             double step = 255.0 / (max * count);
347             var i = 0;
348             foreach (var widget in widgets)
349             {
350                 i++;
351     
352                 var shade = "rgb(" + Converter.ToString(r * step * i).Replace(",", ".") + ", " + Converter.ToString(g * step * i).Replace(",", ".") + ", " + Converter.ToString(b * step * i).Replace(",", ".") + ")";
353                 widget.BackgroundColor = shade;
354             }
355         }
356     
357         <div class="dashboard @settings.CssClass dw-mod" @ComponentMethods.AddAttributes(settings.ExtraAttributes)>
358             @foreach (var widget in widgets)
359             {
360                 <div class="dashboard__widget">
361                     @Render(widget)
362                 </div>
363             }
364         </div>
365     }
366     @using Dynamicweb.Rapido.Blocks.Components.General
367     @using Dynamicweb.Rapido.Blocks.Components
368     
369     @helper RenderDashboardWidgetLink(DashboardWidgetLink settings)
370     {
371         if (!string.IsNullOrEmpty(settings.Link))
372         {
373             var backgroundStyles = "";
374             if (!string.IsNullOrEmpty(settings.BackgroundColor))
375             {
376                 backgroundStyles = "style=\"background-color:" + settings.BackgroundColor + "\"";
377             }
378     
379             <a href="@settings.Link" class="widget widget--link @settings.CssClass dw-mod" @backgroundStyles title="@settings.Title" @ComponentMethods.AddAttributes(settings.ExtraAttributes)>
380                 <div class="u-center-middle u-color-light">
381                     @if (settings.Icon != null)
382                     {
383                         settings.Icon.CssClass += "widget__icon";
384                         @Render(settings.Icon)
385                     }
386                     <div class="widget__title">@settings.Title</div>
387                 </div>
388             </a>
389         }
390     }
391     @using Dynamicweb.Rapido.Blocks.Components.General
392     @using Dynamicweb.Rapido.Blocks.Components
393     
394     @helper RenderDashboardWidgetCounter(DashboardWidgetCounter settings)
395     {
396         var backgroundStyles = "";
397         if (!string.IsNullOrEmpty(settings.BackgroundColor))
398         {
399             backgroundStyles = "style='background-color:" + settings.BackgroundColor + "'";
400         }
401     
402         <div class="widget @settings.CssClass dw-mod" @backgroundStyles @ComponentMethods.AddAttributes(settings.ExtraAttributes)>
403             <div class="u-center-middle u-color-light">
404                 @if (settings.Icon != null)
405                 {
406                     settings.Icon.CssClass += "widget__icon";
407                     @Render(settings.Icon)
408                 }
409                 <div class="widget__counter">@settings.Count</div>
410                 <div class="widget__title">@settings.Title</div>
411             </div>
412         </div>
413     }
414     @using System.Reflection
415     @using Dynamicweb.Rapido.Blocks.Components.General
416     @using Dynamicweb.Rapido.Blocks.Components
417     @using Dynamicweb.Core
418     
419     @* Component *@
420     
421     @helper RenderLink(Link settings)
422     {
423         if (settings != null && !string.IsNullOrEmpty(settings.Href) && (!string.IsNullOrEmpty(settings.Title) || settings.Icon != null))
424         {
425             Dictionary<string, string> attributes = new Dictionary<string, string>();
426             List<string> classList = settings.CssClass != null ? settings.CssClass.Split(' ').ToList() : new List<string>();
427             if (settings.Disabled) 
428             {
429                 attributes.Add("disabled", "true");
430                 classList.Add("disabled");
431             }
432             
433             if (!string.IsNullOrEmpty(settings.AltText)) 
434             { 
435                 attributes.Add("title", settings.AltText); 
436             } 
437             else if (!string.IsNullOrEmpty(settings.Title)) 
438             { 
439                 attributes.Add("title", settings.Title); 
440             }
441     
442             if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
443             if (!string.IsNullOrEmpty(settings.Name)) { attributes.Add("name", settings.Name); }
444             if (!string.IsNullOrEmpty(settings.OnClick)) { attributes.Add("onClick", settings.OnClick); }
445             attributes.Add("href", settings.Href);
446     
447             if (settings.ButtonLayout != ButtonLayout.None) 
448             {
449                 classList.Add("btn");
450                 string btnLayout = Enum.GetName(typeof(ButtonLayout), settings.ButtonLayout).ToLower();
451                 if (btnLayout == "linkclean") 
452                 {
453                     btnLayout = "link-clean"; //fix
454                 }
455                 classList.Add("btn--" + btnLayout);
456             }
457             
458             if (settings.Icon == null)
459             {
460                 settings.Icon = new Icon();
461             }
462             settings.Icon.Label = settings.Title;
463             
464             if (settings.Target == LinkTargetType.Blank && settings.Rel == LinkRelType.None) 
465             {
466                 settings.Rel = LinkRelType.Noopener;
467             }
468             if (settings.Target != LinkTargetType.None) 
469             { 
470                 attributes.Add("target", "_" + Enum.GetName(typeof(LinkTargetType), settings.Target).ToLower()); 
471             }
472             if (settings.Download) 
473             { 
474                 attributes.Add("download", "true"); 
475             }
476             if (settings.Rel != LinkRelType.None) 
477             { 
478                 attributes.Add("rel", Enum.GetName(typeof(LinkRelType), settings.Rel).ToLower()); 
479             }
480     
481             <a class="@string.Join(" ", classList) dw-mod" @ComponentMethods.AddAttributes(attributes) @ComponentMethods.AddAttributes(settings.ExtraAttributes)>@Render(settings.Icon)</a>
482         }
483     }
484     @using System.Reflection
485     @using Dynamicweb.Rapido.Blocks.Components
486     @using Dynamicweb.Rapido.Blocks.Components.General
487     @using Dynamicweb.Rapido.Blocks
488     
489     
490     @* Component *@
491     
492     @helper RenderRating(Rating settings)
493     {
494         if (settings.Score > 0)
495         {
496             int rating = settings.Score;
497             string iconType = "fa-star";
498     
499             switch (settings.Type.ToString()) {
500                 case "Stars":
501                     iconType = "fa-star";
502                     break;
503                 case "Hearts":
504                     iconType = "fa-heart";
505                     break;
506                 case "Lemons":
507                     iconType = "fa-lemon";
508                     break;
509                 case "Bombs":
510                     iconType = "fa-bomb";
511                     break;
512             }
513     
514                 for (int i = 0; i < settings.OutOf; i++)
515                 {
516                     <i class="@(rating > i ? "fas" : "far") @iconType"></i>
517                 }
518         }
519     }
520     @using System.Reflection
521     @using Dynamicweb.Rapido.Blocks.Components.General
522     @using Dynamicweb.Rapido.Blocks.Components
523     
524     
525     @* Component *@
526     
527     @helper RenderSelectFieldOption(SelectFieldOption settings)
528     {
529         Dictionary<string, string> attributes = new Dictionary<string, string>();
530         if (settings.Checked) { attributes.Add("selected", "true"); }
531         if (settings.Disabled) { attributes.Add("disabled", "true"); }
532         if (settings.Value != null) { attributes.Add("value", settings.Value); }
533         if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
534     
535         <option @ComponentMethods.AddAttributes(attributes) @ComponentMethods.AddAttributes(settings.ExtraAttributes)>@settings.Label</option>
536     }
537     @using System.Reflection
538     @using Dynamicweb.Rapido.Blocks.Components.General
539     @using Dynamicweb.Rapido.Blocks.Components
540     
541     
542     @* Component *@
543     
544     @helper RenderNavigation(Navigation settings) {
545         @RenderNavigation(new
546         {
547             id = settings.Id,
548             cssclass = settings.CssClass,
549             startLevel = settings.StartLevel,
550             endlevel = settings.EndLevel,
551             expandmode = settings.Expandmode,
552             sitemapmode = settings.SitemapMode,
553             template = settings.Template
554         })
555     }
556     @using Dynamicweb.Rapido.Blocks.Components.General
557     @using Dynamicweb.Rapido.Blocks.Components
558     
559     
560     @* Component *@
561     
562     @helper RenderBreadcrumbNavigation(BreadcrumbNavigation settings) {
563         settings.Id = String.IsNullOrEmpty(settings.Id) ? "breadcrumb" : settings.Id;
564         settings.Template = String.IsNullOrEmpty(settings.Template) ? "Breadcrumb.xslt" : settings.Template;
565         settings.StartLevel = settings.StartLevel == 0 ? 1 : settings.StartLevel;
566         settings.EndLevel = settings.EndLevel == 10 ? 1 : settings.EndLevel;
567         settings.Expandmode = String.IsNullOrEmpty(settings.Expandmode) ? "all" : settings.Expandmode;
568         settings.SitemapMode = false;
569     
570         @RenderNavigation(settings)         
571     }
572     @using Dynamicweb.Rapido.Blocks.Components.General
573     @using Dynamicweb.Rapido.Blocks.Components
574     
575     
576     @* Component *@
577     
578     @helper RenderLeftNavigation(LeftNavigation settings) {
579         settings.Id = String.IsNullOrEmpty(settings.Id) ? "breadcrumb" : settings.Id;
580         settings.Template = String.IsNullOrEmpty(settings.Template) ? "Breadcrumb.xslt" : settings.Template;
581         settings.StartLevel = settings.StartLevel == 0 ? 1 : settings.StartLevel;
582         settings.EndLevel = settings.EndLevel == 10 ? 1 : settings.EndLevel;
583         settings.Expandmode = String.IsNullOrEmpty(settings.Expandmode) ? "all" : settings.Expandmode;
584     
585         <div class="grid__cell">
586             @RenderNavigation(settings) 
587         </div>       
588     }
589     @using System.Reflection
590     @using Dynamicweb.Rapido.Blocks.Components.General
591     @using Dynamicweb.Core
592     
593     @* Component *@
594     
595     @helper RenderHeading(Heading settings)
596     {
597         if (settings != null && !string.IsNullOrEmpty(settings.Title))
598         {
599             string color = settings.Color != null ? "style=\"color: " + settings.Color + "\"" : "";
600             string tagName = settings.Level != 0 ? "h" + settings.Level.ToString() : "div";
601     
602             @("<" + tagName + " class=\"" + settings.CssClass + " dw-mod\" " + color + ">")
603                 if (!string.IsNullOrEmpty(settings.Link))
604                 {
605                     @Render(new Link { Href = settings.Link, Icon = settings.Icon, Title = settings.Title, ButtonLayout = ButtonLayout.None })
606                 } 
607                 else
608                 {
609                     if (settings.Icon == null)
610                     {
611                         settings.Icon = new Icon();
612                     }
613                     settings.Icon.Label = settings.Title;
614                     @Render(settings.Icon)
615                 }
616             @("</" + tagName + ">");
617         }
618     }
619     @using Dynamicweb.Rapido.Blocks.Components
620     @using Dynamicweb.Rapido.Blocks.Components.General
621     @using Dynamicweb.Rapido.Blocks
622     
623     
624     @* Component *@
625     
626     @helper RenderImage(Image settings)
627     {
628         if (settings.FilterPrimary != ImageFilter.None || settings.FilterSecondary != ImageFilter.None)
629         {
630             Dictionary<string, string> optionalAttributes = new Dictionary<string, string>();
631             if (!string.IsNullOrEmpty(settings.FilterColor)) { optionalAttributes.Add("style", "background-color: " + settings.FilterColor); }
632             
633             if (settings.Caption != null)
634             {
635                 @:<div>
636             }
637     
638             var primaryFilterClass = settings.FilterPrimary.ToString().ToLower();
639             var secondaryFilterClass = settings.FilterSecondary.ToString().ToLower();
640     
641             <div class="image-filter image-filter--@primaryFilterClass u-position-relative dw-mod" @ComponentMethods.AddAttributes(optionalAttributes)>
642                 <div class="image-filter image-filter--@secondaryFilterClass dw-mod">
643                     @if (settings.Link != null)
644                     {
645                         <a href="@settings.Link">
646                             @RenderTheImage(settings)
647                         </a>
648                     }
649                     else
650                     {
651                         @RenderTheImage(settings)
652                     }
653                 </div>
654             </div>
655     
656             if (settings.Caption != null)
657             {
658                 <span class="image-caption dw-mod">@settings.Caption</span>
659                 @:</div>
660             }
661         }
662         else 
663         {
664             if (settings.Caption != null)
665             {
666                 @:<div>
667             }
668             if (!string.IsNullOrEmpty(settings.Link))
669             {
670                 <a href="@settings.Link">
671                     @RenderTheImage(settings)
672                 </a>
673             }
674             else
675             {
676                 @RenderTheImage(settings)
677             }
678     
679             if (settings.Caption != null)
680             {
681                 <span class="image-caption dw-mod">@settings.Caption</span>
682                 @:</div>
683             }
684         }
685     }
686     
687     @helper RenderTheImage(Image settings)
688     {
689         if (settings != null)
690         {
691             string placeholderImage = "/Files/Images/placeholder.gif";
692             string imageEngine = "/Admin/Public/GetImage.ashx?";
693     
694             string imageStyle = "";
695     
696             switch (settings.Style)
697             {
698                 case ImageStyle.Ball:
699                     imageStyle = "grid__cell-img--ball";
700                     break;
701             }
702     
703             if (settings.Style == ImageStyle.Ball || settings.Style == ImageStyle.Circle)
704             {
705                 if (settings.ImageDefault != null)
706                 {
707                     settings.ImageDefault.Height = settings.ImageDefault.Width;
708                 }
709                 if (settings.ImageMedium != null)
710                 {
711                     settings.ImageMedium.Height = settings.ImageMedium.Width;
712                 }
713                 if (settings.ImageSmall != null)
714                 {
715                     settings.ImageSmall.Height = settings.ImageSmall.Width;
716                 }
717             }
718     
719             string defaultImage = imageEngine;
720             string imageSmall = "";
721             string imageMedium = "";
722     
723             if (settings.DisableImageEngine) 
724             {
725                 defaultImage = settings.Path;
726             } 
727             else 
728             {
729                 if (settings.ImageDefault != null)
730                 {
731                     defaultImage += Dynamicweb.Rapido.Services.Images.GetImagePathFromSettings(settings.ImageDefault);
732     
733                     if (settings.Path.GetType() != typeof(string))
734                     {
735                         defaultImage += settings.Path != null ? "Image=" + settings.Path.PathUrlEncoded : "";
736                         defaultImage += settings.Path != null ? "&" + settings.Path.GetFocalPointParameters() : "";
737                     }
738                     else
739                     {
740                         defaultImage += settings.Path != null ? "Image=" + settings.Path : "";
741                     }
742                 }
743     
744                 if (settings.ImageSmall != null)
745                 {
746                     imageSmall = "data-src-small=\"" + imageEngine;
747                     imageSmall += Dynamicweb.Rapido.Services.Images.GetImagePathFromSettings(settings.ImageSmall);
748     
749                     if (settings.Path.GetType() != typeof(string))
750                     {
751                         imageSmall += settings.Path != null ? "Image=" + settings.Path.PathUrlEncoded : "";
752                         imageSmall += settings.Path != null ? "&" + settings.Path.GetFocalPointParameters() : "";
753                     }
754                     else
755                     {
756                         imageSmall += settings.Path != null ? "Image=" + settings.Path : "";
757                     }
758     
759                     imageSmall += "\"";
760                 }
761     
762                 if (settings.ImageMedium != null)
763                 {
764                     imageMedium = "data-src-medium=\"" + imageEngine;
765                     imageMedium += Dynamicweb.Rapido.Services.Images.GetImagePathFromSettings(settings.ImageMedium);
766     
767                     if (settings.Path.GetType() != typeof(string))
768                     {
769                         imageMedium += settings.Path != null ? "Image=" + settings.Path.PathUrlEncoded : "";
770                         imageMedium += settings.Path != null ? "&" + settings.Path.GetFocalPointParameters() : "";
771                     }
772                     else
773                     {
774                         imageMedium += settings.Path != null ? "Image=" + settings.Path : "";
775                     }
776     
777                     imageMedium += "\"";
778                 }
779             }
780     
781             Dictionary<string, string> optionalAttributes = new Dictionary<string, string>();
782             if (!string.IsNullOrEmpty(settings.OnClick)) { optionalAttributes.Add("onclick", settings.OnClick); }
783             if (!string.IsNullOrEmpty(settings.Title)) 
784             { 
785                 optionalAttributes.Add("alt", settings.Title); 
786                 optionalAttributes.Add("title", settings.Title); 
787             }
788     
789             if (settings.DisableLazyLoad) 
790             {
791                 <img id="@settings.Id" class="@imageStyle @settings.CssClass dw-mod" src="@defaultImage" @ComponentMethods.AddAttributes(optionalAttributes) @ComponentMethods.AddAttributes(settings.ExtraAttributes) />
792             } 
793             else 
794             {
795                 <img id="@settings.Id" class="b-lazy @imageStyle @settings.CssClass dw-mod" src="@placeholderImage" data-src="@defaultImage" @imageSmall @imageMedium @ComponentMethods.AddAttributes(optionalAttributes) @ComponentMethods.AddAttributes(settings.ExtraAttributes) />
796             }
797         }
798     }
799     @using System.Reflection
800     @using Dynamicweb.Rapido.Blocks.Components.General
801     @using Dynamicweb.Rapido.Blocks.Components
802     
803     @* Component *@
804     
805     @helper RenderFileField(FileField settings)
806     {
807         var attributes = new Dictionary<string, string>();
808         if (string.IsNullOrEmpty(settings.Id)) 
809         {
810             settings.Id = Guid.NewGuid().ToString("N");
811         }
812         
813         if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
814         if (settings.Disabled) { attributes.Add("disabled", "true"); }
815         if (settings.Required) { attributes.Add("required", "true"); }
816         if (settings.Multiple) { attributes.Add("multiple", "true"); }
817         if (!string.IsNullOrEmpty(settings.Name)) { attributes.Add("name", settings.Name); }
818         if (string.IsNullOrEmpty(settings.ChooseFileText)) 
819         { 
820             settings.ChooseFileText = Translate("Choose file");
821         }
822         if (string.IsNullOrEmpty(settings.NoFilesChosenText)) 
823         { 
824             settings.NoFilesChosenText = Translate("No files chosen...");
825         }
826         if (!string.IsNullOrEmpty(settings.OnClick)) { attributes.Add("onclick", settings.OnClick); }
827     
828         string setValueToFakeInput = "FileUpload.setValueToFakeInput(this)";
829         attributes.Add("onchange", setValueToFakeInput + (!string.IsNullOrEmpty(settings.OnChange) ? settings.OnChange : ""));
830     
831         attributes.Add("type", "file");
832         if (!string.IsNullOrEmpty(settings.Value)) { attributes.Add("value", settings.Value); }
833         settings.CssClass = "u-full-width " + settings.CssClass;
834     
835         var resultAttributes = attributes.Concat(settings.ExtraAttributes).GroupBy(d => d.Key).ToDictionary (d => d.Key, d => d.Last().Value);
836     
837         <div class="form__field-group u-full-width @settings.WrapperCssClass dw-mod">
838             @if (!string.IsNullOrEmpty(settings.Label))
839             {
840                 <label for="@settings.Id">@settings.Label</label>
841             }
842             @if (!string.IsNullOrEmpty(settings.HelpText))
843             {
844                 <small class="form__help-text">@settings.HelpText</small>
845             }
846     
847             <div class="form__field-combi file-input u-no-margin dw-mod">
848                 <input @ComponentMethods.AddAttributes(resultAttributes) class="file-input__real-input" data-no-files-text="@settings.NoFilesChosenText" data-many-files-text="@Translate("files")" />
849                 <label for="@settings.Id" class="file-input__btn btn--secondary btn dw-mod">@settings.ChooseFileText</label>
850                 <label for="@settings.Id" class="@settings.CssClass file-input__fake-input js-fake-input dw-mod">@settings.NoFilesChosenText</label>
851                 @if (settings.UploadButton != null)
852                 {
853                     settings.UploadButton.CssClass += " btn--condensed u-no-margin";
854                     @Render(settings.UploadButton)
855                 }
856             </div>
857             @Render(new NotificationMessage { Message = settings.ErrorMessage })
858         </div>
859     }
860     @using System.Reflection
861     @using Dynamicweb.Rapido.Blocks.Components.General
862     @using Dynamicweb.Rapido.Blocks.Components
863     @using Dynamicweb.Core
864     @using System.Linq
865     
866     @* Component *@
867     
868     @helper RenderDateTimeField(DateTimeField settings)
869     {
870         if (string.IsNullOrEmpty(settings.Id)) 
871         {
872             settings.Id = Guid.NewGuid().ToString("N");
873         }
874     
875         var textField = new TextField {
876             Name = settings.Name,
877             Id = settings.Id,
878             Label = settings.Label,
879             HelpText = settings.HelpText,
880             Value = settings.Value,
881             Disabled = settings.Disabled,
882             Required = settings.Required,
883             ErrorMessage = settings.ErrorMessage,
884             CssClass = settings.CssClass,
885             WrapperCssClass = settings.WrapperCssClass,
886             OnChange = settings.OnChange,
887             OnClick = settings.OnClick,
888             ExtraAttributes = settings.ExtraAttributes,
889             //
890             Placeholder = settings.Placeholder
891         };
892     
893         @Render(textField)
894     
895         List<string> jsAttributes = new List<string>();
896     
897         jsAttributes.Add("mode: '" + Enum.GetName(typeof(DateTimeFieldMode), settings.Mode).ToLower() + "'");
898     
899         if (!string.IsNullOrEmpty(settings.DateFormat))
900         {
901             jsAttributes.Add("dateFormat: '" + settings.DateFormat + "'");
902         }
903         if (!string.IsNullOrEmpty(settings.MinDate))
904         {
905             jsAttributes.Add("minDate: '" + settings.MinDate + "'");
906         }
907         if (!string.IsNullOrEmpty(settings.MaxDate))
908         {
909             jsAttributes.Add("maxDate: '" + settings.MaxDate + "'");
910         }
911         if (settings.IsInline)
912         {
913             jsAttributes.Add("inline: " + Converter.ToString(settings.IsInline).ToLower());
914         }
915         if (settings.EnableTime)
916         {
917             jsAttributes.Add("enableTime: " + Converter.ToString(settings.EnableTime).ToLower());
918         }
919         if (settings.EnableWeekNumbers)
920         {
921             jsAttributes.Add("weekNumbers: " + Converter.ToString(settings.EnableWeekNumbers).ToLower());
922         }
923         
924         jsAttributes.AddRange(settings.GetFlatPickrOptions().Select(x => x.Key + ": " + x.Value));
925     
926         <script>
927             document.addEventListener("DOMContentLoaded", function () {
928                 flatpickr("#@textField.Id", {
929                     @string.Join(",", jsAttributes)
930                 });
931             });
932         </script>
933     }
934     @using System.Reflection
935     @using Dynamicweb.Rapido.Blocks.Components.General
936     @using Dynamicweb.Rapido.Blocks.Components
937     
938     @* Component *@
939     
940     @helper RenderTextField(TextField settings)
941     {
942         var attributes = new Dictionary<string, string>();
943         if (!string.IsNullOrEmpty(settings.Label) && string.IsNullOrEmpty(settings.Id)) 
944         {
945             settings.Id = Guid.NewGuid().ToString("N");
946         }
947     
948         /*base settings*/
949         if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
950         if (!string.IsNullOrEmpty(settings.OnClick)) { attributes.Add("onclick", settings.OnClick); }
951         if (!string.IsNullOrEmpty(settings.OnChange)) { attributes.Add("onchange", settings.OnChange); }
952         if (settings.Disabled) { attributes.Add("disabled", "true"); }
953         if (settings.Required) { attributes.Add("required", "true"); }
954         if (!string.IsNullOrEmpty(settings.Name)) { attributes.Add("name", settings.Name); }
955         /*end*/
956         
957         if (!string.IsNullOrEmpty(settings.OnKeyUp)) { attributes.Add("onkeyup", settings.OnKeyUp); }
958         if (!string.IsNullOrEmpty(settings.OnInput)) { attributes.Add("oninput", settings.OnInput); }
959         if (!string.IsNullOrEmpty(settings.OnFocus)) { attributes.Add("onfocus", settings.OnFocus); }
960         if (settings.ReadOnly) { attributes.Add("readonly", "true"); }
961         if (settings.MaxLength != 0) { attributes.Add("maxlength", settings.MaxLength.ToString()); }
962         if (!string.IsNullOrEmpty(settings.Placeholder)) { attributes.Add("placeholder", settings.Placeholder); }
963         attributes.Add("type", Enum.GetName(typeof(TextFieldType), settings.Type).ToLower());
964         if (settings.Type == TextFieldType.Password) { attributes.Add("autocomplete", "off"); };
965         if (!string.IsNullOrEmpty(settings.Value)) { attributes.Add("value", settings.Value); }
966         settings.CssClass = "u-full-width " + settings.CssClass;
967     
968         var resultAttributes = attributes.Concat(settings.ExtraAttributes).GroupBy(d => d.Key).ToDictionary (d => d.Key, d => d.Last().Value);
969     
970         string noMargin = "u-no-margin";
971         if (!settings.ReadOnly) {
972             noMargin = "";
973         }
974     
975         <div class="form__field-group u-full-width @noMargin @settings.WrapperCssClass dw-mod">
976             @if (!string.IsNullOrEmpty(settings.Label))
977             {
978                 <label for="@settings.Id">@settings.Label</label>
979             }
980             @if (!string.IsNullOrEmpty(settings.HelpText))
981             {
982                 <small class="form__help-text">@settings.HelpText</small>
983             }
984     
985             @if (settings.ActionButton != null)
986             {
987                 settings.ActionButton.CssClass += " btn--condensed u-no-margin";
988                 <div class="form__field-combi u-no-margin dw-mod">
989                     <input @ComponentMethods.AddAttributes(resultAttributes) class="@settings.CssClass dw-mod" />
990                     @Render(settings.ActionButton)
991                 </div>
992             }
993             else
994             {
995                 <input @ComponentMethods.AddAttributes(resultAttributes) class="@settings.CssClass dw-mod" />
996             }
997     
998             @Render(new NotificationMessage { Message = settings.ErrorMessage })
999         </div>
1000     }
1001     @using System.Reflection
1002     @using Dynamicweb.Rapido.Blocks.Components.General
1003     @using Dynamicweb.Rapido.Blocks.Components
1004     
1005     @* Component *@
1006     
1007     @helper RenderNumberField(NumberField settings)
1008     {
1009         var attributes = new Dictionary<string, string>();
1010         if (!string.IsNullOrEmpty(settings.Label) && string.IsNullOrEmpty(settings.Id)) 
1011         {
1012             settings.Id = Guid.NewGuid().ToString("N");
1013         }
1014     
1015         /*base settings*/
1016         if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
1017         if (!string.IsNullOrEmpty(settings.OnClick)) { attributes.Add("onclick", settings.OnClick); }
1018         if (!string.IsNullOrEmpty(settings.OnChange)) { attributes.Add("onchange", settings.OnChange); }
1019         if (settings.Disabled) { attributes.Add("disabled", "true"); }
1020         if (settings.Required) { attributes.Add("required", "true"); }
1021         if (!string.IsNullOrEmpty(settings.Name)) { attributes.Add("name", settings.Name); }
1022         /*end*/
1023     
1024         if (!string.IsNullOrEmpty(settings.OnKeyUp)) { attributes.Add("onkeyup", settings.OnKeyUp); }
1025         if (!string.IsNullOrEmpty(settings.OnInput)) { attributes.Add("oninput", settings.OnInput); }
1026         if (!string.IsNullOrEmpty(settings.OnFocus)) { attributes.Add("onfocus", settings.OnFocus); }
1027         if (settings.ReadOnly) { attributes.Add("readonly", "true"); }
1028         if (settings.Max != null) { attributes.Add("max", settings.Max.ToString()); }
1029         if (settings.Min != null) { attributes.Add("min", settings.Min.ToString()); }
1030         if (settings.Step != 0) { attributes.Add("step", settings.Step.ToString()); }
1031         if (settings.Value != null && !string.IsNullOrEmpty(settings.Value.ToString())) { attributes.Add("value", settings.Value.ToString()); }
1032         attributes.Add("type", "number");
1033     
1034         var resultAttributes = attributes.Concat(settings.ExtraAttributes).GroupBy(d => d.Key).ToDictionary (d => d.Key, d => d.Last().Value);
1035     
1036         <div class="form__field-group u-full-width @settings.WrapperCssClass dw-mod">
1037             @if (!string.IsNullOrEmpty(settings.Label))
1038             {
1039                 <label for="@settings.Id">@settings.Label</label>
1040             }
1041             @if (!string.IsNullOrEmpty(settings.HelpText))
1042             {
1043                 <small class="form__help-text">@settings.HelpText</small>
1044             }
1045     
1046             @if (settings.ActionButton != null)
1047             {
1048                 settings.ActionButton.CssClass += " btn--condensed u-no-margin";
1049                 <div class="form__field-combi u-no-margin dw-mod">
1050                     <input @ComponentMethods.AddAttributes(resultAttributes) class="@settings.CssClass dw-mod" />
1051                     @Render(settings.ActionButton)
1052                 </div>
1053             }
1054             else
1055             {
1056                 <input @ComponentMethods.AddAttributes(resultAttributes) class="@settings.CssClass dw-mod" />
1057             }
1058     
1059             @Render(new NotificationMessage { Message = settings.ErrorMessage })
1060         </div>
1061     }
1062     @using System.Reflection
1063     @using Dynamicweb.Rapido.Blocks.Components.General
1064     @using Dynamicweb.Rapido.Blocks.Components
1065     
1066     
1067     @* Component *@
1068     
1069     @helper RenderTextareaField(TextareaField settings)
1070     {
1071         Dictionary<string, string> attributes = new Dictionary<string, string>();    
1072         string id = settings.Id;
1073         if (!string.IsNullOrEmpty(settings.Label) && string.IsNullOrEmpty(id)) 
1074         {
1075             id = Guid.NewGuid().ToString("N");
1076         }
1077         
1078         if (!string.IsNullOrEmpty(id)) { attributes.Add("id", id); }
1079         if (!string.IsNullOrEmpty(settings.OnClick)) { attributes.Add("onclick", settings.OnClick); }
1080         if (!string.IsNullOrEmpty(settings.OnKeyUp)) { attributes.Add("onkeyup", settings.OnKeyUp); }
1081         if (!string.IsNullOrEmpty(settings.OnInput)) { attributes.Add("oninput", settings.OnInput); }
1082         if (!string.IsNullOrEmpty(settings.OnFocus)) { attributes.Add("onfocus", settings.OnFocus); }
1083         if (!string.IsNullOrEmpty(settings.OnChange)) { attributes.Add("onchange", settings.OnChange); }
1084         if (!string.IsNullOrEmpty(settings.Placeholder)) { attributes.Add("placeholder", settings.Placeholder); }
1085         if (settings.Disabled) { attributes.Add("disabled", "true"); }
1086         if (settings.Required) { attributes.Add("required", "true"); }
1087         if (settings.ReadOnly) { attributes.Add("readonly", "true"); }
1088         if (settings.MaxLength != 0) { attributes.Add("maxlength", settings.MaxLength.ToString()); }
1089         if (settings.Rows != 0) { attributes.Add("rows", settings.Rows.ToString()); }
1090         attributes.Add("name", settings.Name);
1091     
1092         <div class="form__field-group @settings.WrapperCssClass dw-mod">
1093             @if (!string.IsNullOrEmpty(settings.Label))
1094             {
1095                 <label for="@id">@settings.Label</label>
1096             }
1097             @if (!string.IsNullOrEmpty(settings.HelpText))
1098             {
1099                 <small class="form__help-text">@settings.HelpText</small>
1100             }
1101     
1102             <textarea class="u-full-width @settings.CssClass dw-mod" @ComponentMethods.AddAttributes(attributes) @ComponentMethods.AddAttributes(settings.ExtraAttributes)>@settings.Value</textarea>
1103     
1104             @Render(new NotificationMessage { Message = settings.ErrorMessage })
1105         </div>
1106     }
1107     @using System.Reflection
1108     @using Dynamicweb.Rapido.Blocks.Components.General
1109     @using Dynamicweb.Rapido.Blocks.Components
1110     
1111     
1112     @* Component *@
1113     
1114     @helper RenderHiddenField(HiddenField settings) {
1115         var attributes = new Dictionary<string, string>();
1116         attributes.Add("type", "hidden");
1117         if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
1118         if (!string.IsNullOrEmpty(settings.Value)) { attributes.Add("value", settings.Value); }
1119         if (!string.IsNullOrEmpty(settings.Name)) { attributes.Add("name", settings.Name); }
1120     
1121         <input @ComponentMethods.AddAttributes(attributes) @ComponentMethods.AddAttributes(settings.ExtraAttributes)/>
1122     }
1123     @using System.Reflection
1124     @using Dynamicweb.Rapido.Blocks.Components.General
1125     @using Dynamicweb.Rapido.Blocks.Components
1126     
1127     @* Component *@
1128     
1129     @helper RenderCheckboxField(CheckboxField settings)
1130     {
1131         var attributes = new Dictionary<string, string>();
1132         if (!string.IsNullOrEmpty(settings.Label) && string.IsNullOrEmpty(settings.Id)) 
1133         {
1134             settings.Id = Guid.NewGuid().ToString("N");
1135         }
1136         
1137         /*base settings*/
1138         if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
1139         if (!string.IsNullOrEmpty(settings.OnClick)) { attributes.Add("onclick", settings.OnClick); }
1140         if (!string.IsNullOrEmpty(settings.OnChange)) { attributes.Add("onchange", settings.OnChange); }
1141         if (settings.Disabled) { attributes.Add("disabled", "true"); }
1142         if (settings.Required) { attributes.Add("required", "true"); }
1143         if (!string.IsNullOrEmpty(settings.Name)) { attributes.Add("name", settings.Name); }
1144         /*end*/
1145         
1146         attributes.Add("type", "checkbox");
1147         if (settings.Checked) { attributes.Add("checked", "true"); }
1148         settings.CssClass = "form__control " + settings.CssClass;
1149         if (!string.IsNullOrEmpty(settings.Value)) { attributes.Add("value", settings.Value); }
1150     
1151         var resultAttributes = attributes.Concat(settings.ExtraAttributes).GroupBy(d => d.Key).ToDictionary (d => d.Key, d => d.Last().Value);
1152     
1153         <div class="form__field-group @settings.WrapperCssClass dw-mod">
1154             <input @ComponentMethods.AddAttributes(resultAttributes) class="@settings.CssClass dw-mod" />
1155             @if (!string.IsNullOrEmpty(settings.Label))
1156             {
1157                 <label for="@settings.Id" class="dw-mod">@settings.Label</label>
1158             }
1159             @if (!string.IsNullOrEmpty(settings.HelpText))
1160             {
1161                 <small class="form__help-text">@settings.HelpText</small>
1162             }
1163             @Render(new NotificationMessage { Message = settings.ErrorMessage })
1164         </div>
1165     }
1166     @using System.Reflection
1167     @using Dynamicweb.Rapido.Blocks.Components.General
1168     @using Dynamicweb.Rapido.Blocks.Components
1169     
1170     
1171     @* Component *@
1172     
1173     @helper RenderCheckboxListField(CheckboxListField settings)
1174     {
1175         <div class="form__field-group @settings.WrapperCssClass u-margin-bottom dw-mod" @ComponentMethods.AddAttributes(settings.ExtraAttributes)>
1176             @if (!string.IsNullOrEmpty(settings.Label))
1177             {
1178                 <label>@settings.Label</label>
1179             }
1180             @if (!string.IsNullOrEmpty(settings.HelpText))
1181             {
1182                 <small class="form__help-text">@settings.HelpText</small>
1183             }
1184     
1185             @foreach (var item in settings.Options)
1186             {
1187                 if (settings.Required)
1188                 {
1189                     item.Required = true;
1190                 }
1191                 if (settings.Disabled)
1192                 {
1193                     item.Disabled = true;
1194                 }
1195                 if (!string.IsNullOrEmpty(settings.Name))
1196                 {
1197                     item.Name = settings.Name;
1198                 }
1199                 if (!string.IsNullOrEmpty(settings.CssClass))
1200                 {
1201                     item.CssClass += settings.CssClass;
1202                 }
1203     
1204                 /* value is not supported */
1205     
1206                 if (!string.IsNullOrEmpty(settings.OnClick))
1207                 {
1208                     item.OnClick += settings.OnClick;
1209                 }
1210                 if (!string.IsNullOrEmpty(settings.OnChange))
1211                 {
1212                     item.OnChange += settings.OnChange;
1213                 }
1214                 @Render(item)
1215             }
1216     
1217             @Render(new NotificationMessage { Message = settings.ErrorMessage })
1218         </div>
1219     }
1220     @using System.Reflection
1221     @using Dynamicweb.Rapido.Blocks.Components.General
1222     @using Dynamicweb.Rapido.Blocks.Components
1223     
1224     
1225     @* Component *@
1226     
1227     @helper RenderSelectField(SelectField settings)
1228     {
1229         if (!string.IsNullOrEmpty(settings.Label) && string.IsNullOrEmpty(settings.Id))
1230         {
1231             settings.Id = Guid.NewGuid().ToString("N");
1232         }
1233     
1234         <div class="form__field-group u-full-width @settings.WrapperCssClass dw-mod">
1235             @if (!string.IsNullOrEmpty(settings.Label))
1236             {
1237                 <label for="@settings.Id">@settings.Label</label>
1238             }
1239             @if (!string.IsNullOrEmpty(settings.HelpText))
1240             {
1241                 <small class="form__help-text">@settings.HelpText</small>
1242             }
1243     
1244             @if (settings.ActionButton != null)
1245             {
1246                 settings.ActionButton.CssClass += " btn--condensed u-no-margin";
1247                 <div class="form__field-combi u-no-margin dw-mod">
1248                     @RenderSelectBase(settings)
1249                     @Render(settings.ActionButton)
1250                 </div>
1251             }
1252             else
1253             {
1254                 @RenderSelectBase(settings)
1255             }
1256     
1257             @Render(new NotificationMessage { Message = settings.ErrorMessage })
1258         </div>
1259     }
1260     
1261     @helper RenderSelectBase(SelectField settings)
1262     {
1263         var attributes = new Dictionary<string, string>();
1264     
1265         /*base settings*/
1266         if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
1267         if (!string.IsNullOrEmpty(settings.OnClick)) { attributes.Add("onclick", settings.OnClick); }
1268         if (!string.IsNullOrEmpty(settings.OnChange)) { attributes.Add("onchange", settings.OnChange); }
1269         if (settings.Disabled) { attributes.Add("disabled", "true"); }
1270         if (settings.Required) { attributes.Add("required", "true"); }
1271         if (!string.IsNullOrEmpty(settings.Name)) { attributes.Add("name", settings.Name); }
1272         /*end*/
1273     
1274         var resultAttributes = attributes.Concat(settings.ExtraAttributes).GroupBy(d => d.Key).ToDictionary (d => d.Key, d => d.Last().Value);
1275     
1276         <select @ComponentMethods.AddAttributes(resultAttributes) class="u-full-width @settings.CssClass dw-mod">
1277             @if (settings.Default != null)
1278             {
1279                 @Render(settings.Default)
1280             }
1281     
1282             @foreach (var item in settings.Options)
1283             {
1284                 if (!string.IsNullOrEmpty(settings.Value)) {
1285                     item.Checked = item.Value == settings.Value;
1286                 }
1287                 @Render(item)
1288             }
1289         </select>
1290     }
1291     @using System.Reflection
1292     @using Dynamicweb.Rapido.Blocks.Components.General
1293     @using Dynamicweb.Rapido.Blocks.Components
1294     
1295     @* Component *@
1296     
1297     @helper RenderRadioButtonField(RadioButtonField settings)
1298     {
1299         var attributes = new Dictionary<string, string>();
1300         if (!string.IsNullOrEmpty(settings.Label) && string.IsNullOrEmpty(settings.Id)) 
1301         {
1302             settings.Id = Guid.NewGuid().ToString("N");
1303         }
1304     
1305         /*base settings*/
1306         if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
1307         if (!string.IsNullOrEmpty(settings.OnClick)) { attributes.Add("onclick", settings.OnClick); }
1308         if (!string.IsNullOrEmpty(settings.OnChange)) { attributes.Add("onchange", settings.OnChange); }
1309         if (settings.Disabled) { attributes.Add("disabled", "true"); }
1310         if (settings.Required) { attributes.Add("required", "true"); }
1311         if (!string.IsNullOrEmpty(settings.Name)) { attributes.Add("name", settings.Name); }
1312         /*end*/
1313         
1314         attributes.Add("type", "radio");
1315         if (settings.Checked) { attributes.Add("checked", "true"); }
1316         settings.CssClass = "form__control " + settings.CssClass;
1317         if (!string.IsNullOrEmpty(settings.Value)) { attributes.Add("value", settings.Value); }
1318     
1319         var resultAttributes = attributes.Concat(settings.ExtraAttributes).GroupBy(d => d.Key).ToDictionary (d => d.Key, d => d.Last().Value);
1320     
1321         <div class="form__field-group @settings.WrapperCssClass dw-mod">
1322             <input @ComponentMethods.AddAttributes(resultAttributes) class="@settings.CssClass dw-mod" />
1323             @if (!string.IsNullOrEmpty(settings.Label))
1324             {
1325                 <label for="@settings.Id" class="dw-mod">@settings.Label</label>
1326             }
1327             @if (!string.IsNullOrEmpty(settings.HelpText))
1328             {
1329                 <small class="form__help-text">@settings.HelpText</small>
1330             }
1331             @Render(new NotificationMessage { Message = settings.ErrorMessage })
1332         </div>
1333     }
1334     @using System.Reflection
1335     @using Dynamicweb.Rapido.Blocks.Components.General
1336     @using Dynamicweb.Rapido.Blocks.Components
1337     
1338     
1339     @* Component *@
1340     
1341     @helper RenderRadioButtonListField(RadioButtonListField settings)
1342     {
1343         <div class="form__field-group @settings.WrapperCssClass u-margin-bottom dw-mod" @ComponentMethods.AddAttributes(settings.ExtraAttributes)>
1344             @if (!string.IsNullOrEmpty(settings.Label))
1345             {
1346                 <label>@settings.Label</label>
1347             }
1348             @if (!string.IsNullOrEmpty(settings.HelpText))
1349             {
1350                 <small class="form__help-text">@settings.HelpText</small>
1351             }
1352     
1353             @foreach (var item in settings.Options)
1354             {
1355                 if (settings.Required)
1356                 {
1357                     item.Required = true;
1358                 }
1359                 if (settings.Disabled)
1360                 {
1361                     item.Disabled = true;
1362                 }
1363                 if (!string.IsNullOrEmpty(settings.Name))
1364                 {
1365                     item.Name = settings.Name;
1366                 }
1367                 if (!string.IsNullOrEmpty(settings.Value) && settings.Value == item.Value)
1368                 {
1369                     item.Checked = true;
1370                 }
1371                 if (!string.IsNullOrEmpty(settings.OnClick))
1372                 {
1373                     item.OnClick += settings.OnClick;
1374                 }
1375                 if (!string.IsNullOrEmpty(settings.OnChange))
1376                 {
1377                     item.OnChange += settings.OnChange;
1378                 }
1379                 if (!string.IsNullOrEmpty(settings.CssClass))
1380                 {
1381                     item.CssClass += settings.CssClass;
1382                 }
1383                 @Render(item)
1384             }
1385     
1386             @Render(new NotificationMessage { Message = settings.ErrorMessage })
1387         </div>
1388     }
1389     @using System.Reflection
1390     @using Dynamicweb.Rapido.Blocks.Components.General
1391     @using Dynamicweb.Rapido.Blocks.Components
1392     
1393     
1394     @* Component *@
1395     
1396     @helper RenderNotificationMessage(NotificationMessage settings)
1397     {
1398         if (!string.IsNullOrEmpty(settings.Message))
1399         {
1400             var attributes = new Dictionary<string, string>();
1401             if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
1402     
1403             string messageTypeClass = Enum.GetName(typeof(NotificationMessageType), settings.MessageType).ToLower();
1404             <div class="field-@messageTypeClass @settings.CssClass u-full-width dw-mod" @ComponentMethods.AddAttributes(attributes)>@settings.Message</div>
1405         }
1406     }
1407     @using Dynamicweb.Rapido.Blocks.Components.General
1408     
1409     
1410     @* Component *@
1411     
1412     @helper RenderHandlebarsRoot(HandlebarsRoot settings) {
1413         string preRender = !String.IsNullOrEmpty(settings.PreRenderScriptTemplate) ? "data-pre-render-template=\"" + settings.PreRenderScriptTemplate + "\"" : "";
1414     
1415         <div class="@settings.CssClass dw-mod js-handlebars-root" id="@settings.Id" data-template="@settings.ScriptTemplate" data-json-feed="@settings.FeedUrl" data-init-onload="@settings.InitOnLoad.ToString()" data-preloader="@settings.Preloader" @preRender>
1416             @if (settings.SubBlocks != null) {
1417                 @RenderBlockList(settings.SubBlocks)
1418             }
1419         </div>
1420     }
1421     @using System.Reflection
1422     @using Dynamicweb.Rapido.Blocks.Components.General
1423     @using Dynamicweb.Rapido.Blocks.Components
1424     @using System.Text.RegularExpressions
1425     
1426     
1427     @* Component *@
1428     
1429     @helper RenderSticker(Sticker settings) {
1430         if (!String.IsNullOrEmpty(settings.Title)) {
1431             string size = settings.Size.ToString() != "None" ? "" + "stickers-container__tag--" + settings.Size.ToString().ToLower() : "";
1432             string style = settings.Style.ToString() != "None" ? "" + "stickers-container__tag--" + settings.Style.ToString().ToLower() : "";
1433     
1434             Dictionary<String, String> optionalAttributes = new Dictionary<string, string>();
1435             if (!String.IsNullOrEmpty(settings.Color) || !String.IsNullOrEmpty(settings.BackgroundColor)) {
1436                 string styleTag = !String.IsNullOrEmpty(settings.Color) ? "color: " + settings.Color + "; " : "";
1437                 styleTag += !String.IsNullOrEmpty(settings.BackgroundColor) ? "background-color: " + settings.BackgroundColor + "; " : "";
1438                 optionalAttributes.Add("style", styleTag);
1439             }
1440     
1441             <div class="stickers-container__tag @size @style @settings.CssClass dw-mod">@settings.Title</div>   
1442         }
1443     }
1444     
1445     @using System.Reflection
1446     @using Dynamicweb.Rapido.Blocks.Components.General
1447     @using Dynamicweb.Rapido.Blocks.Components
1448     
1449     
1450     @* Component *@
1451     
1452     @helper RenderStickersCollection(StickersCollection settings)
1453     {
1454         if (settings.Stickers.Count > 0) 
1455         {
1456             string position = "stickers-container--" + Regex.Replace(settings.Position.ToString(), "([a-z])([A-Z])", "$1-$2").ToLower();
1457     
1458             <div class="stickers-container @position @settings.CssClass dw-mod" @ComponentMethods.AddAttributes(settings.ExtraAttributes)>
1459                 @foreach (Sticker sticker in settings.Stickers)
1460                 {
1461                     @Render(sticker)
1462                 }
1463             </div> 
1464         }
1465     }
1466     
1467     @using Dynamicweb.Rapido.Blocks.Components.General
1468     
1469     
1470     @* Component *@
1471     
1472     @helper RenderForm(Form settings) {
1473         if (settings != null)
1474         {
1475             Dictionary<string, string> optionalAttributes = new Dictionary<string, string>();
1476             if (!string.IsNullOrEmpty(settings.Action)) { optionalAttributes.Add("action", settings.Action); };
1477             if (!string.IsNullOrEmpty(settings.Name)) { optionalAttributes.Add("name", settings.Name); };
1478             if (!string.IsNullOrEmpty(settings.OnSubmit)) { optionalAttributes.Add("onsubmit", settings.OnSubmit); };
1479             var enctypes = new Dictionary<string, string>
1480             {
1481                 { "multipart", "multipart/form-data" },
1482                 { "text", "text/plain" },
1483                 { "application", "application/x-www-form-urlencoded" }
1484             };
1485             if (settings.Enctype != FormEnctype.none) { optionalAttributes.Add("enctype", enctypes[Enum.GetName(typeof(FormEnctype), settings.Enctype).ToLower()]); };
1486             optionalAttributes.Add("method", settings.Method.ToString());
1487     
1488             if (!string.IsNullOrEmpty(settings.FormStartMarkup))
1489             {
1490                 @settings.FormStartMarkup
1491             }
1492             else
1493             {
1494                 @:<form class="@settings.CssClass u-no-margin dw-mod" @ComponentMethods.AddAttributes(optionalAttributes) @ComponentMethods.AddAttributes(settings.ExtraAttributes)>
1495             }
1496     
1497             foreach (var field in settings.GetFields())
1498             {
1499                 @Render(field)
1500             }
1501     
1502             @:</form>
1503         }
1504     }
1505     @using System.Reflection
1506     @using Dynamicweb.Rapido.Blocks.Components.General
1507     @using Dynamicweb.Rapido.Blocks.Components
1508     
1509     
1510     @* Component *@
1511     
1512     @helper RenderText(Text settings)
1513     {
1514         @settings.Content 
1515     }
1516     @using System.Reflection
1517     @using Dynamicweb.Rapido.Blocks.Components.General
1518     @using Dynamicweb.Rapido.Blocks.Components
1519     
1520     
1521     @* Component *@
1522     
1523     @helper RenderContentModule(ContentModule settings) {
1524         if (!string.IsNullOrEmpty(settings.Content))
1525         {
1526             @settings.Content 
1527         } 
1528     }
1529     @using System.Reflection
1530     @using Dynamicweb.Rapido.Blocks.Components.General
1531     @using Dynamicweb.Rapido.Blocks.Components
1532     
1533     
1534     @* Component *@
1535     
1536     @helper RenderModal(Modal settings) {
1537         if (settings != null)
1538         {
1539             string modalId = !string.IsNullOrEmpty(settings.Id) ? settings.Id : Guid.NewGuid().ToString("N");
1540     
1541             string onchange = !string.IsNullOrEmpty(settings.OnClose) ? "onchange=\"if(!this.checked){" + settings.OnClose + "}\"" : "";
1542     
1543             <input type="checkbox" id="@(modalId)ModalTrigger" class="modal-trigger" @onchange />
1544     
1545             <div class="modal-container" id="modal-container-@(modalId)">
1546                 @if (!settings.DisableDarkOverlay)
1547                 {
1548                     <label for="@(modalId)ModalTrigger" id="@(modalId)ModalOverlay" class="modal-overlay"></label>
1549                 }
1550                 <div class="modal modal--@settings.Width.ToString().ToLower() modal-height--@settings.Height.ToString().ToLower()" id="@(modalId)Modal">
1551                     @if (settings.Heading != null)
1552                     {
1553                         if (!string.IsNullOrEmpty(settings.Heading.Title))
1554                         {
1555                             <div class="modal__header">
1556                                 @Render(settings.Heading)
1557                             </div>
1558                         }
1559                     }
1560                     <div class="modal__body @(settings.Width.ToString().ToLower() == "full" ? "modal__body--full" : "")">
1561                         @if (!string.IsNullOrEmpty(settings.BodyText))
1562                         {
1563                             @settings.BodyText
1564                         }
1565                         @if (settings.BodyTemplate != null)
1566                         {
1567                             @settings.BodyTemplate
1568                         }
1569                         @{
1570                             var actions = settings.GetActions();
1571                         }
1572                     </div>
1573                     @if (actions.Length > 0)
1574                     {
1575                         <div class="modal__footer">
1576                             @foreach (var action in actions)
1577                             {
1578                                 action.CssClass += " u-no-margin";
1579                                 @Render(action)
1580                             }
1581                         </div>
1582                     }
1583                     <label class="modal__close-btn" for="@(modalId)ModalTrigger"></label>
1584                 </div>
1585             </div>
1586         } 
1587     }
1588     @using Dynamicweb.Rapido.Blocks.Components.General
1589     
1590     @* Component *@
1591     
1592     @helper RenderMediaListItem(MediaListItem settings)
1593     {
1594         <div class="media-list-item @settings.CssClass dw-mod" @(!string.IsNullOrEmpty(settings.Id) ? "id=\"" + settings.Id + "\"" : "")>
1595             @if (!string.IsNullOrEmpty(settings.Label))
1596             {
1597                 if (!string.IsNullOrEmpty(settings.Link))
1598                 {
1599                     @Render(new Link
1600                     {
1601                         Href = settings.Link,
1602                         CssClass = "media-list-item__sticker dw-mod",
1603                         ButtonLayout = ButtonLayout.None,
1604                         Title = settings.Label,
1605                         OnClick = !string.IsNullOrEmpty(settings.OnClick) ? settings.OnClick : ""
1606                     })
1607                 }
1608                 else if (!string.IsNullOrEmpty(settings.OnClick))
1609                 {
1610                     <span class="media-list-item__sticker dw-mod" onclick="@(settings.OnClick)">
1611                         <span class="u-uppercase">@settings.Label</span>
1612                     </span>
1613                 }
1614                 else
1615                 {
1616                     <span class="media-list-item__sticker media-list-item__sticker--no-link dw-mod">
1617                         <span class="u-uppercase">@settings.Label</span>
1618                     </span>
1619                 }
1620             }
1621             <div class="media-list-item__wrap">
1622                 <div class="media-list-item__info dw-mod">
1623                     <div class="media-list-item__header dw-mod">
1624                         @if (!string.IsNullOrEmpty(settings.Title))
1625                         {
1626                             if (!string.IsNullOrEmpty(settings.Link))
1627                             {
1628                                 @Render(new Link
1629                                 {
1630                                     Href = settings.Link,
1631                                     CssClass = "media-list-item__name dw-mod",
1632                                     ButtonLayout = ButtonLayout.None,
1633                                     Title = settings.Title,
1634                                     OnClick = !string.IsNullOrEmpty(settings.OnClick) ? settings.OnClick : ""
1635                                 })
1636                             }
1637                             else if (!string.IsNullOrEmpty(settings.OnClick))
1638                             {
1639                                 <span class="media-list-item__name dw-mod" onclick="@(settings.OnClick)">@settings.Title</span>
1640                             }
1641                             else
1642                             {
1643                                 <span class="media-list-item__name media-list-item__name--no-link dw-mod">@settings.Title</span>
1644                             }
1645                         }
1646     
1647                         @if (!string.IsNullOrEmpty(settings.Status))
1648                         {
1649                             <div class="media-list-item__state dw-mod">@settings.Status</div>
1650                         }
1651                     </div>
1652                     @{
1653                         settings.InfoTable.CssClass += " media-list-item__parameters-table";
1654                     }
1655                 
1656                     @Render(settings.InfoTable)
1657                 </div>
1658                 <div class="media-list-item__actions dw-mod">
1659                     <div class="media-list-item__actions-list dw-mod">
1660                         @{
1661                             var actions = settings.GetActions();
1662     
1663                             foreach (ButtonBase action in actions)
1664                             {
1665                                 action.ButtonLayout = ButtonLayout.None;
1666                                 action.CssClass += " media-list-item__action link";
1667     
1668                                 @Render(action)
1669                             }
1670                         }
1671                     </div>
1672     
1673                     @if (settings.SelectButton != null && !string.IsNullOrEmpty(settings.SelectButton.Title))
1674                     {
1675                         settings.SelectButton.CssClass += " u-no-margin";
1676     
1677                         <div class="media-list-item__action-button">
1678                             @Render(settings.SelectButton)
1679                         </div>
1680                     }
1681                 </div>
1682             </div>
1683         </div>
1684     }
1685     @using Dynamicweb.Rapido.Blocks.Components.General
1686     @using Dynamicweb.Rapido.Blocks.Components
1687     
1688     @helper RenderTable(Table settings)
1689     {
1690         Dictionary<string, string> attributes = new Dictionary<string, string>();
1691         if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
1692         
1693         var enumToClasses = new Dictionary<TableDesign, string> 
1694         {
1695             { TableDesign.Clean, "table--clean" },
1696             { TableDesign.Bordered, "table--bordered" },
1697             { TableDesign.Striped, "table--striped" },
1698             { TableDesign.Hover, "table--hover" },
1699             { TableDesign.Compact, "table--compact" },
1700             { TableDesign.Condensed, "table--condensed" },
1701             { TableDesign.NoTopBorder, "table--no-top-border" }
1702         };
1703         string tableDesignClass = "";
1704         if (settings.Design != TableDesign.None) 
1705         {
1706             tableDesignClass = enumToClasses[settings.Design];
1707         }
1708     
1709         if (!string.IsNullOrEmpty(settings.CssClass) || settings.Design != TableDesign.None) { attributes.Add("class", "table " + tableDesignClass + " " + settings.CssClass + " dw-mod"); }
1710         
1711         var resultAttributes = attributes.Concat(settings.ExtraAttributes).GroupBy(d => d.Key).ToDictionary(d => d.Key, d => d.Last().Value);
1712     
1713         <table @ComponentMethods.AddAttributes(resultAttributes)>
1714             @if (settings.Header != null)
1715             {
1716                 <thead>
1717                     @Render(settings.Header)
1718                 </thead>
1719             }
1720             <tbody>
1721                 @foreach (var row in settings.Rows)
1722                 {
1723                     @Render(row)
1724                 }
1725             </tbody>
1726             @if (settings.Footer != null)
1727             {
1728                 <tfoot>
1729                     @Render(settings.Footer)
1730                 </tfoot>
1731             }
1732         </table>
1733     }
1734     @using Dynamicweb.Rapido.Blocks.Components.General
1735     @using Dynamicweb.Rapido.Blocks.Components
1736     
1737     @helper RenderTableRow(TableRow settings)
1738     {
1739         Dictionary<string, string> attributes = new Dictionary<string, string>();
1740         if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
1741         
1742         var enumToClasses = new Dictionary<TableRowDesign, string> 
1743         {
1744             { TableRowDesign.NoBorder, "table__row--no-border" },
1745             { TableRowDesign.Border, "table__row--border" },
1746             { TableRowDesign.TopBorder, "table__row--top-line" },
1747             { TableRowDesign.BottomBorder, "table__row--bottom-line" },
1748             { TableRowDesign.Solid, "table__row--solid" }
1749         };
1750     
1751         string tableRowDesignClass = "";
1752         if (settings.Design != TableRowDesign.None) 
1753         {
1754             tableRowDesignClass = enumToClasses[settings.Design];
1755         }
1756     
1757         if (!string.IsNullOrEmpty(settings.CssClass) || settings.Design != TableRowDesign.None) { attributes.Add("class", "table__row " + tableRowDesignClass + " " + settings.CssClass + " dw-mod"); }
1758     
1759         var resultAttributes = attributes.Concat(settings.ExtraAttributes).GroupBy(d => d.Key).ToDictionary(d => d.Key, d => d.Last().Value);
1760     
1761         <tr @ComponentMethods.AddAttributes(resultAttributes)>
1762             @foreach (var cell in settings.Cells)
1763             {
1764                 if (settings.IsHeaderRow)
1765                 {
1766                     cell.IsHeader = true;
1767                 }
1768                 @Render(cell)
1769             }
1770         </tr>
1771     }
1772     @using Dynamicweb.Rapido.Blocks.Components.General
1773     @using Dynamicweb.Rapido.Blocks.Components
1774     @using Dynamicweb.Core
1775     
1776     @helper RenderTableCell(TableCell settings)
1777     {
1778         Dictionary<string, string> attributes = new Dictionary<string, string>();
1779         if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
1780         if (settings.Colspan != 0) { attributes.Add("colspan", Converter.ToString(settings.Colspan)); }
1781         if (settings.Rowspan != 0) { attributes.Add("rowspan", Converter.ToString(settings.Rowspan)); }
1782         if (!string.IsNullOrEmpty(settings.CssClass)) { attributes.Add("class", settings.CssClass + " dw-mod"); }
1783     
1784         var resultAttributes = attributes.Concat(settings.ExtraAttributes).GroupBy(d => d.Key).ToDictionary(d => d.Key, d => d.Last().Value);
1785     
1786         string tagName = settings.IsHeader ? "th" : "td";
1787     
1788         @("<" + tagName + " " + ComponentMethods.AddAttributes(resultAttributes) + ">")
1789             @settings.Content
1790         @("</" + tagName + ">");
1791     }
1792     @using System.Linq
1793     @using Dynamicweb.Rapido.Blocks.Components.General
1794     
1795     @* Component *@
1796     
1797     @helper RenderPagination(Dynamicweb.Rapido.Blocks.Components.General.Pagination settings)
1798     {
1799         var pageNumberQueryStringName = Dynamicweb.Rapido.Services.Pagination.GetPageNumberQueryStringName(settings);    // Get the proper 'page number' query string parameter
1800         var queryParameters = Dynamicweb.Rapido.Services.Url.GetQueryParameters(pageNumberQueryStringName);              // Get the NameValueCollection from the querystring
1801     
1802         if (settings.NumberOfPages > 1)
1803         {
1804             string url = HttpContext.Current.Request.Url.GetLeftPart(UriPartial.Authority) + "/Default.aspx";
1805             string ariaLabel = !string.IsNullOrWhiteSpace(settings.AriaLabel) ? settings.AriaLabel : Translate("Page navigation");
1806             Dictionary<string, int> startAndEndPageNumber = Dynamicweb.Rapido.Services.Pagination.GetStartAndEndPageNumber(settings);
1807     
1808             <div class="pager u-margin-top dw-mod @settings.CssClass" aria-label="@ariaLabel">
1809                 @if (settings.ShowPagingInfo)
1810                 {
1811                     <div class="pager__info dw-mod">
1812                         @Translate("Page") @settings.CurrentPageNumber @Translate("of") @settings.NumberOfPages
1813                     </div>
1814                 }
1815                 <ul class="pager__list dw-mod">
1816                     @if (!string.IsNullOrWhiteSpace(settings.FirstPageUrl) && settings.ShowFirstAndLastControls)
1817                     {
1818                         @Render(new PaginationItem { Link = settings.FirstPageUrl, Icon = settings.FirstIcon })
1819                     }
1820                     @if (!string.IsNullOrWhiteSpace(settings.PreviousPageUrl) && settings.ShowNextAndPrevControls)
1821                     {
1822                         @Render(new PaginationItem { Link = settings.PreviousPageUrl, Icon = settings.PrevIcon })
1823                     }
1824                     @if (settings.GetPages().Any())
1825                     {
1826                         foreach (var page in settings.GetPages())
1827                         {
1828                             @Render(page)
1829                         }
1830                     }
1831                     else
1832                     {
1833                         for (var page = startAndEndPageNumber["StartPage"]; page <= startAndEndPageNumber["EndPage"]; page++)
1834                         {
1835                             queryParameters = Dynamicweb.Rapido.Services.Url.UpdateQueryStringParameter(queryParameters, pageNumberQueryStringName, page.ToString());
1836                             @Render(new PaginationItem { Label = page.ToString(), Link = Dynamicweb.Rapido.Services.Url.BuildUri(url, queryParameters).PathAndQuery, IsActive = (settings.CurrentPageNumber == page) });
1837                         }
1838                     }
1839                     @if (!string.IsNullOrWhiteSpace(settings.NextPageUrl) && settings.ShowNextAndPrevControls)
1840                     {
1841                         @Render(new PaginationItem { Link = settings.NextPageUrl, Icon = settings.NextIcon })
1842                     }
1843                     @if (!string.IsNullOrWhiteSpace(settings.LastPageUrl) && settings.ShowFirstAndLastControls)
1844                     {
1845                         @Render(new PaginationItem { Link = settings.LastPageUrl, Icon = settings.LastIcon })
1846                     }
1847                 </ul>
1848             </div>
1849         }
1850     }
1851     
1852     @helper RenderPaginationItem(PaginationItem settings)
1853     {
1854         if (settings.Icon == null)
1855         {
1856             settings.Icon = new Icon();
1857         }
1858     
1859         settings.Icon.Label = settings.Label;
1860         <li class="pager__btn dw-mod">
1861             @if (settings.IsActive)
1862             {
1863                 <span class="pager__num pager__num--current dw-mod">
1864                     @Render(settings.Icon)
1865                 </span>
1866             }
1867             else
1868             {
1869                 <a href="@settings.Link" class="pager__num dw-mod">
1870                     @Render(settings.Icon)
1871                 </a>
1872             }
1873         </li>
1874     }
1875     
1876     
1877     @using Dynamicweb.Rapido.Blocks.Components.General
1878     @using Dynamicweb.Rapido.Blocks.Components.Ecommerce
1879     
1880     
1881     
1882     @* Include the basic, re-used, paragraph initializer *@
1883     @inherits Dynamicweb.Rendering.ViewModelTemplate<Dynamicweb.Frontend.ParagraphViewModel>
1884     @using Dynamicweb.Frontend
1885     @using Dynamicweb.Rapido.Blocks.Components.General
1886     @using Dynamicweb.Rapido.Blocks.Components
1887     
1888     @functions {
1889         public class ContentParagraph
1890         {
1891             public string Title { get; set; }
1892             public Image Image { get; set; }
1893             public string Text { get; set; }
1894             public string Link { get; set; }
1895             public bool SetImageAsBackground { get; set; }
1896             public bool HideOuterPadding { get; set; }
1897             public string InnerPaddingCss { get; set; }
1898             public string CardCss { get; set; }
1899             public string ButtonWrapperCss { get; set; }
1900             public string Layout { get; set; }
1901             public string Module { get; set; }
1902             public Link ButtonPrimary { get; set; }
1903             public Link ButtonSecondary { get; set; }
1904         }
1905     }
1906     
1907     @helper RenderParagraph(ItemViewModel item, bool renderModule = true)
1908     {
1909         if (item != null) {
1910             string layout = item.GetList("ContentPositions").SelectedValue;
1911     
1912             string paragraphClasses = "";
1913             string paragraphWidth = !String.IsNullOrEmpty(item.GetString("Width")) ? item.GetList("Width").SelectedValue : "12";
1914             paragraphClasses += " grid__col-lg-" + paragraphWidth + " grid__col-md-" + paragraphWidth + " grid__col-sm-" + paragraphWidth;
1915             if (item.GetList("WidthMobile").SelectedValue == "hide")
1916             {
1917                 paragraphClasses += " u-hidden-xs";
1918             }
1919             else
1920             {
1921                 paragraphClasses += " grid__col-xs-" + item.GetList("WidthMobile").SelectedValue;
1922             }
1923             paragraphClasses += item.GetBoolean("HidePadding") ? " paragraph-container--no-padding" : "";
1924             paragraphClasses += layout == "middle-center" || layout == "middle-left" ? " u-middle-horizontal grid--justify-center grid--align-self-center" : "";
1925     
1926             //Alternative Design Layout
1927             var designLayout = Model.Item.GetItem("CustomSettings") != null ? Model.Item.GetItem("CustomSettings").GetString("DesignLayout") != null ? Model.Item.GetItem("CustomSettings").GetList("DesignLayout").SelectedValue : "" : "";
1928             paragraphClasses += !String.IsNullOrEmpty(designLayout) ? designLayout : "";
1929     
1930             string title = item.GetBoolean("ShowTitle") ? item.GetString("Title") : "";
1931             string cardClass = item.GetBoolean("ShowAsCard") ? "paragraph-card" : "";
1932             string buttonSpacing = "";
1933             string buttonAlignment = layout == "all-centered" || layout == "middle-center" ? "grid--justify-center" : "";
1934     
1935             string image = item.GetFile("Image") != null ? item.GetFile("Image").ToString() + "&" + item.GetFile("Image").GetFocalPointParameters() : "";
1936             int cropMode = !String.IsNullOrEmpty(Converter.ToString(item.GetList("ImageCrop"))) ? Convert.ToInt32(item.GetList("ImageCrop").SelectedValue) : 0;
1937             ImageStyle imageStyle = item.GetList("ImageStyle").SelectedValue == "ball" ? ImageStyle.Ball : ImageStyle.None;
1938             ButtonLayout primaryButtonLayout = !String.IsNullOrEmpty(item.GetList("ButtonDesign").SelectedValue) ? (ButtonLayout)System.Enum.Parse(typeof(ButtonLayout), char.ToUpper(item.GetList("ButtonDesign").SelectedValue[0]) + item.GetList("ButtonDesign").SelectedValue.Substring(1)) : ButtonLayout.Primary;
1939             if (primaryButtonLayout == ButtonLayout.Link)
1940             {
1941                 primaryButtonLayout = ButtonLayout.LinkClean;
1942             }
1943             ButtonLayout secondaryButtonLayout = !String.IsNullOrEmpty(item.GetList("SecondaryButtonDesign").SelectedValue) ? (ButtonLayout)System.Enum.Parse(typeof(ButtonLayout), char.ToUpper(item.GetList("SecondaryButtonDesign").SelectedValue[0]) + item.GetList("SecondaryButtonDesign").SelectedValue.Substring(1)) : ButtonLayout.Secondary;
1944             if (secondaryButtonLayout == ButtonLayout.Link)
1945             {
1946                 secondaryButtonLayout = ButtonLayout.LinkClean;
1947             }
1948             ImageFilter primaryImageFilter = !string.IsNullOrEmpty(item.GetList("ImageFilterPrimary").SelectedValue) ? (ImageFilter) Enum.Parse(typeof(ImageFilter), item.GetList("ImageFilterPrimary").SelectedValue.Replace("-", ""), true) : ImageFilter.None;
1949             ImageFilter secondaryImageFilter = !string.IsNullOrEmpty(item.GetList("ImageFilterSecondary").SelectedValue) ? (ImageFilter) Enum.Parse(typeof(ImageFilter), item.GetList("ImageFilterSecondary").SelectedValue.Replace("-", ""), true) : ImageFilter.None;
1950             string imageFilterColorCode = item.GetString("ColorForTheFilter").StartsWith("#") && primaryImageFilter == ImageFilter.Colorize ? GenerateRgba(item.GetString("ColorForTheFilter"), 0.3) : "";
1951             bool setImageAsBackground = item.GetList("ImageStyle").SelectedValue.ToLower() == "background" ? true : false;
1952     
1953     
1954         
1955             Image paragraphImage = null;
1956             if (!String.IsNullOrEmpty(image))
1957             {
1958                 paragraphImage = new Image
1959                 {
1960                     Path = image,
1961                     Link = item.GetString("Link"),
1962                     FilterPrimary = primaryImageFilter,
1963                     FilterSecondary = secondaryImageFilter,
1964                     FilterColor = imageFilterColorCode,
1965                     Style = imageStyle,
1966                     //Looks at title text field on paragraph item (image)
1967                     Title = item.GetString("Title"),
1968                     ImageDefault = new ImageSettings
1969                     {
1970                         Crop = cropMode,
1971                         Height = 845,
1972                         Width = 1920
1973                     },
1974                     ImageMedium = new ImageSettings
1975                     {
1976                         Crop = cropMode,
1977                         Height = 450,
1978                         Width = 1024
1979                     },
1980                     ImageSmall = new ImageSettings
1981                     {
1982                         Crop = cropMode,
1983                         Height = 544,
1984                         Width = 640
1985                     }
1986                 };
1987             }
1988     
1989             ContentParagraph paragraph = new ContentParagraph
1990             {
1991                 Title = title,
1992                 Text = item.GetString("Text"),
1993                 Image = paragraphImage,
1994                 Link = item.GetString("Link"),
1995                 Module = !String.IsNullOrEmpty(Model.GetModuleOutput()) && renderModule ? Model.GetModuleOutput() : "",
1996                 InnerPaddingCss = item.GetList("InnerPadding") != null ? "paragraph-container__body--padding-" + item.GetList("InnerPadding").SelectedValue : "",
1997                 CardCss = cardClass,
1998                 HideOuterPadding = item.GetBoolean("HidePadding"),
1999                 SetImageAsBackground = item.GetList("ImageStyle").SelectedValue.ToLower() == "background" ? true : false,
2000                 ButtonWrapperCss = buttonSpacing + buttonAlignment,
2001                 Layout = layout
2002             };
2003     
2004             if (!String.IsNullOrEmpty(item.GetString("Link")))
2005             {
2006                 paragraph.ButtonPrimary = new Link
2007                 {
2008                     Href = item.GetString("Link"),
2009                     Title = item.GetString("LinkText"),
2010                     ButtonLayout = primaryButtonLayout,
2011                     CssClass = "u-no-margin"
2012                 };
2013     
2014                 if (!String.IsNullOrEmpty(item.GetString("SecondaryLink"))) {
2015                     paragraph.ButtonPrimary.CssClass = "";         
2016                 }
2017             }
2018     
2019             if (!String.IsNullOrEmpty(item.GetString("SecondaryLink")))
2020             {
2021                 if (!String.IsNullOrEmpty(item.GetString("Link")))
2022                 {
2023                     paragraph.ButtonPrimary.CssClass += " u-margin-right--lg";
2024                 }
2025     
2026                 paragraph.ButtonSecondary = new Link
2027                 {
2028                     Href = item.GetString("SecondaryLink"),
2029                     Title = item.GetString("SecondaryLinkText"),
2030                     ButtonLayout = secondaryButtonLayout
2031                 };
2032             }
2033     
2034             <div class="paragraph-container @paragraphClasses dw-mod">
2035                 @if (setImageAsBackground == true && paragraphImage != null)
2036                 {
2037                     paragraphImage.CssClass = "background-image__cover";
2038     
2039                     <div class="background-image dw-mod">
2040                         <div class="background-image__wrapper dw-mod">
2041     
2042                             @Render(paragraphImage)
2043                         </div>
2044                     </div>
2045                 }
2046             @{
2047                 switch (layout)
2048                 {
2049                     case "title-top":
2050                         @RenderLayoutTitleTop(paragraph)
2051                         break;
2052                     case "image-left":
2053                         @RenderLayoutImageLeft(paragraph)
2054                         break;
2055                     case "image-right":
2056                         @RenderLayoutImageRight(paragraph)
2057                         break;
2058                     case "image-centered":
2059                         @RenderLayoutImageCentered(paragraph)
2060                         break;
2061                     case "all-centered":
2062                         @RenderLayoutAllCentered(paragraph)
2063                         break;
2064                     case "middle-center":
2065                     case "middle-left":
2066                         @RenderLayoutMiddle(paragraph)
2067                         break;
2068                     default:
2069                         @RenderLayoutImageTop(paragraph)
2070                         break;
2071                 }
2072             }
2073             </div>
2074         }
2075     }
2076     
2077     
2078     @helper RenderLayoutTitleTop(ContentParagraph settings)
2079     {
2080         <div class="grid__cell @settings.CardCss @settings.InnerPaddingCss dw-mod">
2081             @Render(new Heading { Level = 2, Title = settings.Title, Link = settings.Link })
2082             @if (!settings.SetImageAsBackground && settings.Image != null)
2083             {
2084                 <div class="u-margin-bottom--lg">
2085                     @Render(settings.Image)
2086                 </div>
2087             }
2088             @Render(new Text { Content = settings.Text})
2089             @Render(new ContentModule { Content = settings.Module })
2090     
2091             @if (settings.ButtonPrimary != null || settings.ButtonSecondary != null)
2092             {
2093                 <div class="grid__cell">
2094                     <div class="paragraph-container__button @settings.ButtonWrapperCss dw-mod">
2095                         @Render(settings.ButtonPrimary)
2096                         @Render(settings.ButtonSecondary)
2097                     </div>
2098                 </div>
2099             }
2100         </div>
2101     }
2102     
2103     @helper RenderLayoutImageLeft(ContentParagraph settings)
2104     {
2105         <div class="grid__cell @settings.CardCss @settings.InnerPaddingCss dw-mod">
2106             <div class="grid grid--external-bleed">
2107                 @if (!settings.SetImageAsBackground && settings.Image != null)
2108                 {
2109                     <div class="grid__col-3">
2110                         @Render(settings.Image)
2111                     </div>
2112                 }
2113                 <div class="grid__col-9 @settings.InnerPaddingCss dw-mod">
2114                     @Render(new Heading { Level = 2, Title = settings.Title, Link = settings.Link })
2115                     @Render(new Text { Content = settings.Text })
2116                     @Render(new ContentModule { Content = settings.Module })
2117     
2118                     @if (settings.ButtonPrimary != null || settings.ButtonSecondary != null)
2119                     {
2120                         <div class="grid__cell">
2121                             <div class="paragraph-container__button @settings.ButtonWrapperCss dw-mod">
2122                                 @Render(settings.ButtonPrimary)
2123                                 @Render(settings.ButtonSecondary)
2124                             </div>
2125                         </div>
2126                     }
2127                 </div>
2128             </div>
2129         </div>
2130     }
2131     
2132     @helper RenderLayoutImageRight(ContentParagraph settings)
2133     {
2134         <div class="grid__cell @settings.CardCss">
2135             <div class="grid grid--external-bleed">
2136                 <div class="grid__col-9 @settings.InnerPaddingCss dw-mod">
2137                     @Render(new Heading { Level = 2, Title = settings.Title, Link = settings.Link })
2138                     @Render(new Text { Content = settings.Text })
2139                     @Render(new ContentModule { Content = settings.Module })
2140     
2141                     @if (settings.ButtonPrimary != null || settings.ButtonSecondary != null)
2142                     {
2143                         <div class="grid__cell">
2144                             <div class="paragraph-container__button @settings.ButtonWrapperCss dw-mod">
2145                                 @Render(settings.ButtonPrimary)
2146                                 @Render(settings.ButtonSecondary)
2147                             </div>
2148                         </div>
2149                     }
2150                 </div>
2151                 @if (!settings.SetImageAsBackground && settings.Image != null)
2152                 {
2153                     <div class="grid__col-3">
2154                         @Render(settings.Image)
2155                     </div>
2156                 }
2157             </div>
2158         </div>
2159     }
2160     
2161     @helper RenderLayoutImageCentered(ContentParagraph settings)
2162     {
2163         <div class="grid__cell @settings.CardCss @settings.InnerPaddingCss dw-mod">
2164     
2165             <div class="u-ta-center">
2166                 @if (!settings.SetImageAsBackground && settings.Image != null)
2167                 {
2168                     <div class="u-margin-bottom--lg u-inline-block">
2169                         @Render(settings.Image)
2170                     </div>
2171                 }
2172             </div>
2173     
2174             @Render(new Heading { Level = 2, Title = settings.Title, Link = settings.Link })
2175             @Render(new Text { Content = settings.Text })
2176             @Render(new ContentModule { Content = settings.Module })
2177     
2178             @if (settings.ButtonPrimary != null || settings.ButtonSecondary != null)
2179             {
2180                 <div class="paragraph-container__button @settings.ButtonWrapperCss dw-mod">
2181                     @Render(settings.ButtonPrimary)
2182                     @Render(settings.ButtonSecondary)
2183                 </div>
2184             }
2185         </div>
2186     }
2187     
2188     @helper RenderLayoutAllCentered(ContentParagraph settings)
2189     {
2190         <div class="grid__cell @settings.CardCss @settings.InnerPaddingCss dw-mod">
2191     
2192             <div class="u-ta-center">
2193                 @if (!settings.SetImageAsBackground && settings.Image != null)
2194                 {
2195                     <div class="u-margin-bottom--lg u-inline-block">
2196                         @Render(settings.Image)
2197                     </div>
2198                 }
2199                 @Render(new Heading { Level = 2, Title = settings.Title, Link = settings.Link })
2200                 @Render(new Text { Content = settings.Text })
2201                 @Render(new ContentModule { Content = settings.Module })
2202             </div>
2203     
2204             @if (settings.ButtonPrimary != null || settings.ButtonSecondary != null)
2205             {
2206                 <div class="paragraph-container__button @settings.ButtonWrapperCss dw-mod">
2207                     @Render(settings.ButtonPrimary)
2208                     @Render(settings.ButtonSecondary)
2209                 </div>
2210             }
2211         </div>
2212     }
2213     
2214     @helper RenderLayoutMiddle(ContentParagraph settings)
2215     {
2216         <div>
2217             <div class="grid__cell @settings.CardCss @settings.InnerPaddingCss dw-mod">
2218     
2219                 <div class="@(settings.Layout == "middle-center" ? "u-ta-center" : "")">
2220                     @if (!settings.SetImageAsBackground && settings.Image != null)
2221                     {
2222                         <div class="u-margin-bottom--lg u-inline-block">
2223                             @Render(settings.Image)
2224                         </div>
2225                     }
2226                     @Render(new Heading { Level = 2, Title = settings.Title, Link = settings.Link })
2227                     @Render(new Text { Content = settings.Text })
2228                     @Render(new ContentModule { Content = settings.Module })
2229                 </div>
2230     
2231                 @if (settings.ButtonPrimary != null || settings.ButtonSecondary != null)
2232                 {
2233                     <div class="paragraph-container__button @settings.ButtonWrapperCss dw-mod">
2234                         @Render(settings.ButtonPrimary)
2235                         @Render(settings.ButtonSecondary)
2236                     </div>
2237                 }
2238             </div>
2239         </div>
2240     }
2241     
2242     @helper RenderLayoutImageTop(ContentParagraph settings)
2243     {
2244         <div class="grid__cell @settings.CardCss">
2245             @if (!settings.SetImageAsBackground && settings.Image != null)
2246             {
2247             <div class="u-margin-bottom--lg">
2248                 @Render(settings.Image)
2249             </div>
2250             }
2251     
2252             <div class="@settings.InnerPaddingCss dw-mod">
2253                 @Render(new Heading { Level = 2, Title = settings.Title, Link = settings.Link })
2254                 @Render(new Text { Content = settings.Text })
2255                 @Render(new ContentModule { Content = settings.Module })
2256     
2257                 @if (settings.ButtonPrimary != null || settings.ButtonSecondary != null)
2258                 {
2259                     <div class="paragraph-container__button @settings.ButtonWrapperCss dw-mod">
2260                         @Render(settings.ButtonPrimary)
2261                         @Render(settings.ButtonSecondary)
2262                     </div>
2263                 }
2264             </div>
2265         </div>
2266     }
2267     
2268     
2269     @{
2270         string fontColor = !string.IsNullOrEmpty(Model.Item.GetString("FontColor")) && !Model.Item.GetString("FontColor").StartsWith("#") ? "u-" + Model.Item.GetString("FontColor").Replace(" ", "-").ToLower() : "";
2271         string backgroundColor = !string.IsNullOrEmpty(Model.Item.GetString("BackgroundColor")) && !Model.Item.GetString("BackgroundColor").StartsWith("#") ? "u-" + Model.Item.GetString("BackgroundColor").Replace(" ", "-").ToLower() + "--bg" : "";
2272         string colorSettings = Model.Item.GetString("FontColor").StartsWith("#") || Model.Item.GetString("BackgroundColor").StartsWith("#") ? "style=\"" : "";
2273         string fontColorHex = Model.Item.GetString("FontColor").StartsWith("#") ? "color: " + Model.Item.GetString("FontColor") + ";" : "";
2274         string backgroundColorHex = Model.Item.GetString("BackgroundColor").StartsWith("#") ? "background-color: " + Model.Item.GetString("BackgroundColor") + ";" : "";
2275         colorSettings += fontColorHex;
2276         colorSettings += backgroundColorHex;
2277         colorSettings += Model.Item.GetString("FontColor").StartsWith("#") || Model.Item.GetString("BackgroundColor").StartsWith("#") ? "\"" : "";
2278     
2279         string paragraphContainerClasses = "";
2280         string containerClasses = "";
2281         string gridClasses = "";
2282     
2283         string spacingSize = Model.Item.GetList("Spacing") != null && Model.Item.GetList("Spacing").SelectedValue != "" ? Model.Item.GetList("Spacing").SelectedValue : "lg";
2284     
2285         switch (Model.Item.GetList("Width").SelectedValue)
2286         {
2287             case "center":
2288                 containerClasses += "center-container  paragraph-container ";
2289                 paragraphContainerClasses += " " + fontColor + " " + backgroundColor;
2290                 break;
2291             case "full":
2292                 containerClasses += fontColor + " " + backgroundColor + " ";
2293                 paragraphContainerClasses += "paragraph-container--full-width ";
2294                 break;
2295             case "combi":
2296                 paragraphContainerClasses += "paragraph-container--full-width " + fontColor + " " + backgroundColor + " ";
2297                 containerClasses += "center-container paragraph-container ";
2298                 break;
2299             default:
2300                 paragraphContainerClasses += "center-container ";
2301                 break;
2302         }
2303     
2304         //Background
2305         string focalPointParameters = Model.Item.GetFile("BackgroundImage") != null ? "&" + Model.Item.GetFile("BackgroundImage").GetFocalPointParameters() : "";
2306     
2307         string containerBackgroundImageFilterColor = Model.Item.GetList("ColorForTheFilter") != null ? Model.Item.GetString("ColorForTheFilter").Replace(" ", "-").ToLower() : "none";
2308         string containerBackgroundImageFilterPrimary = Model.Item.GetList("ImageFilterPrimary") != null ? Model.Item.GetList("ImageFilterPrimary").SelectedValue : "none";
2309         string containerBackgroundImageFilterSecondary = Model.Item.GetList("ImageFilterSecondary") != null ? Model.Item.GetList("ImageFilterSecondary").SelectedValue : "none";
2310         string containerBackgroundImageFilterColorCode = Model.Item.GetString("ColorForTheFilter").StartsWith("#") && containerBackgroundImageFilterPrimary == "colorize" ? "style=\"background-color: " + GenerateRgba(Model.Item.GetString("ColorForTheFilter"), 0.3) + "\"" : "";
2311     
2312         if (containerBackgroundImageFilterPrimary == "colorize" && !containerBackgroundImageFilterPrimary.StartsWith("#"))
2313         {
2314             containerBackgroundImageFilterPrimary = containerBackgroundImageFilterColor;
2315         }
2316     
2317         if (Model.Item.GetFile("BackgroundImage") == null) {
2318             backgroundColor = "u-color-light--bg";
2319         }
2320     
2321         //Separation line
2322         bool hasSeparationLine = Model.Item.GetBoolean("SeperationLineAfter");
2323         if (hasSeparationLine && Model.Item.GetList("Width").SelectedValue != "center")
2324         {
2325             paragraphContainerClasses += "multiple-paragraphs-container--seperation-line-after ";
2326         }
2327         else if (hasSeparationLine)
2328         {
2329             containerClasses += "multiple-paragraphs-container--seperation-line-after ";
2330         }
2331     
2332         //Alternative Design Layout
2333         var designLayout = Model.Item.GetItem("CustomSettings") != null ? Model.Item.GetItem("CustomSettings").GetString("DesignLayout") != null ? Model.Item.GetItem("CustomSettings").GetList("DesignLayout").SelectedValue : "" : "";
2334         paragraphContainerClasses  += !String.IsNullOrEmpty(designLayout) ? designLayout : "";
2335     
2336         var paragraphHeight = Model.Item.GetList("Height").SelectedValue;
2337         //Height
2338         if (!string.IsNullOrEmpty(paragraphHeight))
2339         {
2340             gridClasses += "paragraph-container--height-" + paragraphHeight + " " + (paragraphHeight == "screen" ? "screen-height " : "");
2341         }
2342     
2343         if (Model.Item.GetString("MakeParagraphsCenterAligned") != null && Model.Item.GetBoolean("MakeParagraphsCenterAligned"))
2344         {
2345             gridClasses += "grid--justify-center ";
2346         }
2347     
2348         //Set as carousel
2349         if (Model.Item.GetBoolean("EnableCarousel"))
2350         {
2351             containerClasses.Replace(" paragraph-container ", "");
2352         }
2353     
2354         //getting video ID from youtube URL
2355         string videoCode = Model.Item.GetString("VideoURL");
2356         Regex regex = new Regex(@".be\/(.[^?]*)");
2357         Match match = regex.Match(videoCode);
2358         string videoId = "";
2359         if (match.Success)
2360         {
2361             videoId = match.Groups[1].Value;
2362         }
2363         else
2364         {
2365             regex = new Regex(@"v=([^&]+)");
2366             match = regex.Match(videoCode);
2367             if (match.Success)
2368             {
2369                 videoId = match.Groups[1].Value;
2370             }
2371         }
2372     }
2373     
2374     <div class="grid__col-md-12 grid__col--bleed">
2375         <section class="multiple-paragraphs-container @paragraphContainerClasses multiple-paragraphs-container--spacing-@spacingSize dw-mod" @colorSettings>
2376             <div class="background-image image-filter image-filter--@containerBackgroundImageFilterPrimary dw-mod" @containerBackgroundImageFilterColorCode>
2377                 <div class="background-image__wrapper image-filter image-filter--@containerBackgroundImageFilterSecondary dw-mod">
2378                     @if (!String.IsNullOrEmpty(Model.Item.GetString("BackgroundImage"))) { 
2379                         @Render(new Image {
2380                            Path = Model.Item.GetFile("BackgroundImage").PathUrlEncoded + focalPointParameters,
2381                            CssClass = "background-image__cover",
2382                            ImageDefault = new ImageSettings {
2383                                Width = 1920,
2384                                Height = 845,
2385                                Crop = 0,
2386                                FillCanvas = true
2387                            },
2388                            ImageMedium = new ImageSettings
2389                            {
2390                                Width = 1024,
2391                                Height = 450,
2392                                Crop = 0,
2393                                FillCanvas = true
2394                            },
2395                            ImageSmall = new ImageSettings
2396                            {
2397                                Width = 640,
2398                                Height = 544,
2399                                Crop = 0,
2400                                FillCanvas = true
2401                            }
2402                        })
2403                     }
2404     
2405                     @if (!string.IsNullOrEmpty(videoId))
2406                     {
2407                         <div class="video-background">
2408                             <div class="video-background__container">
2409                                 <div class="js-youtube-video" data-video="@videoId" id="ytPlayer@(Model.ID)"></div>
2410                             </div> 
2411                         </div>
2412                     }
2413                 </div>
2414             </div>
2415     
2416             @if (!Model.Item.GetBoolean("EnableCarousel"))
2417             {
2418                 <div class="@containerClasses dw-mod">
2419                     <div class="grid @gridClasses dw-mod">
2420                         @foreach (var paragraph in Model.Item.GetItems("Paragraph"))
2421                         {
2422                             @RenderParagraph(paragraph, false)
2423                         }
2424                         @if (!String.IsNullOrEmpty(Model.GetModuleOutput())) {
2425                             <div class="paragraph-container grid__col-12 dw-mod">
2426                                 @Render(new ContentModule { Content = Model.GetModuleOutput() })
2427                             </div>
2428                         }
2429                     </div>
2430                 </div>
2431             }
2432             else
2433             {
2434                 var slides = new List<List<Dynamicweb.Frontend.ItemViewModel>>();
2435                 int tempColumnsCount = 0;
2436                 var paragraphs = Model.Item.GetItems("Paragraph");
2437                 bool hasAtLeastOneVisibleParagraph = false;
2438                 if (paragraphs.Count > 0)
2439                 {
2440                     slides.Add(new List<Dynamicweb.Frontend.ItemViewModel>());
2441                 }
2442     
2443                 foreach (var paragraph in paragraphs)
2444                 {
2445                     int columnWidth = 0;
2446                     if (Pageview.Device.ToString() == "Mobile" && paragraph.GetList("WidthMobile").SelectedValue == "hide")
2447                     {
2448                         continue;
2449                     }
2450                     hasAtLeastOneVisibleParagraph = true;
2451                     if (paragraph.GetList("Width").SelectedValue != "auto")
2452                     {
2453                         columnWidth = Pageview.Device.ToString() != "Mobile" ? Int32.Parse(paragraph.GetList("Width").SelectedValue) : Int32.Parse(paragraph.GetList("WidthMobile").SelectedValue);
2454                     }
2455                     else
2456                     {
2457                         columnWidth = 1;
2458                     }
2459     
2460                     if (tempColumnsCount + columnWidth > 12)
2461                     {
2462                         slides.Add(new List<Dynamicweb.Frontend.ItemViewModel>());
2463                         tempColumnsCount = 0;
2464                     }
2465     
2466                     slides[slides.Count - 1].Add(paragraph);
2467                     tempColumnsCount += columnWidth;
2468                 }
2469     
2470                 if (hasAtLeastOneVisibleParagraph)
2471                 {
2472                     <div class="@containerClasses dw-mod">
2473                         <div class="carousel dw-mod" id="Paragraph_@(Model.ID)">
2474                             <div class="carousel__container js-carousel-slides dw-mod">
2475                                 @foreach (var slide in slides)
2476                                 {
2477                                     <div class="carousel__slide dw-mod">
2478                                         <div class="grid @gridClasses dw-mod">
2479                                             @foreach (var paragraph in slide)
2480                                             {
2481                                                 @RenderParagraph(paragraph, false)
2482                                             }
2483                                         </div>
2484                                     </div>
2485                                 }
2486                             </div>
2487                         </div>
2488                     </div>
2489                 }
2490     
2491                 if (slides.Count > 1)
2492                 {
2493                     bool enableDots = Model.Item.GetBoolean("ShowDots");
2494     
2495                     <script>
2496                         document.addEventListener("DOMContentLoaded", function () {
2497                             new CarouselModule("#Paragraph_@(Model.ID)", {
2498                                 slideTime: @Model.Item.GetString("SlideTime"),
2499                                 dots: @(Model.Item.GetBoolean("ShowDots").ToString().ToLower())
2500                             });
2501                         })
2502                     </script>
2503                 }
2504             }
2505         </section>
2506     </div>
2507