1 @inherits Dynamicweb.Rendering.ViewModelTemplate<Dynamicweb.Frontend.PageViewModel>
2
3 @using System.Web;
4 @using Dynamicweb.Frontend
5 @using Dynamicweb.Frontend.Devices
6 @using Dynamicweb.Extensibility
7 @using Dynamicweb.Content
8 @using Dynamicweb.Security
9 @using Dynamicweb.Core
10 @using System
11 @using System.Web
12 @using System.IO
13 @using Dynamicweb.Rapido.Blocks
14 @using System.Net
15
16 @functions {
17 BlocksPage masterPage = BlocksPage.GetBlockPage("Master");
18
19 string getFontFamily(params string[] items)
20 {
21 var itemParent = Pageview.AreaSettings;
22 foreach (var item in items)
23 {
24 itemParent = itemParent.GetItem(item);
25 if (itemParent == null)
26 {
27 return null;
28 }
29 }
30
31 var googleFont = itemParent.GetGoogleFont("FontFamily");
32 if (googleFont == null)
33 {
34 return null;
35 }
36 return googleFont.Family.Replace(" ", "+");
37 }
38 }
39
40 @{
41 Block root = new Block
42 {
43 Id = "Root",
44 SortId = 10,
45 BlocksList = new List<Block>
46 {
47 new Block {
48 Id = "Head",
49 SortId = 10,
50 SkipRenderBlocksList = true,
51 Template = RenderMasterHead(),
52 BlocksList = new List<Block>
53 {
54 new Block {
55 Id = "HeadCss",
56 SortId = 20,
57 Template = RenderMasterCss(),
58 }
59 }
60 },
61 new Block {
62 Id = "Body",
63 SortId = 20,
64 SkipRenderBlocksList = true,
65 Template = RenderMasterBody(),
66 BlocksList = new List<Block>
67 {
68 new Block()
69 {
70 Id = "Master",
71 SortId = 10,
72 BlocksList = new List<Block> {
73 new Block {
74 Id = "MasterTopSnippets",
75 SortId = 10
76 },
77 new Block {
78 Id = "MasterMain",
79 SortId = 20,
80 Template = RenderMain(),
81 SkipRenderBlocksList = true,
82 BlocksList = new List<Block> {
83 new Block {
84 Id = "MasterPageContent",
85 SortId = 10,
86 Template = RenderPageContent()
87 }
88 }
89 },
90 new Block {
91 Id = "MasterFooter",
92 SortId = 30
93 },
94 new Block {
95 Id = "MasterReferences",
96 SortId = 40
97 },
98 new Block {
99 Id = "MasterBottomSnippets",
100 SortId = 50
101 }
102 }
103 }
104 }
105 }
106 }
107 };
108 masterPage.Add(root);
109
110 Block footer = new Block
111 {
112 Id = "Footer",
113 SortId = 20,
114 Template = RenderNoLayoutFooter()
115 };
116 masterPage.Add("MasterFooter", footer);
117 }
118
119 @* Include the required Grid builder (Contains the methods @RenderBlockList and @RenderBlock) *@
120 @using System.Text.RegularExpressions
121 @using System.Collections.Generic
122 @using System.Reflection
123 @using System.Web
124 @using System.Web.UI.HtmlControls
125 @using Dynamicweb.Rapido.Blocks.Components
126 @using Dynamicweb.Rapido.Blocks.Components.Articles
127 @using Dynamicweb.Rapido.Blocks.Components.Documentation
128 @using Dynamicweb.Rapido.Blocks
129
130
131 @*--- START: Base block renderers ---*@
132
133 @helper RenderBlockList(List<Block> blocks)
134 {
135 bool debug = !String.IsNullOrEmpty(HttpContext.Current.Request.QueryString.Get("debug")) ? Convert.ToBoolean(HttpContext.Current.Request.QueryString.Get("debug")) : false;
136 blocks = blocks.OrderBy(item => item.SortId).ToList();
137
138 foreach (Block item in blocks)
139 {
140 if (debug) {
141 <!-- Block START: @item.Id -->
142 }
143
144 if (item.Design == null)
145 {
146 @RenderBlock(item)
147 }
148 else if (item.Design.RenderType == RenderType.None) {
149 string cssClass = item.Design.CssClass != null ? item.Design.CssClass : "";
150
151 <div class="@cssClass dw-mod">
152 @RenderBlock(item)
153 </div>
154 }
155 else if (item.Design.RenderType != RenderType.Hide)
156 {
157 string cssClass = item.Design.CssClass != null ? item.Design.CssClass : "";
158
159 if (!item.SkipRenderBlocksList) {
160 if (item.Design.RenderType == RenderType.Row)
161 {
162 <div class="grid grid--align-content-start @cssClass dw-mod" id="Block__@item.Id">
163 @RenderBlock(item)
164 </div>
165 }
166
167 if (item.Design.RenderType == RenderType.Column)
168 {
169 string hidePadding = item.Design.HidePadding ? "u-no-padding" : "";
170 string size = item.Design.Size ?? "12";
171 size = Regex.IsMatch(size, @"\d") ? "md-" + item.Design.Size : item.Design.Size;
172
173 <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">
174 @RenderBlock(item)
175 </div>
176 }
177
178 if (item.Design.RenderType == RenderType.Table)
179 {
180 <table class="table @cssClass dw-mod" id="Block__@item.Id">
181 @RenderBlock(item)
182 </table>
183 }
184
185 if (item.Design.RenderType == RenderType.TableRow)
186 {
187 <tr class="@cssClass dw-mod" id="Block__@item.Id">
188 @RenderBlock(item)
189 </tr>
190 }
191
192 if (item.Design.RenderType == RenderType.TableColumn)
193 {
194 <td class="@cssClass dw-mod" id="Block__@item.Id">
195 @RenderBlock(item)
196 </td>
197 }
198
199 if (item.Design.RenderType == RenderType.CardHeader)
200 {
201 <div class="card-header @cssClass dw-mod">
202 @RenderBlock(item)
203 </div>
204 }
205
206 if (item.Design.RenderType == RenderType.CardBody)
207 {
208 <div class="card @cssClass dw-mod">
209 @RenderBlock(item)
210 </div>
211 }
212
213 if (item.Design.RenderType == RenderType.CardFooter)
214 {
215 <div class="card-footer @cssClass dw-mod">
216 @RenderBlock(item)
217 </div>
218 }
219 }
220 else
221 {
222 @RenderBlock(item)
223 }
224 }
225
226 if (debug) {
227 <!-- Block END: @item.Id -->
228 }
229 }
230 }
231
232 @helper RenderBlock(Block item)
233 {
234 bool debug = !String.IsNullOrEmpty(HttpContext.Current.Request.QueryString.Get("debug")) ? Convert.ToBoolean(HttpContext.Current.Request.QueryString.Get("debug")) : false;
235
236 if (item.Template != null)
237 {
238 @BlocksPage.RenderTemplate(item.Template)
239 }
240
241 if (item.Component != null)
242 {
243 string customSufix = "Custom";
244 string methodName = item.Component.HelperName;
245
246 ComponentBase[] methodParameters = new ComponentBase[1];
247 methodParameters[0] = item.Component;
248 Type methodType = this.GetType();
249
250 MethodInfo customMethod = methodType.GetMethod(methodName + customSufix);
251
252 try {
253 if (debug) {
254 <!-- Component: @methodName.Replace("Render", "") -->
255 }
256 if(customMethod != null) {
257 @customMethod.Invoke(this, methodParameters).ToString();
258 } else {
259 MethodInfo generalMethod = methodType.GetMethod(methodName);
260 @generalMethod.Invoke(this, methodParameters).ToString();
261 }
262 } catch {
263 try {
264 MethodInfo generalMethod = methodType.GetMethod(methodName);
265 @generalMethod.Invoke(this, methodParameters).ToString();
266 } catch(Exception ex) {
267 throw new Exception(item.Component.GetType().Name + " method '" + methodName +"' could not be invoked", ex);
268 }
269 }
270 }
271
272 if (item.BlocksList.Count > 0 && !item.SkipRenderBlocksList)
273 {
274 @RenderBlockList(item.BlocksList)
275 }
276 }
277
278 @*--- END: Base block renderers ---*@
279
280
281 @* Include the components that makes it possible to render articles *@
282 @using Dynamicweb.Rapido.Blocks.Components
283 @using Dynamicweb.Rapido.Blocks.Components.General
284 @using Dynamicweb.Rapido.Blocks
285 @using System.IO
286
287 @* Required *@
288 @using Dynamicweb.Rapido.Blocks.Components
289 @using Dynamicweb.Rapido.Blocks.Components.General
290 @using Dynamicweb.Rapido.Blocks
291
292
293 @helper Render(ComponentBase component)
294 {
295 if (component != null)
296 {
297 @component.Render(this)
298 }
299 }
300
301 @* Components *@
302 @using System.Reflection
303 @using Dynamicweb.Rapido.Blocks.Components.General
304
305
306 @* Component *@
307
308 @helper RenderIcon(Icon settings)
309 {
310 if (settings != null)
311 {
312 string color = settings.Color != null ? "style=\"color: " + settings.Color + "\"" : "";
313
314 if (settings.Name != null)
315 {
316 if (string.IsNullOrEmpty(settings.Label))
317 {
318 <i class="@settings.Prefix @settings.Name @settings.CssClass" @color></i>
319 }
320 else
321 {
322 if (settings.LabelPosition == IconLabelPosition.Before)
323 {
324 <div class="u-flex u-flex--align-items-center @settings.CssClass">@settings.Label <i class="@settings.Prefix @settings.Name u-margin-left" @color></i></div>
325 }
326 else
327 {
328 <div class="u-flex u-flex--align-items-center @settings.CssClass"><i class="@settings.Prefix @settings.Name u-margin-right--lg u-w20px" @color></i>@settings.Label</div>
329 }
330 }
331 }
332 else if (!string.IsNullOrEmpty(settings.Label))
333 {
334 @settings.Label
335 }
336 }
337 }
338 @using System.Reflection
339 @using Dynamicweb.Rapido.Blocks.Components.General
340 @using Dynamicweb.Rapido.Blocks.Components
341 @using Dynamicweb.Core
342
343 @* Component *@
344
345 @helper RenderButton(Button settings)
346 {
347 if (settings != null && (!string.IsNullOrEmpty(settings.Title) || settings.Icon != null))
348 {
349 Dictionary<string, string> attributes = new Dictionary<string, string>();
350 List<string> classList = settings.CssClass != null ? settings.CssClass.Split(' ').ToList() : new List<string>();
351 if (settings.Disabled) {
352 attributes.Add("disabled", "true");
353 classList.Add("disabled");
354 }
355
356 if (!string.IsNullOrEmpty(settings.ConfirmText) || !string.IsNullOrEmpty(settings.ConfirmTitle))
357 {
358 settings.Id = !string.IsNullOrEmpty(settings.Id) ? settings.Id : Guid.NewGuid().ToString("N");
359 @RenderConfirmDialog(settings);
360 settings.OnClick = "document.getElementById('" + settings.Id + "ModalTrigger').checked = true";
361 }
362
363 if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
364 if (!string.IsNullOrEmpty(settings.Name)) { attributes.Add("name", settings.Name); }
365 if (!string.IsNullOrEmpty(settings.AltText))
366 {
367 attributes.Add("title", settings.AltText);
368 }
369 else if (!string.IsNullOrEmpty(settings.Title))
370 {
371 string cleanTitle = Regex.Replace(settings.Title, "<.*?>", String.Empty);
372 cleanTitle = cleanTitle.Replace(" ", " ");
373 attributes.Add("title", cleanTitle);
374 }
375
376 var onClickEvents = new List<string>();
377 if (!string.IsNullOrEmpty(settings.OnClick))
378 {
379 onClickEvents.Add(settings.OnClick);
380 }
381 if (!string.IsNullOrEmpty(settings.Href))
382 {
383 onClickEvents.Add("location.href='" + settings.Href + "'");
384 }
385 if (onClickEvents.Count > 0)
386 {
387 attributes.Add("onClick", string.Join(";", onClickEvents));
388 }
389
390 if (settings.ButtonLayout != ButtonLayout.None)
391 {
392 classList.Add("btn");
393 string btnLayout = Enum.GetName(typeof(ButtonLayout), settings.ButtonLayout).ToLower();
394 if (btnLayout == "linkclean")
395 {
396 btnLayout = "link-clean"; //fix
397 }
398 classList.Add("btn--" + btnLayout);
399 }
400
401 if (settings.Icon == null)
402 {
403 settings.Icon = new Icon();
404 }
405
406 settings.Icon.CssClass += Enum.GetName(typeof(ButtonLayout), settings.ButtonLayout).ToLower() != "linkclean" ? " u-flex--align-center" : "";
407 settings.Icon.Label = settings.Title;
408
409 attributes.Add("type", Enum.GetName(typeof(ButtonType), settings.ButtonType).ToLower());
410
411 <button class="@string.Join(" ", classList) dw-mod" @ComponentMethods.AddAttributes(attributes) @ComponentMethods.AddAttributes(settings.ExtraAttributes)>@Render(settings.Icon)</button>
412 }
413 }
414
415 @helper RenderConfirmDialog(Button settings)
416 {
417 Modal confirmDialog = new Modal {
418 Id = settings.Id,
419 Width = ModalWidth.Sm,
420 Heading = new Heading
421 {
422 Level = 2,
423 Title = settings.ConfirmTitle
424 },
425 BodyText = settings.ConfirmText
426 };
427
428 confirmDialog.AddAction(new Button { Title = Translate("Cancel"), ButtonLayout = ButtonLayout.Secondary, OnClick = "document.getElementById('" + settings.Id + "ModalTrigger').checked = false"});
429 confirmDialog.AddAction(new Button { Title = Translate("OK"), ButtonLayout = ButtonLayout.Primary, OnClick = "document.getElementById('" + settings.Id + "ModalTrigger').checked = false;" + settings.OnClick });
430
431 @Render(confirmDialog)
432 }
433 @using Dynamicweb.Rapido.Blocks.Components.General
434 @using Dynamicweb.Rapido.Blocks.Components
435 @using Dynamicweb.Core
436
437 @helper RenderDashboard(Dashboard settings)
438 {
439 var widgets = settings.GetWidgets();
440
441 if (!string.IsNullOrEmpty(settings.WidgetsBaseBackgroundColor))
442 {
443 //set bg color for them
444
445 System.Drawing.Color color = System.Drawing.ColorTranslator.FromHtml(settings.WidgetsBaseBackgroundColor);
446 int r = Convert.ToInt16(color.R);
447 int g = Convert.ToInt16(color.G);
448 int b = Convert.ToInt16(color.B);
449
450 var count = widgets.Length;
451 var max = Math.Max(r, Math.Max(g, b));
452 double step = 255.0 / (max * count);
453 var i = 0;
454 foreach (var widget in widgets)
455 {
456 i++;
457
458 var shade = "rgb(" + Converter.ToString(r * step * i).Replace(",", ".") + ", " + Converter.ToString(g * step * i).Replace(",", ".") + ", " + Converter.ToString(b * step * i).Replace(",", ".") + ")";
459 widget.BackgroundColor = shade;
460 }
461 }
462
463 <div class="dashboard @settings.CssClass dw-mod" @ComponentMethods.AddAttributes(settings.ExtraAttributes)>
464 @foreach (var widget in widgets)
465 {
466 <div class="dashboard__widget">
467 @Render(widget)
468 </div>
469 }
470 </div>
471 }
472 @using Dynamicweb.Rapido.Blocks.Components.General
473 @using Dynamicweb.Rapido.Blocks.Components
474
475 @helper RenderDashboardWidgetLink(DashboardWidgetLink settings)
476 {
477 if (!string.IsNullOrEmpty(settings.Link))
478 {
479 var backgroundStyles = "";
480 if (!string.IsNullOrEmpty(settings.BackgroundColor))
481 {
482 backgroundStyles = "style=\"background-color:" + settings.BackgroundColor + "\"";
483 }
484
485 <a href="@settings.Link" class="widget widget--link @settings.CssClass dw-mod" @backgroundStyles title="@settings.Title" @ComponentMethods.AddAttributes(settings.ExtraAttributes)>
486 <div class="u-center-middle u-color-light">
487 @if (settings.Icon != null)
488 {
489 settings.Icon.CssClass += "widget__icon";
490 @Render(settings.Icon)
491 }
492 <div class="widget__title">@settings.Title</div>
493 </div>
494 </a>
495 }
496 }
497 @using Dynamicweb.Rapido.Blocks.Components.General
498 @using Dynamicweb.Rapido.Blocks.Components
499
500 @helper RenderDashboardWidgetCounter(DashboardWidgetCounter settings)
501 {
502 var backgroundStyles = "";
503 if (!string.IsNullOrEmpty(settings.BackgroundColor))
504 {
505 backgroundStyles = "style='background-color:" + settings.BackgroundColor + "'";
506 }
507
508 <div class="widget @settings.CssClass dw-mod" @backgroundStyles @ComponentMethods.AddAttributes(settings.ExtraAttributes)>
509 <div class="u-center-middle u-color-light">
510 @if (settings.Icon != null)
511 {
512 settings.Icon.CssClass += "widget__icon";
513 @Render(settings.Icon)
514 }
515 <div class="widget__counter">@settings.Count</div>
516 <div class="widget__title">@settings.Title</div>
517 </div>
518 </div>
519 }
520 @using System.Reflection
521 @using Dynamicweb.Rapido.Blocks.Components.General
522 @using Dynamicweb.Rapido.Blocks.Components
523 @using Dynamicweb.Core
524
525 @* Component *@
526
527 @helper RenderLink(Link settings)
528 {
529 if (settings != null && !string.IsNullOrEmpty(settings.Href) && (!string.IsNullOrEmpty(settings.Title) || settings.Icon != null))
530 {
531 Dictionary<string, string> attributes = new Dictionary<string, string>();
532 List<string> classList = settings.CssClass != null ? settings.CssClass.Split(' ').ToList() : new List<string>();
533 if (settings.Disabled)
534 {
535 attributes.Add("disabled", "true");
536 classList.Add("disabled");
537 }
538
539 if (!string.IsNullOrEmpty(settings.AltText))
540 {
541 attributes.Add("title", settings.AltText);
542 }
543 else if (!string.IsNullOrEmpty(settings.Title))
544 {
545 attributes.Add("title", settings.Title);
546 }
547
548 if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
549 if (!string.IsNullOrEmpty(settings.Name)) { attributes.Add("name", settings.Name); }
550 if (!string.IsNullOrEmpty(settings.OnClick)) { attributes.Add("onClick", settings.OnClick); }
551 attributes.Add("href", settings.Href);
552
553 if (settings.ButtonLayout != ButtonLayout.None)
554 {
555 classList.Add("btn");
556 string btnLayout = Enum.GetName(typeof(ButtonLayout), settings.ButtonLayout).ToLower();
557 if (btnLayout == "linkclean")
558 {
559 btnLayout = "link-clean"; //fix
560 }
561 classList.Add("btn--" + btnLayout);
562 }
563
564 if (settings.Icon == null)
565 {
566 settings.Icon = new Icon();
567 }
568 settings.Icon.Label = settings.Title;
569
570 if (settings.Target == LinkTargetType.Blank && settings.Rel == LinkRelType.None)
571 {
572 settings.Rel = LinkRelType.Noopener;
573 }
574 if (settings.Target != LinkTargetType.None)
575 {
576 attributes.Add("target", "_" + Enum.GetName(typeof(LinkTargetType), settings.Target).ToLower());
577 }
578 if (settings.Download)
579 {
580 attributes.Add("download", "true");
581 }
582 if (settings.Rel != LinkRelType.None)
583 {
584 attributes.Add("rel", Enum.GetName(typeof(LinkRelType), settings.Rel).ToLower());
585 }
586
587 <a class="@string.Join(" ", classList) dw-mod" @ComponentMethods.AddAttributes(attributes) @ComponentMethods.AddAttributes(settings.ExtraAttributes)>@Render(settings.Icon)</a>
588 }
589 }
590 @using System.Reflection
591 @using Dynamicweb.Rapido.Blocks.Components
592 @using Dynamicweb.Rapido.Blocks.Components.General
593 @using Dynamicweb.Rapido.Blocks
594
595
596 @* Component *@
597
598 @helper RenderRating(Rating settings)
599 {
600 if (settings.Score > 0)
601 {
602 int rating = settings.Score;
603 string iconType = "fa-star";
604
605 switch (settings.Type.ToString()) {
606 case "Stars":
607 iconType = "fa-star";
608 break;
609 case "Hearts":
610 iconType = "fa-heart";
611 break;
612 case "Lemons":
613 iconType = "fa-lemon";
614 break;
615 case "Bombs":
616 iconType = "fa-bomb";
617 break;
618 }
619
620 <div class="u-ta-right">
621 @for (int i = 0; i < settings.OutOf; i++)
622 {
623 <i class="@(rating > i ? "fas" : "far") @iconType"></i>
624 }
625 </div>
626 }
627 }
628 @using System.Reflection
629 @using Dynamicweb.Rapido.Blocks.Components.General
630 @using Dynamicweb.Rapido.Blocks.Components
631
632
633 @* Component *@
634
635 @helper RenderSelectFieldOption(SelectFieldOption settings)
636 {
637 Dictionary<string, string> attributes = new Dictionary<string, string>();
638 if (settings.Checked) { attributes.Add("selected", "true"); }
639 if (settings.Disabled) { attributes.Add("disabled", "true"); }
640 if (settings.Value != null) { attributes.Add("value", settings.Value); }
641 if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
642
643 <option @ComponentMethods.AddAttributes(attributes) @ComponentMethods.AddAttributes(settings.ExtraAttributes)>@settings.Label</option>
644 }
645 @using System.Reflection
646 @using Dynamicweb.Rapido.Blocks.Components.General
647 @using Dynamicweb.Rapido.Blocks.Components
648
649
650 @* Component *@
651
652 @helper RenderNavigation(Navigation settings) {
653 @RenderNavigation(new
654 {
655 id = settings.Id,
656 cssclass = settings.CssClass,
657 startLevel = settings.StartLevel,
658 endlevel = settings.EndLevel,
659 expandmode = settings.Expandmode,
660 sitemapmode = settings.SitemapMode,
661 template = settings.Template
662 })
663 }
664 @using Dynamicweb.Rapido.Blocks.Components.General
665 @using Dynamicweb.Rapido.Blocks.Components
666
667
668 @* Component *@
669
670 @helper RenderBreadcrumbNavigation(BreadcrumbNavigation settings) {
671 settings.Id = String.IsNullOrEmpty(settings.Id) ? "breadcrumb" : settings.Id;
672 settings.Template = String.IsNullOrEmpty(settings.Template) ? "Breadcrumb.xslt" : settings.Template;
673 settings.StartLevel = settings.StartLevel == 0 ? 1 : settings.StartLevel;
674 settings.EndLevel = settings.EndLevel == 10 ? 1 : settings.EndLevel;
675 settings.Expandmode = String.IsNullOrEmpty(settings.Expandmode) ? "all" : settings.Expandmode;
676 settings.SitemapMode = false;
677
678 @RenderNavigation(settings)
679 }
680 @using Dynamicweb.Rapido.Blocks.Components.General
681 @using Dynamicweb.Rapido.Blocks.Components
682
683
684 @* Component *@
685
686 @helper RenderLeftNavigation(LeftNavigation settings) {
687 settings.Id = String.IsNullOrEmpty(settings.Id) ? "breadcrumb" : settings.Id;
688 settings.Template = String.IsNullOrEmpty(settings.Template) ? "Breadcrumb.xslt" : settings.Template;
689 settings.StartLevel = settings.StartLevel == 0 ? 1 : settings.StartLevel;
690 settings.EndLevel = settings.EndLevel == 10 ? 1 : settings.EndLevel;
691 settings.Expandmode = String.IsNullOrEmpty(settings.Expandmode) ? "all" : settings.Expandmode;
692
693 <div class="grid__cell">
694 @RenderNavigation(settings)
695 </div>
696 }
697 @using System.Reflection
698 @using Dynamicweb.Rapido.Blocks.Components.General
699 @using Dynamicweb.Core
700
701 @* Component *@
702
703 @helper RenderHeading(Heading settings)
704 {
705 if (settings != null && !string.IsNullOrEmpty(settings.Title))
706 {
707 string color = settings.Color != null ? "style=\"color: " + settings.Color + "\"" : "";
708 string tagName = settings.Level != 0 ? "h" + settings.Level.ToString() : "div";
709
710 @("<" + tagName + " class=\"" + settings.CssClass + " dw-mod\" " + color + ">")
711 if (!string.IsNullOrEmpty(settings.Link))
712 {
713 @Render(new Link { Href = settings.Link, Icon = settings.Icon, Title = settings.Title, ButtonLayout = ButtonLayout.None })
714 }
715 else
716 {
717 if (settings.Icon == null)
718 {
719 settings.Icon = new Icon();
720 }
721 settings.Icon.Label = settings.Title;
722 @Render(settings.Icon)
723 }
724 @("</" + tagName + ">");
725 }
726 }
727 @using Dynamicweb.Rapido.Blocks.Components
728 @using Dynamicweb.Rapido.Blocks.Components.General
729 @using Dynamicweb.Rapido.Blocks
730
731
732 @* Component *@
733
734 @helper RenderImage(Image settings)
735 {
736 if (settings.FilterPrimary != ImageFilter.None || settings.FilterSecondary != ImageFilter.None)
737 {
738 Dictionary<string, string> optionalAttributes = new Dictionary<string, string>();
739 if (!string.IsNullOrEmpty(settings.FilterColor)) { optionalAttributes.Add("style", "background-color: " + settings.FilterColor); }
740
741 if (settings.Caption != null)
742 {
743 @:<div>
744 }
745
746 var primaryFilterClass = settings.FilterPrimary.ToString().ToLower();
747 var secondaryFilterClass = settings.FilterSecondary.ToString().ToLower();
748
749 <div class="image-filter image-filter--@primaryFilterClass u-position-relative dw-mod" @ComponentMethods.AddAttributes(optionalAttributes)>
750 <div class="image-filter image-filter--@secondaryFilterClass dw-mod">
751 @if (settings.Link != null)
752 {
753 <a href="@settings.Link">
754 @RenderTheImage(settings)
755 </a>
756 }
757 else
758 {
759 @RenderTheImage(settings)
760 }
761 </div>
762 </div>
763
764 if (settings.Caption != null)
765 {
766 <span class="image-caption dw-mod">@settings.Caption</span>
767 @:</div>
768 }
769 }
770 else
771 {
772 if (settings.Caption != null)
773 {
774 @:<div>
775 }
776 if (!string.IsNullOrEmpty(settings.Link))
777 {
778 <a href="@settings.Link">
779 @RenderTheImage(settings)
780 </a>
781 }
782 else
783 {
784 @RenderTheImage(settings)
785 }
786
787 if (settings.Caption != null)
788 {
789 <span class="image-caption dw-mod">@settings.Caption</span>
790 @:</div>
791 }
792 }
793 }
794
795 @helper RenderTheImage(Image settings)
796 {
797 if (settings != null)
798 {
799 string alternativeImage = !string.IsNullOrEmpty(Pageview.AreaSettings.GetItem("Settings").GetString("AlternativeImage")) ? Pageview.AreaSettings.GetItem("Settings").GetFile("AlternativeImage").PathUrlEncoded : "/Images/missing_image.jpg";
800 string placeholderImage = "/Files/Images/placeholder.gif";
801 string imageEngine = "/Admin/Public/GetImage.ashx?";
802
803 string imageStyle = "";
804
805 switch (settings.Style)
806 {
807 case ImageStyle.Ball:
808 imageStyle = "grid__cell-img--ball";
809 break;
810
811 case ImageStyle.Triangle:
812 imageStyle = "grid__cell-img--triangle";
813 break;
814 }
815
816 if (settings.Style == ImageStyle.Ball || settings.Style == ImageStyle.Circle || settings.Style == ImageStyle.Triangle)
817 {
818 settings.ImageDefault.Crop = settings.ImageDefault.Crop == 5 ? settings.ImageDefault.Crop = 0 : settings.ImageDefault.Crop;
819
820 if (settings.ImageDefault != null)
821 {
822 settings.ImageDefault.Height = settings.ImageDefault.Width;
823 }
824 if (settings.ImageMedium != null)
825 {
826 settings.ImageMedium.Height = settings.ImageMedium.Width;
827 }
828 if (settings.ImageSmall != null)
829 {
830 settings.ImageSmall.Height = settings.ImageSmall.Width;
831 }
832 }
833
834 string defaultImage = imageEngine;
835 string imageSmall = "";
836 string imageMedium = "";
837
838 if (settings.DisableImageEngine)
839 {
840 defaultImage = settings.Path;
841 }
842 else
843 {
844 if (settings.ImageDefault != null)
845 {
846 defaultImage += Dynamicweb.Rapido.Services.Images.GetImagePathFromSettings(settings.ImageDefault);
847
848 if (settings.Path.GetType() != typeof(string))
849 {
850 defaultImage += settings.Path != null ? "Image=" + settings.Path.PathUrlEncoded : "";
851 defaultImage += settings.Path != null ? "&" + settings.Path.GetFocalPointParameters() : "";
852 }
853 else
854 {
855 defaultImage += settings.Path != null ? "Image=" + settings.Path : "";
856 }
857
858 defaultImage += "&AlternativeImage=" + alternativeImage;
859 }
860
861 if (settings.ImageSmall != null)
862 {
863 imageSmall = "data-src-small=\"" + imageEngine;
864 imageSmall += Dynamicweb.Rapido.Services.Images.GetImagePathFromSettings(settings.ImageSmall);
865
866 if (settings.Path.GetType() != typeof(string))
867 {
868 imageSmall += settings.Path != null ? "Image=" + settings.Path.PathUrlEncoded : "";
869 imageSmall += settings.Path != null ? "&" + settings.Path.GetFocalPointParameters() : "";
870 }
871 else
872 {
873 imageSmall += settings.Path != null ? "Image=" + settings.Path : "";
874 }
875
876 imageSmall += "&alternativeImage=" + alternativeImage;
877
878 imageSmall += "\"";
879 }
880
881 if (settings.ImageMedium != null)
882 {
883 imageMedium = "data-src-medium=\"" + imageEngine;
884 imageMedium += Dynamicweb.Rapido.Services.Images.GetImagePathFromSettings(settings.ImageMedium);
885
886 if (settings.Path.GetType() != typeof(string))
887 {
888 imageMedium += settings.Path != null ? "Image=" + settings.Path.PathUrlEncoded : "";
889 imageMedium += settings.Path != null ? "&" + settings.Path.GetFocalPointParameters() : "";
890 }
891 else
892 {
893 imageMedium += settings.Path != null ? "Image=" + settings.Path : "";
894 }
895
896 imageMedium += "&alternativeImage=" + alternativeImage;
897
898 imageMedium += "\"";
899 }
900 }
901
902 Dictionary<string, string> optionalAttributes = new Dictionary<string, string>();
903 if (!string.IsNullOrEmpty(settings.OnClick)) { optionalAttributes.Add("onclick", settings.OnClick); }
904 if (!string.IsNullOrEmpty(settings.Title))
905 {
906 optionalAttributes.Add("alt", settings.Title);
907 optionalAttributes.Add("title", settings.Title);
908 }
909
910 if (settings.DisableLazyLoad)
911 {
912 <img id="@settings.Id" class="@imageStyle @settings.CssClass dw-mod" src="@defaultImage" @ComponentMethods.AddAttributes(optionalAttributes) @ComponentMethods.AddAttributes(settings.ExtraAttributes) />
913 }
914 else
915 {
916 <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) />
917 }
918 }
919 }
920 @using System.Reflection
921 @using Dynamicweb.Rapido.Blocks.Components.General
922 @using Dynamicweb.Rapido.Blocks.Components
923
924 @* Component *@
925
926 @helper RenderFileField(FileField settings)
927 {
928 var attributes = new Dictionary<string, string>();
929 if (string.IsNullOrEmpty(settings.Id))
930 {
931 settings.Id = Guid.NewGuid().ToString("N");
932 }
933
934 if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
935 if (settings.Disabled) { attributes.Add("disabled", "true"); }
936 if (settings.Required) { attributes.Add("required", "true"); }
937 if (settings.Multiple) { attributes.Add("multiple", "true"); }
938 if (!string.IsNullOrEmpty(settings.Name)) { attributes.Add("name", settings.Name); }
939 if (string.IsNullOrEmpty(settings.ChooseFileText))
940 {
941 settings.ChooseFileText = Translate("Choose file");
942 }
943 if (string.IsNullOrEmpty(settings.NoFilesChosenText))
944 {
945 settings.NoFilesChosenText = Translate("No files chosen...");
946 }
947 if (!string.IsNullOrEmpty(settings.OnClick)) { attributes.Add("onclick", settings.OnClick); }
948
949 if (settings.Required && !String.IsNullOrEmpty(settings.Label)) { settings.Label += " <span class=\"required dw-mod\">*</span>"; }
950
951 string setValueToFakeInput = "FileUpload.setValueToFakeInput(this)";
952 attributes.Add("onchange", setValueToFakeInput + (!string.IsNullOrEmpty(settings.OnChange) ? settings.OnChange : ""));
953
954 attributes.Add("type", "file");
955 if (settings.Value != null) { attributes.Add("value", settings.Value); }
956 settings.CssClass = "u-full-width " + settings.CssClass;
957
958 var resultAttributes = attributes.Concat(settings.ExtraAttributes).GroupBy(d => d.Key).ToDictionary (d => d.Key, d => d.Last().Value);
959
960 <div class="form__field-group u-full-width @settings.WrapperCssClass dw-mod">
961 @if (!string.IsNullOrEmpty(settings.Label) || settings.Link != null )
962 {
963 <div class="u-full-width">
964 @if (!string.IsNullOrEmpty(settings.Label)) { <label for="@settings.Id" class="u-pull--left">@settings.Label</label> }
965 @if (settings.Link != null) {
966 <div class="u-pull--right">
967 @{ settings.Link.ButtonLayout = ButtonLayout.LinkClean; }
968 @Render(settings.Link)
969 </div>
970 }
971 </div>
972
973 }
974
975 @if (!string.IsNullOrEmpty(settings.HelpText))
976 {
977 <small class="form__help-text">@settings.HelpText</small>
978 }
979
980 <div class="form__field-combi file-input u-no-margin dw-mod">
981 <input @ComponentMethods.AddAttributes(resultAttributes) class="file-input__real-input" data-no-files-text="@settings.NoFilesChosenText" data-many-files-text="@Translate("files")" />
982 <label for="@settings.Id" class="file-input__btn btn--secondary btn dw-mod">@settings.ChooseFileText</label>
983 <label for="@settings.Id" class="@settings.CssClass file-input__fake-input js-fake-input dw-mod">@settings.NoFilesChosenText</label>
984 @if (settings.UploadButton != null)
985 {
986 settings.UploadButton.CssClass += " btn--condensed u-no-margin";
987 @Render(settings.UploadButton)
988 }
989 </div>
990 @Render(new NotificationMessage { Message = settings.ErrorMessage })
991 </div>
992 }
993 @using System.Reflection
994 @using Dynamicweb.Rapido.Blocks.Components.General
995 @using Dynamicweb.Rapido.Blocks.Components
996 @using Dynamicweb.Core
997 @using System.Linq
998
999 @* Component *@
1000
1001 @helper RenderDateTimeField(DateTimeField settings)
1002 {
1003 if (string.IsNullOrEmpty(settings.Id))
1004 {
1005 settings.Id = Guid.NewGuid().ToString("N");
1006 }
1007 if (settings.ExtraAttributes == null)
1008 {
1009 settings.ExtraAttributes = new Dictionary<string, string>();
1010 }
1011 settings.ExtraAttributes.Add("autocomplete","off");
1012 var textField = new TextField {
1013 Name = settings.Name,
1014 Id = settings.Id,
1015 Label = settings.Label,
1016 HelpText = settings.HelpText,
1017 Value = settings.Value,
1018 Disabled = settings.Disabled,
1019 Required = settings.Required,
1020 ErrorMessage = settings.ErrorMessage,
1021 CssClass = settings.CssClass,
1022 WrapperCssClass = settings.WrapperCssClass,
1023 OnChange = settings.OnChange,
1024 OnClick = settings.OnClick,
1025 Link = settings.Link,
1026 ExtraAttributes = settings.ExtraAttributes,
1027 //
1028 Placeholder = settings.Placeholder
1029 };
1030
1031 @Render(textField)
1032
1033 List<string> jsAttributes = new List<string>();
1034
1035 jsAttributes.Add("mode: '" + Enum.GetName(typeof(DateTimeFieldMode), settings.Mode).ToLower() + "'");
1036
1037 if (!string.IsNullOrEmpty(settings.DateFormat))
1038 {
1039 jsAttributes.Add("dateFormat: '" + settings.DateFormat + "'");
1040 }
1041 if (!string.IsNullOrEmpty(settings.MinDate))
1042 {
1043 jsAttributes.Add("minDate: '" + settings.MinDate + "'");
1044 }
1045 if (!string.IsNullOrEmpty(settings.MaxDate))
1046 {
1047 jsAttributes.Add("maxDate: '" + settings.MaxDate + "'");
1048 }
1049 if (settings.IsInline)
1050 {
1051 jsAttributes.Add("inline: " + Converter.ToString(settings.IsInline).ToLower());
1052 }
1053 if (settings.EnableTime)
1054 {
1055 jsAttributes.Add("enableTime: " + Converter.ToString(settings.EnableTime).ToLower());
1056 }
1057 if (settings.EnableWeekNumbers)
1058 {
1059 jsAttributes.Add("weekNumbers: " + Converter.ToString(settings.EnableWeekNumbers).ToLower());
1060 }
1061
1062 jsAttributes.AddRange(settings.GetFlatPickrOptions().Select(x => x.Key + ": " + x.Value));
1063
1064 <script>
1065 document.addEventListener( "DOMContentLoaded", function () {
1066 flatpickr("#@textField.Id", {
1067 onReady: function(selectedDates, dateStr, instance) {
1068 instance.input.readOnly = false;
1069 },
1070 onOpen: function(selectedDates, dateStr, instance) {
1071 instance.input.readOnly = true;
1072 },
1073 onClose: function(selectedDates, dateStr, instance) {
1074 instance.input.readOnly = false;
1075 //instance.input.blur();
1076 },
1077 @string.Join(",", jsAttributes)
1078 } )
1079 } );
1080 </script>
1081 }
1082 @using System.Reflection
1083 @using Dynamicweb.Rapido.Blocks.Components.General
1084 @using Dynamicweb.Rapido.Blocks.Components
1085
1086 @* Component *@
1087
1088 @helper RenderTextField(TextField settings)
1089 {
1090 var attributes = new Dictionary<string, string>();
1091 if (!string.IsNullOrEmpty(settings.Label) && string.IsNullOrEmpty(settings.Id))
1092 {
1093 settings.Id = Guid.NewGuid().ToString("N");
1094 }
1095
1096 /*base settings*/
1097 if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
1098 if (!string.IsNullOrEmpty(settings.OnClick)) { attributes.Add("onclick", settings.OnClick); }
1099 if (!string.IsNullOrEmpty(settings.OnChange)) { attributes.Add("onchange", settings.OnChange); }
1100 if (settings.Disabled) { attributes.Add("disabled", "true"); }
1101 if (settings.Required) { attributes.Add("required", "true"); }
1102 if (!string.IsNullOrEmpty(settings.Name)) { attributes.Add("name", settings.Name); }
1103 /*end*/
1104
1105 if (!string.IsNullOrEmpty(settings.OnKeyUp)) { attributes.Add("onkeyup", settings.OnKeyUp); }
1106 if (!string.IsNullOrEmpty(settings.OnInput)) { attributes.Add("oninput", settings.OnInput); }
1107 if (!string.IsNullOrEmpty(settings.OnFocus)) { attributes.Add("onfocus", settings.OnFocus); }
1108 if (settings.ReadOnly) { attributes.Add("readonly", "true"); }
1109 if (settings.MaxLength != 0) { attributes.Add("maxlength", settings.MaxLength.ToString()); }
1110 if (!string.IsNullOrEmpty(settings.Placeholder)) { attributes.Add("placeholder", settings.Placeholder); }
1111 attributes.Add("type", Enum.GetName(typeof(TextFieldType), settings.Type).ToLower());
1112 if (settings.Type == TextFieldType.Password) { attributes.Add("autocomplete", "off"); };
1113 if (settings.Value != null) { attributes.Add("value", settings.Value); }
1114
1115 settings.CssClass = "u-full-width " + settings.CssClass;
1116
1117 if (settings.Required && !String.IsNullOrEmpty(settings.Label)) { settings.Label += " <span class=\"required dw-mod\">*</span>"; }
1118
1119 var resultAttributes = attributes.Concat(settings.ExtraAttributes).GroupBy(d => d.Key).ToDictionary (d => d.Key, d => d.Last().Value);
1120
1121 string noMargin = "u-no-margin";
1122 if (!settings.ReadOnly) {
1123 noMargin = "";
1124 }
1125
1126 <div class="form__field-group u-full-width @noMargin @settings.WrapperCssClass dw-mod">
1127 @if (!string.IsNullOrEmpty(settings.Label) || settings.Link != null )
1128 {
1129 <div class="u-full-width">
1130 @if (!string.IsNullOrEmpty(settings.Label)) { <label for="@settings.Id" class="u-pull--left">@settings.Label</label> }
1131 @if (settings.Link != null) {
1132 settings.Link.ButtonLayout = ButtonLayout.LinkClean;
1133
1134 <div class="u-pull--right">
1135 @Render(settings.Link)
1136 </div>
1137 }
1138 </div>
1139
1140 }
1141
1142 @if (!string.IsNullOrEmpty(settings.HelpText))
1143 {
1144 <small class="form__help-text">@settings.HelpText</small>
1145 }
1146
1147 @if (settings.ActionButton != null)
1148 {
1149 settings.ActionButton.CssClass += " btn--condensed u-no-margin";
1150 <div class="form__field-combi u-no-margin dw-mod">
1151 <input @ComponentMethods.AddAttributes(resultAttributes) class="@settings.CssClass dw-mod" />
1152 @Render(settings.ActionButton)
1153 </div>
1154 }
1155 else
1156 {
1157 <input @ComponentMethods.AddAttributes(resultAttributes) class="@settings.CssClass dw-mod" />
1158 }
1159
1160 @Render(new NotificationMessage { Message = settings.ErrorMessage })
1161 </div>
1162 }
1163 @using System.Reflection
1164 @using Dynamicweb.Rapido.Blocks.Components.General
1165 @using Dynamicweb.Rapido.Blocks.Components
1166
1167 @* Component *@
1168
1169 @helper RenderNumberField(NumberField settings)
1170 {
1171 var attributes = new Dictionary<string, string>();
1172 if (!string.IsNullOrEmpty(settings.Label) && string.IsNullOrEmpty(settings.Id))
1173 {
1174 settings.Id = Guid.NewGuid().ToString("N");
1175 }
1176
1177 /*base settings*/
1178 if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
1179 if (!string.IsNullOrEmpty(settings.OnClick)) { attributes.Add("onclick", settings.OnClick); }
1180 if (!string.IsNullOrEmpty(settings.OnChange)) { attributes.Add("onchange", settings.OnChange); }
1181 if (settings.Disabled) { attributes.Add("disabled", "true"); }
1182 if (settings.Required) { attributes.Add("required", "true"); }
1183 if (!string.IsNullOrEmpty(settings.Name)) { attributes.Add("name", settings.Name); }
1184 /*end*/
1185
1186 if (!string.IsNullOrEmpty(settings.OnKeyUp)) { attributes.Add("onkeyup", settings.OnKeyUp); }
1187 if (!string.IsNullOrEmpty(settings.OnInput)) { attributes.Add("oninput", settings.OnInput); }
1188 if (!string.IsNullOrEmpty(settings.OnFocus)) { attributes.Add("onfocus", settings.OnFocus); }
1189 if (settings.ReadOnly) { attributes.Add("readonly", "true"); }
1190 if (settings.Max != null) { attributes.Add("max", settings.Max.ToString()); }
1191 if (settings.Min != null) { attributes.Add("min", settings.Min.ToString()); }
1192 if (settings.Step != 0) { attributes.Add("step", settings.Step.ToString()); }
1193 if (settings.Value != null && !string.IsNullOrEmpty(settings.Value.ToString())) { attributes.Add("value", settings.Value.ToString()); }
1194 attributes.Add("type", "number");
1195
1196 var resultAttributes = attributes.Concat(settings.ExtraAttributes).GroupBy(d => d.Key).ToDictionary (d => d.Key, d => d.Last().Value);
1197
1198 <div class="form__field-group u-full-width @settings.WrapperCssClass dw-mod">
1199 @if (!string.IsNullOrEmpty(settings.Label) || settings.Link != null )
1200 {
1201 <div class="u-full-width">
1202 @if (!string.IsNullOrEmpty(settings.Label)) { <label for="@settings.Id" class="u-pull--left">@settings.Label</label> }
1203 @if (settings.Link != null) {
1204 <div class="u-pull--right">
1205 @{ settings.Link.ButtonLayout = ButtonLayout.LinkClean; }
1206 @Render(settings.Link)
1207 </div>
1208 }
1209 </div>
1210
1211 }
1212
1213 @if (!string.IsNullOrEmpty(settings.HelpText))
1214 {
1215 <small class="form__help-text">@settings.HelpText</small>
1216 }
1217
1218 @if (settings.ActionButton != null)
1219 {
1220 settings.ActionButton.CssClass += " btn--condensed u-no-margin";
1221 <div class="form__field-combi u-no-margin dw-mod">
1222 <input @ComponentMethods.AddAttributes(resultAttributes) class="@settings.CssClass dw-mod" />
1223 @Render(settings.ActionButton)
1224 </div>
1225 }
1226 else
1227 {
1228 <div class="form__field-combi u-no-margin dw-mod">
1229 <input @ComponentMethods.AddAttributes(resultAttributes) class="@settings.CssClass dw-mod" />
1230 </div>
1231 }
1232
1233 @Render(new NotificationMessage { Message = settings.ErrorMessage })
1234 </div>
1235 }
1236 @using System.Reflection
1237 @using Dynamicweb.Rapido.Blocks.Components.General
1238 @using Dynamicweb.Rapido.Blocks.Components
1239
1240
1241 @* Component *@
1242
1243 @helper RenderTextareaField(TextareaField settings)
1244 {
1245 Dictionary<string, string> attributes = new Dictionary<string, string>();
1246 string id = settings.Id;
1247 if (!string.IsNullOrEmpty(settings.Label) && string.IsNullOrEmpty(id))
1248 {
1249 id = Guid.NewGuid().ToString("N");
1250 }
1251
1252 if (!string.IsNullOrEmpty(id)) { attributes.Add("id", id); }
1253 if (!string.IsNullOrEmpty(settings.OnClick)) { attributes.Add("onclick", settings.OnClick); }
1254 if (!string.IsNullOrEmpty(settings.OnKeyUp)) { attributes.Add("onkeyup", settings.OnKeyUp); }
1255 if (!string.IsNullOrEmpty(settings.OnInput)) { attributes.Add("oninput", settings.OnInput); }
1256 if (!string.IsNullOrEmpty(settings.OnFocus)) { attributes.Add("onfocus", settings.OnFocus); }
1257 if (!string.IsNullOrEmpty(settings.OnChange)) { attributes.Add("onchange", settings.OnChange); }
1258 if (!string.IsNullOrEmpty(settings.Placeholder)) { attributes.Add("placeholder", settings.Placeholder); }
1259 if (settings.Disabled) { attributes.Add("disabled", "true"); }
1260 if (settings.Required) { attributes.Add("required", "true"); }
1261 if (settings.ReadOnly) { attributes.Add("readonly", "true"); }
1262 if (settings.MaxLength != 0) { attributes.Add("maxlength", settings.MaxLength.ToString()); }
1263 if (settings.Rows != 0) { attributes.Add("rows", settings.Rows.ToString()); }
1264 attributes.Add("name", settings.Name);
1265
1266 if (settings.Required && !String.IsNullOrEmpty(settings.Label)) { settings.Label += " <span class=\"required dw-mod\">*</span>"; }
1267
1268 <div class="form__field-group @settings.WrapperCssClass dw-mod">
1269 @if (!string.IsNullOrEmpty(settings.Label) || settings.Link != null )
1270 {
1271 <div class="u-full-width">
1272 @if (!string.IsNullOrEmpty(settings.Label)) { <label for="@settings.Id" class="u-pull--left">@settings.Label</label> }
1273 @if (settings.Link != null) {
1274 <div class="u-pull--right">
1275 @{ settings.Link.ButtonLayout = ButtonLayout.LinkClean; }
1276 @Render(settings.Link)
1277 </div>
1278 }
1279 </div>
1280 }
1281
1282 @if (!string.IsNullOrEmpty(settings.HelpText))
1283 {
1284 <small class="form__help-text">@settings.HelpText</small>
1285 }
1286
1287 <textarea class="u-full-width @settings.CssClass dw-mod" @ComponentMethods.AddAttributes(attributes) @ComponentMethods.AddAttributes(settings.ExtraAttributes)>@settings.Value</textarea>
1288
1289 @Render(new NotificationMessage { Message = settings.ErrorMessage })
1290 </div>
1291 }
1292 @using System.Reflection
1293 @using Dynamicweb.Rapido.Blocks.Components.General
1294 @using Dynamicweb.Rapido.Blocks.Components
1295
1296
1297 @* Component *@
1298
1299 @helper RenderHiddenField(HiddenField settings) {
1300 var attributes = new Dictionary<string, string>();
1301 attributes.Add("type", "hidden");
1302 if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
1303 if (settings.Value != null) { attributes.Add("value", settings.Value); }
1304 if (!string.IsNullOrEmpty(settings.Name)) { attributes.Add("name", settings.Name); }
1305
1306 <input @ComponentMethods.AddAttributes(attributes) @ComponentMethods.AddAttributes(settings.ExtraAttributes)/>
1307 }
1308 @using System.Reflection
1309 @using Dynamicweb.Rapido.Blocks.Components.General
1310 @using Dynamicweb.Rapido.Blocks.Components
1311
1312 @* Component *@
1313
1314 @helper RenderCheckboxField(CheckboxField settings)
1315 {
1316 var attributes = new Dictionary<string, string>();
1317 if (!string.IsNullOrEmpty(settings.Label) && string.IsNullOrEmpty(settings.Id))
1318 {
1319 settings.Id = Guid.NewGuid().ToString("N");
1320 }
1321
1322 /*base settings*/
1323 if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
1324 if (!string.IsNullOrEmpty(settings.OnClick)) { attributes.Add("onclick", settings.OnClick); }
1325 if (!string.IsNullOrEmpty(settings.OnChange)) { attributes.Add("onchange", settings.OnChange); }
1326 if (settings.Disabled) { attributes.Add("disabled", "true"); }
1327 if (settings.Required) { attributes.Add("required", "true"); }
1328 if (!string.IsNullOrEmpty(settings.Name)) { attributes.Add("name", settings.Name); }
1329 /*end*/
1330
1331 if (settings.Required && !String.IsNullOrEmpty(settings.Label)) { settings.Label += " <span class=\"required dw-mod\">*</span>"; }
1332
1333 attributes.Add("type", "checkbox");
1334 if (settings.Checked) { attributes.Add("checked", "true"); }
1335 settings.CssClass = "form__control " + settings.CssClass;
1336 if (settings.Value != null) { attributes.Add("value", settings.Value); }
1337
1338 var resultAttributes = attributes.Concat(settings.ExtraAttributes).GroupBy(d => d.Key).ToDictionary (d => d.Key, d => d.Last().Value);
1339
1340 <div class="form__field-group @settings.WrapperCssClass dw-mod">
1341 <input @ComponentMethods.AddAttributes(resultAttributes) class="@settings.CssClass dw-mod" />
1342 @if (!string.IsNullOrEmpty(settings.Label))
1343 {
1344 <label for="@settings.Id" class="dw-mod">@settings.Label</label>
1345 }
1346
1347 @if (settings.Link != null) {
1348 <span>
1349 @{ settings.Link.ButtonLayout = ButtonLayout.LinkClean; }
1350 @Render(settings.Link)
1351 </span>
1352 }
1353
1354 @if (!string.IsNullOrEmpty(settings.HelpText))
1355 {
1356 <small class="form__help-text checkbox-help dw-mod">@settings.HelpText</small>
1357 }
1358 @Render(new NotificationMessage { Message = settings.ErrorMessage })
1359 </div>
1360 }
1361 @using System.Reflection
1362 @using Dynamicweb.Rapido.Blocks.Components.General
1363 @using Dynamicweb.Rapido.Blocks.Components
1364
1365
1366 @* Component *@
1367
1368 @helper RenderCheckboxListField(CheckboxListField settings)
1369 {
1370 <div class="form__field-group @settings.WrapperCssClass u-margin-bottom dw-mod" @ComponentMethods.AddAttributes(settings.ExtraAttributes)>
1371 @if (!string.IsNullOrEmpty(settings.Label) || settings.Link != null )
1372 {
1373 <div class="u-full-width">
1374 @if (!string.IsNullOrEmpty(settings.Label)) { <label for="@settings.Id" class="u-pull--left">@settings.Label</label> }
1375 @if (settings.Link != null) {
1376 <div class="u-pull--right">
1377 @{ settings.Link.ButtonLayout = ButtonLayout.LinkClean; }
1378 @Render(settings.Link)
1379 </div>
1380 }
1381 </div>
1382
1383 }
1384
1385 <div class="u-pull--left">
1386 @if (!string.IsNullOrEmpty(settings.HelpText))
1387 {
1388 <small class="form__help-text">@settings.HelpText</small>
1389 }
1390
1391 @foreach (var item in settings.Options)
1392 {
1393 if (settings.Required)
1394 {
1395 item.Required = true;
1396 }
1397 if (settings.Disabled)
1398 {
1399 item.Disabled = true;
1400 }
1401 if (!string.IsNullOrEmpty(settings.Name))
1402 {
1403 item.Name = settings.Name;
1404 }
1405 if (!string.IsNullOrEmpty(settings.CssClass))
1406 {
1407 item.CssClass += settings.CssClass;
1408 }
1409
1410 /* value is not supported */
1411
1412 if (!string.IsNullOrEmpty(settings.OnClick))
1413 {
1414 item.OnClick += settings.OnClick;
1415 }
1416 if (!string.IsNullOrEmpty(settings.OnChange))
1417 {
1418 item.OnChange += settings.OnChange;
1419 }
1420 @Render(item)
1421 }
1422
1423 @Render(new NotificationMessage { Message = settings.ErrorMessage })
1424 </div>
1425
1426 </div>
1427 }
1428 @using Dynamicweb.Rapido.Blocks.Components.General
1429
1430 @* Component *@
1431
1432 @helper RenderSearch(Search settings)
1433 {
1434 var searchValue = HttpContext.Current.Request.QueryString.Get(settings.SearchParameter) ?? "";
1435 var groupValue = HttpContext.Current.Request.QueryString.Get(settings.GroupsParameter) ?? "";
1436
1437 if (string.IsNullOrEmpty(settings.Id))
1438 {
1439 settings.Id = Guid.NewGuid().ToString("N");
1440 }
1441
1442 var resultAttributes = new Dictionary<string, string>();
1443
1444 if (settings.PageSize != 0)
1445 {
1446 resultAttributes.Add("data-page-size", settings.PageSize.ToString());
1447 }
1448 if (!string.IsNullOrEmpty(settings.GroupItemsFeedUrl))
1449 {
1450 resultAttributes.Add("data-groups-feed-url", settings.GroupItemsFeedUrl);
1451 if (!string.IsNullOrEmpty(groupValue))
1452 {
1453 resultAttributes.Add("data-selected-group", groupValue);
1454 }
1455 if (!string.IsNullOrEmpty(settings.GroupsParameter))
1456 {
1457 resultAttributes.Add("data-groups-parameter", settings.GroupsParameter);
1458 }
1459 }
1460 resultAttributes.Add("data-force-init", "true");
1461 if (settings.GoToFirstSearchResultOnEnter)
1462 {
1463 resultAttributes.Add("data-go-to-first-search-result-on-enter", settings.GoToFirstSearchResultOnEnter.ToString().ToLower());
1464 }
1465 if (!string.IsNullOrEmpty(settings.SearchParameter))
1466 {
1467 resultAttributes.Add("data-search-parameter", settings.SearchParameter);
1468 }
1469 resultAttributes.Add("data-search-feed-url", settings.SearchData.SearchFeedUrl);
1470 resultAttributes.Add("data-results-template-id", settings.SearchData.ResultsTemplateId);
1471
1472 if (settings.SecondSearchData != null)
1473 {
1474 resultAttributes.Add("data-second-search-feed-url", settings.SecondSearchData.SearchFeedUrl);
1475 resultAttributes.Add("data-second-results-template-id", settings.SecondSearchData.ResultsTemplateId);
1476 }
1477 if (!string.IsNullOrEmpty(settings.ResultsPageUrl))
1478 {
1479 resultAttributes.Add("data-results-page-url", settings.ResultsPageUrl);
1480 }
1481
1482 resultAttributes = resultAttributes.Concat(settings.ExtraAttributes).GroupBy(d => d.Key).ToDictionary (d => d.Key, d => d.Last().Value);
1483
1484 string searchFieldCss = (settings.SearchButton == null) ? "search--with-icon" : "";
1485
1486 <div class="search @settings.CssClass @searchFieldCss js-search-data-source dw-mod" id="@settings.Id" @ComponentMethods.AddAttributes(resultAttributes)>
1487 @if (!string.IsNullOrEmpty(settings.GroupItemsFeedUrl))
1488 {
1489 <button type="button" class="search__groups-btn dw-mod js-search-groups-btn">@Translate("All")</button>
1490 <ul class="dropdown dropdown--absolute-position dw-mod search__groups-results js-search-groups-list"></ul>
1491 }
1492
1493 <input type="text" class="search__field dw-mod js-search-field" placeholder="@settings.Placeholder" value="@searchValue">
1494
1495 <div class="dropdown dropdown--absolute-position search__results dw-mod js-search-results @(settings.SecondSearchData != null ? "search__results--combined" : "")">
1496 @if (settings.SecondSearchData != null)
1497 {
1498 <div class="search__column search__column--products dw-mod">
1499 <div class="search__column-header dw-mod">@Translate("Products")</div>
1500 <ul class="search__results-list dw-mod js-search-results-list" id="@(settings.Id)_ResultsList"></ul>
1501 @if (!string.IsNullOrEmpty(settings.SearchData.ResultsPageUrl))
1502 {
1503 @Render(new Link {
1504 Title = Translate("View all"),
1505 CssClass = "js-view-all-button u-margin",
1506 Href = settings.SearchData.ResultsPageUrl
1507 });
1508 }
1509 </div>
1510 <div class="search__column search__column--pages dw-mod">
1511 <div class="search__column-header">@Translate("Pages")</div>
1512 <ul class="search__results-list dw-mod js-search-results-second-list" id="@(settings.Id)_SecondResultsList"></ul>
1513 @if (!string.IsNullOrEmpty(settings.SecondSearchData.ResultsPageUrl))
1514 {
1515 @Render(new Link
1516 {
1517 Title = Translate("View all"),
1518 CssClass = "js-view-all-button u-margin",
1519 Href = settings.SecondSearchData.ResultsPageUrl
1520 });
1521 }
1522 </div>
1523 }
1524 else
1525 {
1526 <div class="search__column search__column--only dw-mod">
1527 <ul class="search__results-list dw-mod js-search-results-list" id="@(settings.Id)_ResultsList"></ul>
1528 @if (!string.IsNullOrEmpty(settings.SearchData.ResultsPageUrl))
1529 {
1530 @Render(new Link {
1531 Title = Translate("View all"),
1532 CssClass = "js-view-all-button u-margin",
1533 Href = settings.SearchData.ResultsPageUrl
1534 });
1535 }
1536 </div>
1537 }
1538 </div>
1539
1540 @if (settings.SearchButton != null)
1541 {
1542 settings.SearchButton.CssClass += " search__btn js-search-btn";
1543 if (settings.RenderDefaultSearchIcon)
1544 {
1545 settings.SearchButton.Icon = new Icon { Name = Pageview.AreaSettings.GetItem("Layout").GetItem("Icons").GetList("SearchIcon").SelectedValue };
1546 }
1547 @Render(settings.SearchButton);
1548 }
1549 </div>
1550 }
1551 @using System.Reflection
1552 @using Dynamicweb.Rapido.Blocks.Components.General
1553 @using Dynamicweb.Rapido.Blocks.Components
1554
1555
1556 @* Component *@
1557
1558 @helper RenderSelectField(SelectField settings)
1559 {
1560 if (!string.IsNullOrEmpty(settings.Label) && string.IsNullOrEmpty(settings.Id))
1561 {
1562 settings.Id = Guid.NewGuid().ToString("N");
1563 }
1564
1565 <div class="form__field-group u-full-width @settings.WrapperCssClass dw-mod">
1566 @if (!string.IsNullOrEmpty(settings.Label) || settings.Link != null )
1567 {
1568 <div class="u-full-width">
1569 @if (!string.IsNullOrEmpty(settings.Label)) { <label for="@settings.Id" class="u-pull--left">@settings.Label</label> }
1570 @if (settings.Link != null) {
1571 <div class="u-pull--right">
1572 @{ settings.Link.ButtonLayout = ButtonLayout.LinkClean; }
1573 @Render(settings.Link)
1574 </div>
1575 }
1576 </div>
1577 }
1578
1579 @if (!string.IsNullOrEmpty(settings.HelpText))
1580 {
1581 <small class="form__help-text">@settings.HelpText</small>
1582 }
1583
1584 @if (settings.ActionButton != null)
1585 {
1586 settings.ActionButton.CssClass += " btn--condensed u-no-margin";
1587 <div class="form__field-combi u-no-margin dw-mod">
1588 @RenderSelectBase(settings)
1589 @Render(settings.ActionButton)
1590 </div>
1591 }
1592 else
1593 {
1594 @RenderSelectBase(settings)
1595 }
1596
1597 @Render(new NotificationMessage { Message = settings.ErrorMessage })
1598 </div>
1599 }
1600
1601 @helper RenderSelectBase(SelectField settings)
1602 {
1603 var attributes = new Dictionary<string, string>();
1604
1605 /*base settings*/
1606 if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
1607 if (!string.IsNullOrEmpty(settings.OnClick)) { attributes.Add("onclick", settings.OnClick); }
1608 if (!string.IsNullOrEmpty(settings.OnChange)) { attributes.Add("onchange", settings.OnChange); }
1609 if (settings.Disabled) { attributes.Add("disabled", "true"); }
1610 if (settings.Required) { attributes.Add("required", "true"); }
1611 if (!string.IsNullOrEmpty(settings.Name)) { attributes.Add("name", settings.Name); }
1612 /*end*/
1613
1614 var resultAttributes = attributes.Concat(settings.ExtraAttributes).GroupBy(d => d.Key).ToDictionary (d => d.Key, d => d.Last().Value);
1615
1616 <select @ComponentMethods.AddAttributes(resultAttributes) class="u-full-width @settings.CssClass dw-mod">
1617 @if (settings.Default != null)
1618 {
1619 @Render(settings.Default)
1620 }
1621
1622 @foreach (var item in settings.Options)
1623 {
1624 if (settings.Value != null) {
1625 item.Checked = item.Value == settings.Value;
1626 }
1627 @Render(item)
1628 }
1629 </select>
1630 }
1631 @using System.Reflection
1632 @using Dynamicweb.Rapido.Blocks.Components.General
1633 @using Dynamicweb.Rapido.Blocks.Components
1634
1635 @* Component *@
1636
1637 @helper RenderRadioButtonField(RadioButtonField settings)
1638 {
1639 var attributes = new Dictionary<string, string>();
1640 if (!string.IsNullOrEmpty(settings.Label) && string.IsNullOrEmpty(settings.Id))
1641 {
1642 settings.Id = Guid.NewGuid().ToString("N");
1643 }
1644
1645 /*base settings*/
1646 if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
1647 if (!string.IsNullOrEmpty(settings.OnClick)) { attributes.Add("onclick", settings.OnClick); }
1648 if (!string.IsNullOrEmpty(settings.OnChange)) { attributes.Add("onchange", settings.OnChange); }
1649 if (settings.Disabled) { attributes.Add("disabled", "true"); }
1650 if (settings.Required) { attributes.Add("required", "true"); }
1651 if (!string.IsNullOrEmpty(settings.Name)) { attributes.Add("name", settings.Name); }
1652 /*end*/
1653
1654 attributes.Add("type", "radio");
1655 if (settings.Checked) { attributes.Add("checked", "true"); }
1656 settings.CssClass = "form__control " + settings.CssClass;
1657 if (settings.Value != null) { attributes.Add("value", settings.Value); }
1658
1659 var resultAttributes = attributes.Concat(settings.ExtraAttributes).GroupBy(d => d.Key).ToDictionary (d => d.Key, d => d.Last().Value);
1660
1661 <div class="form__field-group @settings.WrapperCssClass dw-mod">
1662 <input @ComponentMethods.AddAttributes(resultAttributes) class="@settings.CssClass dw-mod" />
1663 @if (!string.IsNullOrEmpty(settings.Label))
1664 {
1665 <label for="@settings.Id" class="dw-mod">@settings.Label</label>
1666 }
1667 @if (!string.IsNullOrEmpty(settings.HelpText))
1668 {
1669 <small class="form__help-text">@settings.HelpText</small>
1670 }
1671 @Render(new NotificationMessage { Message = settings.ErrorMessage })
1672 </div>
1673 }
1674 @using System.Reflection
1675 @using Dynamicweb.Rapido.Blocks.Components.General
1676 @using Dynamicweb.Rapido.Blocks.Components
1677
1678
1679 @* Component *@
1680
1681 @helper RenderRadioButtonListField(RadioButtonListField settings)
1682 {
1683 if (settings.Required && !String.IsNullOrEmpty(settings.Label)) { settings.Label += " <span class=\"required dw-mod\">*</span>"; }
1684
1685 <div class="form__field-group @settings.WrapperCssClass u-margin-bottom dw-mod" @ComponentMethods.AddAttributes(settings.ExtraAttributes)>
1686 @if (!string.IsNullOrEmpty(settings.Label))
1687 {
1688 <label>@settings.Label</label>
1689 }
1690 @if (!string.IsNullOrEmpty(settings.HelpText))
1691 {
1692 <small class="form__help-text">@settings.HelpText</small>
1693 }
1694
1695 @foreach (var item in settings.Options)
1696 {
1697 if (settings.Required)
1698 {
1699 item.Required = true;
1700 }
1701 if (settings.Disabled)
1702 {
1703 item.Disabled = true;
1704 }
1705 if (!string.IsNullOrEmpty(settings.Name))
1706 {
1707 item.Name = settings.Name;
1708 }
1709 if (settings.Value != null && settings.Value == item.Value)
1710 {
1711 item.Checked = true;
1712 }
1713 if (!string.IsNullOrEmpty(settings.OnClick))
1714 {
1715 item.OnClick += settings.OnClick;
1716 }
1717 if (!string.IsNullOrEmpty(settings.OnChange))
1718 {
1719 item.OnChange += settings.OnChange;
1720 }
1721 if (!string.IsNullOrEmpty(settings.CssClass))
1722 {
1723 item.CssClass += settings.CssClass;
1724 }
1725 @Render(item)
1726 }
1727
1728 @Render(new NotificationMessage { Message = settings.ErrorMessage })
1729 </div>
1730 }
1731 @using System.Reflection
1732 @using Dynamicweb.Rapido.Blocks.Components.General
1733 @using Dynamicweb.Rapido.Blocks.Components
1734
1735
1736 @* Component *@
1737
1738 @helper RenderNotificationMessage(NotificationMessage settings)
1739 {
1740 if (!string.IsNullOrEmpty(settings.Message))
1741 {
1742 var attributes = new Dictionary<string, string>();
1743 if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
1744
1745 string messageTypeClass = Enum.GetName(typeof(NotificationMessageType), settings.MessageType).ToLower();
1746 string messageLayoutClass = Enum.GetName(typeof(NotificationMessageLayout), settings.MessageLayout).ToLower();
1747 string minHeightClass = settings.Icon != null ? "u-min-h70px" : "";
1748
1749 <div class="notification-message-@messageTypeClass notification-message-@messageLayoutClass @messageLayoutClass @minHeightClass @settings.CssClass u-full-width dw-mod" @ComponentMethods.AddAttributes(attributes)>
1750 @if (settings.Icon != null) {
1751 settings.Icon.Label = !string.IsNullOrEmpty(settings.Icon.Label) ? settings.Message + settings.Icon.Label : settings.Message;
1752 @Render(settings.Icon)
1753 } else {
1754 @settings.Message
1755 }
1756 </div>
1757 }
1758 }
1759 @using Dynamicweb.Rapido.Blocks.Components.General
1760
1761
1762 @* Component *@
1763
1764 @helper RenderHandlebarsRoot(HandlebarsRoot settings) {
1765 string preRender = !String.IsNullOrEmpty(settings.PreRenderScriptTemplate) ? "data-pre-render-template=\"" + settings.PreRenderScriptTemplate + "\"" : "";
1766
1767 <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>
1768 @if (settings.SubBlocks != null) {
1769 @RenderBlockList(settings.SubBlocks)
1770 }
1771 </div>
1772 }
1773 @using System.Reflection
1774 @using Dynamicweb.Rapido.Blocks.Components.General
1775 @using Dynamicweb.Rapido.Blocks.Components
1776 @using System.Text.RegularExpressions
1777
1778
1779 @* Component *@
1780
1781 @helper RenderSticker(Sticker settings) {
1782 if (!String.IsNullOrEmpty(settings.Title)) {
1783 string size = settings.Size.ToString() != "None" ? "" + "stickers-container__tag--" + settings.Size.ToString().ToLower() : "";
1784 string style = settings.Style.ToString() != "None" ? "" + "stickers-container__tag--" + settings.Style.ToString().ToLower() : "";
1785
1786 Dictionary<String, String> optionalAttributes = new Dictionary<string, string>();
1787 if (!String.IsNullOrEmpty(settings.Color) || !String.IsNullOrEmpty(settings.BackgroundColor)) {
1788 string styleTag = !String.IsNullOrEmpty(settings.Color) ? "color: " + settings.Color + "; " : "";
1789 styleTag += !String.IsNullOrEmpty(settings.BackgroundColor) ? "background-color: " + settings.BackgroundColor + "; " : "";
1790 optionalAttributes.Add("style", styleTag);
1791 }
1792
1793 <div class="stickers-container__tag @size @style @settings.CssClass dw-mod" @ComponentMethods.AddAttributes(optionalAttributes) @ComponentMethods.AddAttributes(settings.ExtraAttributes)>@settings.Title</div>
1794 }
1795 }
1796
1797 @using System.Reflection
1798 @using Dynamicweb.Rapido.Blocks.Components.General
1799 @using Dynamicweb.Rapido.Blocks.Components
1800
1801
1802 @* Component *@
1803
1804 @helper RenderStickersCollection(StickersCollection settings)
1805 {
1806 if (settings.Stickers.Count > 0)
1807 {
1808 string position = "stickers-container--" + Regex.Replace(settings.Position.ToString(), "([a-z])([A-Z])", "$1-$2").ToLower();
1809
1810 <div class="stickers-container @position @settings.CssClass dw-mod" @ComponentMethods.AddAttributes(settings.ExtraAttributes)>
1811 @foreach (Sticker sticker in settings.Stickers)
1812 {
1813 @Render(sticker)
1814 }
1815 </div>
1816 }
1817 }
1818
1819 @using Dynamicweb.Rapido.Blocks.Components.General
1820
1821
1822 @* Component *@
1823
1824 @helper RenderForm(Form settings) {
1825 if (settings != null)
1826 {
1827 Dictionary<string, string> optionalAttributes = new Dictionary<string, string>();
1828 if (!string.IsNullOrEmpty(settings.Action)) { optionalAttributes.Add("action", settings.Action); };
1829 if (!string.IsNullOrEmpty(settings.Name)) { optionalAttributes.Add("name", settings.Name); };
1830 if (!string.IsNullOrEmpty(settings.OnSubmit)) { optionalAttributes.Add("onsubmit", settings.OnSubmit); };
1831 var enctypes = new Dictionary<string, string>
1832 {
1833 { "multipart", "multipart/form-data" },
1834 { "text", "text/plain" },
1835 { "application", "application/x-www-form-urlencoded" }
1836 };
1837 if (settings.Enctype != FormEnctype.none) { optionalAttributes.Add("enctype", enctypes[Enum.GetName(typeof(FormEnctype), settings.Enctype).ToLower()]); };
1838 optionalAttributes.Add("method", settings.Method.ToString());
1839
1840 if (!string.IsNullOrEmpty(settings.FormStartMarkup))
1841 {
1842 @settings.FormStartMarkup
1843 }
1844 else
1845 {
1846 @:<form class="@settings.CssClass u-no-margin dw-mod" @ComponentMethods.AddAttributes(optionalAttributes) @ComponentMethods.AddAttributes(settings.ExtraAttributes)>
1847 }
1848
1849 foreach (var field in settings.GetFields())
1850 {
1851 @Render(field)
1852 }
1853
1854 @:</form>
1855 }
1856 }
1857 @using System.Reflection
1858 @using Dynamicweb.Rapido.Blocks.Components.General
1859 @using Dynamicweb.Rapido.Blocks.Components
1860
1861
1862 @* Component *@
1863
1864 @helper RenderText(Text settings)
1865 {
1866 @settings.Content
1867 }
1868 @using System.Reflection
1869 @using Dynamicweb.Rapido.Blocks.Components.General
1870 @using Dynamicweb.Rapido.Blocks.Components
1871
1872
1873 @* Component *@
1874
1875 @helper RenderContentModule(ContentModule settings) {
1876 if (!string.IsNullOrEmpty(settings.Content))
1877 {
1878 @settings.Content
1879 }
1880 }
1881 @using System.Reflection
1882 @using Dynamicweb.Rapido.Blocks.Components.General
1883 @using Dynamicweb.Rapido.Blocks.Components
1884
1885
1886 @* Component *@
1887
1888 @helper RenderModal(Modal settings) {
1889 if (settings != null)
1890 {
1891 string modalId = !string.IsNullOrEmpty(settings.Id) ? settings.Id : Guid.NewGuid().ToString("N");
1892
1893 string onchange = !string.IsNullOrEmpty(settings.OnClose) ? "onchange=\"if(!this.checked){" + settings.OnClose + "}\"" : "";
1894
1895 <input type="checkbox" id="@(modalId)ModalTrigger" class="modal-trigger" @onchange />
1896
1897 <div class="modal-container">
1898 @if (!settings.DisableDarkOverlay)
1899 {
1900 <label for="@(modalId)ModalTrigger" id="@(modalId)ModalOverlay" class="modal-overlay"></label>
1901 }
1902 <div class="modal modal--@settings.Width.ToString().ToLower() modal-height--@settings.Height.ToString().ToLower()" id="@(modalId)Modal">
1903 @if (settings.Heading != null)
1904 {
1905 if (!string.IsNullOrEmpty(settings.Heading.Title))
1906 {
1907 <div class="modal__header">
1908 @Render(settings.Heading)
1909 </div>
1910 }
1911 }
1912 <div class="modal__body @(settings.Width.ToString().ToLower() == "full" ? "modal__body--full" : "")">
1913 @if (!string.IsNullOrEmpty(settings.BodyText))
1914 {
1915 @settings.BodyText
1916 }
1917 @if (settings.BodyTemplate != null)
1918 {
1919 @settings.BodyTemplate
1920 }
1921 @{
1922 var actions = settings.GetActions();
1923 }
1924 </div>
1925 @if (actions.Length > 0)
1926 {
1927 <div class="modal__footer">
1928 @foreach (var action in actions)
1929 {
1930 if (Pageview.Device.ToString() != "Mobile") {
1931 action.CssClass += " u-no-margin";
1932 } else {
1933 action.CssClass += " u-full-width u-margin-bottom";
1934 }
1935
1936 @Render(action)
1937 }
1938 </div>
1939 }
1940 <label class="modal__close-btn" for="@(modalId)ModalTrigger"></label>
1941 </div>
1942 </div>
1943 }
1944 }
1945 @using Dynamicweb.Rapido.Blocks.Components.General
1946
1947 @* Component *@
1948
1949 @helper RenderMediaListItem(MediaListItem settings)
1950 {
1951 <div class="media-list-item @settings.CssClass dw-mod" @(!string.IsNullOrEmpty(settings.Id) ? "id=\"" + settings.Id + "\"" : "")>
1952 @if (!string.IsNullOrEmpty(settings.Label))
1953 {
1954 if (!string.IsNullOrEmpty(settings.Link))
1955 {
1956 @Render(new Link
1957 {
1958 Href = settings.Link,
1959 CssClass = "media-list-item__sticker dw-mod",
1960 ButtonLayout = ButtonLayout.None,
1961 Title = settings.Label,
1962 OnClick = !string.IsNullOrEmpty(settings.OnClick) ? settings.OnClick : ""
1963 })
1964 }
1965 else if (!string.IsNullOrEmpty(settings.OnClick))
1966 {
1967 <span class="media-list-item__sticker dw-mod" onclick="@(settings.OnClick)">
1968 <span class="u-uppercase">@settings.Label</span>
1969 </span>
1970 }
1971 else
1972 {
1973 <span class="media-list-item__sticker media-list-item__sticker--no-link dw-mod">
1974 <span class="u-uppercase">@settings.Label</span>
1975 </span>
1976 }
1977 }
1978 <div class="media-list-item__wrap">
1979 <div class="media-list-item__info dw-mod">
1980 <div class="media-list-item__header dw-mod">
1981 @if (!string.IsNullOrEmpty(settings.Title))
1982 {
1983 if (!string.IsNullOrEmpty(settings.Link))
1984 {
1985 @Render(new Link
1986 {
1987 Href = settings.Link,
1988 CssClass = "media-list-item__name dw-mod",
1989 ButtonLayout = ButtonLayout.None,
1990 Title = settings.Title,
1991 OnClick = !string.IsNullOrEmpty(settings.OnClick) ? settings.OnClick : ""
1992 })
1993 }
1994 else if (!string.IsNullOrEmpty(settings.OnClick))
1995 {
1996 <span class="media-list-item__name dw-mod" onclick="@(settings.OnClick)">@settings.Title</span>
1997 }
1998 else
1999 {
2000 <span class="media-list-item__name media-list-item__name--no-link dw-mod">@settings.Title</span>
2001 }
2002 }
2003
2004 @if (!string.IsNullOrEmpty(settings.Status))
2005 {
2006 <div class="media-list-item__state dw-mod">@settings.Status</div>
2007 }
2008 </div>
2009 @{
2010 settings.InfoTable.CssClass += " media-list-item__parameters-table";
2011 }
2012
2013 @Render(settings.InfoTable)
2014 </div>
2015 <div class="media-list-item__actions dw-mod">
2016 <div class="media-list-item__actions-list dw-mod">
2017 @{
2018 var actions = settings.GetActions();
2019
2020 foreach (ButtonBase action in actions)
2021 {
2022 action.ButtonLayout = ButtonLayout.None;
2023 action.CssClass += " media-list-item__action link";
2024
2025 @Render(action)
2026 }
2027 }
2028 </div>
2029
2030 @if (settings.SelectButton != null && !string.IsNullOrEmpty(settings.SelectButton.Title))
2031 {
2032 settings.SelectButton.CssClass += " u-no-margin";
2033
2034 <div class="media-list-item__action-button">
2035 @Render(settings.SelectButton)
2036 </div>
2037 }
2038 </div>
2039 </div>
2040 </div>
2041 }
2042 @using Dynamicweb.Rapido.Blocks.Components.General
2043 @using Dynamicweb.Rapido.Blocks.Components
2044
2045 @helper RenderTable(Table settings)
2046 {
2047 Dictionary<string, string> attributes = new Dictionary<string, string>();
2048 if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
2049
2050 var enumToClasses = new Dictionary<TableDesign, string>
2051 {
2052 { TableDesign.Clean, "table--clean" },
2053 { TableDesign.Bordered, "table--bordered" },
2054 { TableDesign.Striped, "table--striped" },
2055 { TableDesign.Hover, "table--hover" },
2056 { TableDesign.Compact, "table--compact" },
2057 { TableDesign.Condensed, "table--condensed" },
2058 { TableDesign.NoTopBorder, "table--no-top-border" }
2059 };
2060 string tableDesignClass = "";
2061 if (settings.Design != TableDesign.None)
2062 {
2063 tableDesignClass = enumToClasses[settings.Design];
2064 }
2065
2066 if (!string.IsNullOrEmpty(settings.CssClass) || settings.Design != TableDesign.None) { attributes.Add("class", "table " + tableDesignClass + " " + settings.CssClass + " dw-mod"); }
2067
2068 var resultAttributes = attributes.Concat(settings.ExtraAttributes).GroupBy(d => d.Key).ToDictionary(d => d.Key, d => d.Last().Value);
2069
2070 <table @ComponentMethods.AddAttributes(resultAttributes)>
2071 @if (settings.Header != null)
2072 {
2073 <thead>
2074 @Render(settings.Header)
2075 </thead>
2076 }
2077 <tbody>
2078 @foreach (var row in settings.Rows)
2079 {
2080 @Render(row)
2081 }
2082 </tbody>
2083 @if (settings.Footer != null)
2084 {
2085 <tfoot>
2086 @Render(settings.Footer)
2087 </tfoot>
2088 }
2089 </table>
2090 }
2091 @using Dynamicweb.Rapido.Blocks.Components.General
2092 @using Dynamicweb.Rapido.Blocks.Components
2093
2094 @helper RenderTableRow(TableRow settings)
2095 {
2096 Dictionary<string, string> attributes = new Dictionary<string, string>();
2097 if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
2098
2099 var enumToClasses = new Dictionary<TableRowDesign, string>
2100 {
2101 { TableRowDesign.NoBorder, "table__row--no-border" },
2102 { TableRowDesign.Border, "table__row--border" },
2103 { TableRowDesign.TopBorder, "table__row--top-line" },
2104 { TableRowDesign.BottomBorder, "table__row--bottom-line" },
2105 { TableRowDesign.Solid, "table__row--solid" }
2106 };
2107
2108 string tableRowDesignClass = "";
2109 if (settings.Design != TableRowDesign.None)
2110 {
2111 tableRowDesignClass = enumToClasses[settings.Design];
2112 }
2113
2114 if (!string.IsNullOrEmpty(settings.CssClass) || settings.Design != TableRowDesign.None) { attributes.Add("class", "table__row " + tableRowDesignClass + " " + settings.CssClass + " dw-mod"); }
2115
2116 var resultAttributes = attributes.Concat(settings.ExtraAttributes).GroupBy(d => d.Key).ToDictionary(d => d.Key, d => d.Last().Value);
2117
2118 <tr @ComponentMethods.AddAttributes(resultAttributes)>
2119 @foreach (var cell in settings.Cells)
2120 {
2121 if (settings.IsHeaderRow)
2122 {
2123 cell.IsHeader = true;
2124 }
2125 @Render(cell)
2126 }
2127 </tr>
2128 }
2129 @using Dynamicweb.Rapido.Blocks.Components.General
2130 @using Dynamicweb.Rapido.Blocks.Components
2131 @using Dynamicweb.Core
2132
2133 @helper RenderTableCell(TableCell settings)
2134 {
2135 Dictionary<string, string> attributes = new Dictionary<string, string>();
2136 if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
2137 if (settings.Colspan != 0) { attributes.Add("colspan", Converter.ToString(settings.Colspan)); }
2138 if (settings.Rowspan != 0) { attributes.Add("rowspan", Converter.ToString(settings.Rowspan)); }
2139 if (!string.IsNullOrEmpty(settings.CssClass)) { attributes.Add("class", settings.CssClass + " dw-mod"); }
2140
2141 var resultAttributes = attributes.Concat(settings.ExtraAttributes).GroupBy(d => d.Key).ToDictionary(d => d.Key, d => d.Last().Value);
2142
2143 string tagName = settings.IsHeader ? "th" : "td";
2144
2145 @("<" + tagName + " " + ComponentMethods.AddAttributes(resultAttributes) + ">")
2146 @settings.Content
2147 @("</" + tagName + ">");
2148 }
2149 @using System.Linq
2150 @using Dynamicweb.Rapido.Blocks.Components.General
2151
2152 @* Component *@
2153
2154 @helper RenderPagination(Dynamicweb.Rapido.Blocks.Components.General.Pagination settings)
2155 {
2156 var pageNumberQueryStringName = Dynamicweb.Rapido.Services.Pagination.GetPageNumberQueryStringName(settings); // Get the proper 'page number' query string parameter
2157 var queryParameters = Dynamicweb.Rapido.Services.Url.GetQueryParameters(pageNumberQueryStringName); // Get the NameValueCollection from the querystring
2158
2159 if (settings.NumberOfPages > 1)
2160 {
2161 string url = HttpContext.Current.Request.Url.GetLeftPart(UriPartial.Authority) + "/Default.aspx";
2162 string ariaLabel = !string.IsNullOrWhiteSpace(settings.AriaLabel) ? settings.AriaLabel : Translate("Page navigation");
2163 Dictionary<string, int> startAndEndPageNumber = Dynamicweb.Rapido.Services.Pagination.GetStartAndEndPageNumber(settings);
2164
2165 <div class="pager u-margin-top dw-mod @settings.CssClass" aria-label="@ariaLabel">
2166 @if (settings.ShowPagingInfo)
2167 {
2168 <div class="pager__info dw-mod">
2169 @Translate("Page") @settings.CurrentPageNumber @Translate("of") @settings.NumberOfPages
2170 </div>
2171 }
2172 <ul class="pager__list dw-mod">
2173 @if (!string.IsNullOrWhiteSpace(settings.FirstPageUrl) && settings.ShowFirstAndLastControls)
2174 {
2175 @Render(new PaginationItem { Link = settings.FirstPageUrl, Icon = settings.FirstIcon })
2176 }
2177 @if (!string.IsNullOrWhiteSpace(settings.PreviousPageUrl) && settings.ShowNextAndPrevControls)
2178 {
2179 @Render(new PaginationItem { Link = settings.PreviousPageUrl, Icon = settings.PrevIcon })
2180 }
2181 @if (settings.GetPages().Any())
2182 {
2183 foreach (var page in settings.GetPages())
2184 {
2185 @Render(page)
2186 }
2187 }
2188 else
2189 {
2190 for (var page = startAndEndPageNumber["StartPage"]; page <= startAndEndPageNumber["EndPage"]; page++)
2191 {
2192 queryParameters = Dynamicweb.Rapido.Services.Url.UpdateQueryStringParameter(queryParameters, pageNumberQueryStringName, page.ToString());
2193 @Render(new PaginationItem { Label = page.ToString(), Link = Dynamicweb.Rapido.Services.Url.BuildUri(url, queryParameters).PathAndQuery, IsActive = (settings.CurrentPageNumber == page) });
2194 }
2195 }
2196 @if (!string.IsNullOrWhiteSpace(settings.NextPageUrl) && settings.ShowNextAndPrevControls)
2197 {
2198 @Render(new PaginationItem { Link = settings.NextPageUrl, Icon = settings.NextIcon })
2199 }
2200 @if (!string.IsNullOrWhiteSpace(settings.LastPageUrl) && settings.ShowFirstAndLastControls)
2201 {
2202 @Render(new PaginationItem { Link = settings.LastPageUrl, Icon = settings.LastIcon })
2203 }
2204 </ul>
2205 </div>
2206 }
2207 }
2208
2209 @helper RenderPaginationItem(PaginationItem settings)
2210 {
2211 if (settings.Icon == null)
2212 {
2213 settings.Icon = new Icon();
2214 }
2215
2216 settings.Icon.Label = settings.Label;
2217 <li class="pager__btn dw-mod">
2218 @if (settings.IsActive)
2219 {
2220 <span class="pager__num pager__num--current dw-mod">
2221 @Render(settings.Icon)
2222 </span>
2223 }
2224 else
2225 {
2226 <a href="@settings.Link" class="pager__num dw-mod">
2227 @Render(settings.Icon)
2228 </a>
2229 }
2230 </li>
2231 }
2232
2233
2234 @using Dynamicweb.Rapido.Blocks.Components.General
2235 @using Dynamicweb.Rapido.Blocks.Components.Ecommerce
2236
2237
2238 @using Dynamicweb.Rapido.Blocks.Components
2239 @using Dynamicweb.Rapido.Blocks.Components.General
2240 @using Dynamicweb.Rapido.Blocks
2241 @using System.IO
2242
2243
2244 @using Dynamicweb.Rapido.Blocks.Components.General
2245 @using Dynamicweb.Rapido.Blocks.Components.Ecommerce
2246
2247
2248 @* Component *@
2249
2250 @helper RenderVariantMatrix(VariantMatrix settings) {
2251 if (settings != null)
2252 {
2253 int productLoopCounter = 0;
2254 int groupCount = 0;
2255 List<VariantOption> firstDimension = new List<VariantOption>();
2256 List<VariantOption> secondDimension = new List<VariantOption>();
2257 List<VariantOption> thirdDimension = new List<VariantOption>();
2258
2259 foreach (VariantGroup variantGroup in settings.GetVariantGroups())
2260 {
2261 foreach (VariantOption variantOptions in variantGroup.GetVariantOptions())
2262 {
2263 if (groupCount == 0) {
2264 firstDimension.Add(variantOptions);
2265 }
2266 if (groupCount == 1)
2267 {
2268 secondDimension.Add(variantOptions);
2269 }
2270 if (groupCount == 2)
2271 {
2272 thirdDimension.Add(variantOptions);
2273 }
2274 }
2275 groupCount++;
2276 }
2277
2278 int rowCount = 0;
2279 int columnCount = 0;
2280
2281 <script>
2282 var variantsCollection = [];
2283 </script>
2284
2285 <table class="table table--compact js-variants-matrix dw-mod" id="VariantMatrixTable_@settings.ProductId">
2286 @if (groupCount == 1)
2287 {
2288 <tbody>
2289 @foreach (VariantOption firstVariantOption in firstDimension)
2290 {
2291 var variantId = firstVariantOption.Id;
2292 <tr>
2293 <td class="u-bold">
2294 @firstVariantOption.Name
2295 </td>
2296 <td>
2297 @RenderVariantMatrixQuantityField(variantId, settings, productLoopCounter, rowCount, columnCount)
2298 </td>
2299 </tr>
2300 productLoopCounter++;
2301 }
2302
2303 <tr>
2304 <td> </td>
2305 <td>
2306 <div class="qty-field js-total-qty-column-@columnCount dw-mod">0</div>
2307 </td>
2308 </tr>
2309 </tbody>
2310 }
2311 @if (groupCount == 2)
2312 {
2313 <thead>
2314 <tr>
2315 <td> </td>
2316 @foreach (VariantOption variant in secondDimension)
2317 {
2318 <td>@variant.Name</td>
2319 }
2320 </tr>
2321 </thead>
2322 <tbody>
2323 @foreach (VariantOption firstVariantOption in firstDimension)
2324 {
2325 string variantId = "";
2326 columnCount = 0;
2327
2328 <tr>
2329 <td class="u-min-w120px">@firstVariantOption.Name</td>
2330
2331 @foreach (VariantOption secondVariantOption in secondDimension)
2332 {
2333 variantId = firstVariantOption.Id + "." + secondVariantOption.Id;
2334 <td>
2335 @RenderVariantMatrixQuantityField(variantId, settings, productLoopCounter, rowCount, columnCount)
2336 </td>
2337
2338 columnCount++;
2339
2340 productLoopCounter++;
2341 }
2342
2343 <td>
2344 <div class="qty-field js-total-qty-row-@rowCount dw-mod">0</div>
2345 </td>
2346 </tr>
2347
2348 rowCount++;
2349 }
2350
2351 @{
2352 columnCount = 0;
2353 }
2354
2355 <tr>
2356 <td> </td>
2357 @foreach (VariantOption secondVariantOption in secondDimension)
2358 {
2359 <td>
2360 <div class="qty-field js-total-qty-column-@columnCount dw-mod">0</div>
2361 </td>
2362
2363 columnCount++;
2364 }
2365 <td> </td>
2366 </tr>
2367 </tbody>
2368 }
2369 @if (groupCount == 3)
2370 {
2371 <thead>
2372 <tr>
2373 <td> </td>
2374 @foreach (VariantOption thirdVariantOption in thirdDimension)
2375 {
2376 <td>@thirdVariantOption.Name</td>
2377 }
2378 </tr>
2379 </thead>
2380 <tbody>
2381 @foreach (VariantOption firstVariantOption in firstDimension)
2382 {
2383 int colspan = (thirdDimension.Count + 1);
2384
2385 <tr>
2386 <td colspan="@colspan" class="u-color-light-gray--bg u-bold">@firstVariantOption.Name</td>
2387 </tr>
2388
2389 foreach (VariantOption secondVariantOption in secondDimension)
2390 {
2391 string variantId = "";
2392 columnCount = 0;
2393
2394 <tr>
2395 <td class="u-min-w120px">@secondVariantOption.Name</td>
2396
2397 @foreach (VariantOption thirdVariantOption in thirdDimension)
2398 {
2399 variantId = firstVariantOption.Id + "." + secondVariantOption.Id + "." + thirdVariantOption.Id;
2400
2401 <td>
2402 @RenderVariantMatrixQuantityField(variantId, settings, productLoopCounter, rowCount, columnCount)
2403 </td>
2404
2405 columnCount++;
2406 productLoopCounter++;
2407 }
2408
2409 <td>
2410 <div class="qty-field js-total-qty-row-@rowCount dw-mod">0</div>
2411 </td>
2412 </tr>
2413 rowCount++;
2414 }
2415 }
2416
2417 @{
2418 columnCount = 0;
2419 }
2420
2421 <tr>
2422 <td> </td>
2423 @foreach (VariantOption thirdVariantOption in thirdDimension)
2424 {
2425 <td>
2426 <div class="qty-field js-total-qty-column-@columnCount dw-mod">0</div>
2427 </td>
2428
2429 columnCount++;
2430 }
2431 <td> </td>
2432 </tr>
2433 </tbody>
2434 }
2435 </table>
2436
2437 <script>
2438 document.addEventListener("DOMContentLoaded", function (event) {
2439 MatrixUpdateQuantity("@settings.ProductId");
2440 });
2441
2442 MatrixUpdateQuantity = function (productId) {
2443 var currentMatrix = document.getElementById("VariantMatrixTable_" + productId);
2444 var allQtyFields = currentMatrix.getElementsByClassName("js-qty");
2445
2446 var qtyRowArr = [];
2447 var qtyColumnArr = [];
2448
2449 var totalQty = 0;
2450
2451 for (var i = 0; i < allQtyFields.length; i++) {
2452 qtyRowArr[allQtyFields[i].getAttribute("data-qty-row-group")] = 0;
2453 qtyColumnArr[allQtyFields[i].getAttribute("data-qty-column-group")] = 0;
2454 }
2455
2456 for (var i = 0; i < allQtyFields.length; i++) {
2457 qtyRowArr[allQtyFields[i].getAttribute("data-qty-row-group")] += parseFloat(allQtyFields[i].value);
2458 qtyColumnArr[allQtyFields[i].getAttribute("data-qty-column-group")] += parseFloat(allQtyFields[i].value);
2459 totalQty += parseFloat(allQtyFields[i].value);
2460 }
2461
2462 //Update row counters
2463 for (var i = 0; i < qtyRowArr.length; i++) {
2464 var qtyCounter = currentMatrix.getElementsByClassName("js-total-qty-row-" + i)[0];
2465
2466 if (qtyRowArr[i] != undefined && qtyCounter != null) {
2467 var currentCount = qtyCounter.innerHTML;
2468 qtyCounter.innerHTML = qtyRowArr[i];
2469
2470 if (currentCount != qtyCounter.innerHTML) {
2471 qtyCounter.classList.add("qty-field--active");
2472 }
2473 }
2474
2475 }
2476
2477 //Update column counters
2478 for (var i = 0; i < qtyColumnArr.length; i++) {
2479 var qtyCounter = currentMatrix.getElementsByClassName("js-total-qty-column-" + i)[0];
2480
2481 if (qtyColumnArr[i] != undefined && qtyCounter != null) {
2482 var currentCount = qtyCounter.innerHTML;
2483 qtyCounter.innerHTML = qtyColumnArr[i];
2484
2485 if (currentCount != qtyCounter.innerHTML) {
2486 qtyCounter.classList.add("qty-field--active");
2487 }
2488 }
2489 }
2490
2491 if (document.getElementById("TotalQtyCount_" + productId)) {
2492 document.getElementById("TotalQtyCount_" + productId).innerHTML = totalQty;
2493 }
2494
2495 //Clean up animations
2496 setTimeout(function () {
2497 for (var i = 0; i < qtyRowArr.length; i++) {
2498 var qtyCounter = currentMatrix.getElementsByClassName("js-total-qty-row-" + i)[0];
2499 if (qtyCounter != null) {
2500 qtyCounter.classList.remove("qty-field--active");
2501 }
2502 }
2503 for (var i = 0; i < qtyColumnArr.length; i++) {
2504 var qtyCounter = currentMatrix.getElementsByClassName("js-total-qty-column-" + i)[0];
2505 if (qtyCounter != null) {
2506 qtyCounter.classList.remove("qty-field--active");
2507 }
2508 }
2509 }, 1000);
2510 }
2511 </script>
2512 }
2513 }
2514
2515 @helper RenderVariantMatrixQuantityField(string variantId, VariantMatrix settings, int productLoopCounter, int rowCount, int columnCount)
2516 {
2517 string loopCount = productLoopCounter.ToString();
2518
2519 bool combinationFound = false;
2520 double stock = 0;
2521 double quantityValue = 0;
2522 string note = "";
2523
2524 VariantProduct variantProduct = null;
2525
2526 if (settings.GetVariantProducts().TryGetValue(variantId, out variantProduct))
2527 {
2528 stock = variantProduct.Stock;
2529 quantityValue = variantProduct.Quantity;
2530 combinationFound = true;
2531 }
2532
2533 if (combinationFound)
2534 {
2535 <input type="hidden" name="ProductLoopCounter@(loopCount)" value="@loopCount" />
2536 <input type="hidden" name="ProductID@(loopCount)" value="@settings.ProductId" />
2537 <input type="hidden" name="VariantID@(loopCount)" value="@variantId" />
2538 <input type="hidden" name="CurrentNote@(loopCount)" id="CurrentNote_@(settings.ProductId)_@variantId" value="@note" />
2539 <input type="number" name="Quantity@(loopCount)" id="Quantity_@(settings.ProductId)_@variantId" value="@quantityValue" min="0" class="js-qty u-no-margin u-full-max-width" style="width: 100%; max-width: 100%" onkeyup="MatrixUpdateQuantity('@settings.ProductId')" onmouseup="MatrixUpdateQuantity('@settings.ProductId')" data-qty-row-group="@rowCount" data-qty-column-group="@columnCount">
2540
2541 if (stock != 0)
2542 {
2543 <small>@Translate("Stock") @stock</small>
2544 }
2545
2546 <script>
2547 var variants = '{ "ProductId" :' + '"@settings.ProductId"' + ', "VariantId": ' + '"@variantId"' +'}';
2548 variantsCollection.push(variants);
2549 document.getElementById("Quantity_@(settings.ProductId)_@variantId").closest(".js-variants-matrix").setAttribute("data-variants-collection", "[" + variantsCollection + "]" );
2550 </script>
2551 }
2552 else
2553 {
2554 <div class="use-btn-height" style="background-color: #a8a8a8"></div>
2555 }
2556 }
2557 @using Dynamicweb.Rapido.Blocks.Components.Ecommerce
2558
2559 @* Component *@
2560
2561 @helper RenderAddToCart(AddToCart settings)
2562 {
2563 //set Id for quantity selector to get it's value from button
2564 if (settings.QuantitySelector != null)
2565 {
2566 if (string.IsNullOrEmpty(settings.QuantitySelector.Id))
2567 {
2568 settings.QuantitySelector.Id = Guid.NewGuid().ToString("N");
2569 }
2570
2571 settings.AddButton.QuantitySelectorId = settings.QuantitySelector.Id;
2572
2573 if (settings.Disabled)
2574 {
2575 settings.QuantitySelector.Disabled = true;
2576 }
2577
2578 if (string.IsNullOrEmpty(settings.QuantitySelector.Name))
2579 {
2580 settings.QuantitySelector.Name = settings.QuantitySelector.Id;
2581 }
2582 }
2583
2584 if (settings.Disabled)
2585 {
2586 settings.AddButton.Disabled = true;
2587 }
2588
2589 settings.AddButton.CssClass += " btn--condensed";
2590
2591 //unitsSelector
2592 if (settings.UnitSelector != null)
2593 {
2594 if (settings.Disabled)
2595 {
2596 settings.QuantitySelector.Disabled = true;
2597 }
2598 }
2599
2600 if (Pageview.Device.ToString() == "Mobile") {
2601 if (settings.UnitSelector != null)
2602 {
2603 <div class="margin-sm margin-position-bottom">
2604 @Render(settings.UnitSelector)
2605 </div>
2606 }
2607 }
2608
2609 <div class="buttons-collection @settings.WrapperCssClass" @ComponentMethods.AddAttributes(settings.ExtraAttributes)>
2610 @if (Pageview.Device.ToString() != "Mobile") {
2611 if (settings.UnitSelector != null)
2612 {
2613 @Render(settings.UnitSelector)
2614 }
2615 }
2616 @if (settings.QuantitySelector != null)
2617 {
2618 @Render(settings.QuantitySelector)
2619 }
2620 @Render(settings.AddButton)
2621 </div>
2622 }
2623 @using Dynamicweb.Rapido.Blocks.Components.Ecommerce
2624
2625 @* Component *@
2626
2627 @helper RenderAddToCartButton(AddToCartButton settings)
2628 {
2629 if (!settings.HideTitle)
2630 {
2631 if (string.IsNullOrEmpty(settings.Title))
2632 {
2633 if (settings.BuyForPoints)
2634 {
2635 settings.Title = Translate("Buy with points");
2636 }
2637 else
2638 {
2639 settings.Title = Translate("Add to cart");
2640 }
2641 }
2642 }
2643 else
2644 {
2645 settings.Title = "";
2646 }
2647
2648 if (settings.Icon == null)
2649 {
2650 settings.Icon = new Icon();
2651 settings.Icon.LabelPosition = Dynamicweb.Rapido.Blocks.Components.General.IconLabelPosition.After;
2652 }
2653
2654 if (string.IsNullOrEmpty(settings.Icon.Name))
2655 {
2656 settings.Icon.Name = Pageview.AreaSettings.GetItem("Layout").GetItem("Icons").GetList("CartIcon").SelectedValue;
2657 }
2658
2659 if (settings.CssClass.Contains("required-fields-true"))
2660 {
2661 settings.ExtraAttributes = new Dictionary<string, string>
2662 {
2663 {"addtocart", "Cart.AddToCart(event, { " +
2664 "id: '" + settings.ProductId + "'," +
2665 (!string.IsNullOrEmpty(settings.VariantId) ? "variantId: '" + settings.VariantId + "'," : "") +
2666 (!string.IsNullOrEmpty(settings.UnitId) ? "unitId: '" + settings.UnitId + "'," : "") +
2667 (settings.BuyForPoints ? "buyForPoints: true," : "") +
2668 "productName: '#ProductName#',itemNumber: '#ItemNumber#',seriesNumber: '#SeriesNumber#',dateOfPurchase: '#DateOfPurchase#',thermexOrderNumber: '#ThermexOrderNumber#',invoiceCopy: '#InvoiceCopy#'," +
2669 (!string.IsNullOrEmpty(settings.ProductInfo) ? "productInfo: " + settings.ProductInfo + "," : "") +
2670 "quantity: " + (string.IsNullOrEmpty(settings.QuantitySelectorId) ? "1" : "parseFloat(document.getElementById('" + settings.QuantitySelectorId + "').value)") +
2671 "});" + settings.OnClick}
2672 };
2673 settings.OnClick = "document.getElementById('WarrantyProductBlockComponentModalTrigger').checked = true;";
2674 }
2675 else
2676 {
2677 settings.OnClick = "Cart.AddToCart(event, { " +
2678 "id: '" + settings.ProductId + "'," +
2679 (!string.IsNullOrEmpty(settings.VariantId) ? "variantId: '" + settings.VariantId + "'," : "") +
2680 (!string.IsNullOrEmpty(settings.UnitId) ? "unitId: '" + settings.UnitId + "'," : "") +
2681 (settings.BuyForPoints ? "buyForPoints: true," : "") +
2682 (!string.IsNullOrEmpty(settings.ProductInfo) ? "productInfo: " + settings.ProductInfo + "," : "") +
2683 "quantity: " + (string.IsNullOrEmpty(settings.QuantitySelectorId) ? "1" : "parseFloat(document.getElementById('" + settings.QuantitySelectorId + "').value)") +
2684 "});" + settings.OnClick;
2685 }
2686
2687 @RenderButton(settings)
2688 }
2689 @using Dynamicweb.Rapido.Blocks.Components.Ecommerce
2690
2691 @* Component *@
2692
2693 @helper RenderUnitSelector(UnitSelector settings)
2694 {
2695 if (string.IsNullOrEmpty(settings.Id))
2696 {
2697 settings.Id = Guid.NewGuid().ToString("N");
2698 }
2699 var disabledClass = settings.Disabled ? "disabled" : "";
2700
2701 <input type="checkbox" id="@settings.Id" class="dropdown-trigger" />
2702 <div class="dropdown unit-selector @settings.CssClass @disabledClass dw-mod" @ComponentMethods.AddAttributes(settings.ExtraAttributes)>
2703 <label class="dropdown__header dropdown__btn dropdown__btn--unit-selector dw-mod" for="@settings.Id">@settings.SelectedOption</label>
2704 <div class="dropdown__content dw-mod">
2705 @settings.OptionsContent
2706 </div>
2707 <label class="dropdown-trigger-off" for="@settings.Id"></label>
2708 </div>
2709 }
2710 @using System.Reflection
2711 @using Dynamicweb.Rapido.Blocks.Components.Ecommerce
2712
2713 @* Component *@
2714
2715 @helper RenderQuantitySelector(QuantitySelector settings)
2716 {
2717 var attributes = new Dictionary<string, string>();
2718
2719 /*base settings*/
2720 if (!string.IsNullOrEmpty(settings.Id)) { attributes.Add("id", settings.Id); }
2721 if (!string.IsNullOrEmpty(settings.OnClick)) { attributes.Add("onclick", settings.OnClick); }
2722 if (!string.IsNullOrEmpty(settings.OnChange)) { attributes.Add("onchange", settings.OnChange); }
2723 if (settings.Disabled) { attributes.Add("disabled", "true"); }
2724 if (settings.Required) { attributes.Add("required", "true"); }
2725 if (!string.IsNullOrEmpty(settings.Name)) { attributes.Add("name", settings.Name); }
2726 /*end*/
2727
2728 if (!string.IsNullOrEmpty(settings.OnKeyUp)) { attributes.Add("onkeyup", settings.OnKeyUp); }
2729 if (!string.IsNullOrEmpty(settings.OnInput)) { attributes.Add("oninput", settings.OnInput); }
2730 if (!string.IsNullOrEmpty(settings.OnFocus)) { attributes.Add("onfocus", settings.OnFocus); }
2731 if (settings.ReadOnly) { attributes.Add("readonly", "true"); }
2732 if (settings.Max != null) { attributes.Add("max", settings.Max.ToString()); }
2733 if (settings.Min == null) { settings.Min = 1; }
2734 attributes.Add("min", settings.Min.ToString());
2735 if (settings.Step != null && !string.IsNullOrEmpty(settings.Step.ToString())) { attributes.Add("step", settings.Step.ToString()); }
2736 if (settings.Value == null) { settings.Value = 1; }
2737 attributes.Add("value", settings.Value.ToString());
2738 attributes.Add("type", "number");
2739
2740 var resultAttributes = attributes.Concat(settings.ExtraAttributes).GroupBy(d => d.Key).ToDictionary (d => d.Key, d => d.Last().Value);
2741
2742 <input @ComponentMethods.AddAttributes(resultAttributes) class="@settings.CssClass dw-mod" />
2743 }
2744 @using Dynamicweb.Rapido.Blocks.Components
2745
2746 @using Dynamicweb.Frontend
2747 @using Dynamicweb.Frontend.Devices
2748 @using Dynamicweb.Rapido.Blocks.Components.Ecommerce
2749 @using Dynamicweb.Rapido.Blocks.Components.General
2750 @using System.Collections.Generic;
2751
2752 @* Component *@
2753
2754 @helper RenderCustomerCenterList(CustomerCenterList settings)
2755 {
2756 bool isTouchDevice = Pageview.Device.ToString() == "Mobile" || Pageview.Device.ToString() == "Tablet" ? true : false;
2757 string hideActions = isTouchDevice ? "u-block" : "";
2758
2759 <table class="table data-list dw-mod">
2760 @if (settings.GetHeaders().Length > 0) {
2761 <thead>
2762 <tr class="u-bold">
2763 @foreach (CustomerCenterListHeaderItem header in settings.GetHeaders())
2764 {
2765 var attributes = new Dictionary<string, string>();
2766 if (!string.IsNullOrEmpty(header.Id)) { attributes.Add("id", header.Id); }
2767 if (!string.IsNullOrEmpty(header.CssClass)) { attributes.Add("class", header.CssClass); }
2768 attributes.Add("align", header.Align.ToString());
2769 attributes = attributes.Concat(header.ExtraAttributes).GroupBy(d => d.Key).ToDictionary (d => d.Key, d => d.Last().Value);
2770
2771 <td @ComponentMethods.AddAttributes(attributes)>@header.Title</td>
2772 }
2773 </tr>
2774 </thead>
2775 }
2776 @foreach (CustomerCenterListItem listItem in settings.GetItems())
2777 {
2778 int columnCount = 0;
2779 int totalColumns = listItem.GetInfoItems().Length;
2780 string rowHasActions = listItem.GetActions().Length > 0 ? "data-list__item--has-actions" : "";
2781 listItem.Id = !string.IsNullOrEmpty(listItem.Id) ? listItem.Id : Guid.NewGuid().ToString("N");
2782
2783 var attributes = new Dictionary<string, string>();
2784 if (!string.IsNullOrEmpty(listItem.Title)) { attributes.Add("title", listItem.Title); };
2785
2786 attributes = attributes.Concat(listItem.ExtraAttributes).GroupBy(d => d.Key).ToDictionary (d => d.Key, d => d.Last().Value);
2787 <tbody class="data-list__item @rowHasActions @listItem.CssClass dw-mod" @ComponentMethods.AddAttributes(attributes)>
2788 <tr>
2789 @if (!string.IsNullOrEmpty(listItem.Title) || !string.IsNullOrEmpty(listItem.Description)) {
2790 string onClick = !string.IsNullOrEmpty(listItem.OnClick) ? "onclick=\"" + listItem.OnClick + "\"" : "";
2791
2792 <td rowspan="2" @onClick class="data-list__main-item dw-mod">
2793 @if (!string.IsNullOrEmpty(listItem.Title)) {
2794 <div class="u-bold">@listItem.Title</div>
2795 }
2796 @if (!string.IsNullOrEmpty(listItem.Description)) {
2797 <div>@listItem.Description</div>
2798 }
2799 </td>
2800 }
2801
2802 @foreach (CustomerCenterListInfoItem infoItem in listItem.GetInfoItems())
2803 {
2804 var infoAttributes = new Dictionary<string, string>();
2805 if (!string.IsNullOrEmpty(infoItem.Id)) { infoAttributes.Add("id", infoItem.Id); };
2806 if (!string.IsNullOrEmpty(infoItem.OnClick)) { infoAttributes.Add("onclick", infoItem.OnClick); };
2807 infoAttributes.Add("align", infoItem.Align.ToString());
2808
2809 infoAttributes = infoAttributes.Concat(infoItem.ExtraAttributes).GroupBy(d => d.Key).ToDictionary (d => d.Key, d => d.Last().Value);
2810 string columnClick = columnCount < (totalColumns-1) && !string.IsNullOrEmpty(listItem.OnClick) ? "onclick=\"" + listItem.OnClick + "\"" : "";
2811
2812 <td @ComponentMethods.AddAttributes(infoAttributes) @columnClick class="data-list__info-item dw-mod">
2813 @if (!string.IsNullOrEmpty(infoItem.Title)) {
2814 <div>@infoItem.Title</div>
2815 }
2816 @if (!string.IsNullOrEmpty(infoItem.Subtitle)) {
2817 <div><small>@infoItem.Subtitle</small></div>
2818 }
2819 </td>
2820
2821 columnCount++;
2822 }
2823 </tr>
2824 <tr>
2825 <td colspan="7" align="right" class="u-va-bottom u-no-border">
2826 <div class="data-list__actions @hideActions dw-mod" id="ActionsMenu_@listItem.Id">
2827 @foreach (ButtonBase action in listItem.GetActions())
2828 {
2829 action.ButtonLayout = ButtonLayout.LinkClean;
2830 action.Icon.CssClass += " u-full-height";
2831 action.CssClass += " data-list__action-button link";
2832
2833 @Render(action)
2834 }
2835 </div>
2836 </td>
2837 </tr>
2838 </tbody>
2839 }
2840 </table>
2841 }
2842 @using Dynamicweb.Frontend
2843 @using System.Reflection
2844 @using Dynamicweb.Content.Items
2845 @using System.Web.UI.HtmlControls
2846 @using Dynamicweb.Rapido.Blocks.Components
2847 @using Dynamicweb.Rapido.Blocks
2848 @using Dynamicweb.Rapido.Blocks.Components.Articles
2849
2850 @* Components for the articles *@
2851 @using System.Reflection
2852 @using Dynamicweb.Rapido.Blocks.Components.Articles
2853
2854
2855 @* Component for the articles *@
2856
2857 @helper RenderArticleBanner(dynamic settings) {
2858 string filterClasses = "image-filter image-filter--darken";
2859 settings.Layout = ArticleHeaderLayout.Banner;
2860
2861 if (settings.Image != null)
2862 {
2863 if (settings.Image.Path != null)
2864 {
2865 <section class="multiple-paragraphs-container u-color-light paragraph-container--full-width">
2866 <div class="background-image @filterClasses dw-mod">
2867 <div class="background-image__wrapper @filterClasses dw-mod">
2868 @{
2869 settings.Image.CssClass += "background-image__cover dw-mod";
2870 }
2871 @Render(settings.Image)
2872 </div>
2873 </div>
2874 <div class="center-container dw-mod">
2875 <div class="grid grid--align-content-start grid--justify-center dw-mod">
2876 <div class="grid__col-md-8 grid__col-xs-12 paragraph-container paragraph-container--height-lg">
2877 <div class="u-left-middle">
2878 <div>
2879 @if (!String.IsNullOrEmpty(settings.Heading))
2880 {
2881 <h1 class="article__header article__header--giant dw-mod" style="color: @settings.TextColor">@settings.Heading</h1>
2882 }
2883 @if (!String.IsNullOrEmpty(settings.Subheading))
2884 {
2885 <div class="article__leadtext dw-mod" style="color: @settings.TextColor">@settings.Subheading</div>
2886 }
2887 @if (!String.IsNullOrEmpty(settings.Author) || !String.IsNullOrEmpty(settings.Date))
2888 {
2889 <small class="article__post-info u-margin-bottom--lg dw-mod" style="color: @settings.TextColor">@settings.Author @settings.Date</small>
2890 }
2891 @if (!String.IsNullOrEmpty(settings.Link)) {
2892 <div class="grid__cell">
2893 @Render(new Link { Href = settings.Link, Title = settings.LinkText, ButtonLayout = settings.ButtonLayout })
2894 </div>
2895 }
2896 </div>
2897 </div>
2898 </div>
2899 @if (settings.ExternalParagraphId != 0)
2900 {
2901 <div class="grid__col-md-4 grid__col-sm-12 grid__col-xs-12 paragraph-container paragraph-container--height-auto dw-mod">
2902 <div class="u-color-light-gray--bg u-color-dark dw-mod">
2903 @RenderParagraphContent(settings.ExternalParagraphId)
2904 </div>
2905 </div>
2906 }
2907
2908 </div>
2909 </div>
2910 </section>
2911 if (!String.IsNullOrEmpty(settings.Image.Caption)) {
2912 <div class="image-caption dw-mod">@settings.Image.Caption</div>
2913 }
2914 }
2915 else
2916 {
2917 settings.Layout = ArticleHeaderLayout.Clean;
2918 @RenderArticleCleanHeader(settings);
2919 }
2920 }
2921 else
2922 {
2923 settings.Layout = ArticleHeaderLayout.Clean;
2924 @RenderArticleCleanHeader(settings);
2925 }
2926 }
2927 @using System.Reflection
2928 @using Dynamicweb.Rapido.Blocks.Components
2929 @using Dynamicweb.Rapido.Blocks.Components.General
2930 @using Dynamicweb.Rapido.Blocks.Components.Articles
2931 @using Dynamicweb.Rapido.Blocks
2932
2933
2934 @* Component for the articles *@
2935
2936 @helper RenderArticleHeader(ArticleHeader settings) {
2937 dynamic[] methodParameters = new dynamic[1];
2938 methodParameters[0] = settings;
2939 MethodInfo customMethod = this.GetType().GetMethod("RenderArticleHeaderCustom");
2940
2941 if (customMethod != null)
2942 {
2943 @customMethod.Invoke(this, methodParameters).ToString();
2944 } else {
2945 switch (settings.Layout)
2946 {
2947 case ArticleHeaderLayout.Clean:
2948 @RenderArticleCleanHeader(settings);
2949 break;
2950 case ArticleHeaderLayout.Split:
2951 @RenderArticleSplitHeader(settings);
2952 break;
2953 case ArticleHeaderLayout.Banner:
2954 @RenderArticleBannerHeader(settings);
2955 break;
2956 case ArticleHeaderLayout.Overlay:
2957 @RenderArticleOverlayHeader(settings);
2958 break;
2959 default:
2960 @RenderArticleCleanHeader(settings);
2961 break;
2962 }
2963 }
2964 }
2965
2966 @helper RenderArticleCleanHeader(ArticleHeader settings) {
2967 dynamic[] methodParameters = new dynamic[1];
2968 methodParameters[0] = settings;
2969 MethodInfo customMethod = this.GetType().GetMethod("RenderArticleCleanHeaderCustom");
2970
2971 if (customMethod != null)
2972 {
2973 @customMethod.Invoke(this, methodParameters).ToString();
2974 }
2975 else
2976 {
2977 string contentColumns = settings.TextLayout != ArticleHeaderTextLayout.Full ? "8" : "12";
2978
2979 <div class="grid grid--align-content-start grid--justify-start">
2980 <div class="grid__col-md-@contentColumns grid__col-sm-12 u-padding--lg dw-mod">
2981 @if (!String.IsNullOrEmpty(settings.Category) || !String.IsNullOrEmpty(settings.Author) || !String.IsNullOrEmpty(settings.Date) || settings.RatingOutOf != 0)
2982 {
2983 <div class="u-border-bottom u-padding-bottom">
2984 @if (!String.IsNullOrEmpty(settings.Category))
2985 {
2986 <div class="u-pull--left">
2987 <div class="article__category dw-mod" style="color: @settings.CategoryColor">@settings.Category</div>
2988 </div>
2989 }
2990 <div class="u-pull--right">
2991 @if (!String.IsNullOrEmpty(settings.Author) || !String.IsNullOrEmpty(settings.Date))
2992 {
2993 <small class="article__post-info dw-mod">@settings.Author @settings.Date</small>
2994 }
2995 @if (settings.RatingOutOf != 0)
2996 {
2997 @Render(new Rating { Score = settings.RatingScore, OutOf = settings.RatingOutOf })
2998 }
2999 </div>
3000 </div>
3001 }
3002
3003 <div class="grid__cell">
3004 @if (!String.IsNullOrEmpty(settings.Heading))
3005 {
3006 <h1 class="article__header article__header--giant dw-mod">@settings.Heading</h1>
3007 }
3008 @if (settings.Image != null)
3009 {
3010 if (settings.Image.Path != null)
3011 {
3012 <div class="u-padding-bottom--lg">
3013 @Render(settings.Image)
3014 </div>
3015 }
3016 }
3017 @if (!String.IsNullOrEmpty(settings.Subheading))
3018 {
3019 <div class="article__leadtext dw-mod">@settings.Subheading</div>
3020 }
3021 @if (!String.IsNullOrEmpty(settings.Link))
3022 {
3023 <div class="grid__cell">
3024 @Render(new Link { Href = settings.Link, Title = settings.LinkText, ButtonLayout = settings.ButtonLayout })
3025 </div>
3026 }
3027 </div>
3028 </div>
3029 @if (settings.ExternalParagraphId != 0)
3030 {
3031 <div class="grid__col-md-4 grid__col-sm-12 u-padding--lg u-color-light-gray--bg dw-mod">
3032 @RenderParagraphContent(settings.ExternalParagraphId)
3033 </div>
3034 }
3035 </div>
3036 }
3037 }
3038
3039 @helper RenderArticleSplitHeader(ArticleHeader settings) {
3040 dynamic[] methodParameters = new dynamic[1];
3041 methodParameters[0] = settings;
3042 MethodInfo customMethod = this.GetType().GetMethod("RenderArticleSplitHeaderCustom");
3043
3044 if (customMethod != null)
3045 {
3046 @customMethod.Invoke(this, methodParameters).ToString();
3047 }
3048 else
3049 {
3050 string headerColumnWidth = settings.ExternalParagraphId != 0 ? "4" : "6";
3051
3052 if (settings.Image != null)
3053 {
3054 if (settings.Image.Path != null)
3055 {
3056 <section class="multiple-paragraphs-container paragraph-container--full-width">
3057 <div class="grid">
3058 <div class="grid__col-md-@headerColumnWidth grid__col-sm-12 grid__col-xs-12 paragraph-container paragraph-container--height-xl dw-mod">
3059 <div class="u-left-middle u-padding--lg">
3060 <div>
3061 @if (!String.IsNullOrEmpty(settings.Category))
3062 {
3063 <div class="article__category dw-mod" style="color: @settings.CategoryColor">@settings.Category</div>
3064 }
3065 @if (!String.IsNullOrEmpty(settings.Heading))
3066 {
3067 <h1 class="article__header article__header--giant dw-mod">@settings.Heading</h1>
3068 }
3069 @if (!String.IsNullOrEmpty(settings.Subheading))
3070 {
3071 <div class="article__leadtext dw-mod">@settings.Subheading</div>
3072 }
3073 @if (!String.IsNullOrEmpty(settings.Author) || !String.IsNullOrEmpty(settings.Date))
3074 {
3075 <small class="article__post-info u-pull--left dw-mod">@settings.Author @settings.Date</small>
3076 }
3077 @if (settings.RatingOutOf != 0)
3078 {
3079 <div class="u-pull--right">
3080 @Render(new Rating { Score = settings.RatingScore, OutOf = settings.RatingOutOf })
3081 </div>
3082 }
3083 @if (!String.IsNullOrEmpty(settings.Link)) {
3084 <div class="u-full-width u-pull--left u-margin-top">
3085 @Render(new Link { Href = settings.Link, Title = settings.LinkText, ButtonLayout = settings.ButtonLayout })
3086 </div>
3087 }
3088 </div>
3089 </div>
3090 </div>
3091 <div class="grid__col-md-@headerColumnWidth grid__col-sm-12 grid__col-xs-12 paragraph-container paragraph-container--height-auto dw-mod" style="background-image:url(/Admin/Public/GetImage.ashx?width=1800&height=1100&crop=0&Compression=85&DoNotUpscale=true&image=@settings.Image.Path); background-position: center center; background-size: cover;"></div>
3092 @if (settings.ExternalParagraphId != 0)
3093 {
3094 <div class="grid__col-md-4 grid__col-sm-12 grid__col-xs-12 paragraph-container paragraph-container--height-auto u-color-light-gray--bg dw-mod">
3095 @RenderParagraphContent(settings.ExternalParagraphId)
3096 </div>
3097 }
3098 </div>
3099 </section>
3100 }
3101 }
3102 else
3103 {
3104 @RenderArticleCleanHeader(settings);
3105 }
3106 }
3107 }
3108
3109 @helper RenderArticleOverlayHeader(ArticleHeader settings) {
3110 dynamic[] methodParameters = new dynamic[1];
3111 methodParameters[0] = settings;
3112 MethodInfo customMethod = this.GetType().GetMethod("RenderArticleOverlayHeaderCustom");
3113
3114 if (customMethod != null)
3115 {
3116 @customMethod.Invoke(this, methodParameters).ToString();
3117 }
3118 else
3119 {
3120 string contentColumns = settings.TextLayout != ArticleHeaderTextLayout.Full ? "8" : "12";
3121 string contentAlignment = settings.TextLayout == ArticleHeaderTextLayout.Center ? "grid--justify-center" : "";
3122
3123 if (settings.Image != null)
3124 {
3125 if (settings.Image.Path != null)
3126 {
3127 if (settings.ExternalParagraphId == 0)
3128 {
3129 <section class="multiple-paragraphs-container u-color-light paragraph-container--full-width">
3130 <div class="background-image image-filter image-filter--darken dw-mod">
3131 <div class="background-image__wrapper image-filter image-filter--darken dw-mod">
3132 @{
3133 settings.Image.CssClass += "background-image__cover dw-mod";
3134 }
3135 @Render(settings.Image)
3136 </div>
3137 </div>
3138 <div class="center-container dw-mod">
3139 <div class="grid @contentAlignment">
3140 <div class="grid__col-md-@contentColumns grid__col-xs-12 paragraph-container paragraph-container--height-xl dw-mod">
3141 @if (!string.IsNullOrEmpty(settings.Heading))
3142 {
3143 <h1 class="article__header article__header--giant u-padding-top--lg dw-mod" style="color: @settings.TextColor">@settings.Heading</h1>
3144 }
3145 @if (!String.IsNullOrEmpty(settings.Subheading))
3146 {
3147 <div class="article__leadtext dw-mod" style="color: @settings.TextColor">@settings.Subheading</div>
3148 }
3149 <div class="u-margin-top">
3150 @if (!String.IsNullOrEmpty(settings.Author) || !String.IsNullOrEmpty(settings.Date))
3151 {
3152 <small class="article__post-info u-pull--left dw-mod" style="color: @settings.TextColor">@settings.Author @settings.Date</small>
3153 }
3154 @if (settings.RatingOutOf != 0)
3155 {
3156 <div class="u-pull--right">
3157 @Render(new Rating { Score = settings.RatingScore, OutOf = settings.RatingOutOf })
3158 </div>
3159 }
3160 </div>
3161 @if (!String.IsNullOrEmpty(settings.Link))
3162 {
3163 <div class="grid__cell">
3164 @Render(new Link { Href = settings.Link, Title = settings.LinkText, ButtonLayout = settings.ButtonLayout })
3165 </div>
3166 }
3167 </div>
3168 </div>
3169 </div>
3170 </section>
3171 }
3172 else
3173 {
3174 @RenderArticleBanner(settings);
3175 }
3176 }
3177 }
3178 else
3179 {
3180 @RenderArticleCleanHeader(settings);
3181 }
3182 }
3183 }
3184
3185 @helper RenderArticleBannerHeader(dynamic settings) {
3186 dynamic[] methodParameters = new dynamic[1];
3187 methodParameters[0] = settings;
3188 MethodInfo customMethod = this.GetType().GetMethod("RenderArticleBannerHeaderCustom");
3189
3190 if (customMethod != null)
3191 {
3192 @customMethod.Invoke(this, methodParameters).ToString();
3193 }
3194 else
3195 {
3196 @RenderArticleBanner(settings);
3197 }
3198 }
3199 @using System.Reflection
3200 @using System.Text.RegularExpressions;
3201 @using Dynamicweb.Frontend
3202 @using Dynamicweb.Content.Items
3203 @using Dynamicweb.Rapido.Blocks.Components
3204 @using Dynamicweb.Rapido.Blocks.Components.Articles
3205 @using Dynamicweb.Rapido.Blocks
3206
3207 @* Component for the articles *@
3208
3209 @helper RenderArticleBodyRow(ArticleBodyRow settings)
3210 {
3211 string position = settings.TopLayout == "overlay" ? "article__overlay-offset" : "";
3212 string contentAlignment = settings.TextLayout == "center" ? "grid--justify-center" : "";
3213
3214 <div class="grid grid--align-content-start body-row @contentAlignment @position dw-mod">
3215 @RenderBlockList(settings.SubBlocks)
3216 </div>
3217 }
3218 @using System.Reflection
3219 @using Dynamicweb.Rapido.Blocks.Components
3220 @using Dynamicweb.Rapido.Blocks.Components.General
3221 @using Dynamicweb.Rapido.Blocks.Components.Articles
3222 @using Dynamicweb.Rapido.Blocks
3223
3224 @* Component for the articles *@
3225
3226 @helper RenderArticleImage(ArticleImage settings)
3227 {
3228 if (settings.Image != null)
3229 {
3230 if (settings.Image.Path != null)
3231 {
3232 <div class="u-margin-bottom--lg">
3233 @Render(settings.Image)
3234 </div>
3235 }
3236 }
3237 }
3238 @using System.Reflection
3239 @using Dynamicweb.Rapido.Blocks.Components
3240 @using Dynamicweb.Rapido.Blocks.Components.Articles
3241
3242
3243 @* Component for the articles *@
3244
3245 @helper RenderArticleSubHeader(ArticleSubHeader settings)
3246 {
3247 if (!String.IsNullOrEmpty(settings.Title))
3248 {
3249 <h2 class="article__header">@settings.Title</h2>
3250 }
3251 }
3252 @using System.Reflection
3253 @using Dynamicweb.Rapido.Blocks.Components
3254 @using Dynamicweb.Rapido.Blocks.Components.Articles
3255 @using Dynamicweb.Rapido.Blocks
3256
3257
3258 @* Component for the articles *@
3259
3260 @helper RenderArticleText(ArticleText settings)
3261 {
3262 if (!String.IsNullOrEmpty(settings.Text))
3263 {
3264 string greatTextClass = settings.EnableLargeText == true ? "article__paragraph--great-text" : "";
3265
3266 <div class="article__paragraph @greatTextClass dw-mod">
3267 @settings.Text
3268 </div>
3269 }
3270 }
3271 @using System.Reflection
3272 @using Dynamicweb.Rapido.Blocks.Components
3273 @using Dynamicweb.Rapido.Blocks.Components.Articles
3274 @using Dynamicweb.Rapido.Blocks
3275
3276
3277 @* Component for the articles *@
3278
3279 @helper RenderArticleQuote(ArticleQuote settings)
3280 {
3281 string text = Regex.Replace(settings.Text, "<.*?>", String.Empty);
3282
3283 <div class="grid u-padding-bottom--lg">
3284 @if (settings.Image != null)
3285 {
3286 if (settings.Image.Path != null) {
3287 <div class="grid__col-3">
3288 <div class="grid__cell-img">
3289 @{
3290 settings.Image.Title = !String.IsNullOrEmpty(settings.Image.Title) ? settings.Image.Title : settings.Author;
3291 settings.Image.CssClass += " article__image article__image--ball";
3292 settings.Image.ImageDefault.Width = 200;
3293 settings.Image.ImageDefault.Height = 200;
3294 }
3295 @Render(settings.Image)
3296 </div>
3297 </div>
3298 }
3299 }
3300 <div class="grid__col-auto">
3301 @if (!String.IsNullOrEmpty(settings.Text))
3302 {
3303 <div class="article__quote dw-mod">
3304 <i class="fas fa-quote-right u-margin-bottom--lg"></i>
3305 @settings.Text
3306 <i class="fas fa-quote-right"></i>
3307 </div>
3308 }
3309 @if (!String.IsNullOrEmpty(settings.Author))
3310 {
3311 <div class="article__quote-author dw-mod">
3312 - @settings.Author
3313 </div>
3314 }
3315 </div>
3316 </div>
3317 }
3318 @using System.Reflection
3319 @using Dynamicweb.Rapido.Blocks.Components
3320 @using Dynamicweb.Rapido.Blocks.Components.Articles
3321 @using Dynamicweb.Rapido.Blocks
3322
3323 @* Component for the articles *@
3324
3325 @helper RenderArticleInfoTable(ArticleInfoTable settings)
3326 {
3327 <table class="table table--clean">
3328 @foreach (var row in settings.Rows)
3329 {
3330 string iconColor = row.IconColor != null ? row.IconColor : "u-brand-color-two";
3331
3332 <tr>
3333 @if (!String.IsNullOrEmpty(row.Icon))
3334 {
3335 <td class="u-w32px"><i class="@row.Icon fa-2x @row.IconColor"></i></td>
3336 }
3337 <td class="u-no-margin-on-p-elements">
3338 <div class="u-bold">@row.Title</div>
3339 @if (!String.IsNullOrEmpty(row.SubTitle))
3340 {
3341 if (row.Link == null)
3342 {
3343 <div>@row.SubTitle</div>
3344 }
3345 else
3346 {
3347 <a href="@row.Link" class="u-color-inherit">@row.SubTitle</a>
3348 }
3349 }
3350 </td>
3351 </tr>
3352 }
3353 </table>
3354 }
3355 @using System.Reflection
3356 @using Dynamicweb.Rapido.Blocks.Components
3357 @using Dynamicweb.Rapido.Blocks.Components.General
3358 @using Dynamicweb.Rapido.Blocks.Components.Articles
3359 @using Dynamicweb.Rapido.Blocks
3360
3361 @* Component for the articles *@
3362
3363 @helper RenderArticleGalleryModal(ArticleGalleryModal settings)
3364 {
3365 Modal galleryModal = new Modal
3366 {
3367 Id = "ParagraphGallery",
3368 Width = ModalWidth.Full,
3369 BodyTemplate = RenderArticleGalleryModalContent()
3370 };
3371
3372 @Render(galleryModal)
3373 }
3374
3375 @helper RenderArticleGalleryModalContent() {
3376 <div class="modal__image-min-size-wrapper">
3377 @Render(new Image {
3378 Id = "ParagraphGallery",
3379 Path = "#",
3380 CssClass = "modal--full__img",
3381 DisableLazyLoad = true,
3382 DisableImageEngine = true
3383 })
3384 </div>
3385
3386 <div class="modal__images-counter" id="ParagraphGallery_counter"></div>
3387
3388 @Render(new Button {
3389 Id = "ParagraphGallery_prev",
3390 ButtonType = ButtonType.Button,
3391 ButtonLayout = ButtonLayout.None,
3392 CssClass = "modal__prev-btn",
3393 Icon = new Icon { Prefix = "far", Name = "fa-angle-left", LabelPosition = IconLabelPosition.After },
3394 OnClick = "Gallery.prevImage('ParagraphGallery')"
3395 })
3396
3397 @Render(new Button {
3398 Id = "ParagraphGallery_next",
3399 ButtonType = ButtonType.Button,
3400 ButtonLayout = ButtonLayout.None,
3401 CssClass = "modal__next-btn",
3402 Icon = new Icon { Prefix = "far", Name = "fa-angle-right", LabelPosition = IconLabelPosition.After },
3403 OnClick = "Gallery.nextImage('ParagraphGallery')"
3404 })
3405 }
3406 @using System.Reflection
3407 @using Dynamicweb.Rapido.Blocks.Components
3408 @using Dynamicweb.Rapido.Blocks.Components.Articles
3409 @using Dynamicweb.Rapido.Blocks
3410
3411
3412 @* Component for the articles *@
3413
3414 @helper RenderArticleRelated(ArticleRelated settings)
3415 {
3416 string cardClass = Pageview.Device.ToString() != "Tablet" ? "card u-color-light--bg u-full-height" : "";
3417 string cardFooterClass = Pageview.Device.ToString() != "Tablet" ? "card-footer u-color-light--bg" : "";
3418
3419 <section class="multiple-paragraphs-container u-color-light-gray--bg paragraph-container--full-width">
3420 <div class="center-container dw-mod">
3421 <div class="grid u-padding">
3422 <div class="grid__col-md-12 grid__col-xs-12">
3423 <h2 class="article__header u-no-margin u-margin-top">@settings.Title</h2>
3424 </div>
3425 </div>
3426
3427 <div class="js-handlebars-root u-padding" id="@settings.Title.Replace(" ", String.Empty)" data-template="RelatedSimpleTemplate" data-json-feed="/Default.aspx?ID=@settings.FeedPageId&@settings.Query&ExcludeItemID=@settings.CurrentPageId&PageSize=@settings.PageSize"></div>
3428
3429 <script id="RelatedSimpleTemplate" type="text/x-template">
3430 {{#.}}
3431 <div class="grid u-padding-bottom--lg">
3432 {{#Cases}}
3433 <div class="grid__col-lg-3 grid__col-sm-6 image-hover--zoom dw-mod">
3434 <a href="{{link}}" class="u-full-height u-color-light--bg u-flex u-flex--column">
3435 {{#if image}}
3436 <div class="u-color-light--bg u-no-padding dw-mod">
3437 <div class="flex-img image-hover__wrapper">
3438 <img class="b-lazy" src="/Files/Images/placeholder.gif" data-src="/Admin/Public/GetImage.ashx?width=680&height=314&crop=1&DoNotUpscale=True&Compression=75&image={{image}}" alt="{{title}}" />
3439 </div>
3440 </div>
3441 {{/if}}
3442
3443 <div class="card u-color-light--bg u-full-height dw-mod">
3444 <h3 class="article-list__item-header u-truncate-text dw-mod">{{title}}</h3>
3445 <p class="article__short-summary dw-mod">{{summary}}</p>
3446 </div>
3447 </a>
3448 </div>
3449 {{/Cases}}
3450 </div>
3451 {{/.}}
3452 </script>
3453 </div>
3454 </section>
3455 }
3456 @using System.Reflection
3457 @using Dynamicweb.Rapido.Blocks.Components
3458 @using Dynamicweb.Rapido.Blocks.Components.Articles
3459 @using Dynamicweb.Rapido.Blocks
3460
3461
3462 @* Component for the articles *@
3463
3464 @helper RenderArticleMenu(ArticleMenu settings)
3465 {
3466 if (!String.IsNullOrEmpty(settings.Title)) {
3467 <div class="u-margin u-border-bottom">
3468 <h3 class="u-no-margin">@settings.Title</h3>
3469 </div>
3470 }
3471
3472 <ul class="menu-left u-margin-bottom dw-mod">
3473 @foreach (var item in settings.Items)
3474 {
3475 @Render(item)
3476 }
3477 </ul>
3478 }
3479
3480 @helper RenderArticleMenuItem(ArticleMenuItem settings)
3481 {
3482 string link = !String.IsNullOrEmpty(settings.Link) ? settings.Link : "#";
3483
3484 if (!String.IsNullOrEmpty(settings.Title)) {
3485 <li class="menu-left__item dw-mod">
3486 <a href="@link" onclick="@settings.OnClick" class="menu-left__link dw-mod">@settings.Title</a>
3487 </li>
3488 }
3489 }
3490 @using System.Reflection
3491 @using Dynamicweb.Rapido.Blocks.Components
3492 @using Dynamicweb.Rapido.Blocks.Components.Articles
3493 @using Dynamicweb.Rapido.Blocks
3494
3495 @* Component for the articles *@
3496
3497 @helper RenderArticleList(ArticleList settings)
3498 {
3499 if (Pageview != null)
3500 {
3501 bool isParagraph = Pageview.CurrentParagraph != null ? true : false;
3502 string[] sortArticlesListBy = new string[2];
3503
3504 if (isParagraph) {
3505 sortArticlesListBy = Pageview.CurrentParagraph.Item["SortArticlesListBy"] != null && !string.IsNullOrEmpty(Pageview.CurrentParagraph.Item["SortArticlesListBy"].ToString()) ? Pageview.CurrentParagraph.Item["SortArticlesListBy"].ToString().Split('+') : new string[] { "Date", "ASC" };
3506 }
3507 else {
3508 sortArticlesListBy = Pageview.Item["SortArticlesListBy"] != null && !string.IsNullOrEmpty(Pageview.Item["SortArticlesListBy"].ToString()) ? Pageview.Item["SortArticlesListBy"].ToString().Split('+') : new string[] { "Date", "ASC" };
3509 }
3510
3511 string sourcePage = settings.SourcePage != null ? settings.SourcePage : Pageview.ID.ToString();
3512
3513 if (!settings.DisablePagination) {
3514 @RenderItemList(new
3515 {
3516 ItemType = !String.IsNullOrEmpty(settings.ItemType) ? settings.ItemType : "DynamicArticle",
3517 ListSourceType = settings.SourceType,
3518 ListSourcePage = sourcePage,
3519 ItemFieldsList = "*",
3520 Filter = settings.Filter,
3521 ListOrderBy = sortArticlesListBy[0],
3522 ListOrderByDirection = sortArticlesListBy[1],
3523 ListSecondOrderBy = sortArticlesListBy[0] == "Date" ? "InFocusSortId" : "Date",
3524 ListSecondOrderByDirection = "ASC",
3525 IncludeAllChildItems = true,
3526 ListTemplate = settings.Template,
3527 ListPageSize = settings.PageSize.ToString()
3528 });
3529 } else {
3530 @RenderItemList(new
3531 {
3532 ItemType = !String.IsNullOrEmpty(settings.ItemType) ? settings.ItemType : "DynamicArticle",
3533 ListSourceType = settings.SourceType,
3534 ListSourcePage = sourcePage,
3535 ItemFieldsList = "*",
3536 Filter = settings.Filter,
3537 ListOrderBy = sortArticlesListBy[0],
3538 ListOrderByDirection = sortArticlesListBy[1],
3539 ListSecondOrderBy = sortArticlesListBy[0] == "Date" ? "InFocusSortId" : "Date",
3540 ListSecondOrderByDirection = "ASC",
3541 IncludeAllChildItems = true,
3542 ListTemplate = settings.Template,
3543 ListPageSize = settings.PageSize.ToString(),
3544 ListViewMode = "Partial",
3545 ListShowTo = settings.PageSize + 1
3546 });
3547 }
3548 }
3549 }
3550 @using System.Reflection
3551 @using Dynamicweb.Rapido.Blocks.Components.Articles
3552
3553
3554 @* Component for the articles *@
3555
3556 @helper RenderArticleSummary(ArticleSummary settings)
3557 {
3558 if (!String.IsNullOrEmpty(settings.Text))
3559 {
3560 <div class="article__summary dw-mod">@settings.Text</div>
3561 }
3562 }
3563 @using System.Reflection
3564 @using Dynamicweb.Rapido.Blocks.Components
3565 @using Dynamicweb.Rapido.Blocks.Components.Articles
3566 @using Dynamicweb.Rapido.Blocks
3567
3568 @* Component for the articles *@
3569
3570 @helper RenderArticleListCategoryFilter(ArticleListCategoryFilter settings)
3571 {
3572 string pageId = Pageview.ID.ToString();
3573 string selectedFilter = !String.IsNullOrEmpty(HttpContext.Current.Request.QueryString.Get("sourcePage")) ? HttpContext.Current.Request.QueryString.Get("sourcePage") : Translate("All");
3574 var query = HttpUtility.ParseQueryString(HttpContext.Current.Request.QueryString.ToString());
3575
3576 foreach (var option in settings.Categories)
3577 {
3578 selectedFilter = selectedFilter == option.Value ? option.Key : selectedFilter;
3579 }
3580
3581 if (selectedFilter == pageId)
3582 {
3583 selectedFilter = Translate("All");
3584 }
3585
3586 if (Pageview.Device.ToString() != "Mobile" && Pageview.Device.ToString() != "Tablet")
3587 {
3588 <div class="u-pull--right u-margin-left">
3589 <div class="collection u-no-margin">
3590 <h5>@Translate("Category")</h5>
3591 <input type="checkbox" id="CategorySelector" class="dropdown-trigger" />
3592 <div class="dropdown u-w180px dw-mod">
3593 <label class="dropdown__header dropdown__btn dw-mod" for="CategorySelector">@Translate(selectedFilter)</label>
3594 <div class="dropdown__content dw-mod">
3595 @foreach (var option in settings.Categories)
3596 {
3597 <div class="dropdown__item" onclick="QueryArray.setParametersInCurrentURL({ sourceType: 'Page', sourcePage: '@(option.Key.ToLower() == "all" ? pageId : option.Value)' })">@Translate(option.Key)</div>
3598 }
3599 </div>
3600 <label class="dropdown-trigger-off" for="CategorySelector"></label>
3601 </div>
3602 </div>
3603 </div>
3604 }
3605 else
3606 {
3607 <div class="u-full-width u-margin-bottom">
3608 <h5 class="u-no-margin">@Translate("Category")</h5>
3609 <input type="checkbox" id="CategorySelector" class="dropdown-trigger" />
3610 <div class="dropdown u-full-width dw-mod">
3611 <label class="dropdown__header dropdown__btn dw-mod" for="CategorySelector">@Translate(selectedFilter)</label>
3612 <div class="dropdown__content dw-mod">
3613 @foreach (var option in settings.Categories)
3614 {
3615 <div class="dropdown__item" onclick="QueryArray.setParametersInCurrentURL({ sourceType: 'Page', sourcePage: '@(option.Key.ToLower() == "all" ? pageId : option.Value)' })">@Translate(option.Key)</div>
3616 }
3617 </div>
3618 <label class="dropdown-trigger-off" for="CategorySelector"></label>
3619 </div>
3620 </div>
3621 }
3622 }
3623 @using System.Reflection
3624 @using Dynamicweb.Rapido.Blocks.Components
3625 @using Dynamicweb.Rapido.Blocks.Components.Articles
3626 @using Dynamicweb.Rapido.Blocks
3627 @using System.Collections.Generic
3628
3629 @* Component for the articles *@
3630
3631 @helper RenderArticleListFilter(ArticleListFilter settings)
3632 {
3633 string selectedFilter = !String.IsNullOrEmpty(HttpContext.Current.Request.QueryString.Get(settings.SystemName)) ? HttpContext.Current.Request.QueryString.Get(settings.SystemName) : Translate("All");
3634 var query = HttpUtility.ParseQueryString(HttpContext.Current.Request.QueryString.ToString());
3635
3636 if (settings.Options != null)
3637 {
3638 if (settings.Options is IEnumerable<dynamic>)
3639 {
3640 var options = (IEnumerable<dynamic>) settings.Options;
3641 settings.Options = options.OrderBy(item => item.Name);
3642 }
3643
3644 foreach (var option in settings.Options)
3645 {
3646 selectedFilter = selectedFilter == option.Value ? option.Name : selectedFilter;
3647 }
3648
3649 if (Pageview.Device.ToString() != "Mobile" && Pageview.Device.ToString() != "Tablet")
3650 {
3651 <div class="u-pull--right u-margin-left">
3652 <div class="collection u-no-margin">
3653 <h5>@settings.Label</h5>
3654 <input type="checkbox" id="@(settings.SystemName)Selector" class="dropdown-trigger" />
3655 <div class="dropdown u-w180px dw-mod">
3656 <label class="dropdown__header dropdown__btn dw-mod" for="@(settings.SystemName)Selector">@Translate(selectedFilter)</label>
3657 <div class="dropdown__content dw-mod">
3658 <div class="dropdown__item" onclick="QueryArray.setParameterInCurrentURL('@settings.SystemName', '')">@Translate("All")</div>
3659 @foreach (var option in settings.Options)
3660 {
3661 <div class="dropdown__item" onclick="QueryArray.setParameterInCurrentURL('@settings.SystemName', '@option.Value')">@Translate(option.Name)</div>
3662 }
3663 </div>
3664 <label class="dropdown-trigger-off" for="@(settings.SystemName)Selector"></label>
3665 </div>
3666 </div>
3667 </div>
3668 }
3669 else
3670 {
3671 <div class="u-full-width u-margin-bottom">
3672 <h5 class="u-no-margin">@settings.Label</h5>
3673 <input type="checkbox" id="@(settings.SystemName)Selector" class="dropdown-trigger" />
3674 <div class="dropdown u-full-width w-mod">
3675 <label class="dropdown__header dropdown__btn dw-mod" for="@(settings.SystemName)Selector">@Translate(selectedFilter)</label>
3676 <div class="dropdown__content dw-mod">
3677 <div class="dropdown__item" onclick="QueryArray.setParameterInCurrentURL('@settings.SystemName', '')">@Translate("All")</div>
3678 @foreach (var option in settings.Options)
3679 {
3680 <div class="dropdown__item" onclick="QueryArray.setParameterInCurrentURL('@settings.SystemName', '@option.Value')">@Translate(option.Name)</div>
3681 }
3682 </div>
3683 <label class="dropdown-trigger-off" for="@(settings.SystemName)Selector"></label>
3684 </div>
3685 </div>
3686 }
3687 }
3688 }
3689 @using System.Reflection
3690 @using Dynamicweb.Rapido.Blocks.Components
3691 @using Dynamicweb.Rapido.Blocks.Components.Articles
3692 @using Dynamicweb.Rapido.Blocks
3693
3694 @* Component for the articles *@
3695
3696 @helper RenderArticleListSearch(ArticleListSearch settings)
3697 {
3698 string searchParameter = !string.IsNullOrEmpty(settings.SearchParameter) ? settings.SearchParameter : "Title";
3699 string searchWord = HttpContext.Current.Request.QueryString.Get(searchParameter);
3700 string searchString = !string.IsNullOrEmpty(searchWord) ? searchWord.Trim('*') : "";
3701 string className = "u-w340px u-pull--right u-margin-left";
3702
3703 if (Pageview.Device.ToString() == "Mobile" || Pageview.Device.ToString() == "Tablet")
3704 {
3705 className = "u-full-width";
3706 }
3707
3708 <div class="typeahead u-color-inherit u-margin-bottom dw-mod @className">
3709 <input type="text" class="typeahead-search-field u-no-margin dw-mod" placeholder="@Translate("Search in list")" value="@searchString" id="ArticleListSearchInput" onchange="QueryArray.setParameterInCurrentURL('@searchParameter', '*' + document.getElementById('ArticleListSearchInput').value + '*')">
3710 <button type="button" class="btn btn--condensed btn--primary u-no-margin dw-mod"><i class="fas fa-search"></i></button>
3711 </div>
3712 }
3713 @using System.Reflection
3714 @using Dynamicweb.Rapido.Blocks.Components
3715 @using Dynamicweb.Rapido.Blocks.Components.Articles
3716 @using Dynamicweb.Rapido.Blocks
3717
3718 @* Component for the articles *@
3719
3720 @helper RenderArticleListNoResultsInfo(ArticleListNoResultsInfo settings)
3721 {
3722 <div class="u-margin-top--lg u-bold u-ta-center u-bold">@Translate(settings.Message)</div>
3723 }
3724 @using System.Reflection
3725 @using Dynamicweb.Rapido.Blocks.Components
3726 @using Dynamicweb.Rapido.Blocks.Components.General
3727 @using Dynamicweb.Rapido.Blocks.Components.Articles
3728 @using Dynamicweb.Rapido.Blocks
3729 @using System.Text.RegularExpressions
3730
3731 @* Component for the articles *@
3732
3733 @helper RenderArticleListItem(ArticleListItem settings)
3734 {
3735 switch (settings.Type) {
3736 case ArticleListItemType.Card:
3737 @RenderArticleListItemCard(settings);
3738 break;
3739 case ArticleListItemType.List:
3740 @RenderArticleListItemList(settings);
3741 break;
3742 case ArticleListItemType.Simple:
3743 @RenderArticleListItemSimple(settings);
3744 break;
3745 default:
3746 @RenderArticleListItemCard(settings);
3747 break;
3748 }
3749 }
3750
3751 @helper RenderArticleListItemCard(ArticleListItem settings) {
3752 <a href="@settings.Link" class="u-full-height u-color-light--bg u-flex u-flex--column">
3753 <div class="u-color-light--bg u-no-padding dw-mod">
3754 @if (settings.Logo != null)
3755 {
3756 string backgroundImage = settings.Image != null ? "background-image:url(/Admin/Public/GetImage.ashx?width=992&height=760&crop=0&Compression=75&DoNotUpscale=True&image=" + settings.Image.Path + "); background-size: cover;" : "";
3757 settings.Logo.ImageDefault.Crop = 5;
3758 settings.Logo.ImageDefault.Width = settings.Logo.ImageDefault.Width == 1920 ? 240 : settings.Logo.ImageDefault.Width;
3759 settings.Logo.ImageDefault.Height = settings.Logo.ImageDefault.Height == 1080 ? 200 : settings.Logo.ImageDefault.Height;
3760 <div class="image-hover__wrapper layered-image layered-image--tinted dw-mod" style="@backgroundImage">
3761 @if (settings.Stickers != null)
3762 {
3763 if (settings.Stickers.Position != StickersListPosition.Custom && settings.Stickers.Position != StickersListPosition.None)
3764 {
3765 @Render(settings.Stickers);
3766 }
3767 }
3768 @RenderImage(settings.Logo)
3769 </div>
3770 } else if (settings.Image != null)
3771 {
3772 <div class="flex-img image-hover__wrapper u-position-relative dw-mod">
3773 @if (settings.Stickers != null)
3774 {
3775 if (settings.Stickers.Position != StickersListPosition.Custom && settings.Stickers.Position != StickersListPosition.None)
3776 {
3777 @Render(settings.Stickers);
3778 }
3779 }
3780 @Render(settings.Image)
3781 </div>
3782 }
3783 </div>
3784
3785 @if (!String.IsNullOrEmpty(settings.Title) || !String.IsNullOrEmpty(settings.Summary))
3786 {
3787 <div class="card u-color-light--bg u-full-height dw-mod">
3788 @if (settings.Stickers != null)
3789 {
3790 if (settings.Stickers.Position == StickersListPosition.Custom)
3791 {
3792 @Render(settings.Stickers);
3793 }
3794 }
3795 @if (!String.IsNullOrEmpty(settings.Title))
3796 {
3797 <h3 class="article-list__item-header u-truncate-text dw-mod">@settings.Title</h3>
3798 }
3799 @if (!String.IsNullOrEmpty(settings.SubTitle))
3800 {
3801 <div class="article-list__item-micro-info u-truncate-text dw-mod">@settings.SubTitle</div>
3802 }
3803 @if (!String.IsNullOrEmpty(settings.Summary))
3804 {
3805 <p class="article__short-summary dw-mod">@settings.Summary</p>
3806 }
3807 </div>
3808 }
3809 </a>
3810 }
3811
3812 @helper RenderArticleListItemList(ArticleListItem settings) {
3813 <a href="@settings.Link">
3814 <div class="grid u-color-light--bg u-no-padding dw-mod">
3815 <div class="grid__col-md-3">
3816 <div class="u-color-light--bg u-no-padding dw-mod">
3817 @if (settings.Logo != null)
3818 {
3819 string backgroundImage = settings.Image != null ? "background-image:url(/Admin/Public/GetImage.ashx?width=992&height=760&crop=0&Compression=75&DoNotUpscale=True&image=" + settings.Image.Path + "); background-size: cover;" : "";
3820 settings.Logo.ImageDefault.Crop = 5;
3821 settings.Logo.ImageDefault.Width = settings.Logo.ImageDefault.Width == 1920 ? 240 : settings.Logo.ImageDefault.Width;
3822 settings.Logo.ImageDefault.Height = settings.Logo.ImageDefault.Height == 1080 ? 200 : settings.Logo.ImageDefault.Height;
3823 <div class="image-hover__wrapper layered-image layered-image--tinted dw-mod" style="@backgroundImage">
3824 @if (settings.Stickers != null)
3825 {
3826 if (settings.Stickers.Position != StickersListPosition.Custom)
3827 {
3828 @Render(settings.Stickers);
3829 }
3830 }
3831 @RenderImage(settings.Logo)
3832 </div>
3833 } else if (settings.Image != null)
3834 {
3835 <div class="flex-img image-hover__wrapper dw-mod">
3836 @if (settings.Stickers != null)
3837 {
3838 if (settings.Stickers.Position != StickersListPosition.Custom)
3839 {
3840 @Render(settings.Stickers);
3841 }
3842 }
3843 @Render(settings.Image)
3844 </div>
3845 }
3846 </div>
3847 </div>
3848
3849 @if (!String.IsNullOrEmpty(settings.Title) || !String.IsNullOrEmpty(settings.Summary))
3850 {
3851 <div class="grid__col-md-9">
3852 @if (!String.IsNullOrEmpty(settings.Title))
3853 {
3854 <h3 class="article-list__item-header u-truncate-text dw-mod">@settings.Title</h3>
3855 }
3856 @if (settings.Stickers != null)
3857 {
3858 if (settings.Stickers.Position == StickersListPosition.Custom)
3859 {
3860 @Render(settings.Stickers);
3861 }
3862 }
3863 @if (!String.IsNullOrEmpty(settings.SubTitle))
3864 {
3865 <div class="article-list__item-micro-info u-truncate-text dw-mod">@settings.SubTitle</div>
3866 }
3867 @if (!String.IsNullOrEmpty(settings.Summary))
3868 {
3869 <p class="article__short-summary dw-mod">@settings.Summary</p>
3870 }
3871 </div>
3872 }
3873 </div>
3874 </a>
3875 }
3876
3877 @helper RenderArticleListItemSimple(ArticleListItem settings) {
3878 <a href="@settings.Link" class="u-color-inherit">
3879 <div class="grid u-color-light--bg u-no-padding dw-mod">
3880 <div class="grid__col-md-12">
3881 @if (!String.IsNullOrEmpty(settings.Title))
3882 {
3883 <div class="article-list-item__header u-truncate-text u-no-margin dw-mod">@settings.Title</div>
3884 }
3885 @if (!String.IsNullOrEmpty(settings.SubTitle))
3886 {
3887 <div class="article-list__item-micro-info u-truncate-text dw-mod">@settings.SubTitle</div>
3888 }
3889 </div>
3890 </div>
3891 </a>
3892 }
3893 @using System.Reflection
3894 @using Dynamicweb.Rapido.Blocks.Components.Articles
3895
3896
3897 @* Component for the articles *@
3898
3899 @helper RenderArticleAuthorAndDate(ArticleAuthorAndDate settings)
3900 {
3901 <small class="article__subscription">
3902 @if (!(string.IsNullOrWhiteSpace(settings.Author) && string.IsNullOrWhiteSpace(settings.Date)))
3903 {
3904 <text>@Translate("Written")</text>
3905 }
3906 @if (!string.IsNullOrWhiteSpace(settings.Author))
3907 {
3908 <text>@Translate("by") @settings.Author</text>
3909 }
3910 @if (!string.IsNullOrWhiteSpace(settings.Date))
3911 {
3912 <text>@Translate("on") @settings.Date</text>
3913 }
3914 </small>
3915 }
3916 @using System.Reflection
3917 @using Dynamicweb.Rapido.Blocks.Components.Articles
3918 @using Dynamicweb.Rapido.Blocks.Components.General
3919
3920
3921 @* Component for the articles *@
3922
3923 @helper RenderArticleLink(ArticleLink settings)
3924 {
3925 if (!string.IsNullOrEmpty(settings.Title))
3926 {
3927 Button link = new Button {
3928 ConfirmText = settings.ConfirmText,
3929 ConfirmTitle = settings.ConfirmTitle,
3930 ButtonType = settings.ButtonType,
3931 Id = settings.Id,
3932 Title = settings.Title,
3933 AltText = settings.AltText,
3934 OnClick = settings.OnClick,
3935 CssClass = settings.CssClass,
3936 Disabled = settings.Disabled,
3937 Icon = settings.Icon,
3938 Name = settings.Name,
3939 Href = settings.Href,
3940 ButtonLayout = settings.ButtonLayout,
3941 ExtraAttributes = settings.ExtraAttributes
3942 };
3943 <div class="grid__cell">
3944 @Render(link)
3945 </div>
3946 }
3947 }
3948 @using System.Reflection
3949 @using Dynamicweb.Rapido.Blocks
3950 @using Dynamicweb.Rapido.Blocks.Components.Articles
3951 @using Dynamicweb.Rapido.Blocks.Components.General
3952
3953
3954 @* Component for the articles *@
3955
3956 @helper RenderArticleCarousel(ArticleCarousel settings)
3957 {
3958 <div class="grid">
3959 <div class="grid__col-12 u-no-padding u-margin-bottom">
3960 <div class="carousel" id="carousel_@settings.Id">
3961 <div class="carousel__container js-carousel-slides dw-mod">
3962 @RenderBlockList(settings.SubBlocks)
3963 </div>
3964 </div>
3965 </div>
3966 </div>
3967
3968 <script>
3969 document.addEventListener("DOMContentLoaded", function () {
3970 new CarouselModule("#carousel_@settings.Id", {
3971 slideTime: 0,
3972 dots: true
3973 });
3974 });
3975 </script>
3976 }
3977
3978 @helper RenderArticleCarouselSlide(ArticleCarouselSlide settings)
3979 {
3980 string imageEngine = "/Admin/Public/GetImage.ashx?";
3981
3982 string defaultImage = settings.ImageSettings != null ? imageEngine : settings.Image;
3983 if (settings.ImageSettings != null)
3984 {
3985 defaultImage += settings.ImageSettings.Width != 0 ? "Width=" + settings.ImageSettings.Width + "&" : "";
3986 defaultImage += settings.ImageSettings.Height != 0 ? "Height=" + settings.ImageSettings.Height + "&" : "";
3987 defaultImage += "Crop=" + settings.ImageSettings.Crop + "&";
3988 defaultImage += "Compression=" + settings.ImageSettings.Compression + "&";
3989 defaultImage += "DoNotUpscale=" + settings.ImageSettings.DoNotUpscale.ToString() + "&";
3990 defaultImage += "FillCanvas=" + settings.ImageSettings.FillCanvas.ToString() + "&";
3991 }
3992 defaultImage += "&Image=" + settings.Image;
3993
3994 <div class="carousel__slide u-min-h300px u-flex dw-mod" style="background-size:cover; background-image:url('@defaultImage')">
3995 <a class="article-carousel-item__wrap" href="@settings.Link" title="@settings.Title">
3996 <h2 class="article-list__item-header u-truncate-text u-color-light dw-mod">@settings.Title</h2>
3997 <div class="article-list__item-info">
3998 @if (settings.Stickers != null)
3999 {
4000 settings.Stickers.Position = StickersListPosition.Custom;
4001 @Render(settings.Stickers);
4002 }
4003
4004 <small class="u-margin-top--lg u-color-light">
4005 @if (!(string.IsNullOrWhiteSpace(settings.Author) && string.IsNullOrWhiteSpace(settings.Date)))
4006 {
4007 <text>@Translate("Written")</text>
4008 }
4009 @if (!string.IsNullOrWhiteSpace(settings.Author))
4010 {
4011 <text>@Translate("by") @settings.Author</text>
4012 }
4013 @if (!string.IsNullOrWhiteSpace(settings.Date))
4014 {
4015 <text>@Translate("on") @settings.Date</text>
4016 }
4017 </small>
4018 </div>
4019
4020 <h3 class="article__short-summary u-color-light">@settings.Summary</h3>
4021 </a>
4022 @if (settings.UseFilters == true)
4023 {
4024 <div class="background-image image-filter image-filter--darken dw-mod"></div>
4025 }
4026 </div>
4027 }
4028 @using System.Text.RegularExpressions
4029 @using Dynamicweb.Rapido.Blocks.Components
4030 @using Dynamicweb.Rapido.Blocks.Components.General
4031 @using Dynamicweb.Rapido.Blocks.Components.Articles
4032 @using Dynamicweb.Rapido.Blocks
4033
4034 @* Component for the articles *@
4035
4036 @helper RenderArticleVideo(ArticleVideo settings)
4037 {
4038 if (settings.Url != null)
4039 {
4040 //getting video ID from youtube URL
4041 string videoCode = settings.Url;
4042 Regex regex = new Regex(@".be\/(.[^?]*)");
4043 Match match = regex.Match(videoCode);
4044 string videoId = "";
4045 if (match.Success)
4046 {
4047 videoId = match.Groups[1].Value;
4048 }
4049 else
4050 {
4051 regex = new Regex(@"v=([^&]+)");
4052 match = regex.Match(videoCode);
4053 if (match.Success)
4054 {
4055 videoId = match.Groups[1].Value;
4056 }
4057 }
4058
4059 int autoPlay = settings.AutoPlay == "true" ? 1 : 0;
4060
4061 <div class="video-wrapper">
4062 <div class="js-youtube-video" data-video="@videoId" id="ytPlayer@(Guid.NewGuid().ToString("N"))" data-auto-play="@autoPlay" data-enable-controls="1"></div>
4063 </div>
4064 }
4065 }
4066
4067
4068
4069 @* Simple helpers *@
4070
4071 @*Requires the Gallery ItemType that comes with Rapido*@
4072 @helper RenderArticleItemGallery(IList<ItemViewModel> gallery) {
4073 if (gallery != null && gallery.Count > 0)
4074 {
4075 int count = 1;
4076
4077 foreach (var item in gallery)
4078 {
4079 if (item.GetFile("ImagePath") != null)
4080 {
4081 string image = item.GetFile("ImagePath").PathUrlEncoded;
4082 string imagePrefix = "/Admin/Public/GetImage.ashx?width=1200&height=820&crop=5&Compression=75&DoNotUpscale=1&image=";
4083 int imagesCount = gallery.Count;
4084
4085 if (count == 1)
4086 {
4087 <label class="gallery" for="ParagraphGalleryModalTrigger" onclick="Gallery.openImage(this.querySelector('.js-gallery'))">
4088 <span class="gallery__main-image">
4089 <img src="/Files/Images/placeholder.gif" data-src="/Admin/Public/GetImage.ashx?width=992&height=760&crop=0&Compression=75&DoNotUpscale=1&image=@image" class="b-lazy flex-img js-gallery" alt="" data-for="ParagraphGallery" data-image="@imagePrefix@image" />
4090 </span>
4091 <span class="gallery__image-counter">
4092 <i class="fas fa-camera fa-2x"></i> <span class="gallery__image-counter__number">@imagesCount</span>
4093 <span class="gallery__image-counter__text">@Translate("See all") <i class="fas fa-angle-right"></i></span>
4094 </span>
4095 </label>
4096 }
4097 else
4098 {
4099 <div class="u-hidden js-gallery" data-for="ParagraphGallery" data-image="@imagePrefix@image"></div>
4100 }
4101
4102 count++;
4103 }
4104 }
4105
4106 @Render(new ArticleGalleryModal())
4107 }
4108 }
4109
4110 @helper RenderMobileFilters(List<Block> subBlocks)
4111 {
4112 if (subBlocks.Count > 0)
4113 {
4114 <div class="grid__col-12">
4115 <input type="checkbox" id="CheckFilters" class="js-remember-state u-hidden" data-expand="CheckFilters" />
4116 <div class="grid u-margin-bottom dw-mod" data-trigger="CheckFilters">
4117 @RenderBlockList(subBlocks)
4118 </div>
4119 <label for="CheckFilters" class="btn btn--secondary btn--full dw-mod js-expand-hide" data-trigger="CheckFilters">@Translate("Select filters")</label>
4120 <label for="CheckFilters" class="btn btn--secondary btn--full dw-mod expandable--collapsed" data-trigger="CheckFilters">@Translate("Close filters")</label>
4121 </div>
4122 }
4123 }
4124 @inherits Dynamicweb.Rendering.ViewModelTemplate<Dynamicweb.Frontend.PageViewModel>
4125
4126 @using Dynamicweb.Rapido.Blocks.Components
4127 @using Dynamicweb.Rapido.Blocks.Components.General
4128 @using Dynamicweb.Rapido.Blocks
4129
4130
4131 @* Components *@
4132 @inherits Dynamicweb.Rendering.ViewModelTemplate<Dynamicweb.Frontend.PageViewModel>
4133 @using System.Text.RegularExpressions;
4134 @using Dynamicweb.Frontend
4135 @using System.Reflection
4136 @using Dynamicweb.Content.Items
4137 @using System.Web.UI.HtmlControls
4138 @using Dynamicweb.Content.Items
4139 @using Dynamicweb.Rapido.Blocks.Components
4140 @using Dynamicweb.Rapido.Blocks.Components.General
4141 @using Dynamicweb.Rapido.Blocks.Components.Documentation
4142 @using Dynamicweb.Rapido.Blocks
4143
4144 @* Component for the articles *@
4145
4146 @helper RenderComponentInfo(dynamic settings)
4147 {
4148 <div class="u-color-light-gray--bg">
4149 <div class="u-bold u-margin u-margin-bottom--lg">@Translate("Settings")</div>
4150 <table>
4151 @{
4152 PropertyInfo[] properties = settings.Content.GetType().GetProperties();
4153 foreach (PropertyInfo property in properties)
4154 {
4155 string longNameCssClass = property.Name.Length > 22 ? "u-break-word" : "";
4156
4157 <tr>
4158 <td class="@longNameCssClass">
4159 @property.Name
4160 </td>
4161 <td style="word-break: break-all" class="u-italic">
4162 @if (property.PropertyType.BaseType != null) {
4163 if (property.PropertyType.BaseType.ToString() == "System.Enum") {
4164 string parameterId = property.PropertyType.Name;
4165 string selection = HttpContext.Current.Request.QueryString.Get(parameterId) != null ? HttpContext.Current.Request.QueryString.Get(parameterId) : "";
4166 SelectField enumSelector = new SelectField { OnChange = "QueryArray.setParametersInCurrentURL({ " + parameterId + ": this.value, scrollToId: this.closest('.js-component-info').id });" };
4167
4168 foreach (var en in property.PropertyType.GetEnumNames())
4169 {
4170 if (selection.ToLower() == en.ToLower()) {
4171 enumSelector.Options.Add(new SelectFieldOption { Label = en.ToString(), Value = en.ToString(), Checked = true });
4172 } else {
4173 enumSelector.Options.Add(new SelectFieldOption { Label = en.ToString(), Value = en.ToString() });
4174 }
4175 }
4176 @Render(enumSelector);
4177 }
4178 else if (property.PropertyType.ToString().Contains("Dynamicweb.Rapido.Blocks.Components"))
4179 {
4180 <div class="u-bold">Component {</div>
4181
4182 PropertyInfo[] subProperties = property.PropertyType.GetProperties();
4183 foreach (PropertyInfo subProperty in subProperties)
4184 {
4185 <div>@subProperty.Name</div>
4186 }
4187
4188 <div class="u-bold">}</div>
4189 } else {
4190 @property.PropertyType
4191 }
4192 }
4193 </td>
4194 </tr>
4195 }
4196 }
4197 </table>
4198 </div>
4199 }
4200 @inherits Dynamicweb.Rendering.ViewModelTemplate<Dynamicweb.Frontend.PageViewModel>
4201 @using System.Text.RegularExpressions;
4202 @using Dynamicweb.Frontend
4203 @using System.Reflection
4204 @using System.Web.UI.HtmlControls
4205 @using Dynamicweb.Content.Items
4206 @using Dynamicweb.Rapido.Blocks.Components.General
4207 @using Dynamicweb.Rapido.Blocks.Components
4208 @using Dynamicweb.Rapido.Blocks.Components.Documentation
4209 @using Dynamicweb.Rapido.Blocks
4210
4211 @* Component for the articles *@
4212
4213 @helper RenderComponentCode(dynamic settings)
4214 {
4215 string methodName = settings.Content.component.HelperName;
4216 dynamic[] methodsettings = new dynamic[1];
4217 methodsettings[0] = settings.Content.component;
4218
4219 string uniqueExampleId = !String.IsNullOrEmpty(settings.Content.Name) ? settings.Content.Name.Replace(" ", "").Replace("(", "").Replace(")", "") : "";
4220 uniqueExampleId = uniqueExampleId == "" ? settings.Content.component.GetType().Name.ToString() : uniqueExampleId;
4221
4222 Type methodType = this.GetType();
4223 MethodInfo helperMethod = methodType.GetMethod(methodName);
4224
4225 <div class="u-color-light-gray--bg u-border u-padding--lg u-margin-bottom--lg">
4226 <div class="u-bold u-margin-bottom--lg">@Translate("Basic usage")</div>
4227 <div>
4228 <div>Block myBlock = new Block</div>
4229 <div>{</div>
4230 <div> Id = "MyBlock",</div>
4231 <div> SortId = 10,</div>
4232 <div> Component = new @settings.Content.component.GetType().Name.ToString() { OPTIONAL_settings }</div>
4233 <div>};</div>
4234 <div>myPage.Add("MyContainer", myBlock);</div>
4235 </div>
4236 <p></p>
4237 <div class="u-bold">@Translate("Or")</div>
4238 <p></p>
4239 <div>
4240 <div>@@Render(new @settings.Content.component.GetType().Name.ToString() { OPTIONAL_settings })</div>
4241 </div>
4242 </div>
4243
4244 if (!String.IsNullOrEmpty(settings.Content.CodeExample)) {
4245 <div class="u-bold u-margin-bottom--lg">@Translate("Implementation example")</div>
4246 <textarea class="u-color-dark--bg u-color-light u-padding" id="@(uniqueExampleId)__CodeExample" name="@(uniqueExampleId)__CodeExample">
4247 @settings.Content.CodeExample
4248 </textarea>
4249 @Render(new Button { Title = Translate("Copy to clipboard"), OnClick = "CopyCode(document.getElementById('" + uniqueExampleId + "__CodeExample'))", ButtonLayout = ButtonLayout.Secondary })
4250 <br />
4251 }
4252
4253 <div class="u-bold u-margin-bottom--lg">@Translate("Markup result")</div>
4254 <textarea class="u-color-dark--bg u-color-light u-padding" id="@(uniqueExampleId)__Code" name="@(uniqueExampleId)__Code">
4255 @{
4256 try
4257 {
4258 HtmlElement finalHtmlElement = new HtmlElement();
4259 var helperMethodAsString = helperMethod.Invoke(this, methodsettings);
4260 @helperMethodAsString
4261 }
4262 catch (Exception ex)
4263 {
4264 throw new Exception(settings.GetType().Name + " method '" + methodName + "' could not be invoked", ex);
4265 }
4266 }
4267 </textarea>
4268 @Render(new Button { Title = Translate("Copy to clipboard"), OnClick = "CopyCode(document.getElementById('" + uniqueExampleId + "__Code'))", ButtonLayout = ButtonLayout.Secondary })
4269
4270 <style>
4271 .CodeMirror {
4272 height: auto;
4273 }
4274 </style>
4275
4276 <script>
4277 @if (!String.IsNullOrEmpty(settings.Content.CodeExample)) {
4278 <text>
4279 var myCodeExample = CodeMirror.fromTextArea(document.getElementById("@(uniqueExampleId)__CodeExample"), {
4280 lineNumbers: true,
4281 lineSeparator: "-newline",
4282 indentUnit: 4,
4283 mode: "coffeescript",
4284 tabMode: "indent",
4285 theme: "cobalt"
4286 });
4287 </text>
4288 }
4289
4290 var myCodeMirror = CodeMirror.fromTextArea(document.getElementById("@(uniqueExampleId)__Code"), {
4291 lineNumbers: true,
4292 mode: "xml",
4293 tabMode: "indent",
4294 theme: "cobalt"
4295 });
4296 </script>
4297 }
4298
4299 @inherits Dynamicweb.Rendering.RazorTemplateBase<Dynamicweb.Rendering.RazorTemplateModel<Dynamicweb.Rendering.Template>>
4300
4301 @using System
4302 @using System.Web
4303 @using System.Collections.Generic
4304 @using Dynamicweb.Rapido.Blocks.Extensibility
4305 @using Dynamicweb.Rapido.Blocks
4306 @using Dynamicweb.Ecommerce.Common
4307
4308 @{
4309 BlocksPage referencesBlocksPage = BlocksPage.GetBlockPage("Master");
4310
4311 Block masterScriptReferences = new Block()
4312 {
4313 Id = "MasterScriptReferences",
4314 SortId = 1,
4315 Template = RenderMasterScriptReferences()
4316 };
4317 referencesBlocksPage.Add(MasterBlockId.MasterReferences, masterScriptReferences);
4318 }
4319
4320 @helper RenderMasterScriptReferences()
4321 {
4322 var ticks = "?ticks=" + Model.Area.UpdatedDate.Ticks;
4323
4324 <script src="/Files/Templates/Designs/Rapido/js/handlebars-v4.0.12.min.js"></script>
4325 <script src="/Files/Templates/Designs/Rapido/js/master.min.js@(ticks)"></script>
4326
4327 if (Model.Area.Item.GetItem("Custom").GetBoolean("UseCustomJavascript"))
4328 {
4329 <script src="/Files/Templates/Designs/Rapido/js/custom.min.js@(ticks)"></script>
4330 <script src="/Files/Templates/Designs/Rapido/js/co3/custom-co3.js@(ticks)"></script>
4331
4332 PushPromise("/Files/Templates/Designs/Rapido/js/custom.min.js");
4333 PushPromise("/Files/Templates/Designs/Rapido/js/co3/custom-co3.js");
4334 }
4335
4336 PushPromise("/Files/Templates/Designs/Rapido/js/handlebars-v4.0.12.min.js");
4337 PushPromise("/Files/Templates/Designs/Rapido/js/master.min.js");
4338 }
4339 @inherits Dynamicweb.Rendering.RazorTemplateBase<Dynamicweb.Rendering.RazorTemplateModel<Dynamicweb.Rendering.Template>>
4340
4341 @using System
4342 @using System.Web
4343 @using System.Collections.Generic
4344 @using Dynamicweb.Rapido.Blocks.Extensibility
4345 @using Dynamicweb.Rapido.Blocks
4346
4347 @{
4348 BlocksPage bottomSnippetsBlocksPage = BlocksPage.GetBlockPage("Master");
4349
4350 Block primaryBottomSnippets = new Block()
4351 {
4352 Id = "MasterJavascriptInitializers",
4353 SortId = 100,
4354 Template = RenderPrimaryBottomSnippets()
4355 };
4356 bottomSnippetsBlocksPage.Add(MasterBlockId.MasterReferences, primaryBottomSnippets);
4357
4358 if (Dynamicweb.Rapido.Services.User.IsBuyingAllowed())
4359 {
4360 Block miniCartPageId = new Block
4361 {
4362 Id = "MiniCartPageId",
4363 Template = RenderMiniCartPageId()
4364 };
4365 bottomSnippetsBlocksPage.Add(MasterBlockId.MasterReferences, miniCartPageId);
4366 }
4367 }
4368
4369 @helper RenderPrimaryBottomSnippets()
4370 {
4371 bool isWireframeMode = Model.Area.Item.GetItem("Settings").GetBoolean("WireframeMode");
4372 bool useGoogleTagManager = !string.IsNullOrEmpty(Pageview.AreaSettings.GetItem("Settings").GetString("GoogleTagManagerID"));
4373
4374 if (isWireframeMode)
4375 {
4376 <script>
4377 Wireframe.Init(true);
4378 </script>
4379 }
4380
4381
4382 if (useGoogleTagManager)
4383 {
4384 <script>
4385 document.addEventListener('addToCart', function(event) {
4386 var googleImpression = JSON.parse(event.detail.productInfo.googleImpression);
4387 if (typeof googleImpression == "string") {
4388 googleImpression = JSON.parse(event.detail.productInfo.googleImpression);
4389 }
4390 dataLayer.push({
4391 'event': 'addToCart',
4392 'ecommerce': {
4393 'currencyCode': googleImpression.currency,
4394 'add': {
4395 'products': [{
4396 'name': googleImpression.name,
4397 'id': googleImpression.id,
4398 'price': googleImpression.price,
4399 'brand': googleImpression.brand,
4400 'category': googleImpression.category,
4401 'variant': googleImpression.variant,
4402 'quantity': event.detail.quantity
4403 }]
4404 }
4405 }
4406 });
4407 });
4408 </script>
4409 }
4410
4411 //if digitalwarehouse
4412 if (Model.Area.Item.GetItem("Layout").GetItem("Header").GetBoolean("ShowDownloadCart"))
4413 {
4414 string cartContextId = Converter.ToString(HttpContext.Current.Application["DownloadCartContext"]);
4415
4416 if (string.IsNullOrEmpty(cartContextId))
4417 {
4418 var moduleProps = Dynamicweb.Modules.Properties.GetParagraphModuleSettings(GetPageIdByNavigationTag("DownloadCart"), "eCom_CartV2");
4419 var cartSettings = new Dynamicweb.Ecommerce.Cart.ModuleSettings(moduleProps);
4420 cartContextId = cartSettings.OrderContextID;
4421 HttpContext.Current.Application["DownloadCartContext"] = cartContextId;
4422 }
4423
4424 <script>
4425 let downloadCart = new DownloadCart({
4426 cartPageId: @GetPageIdByNavigationTag("MiniCartFeed"),
4427 contextId: "@cartContextId",
4428 addButtonText: "@Translate("Add")",
4429 removeButtonText: "@Translate("Remove")"
4430 });
4431 </script>
4432 }
4433
4434 <!--$$Javascripts-->
4435 }
4436
4437 @helper RenderMiniCartPageId()
4438 {
4439 int miniCartFeedPageId = GetPageIdByNavigationTag("MiniCartFeed");
4440 <script>
4441 window.cartId = "@miniCartFeedPageId";
4442 </script>
4443 }
4444 @using System
4445 @using System.Web
4446 @using System.Collections.Generic
4447 @using Dynamicweb.Rapido.Blocks
4448
4449 @{
4450 BlocksPage pageCustomBlocksPage = BlocksPage.GetBlockPage("Master");
4451
4452 }
4453
4454
4455 <!DOCTYPE html>
4456 <html lang="@Pageview.Area.CultureInfo.TwoLetterISOLanguageName">
4457
4458 @* The @RenderBlockList base helper is included in Components/GridBuilder.cshtml *@
4459 @RenderBlockList(masterPage.BlocksRoot.BlocksList)
4460
4461
4462
4463 @helper RenderMasterHead() {
4464 List<Block> subBlocks = this.masterPage.GetBlockListById("Head").OrderBy(item => item.SortId).ToList();
4465
4466 <head>
4467 <meta charset="utf-8" />
4468 <title>@Model.Title</title>
4469
4470 <!-- Mobile specific meta -->
4471 <meta name="viewport" content="width=device-width, initial-scale=1">
4472
4473 @RenderBlockList(subBlocks)
4474 </head>
4475 }
4476
4477 @helper RenderMasterCss() {
4478 var fonts = new string[] {
4479 getFontFamily("Layout", "HeaderFont"),
4480 getFontFamily("Layout", "SubheaderFont"),
4481 getFontFamily("Layout", "TertiaryHeaderFont"),
4482 getFontFamily("Layout", "Header", "ToolsFont"),
4483 getFontFamily("Layout", "Header", "NavigationFont"),
4484 getFontFamily("Layout", "MobileNavigation", "Font"),
4485 getFontFamily("ProductList", "Facets", "HeaderFont"),
4486 getFontFamily("ProductPage", "PriceFontDesign"),
4487 getFontFamily("Ecommerce", "SaleSticker", "Font"),
4488 getFontFamily("Ecommerce", "NewSticker", "Font"),
4489 getFontFamily("Ecommerce", "CustomSticker", "Font")
4490 };
4491
4492 string autoCssLink = "/Files/Templates/Designs/Rapido/css/rapido/rapido_" + Model.Area.ID.ToString() + ".min.css?ticks=" + Model.Area.UpdatedDate.Ticks;
4493 bool useFontAwesomePro = Pageview.AreaSettings.GetItem("Layout").GetItem("Icons").GetBoolean("UseFontAwesomePro");
4494 var family = string.Join("%7C", fonts.Where(x => !string.IsNullOrEmpty(x)).Distinct().Select(x => string.Format("{0}:100,200,300,400,500,600,700,800,900", x)));
4495
4496 <!-- Base (Default, wireframe) styles -->
4497 <link rel="stylesheet" href="/Files/Templates/Designs/Rapido/css/base/base.min.css" type="text/css">
4498
4499 <!-- Rapido Css from Website Settings -->
4500 <link rel="stylesheet" href="@autoCssLink" type="text/css">
4501
4502 <!-- Ignite Css (Custom site specific styles) -->
4503 <link type="text/css" href="/Files/Templates/Designs/Rapido/css/ignite/ignite.min.css" rel="stylesheet">
4504
4505 <!-- Font awesome -->
4506 <link rel="stylesheet" href="/Files/Templates/Designs/Rapido/css/fonts/FontAwesomePro/css/fontawesome-all.min.css" type="text/css">
4507
4508 <!-- Google fonts -->
4509 <link href="https://fonts.googleapis.com/css?family=@family" rel="stylesheet">
4510 }
4511
4512 @helper RenderMasterBody() {
4513 List<Block> subBlocks = this.masterPage.GetBlockListById("Body").OrderBy(item => item.SortId).ToList();
4514
4515 <body>
4516 @RenderBlockList(subBlocks)
4517 </body>
4518 }
4519
4520 @helper RenderMain()
4521 {
4522 List<Block> subBlocks = this.masterPage.GetBlockListById("MasterMain").OrderBy(item => item.SortId).ToList();
4523
4524 <main class="site dw-mod">
4525 @RenderBlockList(subBlocks)
4526 </main>
4527 }
4528
4529 @helper RenderPageContent()
4530 {
4531 bool isNavigationStickyMenu = Pageview.Device.ToString() != "Mobile" && Pageview.Device.ToString() != "Tablet" && Model.Area.Item.GetItem("Layout").GetItem("Header").GetBoolean("StickyTop");
4532 string pagePos = isNavigationStickyMenu ? "js-page-pos" : "";
4533
4534 <div id="Page" class="page @pagePos">
4535 <section class="center-container content-container dw-mod" id="content">
4536 @RenderSnippet("Content")
4537 </section>
4538 </div>
4539 }
4540
4541 @helper RenderNoLayoutFooter() {
4542 <footer class="footer dw-mod">
4543 <div class="grid__col-12 footer__copyright dw-mod">
4544 <p>@Model.Area.Item.GetItem("Layout").GetString("FooterCopyrightText")</p>
4545 </div>
4546 </footer>
4547 }
4548
4549 @* Hack to support nested helpers *@
4550 @SnippetStart("Content")
4551 @inherits Dynamicweb.Rendering.ViewModelTemplate<Dynamicweb.Frontend.PageViewModel>
4552
4553
4554 @using Dynamicweb.Extensibility
4555 @using Dynamicweb.Rapido.Blocks.Components.Documentation
4556 @using Dynamicweb.Rapido.Blocks.Components.General
4557 @using Dynamicweb.Rapido.Blocks.Components.Ecommerce
4558 @using Dynamicweb.Rapido.Blocks.Components.Articles
4559 @using Dynamicweb.Rapido.Blocks.Components
4560 @using Dynamicweb.Rapido.Blocks
4561
4562 <style>
4563 .test-table-class td, .test-table-class th {
4564 border: 1px solid #d3d3d3;
4565 }
4566
4567 .cm-invalidchar {
4568 display: none;
4569 }
4570
4571 .fixed-doc-navigation {
4572 position: fixed;
4573 top: 0;
4574 left: 0;
4575 z-index: 100;
4576 background-color: #fff;
4577 box-shadow: 0px 2px 20px 1px rgba(0,0,0,0.25);
4578 }
4579
4580 .fixed-doc-navigation-search {
4581 position: relative;
4582 background-color: #fff;
4583 z-index: 20;
4584 width: 285px;
4585 }
4586
4587 .fixed-doc-navigation-container {
4588 overflow-y: scroll;
4589 height: 100vh;
4590 z-index: 10;
4591 }
4592
4593 .doc-to-top-btn {
4594 position: fixed;
4595 bottom: 0;
4596 right: 0;
4597 z-index: 100;
4598 }
4599 </style>
4600
4601 @functions {
4602 public class DocItem
4603 {
4604 public string Name { get; set; }
4605 public ComponentBase component { get; set; }
4606 public string CodeExample { get; set; }
4607 }
4608
4609 BlocksPage componentsDocPage = BlocksPage.GetBlockPage("ComponentsDoc");
4610
4611 List<DocItem> GeneralComponentsList = new List<DocItem>();
4612 List<DocItem> EcommerceComponentsList = new List<DocItem>();
4613 List<DocItem> ArticleComponentsList = new List<DocItem>();
4614
4615 int count = 10;
4616
4617 public dynamic GetEnumSetting(dynamic enumSetting, string name = null)
4618 {
4619 string enumName = name == null ? enumSetting.GetType().Name : name;
4620 enumSetting = HttpContext.Current.Request.QueryString.Get(enumName) != null ? System.Enum.Parse(enumSetting.GetType(), HttpContext.Current.Request.QueryString.Get(enumName)) : enumSetting;
4621 return enumSetting;
4622 }
4623 }
4624
4625 @{
4626 Dynamicweb.Frontend.FileViewModel DummyImage = new Dynamicweb.Frontend.FileViewModel();
4627 DummyImage.Path = "/Files/Images/Demo/8026157750_b98560948c_b.jpg";
4628
4629 SelectField selectField = new SelectField
4630 {
4631 Id = "MySelectField",
4632 Label = Translate("Select field"),
4633 ErrorMessage = Translate("There is an error"),
4634 Link = new Link { Icon = new Icon { Name = "fa-info-circle", Prefix = "fal" }, Href = "#" },
4635 ActionButton = new Button { OnClick = "#", Icon = new Icon { Prefix = "fas", Name = "fa-plus", LabelPosition = IconLabelPosition.After } }
4636 };
4637 selectField.Options.Add(new SelectFieldOption { Label = Translate("One"), Value = "one" });
4638 selectField.Options.Add(new SelectFieldOption { Label = Translate("Two"), Value = "two" });
4639 selectField.Options.Add(new SelectFieldOption { Label = Translate("Three"), Value = "three", Disabled = true });
4640
4641 string selectFieldCodeExample = "SelectField selectField = new SelectField " +
4642 "{" +
4643 "Id = \"MySelectField\"," +
4644 "Label = Translate(\"Select field\")," +
4645 "ErrorMessage = Translate(\"There is an error\")," +
4646 "ActionButton = new Button { OnClick = \"#\", Icon = new Icon { Prefix = \"fas\", Name = \"fa-plus\", LabelPosition = IconLabelPosition.After } }" +
4647 "};" +
4648 "-newline" +
4649 "selectField.Options.Add(new SelectFieldOption { Label = Translate(\"One\"), Value = \"one\" });";
4650
4651 RadioButtonListField radioButtonListField = new RadioButtonListField
4652 {
4653 Id = "MyRadioButtons",
4654 Name = "MyRadioButtons",
4655 Label = Translate("Select option"),
4656 ErrorMessage = Translate("There is an error"),
4657 Link = new Link { Icon = new Icon { Name = "fa-info-circle", Prefix = "fal" }, Href = "#" },
4658 Options = new List<RadioButtonField> {
4659 new RadioButtonField { Label = Translate("One"), Value = "one", Id = "RadioOne", Checked = true },
4660 new RadioButtonField { Label = Translate("Two"), Value = "two", Id = "RadioTwo"},
4661 new RadioButtonField { Label = Translate("Three"), Value = "three", Id = "RadioThree", Disabled = true }
4662 }
4663 };
4664
4665 CheckboxListField checkboxListField = new CheckboxListField
4666 {
4667 Id = "MyCheckboxes",
4668 Label = Translate("Select multiple options"),
4669 Link = new Link { Icon = new Icon { Name = "fa-info-circle", Prefix = "fal" }, Href = "#" },
4670 ErrorMessage = Translate("There is an error")
4671 };
4672 checkboxListField.Options.Add(new CheckboxField { Label = Translate("One"), Id = "CheckOne", Checked = true });
4673 checkboxListField.Options.Add(new CheckboxField { Label = Translate("Two"), Id = "CheckTwo", Checked = true });
4674 checkboxListField.Options.Add(new CheckboxField { Label = Translate("Three"), Id = "CheckThree", Disabled = true });
4675
4676 string checkboxListFieldCodeExample = "CheckboxListField checkboxListField = new CheckboxListField " +
4677 "{" +
4678 "Id = \"MyCheckboxes\"," +
4679 "Label = Translate(\"Select multiple options\")," +
4680 "ErrorMessage = Translate(\"There is an error\")" +
4681 "};" +
4682 "-newline" +
4683 "checkboxListField.Options.Add(new CheckboxField { Label = Translate(\"One\"), Id = \"CheckOne\", Checked = true });";
4684
4685 StickersCollection stickersCollection = new StickersCollection { CssClass = "u-block", Position = GetEnumSetting(StickersListPosition.TopLeft) };
4686 stickersCollection.Stickers.Add(new Sticker { Title = "On sale", Style = StickerStyle.Sale });
4687 stickersCollection.Stickers.Add(new Sticker { Title = "New", Style = StickerStyle.New });
4688 stickersCollection.Stickers.Add(new Sticker { Title = "Black friday", Style = StickerStyle.Custom });
4689
4690 Form formComponent = new Form { Method = FormMethod.Get };
4691 formComponent.Add(new CheckboxField { Checked = true, Label = Translate("My label") });
4692 formComponent.Add(new TextField { Required = true, Label = Translate("My text") });
4693 formComponent.Add(new NumberField { Required = true, Label = Translate("My number"), Min = 2 });
4694 formComponent.Add(new NumberField { Required = true, Label = Translate("My number"), Min = 2 });
4695
4696 //here used custom styles from end of this page
4697 var table = new Table
4698 {
4699 Id = "MyTable",
4700 Design = GetEnumSetting(TableDesign.Clean),
4701 CssClass = "test-table-class",
4702 Header = new TableRow
4703 {
4704 CssClass = "test-tr-class",
4705 Id = "tr1",
4706 Cells = new List<TableCell> {
4707 new TableCell { Content = "Meat" },
4708 new TableCell { Content = "Proteins (g)" },
4709 new TableCell { Content = "Fats (g)" },
4710 new TableCell { Content = "Carbs (g)" }
4711 }
4712 },
4713 Rows = new List<TableRow> {
4714 new TableRow ("Chicken", "20,8", "8,8", "0,6"),
4715 new TableRow ("Pork", "19,4", "7,1", "0"),
4716 new TableRow ("Beef", "18,9", "12,4", "0"),
4717 new TableRow (
4718 new TableCell { IsHeader = true, Content = "CustomCell", Colspan = 2 },
4719 new TableCell { Content = "CustomCell2", Rowspan = 2, Colspan = 2, CssClass = "u-brand-color-one--bg-lighten-20 u-color-light" }
4720 ),
4721 new TableRow {
4722 IsHeaderRow = true,
4723 Cells = new List<TableCell> {
4724 new TableCell { Content = "string1" },
4725 new TableCell { Content = "string2" }
4726 }
4727 }
4728 },
4729 Footer = new TableRow
4730 {
4731 CssClass = "u-color-light-gray--bg",
4732 Cells = new List<TableCell> {
4733 new TableCell { Content = "1" },
4734 new TableCell { Content = "2" },
4735 new TableCell { Content = "3" },
4736 new TableCell { Content = "4" }
4737 }
4738 }
4739 };
4740
4741 var simpleTable = new Table
4742 {
4743 Id = "MySimpleTable",
4744 CssClass = "test-table-class",
4745 Design = GetEnumSetting(TableDesign.Striped),
4746 Rows = new List<TableRow> {
4747 new TableRow ("Color", "Blue"),
4748 new TableRow ("Size", "M")
4749 }
4750 };
4751 string simpleTableCodeExample = "new Table { " +
4752 "Id = \"MySimpleTable\"," +
4753 "Design = GetEnumSetting(TableDesign.Striped), " +
4754 "Rows = new List<TableRow> { " +
4755 "new TableRow (\"Color\", \"Blue\"), " +
4756 "new TableRow (\"Size\", \"M\") " +
4757 "} " +
4758 "};";
4759
4760 Dashboard dashboard = new Dashboard { WidgetsBaseBackgroundColor = "#0582c4" };
4761 dashboard.AddWidget(new DashboardWidgetLink { Link = "#", Title = "Example", Icon = new Icon { Prefix = "fas", Name = "fa-code" } });
4762 dashboard.AddWidget(new DashboardWidgetLink { Link = "#", Title = "Widget", Icon = new Icon { Prefix = "fas", Name = "fa-bell" } });
4763 dashboard.AddWidget(new DashboardWidgetLink { Link = "#", Title = "Sample", Icon = new Icon { Prefix = "fas", Name = "fa-bomb" } });
4764
4765 string dashboardCodeExample = "Dashboard dashboard = new Dashboard { WidgetsBaseBackgroundColor = \"#0582c4\" }; " + "-newline " +
4766 "dashboard.AddWidget(new DashboardWidgetLink { Link = \"#\", Title = \"Example\", Icon = new Icon { Prefix = \"fas\", Name = \"fa-code\" } }); " + "-newline " +
4767 "dashboard.AddWidget(new DashboardWidgetLink { Link = \"#\", Title = \"Widget\", Icon = new Icon { Prefix = \"fas\", Name = \"fa-bell\" } }); " + "-newline " +
4768 "dashboard.AddWidget(new DashboardWidgetLink { Link = \"#\", Title = \"Sample\", Icon = new Icon { Prefix = \"fas\", Name = \"fa-bomb\" } });";
4769
4770 Dashboard dashboard2 = new Dashboard { WidgetsBaseBackgroundColor = "#32b132" };
4771 dashboard2.AddWidget(new DashboardWidgetCounter { Count = 120, Title = "Orders", Icon = new Icon { Prefix = "fas", Name = "fa-code" } });
4772 dashboard2.AddWidget(new DashboardWidgetCounter { Count = 1105, Title = "Count" });
4773 dashboard2.AddWidget(new DashboardWidgetCounter { Count = 5, Title = "Quotes", Icon = new Icon { Prefix = "fas", Name = "fa-quote-right" } });
4774 dashboard2.AddWidget(new DashboardWidgetCounter { Count = 15, Title = "Days", Icon = new Icon { Prefix = "fas", Name = "fa-calendar" } });
4775
4776 string dashboard2CodeExample = "Dashboard dashboard = new Dashboard { WidgetsBaseBackgroundColor = \"#32b132\" }; " + "-newline " +
4777 "dashboard.AddWidget(new DashboardWidgetCounter { Count = 120, Title = \"Orders\", Icon = new Icon { Prefix = \"fas\", Name = \"fa-code\" } }); " + "-newline " +
4778 "dashboard.AddWidget(new DashboardWidgetCounter { Count = 1105, Title = \"Count\" }); ";
4779
4780 VariantMatrix variantMatrix = new VariantMatrix { ProductId = "PRODTEST" };
4781
4782 VariantGroup variantGroup1 = new VariantGroup
4783 {
4784 Name = "Colors"
4785 };
4786
4787 VariantOption option1 = new VariantOption
4788 {
4789 Name = "Blue",
4790 Id = "V0"
4791 };
4792 variantGroup1.AddVariantOption(option1);
4793
4794 VariantOption option2 = new VariantOption
4795 {
4796 Name = "Red",
4797 Id = "V1"
4798 };
4799 variantGroup1.AddVariantOption(option2);
4800
4801 variantMatrix.AddVariantGroup(variantGroup1);
4802
4803 variantMatrix.AddVariantProduct("V0.V1", new VariantProduct { ProductId = "PROD0", VariantId = "V0.V1" });
4804 variantMatrix.AddVariantProduct("V0.V2", new VariantProduct { ProductId = "PROD1", VariantId = "V0.V2" });
4805 variantMatrix.AddVariantProduct("V1.V2", new VariantProduct { ProductId = "PROD2", VariantId = "V1.V2" });
4806
4807 GeneralComponentsList.Add(new DocItem
4808 {
4809 component = new Button { Id = "MyButton", ButtonLayout = GetEnumSetting(ButtonLayout.Primary), Title = Translate("Read more"), Icon = new Icon { Prefix = "fas", Name = "fa-plus", LabelPosition = IconLabelPosition.After }, OnClick = "document.getElementById('MyButtonModalTrigger').checked = false" },
4810 CodeExample = "new Button { Id = \"MyButton\", ButtonLayout = GetEnumSetting(ButtonLayout.Primary), Title = Translate(\"Read more\"), Icon = new Icon { Prefix = \"fas\", Name = \"fa-plus\", LabelPosition = IconLabelPosition.After }, OnClick = \"document.getElementById('MyButtonModalTrigger').checked = false\" }"
4811 });
4812 GeneralComponentsList.Add(new DocItem
4813 {
4814 component = new Link { Id = "MyLink", ButtonLayout = GetEnumSetting(ButtonLayout.Primary), Target = GetEnumSetting(LinkTargetType.Blank), Href = "#", Title = "Read more", Icon = new Icon { Prefix = "fas", Name = "fa-plus", LabelPosition = IconLabelPosition.After }, OnClick = "document.getElementById('MyButtonModalTrigger').checked = false" },
4815 CodeExample = "new Link { Id = \"MyButton\", ButtonLayout = GetEnumSetting(ButtonLayout.Primary), Target = GetEnumSetting(LinkTargetType.Blank), Href = \"#\", Title = \"Read more\", Icon = new Icon { Prefix=\"fas\", Name=\"fa-plus\", LabelPosition = IconLabelPosition.After }, OnClick=\"document.getElementById('MyButtonModalTrigger').checked = false\" }"
4816 });
4817 GeneralComponentsList.Add(new DocItem
4818 {
4819 component = new Heading { Title = Translate("My new heading"), Level = 1, Icon = new Icon { Prefix = "fas", Name = "fa-plus", LabelPosition = IconLabelPosition.After } },
4820 CodeExample = "new Heading { Title= Translate(\"My new heading\"), Level = 1, Icon = new Icon { Prefix = \"fas\", Name = \"fa-plus\", LabelPosition = IconLabelPosition.After } }"
4821 });
4822 GeneralComponentsList.Add(new DocItem
4823 {
4824 component = new Image { Path = DummyImage, Caption = Translate("Image caption"), ImageDefault = new ImageSettings { Width = 1000, Height = 600, Crop = 1, Compression = 75 }, ImageSmall = new ImageSettings { Width = 500, Height = 300, Crop = 1, Compression = 75 }, Style = GetEnumSetting(ImageStyle.None), FilterPrimary = GetEnumSetting(ImageFilter.None), FilterSecondary = GetEnumSetting(ImageFilter.None) },
4825 CodeExample = "new Image { Path = DummyImage, Caption = Translate(\"Image caption\"), ImageDefault = new ImageSettings { Width = 1000, Height = 600, Crop = 1, Compression = 75 }, ImageSmall = new ImageSettings { Width = 500, Height = 300, Crop = 1, Compression = 75 }, Style = GetEnumSetting(ImageStyle.None), FilterPrimary = GetEnumSetting(ImageFilter.None), FilterSecondary = GetEnumSetting(ImageFilter.None) }"
4826 });
4827 GeneralComponentsList.Add(new DocItem
4828 {
4829 component = new Icon { Prefix = "fas", Name = "fa-plus", Label = Translate("Icon label"), LabelPosition = GetEnumSetting(IconLabelPosition.After) },
4830 CodeExample = "new Icon { Prefix = \"fas\", Name = \"fa-plus\", Label = Translate(\"Icon label\"), LabelPosition = GetEnumSetting(IconLabelPosition.After) }"
4831 });
4832 GeneralComponentsList.Add(new DocItem
4833 {
4834 component = new FileField { Id = "MyFileField", ChooseFileText = Translate("Choose file"), NoFilesChosenText = Translate("No files chosen"), Link = new Link { Icon = new Icon { Name = "fa-info-circle", Prefix = "fal" }, Href = "#" } },
4835 CodeExample = "new FileField { Id = \"MyFileField\", ChooseFileText = Translate(\"Choose file\"), NoFilesChosenText = Translate(\"No files chosen\") }"
4836 });
4837 GeneralComponentsList.Add(new DocItem
4838 {
4839 component = new TextField { Id = "MyTextField", Label = Translate("Text field"), Placeholder = "Text", MaxLength = 160, ErrorMessage = Translate("There is an error"), ExtraAttributes = new Dictionary<string, string> { { "data-extend", "true" } }, Link = new Link { Icon = new Icon { Name = "fa-info-circle", Prefix = "fal" }, Href = "#" } },
4840 CodeExample = "new TextField { Id = \"MyTextField\", Label = Translate(\"Text field\"), Placeholder = \"Text\", MaxLength = 160, ErrorMessage = Translate(\"There is an error\"), ExtraAttributes = new Dictionary<string, string> { { \"data-extend\", \"true\" } }"
4841 });
4842 GeneralComponentsList.Add(new DocItem
4843 {
4844 component = selectField,
4845 CodeExample = selectFieldCodeExample
4846 });
4847 GeneralComponentsList.Add(new DocItem
4848 {
4849 component = new NumberField { Label = Translate("My number"), Max = 10, Min = 0, Step = 1, Value = "1", Id = "MyNumber", Link = new Link { Icon = new Icon { Name = "fa-info-circle", Prefix = "fal" }, Href = "#" } },
4850 CodeExample = "new NumberField { Label = Translate(\"My number\"), Max = 10, Min = 0, Step = 1, Value = \"1\", Id = \"MyNumber\" }"
4851 });
4852 GeneralComponentsList.Add(new DocItem
4853 {
4854 component = new HiddenField { Id = "HiddenField", Value = "HiddenValue" },
4855 CodeExample = "new HiddenField { Id=\"HiddenField\", Value=\"HiddenValue\" }"
4856 });
4857 GeneralComponentsList.Add(new DocItem
4858 {
4859 component = new CheckboxField { Checked = true, Id = "MyCheckbox", Label = "Check this", ErrorMessage = Translate("There is an error"), Link = new Link { Icon = new Icon { Name = "fa-info-circle", Prefix = "fal" }, Href = "#" } },
4860 CodeExample = "new CheckboxField { Checked = true, Id=\"MyCheckbox\", Label= \"Check this\", ErrorMessage= Translate(\"There is an error\") }"
4861 });
4862 GeneralComponentsList.Add(new DocItem
4863 {
4864 component = checkboxListField,
4865 CodeExample = checkboxListFieldCodeExample
4866 });
4867 GeneralComponentsList.Add(new DocItem
4868 {
4869 component = new TextareaField { Id = "MyTextareaField", Label = Translate("Comment"), Rows = 4, Placeholder = Translate("Comment"), ErrorMessage = Translate("There is an error"), Link = new Link { Icon = new Icon { Name = "fa-info-circle", Prefix = "fal" }, Href = "#" } },
4870 CodeExample = "new TextareaField { Id = \"MyTextareaField\", Label = Translate(\"Comment\"), Rows = 4, Placeholder = Translate(\"Comment\"), ErrorMessage = Translate(\"There is an error\") }"
4871 });
4872 GeneralComponentsList.Add(new DocItem
4873 {
4874 Name = "Table (Simple demo)",
4875 component = simpleTable,
4876 CodeExample = simpleTableCodeExample
4877 });
4878 GeneralComponentsList.Add(new DocItem
4879 {
4880 component = table,
4881 CodeExample = simpleTableCodeExample
4882 });
4883 GeneralComponentsList.Add(new DocItem
4884 {
4885 component = new DashboardWidgetLink { Link = "#", Title = "My cart", BackgroundColor = "#002240", Icon = new Icon { Prefix = "fas", Name = "fa-shopping-cart" } },
4886 CodeExample = "new DashboardWidgetLink { Link = \"#\", Title = \"My cart\", BackgroundColor = \"#002240\", Icon = new Icon { Prefix = \"fas\", Name = \"fa-shopping-cart\" } }"
4887 });
4888 GeneralComponentsList.Add(new DocItem
4889 {
4890 component = new DashboardWidgetCounter { Count = 167, Title = "Products", BackgroundColor = "#002240", Icon = new Icon { Prefix = "fas", Name = "fa-shopping-cart" } },
4891 CodeExample = "new DashboardWidgetCounter { Count = 167, Title =\"Products\", BackgroundColor = \"#002240\", Icon = new Icon { Prefix = \"fas\", Name = \"fa-shopping-cart\" } }"
4892 });
4893 GeneralComponentsList.Add(new DocItem
4894 {
4895 component = dashboard,
4896 CodeExample = dashboardCodeExample
4897 });
4898 GeneralComponentsList.Add(new DocItem
4899 {
4900 Name = "Dashboard (Counters)",
4901 component = dashboard2,
4902 CodeExample = dashboard2CodeExample
4903 });
4904 GeneralComponentsList.Add(new DocItem
4905 {
4906 component = new NotificationMessage { Message = Translate("There is an error"), MessageType = GetEnumSetting(NotificationMessageType.Error) },
4907 CodeExample = "new NotificationMessage { Message = Translate(\"There is an error\"), MessageType = GetEnumSetting(NotificationMessageType.Error) }"
4908 });
4909 GeneralComponentsList.Add(new DocItem
4910 {
4911 component = new Rating { Score = 4, OutOf = 5, Type = GetEnumSetting(RatingType.Stars) },
4912 CodeExample = "new Rating { Score = 4, OutOf = 5, Type = GetEnumSetting(RatingType.Stars) }"
4913 });
4914 GeneralComponentsList.Add(new DocItem
4915 {
4916 component = new Sticker { Title = "On sale", Style = GetEnumSetting(StickerStyle.Sale), Size = GetEnumSetting(StickerSize.Medium) },
4917 CodeExample = "new Sticker { Title = \"On sale\", Style = GetEnumSetting(StickerStyle.Sale), Size = GetEnumSetting(StickerSize.Medium) }"
4918 });
4919 GeneralComponentsList.Add(new DocItem
4920 {
4921 component = new Text { Content = Translate("My text") },
4922 CodeExample = "new Text { Content = Translate(\"My text\") }"
4923 });
4924 GeneralComponentsList.Add(new DocItem
4925 {
4926 component = new ContentModule { Content = Translate("Add the module as a text string") },
4927 CodeExample = "new ContentModule { Content = Translate(\"Add the module as a text string\") }"
4928 });
4929 GeneralComponentsList.Add(new DocItem
4930 {
4931 component = stickersCollection
4932 });
4933 GeneralComponentsList.Add(new DocItem
4934 {
4935 component = formComponent
4936 });
4937 GeneralComponentsList.Add(new DocItem
4938 {
4939 component = new Modal { Id = "ModalTest", Heading = new Heading { Title = Translate("My text") }, BodyText = "To trigger a modal, simply force the associated checkbox to true with javascript. E.g. document.getElementById('ModalTestModalTrigger').value = true;", Height = ModalHeight.Md },
4940 CodeExample = "new Modal { Id = \"ModalTest\", Heading = new Heading { Title = Translate(\"My text\") }, BodyText = \"To trigger a modal, simply force the associated checkbox to true with javascript. E.g. document.getElementById('ModalTestModalTrigger').value = true;\", Height = ModalHeight.Md }"
4941 });
4942
4943 <script>
4944 window.cartId = 530;
4945 document.addEventListener('addToCart', function (event) {
4946 console.log(event.detail)
4947 alert("Product added to cart: " + event.detail.quantity + " x " + event.detail.productInfo.name + " ( product id = " + event.detail.id + ", unit id = " + event.detail.unitId + ")");
4948 });
4949 window.selectedTestUnit = "";
4950 function selectTestUnit(unit) {
4951 window.selectedTestUnit = unit.getAttribute('data-value');
4952 unit.closest('.unit-selector').previousElementSibling.checked = false;
4953 unit.closest('.unit-selector').querySelector('.dropdown__header').innerText = unit.innerText;
4954 }
4955 </script>
4956
4957
4958 EcommerceComponentsList.Add(new DocItem
4959 {
4960 component = new AddToCart {
4961 AddButton = new AddToCartButton {
4962 ProductId = "PROD102", UnitId = "' + window.selectedTestUnit + '", ProductInfo = "{name: 'Test product'}"
4963 },
4964 UnitSelector = new UnitSelector {
4965 SelectedOption = "Select unit",
4966 OptionsContent = "<div class='dropdown__item dw-mod' onclick='selectTestUnit(this)' data-value=''>Select unit</div><div class='dropdown__item dw-mod' onclick='selectTestUnit(this)' data-value='VO53'>Piece</div><div class='dropdown__item dw-mod' onclick='selectTestUnit(this)' data-value='VO44'>Pkg. of 8</div>" },
4967 QuantitySelector = new QuantitySelector { } },
4968 CodeExample = "new AddToCart { AddButton = new AddToCartButton { ProductId = \"PROD102\", UnitId = \"VO53\", ProductInfo = \"{name: 'Test product'}\" }, UnitSelector = new UnitSelector { SelectedOption = \"Select unit\" }, QuantitySelector = new QuantitySelector { } }"
4969 });
4970
4971 EcommerceComponentsList.Add(new DocItem
4972 {
4973 component = new UnitSelector { SelectedOption = "Select unit", OptionsContent = "<div class='dropdown__item dw-mod' onclick='alert(\"Unit selected\")'>Select unit</div><div class='dropdown__item dw-mod' onclick='alert(\"Unit selected\")'>Piece</div><div class='dropdown__item dw-mod' onclick='alert(\"Unit selected\")'>Test unit</div>" },
4974 CodeExample = "new UnitSelector { SelectedOption = \"All\", OptionsContent = \"<div class='dropdown__item dw-mod' onclick='**js event**'>Test unit</div>\" }"
4975 });
4976
4977 EcommerceComponentsList.Add(new DocItem
4978 {
4979 component = new QuantitySelector { Id = "MyQuantitySelector" },
4980 CodeExample = "new QuantitySelector { Id = \"MyQuantitySelector\" }"
4981 });
4982
4983 EcommerceComponentsList.Add(new DocItem
4984 {
4985 component = new AddToCartButton { ProductId = "PROD102", UnitId = "VO53", ProductInfo = "{name: 'Test product'}", QuantitySelectorId = "MyQuantitySelector" },
4986 CodeExample = "new AddToCartButton { ProductId = \"PROD102\", UnitId = \"VO53\", ProductInfo = \"{name: 'Test product'}\", QuantitySelectorId = \"MyQuantitySelector\" }"
4987 });
4988
4989 EcommerceComponentsList.Add(new DocItem
4990 {
4991 component = variantMatrix
4992 });
4993
4994 ArticleComponentsList.Add(new DocItem
4995 {
4996 component = new ArticleHeader { Heading = "Header clean layout", Author = "Me", ButtonLayout = GetEnumSetting(ButtonLayout.Primary), Category = "Guides", CategoryColor = "#c21212", Date = "01-01-2020", Image = new Image { Path = DummyImage, ImageDefault = new ImageSettings { Width = 1000, Height = 600, Crop = 1, Compression = 75 } }, Link = "#", LinkText = "Read more", Subheading = "This is new", TextLayout = GetEnumSetting(ArticleHeaderTextLayout.Center), Layout = GetEnumSetting(ArticleHeaderLayout.Clean) },
4997 CodeExample = " new ArticleHeader { Heading = \"Header clean layout\", Author = \"Me\", ButtonLayout = GetEnumSetting(ButtonLayout.Primary), Category = \"Guides\", CategoryColor = \"#c21212\", Date = \"01-01-2020\", Image = new Image { Path = DummyImage, ImageDefault = new ImageSettings { Width = 1000, Height = 600, Crop = 1, Compression = 75 } }, Link = \"#\", LinkText = \"Read more\", Subheading = \"This is new\", TextLayout = GetEnumSetting(ArticleHeaderTextLayout.Center), Layout = GetEnumSetting(ArticleHeaderLayout.Clean) }"
4998 });
4999 ArticleComponentsList.Add(new DocItem
5000 {
5001 component = new ArticleImage { Image = new Image { Path = DummyImage, ImageDefault = new ImageSettings { Height = 650, Width = 1300 }, Style = GetEnumSetting(ImageStyle.None), Title = "ComponentImage", Caption = "This is the caption for the image" } },
5002 CodeExample = "new ArticleImage { Image = new Image { Path = DummyImage, ImageDefault = new ImageSettings { Height = 650, Width = 1300 }, Style = GetEnumSetting(ImageStyle.None), Title = \"ComponentImage\", Caption = \"This is the caption for the image\" } }"
5003 });
5004 ArticleComponentsList.Add(new DocItem
5005 {
5006 component = new ArticleBanner { Image = new Image { Path = DummyImage, ImageDefault = new ImageSettings { Width = 1000, Height = 600, Crop = 1, Compression = 75 } }, Heading = "A perfect banner" },
5007 CodeExample = "new ArticleBanner { Image = new Image { Path = DummyImage, ImageDefault = new ImageSettings { Width = 1000, Height = 600, Crop = 1, Compression = 75 } }, Heading = \"A perfect banner\" }"
5008 });
5009 ArticleComponentsList.Add(new DocItem
5010 {
5011 component = new ArticleQuote { Author = "The user", Image = new Image { Path = DummyImage }, Text = "I would like to quote that this is so." },
5012 CodeExample = "new ArticleQuote { Author = \"The user\", Image = new Image { Path = DummyImage }, Text = \"I would like to quote that this is so.\" }"
5013 });
5014 ArticleComponentsList.Add(new DocItem
5015 {
5016 component = new ArticleSubHeader { Title = "My sub header" },
5017 CodeExample = "new ArticleSubHeader { Title = \"My sub header\" },"
5018 });
5019 ArticleComponentsList.Add(new DocItem
5020 {
5021 component = new ArticleText { Text = "Normal body text..." },
5022 CodeExample = "new ArticleText { Text = \"Normal body text...\" }"
5023 });
5024 ArticleComponentsList.Add(new DocItem
5025 {
5026 component = new ArticleMenu { Items = new List<ArticleMenuItem>() { new ArticleMenuItem { Title = "Menu item" } } },
5027 CodeExample = "new ArticleMenu { Items = new List<ArticleMenuItem>() { new ArticleMenuItem { Title = \"Menu item\" } } }"
5028 });
5029 ArticleComponentsList.Add(new DocItem
5030 {
5031 component = new ArticleMenuItem { Title = "Menu item" },
5032 CodeExample = "new ArticleMenuItem { Title = \"Menu item\" }"
5033 });
5034 ArticleComponentsList.Add(new DocItem
5035 {
5036 component = new ArticleBodyRow { TextLayout = "left", TopLayout = "center" },
5037 CodeExample = "new ArticleBodyRow { TextLayout = \"left\", TopLayout = \"center\" }"
5038 });
5039 ArticleComponentsList.Add(new DocItem
5040 {
5041 component = new ArticleLink { Title = Translate("More"), OnClick = "#", ButtonLayout = ButtonLayout.Primary },
5042 CodeExample = "new ArticleLink { Title = Translate(\"More\"), OnClick = \"#\", ButtonLayout = ButtonLayout.Primary }"
5043 });
5044 ArticleComponentsList.Add(new DocItem
5045 {
5046 component = new ArticleSummary { Text = Translate("This is a summary") },
5047 CodeExample = "new ArticleSummary { Text = Translate(\"This is a summary\") }"
5048 });
5049 ArticleComponentsList.Add(new DocItem
5050 {
5051 component = new ArticleAuthorAndDate { Author = "Me", Date = "27-03-1984" },
5052 CodeExample = "new ArticleAuthorAndDate { Author = \"Me\", Date = \"27-03-1984\" }"
5053 });
5054 ArticleComponentsList.Add(new DocItem
5055 {
5056 component = new ArticleListSearch { },
5057 CodeExample = "new ArticleListSearch { }"
5058 });
5059 ArticleComponentsList.Add(new DocItem
5060 {
5061 component = new ArticleListFilter { Label = Translate("Filter") },
5062 CodeExample = "new ArticleListFilter { Label = Translate(\"Filter\") }"
5063 });
5064
5065 GeneralComponentsList = GeneralComponentsList.OrderBy(x => x.component.HelperName).ToList();
5066 ArticleComponentsList = ArticleComponentsList.OrderBy(x => x.component.HelperName).ToList();
5067 EcommerceComponentsList = EcommerceComponentsList.OrderBy(x => x.component.HelperName).ToList();
5068
5069 int itemCount = 0;
5070
5071 ArticleMenu generalMenu = new ArticleMenu();
5072 generalMenu.Title = Translate("General components");
5073 foreach (DocItem docItem in GeneralComponentsList)
5074 {
5075 ArticleMenuItem item = new ArticleMenuItem();
5076 item.Title = String.IsNullOrEmpty(docItem.Name) ? docItem.component.HelperName.Replace("Render", "") : docItem.Name;
5077 item.OnClick = "event.preventDefault(); document.getElementById('Block__Component" + (itemCount + 10) + "').scrollIntoView();";
5078 generalMenu.Items.Add(item);
5079
5080 itemCount++;
5081 }
5082
5083 ArticleMenu ecommerceMenu = new ArticleMenu();
5084 ecommerceMenu.Title = Translate("Ecommerce components");
5085 foreach (DocItem docItem in EcommerceComponentsList)
5086 {
5087 ArticleMenuItem item = new ArticleMenuItem();
5088 item.Title = String.IsNullOrEmpty(docItem.Name) ? docItem.component.HelperName.Replace("Render", "") : docItem.Name;
5089 item.OnClick = "event.preventDefault(); document.getElementById('Block__Component" + (itemCount + 10) + "').scrollIntoView();";
5090 ecommerceMenu.Items.Add(item);
5091
5092 itemCount++;
5093 }
5094
5095 ArticleMenu articleMenu = new ArticleMenu();
5096 articleMenu.Title = Translate("Article components");
5097 foreach (DocItem docItem in ArticleComponentsList)
5098 {
5099 ArticleMenuItem item = new ArticleMenuItem();
5100 item.Title = String.IsNullOrEmpty(docItem.Name) ? docItem.component.HelperName.Replace("Render", "") : docItem.Name;
5101 item.OnClick = "event.preventDefault(); document.getElementById('Block__Component" + (itemCount + 10) + "').scrollIntoView();";
5102 articleMenu.Items.Add(item);
5103
5104 itemCount++;
5105 }
5106 }
5107
5108 @{
5109 Block site = new Block
5110 {
5111 Id = "SiteContainer",
5112 SortId = 10,
5113 Design = new Design
5114 {
5115 RenderType = RenderType.Row
5116 },
5117 BlocksList = new List<Block> {
5118 new Block {
5119 Id = "EmptyColumn",
5120 SortId = 30,
5121 Design = new Design
5122 {
5123 RenderType = RenderType.Column,
5124 Size = "3"
5125 }
5126 },
5127 new Block {
5128 Id = "Main",
5129 SortId = 40,
5130 Design = new Design
5131 {
5132 RenderType = RenderType.Column,
5133 Size = "9"
5134 },
5135 BlocksList = new List<Block> {
5136 new Block {
5137 Id = "MainRow",
5138 SortId = 20,
5139 Design = new Design
5140 {
5141 RenderType = RenderType.Row
5142 }
5143 }
5144 }
5145 }
5146 }
5147 };
5148 componentsDocPage.Add(site);
5149
5150 if (Pageview.Device.ToString() != "Mobile")
5151 {
5152 Block navigationBlock = new Block
5153 {
5154 Id = "Navigation",
5155 SortId = 10,
5156 Design = new Design
5157 {
5158 CssClass = "fixed-doc-navigation"
5159 },
5160 BlocksList = new List<Block> {
5161 new Block {
5162 Id = "Search",
5163 SortId = 10,
5164 Component = new TextField { Placeholder = Translate("Search"), CssClass = "u-margin", OnKeyUp = "FilterComponents(event);" },
5165 Design = new Design {
5166 CssClass = "fixed-doc-navigation-search"
5167 }
5168 },
5169 new Block {
5170 Id = "NavigationContainer",
5171 SortId = 20,
5172 Design = new Design {
5173 CssClass = "fixed-doc-navigation-container"
5174 },
5175 BlocksList = new List<Block> {
5176 new Block {
5177 Id = "GeneralComponents",
5178 SortId = 20,
5179 Component = generalMenu
5180 },
5181 new Block {
5182 Id = "EcommerceComponents",
5183 SortId = 30,
5184 Component = ecommerceMenu
5185 },
5186 new Block {
5187 Id = "GeneralComponents",
5188 SortId = 40,
5189 Component = articleMenu
5190 }
5191 }
5192 }
5193 }
5194 };
5195 componentsDocPage.Add("Main", navigationBlock);
5196 }
5197
5198 Block pageHeader = new Block
5199 {
5200 Id = "PageHeader",
5201 SortId = 0,
5202 Component = new Heading { Level = 1, Title = Translate("Components documentation") },
5203 Design = new Design
5204 {
5205 RenderType = RenderType.Column,
5206 Size = "12"
5207 }
5208 };
5209 componentsDocPage.Add("MainRow", pageHeader);
5210
5211 Block pageInfo = new Block
5212 {
5213 Id = "PageInfo",
5214 SortId = 1,
5215 Template = RenderPageInfo(),
5216 Design = new Design
5217 {
5218 RenderType = RenderType.Column,
5219 Size = "12",
5220 }
5221 };
5222 componentsDocPage.Add("MainRow", pageInfo);
5223
5224 Block pageToTop = new Block
5225 {
5226 Id = "BackToTop",
5227 SortId = 5,
5228 Component = new Button { Id = "ScrollToTopBtn", OnClick = "window.scroll(0, 0);", Icon = new Icon { Prefix = "fas", Name = "fa-arrow-circle-up" }, CssClass = "doc-to-top-btn" }
5229 };
5230 componentsDocPage.Add("SiteContainer", pageToTop);
5231
5232 BuildComponents(GeneralComponentsList);
5233 BuildComponents(EcommerceComponentsList);
5234 BuildComponents(ArticleComponentsList);
5235 }
5236
5237 @functions {
5238 public void BuildComponents(List<DocItem> componentsList)
5239 {
5240 foreach (DocItem docItem in componentsList)
5241 {
5242 Block componentNameBlock = new Block
5243 {
5244 Id = "Component" + count,
5245 SortId = 10 * count,
5246 Component = new ArticleSubHeader { Title = "Helper method: " + docItem.component.HelperName },
5247 Design = new Design
5248 {
5249 RenderType = RenderType.Column,
5250 Size = "12",
5251 CssClass = "u-border"
5252 }
5253 };
5254 componentsDocPage.Add("MainRow", componentNameBlock);
5255
5256 Block componentBlock = new Block
5257 {
5258 Id = "ComponentContainer" + count,
5259 SortId = (10 * count) + 1,
5260 Design = new Design
5261 {
5262 RenderType = RenderType.Column,
5263 Size = "12",
5264 CssClass = "u-border"
5265 },
5266 BlocksList = new List<Block> {
5267 new Block {
5268 Id = "Component" + count,
5269 SortId = 10,
5270 Component = docItem.component,
5271 Design = new Design { CssClass= "grid__cell" }
5272 }
5273 }
5274 };
5275 componentsDocPage.Add("MainRow", componentBlock);
5276
5277 Block componentInfoBlock = new Block
5278 {
5279 Id = "ComponentInfo" + count,
5280 SortId = (10 * count) + 2,
5281 Component = new ComponentInfo { Content = docItem.component },
5282 Design = new Design
5283 {
5284 RenderType = RenderType.Column,
5285 Size = "4",
5286 CssClass = "js-component-info"
5287 }
5288 };
5289 componentsDocPage.Add("MainRow", componentInfoBlock);
5290
5291 if (docItem.component.HelperName != "RenderTextareaField")
5292 {
5293 Block componentCodeBlock = new Block
5294 {
5295 Id = "ComponentCode" + count,
5296 SortId = (10 * count) + 3,
5297 Component = new ComponentCode { Content = docItem },
5298 Design = new Design
5299 {
5300 RenderType = RenderType.Column,
5301 Size = "8"
5302 }
5303 };
5304 componentsDocPage.Add("MainRow", componentCodeBlock);
5305 }
5306 else
5307 {
5308 Block componentCodeBlock = new Block
5309 {
5310 Id = "ComponentCode" + count,
5311 SortId = (10 * count) + 3,
5312 Component = new NotificationMessage { Message = Translate("Code preview is not available for this component") },
5313 Design = new Design
5314 {
5315 RenderType = RenderType.Column,
5316 Size = "8"
5317 }
5318 };
5319 componentsDocPage.Add("MainRow", componentCodeBlock);
5320 }
5321
5322 Block componentSpacingBlock = new Block
5323 {
5324 Id = "ComponentSpacing" + count,
5325 SortId = (10 * count) + 4,
5326 Design = new Design
5327 {
5328 RenderType = RenderType.Column,
5329 Size = "12",
5330 CssClass = "u-padding-bottom--lg"
5331 }
5332 };
5333 componentsDocPage.Add("MainRow", componentSpacingBlock);
5334
5335 count++;
5336 }
5337 }
5338 }
5339
5340 <link rel="stylesheet" href="/Files/Templates/Designs/Rapido/css/codemirror/codemirror.css">
5341 <link rel="stylesheet" href="/Files/Templates/Designs/Rapido/css/codemirror/cobalt.css">
5342 <script src="/Files/Templates/Designs/Rapido/js/codemirror/codemirror.js"></script>
5343 <script src="/Files/Templates/Designs/Rapido/js/codemirror/xml.js"></script>
5344 <script src="/Files/Templates/Designs/Rapido/js/codemirror/clike.js"></script>
5345 <script src="/Files/Templates/Designs/Rapido/js/codemirror/coffeescript.js"></script>
5346
5347 <script>
5348 FilterComponents = function (e) {
5349 var currentFilter = e.currentTarget;
5350 var searchString = currentFilter.value.toLowerCase();
5351 var menuItems = document.querySelectorAll('.menu-left__link');
5352
5353 menuItems.forEach(function (menuItem) {
5354 menuItem.parentNode.classList.add("u-hidden");
5355 });
5356
5357 menuItems.forEach(function (menuItem) {
5358 var filterValue = menuItem.innerHTML.toLowerCase();
5359
5360 console.log(searchString);
5361 console.log(filterValue);
5362
5363 if (filterValue.indexOf(searchString) != -1) {
5364 menuItem.parentNode.classList.remove("u-hidden");
5365 }
5366 });
5367 }
5368 </script>
5369
5370 @helper RenderPageInfo()
5371 {
5372 <p>
5373 @Translate("This page contains an overview + examples on all available components on the current solution.")
5374 @Translate("The code for the components are found in /Templates/Designs/Rapido/Components.")
5375 </p>
5376
5377 @Render(new Link { Title = Translate("How to overwrite existing components"), Href = "https://doc.dynamicweb.com/rapido/development/blocks/example-8-components#sideNavTitle1-4", ButtonLayout = ButtonLayout.Link, CssClass = "u-ta-left u-no-padding", Icon = new Icon { Prefix = "fas", Name = "fa-link", LabelPosition = IconLabelPosition.After }, Target = LinkTargetType.Blank })
5378 @Render(new Link { Title = Translate("How to write your own components"), Href = "https://doc.dynamicweb.com/rapido/development/blocks/example-8-components#sideNavTitle1-5", ButtonLayout = ButtonLayout.Link, CssClass = "u-ta-left u-no-padding", Icon = new Icon { Prefix = "fas", Name = "fa-link", LabelPosition = IconLabelPosition.After }, Target = LinkTargetType.Blank })
5379 @Render(new Link { Title = Translate("The detailed Components documentation"), Href = "https://doc.dynamicweb.com/rapido/development/blocks/example-8-components", ButtonLayout = ButtonLayout.Link, CssClass = "u-ta-left u-no-padding", Icon = new Icon { Prefix = "fas", Name = "fa-link", LabelPosition = IconLabelPosition.After }, Target = LinkTargetType.Blank })
5380 @Render(new Link { Title = Translate("The detailed Blocks documentation"), Href = "https://doc.dynamicweb.com/rapido/development/blocks/introduction-quickstart", ButtonLayout = ButtonLayout.Link, CssClass = "u-ta-left u-no-padding", Icon = new Icon { Prefix = "fas", Name = "fa-link", LabelPosition = IconLabelPosition.After }, Target = LinkTargetType.Blank })
5381
5382 <br />
5383 <br />
5384 }
5385
5386 @* The @RenderBlockList base helper is included in Components/GridBuilder.cshtml *@
5387 @RenderBlockList(componentsDocPage.BlocksRoot.BlocksList)
5388
5389
5390 <script>
5391 document.addEventListener("DOMContentLoaded", function (event) {
5392 if (QueryArray.getParameterFromCurrentURL("scrollToId")) {
5393 document.getElementById(QueryArray.getParameterFromCurrentURL("scrollToId")).scrollIntoView();
5394 window.scrollBy(0, -200);
5395 }
5396 });
5397
5398 CopyCode = function (targetArea) {
5399 targetArea.style.display = "block";
5400 targetArea.innerHTML = targetArea.innerHTML.replace("-newline", "");
5401 targetArea.select();
5402 document.execCommand('copy');
5403 targetArea.style.display = "none";
5404 }
5405
5406 document.addEventListener("scroll", function () {
5407 var scrollPos = document.documentElement.scrollTop || document.body.scrollTop;
5408
5409 if (scrollPos > 500) {
5410 document.getElementById("ScrollToTopBtn").style.display = "block";
5411 } else {
5412 document.getElementById("ScrollToTopBtn").style.display = "none";
5413 }
5414 });
5415 </script>
5416
5417
5418
5419 @SnippetEnd("Content")
5420
5421 </html>
5422