1 @using Dynamicweb.Rendering
2 @using Dynamicweb.Frontend
3 @inherits ViewModelTemplate<ParagraphViewModel>
4
5 @functions {
6 string GetPaddingClass(int padding, bool responsive = false, bool horizontal = false) {
7 if (padding == 0) {
8 return "";
9 }
10 string alignment = horizontal ? "x" : "y";
11 if (responsive && padding - 4 > 0) {
12 return "p" + alignment + "-xl-" + padding + " p" + alignment + "-lg-" + (padding - 1) + " p" + alignment + "-md-" + (padding - 2) + " p" + alignment + "-sm-" + (padding - 3) + " p" + alignment + "-" + (padding - 3);
13 } else {
14 return "p" + alignment + "-" + padding;
15 }
16 }
17 }
18
19 @{
20 string paragrahID = "paragraph-" + Model.ID;
21 string ribbonBackgroundImage = "";
22 if (Model.Item.GetFile("BackgroundImage") != null) {
23 ribbonBackgroundImage = Model.Item.GetFile("BackgroundImage").PathUrlEncoded;
24 }
25
26 string ribbonBackgroundColor = Model.Item.GetString("BackgroundColor");
27 string ribbonTextColor = Model.Item.GetString("TextColor");
28 string ribbonStyle = "\" style=\"";
29 if (ribbonBackgroundColor != "#FFFFFF") {
30 ribbonStyle += "background-color:" + ribbonBackgroundColor + ";";
31 }
32 string ribbonPadding = string.Empty;
33 if (Model.Item.GetItem("PaddingY") != null && Model.Item.GetItem("PaddingY").GetList("PaddingY") != null) {
34 ribbonPadding = GetPaddingClass(int.Parse(Model.Item.GetItem("PaddingY").GetList("PaddingY").SelectedValue), true);
35 }
36
37
38
39 if (!string.IsNullOrWhiteSpace(ribbonTextColor) && ribbonTextColor != "#006086") {
40 ribbonStyle += "color:" + ribbonTextColor + ";";
41 <style>
42 #@(paragrahID) hr{
43 border-top-color:@ribbonTextColor;
44 opacity:0.4;
45 }
46 </style>
47 }
48 //placing styles and such 'inside' class to awoid razor parser error from empty attributes
49 string ribbonClasses = "ribbon";
50 if (!string.IsNullOrWhiteSpace(ribbonPadding)) {
51 ribbonClasses += " " + ribbonPadding;
52 }
53 string contentRowClass = "row";
54 if (!string.IsNullOrWhiteSpace(Model.Item.GetList("ContentPosition").SelectedValue)) {
55 contentRowClass += " " + Model.Item.GetList("ContentPosition").SelectedValue;
56 }
57
58 var imageZoom = Model.Item.GetBoolean("ImageZoom");
59 }
60 @helper renderATagEnd() {
61 //For at løse probelemet med at </a> tagget hopper ned på næste linje når man VS laver oprydning.
62 @:</a>
63 }
64 @if (Model.Item.GetBoolean("ImageZoom")) {
65 string ribbonImage = "";
66
67 if (!string.IsNullOrWhiteSpace(ribbonBackgroundImage)) {
68 if (ribbonBackgroundImage.EndsWith(".svg")) {
69 ribbonImage += "/Admin/Public/GetImage.ashx?Image=" + ribbonBackgroundImage;
70 } else {
71 ribbonImage += "/Admin/Public/GetImage.ashx?Image=" + ribbonBackgroundImage + "&width=1920&Compression=70";
72 }
73
74 }
75
76 <div id="@paragrahID" class="ribbon-wrapper">
77 <picture>
78 <img class="ribbon-image" src="@ribbonImage" />
79 </picture>
80 <div class="@
[email protected]">
81 <div class="container">
82 <div class="row">
83 <div class="col-12">
84 <div class="@contentRowClass">
85 @if (Model.Item.GetItems("ContentList") != null && Model.Item.GetItems("ContentList").Any()) {
86 foreach (var i in Model.Item.GetItems("ContentList")) {
87 ItemViewModel content = i.GetItem("Content");
88 ItemViewModel width = i.GetItem("Width");
89 ItemViewModel background = i.GetItem("Background");
90 ItemViewModel image = content.GetItem("Image");
91
92 //Get From Area - or use #000000 as standard
93 string contentTextColor = "";
94 FileViewModel contentImage = image.GetFile("Image");
95 string contentImageAlt = image.GetString("ImageAlt");
96 string contentImageTitle = image.GetString("ImageTitle");
97 string contentHeadline = content.GetString("Headline");
98 string contentSubHeadline = content.GetString("SubHeadline");
99 string contentText = content.GetString("Text");
100 string contentLink = content.GetString("Link");
101 string contentShowLines = content.GetList("SpaceLines").SelectedValue;
102 string contentTextAlign = content.GetList("TextAlign").SelectedValue;
103
104 string contentStyle = "\"style=\"";
105 ListViewModel backgroundType = background.GetList("BackgroundType");
106 if (backgroundType.SelectedValue != "none") {
107 if (backgroundType.SelectedValue == "color") {
108 if (background.GetString("BackgroundOpacity") != "100") {
109 int parsedColor = int.Parse(background.GetString("BackgroundColor").Replace("#", string.Empty), System.Globalization.NumberStyles.AllowHexSpecifier);
110 var rgbColor = System.Drawing.Color.FromArgb(parsedColor);
111 contentStyle += String.Format("background-color:rgba({0}, {1}, {2}, {3})", rgbColor.R, rgbColor.G, rgbColor.B, "." + background.GetString("BackgroundOpacity")) + ";";
112 } else {
113 contentStyle += "background-color:" + background.GetString("BackgroundColor") + ";";
114 }
115 } else {
116 FileViewModel contentBackgroundImage = background.GetFile("Image");
117 if (contentBackgroundImage != null) {
118 //ToDo Decrease imageside based on content size
119 string contentBackGroundImagePath = "/Admin/Public/GetImage.ashx?width=1920&Compression=70&image=" + contentBackgroundImage.Path;
120 PushPromise(contentBackGroundImagePath);
121 contentStyle += "background-image:url('" + contentBackGroundImagePath + "');";
122 contentStyle += "background-size:100;background-position:center;";
123 }
124
125 }
126 contentStyle += "color:" + background.GetString("TextColor") + ";";
127 <style>
128 #@paragrahID .ribbon-content-text::before{
129 background:@background.GetString("TextColor");
130 }
131 </style>
132 }
133
134 string contentPadding = GetPaddingClass(int.Parse(i.GetItem("Content").GetItem("PaddingY").GetList("PaddingY").SelectedValue), true);
135 if (i.GetItem("Content").GetItem("PaddingX") != null) {
136 contentPadding += " " + GetPaddingClass(int.Parse(i.GetItem("Content").GetItem("PaddingX").GetList("PaddingY").SelectedValue), true, true);
137 }
138 string ribbonContentClass = "ribbon-content";
139 if (!string.IsNullOrWhiteSpace(contentPadding)) {
140 ribbonContentClass += " " + contentPadding;
141 }
142 if (!string.IsNullOrWhiteSpace(contentTextAlign)) {
143 ribbonContentClass += " " + contentTextAlign;
144 }
145 string contentID = paragrahID + "-" + i.Id;
146 string contentWidthClass = i.GetItem("Width").GetList("Width").SelectedValue + " " + i.GetItem("Width").GetList("WidthSM").SelectedValue + " " + i.GetItem("Width").GetList("WidthMD").SelectedValue + " " + i.GetItem("Width").GetList("WidthLG").SelectedValue;
147 string wrappertypestart = !string.IsNullOrWhiteSpace(contentLink) && contentLink.Length > 3 ? "a href=\"" + contentLink + "\" style=\"display:block;\"" : "div";
148 string wrappertypeend = !string.IsNullOrWhiteSpace(contentLink) && contentLink.Length > 3 ? "a" : "div";
149 if (wrappertypeend == "a") {
150 @:<a href="@contentLink" class="@contentWidthClass">
151 } else {
152 @:<div class="@contentWidthClass">
153 }
154 <div id="@contentID" class="@
[email protected]">
155 @if (contentImage != null) {
156
157 if (contentImage.Extension == ".svg") {
158 string contentImagePath = System.IO.File.ReadAllText(Dynamicweb.Context.Current.Server.MapPath(contentImage.Path));
159 <div class="ribbon-content-svg pb-4 pb-md-5 pb-lg-6 mx-auto" style="width:50%;text-align:center;">
160 @contentImagePath
161 </div>
162 <style>
163 #@contentID svg .a{
164 fill: @background.GetString("TextColor");
165 }
166 </style>
167 if (contentImage.Name == "circles") {
168 <style>
169 #@contentID svg .b, #@contentID svg .c {
170 stroke: @background.GetString("TextColor");
171 }
172 </style>
173 }
174 } else {
175 //ToDo Decrease imageside based on image size
176 string contentImagepath = "/Admin/Public/GetImage.ashx?width=1920&Compression=70&image=" + contentImage.Path;
177 PushPromise(contentImagepath);
178 <img src="@contentImagepath" class="img-fluid" alt="@contentImageAlt" />
179 }
180
181 }
182 @if (contentShowLines == "content") {
183 <hr />
184 }
185
186 @if (!string.IsNullOrWhiteSpace(contentHeadline) && contentShowLines == "text") {
187 <hr />
188 }
189
190 @if (!string.IsNullOrWhiteSpace(contentText)) {
191 <div class="ribbon-content-text">@contentText</div>
192 }
193
194 @if (contentShowLines == "text" || contentShowLines == "content") {
195 <hr />
196 if (!string.IsNullOrWhiteSpace(contentTextColor)) {
197 <style>
198 #@(contentID) hr{
199 border-top-color:@contentTextColor;
200 opacity:0.4;
201 }
202 </style>
203 }
204 }
205 </div>
206 if (wrappertypeend == "a") {
207 @renderATagEnd()
208 } else {
209 @:</div>
210 }
211
212 }
213 }
214 </div>
215 </div>
216 </div>
217 </div>
218 </div>
219 </div>
220 <style>
221 #@paragrahID a{
222 color:@ribbonTextColor;
223
224 }
225 </style>
226
227 } else {
228 if (!string.IsNullOrWhiteSpace(ribbonBackgroundImage)) {
229 if (ribbonBackgroundImage.EndsWith(".svg")) {
230 ribbonStyle += "background-image:url('" + ribbonBackgroundImage + "');";
231 } else {
232 ribbonStyle += "background-image:url('/Admin/Public/GetImage.ashx?width=1920&Compression=70&image=" + ribbonBackgroundImage + "');";
233 }
234
235 }
236
237 <div id="@paragrahID" class="@
[email protected]">
238 <div class="container">
239 <div class="row">
240 <div class="col-12">
241 <div class="@contentRowClass">
242 @if (Model.Item.GetItems("ContentList") != null && Model.Item.GetItems("ContentList").Any()) {
243 foreach (var i in Model.Item.GetItems("ContentList")) {
244 ItemViewModel content = i.GetItem("Content");
245 ItemViewModel width = i.GetItem("Width");
246 ItemViewModel background = i.GetItem("Background");
247 ItemViewModel image = content.GetItem("Image");
248
249 //Get From Area - or use #000000 as standard
250 string contentTextColor = "";
251 FileViewModel contentImage = image.GetFile("Image");
252 string contentImageAlt = image.GetString("ImageAlt");
253 string contentImageTitle = image.GetString("ImageTitle");
254 string contentHeadline = content.GetString("Headline");
255 string contentSubHeadline = content.GetString("SubHeadline");
256 string contentText = content.GetString("Text");
257 string contentLink = content.GetString("Link");
258 string contentShowLines = content.GetList("SpaceLines").SelectedValue;
259 string contentTextAlign = content.GetList("TextAlign").SelectedValue;
260
261 string contentStyle = "\"style=\"";
262 ListViewModel backgroundType = background.GetList("BackgroundType");
263 if (backgroundType.SelectedValue != "none") {
264 if (backgroundType.SelectedValue == "color") {
265 if (background.GetString("BackgroundOpacity") != "100") {
266 int parsedColor = int.Parse(background.GetString("BackgroundColor").Replace("#", string.Empty), System.Globalization.NumberStyles.AllowHexSpecifier);
267 var rgbColor = System.Drawing.Color.FromArgb(parsedColor);
268 contentStyle += String.Format("background-color:rgba({0}, {1}, {2}, {3})", rgbColor.R, rgbColor.G, rgbColor.B, "." + background.GetString("BackgroundOpacity")) + ";";
269 } else {
270 contentStyle += "background-color:" + background.GetString("BackgroundColor") + ";";
271 }
272 } else {
273 FileViewModel contentBackgroundImage = background.GetFile("Image");
274 if (contentBackgroundImage != null) {
275 //ToDo Decrease imageside based on content size
276 string contentBackGroundImagePath = "/Admin/Public/GetImage.ashx?width=1920&Compression=70&image=" + contentBackgroundImage.Path;
277 PushPromise(contentBackGroundImagePath);
278 contentStyle += "background-image:url('" + contentBackGroundImagePath + "');";
279 contentStyle += "background-size:100;background-position:center;";
280 }
281
282 }
283 contentStyle += "color:" + background.GetString("TextColor") + ";";
284 <style>
285 #@paragrahID .ribbon-content-text::before{
286 background:@background.GetString("TextColor");
287 }
288 </style>
289 }
290
291 string contentPadding = GetPaddingClass(int.Parse(i.GetItem("Content").GetItem("PaddingY").GetList("PaddingY").SelectedValue), true);
292 if (i.GetItem("Content").GetItem("PaddingX") != null) {
293 contentPadding += " " + GetPaddingClass(int.Parse(i.GetItem("Content").GetItem("PaddingX").GetList("PaddingY").SelectedValue), true, true);
294 }
295 string ribbonContentClass = "ribbon-content";
296 if (!string.IsNullOrWhiteSpace(contentPadding)) {
297 ribbonContentClass += " " + contentPadding;
298 }
299 if (!string.IsNullOrWhiteSpace(contentTextAlign)) {
300 ribbonContentClass += " " + contentTextAlign;
301 }
302 string contentID = paragrahID + "-" + i.Id;
303 string contentWidthClass = i.GetItem("Width").GetList("Width").SelectedValue + " " + i.GetItem("Width").GetList("WidthSM").SelectedValue + " " + i.GetItem("Width").GetList("WidthMD").SelectedValue + " " + i.GetItem("Width").GetList("WidthLG").SelectedValue;
304 string wrappertypestart = !string.IsNullOrWhiteSpace(contentLink) && contentLink.Length > 3 ? "a href=\"" + contentLink + "\" style=\"display:block;\"" : "div";
305 string wrappertypeend = !string.IsNullOrWhiteSpace(contentLink) && contentLink.Length > 3 ? "a" : "div";
306 if (wrappertypeend == "a") {
307 @:<a href="@contentLink" class="@contentWidthClass">
308 } else {
309 @:<div class="@contentWidthClass">
310 }
311 <div id="@contentID" class="@
[email protected]">
312 @if (contentImage != null) {
313
314 if (contentImage.Extension == ".svg") {
315 string contentImagePath = System.IO.File.ReadAllText(Dynamicweb.Context.Current.Server.MapPath(contentImage.Path));
316 <div class="ribbon-content-svg pb-4 pb-md-5 pb-lg-6 mx-auto" style="width:50%;text-align:center;">
317 @contentImagePath
318 </div>
319 <style>
320 #@contentID svg .a{
321 fill: @background.GetString("TextColor");
322 }
323 </style>
324 if (contentImage.Name == "circles") {
325 <style>
326 #@contentID svg .b, #@contentID svg .c {
327 stroke: @background.GetString("TextColor");
328 }
329 </style>
330 }
331 } else {
332 //ToDo Decrease imageside based on image size
333 string contentImagepath = "/Admin/Public/GetImage.ashx?width=1920&Compression=70&image=" + contentImage.Path;
334 PushPromise(contentImagepath);
335 <img src="@contentImagepath" class="img-fluid" alt="@contentImageAlt" />
336 }
337
338 }
339 @if (contentShowLines == "content") {
340 <hr />
341 }
342
343 @if (!string.IsNullOrWhiteSpace(contentHeadline) && contentShowLines == "text") {
344 <hr />
345 }
346
347 @if (!string.IsNullOrWhiteSpace(contentText)) {
348 <div class="ribbon-content-text">@contentText</div>
349 }
350
351 @if (contentShowLines == "text" || contentShowLines == "content") {
352 <hr />
353 if (!string.IsNullOrWhiteSpace(contentTextColor)) {
354 <style>
355 #@(contentID) hr{
356 border-top-color:@contentTextColor;
357 opacity:0.4;
358 }
359 </style>
360 }
361 }
362 </div>
363 if (wrappertypeend == "a") {
364 @renderATagEnd()
365 } else {
366 @:</div>
367 }
368
369 }
370 }
371 </div>
372 </div>
373 </div>
374 </div>
375 </div>
376 }
377
378
379
