1 | 1 |
new file mode 100644 |
... | ... |
@@ -0,0 +1,220 @@ |
1 |
+<?php |
|
2 |
+if (TL_MODE == 'FE') { |
|
3 |
+ $GLOBALS['TL_CSS'][] = 'files/base/layout/css/elements/custom-elements/ce_rsce_headimagelogo.min.css|static'; |
|
4 |
+} |
|
5 |
+?> |
|
6 |
+ |
|
7 |
+<div <?php echo $this->cssID; ?> |
|
8 |
+ class="content--element <?php echo $this->class; ?> <?php if ($this->pull_content) : ?>pull-content<?php endif; ?>"> |
|
9 |
+ <div class="ce--inner <?php if ($this->boxed_image) : ?>with-boxed-logo<?php endif; ?>"> |
|
10 |
+ |
|
11 |
+ <?php if ($this->headline || $this->subline || $this->topline) : ?> |
|
12 |
+ <div class="ce--headline" |
|
13 |
+ data-aos="<?php if ($this->animation_type) : ?><?php echo $this->animation_type; ?><?php else : ?>animate__fadeInUp<?php endif; ?>"> |
|
14 |
+ <div class="container"> |
|
15 |
+ <?php if ($this->topline) : ?> |
|
16 |
+ <span class="ce--topline"><?php echo $this->topline; ?></span> |
|
17 |
+ <?php endif; ?> |
|
18 |
+ <?php if ($this->headline) : ?> |
|
19 |
+ <<?php echo($this->hl); ?>> |
|
20 |
+ <?php echo($this->headline); ?> |
|
21 |
+ </<?php echo($this->hl); ?>> |
|
22 |
+ <?php endif; ?> |
|
23 |
+ <?php if ($this->subline) : ?> |
|
24 |
+ <span class="ce--subline"><?php echo $this->subline; ?></span> |
|
25 |
+ <?php endif; ?> |
|
26 |
+ </div> |
|
27 |
+ </div> |
|
28 |
+ <?php endif; ?> |
|
29 |
+ |
|
30 |
+ <div class="<?php if (count($this->slides) > 1) : ?>swiper<?php endif; ?> mainslider mainslider_<?php echo $this->id; ?> <?php if ($this->image_height) : ?>not-fullHeight<?php endif; ?> <?php if ($this->diagonal_cut) : ?>with-diagonalCut<?php endif; ?>"> |
|
31 |
+ <!-- Additional required wrapper --> |
|
32 |
+ <div class="swiper-wrapper"> |
|
33 |
+ <!-- Slides --> |
|
34 |
+ |
|
35 |
+ <?php foreach ($this->slides as $key => $slide) : ?> |
|
36 |
+ |
|
37 |
+ <?php |
|
38 |
+ if (!property_exists($slide, "size")) { |
|
39 |
+ $slide->{"size"} = ""; |
|
40 |
+ } |
|
41 |
+ ?> |
|
42 |
+ |
|
43 |
+ |
|
44 |
+ <?php |
|
45 |
+ $filename = FilesModel::findByUuid($slide->image)->path; |
|
46 |
+ $ext = pathinfo($filename, PATHINFO_EXTENSION); |
|
47 |
+ $filename_mobile = FilesModel::findByUuid($slide->mobile_image)->path; |
|
48 |
+ $ext_mobile = pathinfo($filename_mobile, PATHINFO_EXTENSION); |
|
49 |
+ ?> |
|
50 |
+ |
|
51 |
+ <div class="swiper-slide"> |
|
52 |
+ <div class="ce--mainimage slide_<?php echo $key; ?> <?php echo $slide->text_style; ?> <?php if (!$slide->text_firstline && !$slide->text_secondline) : ?>no-text<?php endif; ?> "> |
|
53 |
+ <div class="image--holder <?php if ($this->image_maxheight) : ?>with-maxheight<?php endif; ?> <?php if ($ext == "mp4") : ?>with-video<?php endif; ?>" |
|
54 |
+ style="background: url(<?= Image::get(FilesModel::findByUuid($slide->image)->path, $slide->size[0], $slide->size[1], $slide->size[2]); ?>) center center no-repeat; <?php if ($this->image_maxheight) : ?>max-height: <?php echo $this->image_maxheight; ?> !important;<?php endif; ?> <?php if ($this->image_height) : ?>height: <?php echo $this->image_height; ?>vh; min-height: 250px;<?php endif; ?>"> |
|
55 |
+ |
|
56 |
+ <?php if ($slide->alternate_background_color): ?> |
|
57 |
+ <style> |
|
58 |
+ <?php |
|
59 |
+ $color = $slide->alternate_background_color; |
|
60 |
+ $color = str_replace(")", ")",$color); |
|
61 |
+ $color = str_replace("(", "(",$color); |
|
62 |
+ $color = str_replace("(;", "(",$color); |
|
63 |
+ $color = str_replace("#", "#",$color); |
|
64 |
+ $color = str_replace(");", ")",$color); |
|
65 |
+ ?> |
|
66 |
+ |
|
67 |
+ html body .ce_rsce_headimagelogo .mainslider_<?php echo $this->id;?> .slide_<?php echo $key;?>.style-2 .mainimage--content .mainimage--content-inner:before, |
|
68 |
+ html body .ce_rsce_headimagelogo .mainslider_<?php echo $this->id;?> .slide_<?php echo $key;?>.style-2 .mainimage--content .mainimage--content-inner .mainimage--content-inner--wrapper:after { |
|
69 |
+ background-color: <?= $color; ?> !important; |
|
70 |
+ } |
|
71 |
+ |
|
72 |
+ html body .ce_rsce_headimagelogo .mainslider_<?php echo $this->id;?> .slide_<?php echo $key;?>.style-1 .mainimage--content .mainimage--content-inner { |
|
73 |
+ background-color: <?= $color; ?> !important; |
|
74 |
+ padding: 20px; |
|
75 |
+ box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15); |
|
76 |
+ } |
|
77 |
+ |
|
78 |
+ </style> |
|
79 |
+ <?php endif; ?> |
|
80 |
+ |
|
81 |
+ <?php if ($ext == "mp4") : ?> |
|
82 |
+ <video style="<?php if ($this->image_maxheight) : ?>min-height: <?php echo $this->image_maxheight; ?>; min-width: 0px;<?php endif; ?>" |
|
83 |
+ <?php if ($ext_mobile == "mp4" && $ext_mobile) : ?>class=" d-none d-md-block" <?php endif; ?> |
|
84 |
+ autoplay muted loop playsinline data-src="{{file::<?= $slide->image ?>}}"> |
|
85 |
+ <source type="video/mp4" src="{{file::<?= $slide->image ?>}}"> |
|
86 |
+ </video> |
|
87 |
+ <?php endif; ?> |
|
88 |
+ <?php if ($ext_mobile == "mp4" && $ext_mobile) : ?> |
|
89 |
+ <video style="<?php if ($this->image_maxheight) : ?>min-height: <?php echo $this->image_maxheight; ?>; min-width: 0px;" |
|
90 |
+ <?php endif; ?>class="d-md-none" src="{{file::<?= $slide->mobile_image ?>}}" |
|
91 |
+ autoplay muted loop |
|
92 |
+ playsinline> |
|
93 |
+ <source type="video/mp4" src="{{file::<?= $slide->mobile_image ?>}}"> |
|
94 |
+ </video> |
|
95 |
+ <?php endif; ?> |
|
96 |
+ |
|
97 |
+ |
|
98 |
+ <?php if ($slide->text_firstline || $slide->text_secondline || count($slide->buttons) >= 1) : ?> |
|
99 |
+ <div data-aos="<?php if ($slide->animation_type) : ?><?php echo $slide->animation_type; ?><?php else : ?>animate__fadeInUp<?php endif; ?>" |
|
100 |
+ class="mainimage--content" |
|
101 |
+ <?php if ($slide->image_height < 50 && $slide->image_height != "") : ?>style="top: 140px;" <?php endif; ?>> |
|
102 |
+ |
|
103 |
+ |
|
104 |
+ <div class="container"> |
|
105 |
+ |
|
106 |
+ |
|
107 |
+ <div class="mainimage--content-inner <?php echo $slide->textbox_position; ?> <?php echo $slide->text_align; ?>" |
|
108 |
+ style="<?php if ($slide->text_color) : ?>color: <?php echo $slide->text_color; ?>;<?php endif; ?> <?php if ($slide->maxWidth) : ?>max-width: <?php echo $slide->maxWidth; ?>;<?php endif; ?>"> |
|
109 |
+ |
|
110 |
+ <div class="mainimage--content-inner--wrapper"> |
|
111 |
+ <?php if ($slide->firstline_headline) : ?> |
|
112 |
+ <h1 style="<?php if ($slide->text_color) : ?>color: <?php echo $slide->text_color; ?>;<?php endif; ?>" |
|
113 |
+ class="first-line mb-0 <?php if ($slide->dynamic_fontsize): ?>dynamic-fontsize<?php endif; ?>"><?php echo $slide->text_firstline; ?></h1> |
|
114 |
+ <?php else : ?> |
|
115 |
+ <span style="<?php if ($slide->text_color) : ?>color: <?php echo $slide->text_color; ?>;<?php endif; ?>" |
|
116 |
+ class="first-line mb-0 <?php if ($slide->dynamic_fontsize): ?>dynamic-fontsize<?php endif; ?>"><?php echo $slide->text_firstline; ?></span> |
|
117 |
+ <?php endif; ?> |
|
118 |
+ <?php if ($slide->text_secondline) : ?> |
|
119 |
+ <span class="second-line <?php if ($slide->dynamic_fontsize): ?>dynamic-fontsize-sm<?php endif; ?>"><?php echo $slide->text_secondline; ?></span> |
|
120 |
+ <?php endif; ?> |
|
121 |
+ <?php if ($slide->text_infotext) : ?> |
|
122 |
+ <div class="infotext--text"> |
|
123 |
+ <?php echo $slide->text_infotext; ?> |
|
124 |
+ </div> |
|
125 |
+ <?php endif; ?> |
|
126 |
+ |
|
127 |
+ <?php if (count($slide->buttons) >= 1) : ?> |
|
128 |
+ <div class="button--wrapper"> |
|
129 |
+ <?php foreach ($slide->buttons as $button) : ?> |
|
130 |
+ <a data-aos="<?php if ($button->animation_type) : ?><?php echo $button->animation_type; ?><?php else : ?>animate__fadeInUp<?php endif; ?>" |
|
131 |
+ class="d-inline-block btn <?php if ($button->link_size) : ?><?php echo $button->link_size; ?><?php endif; ?> <?php echo $button->link_type; ?>" |
|
132 |
+ href="<?php echo $button->link_url; ?><?php if ($button->link_betreff) : ?>?subject=<?php echo $button->link_betreff; ?><?php endif; ?>"><?php echo $button->link_text; ?></a> |
|
133 |
+ <?php endforeach ?> |
|
134 |
+ </div> |
|
135 |
+ <?php endif; ?> |
|
136 |
+ </div> |
|
137 |
+ </div> |
|
138 |
+ |
|
139 |
+ </div> |
|
140 |
+ |
|
141 |
+ </div> |
|
142 |
+ <?php endif; ?> |
|
143 |
+ </div> |
|
144 |
+ </div> |
|
145 |
+ </div> |
|
146 |
+ <?php endforeach ?> |
|
147 |
+ </div> |
|
148 |
+ <?php if (count($this->slides) > 1) : ?><?php if (!$this->boxed_image) : ?> |
|
149 |
+ <div class="swiper-pagination"></div> |
|
150 |
+ <?php endif; ?> |
|
151 |
+ <div class="swiper-button-prev"></div> |
|
152 |
+ <div class="swiper-button-next"></div> |
|
153 |
+ <?php endif; ?> |
|
154 |
+ </div> |
|
155 |
+ |
|
156 |
+ <?php if ($this->boxed_image) : ?> |
|
157 |
+ <div class="boxed-logo"> |
|
158 |
+ <img data-aos="<?php if ($this->boxed_image_animation_type) : ?><?php echo $this->boxed_image_animation_type; ?><?php else : ?>animate__fadeInUp<?php endif; ?>" |
|
159 |
+ src="<?= Image::get(FilesModel::findByUuid($this->boxed_image)->path, null, null, null); ?>"> |
|
160 |
+ </div> |
|
161 |
+ <?php endif; ?> |
|
162 |
+</div> |
|
163 |
+ |
|
164 |
+<?php if (TL_MODE == 'FE'): ?> |
|
165 |
+ <script> |
|
166 |
+ window.addEventListener('load', function () { |
|
167 |
+ if ($('.swiper.mainslider_<?php echo $this->id; ?>').length) { |
|
168 |
+ const swiper_<?php echo $this->id; ?> = new Swiper('.swiper.mainslider_<?php echo $this->id; ?>', { |
|
169 |
+ |
|
170 |
+ loop: true, |
|
171 |
+ |
|
172 |
+ speed: <?php if ($this->transition_time) : ?><?= $this->transition_time; ?><?php else:?>1500<?php endif;?>, |
|
173 |
+ effect: <?php if ($this->slide_effect) : ?>'<?= $this->slide_effect; ?>'<?php else:?> |
|
174 |
+ 'slide'<?php endif;?>, |
|
175 |
+ |
|
176 |
+ <?php if ($this->autoplay) : ?> |
|
177 |
+ autoplay: { |
|
178 |
+ delay: <?php if ($this->autoplay_time) : ?><?= $this->autoplay_time; ?><?php else:?>3000<?php endif;?>, |
|
179 |
+ }, |
|
180 |
+ <?php endif; ?> |
|
181 |
+ |
|
182 |
+ <?php if (count($this->slides) > 1) : ?> |
|
183 |
+ navigation: { |
|
184 |
+ nextEl: '.swiper.mainslider_<?php echo $this->id; ?> .swiper-button-next', |
|
185 |
+ prevEl: '.swiper.mainslider_<?php echo $this->id; ?> .swiper-button-prev', |
|
186 |
+ }, |
|
187 |
+ <?php if (!$this->boxed_image) : ?> |
|
188 |
+ pagination: { |
|
189 |
+ el: '.swiper.mainslider_<?php echo $this->id; ?> .swiper-pagination', |
|
190 |
+ clickable: true, |
|
191 |
+ }, |
|
192 |
+ <?php endif; ?> |
|
193 |
+ <?php endif; ?> |
|
194 |
+ |
|
195 |
+ |
|
196 |
+ on: { |
|
197 |
+ realIndexChange: function () { |
|
198 |
+ $('.mainslider_<?php echo $this->id; ?> .swiper-slide .ce--mainimage *[data-aos]').removeClass('aos-init').removeClass('aos-animate'); |
|
199 |
+ $('.mainslider_<?php echo $this->id; ?> .swiper-slide:not(.swiper-slide-active) .ce--mainimage .mainimage--content').hide(); |
|
200 |
+ |
|
201 |
+ setTimeout(function () { |
|
202 |
+ $('.mainslider_<?php echo $this->id; ?> .swiper-slide .ce--mainimage .mainimage--content').show(); |
|
203 |
+ }, 500); |
|
204 |
+ }, |
|
205 |
+ } |
|
206 |
+ }); |
|
207 |
+ } |
|
208 |
+ }, {passive: true}) |
|
209 |
+ </script> |
|
210 |
+<?php endif; ?> |
|
211 |
+<?php if ($this->show_breadcrumb) : ?> |
|
212 |
+ <div class="container mt-3 mb-5"> |
|
213 |
+ {{insert_module::48}} |
|
214 |
+ </div> |
|
215 |
+<?php endif; ?> |
|
216 |
+ |
|
217 |
+</div> |
|
218 |
+ |
|
219 |
+ |
|
220 |
+ |