Version Description
- New Widget: Pop Up
- New Feature: Background slider
- Enhancement: Animation option added in Gmap marker icon
- Enhancement: More effects added in flipbox
Download this release
Release Info
Developer | webtechstreet |
Plugin | Elementor Addon Elements |
Version | 1.2 |
Comparing to | |
See all releases |
Code changes from version 1.1 to 1.2
- assets/css/eae.css +1193 -791
- assets/js/animated-main.js +134 -134
- assets/js/eae.js +520 -367
- assets/js/particles.js +1538 -1538
- assets/js/particles.min.js +8 -8
- assets/js/stickyanything.js +8 -8
- assets/lib/magnific.js +1861 -0
- assets/lib/vegas/overlays/00.png +0 -0
- assets/lib/vegas/overlays/01.png +0 -0
- assets/lib/vegas/overlays/02.png +0 -0
- assets/lib/vegas/overlays/03.png +0 -0
- assets/lib/vegas/overlays/04.png +0 -0
- assets/lib/vegas/overlays/05.png +0 -0
- assets/lib/vegas/overlays/06.png +0 -0
- assets/lib/vegas/overlays/07.png +0 -0
- assets/lib/vegas/overlays/08.png +0 -0
- assets/lib/vegas/overlays/09.png +0 -0
- assets/lib/vegas/vegas.css +629 -0
- assets/lib/vegas/vegas.js +747 -0
- assets/lib/vegas/vegas.min.css +2 -0
- assets/lib/vegas/vegas.min.css.map +1 -0
- assets/lib/vegas/vegas.min.js +2 -0
- assets/lib/vegas/vegas.min.js.map +1 -0
- elementor-addon-elements.php +117 -108
- elements/advance-tabs.php +742 -742
- elements/animated-text.php +394 -394
- elements/bg-slider.php +367 -0
- elements/control-test.php +110 -110
- elements/flip-box-set.php +1799 -1799
- elements/flipbox.php +852 -840
- elements/gmap.php +217 -203
- elements/image-compare.php +458 -458
- elements/modal-popup.php +860 -0
- elements/particles.php +227 -227
- elements/pinterest.php +549 -549
- elements/post-list.php +760 -760
- elements/pricetable.php +869 -869
- elements/screenshot-1.png +0 -0
- elements/shape-separator.php +83 -83
- elements/shape-separator/triangle-bottom-left.php +2 -2
- elements/shape-separator/triangle-bottom-right.php +2 -2
- elements/shape-separator/triangle-upper-left.php +2 -2
- elements/shape-separator/triangle-upper-right.php +2 -2
- elements/splittext.php +338 -338
- elements/textseparator.php +531 -531
- elements/twitter.php +963 -963
- inc/admin/Settings.php +115 -115
- inc/admin/controls.php +205 -205
- inc/admin/settings-page.php +268 -268
- inc/elementor-helper.php +21 -19
- inc/helper.php +104 -104
- readme.txt +127 -121
assets/css/eae.css
CHANGED
@@ -1,791 +1,1193 @@
|
|
1 |
-
.elementor-widget-wts-textseparator .elementor-widget-container{
|
2 |
-
overflow:hidden;
|
3 |
-
}
|
4 |
-
.wts-eae-textseparator{
|
5 |
-
align-items: center;
|
6 |
-
display: flex;
|
7 |
-
flex-flow: row nowrap; margin:auto;
|
8 |
-
}
|
9 |
-
|
10 |
-
.eae-separator-icon-inner i {
|
11 |
-
height: 1em;
|
12 |
-
width: 1em; text-align:center;
|
13 |
-
}
|
14 |
-
|
15 |
-
.wts-eae-textseparator .eae-sep-holder {
|
16 |
-
flex: 1 1 auto;
|
17 |
-
height: 1px;
|
18 |
-
min-width: 10%;
|
19 |
-
position: relative;
|
20 |
-
}
|
21 |
-
|
22 |
-
.wts-eae-textseparator .eae-sep-holder .eae-sep-lines{
|
23 |
-
border-top-width: 1px;
|
24 |
-
display: block;
|
25 |
-
height: 1px;
|
26 |
-
position: relative;
|
27 |
-
top: 1px;
|
28 |
-
width: 100%;
|
29 |
-
}
|
30 |
-
|
31 |
-
.eae-separator-title{
|
32 |
-
margin:0;
|
33 |
-
-moz-box-flex: 0;
|
34 |
-
flex: 0 1 auto;
|
35 |
-
line-height: 1em;
|
36 |
-
margin: 0;
|
37 |
-
overflow-wrap: break-word;
|
38 |
-
}
|
39 |
-
|
40 |
-
.sep-align-right .sep-right{
|
41 |
-
display: none;
|
42 |
-
}
|
43 |
-
|
44 |
-
.sep-align-left .sep-left{
|
45 |
-
display: none;
|
46 |
-
}
|
47 |
-
|
48 |
-
.eae-icon-view-stacked i{ color:#FFF; }
|
49 |
-
.eae-icon-view-framed .eae-separator-icon-inner{ border:1px solid; }
|
50 |
-
.eae-icon-shape-circle .eae-separator-icon-inner{ border-radius:50%; }
|
51 |
-
.eae-separator-icon-wrapper, .eae-separator-title{ margin:0 5px !important; }
|
52 |
-
.eae-separator-icon-inner{ line-height: 1; }
|
53 |
-
|
54 |
-
|
55 |
-
/**
|
56 |
-
Price Table Css
|
57 |
-
**/
|
58 |
-
.wts-price-box-wrapper .eae-pt-heading, .wts-price-box-wrapper .eae-pt-sub-heading{ margin:5px 0; text-align: center; }
|
59 |
-
.plan-price-shape {
|
60 |
-
display: table;
|
61 |
-
height: 6em;
|
62 |
-
margin: auto;
|
63 |
-
width: 6em;
|
64 |
-
}
|
65 |
-
|
66 |
-
.eae-pt-price-box-shape-circle .plan-price-shape, .eae-pt-price-box-shape-square .plan-price-shape{ border: 1px solid; }
|
67 |
-
.eae-pt-price-box-shape-circle .plan-price-shape{ border-radius:50%; }
|
68 |
-
.plan-price-block{ padding:10px 0; }
|
69 |
-
.plan-price-shape-inner {
|
70 |
-
display: table-cell;
|
71 |
-
vertical-align: middle; padding: 10px;
|
72 |
-
}
|
73 |
-
.plan-price-shape-inner > span {
|
74 |
-
display: block;
|
75 |
-
font-size: 1em; text-align:center;
|
76 |
-
}
|
77 |
-
|
78 |
-
.eae-pt-feature-list {
|
79 |
-
list-style: outside none none;
|
80 |
-
text-align: center; margin:10px 0;
|
81 |
-
}
|
82 |
-
.eae-pt-button-wrapper > a{ text-align:center; display:inline-block; }
|
83 |
-
.eae-pt-button-wrapper{ text-align: center;}
|
84 |
-
|
85 |
-
.wts-price-box-wrapper .heading-wrapper, .wts-price-box-wrapper .plan-features-wrapper{ padding:10px 5px;}
|
86 |
-
.eae-pt-button-wrapper{ padding:15px 0; }
|
87 |
-
.eae-pt-button-wrapper a{ padding:5px 15px; border-radius:3px; }
|
88 |
-
.eae-pt-align-icon-right{ float:right; }
|
89 |
-
.strike-feature{ text-decoration: line-through; }
|
90 |
-
|
91 |
-
/**
|
92 |
-
Flip Box CSS
|
93 |
-
**/
|
94 |
-
.eae-flip-box{
|
95 |
-
width: 100%;
|
96 |
-
text-align: center;
|
97 |
-
}
|
98 |
-
.eae-flip-box-wrapper{
|
99 |
-
display: inline-block;
|
100 |
-
width: 100%;
|
101 |
-
}
|
102 |
-
.eae-flip-box-inner{ width:100%; height:200px; position:relative;
|
103 |
-
-webkit-transform-style: preserve-3d;
|
104 |
-
-moz-transform-style: preserve-3d;
|
105 |
-
-ms-transform-style: preserve-3d;
|
106 |
-
transform-style: preserve-3d;
|
107 |
-
}
|
108 |
-
|
109 |
-
.eae-flip-box-inner .eae-flip-box-front, .eae-flip-box-inner .eae-flip-box-back{
|
110 |
-
width:100%; height:100%; position: absolute; top:0; left:0; text-align:center; padding: 10px;
|
111 |
-
-webkit-backface-visibility: hidden;
|
112 |
-
-moz-backface-visibility: hidden;
|
113 |
-
-ms-backface-visibility: hidden;
|
114 |
-
backface-visibility: hidden;
|
115 |
-
|
116 |
-
-webkit-transition: all 0.6s ease 0s;
|
117 |
-
-moz-transition: all 0.6s ease 0s;
|
118 |
-
-ms-transition: all 0.6s ease 0s;
|
119 |
-
-o-transition: all 0.6s ease 0s;
|
120 |
-
transition: all 0.6s ease 0s;
|
121 |
-
}
|
122 |
-
.eae-flip-box-front {
|
123 |
-
z-index: 2;
|
124 |
-
}
|
125 |
-
.eae-flip-box-back {
|
126 |
-
z-index: 1;
|
127 |
-
}
|
128 |
-
|
129 |
-
.eae-fb-animate-vertical .eae-flip-box-inner .eae-flip-box-front{ -webkit-transform:perspective(1000px) rotateX(0deg); -ms-transform:perspective(1000px) rotateX(0deg); transform:perspective(1000px) rotateX(0deg); }
|
130 |
-
.eae-fb-animate-vertical .eae-flip-box-inner .eae-flip-box-back{ -webkit-transform:perspective(1000px) rotateX(180deg); transform:perspective(1000px) rotateX(180deg); -ms-transform:perspective(1000px) rotateX(180deg); }
|
131 |
-
.eae-fb-animate-vertical .eae-flip-box-inner:hover .eae-flip-box-front{ -webkit-transform:perspective(1000px) rotateX(180deg); transform:perspective(1000px) rotateX(180deg); -ms-transform:perspective(1000px) rotateX(180deg); }
|
132 |
-
.eae-fb-animate-vertical .eae-flip-box-inner:hover .eae-flip-box-back{ -webkit-transform:perspective(1000px) rotateX(0deg); transform:perspective(1000px) rotateX(0deg); -ms-transform:perspective(1000px) rotateX(0deg); }
|
133 |
-
|
134 |
-
|
135 |
-
.eae-fb-animate-horizontal .eae-flip-box-inner .eae-flip-box-front{ -webkit-transform:perspective(1000px) rotateY(0deg); transform:perspective(1000px) rotateY(0deg); -ms-transform:perspective(1000px) rotateY(0deg); }
|
136 |
-
.eae-fb-animate-horizontal .eae-flip-box-inner .eae-flip-box-back{ -webkit-transform:perspective(1000px) rotateY(180deg); transform:perspective(1000px) rotateY(180deg); -ms-transform:perspective(1000px) rotateY(180deg); }
|
137 |
-
.eae-fb-animate-horizontal .eae-flip-box-inner:hover .eae-flip-box-front{ -webkit-transform:perspective(1000px) rotateY(180deg); transform:perspective(1000px) rotateY(180deg); -ms-transform:perspective(1000px) rotateY(180deg); }
|
138 |
-
.eae-fb-animate-horizontal .eae-flip-box-inner:hover .eae-flip-box-back{ -webkit-transform:perspective(1000px) rotateY(0deg); transform:perspective(1000px) rotateY(0deg); -ms-transform:perspective(1000px) rotateY(0deg); }
|
139 |
-
|
140 |
-
.eae-fb-animate-fade .eae-flip-box-inner .eae-flip-box-front{opacity:1;}
|
141 |
-
.eae-fb-animate-fade .eae-flip-box-inner .eae-flip-box-back{opacity:0;}
|
142 |
-
.eae-fb-animate-fade .eae-flip-box-inner:hover .eae-flip-box-front{opacity:0;}
|
143 |
-
.eae-fb-animate-fade .eae-flip-box-inner:hover .eae-flip-box-back{opacity:1;}
|
144 |
-
|
145 |
-
|
146 |
-
.eae-flip-box-wrapper:hover .eae-flip-box-back,
|
147 |
-
.eae-flip-box-wrapper:focus .eae-flip-box-back {
|
148 |
-
z-index: 2;
|
149 |
-
}
|
150 |
-
.eae-flip-box-wrapper:hover .eae-flip-box-front,
|
151 |
-
.eae-flip-box-wrapper:focus .eae-flip-box-front {
|
152 |
-
z-index: 1;
|
153 |
-
}
|
154 |
-
.fade .eae-flip-box-wrapper .eae-flip-box-front {
|
155 |
-
opacity: 1;
|
156 |
-
transition: 1s;
|
157 |
-
}
|
158 |
-
.fade .eae-flip-box-wrapper .eae-flip-box-back {
|
159 |
-
opacity: 0;
|
160 |
-
transition: 1s;
|
161 |
-
}
|
162 |
-
.fade .eae-flip-box-wrapper:hover .eae-flip-box-front,
|
163 |
-
.fade .eae-flip-box-wrapper:focus .eae-flip-box-front {
|
164 |
-
opacity: 0;
|
165 |
-
}
|
166 |
-
.fade .eae-flip-box-wrapper:hover .eae-flip-box-back,
|
167 |
-
.fade .eae-flip-box-wrapper:focus .eae-flip-box-back {
|
168 |
-
opacity: 1;
|
169 |
-
}
|
170 |
-
|
171 |
-
.eae-fb-animate-flip .eae-flip-box-wrapper {
|
172 |
-
perspective: 800px;
|
173 |
-
}
|
174 |
-
.eae-fb-animate-flip .eae-flip-box-inner{
|
175 |
-
transform-style: preserve-3d;
|
176 |
-
transform: rotateX(0) rotateY(0) rotateZ(0);
|
177 |
-
transition: 1s;
|
178 |
-
}
|
179 |
-
.eae-fb-animate-flip .eae-flip-box-front {
|
180 |
-
transform: translate3d(0,0,1px);
|
181 |
-
}
|
182 |
-
.eae-fb-animate-flip .eae-flip-box-back {
|
183 |
-
transform: rotateY(180deg) translate3d(0,0,0);
|
184 |
-
}
|
185 |
-
.eae-fb-animate-flip .eae-flip-box-wrapper:hover .eae-flip-box-inner,
|
186 |
-
.eae-fb-animate-flip .eae-flip-box-wrapper:focus .eae-flip-box-inner{
|
187 |
-
transform: rotateY(180deg);
|
188 |
-
}
|
189 |
-
.up .eae-flip-box-front {
|
190 |
-
transform: translate3d(0,0,1px);
|
191 |
-
}
|
192 |
-
.up .eae-flip-box-back {
|
193 |
-
transform: rotateX(180deg) translate3d(0,0,0);
|
194 |
-
}
|
195 |
-
.up .eae-flip-box-wrapper:hover .eae-flip-box-inner,
|
196 |
-
.up .eae-flip-box-wrapper:focus .eae-flip-box-inner{
|
197 |
-
transform: rotateX(180deg);
|
198 |
-
}
|
199 |
-
|
200 |
-
.box .eae-flip-box-front {
|
201 |
-
transform: translate3d(0,0,100px) scale(0.85,0.85);
|
202 |
-
}
|
203 |
-
.box .eae-flip-box-back {
|
204 |
-
transform: rotateY(180deg) translate3d(0,0,100px) scale(0.85,0.85);
|
205 |
-
}
|
206 |
-
.box.up .eae-flip-box-back {
|
207 |
-
transform: rotateX(180deg) translate3d(0,0,100px) scale(0.85,0.85);
|
208 |
-
}
|
209 |
-
|
210 |
-
.hideback .eae-flip-box-front, .hideback .eae-flip-box-back {
|
211 |
-
backface-visibility: hidden;
|
212 |
-
}
|
213 |
-
.eae-fb-animate-nananana .eae-flip-box-wrapper {
|
214 |
-
|
215 |
-
|
216 |
-
}
|
217 |
-
.eae-fb-animate-nananana .eae-flip-box-wrapper:hover .eae-flip-box-front,
|
218 |
-
.eae-fb-animate-nananana .eae-flip-box-wrapper:focus .eae-flip-box-front {
|
219 |
-
z-index: 10;
|
220 |
-
animation: batman 1s 2 alternate linear;
|
221 |
-
}
|
222 |
-
|
223 |
-
|
224 |
-
/* Cube Animation */
|
225 |
-
|
226 |
-
.eae-fb-animate-flipcard .eae-flip-box-front, .eae-fb-animate-flipcard .eae-flip-box-back{
|
227 |
-
transition: transform 0.4s ease;
|
228 |
-
transform-origin: center center -150px;
|
229 |
-
-webkit-transform-origin: center center -150px;
|
230 |
-
}
|
231 |
-
|
232 |
-
/* top to down */
|
233 |
-
|
234 |
-
.flipcard-rotate-top-down .eae-flip-box-front {
|
235 |
-
transform: perspective(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
|
236 |
-
}
|
237 |
-
.flipcard-rotate-top-down .eae-flip-box-back {
|
238 |
-
transform: perspective(0px) rotateX(90deg) rotateY(0deg) rotateZ(0deg);
|
239 |
-
}
|
240 |
-
.eae-fb-animate-flipcard.flipcard-rotate-top-down .eae-flip-box-wrapper:hover .eae-flip-box-front {
|
241 |
-
transform: perspective(0px) rotateX(-90deg) rotateY(0) rotateZ(0deg);
|
242 |
-
}
|
243 |
-
.eae-fb-animate-flipcard.flipcard-rotate-top-down .eae-flip-box-wrapper:hover .eae-flip-box-back {
|
244 |
-
z-index: 99999;
|
245 |
-
transform: perspective(0px) rotateX(0deg) rotateY(0deg) rotateZ(0);
|
246 |
-
}
|
247 |
-
|
248 |
-
|
249 |
-
/* down to top */
|
250 |
-
.flipcard-rotate-down-top .eae-flip-box-front {
|
251 |
-
transform: perspective(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
|
252 |
-
}
|
253 |
-
.flipcard-rotate-down-top .eae-flip-box-back {
|
254 |
-
transform: perspective(0px) rotateX(-90deg) rotateY(0deg) rotateZ(0deg);
|
255 |
-
}
|
256 |
-
.eae-fb-animate-flipcard.flipcard-rotate-down-top .eae-flip-box-wrapper:hover .eae-flip-box-front {
|
257 |
-
transform: perspective(0px) rotateX(90deg) rotateY(0) rotateZ(0deg);
|
258 |
-
}
|
259 |
-
.eae-fb-animate-flipcard.flipcard-rotate-down-top .eae-flip-box-wrapper:hover .eae-flip-box-back {
|
260 |
-
z-index: 99999;
|
261 |
-
transform: perspective(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
|
262 |
-
}
|
263 |
-
|
264 |
-
/* left to right */
|
265 |
-
|
266 |
-
.flipcard-rotate-left-right .eae-flip-box-front {
|
267 |
-
transform: perspective(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
|
268 |
-
}
|
269 |
-
.flipcard-rotate-left-right .eae-flip-box-back {
|
270 |
-
transform: perspective(0px) rotateX(0deg) rotateY(-90deg) rotateZ(0deg);
|
271 |
-
}
|
272 |
-
.eae-fb-animate-flipcard.flipcard-rotate-left-right .eae-flip-box-wrapper:hover .eae-flip-box-front {
|
273 |
-
transform: perspective(0px) rotateX(0deg) rotateY(90deg) rotateZ(0deg);
|
274 |
-
}
|
275 |
-
.eae-fb-animate-flipcard.flipcard-rotate-left-right .eae-flip-box-wrapper:hover .eae-flip-box-back {
|
276 |
-
z-index: 99999;
|
277 |
-
transform: perspective(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
|
278 |
-
}
|
279 |
-
|
280 |
-
/* right to left */
|
281 |
-
|
282 |
-
.flipcard-rotate-right-left .eae-flip-box-front {
|
283 |
-
transform: perspective(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
|
284 |
-
}
|
285 |
-
.flipcard-rotate-right-left .eae-flip-box-back {
|
286 |
-
transform: perspective(0px) rotateX(0deg) rotateY(90deg) rotateZ(0deg);
|
287 |
-
}
|
288 |
-
.eae-fb-animate-flipcard.flipcard-rotate-right-left .eae-flip-box-wrapper:hover .eae-flip-box-front {
|
289 |
-
transform: perspective(0px) rotateX(0deg) rotateY(-90deg) rotateZ(0deg);
|
290 |
-
}
|
291 |
-
.eae-fb-animate-flipcard.flipcard-rotate-right-left .eae-flip-box-wrapper:hover .eae-flip-box-back {
|
292 |
-
z-index: 99999;
|
293 |
-
transform: perspective(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
|
294 |
-
}
|
295 |
-
|
296 |
-
@keyframes batman {
|
297 |
-
0% { transform: scale(1,1) rotateZ(0); }
|
298 |
-
100% {
|
299 |
-
transform: scale(0,0) rotateZ(720deg);
|
300 |
-
opacity: 0;
|
301 |
-
}
|
302 |
-
}
|
303 |
-
|
304 |
-
|
305 |
-
.eae-flip-box-front i, .eae-flip-box-back i{ font-size:32px; height:1em; width:1em; }
|
306 |
-
.eae-fb-icon-view-framed{ border:1px solid #92BE43; }
|
307 |
-
.eae-fb-icon-shape-circle{ border-radius:50%; }
|
308 |
-
.eae-flip-box-wrapper .icon-wrapper{ display:inline-block; padding:10px; line-height: 1; }
|
309 |
-
|
310 |
-
.eae-flip-box-wrapper .front-icon-title, .eae-flip-box-wrapper .back-icon-title{ margin:10px auto; color:#FFF; }
|
311 |
-
|
312 |
-
.eae-flip-box-wrapper .flipbox-content { display: block; position: relative; top: 50%; transform: translateY(-50%); -ms-transform: translateY(-50%) }
|
313 |
-
.flipbox-content p{ margin-bottom: 10px; }
|
314 |
-
.eae-fb-button{ display:inline-block; padding: 5px 10px; }
|
315 |
-
|
316 |
-
.eae-flip-box-front{ background:#A0CE4E; }
|
317 |
-
.eae-flip-box-back{ background:#73B9DC; }
|
318 |
-
|
319 |
-
@media only screen and (max-width: 768px) {
|
320 |
-
|
321 |
-
.flipbox-content, .eae-flip-box-front, .eae-flip-box-back{
|
322 |
-
cursor:pointer;
|
323 |
-
overflow: visible !important;
|
324 |
-
transform-style: preserve-3d;
|
325 |
-
-webkit-transform-style: preserve-3d;
|
326 |
-
}
|
327 |
-
}
|
328 |
-
/**
|
329 |
-
Shape Separator
|
330 |
-
**/
|
331 |
-
.elementor-widget-wts-shape-separator svg{ display: block; }
|
332 |
-
|
333 |
-
/**
|
334 |
-
Post List
|
335 |
-
**/
|
336 |
-
.wts-eae-pl-wrapper ul{
|
337 |
-
margin:0;
|
338 |
-
}
|
339 |
-
.wts-eae-pl-wrapper ul li{
|
340 |
-
list-style: none;
|
341 |
-
overflow: hidden; margin-bottom:10px;
|
342 |
-
}
|
343 |
-
.eae-pl-img-align-none .eae-pl-image-wrapper a{ text-align: center; }
|
344 |
-
.eae-pl-title{ margin:0; }
|
345 |
-
.eae-pl-title a{ display:block; }
|
346 |
-
|
347 |
-
.eae-pl-readmore a{ display:inline-block;
|
348 |
-
border-radius: 2px;
|
349 |
-
color: #fff;
|
350 |
-
padding: 4px 8px;
|
351 |
-
}
|
352 |
-
|
353 |
-
/**
|
354 |
-
Animated Text Styles
|
355 |
-
**/
|
356 |
-
/* --------------------------------
|
357 |
-
Primary style
|
358 |
-
-------------------------------- */
|
359 |
-
|
360 |
-
.eae-at-animation-text-wrapper {
|
361 |
-
display: inline-block;
|
362 |
-
position: relative;
|
363 |
-
text-align: left;
|
364 |
-
}
|
365 |
-
.eae-at-animation-text-wrapper .eae-at-animation-text {
|
366 |
-
display: inline-block;
|
367 |
-
position: absolute;
|
368 |
-
white-space: nowrap;
|
369 |
-
left: 0;
|
370 |
-
top: 0;
|
371 |
-
}
|
372 |
-
.eae-at-animation-text-wrapper .eae-at-animation-text.is-visible {
|
373 |
-
position: relative;
|
374 |
-
}
|
375 |
-
.no-js .eae-at-animation-text-wrapper .eae-at-animation-text {
|
376 |
-
opacity: 0;
|
377 |
-
}
|
378 |
-
.no-js .eae-at-animation-text-wrapper .eae-at-animation-text.is-visible {
|
379 |
-
opacity: 1;
|
380 |
-
}
|
381 |
-
|
382 |
-
.eae-animtext-wrapper{ font-size:40px; }
|
383 |
-
|
384 |
-
|
385 |
-
/**
|
386 |
-
Animated Text Styles
|
387 |
-
**/
|
388 |
-
.eae-st-rest-text {
|
389 |
-
display: inline-block;
|
390 |
-
}
|
391 |
-
.eae-st-split-text {
|
392 |
-
display: inline-block;
|
393 |
-
}
|
394 |
-
|
395 |
-
/* --------------------------------
|
396 |
-
xtype
|
397 |
-
-------------------------------- */
|
398 |
-
.eae-at-animation.type .eae-at-animation-text-wrapper {
|
399 |
-
vertical-align: bottom;
|
400 |
-
overflow: hidden;
|
401 |
-
}
|
402 |
-
.eae-at-animation.type .eae-at-animation-text-wrapper::after {
|
403 |
-
/* vertical bar */
|
404 |
-
content: '';
|
405 |
-
position: absolute;
|
406 |
-
right: 0;
|
407 |
-
top: 50%;
|
408 |
-
bottom: auto;
|
409 |
-
-webkit-transform: translateY(-50%);
|
410 |
-
-moz-transform: translateY(-50%);
|
411 |
-
-ms-transform: translateY(-50%);
|
412 |
-
-o-transform: translateY(-50%);
|
413 |
-
transform: translateY(-50%);
|
414 |
-
height: 90%;
|
415 |
-
width: 1px;
|
416 |
-
}
|
417 |
-
.eae-at-animation.type .eae-at-animation-text-wrapper.waiting::after {
|
418 |
-
-webkit-animation: cd-pulse 1s infinite;
|
419 |
-
-moz-animation: cd-pulse 1s infinite;
|
420 |
-
animation: cd-pulse 1s infinite;
|
421 |
-
}
|
422 |
-
|
423 |
-
.eae-at-animation.type .eae-at-animation-text-wrapper.selected::after {
|
424 |
-
visibility: hidden;
|
425 |
-
}
|
426 |
-
|
427 |
-
.eae-at-animation.type .eae-at-animation-text {
|
428 |
-
visibility: hidden;
|
429 |
-
}
|
430 |
-
.eae-at-animation.type .eae-at-animation-text.is-visible {
|
431 |
-
visibility: visible;
|
432 |
-
}
|
433 |
-
.eae-at-animation.type i {
|
434 |
-
position: absolute;
|
435 |
-
visibility: hidden;
|
436 |
-
}
|
437 |
-
.eae-at-animation.type i.in {
|
438 |
-
position: relative;
|
439 |
-
visibility: visible;
|
440 |
-
}
|
441 |
-
|
442 |
-
@-webkit-keyframes cd-pulse {
|
443 |
-
0% {
|
444 |
-
-webkit-transform: translateY(-50%) scale(1);
|
445 |
-
opacity: 1;
|
446 |
-
}
|
447 |
-
40% {
|
448 |
-
-webkit-transform: translateY(-50%) scale(0.9);
|
449 |
-
opacity: 0;
|
450 |
-
}
|
451 |
-
100% {
|
452 |
-
-webkit-transform: translateY(-50%) scale(0);
|
453 |
-
opacity: 0;
|
454 |
-
}
|
455 |
-
}
|
456 |
-
@-moz-keyframes cd-pulse {
|
457 |
-
0% {
|
458 |
-
-moz-transform: translateY(-50%) scale(1);
|
459 |
-
opacity: 1;
|
460 |
-
}
|
461 |
-
40% {
|
462 |
-
-moz-transform: translateY(-50%) scale(0.9);
|
463 |
-
opacity: 0;
|
464 |
-
}
|
465 |
-
100% {
|
466 |
-
-moz-transform: translateY(-50%) scale(0);
|
467 |
-
opacity: 0;
|
468 |
-
}
|
469 |
-
}
|
470 |
-
@keyframes cd-pulse {
|
471 |
-
0% {
|
472 |
-
-webkit-transform: translateY(-50%) scale(1);
|
473 |
-
-moz-transform: translateY(-50%) scale(1);
|
474 |
-
-ms-transform: translateY(-50%) scale(1);
|
475 |
-
-o-transform: translateY(-50%) scale(1);
|
476 |
-
transform: translateY(-50%) scale(1);
|
477 |
-
opacity: 1;
|
478 |
-
}
|
479 |
-
40% {
|
480 |
-
-webkit-transform: translateY(-50%) scale(0.9);
|
481 |
-
-moz-transform: translateY(-50%) scale(0.9);
|
482 |
-
-ms-transform: translateY(-50%) scale(0.9);
|
483 |
-
-o-transform: translateY(-50%) scale(0.9);
|
484 |
-
transform: translateY(-50%) scale(0.9);
|
485 |
-
opacity: 0;
|
486 |
-
}
|
487 |
-
100% {
|
488 |
-
-webkit-transform: translateY(-50%) scale(0);
|
489 |
-
-moz-transform: translateY(-50%) scale(0);
|
490 |
-
-ms-transform: translateY(-50%) scale(0);
|
491 |
-
-o-transform: translateY(-50%) scale(0);
|
492 |
-
transform: translateY(-50%) scale(0);
|
493 |
-
opacity: 0;
|
494 |
-
}
|
495 |
-
}
|
496 |
-
|
497 |
-
/**
|
498 |
-
Advanced tabs
|
499 |
-
**/
|
500 |
-
/* --------------------------------
|
501 |
-
Primary style
|
502 |
-
-------------------------------- */
|
503 |
-
.eae-tabs {
|
504 |
-
position: relative;
|
505 |
-
width: 100%;
|
506 |
-
overflow: hidden;
|
507 |
-
margin: 1em 0 2em;
|
508 |
-
font-weight: 300;
|
509 |
-
}
|
510 |
-
|
511 |
-
/* Nav */
|
512 |
-
.eae-tabs nav {
|
513 |
-
text-align: center;
|
514 |
-
line-height: 0;
|
515 |
-
}
|
516 |
-
|
517 |
-
.eae-tabs nav ul {
|
518 |
-
padding: 0;
|
519 |
-
margin: 0;
|
520 |
-
list-style: none;
|
521 |
-
display: inline-block;
|
522 |
-
}
|
523 |
-
|
524 |
-
.eae-tabs nav ul li {
|
525 |
-
border: 1px solid #becbd2;
|
526 |
-
border-bottom: none;
|
527 |
-
display: block;
|
528 |
-
position: relative;
|
529 |
-
}
|
530 |
-
|
531 |
-
.eae-tabs nav li.tab-current {
|
532 |
-
border: 1px solid #47a3da;
|
533 |
-
border-bottom: none;
|
534 |
-
z-index: 100;
|
535 |
-
}
|
536 |
-
|
537 |
-
.eae-nav-pos-top nav li.tab-current:before,
|
538 |
-
.eae-nav-pos-top nav li.tab-current:after {
|
539 |
-
content: '';
|
540 |
-
position: absolute;
|
541 |
-
height: 2px;
|
542 |
-
right: 100%;
|
543 |
-
bottom: 0;
|
544 |
-
width: 1000px;
|
545 |
-
background: #47a3da;
|
546 |
-
}
|
547 |
-
|
548 |
-
.eae-nav-pos-top nav ul li{
|
549 |
-
margin: 0 0.25em;
|
550 |
-
float: left;
|
551 |
-
}
|
552 |
-
.eae-nav-pos-top nav li.tab-current:after {
|
553 |
-
right: auto;
|
554 |
-
left: 100%;
|
555 |
-
width: 4000px;
|
556 |
-
}
|
557 |
-
|
558 |
-
.eae-tabs nav a {
|
559 |
-
display: block;
|
560 |
-
line-height: 2.5;
|
561 |
-
padding: 0 1.25em;
|
562 |
-
white-space: nowrap;
|
563 |
-
}
|
564 |
-
.eae-tabs nav i {
|
565 |
-
line-height: 2.5;
|
566 |
-
padding: 1px;
|
567 |
-
}
|
568 |
-
|
569 |
-
.eae-tabs nav a:hover {
|
570 |
-
color: #768e9d;
|
571 |
-
}
|
572 |
-
|
573 |
-
.eae-tabs nav li.tab-current a {
|
574 |
-
color: #47a3da;
|
575 |
-
}
|
576 |
-
|
577 |
-
.eae-nav-pos-left nav {
|
578 |
-
float:left;
|
579 |
-
width: 20%;
|
580 |
-
}
|
581 |
-
.eae-nav-pos-left nav ul li{
|
582 |
-
margin:0 0 10px 0;
|
583 |
-
}
|
584 |
-
.eae-nav-pos-left .eae-content{
|
585 |
-
float:left;
|
586 |
-
width: 80%;
|
587 |
-
padding-left: 5px;
|
588 |
-
}
|
589 |
-
/* Icons */
|
590 |
-
.eae-tabs nav a:before {
|
591 |
-
display: inline-block;
|
592 |
-
vertical-align: middle;
|
593 |
-
text-transform: none;
|
594 |
-
font-weight: normal;
|
595 |
-
font-variant: normal;
|
596 |
-
font-family: 'icomoon';
|
597 |
-
line-height: 1;
|
598 |
-
speak: none;
|
599 |
-
-webkit-font-smoothing: antialiased;
|
600 |
-
margin: -0.25em 0.4em 0 0;
|
601 |
-
}
|
602 |
-
|
603 |
-
/* Content */
|
604 |
-
.eae-content section {
|
605 |
-
font-size: 1.25em;
|
606 |
-
padding: 20px 20px;
|
607 |
-
|
608 |
-
|
609 |
-
|
610 |
-
|
611 |
-
|
612 |
-
|
613 |
-
|
614 |
-
|
615 |
-
|
616 |
-
|
617 |
-
|
618 |
-
|
619 |
-
|
620 |
-
|
621 |
-
|
622 |
-
|
623 |
-
|
624 |
-
|
625 |
-
|
626 |
-
|
627 |
-
|
628 |
-
|
629 |
-
|
630 |
-
|
631 |
-
|
632 |
-
|
633 |
-
|
634 |
-
|
635 |
-
|
636 |
-
|
637 |
-
|
638 |
-
|
639 |
-
|
640 |
-
|
641 |
-
|
642 |
-
|
643 |
-
|
644 |
-
|
645 |
-
|
646 |
-
|
647 |
-
|
648 |
-
|
649 |
-
|
650 |
-
|
651 |
-
|
652 |
-
|
653 |
-
|
654 |
-
|
655 |
-
|
656 |
-
|
657 |
-
|
658 |
-
|
659 |
-
|
660 |
-
|
661 |
-
|
662 |
-
|
663 |
-
|
664 |
-
|
665 |
-
|
666 |
-
|
667 |
-
|
668 |
-
|
669 |
-
|
670 |
-
|
671 |
-
|
672 |
-
|
673 |
-
|
674 |
-
|
675 |
-
|
676 |
-
|
677 |
-
|
678 |
-
|
679 |
-
|
680 |
-
|
681 |
-
|
682 |
-
|
683 |
-
|
684 |
-
|
685 |
-
|
686 |
-
|
687 |
-
|
688 |
-
|
689 |
-
|
690 |
-
|
691 |
-
|
692 |
-
|
693 |
-
|
694 |
-
|
695 |
-
|
696 |
-
|
697 |
-
|
698 |
-
|
699 |
-
|
700 |
-
|
701 |
-
|
702 |
-
|
703 |
-
|
704 |
-
|
705 |
-
|
706 |
-
|
707 |
-
|
708 |
-
|
709 |
-
|
710 |
-
|
711 |
-
|
712 |
-
|
713 |
-
|
714 |
-
|
715 |
-
|
716 |
-
|
717 |
-
|
718 |
-
|
719 |
-
|
720 |
-
|
721 |
-
|
722 |
-
|
723 |
-
|
724 |
-
|
725 |
-
width:
|
726 |
-
|
727 |
-
|
728 |
-
|
729 |
-
|
730 |
-
|
731 |
-
|
732 |
-
|
733 |
-
|
734 |
-
|
735 |
-
width:
|
736 |
-
|
737 |
-
|
738 |
-
|
739 |
-
|
740 |
-
|
741 |
-
|
742 |
-
|
743 |
-
|
744 |
-
|
745 |
-
|
746 |
-
|
747 |
-
|
748 |
-
|
749 |
-
|
750 |
-
|
751 |
-
|
752 |
-
|
753 |
-
|
754 |
-
|
755 |
-
|
756 |
-
|
757 |
-
|
758 |
-
|
759 |
-
|
760 |
-
|
761 |
-
|
762 |
-
|
763 |
-
|
764 |
-
|
765 |
-
|
766 |
-
|
767 |
-
|
768 |
-
|
769 |
-
|
770 |
-
|
771 |
-
|
772 |
-
|
773 |
-
|
774 |
-
|
775 |
-
|
776 |
-
|
777 |
-
|
778 |
-
|
779 |
-
|
780 |
-
|
781 |
-
|
782 |
-
|
783 |
-
|
784 |
-
|
785 |
-
|
786 |
-
|
787 |
-
|
788 |
-
|
789 |
-
|
790 |
-
|
791 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
.elementor-widget-wts-textseparator .elementor-widget-container{
|
2 |
+
overflow:hidden;
|
3 |
+
}
|
4 |
+
.wts-eae-textseparator{
|
5 |
+
align-items: center;
|
6 |
+
display: flex;
|
7 |
+
flex-flow: row nowrap; margin:auto;
|
8 |
+
}
|
9 |
+
|
10 |
+
.eae-separator-icon-inner i {
|
11 |
+
height: 1em;
|
12 |
+
width: 1em; text-align:center;
|
13 |
+
}
|
14 |
+
|
15 |
+
.wts-eae-textseparator .eae-sep-holder {
|
16 |
+
flex: 1 1 auto;
|
17 |
+
height: 1px;
|
18 |
+
min-width: 10%;
|
19 |
+
position: relative;
|
20 |
+
}
|
21 |
+
|
22 |
+
.wts-eae-textseparator .eae-sep-holder .eae-sep-lines{
|
23 |
+
border-top-width: 1px;
|
24 |
+
display: block;
|
25 |
+
height: 1px;
|
26 |
+
position: relative;
|
27 |
+
top: 1px;
|
28 |
+
width: 100%;
|
29 |
+
}
|
30 |
+
|
31 |
+
.eae-separator-title{
|
32 |
+
margin:0;
|
33 |
+
-moz-box-flex: 0;
|
34 |
+
flex: 0 1 auto;
|
35 |
+
line-height: 1em;
|
36 |
+
margin: 0;
|
37 |
+
overflow-wrap: break-word;
|
38 |
+
}
|
39 |
+
|
40 |
+
.sep-align-right .sep-right{
|
41 |
+
display: none;
|
42 |
+
}
|
43 |
+
|
44 |
+
.sep-align-left .sep-left{
|
45 |
+
display: none;
|
46 |
+
}
|
47 |
+
|
48 |
+
.eae-icon-view-stacked i{ color:#FFF; }
|
49 |
+
.eae-icon-view-framed .eae-separator-icon-inner{ border:1px solid; }
|
50 |
+
.eae-icon-shape-circle .eae-separator-icon-inner{ border-radius:50%; }
|
51 |
+
.eae-separator-icon-wrapper, .eae-separator-title{ margin:0 5px !important; }
|
52 |
+
.eae-separator-icon-inner{ line-height: 1; }
|
53 |
+
|
54 |
+
|
55 |
+
/**
|
56 |
+
Price Table Css
|
57 |
+
**/
|
58 |
+
.wts-price-box-wrapper .eae-pt-heading, .wts-price-box-wrapper .eae-pt-sub-heading{ margin:5px 0; text-align: center; }
|
59 |
+
.plan-price-shape {
|
60 |
+
display: table;
|
61 |
+
height: 6em;
|
62 |
+
margin: auto;
|
63 |
+
width: 6em;
|
64 |
+
}
|
65 |
+
|
66 |
+
.eae-pt-price-box-shape-circle .plan-price-shape, .eae-pt-price-box-shape-square .plan-price-shape{ border: 1px solid; }
|
67 |
+
.eae-pt-price-box-shape-circle .plan-price-shape{ border-radius:50%; }
|
68 |
+
.plan-price-block{ padding:10px 0; }
|
69 |
+
.plan-price-shape-inner {
|
70 |
+
display: table-cell;
|
71 |
+
vertical-align: middle; padding: 10px;
|
72 |
+
}
|
73 |
+
.plan-price-shape-inner > span {
|
74 |
+
display: block;
|
75 |
+
font-size: 1em; text-align:center;
|
76 |
+
}
|
77 |
+
|
78 |
+
.eae-pt-feature-list {
|
79 |
+
list-style: outside none none;
|
80 |
+
text-align: center; margin:10px 0;
|
81 |
+
}
|
82 |
+
.eae-pt-button-wrapper > a{ text-align:center; display:inline-block; }
|
83 |
+
.eae-pt-button-wrapper{ text-align: center;}
|
84 |
+
|
85 |
+
.wts-price-box-wrapper .heading-wrapper, .wts-price-box-wrapper .plan-features-wrapper{ padding:10px 5px;}
|
86 |
+
.eae-pt-button-wrapper{ padding:15px 0; }
|
87 |
+
.eae-pt-button-wrapper a{ padding:5px 15px; border-radius:3px; }
|
88 |
+
.eae-pt-align-icon-right{ float:right; }
|
89 |
+
.strike-feature{ text-decoration: line-through; }
|
90 |
+
|
91 |
+
/**
|
92 |
+
Flip Box CSS
|
93 |
+
**/
|
94 |
+
.eae-flip-box{
|
95 |
+
width: 100%;
|
96 |
+
text-align: center;
|
97 |
+
}
|
98 |
+
.eae-flip-box-wrapper{
|
99 |
+
display: inline-block;
|
100 |
+
width: 100%;
|
101 |
+
}
|
102 |
+
.eae-flip-box-inner{ width:100%; height:200px; position:relative;
|
103 |
+
-webkit-transform-style: preserve-3d;
|
104 |
+
-moz-transform-style: preserve-3d;
|
105 |
+
-ms-transform-style: preserve-3d;
|
106 |
+
transform-style: preserve-3d;
|
107 |
+
}
|
108 |
+
|
109 |
+
.eae-flip-box-inner .eae-flip-box-front, .eae-flip-box-inner .eae-flip-box-back{
|
110 |
+
width:100%; height:100%; position: absolute; top:0; left:0; text-align:center; padding: 10px;
|
111 |
+
-webkit-backface-visibility: hidden;
|
112 |
+
-moz-backface-visibility: hidden;
|
113 |
+
-ms-backface-visibility: hidden;
|
114 |
+
backface-visibility: hidden;
|
115 |
+
|
116 |
+
-webkit-transition: all 0.6s ease 0s;
|
117 |
+
-moz-transition: all 0.6s ease 0s;
|
118 |
+
-ms-transition: all 0.6s ease 0s;
|
119 |
+
-o-transition: all 0.6s ease 0s;
|
120 |
+
transition: all 0.6s ease 0s;
|
121 |
+
}
|
122 |
+
.eae-flip-box-front {
|
123 |
+
z-index: 2;
|
124 |
+
}
|
125 |
+
.eae-flip-box-back {
|
126 |
+
z-index: 1;
|
127 |
+
}
|
128 |
+
|
129 |
+
.eae-fb-animate-vertical .eae-flip-box-inner .eae-flip-box-front{ -webkit-transform:perspective(1000px) rotateX(0deg); -ms-transform:perspective(1000px) rotateX(0deg); transform:perspective(1000px) rotateX(0deg); }
|
130 |
+
.eae-fb-animate-vertical .eae-flip-box-inner .eae-flip-box-back{ -webkit-transform:perspective(1000px) rotateX(180deg); transform:perspective(1000px) rotateX(180deg); -ms-transform:perspective(1000px) rotateX(180deg); }
|
131 |
+
.eae-fb-animate-vertical .eae-flip-box-inner:hover .eae-flip-box-front{ -webkit-transform:perspective(1000px) rotateX(180deg); transform:perspective(1000px) rotateX(180deg); -ms-transform:perspective(1000px) rotateX(180deg); }
|
132 |
+
.eae-fb-animate-vertical .eae-flip-box-inner:hover .eae-flip-box-back{ -webkit-transform:perspective(1000px) rotateX(0deg); transform:perspective(1000px) rotateX(0deg); -ms-transform:perspective(1000px) rotateX(0deg); }
|
133 |
+
|
134 |
+
|
135 |
+
.eae-fb-animate-horizontal .eae-flip-box-inner .eae-flip-box-front{ -webkit-transform:perspective(1000px) rotateY(0deg); transform:perspective(1000px) rotateY(0deg); -ms-transform:perspective(1000px) rotateY(0deg); }
|
136 |
+
.eae-fb-animate-horizontal .eae-flip-box-inner .eae-flip-box-back{ -webkit-transform:perspective(1000px) rotateY(180deg); transform:perspective(1000px) rotateY(180deg); -ms-transform:perspective(1000px) rotateY(180deg); }
|
137 |
+
.eae-fb-animate-horizontal .eae-flip-box-inner:hover .eae-flip-box-front{ -webkit-transform:perspective(1000px) rotateY(180deg); transform:perspective(1000px) rotateY(180deg); -ms-transform:perspective(1000px) rotateY(180deg); }
|
138 |
+
.eae-fb-animate-horizontal .eae-flip-box-inner:hover .eae-flip-box-back{ -webkit-transform:perspective(1000px) rotateY(0deg); transform:perspective(1000px) rotateY(0deg); -ms-transform:perspective(1000px) rotateY(0deg); }
|
139 |
+
|
140 |
+
.eae-fb-animate-fade .eae-flip-box-inner .eae-flip-box-front{opacity:1;}
|
141 |
+
.eae-fb-animate-fade .eae-flip-box-inner .eae-flip-box-back{opacity:0;}
|
142 |
+
.eae-fb-animate-fade .eae-flip-box-inner:hover .eae-flip-box-front{opacity:0;}
|
143 |
+
.eae-fb-animate-fade .eae-flip-box-inner:hover .eae-flip-box-back{opacity:1;}
|
144 |
+
|
145 |
+
|
146 |
+
.eae-flip-box-wrapper:hover .eae-flip-box-back,
|
147 |
+
.eae-flip-box-wrapper:focus .eae-flip-box-back {
|
148 |
+
z-index: 2;
|
149 |
+
}
|
150 |
+
.eae-flip-box-wrapper:hover .eae-flip-box-front,
|
151 |
+
.eae-flip-box-wrapper:focus .eae-flip-box-front {
|
152 |
+
z-index: 1;
|
153 |
+
}
|
154 |
+
.fade .eae-flip-box-wrapper .eae-flip-box-front {
|
155 |
+
opacity: 1;
|
156 |
+
transition: 1s;
|
157 |
+
}
|
158 |
+
.fade .eae-flip-box-wrapper .eae-flip-box-back {
|
159 |
+
opacity: 0;
|
160 |
+
transition: 1s;
|
161 |
+
}
|
162 |
+
.fade .eae-flip-box-wrapper:hover .eae-flip-box-front,
|
163 |
+
.fade .eae-flip-box-wrapper:focus .eae-flip-box-front {
|
164 |
+
opacity: 0;
|
165 |
+
}
|
166 |
+
.fade .eae-flip-box-wrapper:hover .eae-flip-box-back,
|
167 |
+
.fade .eae-flip-box-wrapper:focus .eae-flip-box-back {
|
168 |
+
opacity: 1;
|
169 |
+
}
|
170 |
+
|
171 |
+
.eae-fb-animate-flip .eae-flip-box-wrapper {
|
172 |
+
perspective: 800px;
|
173 |
+
}
|
174 |
+
.eae-fb-animate-flip .eae-flip-box-inner{
|
175 |
+
transform-style: preserve-3d;
|
176 |
+
transform: rotateX(0) rotateY(0) rotateZ(0);
|
177 |
+
transition: 1s;
|
178 |
+
}
|
179 |
+
.eae-fb-animate-flip .eae-flip-box-front {
|
180 |
+
transform: translate3d(0,0,1px);
|
181 |
+
}
|
182 |
+
.eae-fb-animate-flip .eae-flip-box-back {
|
183 |
+
transform: rotateY(180deg) translate3d(0,0,0);
|
184 |
+
}
|
185 |
+
.eae-fb-animate-flip .eae-flip-box-wrapper:hover .eae-flip-box-inner,
|
186 |
+
.eae-fb-animate-flip .eae-flip-box-wrapper:focus .eae-flip-box-inner{
|
187 |
+
transform: rotateY(180deg);
|
188 |
+
}
|
189 |
+
.up .eae-flip-box-front {
|
190 |
+
transform: translate3d(0,0,1px);
|
191 |
+
}
|
192 |
+
.up .eae-flip-box-back {
|
193 |
+
transform: rotateX(180deg) translate3d(0,0,0);
|
194 |
+
}
|
195 |
+
.up .eae-flip-box-wrapper:hover .eae-flip-box-inner,
|
196 |
+
.up .eae-flip-box-wrapper:focus .eae-flip-box-inner{
|
197 |
+
transform: rotateX(180deg);
|
198 |
+
}
|
199 |
+
|
200 |
+
.box .eae-flip-box-front {
|
201 |
+
transform: translate3d(0,0,100px) scale(0.85,0.85);
|
202 |
+
}
|
203 |
+
.box .eae-flip-box-back {
|
204 |
+
transform: rotateY(180deg) translate3d(0,0,100px) scale(0.85,0.85);
|
205 |
+
}
|
206 |
+
.box.up .eae-flip-box-back {
|
207 |
+
transform: rotateX(180deg) translate3d(0,0,100px) scale(0.85,0.85);
|
208 |
+
}
|
209 |
+
|
210 |
+
.hideback .eae-flip-box-front, .hideback .eae-flip-box-back {
|
211 |
+
backface-visibility: hidden;
|
212 |
+
}
|
213 |
+
.eae-fb-animate-nananana .eae-flip-box-wrapper {
|
214 |
+
|
215 |
+
|
216 |
+
}
|
217 |
+
.eae-fb-animate-nananana .eae-flip-box-wrapper:hover .eae-flip-box-front,
|
218 |
+
.eae-fb-animate-nananana .eae-flip-box-wrapper:focus .eae-flip-box-front {
|
219 |
+
z-index: 10;
|
220 |
+
animation: batman 1s 2 alternate linear;
|
221 |
+
}
|
222 |
+
|
223 |
+
|
224 |
+
/* Cube Animation */
|
225 |
+
|
226 |
+
.eae-fb-animate-flipcard .eae-flip-box-front, .eae-fb-animate-flipcard .eae-flip-box-back{
|
227 |
+
transition: transform 0.4s ease;
|
228 |
+
transform-origin: center center -150px;
|
229 |
+
-webkit-transform-origin: center center -150px;
|
230 |
+
}
|
231 |
+
|
232 |
+
/* top to down */
|
233 |
+
|
234 |
+
.flipcard-rotate-top-down .eae-flip-box-front {
|
235 |
+
transform: perspective(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
|
236 |
+
}
|
237 |
+
.flipcard-rotate-top-down .eae-flip-box-back {
|
238 |
+
transform: perspective(0px) rotateX(90deg) rotateY(0deg) rotateZ(0deg);
|
239 |
+
}
|
240 |
+
.eae-fb-animate-flipcard.flipcard-rotate-top-down .eae-flip-box-wrapper:hover .eae-flip-box-front {
|
241 |
+
transform: perspective(0px) rotateX(-90deg) rotateY(0) rotateZ(0deg);
|
242 |
+
}
|
243 |
+
.eae-fb-animate-flipcard.flipcard-rotate-top-down .eae-flip-box-wrapper:hover .eae-flip-box-back {
|
244 |
+
z-index: 99999;
|
245 |
+
transform: perspective(0px) rotateX(0deg) rotateY(0deg) rotateZ(0);
|
246 |
+
}
|
247 |
+
|
248 |
+
|
249 |
+
/* down to top */
|
250 |
+
.flipcard-rotate-down-top .eae-flip-box-front {
|
251 |
+
transform: perspective(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
|
252 |
+
}
|
253 |
+
.flipcard-rotate-down-top .eae-flip-box-back {
|
254 |
+
transform: perspective(0px) rotateX(-90deg) rotateY(0deg) rotateZ(0deg);
|
255 |
+
}
|
256 |
+
.eae-fb-animate-flipcard.flipcard-rotate-down-top .eae-flip-box-wrapper:hover .eae-flip-box-front {
|
257 |
+
transform: perspective(0px) rotateX(90deg) rotateY(0) rotateZ(0deg);
|
258 |
+
}
|
259 |
+
.eae-fb-animate-flipcard.flipcard-rotate-down-top .eae-flip-box-wrapper:hover .eae-flip-box-back {
|
260 |
+
z-index: 99999;
|
261 |
+
transform: perspective(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
|
262 |
+
}
|
263 |
+
|
264 |
+
/* left to right */
|
265 |
+
|
266 |
+
.flipcard-rotate-left-right .eae-flip-box-front {
|
267 |
+
transform: perspective(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
|
268 |
+
}
|
269 |
+
.flipcard-rotate-left-right .eae-flip-box-back {
|
270 |
+
transform: perspective(0px) rotateX(0deg) rotateY(-90deg) rotateZ(0deg);
|
271 |
+
}
|
272 |
+
.eae-fb-animate-flipcard.flipcard-rotate-left-right .eae-flip-box-wrapper:hover .eae-flip-box-front {
|
273 |
+
transform: perspective(0px) rotateX(0deg) rotateY(90deg) rotateZ(0deg);
|
274 |
+
}
|
275 |
+
.eae-fb-animate-flipcard.flipcard-rotate-left-right .eae-flip-box-wrapper:hover .eae-flip-box-back {
|
276 |
+
z-index: 99999;
|
277 |
+
transform: perspective(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
|
278 |
+
}
|
279 |
+
|
280 |
+
/* right to left */
|
281 |
+
|
282 |
+
.flipcard-rotate-right-left .eae-flip-box-front {
|
283 |
+
transform: perspective(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
|
284 |
+
}
|
285 |
+
.flipcard-rotate-right-left .eae-flip-box-back {
|
286 |
+
transform: perspective(0px) rotateX(0deg) rotateY(90deg) rotateZ(0deg);
|
287 |
+
}
|
288 |
+
.eae-fb-animate-flipcard.flipcard-rotate-right-left .eae-flip-box-wrapper:hover .eae-flip-box-front {
|
289 |
+
transform: perspective(0px) rotateX(0deg) rotateY(-90deg) rotateZ(0deg);
|
290 |
+
}
|
291 |
+
.eae-fb-animate-flipcard.flipcard-rotate-right-left .eae-flip-box-wrapper:hover .eae-flip-box-back {
|
292 |
+
z-index: 99999;
|
293 |
+
transform: perspective(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
|
294 |
+
}
|
295 |
+
|
296 |
+
@keyframes batman {
|
297 |
+
0% { transform: scale(1,1) rotateZ(0); }
|
298 |
+
100% {
|
299 |
+
transform: scale(0,0) rotateZ(720deg);
|
300 |
+
opacity: 0;
|
301 |
+
}
|
302 |
+
}
|
303 |
+
|
304 |
+
|
305 |
+
.eae-flip-box-front i, .eae-flip-box-back i{ font-size:32px; height:1em; width:1em; }
|
306 |
+
.eae-fb-icon-view-framed{ border:1px solid #92BE43; }
|
307 |
+
.eae-fb-icon-shape-circle{ border-radius:50%; }
|
308 |
+
.eae-flip-box-wrapper .icon-wrapper{ display:inline-block; padding:10px; line-height: 1; }
|
309 |
+
|
310 |
+
.eae-flip-box-wrapper .front-icon-title, .eae-flip-box-wrapper .back-icon-title{ margin:10px auto; color:#FFF; }
|
311 |
+
|
312 |
+
.eae-flip-box-wrapper .flipbox-content { display: block; position: relative; top: 50%; transform: translateY(-50%); -ms-transform: translateY(-50%) }
|
313 |
+
.flipbox-content p{ margin-bottom: 10px; }
|
314 |
+
.eae-fb-button{ display:inline-block; padding: 5px 10px; }
|
315 |
+
|
316 |
+
.eae-flip-box-front{ background:#A0CE4E; }
|
317 |
+
.eae-flip-box-back{ background:#73B9DC; }
|
318 |
+
|
319 |
+
@media only screen and (max-width: 768px) {
|
320 |
+
|
321 |
+
.flipbox-content, .eae-flip-box-front, .eae-flip-box-back{
|
322 |
+
cursor:pointer;
|
323 |
+
overflow: visible !important;
|
324 |
+
transform-style: preserve-3d;
|
325 |
+
-webkit-transform-style: preserve-3d;
|
326 |
+
}
|
327 |
+
}
|
328 |
+
/**
|
329 |
+
Shape Separator
|
330 |
+
**/
|
331 |
+
.elementor-widget-wts-shape-separator svg{ display: block; }
|
332 |
+
|
333 |
+
/**
|
334 |
+
Post List
|
335 |
+
**/
|
336 |
+
.wts-eae-pl-wrapper ul{
|
337 |
+
margin:0;
|
338 |
+
}
|
339 |
+
.wts-eae-pl-wrapper ul li{
|
340 |
+
list-style: none;
|
341 |
+
overflow: hidden; margin-bottom:10px;
|
342 |
+
}
|
343 |
+
.eae-pl-img-align-none .eae-pl-image-wrapper a{ text-align: center; }
|
344 |
+
.eae-pl-title{ margin:0; }
|
345 |
+
.eae-pl-title a{ display:block; }
|
346 |
+
|
347 |
+
.eae-pl-readmore a{ display:inline-block;
|
348 |
+
border-radius: 2px;
|
349 |
+
color: #fff;
|
350 |
+
padding: 4px 8px;
|
351 |
+
}
|
352 |
+
|
353 |
+
/**
|
354 |
+
Animated Text Styles
|
355 |
+
**/
|
356 |
+
/* --------------------------------
|
357 |
+
Primary style
|
358 |
+
-------------------------------- */
|
359 |
+
|
360 |
+
.eae-at-animation-text-wrapper {
|
361 |
+
display: inline-block;
|
362 |
+
position: relative;
|
363 |
+
text-align: left;
|
364 |
+
}
|
365 |
+
.eae-at-animation-text-wrapper .eae-at-animation-text {
|
366 |
+
display: inline-block;
|
367 |
+
position: absolute;
|
368 |
+
white-space: nowrap;
|
369 |
+
left: 0;
|
370 |
+
top: 0;
|
371 |
+
}
|
372 |
+
.eae-at-animation-text-wrapper .eae-at-animation-text.is-visible {
|
373 |
+
position: relative;
|
374 |
+
}
|
375 |
+
.no-js .eae-at-animation-text-wrapper .eae-at-animation-text {
|
376 |
+
opacity: 0;
|
377 |
+
}
|
378 |
+
.no-js .eae-at-animation-text-wrapper .eae-at-animation-text.is-visible {
|
379 |
+
opacity: 1;
|
380 |
+
}
|
381 |
+
|
382 |
+
.eae-animtext-wrapper{ font-size:40px; }
|
383 |
+
|
384 |
+
|
385 |
+
/**
|
386 |
+
Animated Text Styles
|
387 |
+
**/
|
388 |
+
.eae-st-rest-text {
|
389 |
+
display: inline-block;
|
390 |
+
}
|
391 |
+
.eae-st-split-text {
|
392 |
+
display: inline-block;
|
393 |
+
}
|
394 |
+
|
395 |
+
/* --------------------------------
|
396 |
+
xtype
|
397 |
+
-------------------------------- */
|
398 |
+
.eae-at-animation.type .eae-at-animation-text-wrapper {
|
399 |
+
vertical-align: bottom;
|
400 |
+
overflow: hidden;
|
401 |
+
}
|
402 |
+
.eae-at-animation.type .eae-at-animation-text-wrapper::after {
|
403 |
+
/* vertical bar */
|
404 |
+
content: '';
|
405 |
+
position: absolute;
|
406 |
+
right: 0;
|
407 |
+
top: 50%;
|
408 |
+
bottom: auto;
|
409 |
+
-webkit-transform: translateY(-50%);
|
410 |
+
-moz-transform: translateY(-50%);
|
411 |
+
-ms-transform: translateY(-50%);
|
412 |
+
-o-transform: translateY(-50%);
|
413 |
+
transform: translateY(-50%);
|
414 |
+
height: 90%;
|
415 |
+
width: 1px;
|
416 |
+
}
|
417 |
+
.eae-at-animation.type .eae-at-animation-text-wrapper.waiting::after {
|
418 |
+
-webkit-animation: cd-pulse 1s infinite;
|
419 |
+
-moz-animation: cd-pulse 1s infinite;
|
420 |
+
animation: cd-pulse 1s infinite;
|
421 |
+
}
|
422 |
+
|
423 |
+
.eae-at-animation.type .eae-at-animation-text-wrapper.selected::after {
|
424 |
+
visibility: hidden;
|
425 |
+
}
|
426 |
+
|
427 |
+
.eae-at-animation.type .eae-at-animation-text {
|
428 |
+
visibility: hidden;
|
429 |
+
}
|
430 |
+
.eae-at-animation.type .eae-at-animation-text.is-visible {
|
431 |
+
visibility: visible;
|
432 |
+
}
|
433 |
+
.eae-at-animation.type i {
|
434 |
+
position: absolute;
|
435 |
+
visibility: hidden;
|
436 |
+
}
|
437 |
+
.eae-at-animation.type i.in {
|
438 |
+
position: relative;
|
439 |
+
visibility: visible;
|
440 |
+
}
|
441 |
+
|
442 |
+
@-webkit-keyframes cd-pulse {
|
443 |
+
0% {
|
444 |
+
-webkit-transform: translateY(-50%) scale(1);
|
445 |
+
opacity: 1;
|
446 |
+
}
|
447 |
+
40% {
|
448 |
+
-webkit-transform: translateY(-50%) scale(0.9);
|
449 |
+
opacity: 0;
|
450 |
+
}
|
451 |
+
100% {
|
452 |
+
-webkit-transform: translateY(-50%) scale(0);
|
453 |
+
opacity: 0;
|
454 |
+
}
|
455 |
+
}
|
456 |
+
@-moz-keyframes cd-pulse {
|
457 |
+
0% {
|
458 |
+
-moz-transform: translateY(-50%) scale(1);
|
459 |
+
opacity: 1;
|
460 |
+
}
|
461 |
+
40% {
|
462 |
+
-moz-transform: translateY(-50%) scale(0.9);
|
463 |
+
opacity: 0;
|
464 |
+
}
|
465 |
+
100% {
|
466 |
+
-moz-transform: translateY(-50%) scale(0);
|
467 |
+
opacity: 0;
|
468 |
+
}
|
469 |
+
}
|
470 |
+
@keyframes cd-pulse {
|
471 |
+
0% {
|
472 |
+
-webkit-transform: translateY(-50%) scale(1);
|
473 |
+
-moz-transform: translateY(-50%) scale(1);
|
474 |
+
-ms-transform: translateY(-50%) scale(1);
|
475 |
+
-o-transform: translateY(-50%) scale(1);
|
476 |
+
transform: translateY(-50%) scale(1);
|
477 |
+
opacity: 1;
|
478 |
+
}
|
479 |
+
40% {
|
480 |
+
-webkit-transform: translateY(-50%) scale(0.9);
|
481 |
+
-moz-transform: translateY(-50%) scale(0.9);
|
482 |
+
-ms-transform: translateY(-50%) scale(0.9);
|
483 |
+
-o-transform: translateY(-50%) scale(0.9);
|
484 |
+
transform: translateY(-50%) scale(0.9);
|
485 |
+
opacity: 0;
|
486 |
+
}
|
487 |
+
100% {
|
488 |
+
-webkit-transform: translateY(-50%) scale(0);
|
489 |
+
-moz-transform: translateY(-50%) scale(0);
|
490 |
+
-ms-transform: translateY(-50%) scale(0);
|
491 |
+
-o-transform: translateY(-50%) scale(0);
|
492 |
+
transform: translateY(-50%) scale(0);
|
493 |
+
opacity: 0;
|
494 |
+
}
|
495 |
+
}
|
496 |
+
|
497 |
+
/**
|
498 |
+
Advanced tabs
|
499 |
+
**/
|
500 |
+
/* --------------------------------
|
501 |
+
Primary style
|
502 |
+
-------------------------------- */
|
503 |
+
.eae-tabs {
|
504 |
+
position: relative;
|
505 |
+
width: 100%;
|
506 |
+
overflow: hidden;
|
507 |
+
margin: 1em 0 2em;
|
508 |
+
font-weight: 300;
|
509 |
+
}
|
510 |
+
|
511 |
+
/* Nav */
|
512 |
+
.eae-tabs nav {
|
513 |
+
text-align: center;
|
514 |
+
line-height: 0;
|
515 |
+
}
|
516 |
+
|
517 |
+
.eae-tabs nav ul {
|
518 |
+
padding: 0;
|
519 |
+
margin: 0;
|
520 |
+
list-style: none;
|
521 |
+
display: inline-block;
|
522 |
+
}
|
523 |
+
|
524 |
+
.eae-tabs nav ul li {
|
525 |
+
border: 1px solid #becbd2;
|
526 |
+
border-bottom: none;
|
527 |
+
display: block;
|
528 |
+
position: relative;
|
529 |
+
}
|
530 |
+
|
531 |
+
.eae-tabs nav li.tab-current {
|
532 |
+
border: 1px solid #47a3da;
|
533 |
+
border-bottom: none;
|
534 |
+
z-index: 100;
|
535 |
+
}
|
536 |
+
|
537 |
+
.eae-nav-pos-top nav li.tab-current:before,
|
538 |
+
.eae-nav-pos-top nav li.tab-current:after {
|
539 |
+
content: '';
|
540 |
+
position: absolute;
|
541 |
+
height: 2px;
|
542 |
+
right: 100%;
|
543 |
+
bottom: 0;
|
544 |
+
width: 1000px;
|
545 |
+
background: #47a3da;
|
546 |
+
}
|
547 |
+
|
548 |
+
.eae-nav-pos-top nav ul li{
|
549 |
+
margin: 0 0.25em;
|
550 |
+
float: left;
|
551 |
+
}
|
552 |
+
.eae-nav-pos-top nav li.tab-current:after {
|
553 |
+
right: auto;
|
554 |
+
left: 100%;
|
555 |
+
width: 4000px;
|
556 |
+
}
|
557 |
+
|
558 |
+
.eae-tabs nav a {
|
559 |
+
display: block;
|
560 |
+
line-height: 2.5;
|
561 |
+
padding: 0 1.25em;
|
562 |
+
white-space: nowrap;
|
563 |
+
}
|
564 |
+
.eae-tabs nav i {
|
565 |
+
line-height: 2.5;
|
566 |
+
padding: 1px;
|
567 |
+
}
|
568 |
+
|
569 |
+
.eae-tabs nav a:hover {
|
570 |
+
color: #768e9d;
|
571 |
+
}
|
572 |
+
|
573 |
+
.eae-tabs nav li.tab-current a {
|
574 |
+
color: #47a3da;
|
575 |
+
}
|
576 |
+
|
577 |
+
.eae-nav-pos-left nav {
|
578 |
+
float:left;
|
579 |
+
width: 20%;
|
580 |
+
}
|
581 |
+
.eae-nav-pos-left nav ul li{
|
582 |
+
margin:0 0 10px 0;
|
583 |
+
}
|
584 |
+
.eae-nav-pos-left .eae-content{
|
585 |
+
float:left;
|
586 |
+
width: 80%;
|
587 |
+
padding-left: 5px;
|
588 |
+
}
|
589 |
+
/* Icons */
|
590 |
+
.eae-tabs nav a:before {
|
591 |
+
display: inline-block;
|
592 |
+
vertical-align: middle;
|
593 |
+
text-transform: none;
|
594 |
+
font-weight: normal;
|
595 |
+
font-variant: normal;
|
596 |
+
font-family: 'icomoon';
|
597 |
+
line-height: 1;
|
598 |
+
speak: none;
|
599 |
+
-webkit-font-smoothing: antialiased;
|
600 |
+
margin: -0.25em 0.4em 0 0;
|
601 |
+
}
|
602 |
+
|
603 |
+
/* Content */
|
604 |
+
.eae-content section {
|
605 |
+
font-size: 1.25em;
|
606 |
+
padding: 20px 20px;
|
607 |
+
max-width: 1230px;
|
608 |
+
margin: 0 auto;
|
609 |
+
}
|
610 |
+
|
611 |
+
.eae-content section:before,
|
612 |
+
.eae-content section:after {
|
613 |
+
content: '';
|
614 |
+
display: table;
|
615 |
+
}
|
616 |
+
|
617 |
+
.eae-content section:after {
|
618 |
+
clear: both;
|
619 |
+
}
|
620 |
+
|
621 |
+
/* Fallback example */
|
622 |
+
.eae-no-js .content section {
|
623 |
+
display: block;
|
624 |
+
padding-bottom: 2em;
|
625 |
+
border-bottom: 1px solid #47a3da;
|
626 |
+
}
|
627 |
+
|
628 |
+
.eae-content section.content-current {
|
629 |
+
display: block;
|
630 |
+
}
|
631 |
+
|
632 |
+
|
633 |
+
/* Example media queries */
|
634 |
+
|
635 |
+
@media screen and (max-width: 52.375em) {
|
636 |
+
.text-mobile-no.eae-tabs nav a span {
|
637 |
+
display : none;
|
638 |
+
}
|
639 |
+
|
640 |
+
.eae-tabs nav a:before {
|
641 |
+
margin-right: 0;
|
642 |
+
}
|
643 |
+
}
|
644 |
+
|
645 |
+
@media screen and (max-width: 32em) {
|
646 |
+
.eae-tabs nav ul,
|
647 |
+
.eae-tabs nav ul li a {
|
648 |
+
width: 100%;
|
649 |
+
padding: 0;
|
650 |
+
}
|
651 |
+
|
652 |
+
.eae-tabs nav ul li {
|
653 |
+
width: 25%;
|
654 |
+
margin: 0 0 0 0px;
|
655 |
+
}
|
656 |
+
|
657 |
+
.eae-nav-pos-left .eae-tabs nav ul li {
|
658 |
+
width: 100%;
|
659 |
+
margin-bottom: 10px;
|
660 |
+
}
|
661 |
+
|
662 |
+
}
|
663 |
+
|
664 |
+
/**
|
665 |
+
After Before Image
|
666 |
+
**/
|
667 |
+
/* --------------------------------
|
668 |
+
Primary style
|
669 |
+
-------------------------------- */
|
670 |
+
.eae-img-comp-container {
|
671 |
+
width: 100%;
|
672 |
+
position: relative;
|
673 |
+
text-align: center;
|
674 |
+
}
|
675 |
+
.eae-img-comp-container img {
|
676 |
+
vertical-align: middle ;
|
677 |
+
}
|
678 |
+
.eae-img-comp-img {
|
679 |
+
/*position: absolute;
|
680 |
+
width: 100%;
|
681 |
+
height: 100%;
|
682 |
+
overflow:hidden;*/
|
683 |
+
|
684 |
+
position: absolute;
|
685 |
+
top: 0px;
|
686 |
+
left: 0px;
|
687 |
+
height: 100%;
|
688 |
+
width: 100%;
|
689 |
+
overflow: hidden;
|
690 |
+
transform: translateZ(0px);
|
691 |
+
backface-visibility: hidden;
|
692 |
+
}
|
693 |
+
.eae-img-comp-img img{
|
694 |
+
display: block;
|
695 |
+
max-width: 100%;
|
696 |
+
width: 100%;
|
697 |
+
}
|
698 |
+
.eae-img-comp-slider {
|
699 |
+
position: absolute;
|
700 |
+
z-index:9;
|
701 |
+
/*set the appearance of the slider:*/
|
702 |
+
width: 40px;
|
703 |
+
height: 40px;
|
704 |
+
background-color: #2196F3;
|
705 |
+
opacity: 1.0;
|
706 |
+
border-radius: 50%;
|
707 |
+
}
|
708 |
+
.icon-horizontal{
|
709 |
+
cursor: ew-resize;
|
710 |
+
}
|
711 |
+
.icon-vertical{
|
712 |
+
cursor: n-resize;
|
713 |
+
}
|
714 |
+
|
715 |
+
.eae-img-comp-overlay{
|
716 |
+
|
717 |
+
}
|
718 |
+
.mode-horizontal .eae-img-comp-overlay img{
|
719 |
+
position: absolute;
|
720 |
+
left: 0;
|
721 |
+
top: 0;
|
722 |
+
display: block;
|
723 |
+
width: auto;
|
724 |
+
height: 100%!important;
|
725 |
+
max-width: none!important;
|
726 |
+
}
|
727 |
+
|
728 |
+
.mode-vertical .eae-img-comp-overlay img{
|
729 |
+
position: absolute;
|
730 |
+
left: 0;
|
731 |
+
top: 0;
|
732 |
+
display: block;
|
733 |
+
width: 100%;
|
734 |
+
height: auto !important;
|
735 |
+
max-width: none!important;
|
736 |
+
}
|
737 |
+
|
738 |
+
|
739 |
+
.eae-slider-icon{
|
740 |
+
top: 50%;
|
741 |
+
transform: translateY(-50%) translateX(-50%);
|
742 |
+
position: absolute;
|
743 |
+
left: 50%;
|
744 |
+
color:white;
|
745 |
+
}
|
746 |
+
.elementor-widget-wts-ab-image{
|
747 |
+
text-align: center;
|
748 |
+
}
|
749 |
+
.elementor-widget-wts-ab-image .elementor-widget-container{
|
750 |
+
display: inline-block;
|
751 |
+
margin: 0 auto !important;
|
752 |
+
overflow: hidden;
|
753 |
+
}
|
754 |
+
|
755 |
+
.eae-text-before{
|
756 |
+
position: absolute!important;
|
757 |
+
padding: 10px;
|
758 |
+
transition: transform .3s .7s,opacity .3s .7s;
|
759 |
+
color: #d36118;
|
760 |
+
z-index: 0;
|
761 |
+
background: rgba(255,255,255,0.5);
|
762 |
+
margin: 20px;
|
763 |
+
}
|
764 |
+
|
765 |
+
.eae-text-after{
|
766 |
+
position: absolute!important;
|
767 |
+
padding: 10px;
|
768 |
+
transition: transform .3s .7s,opacity .3s .7s;
|
769 |
+
color: #d36118;
|
770 |
+
z-index: 0;
|
771 |
+
background: rgba(255,255,255,0.5);
|
772 |
+
margin: 20px;
|
773 |
+
}
|
774 |
+
|
775 |
+
/* Test CSS */
|
776 |
+
|
777 |
+
.divTest{
|
778 |
+
display: inline-block;
|
779 |
+
background-color: #00a0d2;
|
780 |
+
padding: 20px;
|
781 |
+
}
|
782 |
+
|
783 |
+
|
784 |
+
.eae-particle-wrapper{
|
785 |
+
width:100%;
|
786 |
+
height:100%;
|
787 |
+
position: absolute;
|
788 |
+
left:0;
|
789 |
+
top:0;
|
790 |
+
}
|
791 |
+
|
792 |
+
|
793 |
+
.particles-js-canvas-el{ height:100%; position:absolute; }
|
794 |
+
|
795 |
+
/**
|
796 |
+
BG Slider
|
797 |
+
**/
|
798 |
+
.eae-section-bs{ position: absolute; width: 100%; height: 100%; top:0;}
|
799 |
+
.eae-section-bs-inner{ width: 100%; height: 100%; }
|
800 |
+
|
801 |
+
|
802 |
+
/**
|
803 |
+
Popup
|
804 |
+
**/
|
805 |
+
.eae-popup.mfp-bg {
|
806 |
+
top: 0;
|
807 |
+
left: 0;
|
808 |
+
width: 100%;
|
809 |
+
height: 100%;
|
810 |
+
z-index: 1042;
|
811 |
+
overflow: hidden;
|
812 |
+
position: fixed;
|
813 |
+
background: #0b0b0b;
|
814 |
+
opacity: 0.8; }
|
815 |
+
|
816 |
+
.eae-popup-link{
|
817 |
+
padding: 10px;
|
818 |
+
color: #fff;
|
819 |
+
display: inline-block;
|
820 |
+
}
|
821 |
+
.eae-popup-link:hover{
|
822 |
+
color: #fff;
|
823 |
+
}
|
824 |
+
.eae-popup.mfp-wrap {
|
825 |
+
top: 0;
|
826 |
+
left: 0;
|
827 |
+
width: 100%;
|
828 |
+
height: 100%;
|
829 |
+
z-index: 1043;
|
830 |
+
position: fixed;
|
831 |
+
outline: none !important;
|
832 |
+
-webkit-backface-visibility: hidden; }
|
833 |
+
|
834 |
+
.eae-popup .mfp-container {
|
835 |
+
text-align: center;
|
836 |
+
position: absolute;
|
837 |
+
width: 100%;
|
838 |
+
height: 100%;
|
839 |
+
left: 0;
|
840 |
+
top: 0;
|
841 |
+
padding: 0 8px;
|
842 |
+
box-sizing: border-box; }
|
843 |
+
|
844 |
+
.eae-popup .mfp-container:before {
|
845 |
+
content: '';
|
846 |
+
display: inline-block;
|
847 |
+
height: 100%;
|
848 |
+
vertical-align: middle; }
|
849 |
+
|
850 |
+
.eae-popup .mfp-align-top .mfp-container:before {
|
851 |
+
display: none; }
|
852 |
+
|
853 |
+
.eae-popup .mfp-content {
|
854 |
+
position: relative;
|
855 |
+
display: inline-block;
|
856 |
+
vertical-align: middle;
|
857 |
+
margin: 0 auto;
|
858 |
+
text-align: left;
|
859 |
+
z-index: 1045;
|
860 |
+
|
861 |
+
}
|
862 |
+
.eae-modal-content{
|
863 |
+
padding: 20px;
|
864 |
+
}
|
865 |
+
.eae-pop-btn-align-left .eae-popup-wrapper{
|
866 |
+
text-align: left;
|
867 |
+
}
|
868 |
+
.eae-pop-btn-align-right .eae-popup-wrapper{
|
869 |
+
text-align: right;
|
870 |
+
}
|
871 |
+
.eae-pop-btn-align-center .eae-popup-wrapper{
|
872 |
+
text-align: center;
|
873 |
+
}
|
874 |
+
.eae-pop-btn-align-justify .eae-popup-wrapper{
|
875 |
+
text-align: center;
|
876 |
+
}
|
877 |
+
.eae-pop-btn-align-justify .eae-popup-wrapper a{
|
878 |
+
display: block;
|
879 |
+
}
|
880 |
+
.eae-popup .mfp-inline-holder .mfp-content,
|
881 |
+
.eae-popup .mfp-ajax-holder .mfp-content {
|
882 |
+
width: 50%;
|
883 |
+
background-color: #fff;
|
884 |
+
cursor: auto;
|
885 |
+
overflow: hidden;
|
886 |
+
}
|
887 |
+
|
888 |
+
.eae-popup .mfp-ajax-cur {
|
889 |
+
cursor: progress; }
|
890 |
+
|
891 |
+
.eae-popup .mfp-zoom-out-cur, .eae-popup .mfp-zoom-out-cur .mfp-image-holder .eae-close {
|
892 |
+
cursor: -moz-zoom-out;
|
893 |
+
cursor: -webkit-zoom-out;
|
894 |
+
cursor: zoom-out; }
|
895 |
+
|
896 |
+
.eae-popup .mfp-zoom {
|
897 |
+
cursor: pointer;
|
898 |
+
cursor: -webkit-zoom-in;
|
899 |
+
cursor: -moz-zoom-in;
|
900 |
+
cursor: zoom-in; }
|
901 |
+
|
902 |
+
.eae-popup.mfp-auto-cursor .mfp-content {
|
903 |
+
cursor: auto; }
|
904 |
+
|
905 |
+
.eae-popup .eae-close,
|
906 |
+
.eae-popup .mfp-arrow,
|
907 |
+
.eae-popup .mfp-preloader,
|
908 |
+
.eae-popup .mfp-counter {
|
909 |
+
-webkit-user-select: none;
|
910 |
+
-moz-user-select: none;
|
911 |
+
user-select: none; }
|
912 |
+
|
913 |
+
.mfp-loading.mfp-figure {
|
914 |
+
display: none; }
|
915 |
+
|
916 |
+
.mfp-hide {
|
917 |
+
display: none !important; }
|
918 |
+
|
919 |
+
.eae-popup .mfp-preloader {
|
920 |
+
color: #CCC;
|
921 |
+
position: absolute;
|
922 |
+
top: 50%;
|
923 |
+
width: auto;
|
924 |
+
text-align: center;
|
925 |
+
margin-top: -0.8em;
|
926 |
+
left: 8px;
|
927 |
+
right: 8px;
|
928 |
+
z-index: 1044; }
|
929 |
+
.eae-popup .mfp-preloader a {
|
930 |
+
color: #CCC; }
|
931 |
+
.eae-popup .mfp-preloader a:hover {
|
932 |
+
color: #FFF; }
|
933 |
+
|
934 |
+
.mfp-s-ready .mfp-preloader {
|
935 |
+
display: none; }
|
936 |
+
|
937 |
+
.mfp-s-error .mfp-content {
|
938 |
+
display: none; }
|
939 |
+
|
940 |
+
button.eae-close,
|
941 |
+
button.mfp-arrow {
|
942 |
+
overflow: visible;
|
943 |
+
cursor: pointer;
|
944 |
+
background: transparent;
|
945 |
+
border: 0;
|
946 |
+
-webkit-appearance: none;
|
947 |
+
display: block;
|
948 |
+
outline: none;
|
949 |
+
padding: 0;
|
950 |
+
z-index: 1046;
|
951 |
+
box-shadow: none;
|
952 |
+
touch-action: manipulation; }
|
953 |
+
|
954 |
+
button::-moz-focus-inner {
|
955 |
+
padding: 0;
|
956 |
+
border: 0; }
|
957 |
+
|
958 |
+
.eae-popup .eae-close {
|
959 |
+
width: 44px;
|
960 |
+
height: 44px;
|
961 |
+
line-height: 1em;
|
962 |
+
position: absolute;
|
963 |
+
right: 0;
|
964 |
+
top: 0;
|
965 |
+
text-decoration: none;
|
966 |
+
text-align: center;
|
967 |
+
opacity: 1.00;
|
968 |
+
padding: 0 0 18px 10px;
|
969 |
+
color: #FFF;
|
970 |
+
font-size: 28px; }
|
971 |
+
.eae-close:hover,
|
972 |
+
.eae-close:focus {
|
973 |
+
opacity: 1;
|
974 |
+
cursor: pointer;
|
975 |
+
}
|
976 |
+
.eae-close:active {
|
977 |
+
top: 1px; }
|
978 |
+
.eae-close:before{
|
979 |
+
top: 50%;
|
980 |
+
left: 50%;
|
981 |
+
position: absolute;
|
982 |
+
transform: translate(-50%,-50%);
|
983 |
+
}
|
984 |
+
.eae-popup.eae-close-btn-in .eae-close {
|
985 |
+
color: #fff;
|
986 |
+
padding-right: 10px;
|
987 |
+
}
|
988 |
+
|
989 |
+
.mfp-image-holder .eae-close,
|
990 |
+
.mfp-iframe-holder .eae-close {
|
991 |
+
color: #FFF;
|
992 |
+
right: -6px;
|
993 |
+
text-align: right;
|
994 |
+
padding-right: 6px;
|
995 |
+
width: 100%; }
|
996 |
+
|
997 |
+
.mfp-counter {
|
998 |
+
position: absolute;
|
999 |
+
top: 0;
|
1000 |
+
right: 0;
|
1001 |
+
color: #CCC;
|
1002 |
+
font-size: 12px;
|
1003 |
+
line-height: 18px;
|
1004 |
+
white-space: nowrap; }
|
1005 |
+
|
1006 |
+
.mfp-arrow {
|
1007 |
+
position: absolute;
|
1008 |
+
opacity: 0.65;
|
1009 |
+
margin: 0;
|
1010 |
+
top: 50%;
|
1011 |
+
margin-top: -55px;
|
1012 |
+
padding: 0;
|
1013 |
+
width: 90px;
|
1014 |
+
height: 110px;
|
1015 |
+
-webkit-tap-highlight-color: transparent; }
|
1016 |
+
.mfp-arrow:active {
|
1017 |
+
margin-top: -54px; }
|
1018 |
+
.mfp-arrow:hover,
|
1019 |
+
.mfp-arrow:focus {
|
1020 |
+
opacity: 1; }
|
1021 |
+
.mfp-arrow:before,
|
1022 |
+
.mfp-arrow:after {
|
1023 |
+
content: '';
|
1024 |
+
display: block;
|
1025 |
+
width: 0;
|
1026 |
+
height: 0;
|
1027 |
+
position: absolute;
|
1028 |
+
left: 0;
|
1029 |
+
top: 0;
|
1030 |
+
margin-top: 35px;
|
1031 |
+
margin-left: 35px;
|
1032 |
+
border: medium inset transparent; }
|
1033 |
+
.mfp-arrow:after {
|
1034 |
+
border-top-width: 13px;
|
1035 |
+
border-bottom-width: 13px;
|
1036 |
+
top: 8px; }
|
1037 |
+
.mfp-arrow:before {
|
1038 |
+
border-top-width: 21px;
|
1039 |
+
border-bottom-width: 21px;
|
1040 |
+
opacity: 0.7; }
|
1041 |
+
|
1042 |
+
.mfp-arrow-left {
|
1043 |
+
left: 0; }
|
1044 |
+
.mfp-arrow-left:after {
|
1045 |
+
border-right: 17px solid #FFF;
|
1046 |
+
margin-left: 31px; }
|
1047 |
+
.mfp-arrow-left:before {
|
1048 |
+
margin-left: 25px;
|
1049 |
+
border-right: 27px solid #3F3F3F; }
|
1050 |
+
|
1051 |
+
.mfp-arrow-right {
|
1052 |
+
right: 0; }
|
1053 |
+
.mfp-arrow-right:after {
|
1054 |
+
border-left: 17px solid #FFF;
|
1055 |
+
margin-left: 39px; }
|
1056 |
+
.mfp-arrow-right:before {
|
1057 |
+
border-left: 27px solid #3F3F3F; }
|
1058 |
+
|
1059 |
+
.mfp-iframe-holder {
|
1060 |
+
padding-top: 40px;
|
1061 |
+
padding-bottom: 40px; }
|
1062 |
+
.mfp-iframe-holder .mfp-content {
|
1063 |
+
line-height: 0;
|
1064 |
+
width: 100%;
|
1065 |
+
max-width: 900px; }
|
1066 |
+
.mfp-iframe-holder .eae-close {
|
1067 |
+
top: -40px; }
|
1068 |
+
|
1069 |
+
.mfp-iframe-scaler {
|
1070 |
+
width: 100%;
|
1071 |
+
height: 0;
|
1072 |
+
overflow: hidden;
|
1073 |
+
padding-top: 56.25%; }
|
1074 |
+
.mfp-iframe-scaler iframe {
|
1075 |
+
position: absolute;
|
1076 |
+
display: block;
|
1077 |
+
top: 0;
|
1078 |
+
left: 0;
|
1079 |
+
width: 100%;
|
1080 |
+
height: 100%;
|
1081 |
+
box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
|
1082 |
+
background: #000; }
|
1083 |
+
|
1084 |
+
/* Main image in popup */
|
1085 |
+
img.mfp-img {
|
1086 |
+
width: auto;
|
1087 |
+
max-width: 100%;
|
1088 |
+
height: auto;
|
1089 |
+
display: block;
|
1090 |
+
line-height: 0;
|
1091 |
+
box-sizing: border-box;
|
1092 |
+
padding: 40px 0 40px;
|
1093 |
+
margin: 0 auto; }
|
1094 |
+
|
1095 |
+
/* The shadow behind the image */
|
1096 |
+
.eae-popup .mfp-figure {
|
1097 |
+
line-height: 0; }
|
1098 |
+
.eae-popup .mfp-figure:after {
|
1099 |
+
content: '';
|
1100 |
+
position: absolute;
|
1101 |
+
left: 0;
|
1102 |
+
top: 40px;
|
1103 |
+
bottom: 40px;
|
1104 |
+
display: block;
|
1105 |
+
right: 0;
|
1106 |
+
width: auto;
|
1107 |
+
height: auto;
|
1108 |
+
z-index: -1;
|
1109 |
+
box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
|
1110 |
+
background: #444; }
|
1111 |
+
.eae-popup .mfp-figure small {
|
1112 |
+
color: #BDBDBD;
|
1113 |
+
display: block;
|
1114 |
+
font-size: 12px;
|
1115 |
+
line-height: 14px; }
|
1116 |
+
.eae-popup .mfp-figure figure {
|
1117 |
+
margin: 0; }
|
1118 |
+
|
1119 |
+
.eae-popup .mfp-bottom-bar {
|
1120 |
+
margin-top: -36px;
|
1121 |
+
position: absolute;
|
1122 |
+
top: 100%;
|
1123 |
+
left: 0;
|
1124 |
+
width: 100%;
|
1125 |
+
cursor: auto; }
|
1126 |
+
|
1127 |
+
.eae-popup .mfp-title {
|
1128 |
+
text-align: left;
|
1129 |
+
line-height: 1;
|
1130 |
+
word-wrap: break-word;
|
1131 |
+
color: #ffffff;
|
1132 |
+
background-color: #4054b2;
|
1133 |
+
padding: 20px 20px 20px 20px;
|
1134 |
+
}
|
1135 |
+
|
1136 |
+
.eae-popup .mfp-image-holder .mfp-content {
|
1137 |
+
max-width: 100%; }
|
1138 |
+
|
1139 |
+
.eae-popup .mfp-gallery .mfp-image-holder .mfp-figure {
|
1140 |
+
cursor: pointer; }
|
1141 |
+
|
1142 |
+
@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
|
1143 |
+
/**
|
1144 |
+
* Remove all paddings around the image on small screen
|
1145 |
+
*/
|
1146 |
+
.mfp-img-mobile .mfp-image-holder {
|
1147 |
+
padding-left: 0;
|
1148 |
+
padding-right: 0; }
|
1149 |
+
.mfp-img-mobile img.mfp-img {
|
1150 |
+
padding: 0; }
|
1151 |
+
.mfp-img-mobile .mfp-figure:after {
|
1152 |
+
top: 0;
|
1153 |
+
bottom: 0; }
|
1154 |
+
.mfp-img-mobile .mfp-figure small {
|
1155 |
+
display: inline;
|
1156 |
+
margin-left: 5px; }
|
1157 |
+
.mfp-img-mobile .mfp-bottom-bar {
|
1158 |
+
background: rgba(0, 0, 0, 0.6);
|
1159 |
+
bottom: 0;
|
1160 |
+
margin: 0;
|
1161 |
+
top: auto;
|
1162 |
+
padding: 3px 5px;
|
1163 |
+
position: fixed;
|
1164 |
+
box-sizing: border-box; }
|
1165 |
+
.mfp-img-mobile .mfp-bottom-bar:empty {
|
1166 |
+
padding: 0; }
|
1167 |
+
.mfp-img-mobile .mfp-counter {
|
1168 |
+
right: 5px;
|
1169 |
+
top: 3px; }
|
1170 |
+
.mfp-img-mobile .eae-close {
|
1171 |
+
top: 0;
|
1172 |
+
right: 0;
|
1173 |
+
width: 35px;
|
1174 |
+
height: 35px;
|
1175 |
+
line-height: 35px;
|
1176 |
+
background: rgba(0, 0, 0, 0.6);
|
1177 |
+
position: fixed;
|
1178 |
+
text-align: center;
|
1179 |
+
padding: 0; } }
|
1180 |
+
|
1181 |
+
@media all and (max-width: 900px) {
|
1182 |
+
.mfp-arrow {
|
1183 |
+
-webkit-transform: scale(0.75);
|
1184 |
+
transform: scale(0.75); }
|
1185 |
+
.mfp-arrow-left {
|
1186 |
+
-webkit-transform-origin: 0;
|
1187 |
+
transform-origin: 0; }
|
1188 |
+
.mfp-arrow-right {
|
1189 |
+
-webkit-transform-origin: 100%;
|
1190 |
+
transform-origin: 100%; }
|
1191 |
+
.mfp-container {
|
1192 |
+
padding-left: 6px;
|
1193 |
+
padding-right: 6px; } }
|
assets/js/animated-main.js
CHANGED
@@ -1,135 +1,135 @@
|
|
1 |
-
//jQuery.noConflict();
|
2 |
-
|
3 |
-
jQuery(document).on('elementor/render/animation-text',function(e){
|
4 |
-
jQuery(".eae-at-animation-text-wrapper .eae-at-animation-text:first-child").addClass("is-visible");
|
5 |
-
|
6 |
-
//set animation timing
|
7 |
-
var animationDelay = 2500,
|
8 |
-
//loading bar effect
|
9 |
-
barAnimationDelay = 3800,
|
10 |
-
barWaiting = barAnimationDelay - 3000, //3000 is the duration of the transition on the loading bar - set in the scss/css file
|
11 |
-
//letters effect
|
12 |
-
lettersDelay = 50,
|
13 |
-
//type effect
|
14 |
-
typeLettersDelay = 150,
|
15 |
-
selectionDuration = 500,
|
16 |
-
typeAnimationDelay = selectionDuration + 800,
|
17 |
-
//clip effect
|
18 |
-
revealDuration = 600,
|
19 |
-
revealAnimationDelay = 1500;
|
20 |
-
|
21 |
-
initHeadline();
|
22 |
-
|
23 |
-
|
24 |
-
function initHeadline() {
|
25 |
-
//insert <i> element for each letter of a changing word
|
26 |
-
singleLetters(jQuery('.eae-at-animation.letters').find('.eae-at-animation-text'));
|
27 |
-
//initialise headline animation
|
28 |
-
animateHeadline(jQuery('.eae-at-animation-text-wrapper'));
|
29 |
-
}
|
30 |
-
|
31 |
-
function singleLetters($words) {
|
32 |
-
$words.each(function(){
|
33 |
-
var word = jQuery(this),
|
34 |
-
letters = word.text().split(''),
|
35 |
-
selected = word.hasClass('is-visible');
|
36 |
-
for (i in letters) {
|
37 |
-
letters[i] = (selected) ? '<i class="in">' + letters[i] + '</i>': '<i>' + letters[i] + '</i>';
|
38 |
-
}
|
39 |
-
var newLetters = letters.join('');
|
40 |
-
word.html(newLetters).css('opacity', 1);
|
41 |
-
});
|
42 |
-
}
|
43 |
-
|
44 |
-
function animateHeadline($headlines) {
|
45 |
-
var duration = animationDelay;
|
46 |
-
|
47 |
-
$headlines.each(function(){
|
48 |
-
var headline = jQuery(this);
|
49 |
-
|
50 |
-
if (!headline.hasClass('type') ) {
|
51 |
-
//assign to .eae-at-animation-text-wrapper the width of its longest word
|
52 |
-
var words = headline.find('.eae-at-animation-text-wrapper .eae-at-animation-text'),
|
53 |
-
width = 0;
|
54 |
-
words.each(function(){
|
55 |
-
var wordWidth = jQuery(this).width();
|
56 |
-
if (wordWidth > width) width = wordWidth;
|
57 |
-
});
|
58 |
-
headline.find('.eae-at-animation-text-wrapper').css('width', width);
|
59 |
-
};
|
60 |
-
|
61 |
-
//trigger animation
|
62 |
-
setTimeout(function(){ hideWord( headline.find('.is-visible').eq(0) ) }, duration);
|
63 |
-
});
|
64 |
-
}
|
65 |
-
|
66 |
-
function hideWord($word) {
|
67 |
-
console.log($word);
|
68 |
-
var nextWord = takeNext($word);
|
69 |
-
|
70 |
-
if($word.parents('.eae-at-animation').hasClass('type')) {
|
71 |
-
var parentSpan = $word.parent('.eae-at-animation-text-wrapper');
|
72 |
-
parentSpan.addClass('selected').removeClass('waiting');
|
73 |
-
setTimeout(function(){
|
74 |
-
parentSpan.removeClass('selected');
|
75 |
-
$word.removeClass('is-visible').addClass('is-hidden').children('i').removeClass('in').addClass('out');
|
76 |
-
}, selectionDuration);
|
77 |
-
setTimeout(function(){ showWord(nextWord, typeLettersDelay) }, typeAnimationDelay);
|
78 |
-
} else if($word.parents('.eae-at-animation').hasClass('letters')) {
|
79 |
-
var bool = ($word.children('i').length >= nextWord.children('i').length) ? true : false;
|
80 |
-
hideLetter($word.find('i').eq(0), $word, bool, lettersDelay);
|
81 |
-
showLetter(nextWord.find('i').eq(0), nextWord, bool, lettersDelay);
|
82 |
-
|
83 |
-
} else {
|
84 |
-
switchWord($word, nextWord);
|
85 |
-
setTimeout(function(){ hideWord(nextWord) }, animationDelay);
|
86 |
-
}
|
87 |
-
}
|
88 |
-
|
89 |
-
function showWord($word, $duration) {
|
90 |
-
if($word.parents('.eae-at-animation').hasClass('type')) {
|
91 |
-
showLetter($word.find('i').eq(0), $word, false, $duration);
|
92 |
-
$word.addClass('is-visible').removeClass('is-hidden');
|
93 |
-
|
94 |
-
}
|
95 |
-
}
|
96 |
-
|
97 |
-
function hideLetter($letter, $word, $bool, $duration) {
|
98 |
-
$letter.removeClass('in').addClass('out');
|
99 |
-
|
100 |
-
if(!$letter.is(':last-child')) {
|
101 |
-
setTimeout(function(){ hideLetter($letter.next(), $word, $bool, $duration); }, $duration);
|
102 |
-
} else if($bool) {
|
103 |
-
setTimeout(function(){ hideWord(takeNext($word)) }, animationDelay);
|
104 |
-
}
|
105 |
-
|
106 |
-
if($letter.is(':last-child') && jQuery('html').hasClass('no-csstransitions')) {
|
107 |
-
var nextWord = takeNext($word);
|
108 |
-
switchWord($word, nextWord);
|
109 |
-
}
|
110 |
-
}
|
111 |
-
|
112 |
-
function showLetter($letter, $word, $bool, $duration) {
|
113 |
-
$letter.addClass('in').removeClass('out');
|
114 |
-
|
115 |
-
if(!$letter.is(':last-child')) {
|
116 |
-
setTimeout(function(){ showLetter($letter.next(), $word, $bool, $duration); }, $duration);
|
117 |
-
} else {
|
118 |
-
if($word.parents('.eae-at-animation').hasClass('type')) { setTimeout(function(){ $word.parents('.eae-at-animation-text-wrapper').addClass('waiting'); }, 200);}
|
119 |
-
if(!$bool) { setTimeout(function(){ hideWord($word) }, animationDelay) }
|
120 |
-
}
|
121 |
-
}
|
122 |
-
|
123 |
-
function takeNext($word) {
|
124 |
-
return (!$word.is(':last-child')) ? $word.next() : $word.parent().children().eq(0);
|
125 |
-
}
|
126 |
-
|
127 |
-
function takePrev($word) {
|
128 |
-
return (!$word.is(':first-child')) ? $word.prev() : $word.parent().children().last();
|
129 |
-
}
|
130 |
-
|
131 |
-
function switchWord($oldWord, $newWord) {
|
132 |
-
$oldWord.removeClass('is-visible').addClass('is-hidden');
|
133 |
-
$newWord.removeClass('is-hidden').addClass('is-visible');
|
134 |
-
}
|
135 |
});
|
1 |
+
//jQuery.noConflict();
|
2 |
+
|
3 |
+
jQuery(document).on('elementor/render/animation-text',function(e){
|
4 |
+
jQuery(".eae-at-animation-text-wrapper .eae-at-animation-text:first-child").addClass("is-visible");
|
5 |
+
|
6 |
+
//set animation timing
|
7 |
+
var animationDelay = 2500,
|
8 |
+
//loading bar effect
|
9 |
+
barAnimationDelay = 3800,
|
10 |
+
barWaiting = barAnimationDelay - 3000, //3000 is the duration of the transition on the loading bar - set in the scss/css file
|
11 |
+
//letters effect
|
12 |
+
lettersDelay = 50,
|
13 |
+
//type effect
|
14 |
+
typeLettersDelay = 150,
|
15 |
+
selectionDuration = 500,
|
16 |
+
typeAnimationDelay = selectionDuration + 800,
|
17 |
+
//clip effect
|
18 |
+
revealDuration = 600,
|
19 |
+
revealAnimationDelay = 1500;
|
20 |
+
|
21 |
+
initHeadline();
|
22 |
+
|
23 |
+
|
24 |
+
function initHeadline() {
|
25 |
+
//insert <i> element for each letter of a changing word
|
26 |
+
singleLetters(jQuery('.eae-at-animation.letters').find('.eae-at-animation-text'));
|
27 |
+
//initialise headline animation
|
28 |
+
animateHeadline(jQuery('.eae-at-animation-text-wrapper'));
|
29 |
+
}
|
30 |
+
|
31 |
+
function singleLetters($words) {
|
32 |
+
$words.each(function(){
|
33 |
+
var word = jQuery(this),
|
34 |
+
letters = word.text().split(''),
|
35 |
+
selected = word.hasClass('is-visible');
|
36 |
+
for (i in letters) {
|
37 |
+
letters[i] = (selected) ? '<i class="in">' + letters[i] + '</i>': '<i>' + letters[i] + '</i>';
|
38 |
+
}
|
39 |
+
var newLetters = letters.join('');
|
40 |
+
word.html(newLetters).css('opacity', 1);
|
41 |
+
});
|
42 |
+
}
|
43 |
+
|
44 |
+
function animateHeadline($headlines) {
|
45 |
+
var duration = animationDelay;
|
46 |
+
|
47 |
+
$headlines.each(function(){
|
48 |
+
var headline = jQuery(this);
|
49 |
+
|
50 |
+
if (!headline.hasClass('type') ) {
|
51 |
+
//assign to .eae-at-animation-text-wrapper the width of its longest word
|
52 |
+
var words = headline.find('.eae-at-animation-text-wrapper .eae-at-animation-text'),
|
53 |
+
width = 0;
|
54 |
+
words.each(function(){
|
55 |
+
var wordWidth = jQuery(this).width();
|
56 |
+
if (wordWidth > width) width = wordWidth;
|
57 |
+
});
|
58 |
+
headline.find('.eae-at-animation-text-wrapper').css('width', width);
|
59 |
+
};
|
60 |
+
|
61 |
+
//trigger animation
|
62 |
+
setTimeout(function(){ hideWord( headline.find('.is-visible').eq(0) ) }, duration);
|
63 |
+
});
|
64 |
+
}
|
65 |
+
|
66 |
+
function hideWord($word) {
|
67 |
+
console.log($word);
|
68 |
+
var nextWord = takeNext($word);
|
69 |
+
|
70 |
+
if($word.parents('.eae-at-animation').hasClass('type')) {
|
71 |
+
var parentSpan = $word.parent('.eae-at-animation-text-wrapper');
|
72 |
+
parentSpan.addClass('selected').removeClass('waiting');
|
73 |
+
setTimeout(function(){
|
74 |
+
parentSpan.removeClass('selected');
|
75 |
+
$word.removeClass('is-visible').addClass('is-hidden').children('i').removeClass('in').addClass('out');
|
76 |
+
}, selectionDuration);
|
77 |
+
setTimeout(function(){ showWord(nextWord, typeLettersDelay) }, typeAnimationDelay);
|
78 |
+
} else if($word.parents('.eae-at-animation').hasClass('letters')) {
|
79 |
+
var bool = ($word.children('i').length >= nextWord.children('i').length) ? true : false;
|
80 |
+
hideLetter($word.find('i').eq(0), $word, bool, lettersDelay);
|
81 |
+
showLetter(nextWord.find('i').eq(0), nextWord, bool, lettersDelay);
|
82 |
+
|
83 |
+
} else {
|
84 |
+
switchWord($word, nextWord);
|
85 |
+
setTimeout(function(){ hideWord(nextWord) }, animationDelay);
|
86 |
+
}
|
87 |
+
}
|
88 |
+
|
89 |
+
function showWord($word, $duration) {
|
90 |
+
if($word.parents('.eae-at-animation').hasClass('type')) {
|
91 |
+
showLetter($word.find('i').eq(0), $word, false, $duration);
|
92 |
+
$word.addClass('is-visible').removeClass('is-hidden');
|
93 |
+
|
94 |
+
}
|
95 |
+
}
|
96 |
+
|
97 |
+
function hideLetter($letter, $word, $bool, $duration) {
|
98 |
+
$letter.removeClass('in').addClass('out');
|
99 |
+
|
100 |
+
if(!$letter.is(':last-child')) {
|
101 |
+
setTimeout(function(){ hideLetter($letter.next(), $word, $bool, $duration); }, $duration);
|
102 |
+
} else if($bool) {
|
103 |
+
setTimeout(function(){ hideWord(takeNext($word)) }, animationDelay);
|
104 |
+
}
|
105 |
+
|
106 |
+
if($letter.is(':last-child') && jQuery('html').hasClass('no-csstransitions')) {
|
107 |
+
var nextWord = takeNext($word);
|
108 |
+
switchWord($word, nextWord);
|
109 |
+
}
|
110 |
+
}
|
111 |
+
|
112 |
+
function showLetter($letter, $word, $bool, $duration) {
|
113 |
+
$letter.addClass('in').removeClass('out');
|
114 |
+
|
115 |
+
if(!$letter.is(':last-child')) {
|
116 |
+
setTimeout(function(){ showLetter($letter.next(), $word, $bool, $duration); }, $duration);
|
117 |
+
} else {
|
118 |
+
if($word.parents('.eae-at-animation').hasClass('type')) { setTimeout(function(){ $word.parents('.eae-at-animation-text-wrapper').addClass('waiting'); }, 200);}
|
119 |
+
if(!$bool) { setTimeout(function(){ hideWord($word) }, animationDelay) }
|
120 |
+
}
|
121 |
+
}
|
122 |
+
|
123 |
+
function takeNext($word) {
|
124 |
+
return (!$word.is(':last-child')) ? $word.next() : $word.parent().children().eq(0);
|
125 |
+
}
|
126 |
+
|
127 |
+
function takePrev($word) {
|
128 |
+
return (!$word.is(':first-child')) ? $word.prev() : $word.parent().children().last();
|
129 |
+
}
|
130 |
+
|
131 |
+
function switchWord($oldWord, $newWord) {
|
132 |
+
$oldWord.removeClass('is-visible').addClass('is-hidden');
|
133 |
+
$newWord.removeClass('is-hidden').addClass('is-visible');
|
134 |
+
}
|
135 |
});
|
assets/js/eae.js
CHANGED
@@ -1,367 +1,520 @@
|
|
1 |
-
jQuery( window ).on( 'elementor/frontend/init', function() {
|
2 |
-
|
3 |
-
elementorFrontend.hooks.addAction( 'frontend/element_ready/wts-gmap.default', function( $scope ) {
|
4 |
-
map = new_map($scope.find('.eae-markers'));
|
5 |
-
|
6 |
-
function new_map( $el ) {
|
7 |
-
$wrapper = $scope.find('.eae-markers');
|
8 |
-
var zoom = $wrapper.data('zoom');
|
9 |
-
var $markers = $el.find('.marker');
|
10 |
-
var styles = $wrapper.data('style');
|
11 |
-
var prevent_scroll = $wrapper.data('scroll')
|
12 |
-
// vars
|
13 |
-
var args = {
|
14 |
-
zoom : zoom,
|
15 |
-
center : new google.maps.LatLng(0, 0),
|
16 |
-
mapTypeId : google.maps.MapTypeId.ROADMAP,
|
17 |
-
styles : styles
|
18 |
-
};
|
19 |
-
|
20 |
-
// create map
|
21 |
-
var map = new google.maps.Map( $el[0], args);
|
22 |
-
|
23 |
-
// add a markers reference
|
24 |
-
map.markers = [];
|
25 |
-
|
26 |
-
// add markers
|
27 |
-
$markers.each(function(){
|
28 |
-
add_marker( jQuery(this), map );
|
29 |
-
});
|
30 |
-
|
31 |
-
// center map
|
32 |
-
center_map( map, zoom );
|
33 |
-
|
34 |
-
// return
|
35 |
-
return map;
|
36 |
-
}
|
37 |
-
|
38 |
-
function add_marker( $marker, map ) {
|
39 |
-
|
40 |
-
|
41 |
-
|
42 |
-
|
43 |
-
|
44 |
-
|
45 |
-
|
46 |
-
|
47 |
-
|
48 |
-
|
49 |
-
|
50 |
-
}
|
51 |
-
|
52 |
-
|
53 |
-
//var icon = $marker.attr('data-icon');
|
54 |
-
|
55 |
-
// create marker
|
56 |
-
var marker = new google.maps.Marker({
|
57 |
-
position : latlng,
|
58 |
-
map : map,
|
59 |
-
icon : icon
|
60 |
-
|
61 |
-
|
62 |
-
|
63 |
-
|
64 |
-
|
65 |
-
|
66 |
-
|
67 |
-
|
68 |
-
|
69 |
-
|
70 |
-
|
71 |
-
|
72 |
-
|
73 |
-
|
74 |
-
|
75 |
-
|
76 |
-
|
77 |
-
|
78 |
-
|
79 |
-
|
80 |
-
|
81 |
-
|
82 |
-
|
83 |
-
|
84 |
-
|
85 |
-
|
86 |
-
|
87 |
-
|
88 |
-
|
89 |
-
|
90 |
-
|
91 |
-
|
92 |
-
|
93 |
-
|
94 |
-
|
95 |
-
|
96 |
-
|
97 |
-
|
98 |
-
|
99 |
-
|
100 |
-
|
101 |
-
|
102 |
-
|
103 |
-
|
104 |
-
|
105 |
-
|
106 |
-
});
|
107 |
-
|
108 |
-
|
109 |
-
|
110 |
-
|
111 |
-
|
112 |
-
|
113 |
-
|
114 |
-
|
115 |
-
|
116 |
-
|
117 |
-
|
118 |
-
|
119 |
-
}
|
120 |
-
|
121 |
-
|
122 |
-
|
123 |
-
|
124 |
-
|
125 |
-
|
126 |
-
|
127 |
-
|
128 |
-
|
129 |
-
|
130 |
-
|
131 |
-
|
132 |
-
|
133 |
-
|
134 |
-
|
135 |
-
|
136 |
-
|
137 |
-
|
138 |
-
|
139 |
-
|
140 |
-
|
141 |
-
|
142 |
-
|
143 |
-
|
144 |
-
|
145 |
-
|
146 |
-
|
147 |
-
|
148 |
-
|
149 |
-
|
150 |
-
|
151 |
-
|
152 |
-
|
153 |
-
|
154 |
-
|
155 |
-
|
156 |
-
|
157 |
-
|
158 |
-
|
159 |
-
|
160 |
-
|
161 |
-
|
162 |
-
|
163 |
-
|
164 |
-
|
165 |
-
|
166 |
-
|
167 |
-
|
168 |
-
|
169 |
-
|
170 |
-
|
171 |
-
|
172 |
-
|
173 |
-
|
174 |
-
|
175 |
-
|
176 |
-
|
177 |
-
|
178 |
-
|
179 |
-
|
180 |
-
|
181 |
-
|
182 |
-
|
183 |
-
|
184 |
-
|
185 |
-
|
186 |
-
|
187 |
-
|
188 |
-
|
189 |
-
|
190 |
-
|
191 |
-
|
192 |
-
|
193 |
-
|
194 |
-
|
195 |
-
|
196 |
-
|
197 |
-
|
198 |
-
|
199 |
-
|
200 |
-
|
201 |
-
|
202 |
-
|
203 |
-
|
204 |
-
|
205 |
-
|
206 |
-
|
207 |
-
|
208 |
-
|
209 |
-
|
210 |
-
|
211 |
-
|
212 |
-
|
213 |
-
|
214 |
-
|
215 |
-
|
216 |
-
|
217 |
-
|
218 |
-
|
219 |
-
|
220 |
-
|
221 |
-
function
|
222 |
-
|
223 |
-
|
224 |
-
|
225 |
-
|
226 |
-
|
227 |
-
|
228 |
-
|
229 |
-
|
230 |
-
|
231 |
-
|
232 |
-
|
233 |
-
|
234 |
-
|
235 |
-
|
236 |
-
|
237 |
-
|
238 |
-
|
239 |
-
|
240 |
-
|
241 |
-
|
242 |
-
|
243 |
-
|
244 |
-
|
245 |
-
|
246 |
-
|
247 |
-
|
248 |
-
|
249 |
-
|
250 |
-
|
251 |
-
|
252 |
-
|
253 |
-
|
254 |
-
|
255 |
-
/*
|
256 |
-
|
257 |
-
/*
|
258 |
-
|
259 |
-
|
260 |
-
|
261 |
-
|
262 |
-
|
263 |
-
|
264 |
-
|
265 |
-
|
266 |
-
|
267 |
-
/*
|
268 |
-
|
269 |
-
|
270 |
-
|
271 |
-
|
272 |
-
/*the slider
|
273 |
-
|
274 |
-
|
275 |
-
|
276 |
-
|
277 |
-
|
278 |
-
|
279 |
-
|
280 |
-
|
281 |
-
|
282 |
-
|
283 |
-
|
284 |
-
|
285 |
-
|
286 |
-
}
|
287 |
-
|
288 |
-
function getCursorPos(e) {
|
289 |
-
var a, x = 0;
|
290 |
-
e = e || window.event;
|
291 |
-
/*get the x positions of the image:*/
|
292 |
-
a = img.getBoundingClientRect();
|
293 |
-
/*calculate the cursor's x coordinate, relative to the image:*/
|
294 |
-
x = e.
|
295 |
-
|
296 |
-
|
297 |
-
|
298 |
-
return x;
|
299 |
-
}
|
300 |
-
|
301 |
-
|
302 |
-
|
303 |
-
|
304 |
-
|
305 |
-
|
306 |
-
|
307 |
-
|
308 |
-
|
309 |
-
|
310 |
-
|
311 |
-
|
312 |
-
|
313 |
-
|
314 |
-
|
315 |
-
|
316 |
-
|
317 |
-
|
318 |
-
|
319 |
-
|
320 |
-
|
321 |
-
|
322 |
-
|
323 |
-
|
324 |
-
|
325 |
-
|
326 |
-
|
327 |
-
|
328 |
-
|
329 |
-
|
330 |
-
|
331 |
-
|
332 |
-
|
333 |
-
|
334 |
-
|
335 |
-
|
336 |
-
|
337 |
-
|
338 |
-
|
339 |
-
|
340 |
-
|
341 |
-
|
342 |
-
|
343 |
-
|
344 |
-
|
345 |
-
|
346 |
-
|
347 |
-
|
348 |
-
|
349 |
-
|
350 |
-
|
351 |
-
|
352 |
-
|
353 |
-
|
354 |
-
|
355 |
-
|
356 |
-
|
357 |
-
|
358 |
-
|
359 |
-
|
360 |
-
|
361 |
-
|
362 |
-
|
363 |
-
|
364 |
-
|
365 |
-
|
366 |
-
|
367 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
jQuery( window ).on( 'elementor/frontend/init', function() {
|
2 |
+
|
3 |
+
elementorFrontend.hooks.addAction( 'frontend/element_ready/wts-gmap.default', function( $scope ) {
|
4 |
+
map = new_map($scope.find('.eae-markers'));
|
5 |
+
|
6 |
+
function new_map( $el ) {
|
7 |
+
$wrapper = $scope.find('.eae-markers');
|
8 |
+
var zoom = $wrapper.data('zoom');
|
9 |
+
var $markers = $el.find('.marker');
|
10 |
+
var styles = $wrapper.data('style');
|
11 |
+
var prevent_scroll = $wrapper.data('scroll');
|
12 |
+
// vars
|
13 |
+
var args = {
|
14 |
+
zoom : zoom,
|
15 |
+
center : new google.maps.LatLng(0, 0),
|
16 |
+
mapTypeId : google.maps.MapTypeId.ROADMAP,
|
17 |
+
styles : styles
|
18 |
+
};
|
19 |
+
|
20 |
+
// create map
|
21 |
+
var map = new google.maps.Map( $el[0], args);
|
22 |
+
|
23 |
+
// add a markers reference
|
24 |
+
map.markers = [];
|
25 |
+
|
26 |
+
// add markers
|
27 |
+
$markers.each(function(){
|
28 |
+
add_marker( jQuery(this), map );
|
29 |
+
});
|
30 |
+
|
31 |
+
// center map
|
32 |
+
center_map( map, zoom );
|
33 |
+
|
34 |
+
// return
|
35 |
+
return map;
|
36 |
+
}
|
37 |
+
|
38 |
+
function add_marker( $marker, map ) {
|
39 |
+
var animate = $wrapper.data('animate')
|
40 |
+
$wrapper = $scope.find('.eae-markers');
|
41 |
+
var latlng = new google.maps.LatLng( $marker.attr('data-lat'), $marker.attr('data-lng') );
|
42 |
+
|
43 |
+
icon_img = $marker.attr('data-icon');
|
44 |
+
if(icon_img != ''){
|
45 |
+
var icon = {
|
46 |
+
url : $marker.attr('data-icon'),
|
47 |
+
scaledSize: new google.maps.Size($marker.attr('data-icon-size'), $marker.attr('data-icon-size'))
|
48 |
+
};
|
49 |
+
|
50 |
+
}
|
51 |
+
|
52 |
+
|
53 |
+
//var icon = $marker.attr('data-icon');
|
54 |
+
|
55 |
+
// create marker
|
56 |
+
var marker = new google.maps.Marker({
|
57 |
+
position : latlng,
|
58 |
+
map : map,
|
59 |
+
icon : icon,
|
60 |
+
animation: google.maps.Animation.DROP
|
61 |
+
});
|
62 |
+
if(animate == 'animate-yes'){
|
63 |
+
marker.setAnimation(google.maps.Animation.BOUNCE);
|
64 |
+
}
|
65 |
+
if(animate == 'animate-yes'){
|
66 |
+
google.maps.event.addListener(marker, 'click', function() {
|
67 |
+
marker.setAnimation(null);
|
68 |
+
});
|
69 |
+
}
|
70 |
+
|
71 |
+
|
72 |
+
|
73 |
+
// add to array
|
74 |
+
map.markers.push( marker );
|
75 |
+
// if marker contains HTML, add it to an infoWindow
|
76 |
+
|
77 |
+
if( $marker.html() )
|
78 |
+
{
|
79 |
+
// create info window
|
80 |
+
var infowindow = new google.maps.InfoWindow({
|
81 |
+
content : $marker.html()
|
82 |
+
});
|
83 |
+
|
84 |
+
// show info window when marker is clicked
|
85 |
+
google.maps.event.addListener(marker, 'click', function() {
|
86 |
+
infowindow.open( map, marker );
|
87 |
+
});
|
88 |
+
|
89 |
+
|
90 |
+
}
|
91 |
+
if(animate == 'animate-yes') {
|
92 |
+
google.maps.event.addListener(infowindow, 'closeclick', function () {
|
93 |
+
marker.setAnimation(google.maps.Animation.BOUNCE);
|
94 |
+
});
|
95 |
+
}
|
96 |
+
}
|
97 |
+
|
98 |
+
function center_map( map, zoom ) {
|
99 |
+
|
100 |
+
// vars
|
101 |
+
var bounds = new google.maps.LatLngBounds();
|
102 |
+
// loop through all markers and create bounds
|
103 |
+
jQuery.each( map.markers, function( i, marker ){
|
104 |
+
var latlng = new google.maps.LatLng( marker.position.lat(), marker.position.lng() );
|
105 |
+
bounds.extend( latlng );
|
106 |
+
});
|
107 |
+
|
108 |
+
// only 1 marker?
|
109 |
+
if( map.markers.length == 1 )
|
110 |
+
{
|
111 |
+
// set center of map
|
112 |
+
map.setCenter( bounds.getCenter() );
|
113 |
+
map.setZoom( zoom );
|
114 |
+
}
|
115 |
+
else
|
116 |
+
{
|
117 |
+
// fit to bounds
|
118 |
+
map.fitBounds( bounds );
|
119 |
+
}
|
120 |
+
}
|
121 |
+
});
|
122 |
+
|
123 |
+
elementorFrontend.hooks.addAction( 'frontend/element_ready/global', function ( $scope ) {
|
124 |
+
|
125 |
+
var eae_slides = [];
|
126 |
+
var eae_slides_json = [];
|
127 |
+
var eae_transition;
|
128 |
+
var eae_animation;
|
129 |
+
var eae_custom_overlay;
|
130 |
+
var eae_overlay;
|
131 |
+
var eae_cover;
|
132 |
+
var eae_delay;
|
133 |
+
var eae_timer;
|
134 |
+
var slider_wrapper = $scope.children('.eae-section-bs').children('.eae-section-bs-inner');
|
135 |
+
|
136 |
+
if (slider_wrapper && slider_wrapper.data('eae-bg-slider')) {
|
137 |
+
|
138 |
+
slider_images = slider_wrapper.data('eae-bg-slider');
|
139 |
+
eae_transition = slider_wrapper.data('eae-bg-slider-transition');
|
140 |
+
eae_animation = slider_wrapper.data('eae-bg-slider-animation');
|
141 |
+
eae_custom_overlay = slider_wrapper.data('eae-bg-custom-overlay');
|
142 |
+
if (eae_custom_overlay == 'yes') {
|
143 |
+
eae_overlay = eae_editor.plugin_url + '/assets/lib/vegas/overlays/' + slider_wrapper.data('eae-bg-slider-overlay');
|
144 |
+
} else {
|
145 |
+
if (slider_wrapper.data('eae-bg-slider-overlay')) {
|
146 |
+
eae_overlay = eae_editor.plugin_url + '/assets/lib/vegas/overlays/' + slider_wrapper.data('eae-bg-slider-overlay');
|
147 |
+
} else {
|
148 |
+
eae_overlay = eae_editor.plugin_url + '/assets/lib/vegas/overlays/' + slider_wrapper.data('eae-bg-slider-overlay');
|
149 |
+
}
|
150 |
+
}
|
151 |
+
|
152 |
+
eae_cover = slider_wrapper.data('eae-bg-slider-cover');
|
153 |
+
eae_delay = slider_wrapper.data('eae-bs-slider-delay');
|
154 |
+
eae_timer = slider_wrapper.data('eae-bs-slider-timer');
|
155 |
+
|
156 |
+
if (typeof slider_images != 'undefined') {
|
157 |
+
eae_slides = slider_images.split(",");
|
158 |
+
|
159 |
+
jQuery.each(eae_slides, function (key, value) {
|
160 |
+
var slide = [];
|
161 |
+
slide.src = value;
|
162 |
+
eae_slides_json.push(slide);
|
163 |
+
});
|
164 |
+
|
165 |
+
slider_wrapper.vegas({
|
166 |
+
slides: eae_slides_json,
|
167 |
+
transition: eae_transition,
|
168 |
+
animation: eae_animation,
|
169 |
+
overlay: eae_overlay,
|
170 |
+
cover: eae_cover,
|
171 |
+
delay: eae_delay,
|
172 |
+
timer: eae_timer,
|
173 |
+
init: function () {
|
174 |
+
if (eae_custom_overlay == 'yes') {
|
175 |
+
var ob_vegas_overlay = slider_wrapper.children('.vegas-overlay');
|
176 |
+
ob_vegas_overlay.css('background-image', '');
|
177 |
+
}
|
178 |
+
}
|
179 |
+
});
|
180 |
+
|
181 |
+
}
|
182 |
+
}
|
183 |
+
});
|
184 |
+
|
185 |
+
});
|
186 |
+
|
187 |
+
(function( $ ){
|
188 |
+
|
189 |
+
$(window).on('elementor/frontend/init',function(){
|
190 |
+
|
191 |
+
var ab_image = function($scope, $){
|
192 |
+
ab_style = $scope.find('.eae-img-comp-container').data("ab-style");
|
193 |
+
slider_pos = $scope.find('.eae-img-comp-container').data("slider-pos");
|
194 |
+
if(ab_style == "horizontal"){
|
195 |
+
horizontal($scope);
|
196 |
+
}else{
|
197 |
+
vertical();
|
198 |
+
}
|
199 |
+
|
200 |
+
function horizontal($scope) {
|
201 |
+
var x, i, start_pos;
|
202 |
+
/*find all elements with an "overlay" class:*/
|
203 |
+
x = $scope.find(".eae-img-comp-overlay");
|
204 |
+
start_pos = x.width();
|
205 |
+
start_pos = start_pos * slider_pos /100;
|
206 |
+
compareImages(x[0]);
|
207 |
+
|
208 |
+
function compareImages(img) {
|
209 |
+
var slider, clicked = 0, w, h;
|
210 |
+
/*get the width and height of the img element*/
|
211 |
+
w = img.offsetWidth;
|
212 |
+
h = img.offsetHeight;
|
213 |
+
/*set the width of the img element to 50%:*/
|
214 |
+
img.style.width = start_pos + "px";
|
215 |
+
/*create slider:*/
|
216 |
+
slider = $scope.find(".eae-img-comp-slider");
|
217 |
+
slider = slider[0];
|
218 |
+
/*position the slider in the middle:*/
|
219 |
+
slider.style.top = (h / 2) - (slider.offsetHeight / 2) + "px";
|
220 |
+
slider.style.left = start_pos - (slider.offsetWidth / 2) + "px";
|
221 |
+
/*execute a function when the mouse button is pressed:*/
|
222 |
+
if(!$scope.hasClass('elementor-element-edit-mode')) {
|
223 |
+
slider.addEventListener("mousedown", slideReady);
|
224 |
+
//slider.addEventListener("mouseover", slideReady);
|
225 |
+
//img.addEventListener("mouseover", slideReady);
|
226 |
+
|
227 |
+
/*and another function when the mouse button is released:*/
|
228 |
+
window.addEventListener("mouseup", slideFinish);
|
229 |
+
//slider.addEventListener("mouseout", slideFinish);
|
230 |
+
//img.addEventListener("mouseout", slideFinish);
|
231 |
+
/*or touched (for touch screens:*/
|
232 |
+
slider.addEventListener("touchstart", slideReady);
|
233 |
+
/*and released (for touch screens:*/
|
234 |
+
window.addEventListener("touchstop", slideFinish);
|
235 |
+
}
|
236 |
+
function slideReady(e) {
|
237 |
+
/*prevent any other actions that may occur when moving over the image:*/
|
238 |
+
e.preventDefault();
|
239 |
+
/*the slider is now clicked and ready to move:*/
|
240 |
+
clicked = 1;
|
241 |
+
/*execute a function when the slider is moved:*/
|
242 |
+
window.addEventListener("mousemove", slideMove);
|
243 |
+
//window.addEventListener("mouseover", slideMove);
|
244 |
+
//window.addEventListener("touchmove", slideMove);
|
245 |
+
slider.addEventListener("touchmove", touchMoveaction);
|
246 |
+
}
|
247 |
+
function slideFinish() {
|
248 |
+
/*the slider is no longer clicked:*/
|
249 |
+
clicked = 0;
|
250 |
+
}
|
251 |
+
function slideMove(e) {
|
252 |
+
var pos;
|
253 |
+
/*if the slider is no longer clicked, exit this function:*/
|
254 |
+
if (clicked == 0) return false;
|
255 |
+
/*get the cursor's x position:*/
|
256 |
+
pos = getCursorPos(e);
|
257 |
+
/*prevent the slider from being positioned outside the image:*/
|
258 |
+
if (pos < 0) pos = 0;
|
259 |
+
if (pos > w) pos = w;
|
260 |
+
/*execute a function that will resize the overlay image according to the cursor:*/
|
261 |
+
slide(pos);
|
262 |
+
}
|
263 |
+
|
264 |
+
function touchMoveaction(e)
|
265 |
+
{
|
266 |
+
var pos;
|
267 |
+
/*if the slider is no longer clicked, exit this function:*/
|
268 |
+
if (clicked == 0) return false;
|
269 |
+
/*get the cursor's x position:*/
|
270 |
+
pos = getTouchPos(e);
|
271 |
+
|
272 |
+
/*prevent the slider from being positioned outside the image:*/
|
273 |
+
if (pos < 0) pos = 0;
|
274 |
+
if (pos > w) pos = w;
|
275 |
+
/*execute a function that will resize the overlay image according to the cursor:*/
|
276 |
+
slide(pos);
|
277 |
+
}
|
278 |
+
|
279 |
+
function getTouchPos(e) {
|
280 |
+
var a, x = 0;
|
281 |
+
a = img.getBoundingClientRect();
|
282 |
+
|
283 |
+
/*calculate the cursor's x coordinate, relative to the image:*/
|
284 |
+
x = e.changedTouches[0].clientX - a.left;
|
285 |
+
return x;
|
286 |
+
}
|
287 |
+
|
288 |
+
function getCursorPos(e) {
|
289 |
+
var a, x = 0;
|
290 |
+
e = e || window.event;
|
291 |
+
/*get the x positions of the image:*/
|
292 |
+
a = img.getBoundingClientRect();
|
293 |
+
/*calculate the cursor's x coordinate, relative to the image:*/
|
294 |
+
x = e.pageX - a.left;
|
295 |
+
|
296 |
+
/*consider any page scrolling:*/
|
297 |
+
//x = x - window.pageXOffset;
|
298 |
+
return x;
|
299 |
+
}
|
300 |
+
function slide(x) {
|
301 |
+
/*resize the image:*/
|
302 |
+
img.style.width = x + "px";
|
303 |
+
/*position the slider:*/
|
304 |
+
slider.style.left = img.offsetWidth - (slider.offsetWidth / 2) + "px";
|
305 |
+
}
|
306 |
+
}
|
307 |
+
}
|
308 |
+
|
309 |
+
function vertical() {
|
310 |
+
var x, i;
|
311 |
+
/*find all elements with an "overlay" class:*/
|
312 |
+
//x = document.getElementsByClassName("eae-img-comp-overlay");
|
313 |
+
x = $scope.find(".eae-img-comp-overlay");
|
314 |
+
start_pos = x.height();
|
315 |
+
start_pos = start_pos * slider_pos /100;
|
316 |
+
compareImages(x[0]);
|
317 |
+
|
318 |
+
function compareImages(img) {
|
319 |
+
var slider, img, clicked = 0, w, h;
|
320 |
+
/*get the width and height of the img element*/
|
321 |
+
w = img.offsetWidth;
|
322 |
+
h = img.offsetHeight;
|
323 |
+
/*set the width of the img element to 50%:*/
|
324 |
+
img.style.height = start_pos + "px";
|
325 |
+
/*create slider:*/
|
326 |
+
slider = $scope.find(".eae-img-comp-slider");
|
327 |
+
slider = slider[0];
|
328 |
+
/*position the slider in the middle:*/
|
329 |
+
slider.style.top = start_pos - (slider.offsetHeight / 2) + "px";
|
330 |
+
slider.style.left = (w / 2) - (slider.offsetWidth / 2) + "px";
|
331 |
+
/*execute a function when the mouse button is pressed:*/
|
332 |
+
if(!$scope.hasClass('elementor-element-edit-mode')) {
|
333 |
+
slider.addEventListener("mousedown", slideReady);
|
334 |
+
/*and another function when the mouse button is released:*/
|
335 |
+
window.addEventListener("mouseup", slideFinish);
|
336 |
+
/*or touched (for touch screens:*/
|
337 |
+
slider.addEventListener("touchstart", slideReady);
|
338 |
+
/*and released (for touch screens:*/
|
339 |
+
window.addEventListener("touchstop", slideFinish);
|
340 |
+
}
|
341 |
+
function slideReady(e) {
|
342 |
+
/*prevent any other actions that may occur when moving over the image:*/
|
343 |
+
e.preventDefault();
|
344 |
+
/*the slider is now clicked and ready to move:*/
|
345 |
+
clicked = 1;
|
346 |
+
/*execute a function when the slider is moved:*/
|
347 |
+
window.addEventListener("mousemove", slideMove);
|
348 |
+
slider.addEventListener("touchmove", touchMoveaction);
|
349 |
+
}
|
350 |
+
function slideFinish() {
|
351 |
+
/*the slider is no longer clicked:*/
|
352 |
+
clicked = 0;
|
353 |
+
}
|
354 |
+
function slideMove(e) {
|
355 |
+
var pos;
|
356 |
+
/*if the slider is no longer clicked, exit this function:*/
|
357 |
+
if (clicked == 0) return false;
|
358 |
+
/*get the cursor's x position:*/
|
359 |
+
pos = getCursorPos(e)
|
360 |
+
/*prevent the slider from being positioned outside the image:*/
|
361 |
+
if (pos < 0) pos = 0;
|
362 |
+
if (pos > h) pos = h;
|
363 |
+
/*execute a function that will resize the overlay image according to the cursor:*/
|
364 |
+
slide(pos);
|
365 |
+
}
|
366 |
+
|
367 |
+
function getCursorPos(e) {
|
368 |
+
var a, x = 0;
|
369 |
+
e = e || window.event;
|
370 |
+
/*get the x positions of the image:*/
|
371 |
+
a = img.getBoundingClientRect();
|
372 |
+
/*calculate the cursor's x coordinate, relative to the image:*/
|
373 |
+
x = e.pageY - a.top;
|
374 |
+
/*consider any page scrolling:*/
|
375 |
+
x = x - window.pageYOffset;
|
376 |
+
|
377 |
+
return x;
|
378 |
+
}
|
379 |
+
|
380 |
+
function touchMoveaction(e)
|
381 |
+
{
|
382 |
+
var pos;
|
383 |
+
/*if the slider is no longer clicked, exit this function:*/
|
384 |
+
if (clicked == 0) return false;
|
385 |
+
/*get the cursor's x position:*/
|
386 |
+
pos = getTouchPos(e);
|
387 |
+
|
388 |
+
/*prevent the slider from being positioned outside the image:*/
|
389 |
+
if (pos < 0) pos = 0;
|
390 |
+
if (pos > h) pos = h;
|
391 |
+
/*execute a function that will resize the overlay image according to the cursor:*/
|
392 |
+
slide(pos);
|
393 |
+
}
|
394 |
+
|
395 |
+
function getTouchPos(e) {
|
396 |
+
var a, x = 0;
|
397 |
+
a = img.getBoundingClientRect();
|
398 |
+
|
399 |
+
/*calculate the cursor's x coordinate, relative to the image:*/
|
400 |
+
x = e.changedTouches[0].clientY - a.top;
|
401 |
+
|
402 |
+
//x = x - slider.offsetHeight;
|
403 |
+
|
404 |
+
return x;
|
405 |
+
}
|
406 |
+
|
407 |
+
function slide(x) {
|
408 |
+
/*resize the image:*/
|
409 |
+
img.style.height = x + "px";
|
410 |
+
/*position the slider:*/
|
411 |
+
slider.style.top = img.offsetHeight - (slider.offsetHeight / 2) + "px";
|
412 |
+
}
|
413 |
+
}
|
414 |
+
}
|
415 |
+
}
|
416 |
+
|
417 |
+
var ParticlesBG = function($scope, $){
|
418 |
+
|
419 |
+
if($scope.hasClass('eae-particle-yes')){
|
420 |
+
id = $scope.data('id');
|
421 |
+
element_type = $scope.data('element_type');
|
422 |
+
pdata = $scope.data('eae-particle');
|
423 |
+
pdata_wrapper = $scope.find('.eae-particle-wrapper').data('eae-pdata');
|
424 |
+
if(typeof pdata != 'undefined' && pdata != ''){
|
425 |
+
if($scope.find('.eae-section-bs').length > 0){
|
426 |
+
$scope.find('.eae-section-bs').after('<div class="eae-particle-wrapper" id="eae-particle-'+ id +'"></div>');
|
427 |
+
particlesJS('eae-particle-'+ id, pdata);
|
428 |
+
}
|
429 |
+
else{
|
430 |
+
|
431 |
+
if(element_type == 'column'){
|
432 |
+
$scope.find('.elementor-column-wrap').prepend('<div class="eae-particle-wrapper" id="eae-particle-'+ id +'"></div>');
|
433 |
+
}else{
|
434 |
+
$scope.prepend('<div class="eae-particle-wrapper" id="eae-particle-'+ id +'"></div>');
|
435 |
+
}
|
436 |
+
|
437 |
+
particlesJS('eae-particle-'+ id, pdata);
|
438 |
+
}
|
439 |
+
|
440 |
+
|
441 |
+
}else if(typeof pdata_wrapper != 'undefined' && pdata_wrapper != ''){
|
442 |
+
|
443 |
+
// $scope.prepend('<div class="eae-particle-wrapper" id="eae-particle-'+ id +'"></div>');
|
444 |
+
//console.log('calling particle js else', JSON.parse(pdata_wrapper));
|
445 |
+
particlesJS('eae-particle-'+ id, JSON.parse(pdata_wrapper));
|
446 |
+
}
|
447 |
+
|
448 |
+
}
|
449 |
+
|
450 |
+
};
|
451 |
+
|
452 |
+
var EaePopup = function($scope, $){
|
453 |
+
$preview_modal = $scope.find('.eae-popup-wrapper').data('preview-modal');
|
454 |
+
$close_btn = $scope.find('.eae-popup-wrapper').data('close-btn');
|
455 |
+
|
456 |
+
$magnific = $scope.find('.eae-popup-link').eaePopup({
|
457 |
+
type: 'inline',
|
458 |
+
|
459 |
+
disableOn: 0,
|
460 |
+
|
461 |
+
key: null,
|
462 |
+
|
463 |
+
midClick: false,
|
464 |
+
|
465 |
+
mainClass: 'eae-popup eae-popup-'+$scope.find('.eae-popup-link').data('id'),
|
466 |
+
|
467 |
+
preloader: true,
|
468 |
+
|
469 |
+
focus: '', // CSS selector of input to focus after popup is opened
|
470 |
+
|
471 |
+
closeOnContentClick: false,
|
472 |
+
|
473 |
+
closeOnBgClick: true,
|
474 |
+
|
475 |
+
closeBtnInside: $scope.find('.eae-popup-wrapper').data('close-in-out'),
|
476 |
+
|
477 |
+
showCloseBtn: true,
|
478 |
+
|
479 |
+
enableEscapeKey: false,
|
480 |
+
|
481 |
+
modal: false,
|
482 |
+
|
483 |
+
alignTop: false,
|
484 |
+
|
485 |
+
removalDelay: 0,
|
486 |
+
|
487 |
+
prependTo: null,
|
488 |
+
|
489 |
+
fixedContentPos: 'auto',
|
490 |
+
|
491 |
+
fixedBgPos: 'auto',
|
492 |
+
|
493 |
+
overflowY: 'auto',
|
494 |
+
|
495 |
+
closeMarkup: '<i class="eae-close '+ $close_btn +'"> </i>',
|
496 |
+
|
497 |
+
tClose: 'Close (Esc)',
|
498 |
+
|
499 |
+
tLoading: 'Loading...',
|
500 |
+
|
501 |
+
autoFocusLast: true
|
502 |
+
});
|
503 |
+
|
504 |
+
if($preview_modal == 'yes'){
|
505 |
+
if($scope.hasClass('elementor-element-edit-mode')) {
|
506 |
+
$scope.find('.eae-popup-link').click();
|
507 |
+
}
|
508 |
+
}
|
509 |
+
};
|
510 |
+
|
511 |
+
|
512 |
+
|
513 |
+
elementorFrontend.hooks.addAction( 'frontend/element_ready/wts-ab-image.default', ab_image);
|
514 |
+
elementorFrontend.hooks.addAction( 'frontend/element_ready/global', ParticlesBG );
|
515 |
+
elementorFrontend.hooks.addAction( 'frontend/element_ready/wts-modal-popup.default', EaePopup );
|
516 |
+
|
517 |
+
});
|
518 |
+
|
519 |
+
})(jQuery)
|
520 |
+
|
assets/js/particles.js
CHANGED
@@ -1,1539 +1,1539 @@
|
|
1 |
-
/* -----------------------------------------------
|
2 |
-
/* Author : Vincent Garreau - vincentgarreau.com
|
3 |
-
/* MIT license: http://opensource.org/licenses/MIT
|
4 |
-
/* Demo / Generator : vincentgarreau.com/particles.js
|
5 |
-
/* GitHub : github.com/VincentGarreau/particles.js
|
6 |
-
/* How to use? : Check the GitHub README
|
7 |
-
/* v2.0.0
|
8 |
-
/* ----------------------------------------------- */
|
9 |
-
|
10 |
-
var pJS = function(tag_id, params){
|
11 |
-
|
12 |
-
var canvas_el = document.querySelector('#'+tag_id+' > .particles-js-canvas-el');
|
13 |
-
|
14 |
-
/* particles.js variables with default values */
|
15 |
-
this.pJS = {
|
16 |
-
canvas: {
|
17 |
-
el: canvas_el,
|
18 |
-
w: canvas_el.offsetWidth,
|
19 |
-
h: canvas_el.offsetHeight
|
20 |
-
},
|
21 |
-
particles: {
|
22 |
-
number: {
|
23 |
-
value: 400,
|
24 |
-
density: {
|
25 |
-
enable: true,
|
26 |
-
value_area: 800
|
27 |
-
}
|
28 |
-
},
|
29 |
-
color: {
|
30 |
-
value: '#fff'
|
31 |
-
},
|
32 |
-
shape: {
|
33 |
-
type: 'circle',
|
34 |
-
stroke: {
|
35 |
-
width: 0,
|
36 |
-
color: '#ff0000'
|
37 |
-
},
|
38 |
-
polygon: {
|
39 |
-
nb_sides: 5
|
40 |
-
},
|
41 |
-
image: {
|
42 |
-
src: '',
|
43 |
-
width: 100,
|
44 |
-
height: 100
|
45 |
-
}
|
46 |
-
},
|
47 |
-
opacity: {
|
48 |
-
value: 1,
|
49 |
-
random: false,
|
50 |
-
anim: {
|
51 |
-
enable: false,
|
52 |
-
speed: 2,
|
53 |
-
opacity_min: 0,
|
54 |
-
sync: false
|
55 |
-
}
|
56 |
-
},
|
57 |
-
size: {
|
58 |
-
value: 20,
|
59 |
-
random: false,
|
60 |
-
anim: {
|
61 |
-
enable: false,
|
62 |
-
speed: 20,
|
63 |
-
size_min: 0,
|
64 |
-
sync: false
|
65 |
-
}
|
66 |
-
},
|
67 |
-
line_linked: {
|
68 |
-
enable: true,
|
69 |
-
distance: 100,
|
70 |
-
color: '#fff',
|
71 |
-
opacity: 1,
|
72 |
-
width: 1
|
73 |
-
},
|
74 |
-
move: {
|
75 |
-
enable: true,
|
76 |
-
speed: 2,
|
77 |
-
direction: 'none',
|
78 |
-
random: false,
|
79 |
-
straight: false,
|
80 |
-
out_mode: 'out',
|
81 |
-
bounce: false,
|
82 |
-
attract: {
|
83 |
-
enable: false,
|
84 |
-
rotateX: 3000,
|
85 |
-
rotateY: 3000
|
86 |
-
}
|
87 |
-
},
|
88 |
-
array: []
|
89 |
-
},
|
90 |
-
interactivity: {
|
91 |
-
detect_on: 'canvas',
|
92 |
-
events: {
|
93 |
-
onhover: {
|
94 |
-
enable: true,
|
95 |
-
mode: 'grab'
|
96 |
-
},
|
97 |
-
onclick: {
|
98 |
-
enable: true,
|
99 |
-
mode: 'push'
|
100 |
-
},
|
101 |
-
resize: true
|
102 |
-
},
|
103 |
-
modes: {
|
104 |
-
grab:{
|
105 |
-
distance: 100,
|
106 |
-
line_linked:{
|
107 |
-
opacity: 1
|
108 |
-
}
|
109 |
-
},
|
110 |
-
bubble:{
|
111 |
-
distance: 200,
|
112 |
-
size: 80,
|
113 |
-
duration: 0.4
|
114 |
-
},
|
115 |
-
repulse:{
|
116 |
-
distance: 200,
|
117 |
-
duration: 0.4
|
118 |
-
},
|
119 |
-
push:{
|
120 |
-
particles_nb: 4
|
121 |
-
},
|
122 |
-
remove:{
|
123 |
-
particles_nb: 2
|
124 |
-
}
|
125 |
-
},
|
126 |
-
mouse:{}
|
127 |
-
},
|
128 |
-
retina_detect: false,
|
129 |
-
fn: {
|
130 |
-
interact: {},
|
131 |
-
modes: {},
|
132 |
-
vendors:{}
|
133 |
-
},
|
134 |
-
tmp: {}
|
135 |
-
};
|
136 |
-
|
137 |
-
var pJS = this.pJS;
|
138 |
-
|
139 |
-
/* params settings */
|
140 |
-
if(params){
|
141 |
-
Object.deepExtend(pJS, params);
|
142 |
-
}
|
143 |
-
|
144 |
-
pJS.tmp.obj = {
|
145 |
-
size_value: pJS.particles.size.value,
|
146 |
-
size_anim_speed: pJS.particles.size.anim.speed,
|
147 |
-
move_speed: pJS.particles.move.speed,
|
148 |
-
line_linked_distance: pJS.particles.line_linked.distance,
|
149 |
-
line_linked_width: pJS.particles.line_linked.width,
|
150 |
-
mode_grab_distance: pJS.interactivity.modes.grab.distance,
|
151 |
-
mode_bubble_distance: pJS.interactivity.modes.bubble.distance,
|
152 |
-
mode_bubble_size: pJS.interactivity.modes.bubble.size,
|
153 |
-
mode_repulse_distance: pJS.interactivity.modes.repulse.distance
|
154 |
-
};
|
155 |
-
|
156 |
-
|
157 |
-
pJS.fn.retinaInit = function(){
|
158 |
-
|
159 |
-
if(pJS.retina_detect && window.devicePixelRatio > 1){
|
160 |
-
pJS.canvas.pxratio = window.devicePixelRatio;
|
161 |
-
pJS.tmp.retina = true;
|
162 |
-
}
|
163 |
-
else{
|
164 |
-
pJS.canvas.pxratio = 1;
|
165 |
-
pJS.tmp.retina = false;
|
166 |
-
}
|
167 |
-
|
168 |
-
pJS.canvas.w = pJS.canvas.el.offsetWidth * pJS.canvas.pxratio;
|
169 |
-
pJS.canvas.h = pJS.canvas.el.offsetHeight * pJS.canvas.pxratio;
|
170 |
-
|
171 |
-
pJS.particles.size.value = pJS.tmp.obj.size_value * pJS.canvas.pxratio;
|
172 |
-
pJS.particles.size.anim.speed = pJS.tmp.obj.size_anim_speed * pJS.canvas.pxratio;
|
173 |
-
pJS.particles.move.speed = pJS.tmp.obj.move_speed * pJS.canvas.pxratio;
|
174 |
-
pJS.particles.line_linked.distance = pJS.tmp.obj.line_linked_distance * pJS.canvas.pxratio;
|
175 |
-
pJS.interactivity.modes.grab.distance = pJS.tmp.obj.mode_grab_distance * pJS.canvas.pxratio;
|
176 |
-
pJS.interactivity.modes.bubble.distance = pJS.tmp.obj.mode_bubble_distance * pJS.canvas.pxratio;
|
177 |
-
pJS.particles.line_linked.width = pJS.tmp.obj.line_linked_width * pJS.canvas.pxratio;
|
178 |
-
pJS.interactivity.modes.bubble.size = pJS.tmp.obj.mode_bubble_size * pJS.canvas.pxratio;
|
179 |
-
pJS.interactivity.modes.repulse.distance = pJS.tmp.obj.mode_repulse_distance * pJS.canvas.pxratio;
|
180 |
-
|
181 |
-
};
|
182 |
-
|
183 |
-
|
184 |
-
|
185 |
-
/* ---------- pJS functions - canvas ------------ */
|
186 |
-
|
187 |
-
pJS.fn.canvasInit = function(){
|
188 |
-
pJS.canvas.ctx = pJS.canvas.el.getContext('2d');
|
189 |
-
};
|
190 |
-
|
191 |
-
pJS.fn.canvasSize = function(){
|
192 |
-
|
193 |
-
pJS.canvas.el.width = pJS.canvas.w;
|
194 |
-
pJS.canvas.el.height = pJS.canvas.h;
|
195 |
-
|
196 |
-
if(pJS && pJS.interactivity.events.resize){
|
197 |
-
|
198 |
-
window.addEventListener('resize', function(){
|
199 |
-
|
200 |
-
pJS.canvas.w = pJS.canvas.el.offsetWidth;
|
201 |
-
pJS.canvas.h = pJS.canvas.el.offsetHeight;
|
202 |
-
|
203 |
-
/* resize canvas */
|
204 |
-
if(pJS.tmp.retina){
|
205 |
-
pJS.canvas.w *= pJS.canvas.pxratio;
|
206 |
-
pJS.canvas.h *= pJS.canvas.pxratio;
|
207 |
-
}
|
208 |
-
|
209 |
-
pJS.canvas.el.width = pJS.canvas.w;
|
210 |
-
pJS.canvas.el.height = pJS.canvas.h;
|
211 |
-
|
212 |
-
/* repaint canvas on anim disabled */
|
213 |
-
if(!pJS.particles.move.enable){
|
214 |
-
pJS.fn.particlesEmpty();
|
215 |
-
pJS.fn.particlesCreate();
|
216 |
-
pJS.fn.particlesDraw();
|
217 |
-
pJS.fn.vendors.densityAutoParticles();
|
218 |
-
}
|
219 |
-
|
220 |
-
/* density particles enabled */
|
221 |
-
pJS.fn.vendors.densityAutoParticles();
|
222 |
-
|
223 |
-
});
|
224 |
-
|
225 |
-
}
|
226 |
-
|
227 |
-
};
|
228 |
-
|
229 |
-
|
230 |
-
pJS.fn.canvasPaint = function(){
|
231 |
-
pJS.canvas.ctx.fillRect(0, 0, pJS.canvas.w, pJS.canvas.h);
|
232 |
-
};
|
233 |
-
|
234 |
-
pJS.fn.canvasClear = function(){
|
235 |
-
pJS.canvas.ctx.clearRect(0, 0, pJS.canvas.w, pJS.canvas.h);
|
236 |
-
};
|
237 |
-
|
238 |
-
|
239 |
-
/* --------- pJS functions - particles ----------- */
|
240 |
-
|
241 |
-
pJS.fn.particle = function(color, opacity, position){
|
242 |
-
|
243 |
-
/* size */
|
244 |
-
this.radius = (pJS.particles.size.random ? Math.random() : 1) * pJS.particles.size.value;
|
245 |
-
if(pJS.particles.size.anim.enable){
|
246 |
-
this.size_status = false;
|
247 |
-
this.vs = pJS.particles.size.anim.speed / 100;
|
248 |
-
if(!pJS.particles.size.anim.sync){
|
249 |
-
this.vs = this.vs * Math.random();
|
250 |
-
}
|
251 |
-
}
|
252 |
-
|
253 |
-
/* position */
|
254 |
-
this.x = position ? position.x : Math.random() * pJS.canvas.w;
|
255 |
-
this.y = position ? position.y : Math.random() * pJS.canvas.h;
|
256 |
-
|
257 |
-
/* check position - into the canvas */
|
258 |
-
if(this.x > pJS.canvas.w - this.radius*2) this.x = this.x - this.radius;
|
259 |
-
else if(this.x < this.radius*2) this.x = this.x + this.radius;
|
260 |
-
if(this.y > pJS.canvas.h - this.radius*2) this.y = this.y - this.radius;
|
261 |
-
else if(this.y < this.radius*2) this.y = this.y + this.radius;
|
262 |
-
|
263 |
-
/* check position - avoid overlap */
|
264 |
-
if(pJS.particles.move.bounce){
|
265 |
-
pJS.fn.vendors.checkOverlap(this, position);
|
266 |
-
}
|
267 |
-
|
268 |
-
/* color */
|
269 |
-
this.color = {};
|
270 |
-
if(typeof(color.value) == 'object'){
|
271 |
-
|
272 |
-
if(color.value instanceof Array){
|
273 |
-
var color_selected = color.value[Math.floor(Math.random() * pJS.particles.color.value.length)];
|
274 |
-
this.color.rgb = hexToRgb(color_selected);
|
275 |
-
}else{
|
276 |
-
if(color.value.r != undefined && color.value.g != undefined && color.value.b != undefined){
|
277 |
-
this.color.rgb = {
|
278 |
-
r: color.value.r,
|
279 |
-
g: color.value.g,
|
280 |
-
b: color.value.b
|
281 |
-
}
|
282 |
-
}
|
283 |
-
if(color.value.h != undefined && color.value.s != undefined && color.value.l != undefined){
|
284 |
-
this.color.hsl = {
|
285 |
-
h: color.value.h,
|
286 |
-
s: color.value.s,
|
287 |
-
l: color.value.l
|
288 |
-
}
|
289 |
-
}
|
290 |
-
}
|
291 |
-
|
292 |
-
}
|
293 |
-
else if(color.value == 'random'){
|
294 |
-
this.color.rgb = {
|
295 |
-
r: (Math.floor(Math.random() * (255 - 0 + 1)) + 0),
|
296 |
-
g: (Math.floor(Math.random() * (255 - 0 + 1)) + 0),
|
297 |
-
b: (Math.floor(Math.random() * (255 - 0 + 1)) + 0)
|
298 |
-
}
|
299 |
-
}
|
300 |
-
else if(typeof(color.value) == 'string'){
|
301 |
-
this.color = color;
|
302 |
-
this.color.rgb = hexToRgb(this.color.value);
|
303 |
-
}
|
304 |
-
|
305 |
-
/* opacity */
|
306 |
-
this.opacity = (pJS.particles.opacity.random ? Math.random() : 1) * pJS.particles.opacity.value;
|
307 |
-
if(pJS.particles.opacity.anim.enable){
|
308 |
-
this.opacity_status = false;
|
309 |
-
this.vo = pJS.particles.opacity.anim.speed / 100;
|
310 |
-
if(!pJS.particles.opacity.anim.sync){
|
311 |
-
this.vo = this.vo * Math.random();
|
312 |
-
}
|
313 |
-
}
|
314 |
-
|
315 |
-
/* animation - velocity for speed */
|
316 |
-
var velbase = {}
|
317 |
-
switch(pJS.particles.move.direction){
|
318 |
-
case 'top':
|
319 |
-
velbase = { x:0, y:-1 };
|
320 |
-
break;
|
321 |
-
case 'top-right':
|
322 |
-
velbase = { x:0.5, y:-0.5 };
|
323 |
-
break;
|
324 |
-
case 'right':
|
325 |
-
velbase = { x:1, y:-0 };
|
326 |
-
break;
|
327 |
-
case 'bottom-right':
|
328 |
-
velbase = { x:0.5, y:0.5 };
|
329 |
-
break;
|
330 |
-
case 'bottom':
|
331 |
-
velbase = { x:0, y:1 };
|
332 |
-
break;
|
333 |
-
case 'bottom-left':
|
334 |
-
velbase = { x:-0.5, y:1 };
|
335 |
-
break;
|
336 |
-
case 'left':
|
337 |
-
velbase = { x:-1, y:0 };
|
338 |
-
break;
|
339 |
-
case 'top-left':
|
340 |
-
velbase = { x:-0.5, y:-0.5 };
|
341 |
-
break;
|
342 |
-
default:
|
343 |
-
velbase = { x:0, y:0 };
|
344 |
-
break;
|
345 |
-
}
|
346 |
-
|
347 |
-
if(pJS.particles.move.straight){
|
348 |
-
this.vx = velbase.x;
|
349 |
-
this.vy = velbase.y;
|
350 |
-
if(pJS.particles.move.random){
|
351 |
-
this.vx = this.vx * (Math.random());
|
352 |
-
this.vy = this.vy * (Math.random());
|
353 |
-
}
|
354 |
-
}else{
|
355 |
-
this.vx = velbase.x + Math.random()-0.5;
|
356 |
-
this.vy = velbase.y + Math.random()-0.5;
|
357 |
-
}
|
358 |
-
|
359 |
-
// var theta = 2.0 * Math.PI * Math.random();
|
360 |
-
// this.vx = Math.cos(theta);
|
361 |
-
// this.vy = Math.sin(theta);
|
362 |
-
|
363 |
-
this.vx_i = this.vx;
|
364 |
-
this.vy_i = this.vy;
|
365 |
-
|
366 |
-
|
367 |
-
|
368 |
-
/* if shape is image */
|
369 |
-
|
370 |
-
var shape_type = pJS.particles.shape.type;
|
371 |
-
if(typeof(shape_type) == 'object'){
|
372 |
-
if(shape_type instanceof Array){
|
373 |
-
var shape_selected = shape_type[Math.floor(Math.random() * shape_type.length)];
|
374 |
-
this.shape = shape_selected;
|
375 |
-
}
|
376 |
-
}else{
|
377 |
-
this.shape = shape_type;
|
378 |
-
}
|
379 |
-
|
380 |
-
if(this.shape == 'image'){
|
381 |
-
var sh = pJS.particles.shape;
|
382 |
-
this.img = {
|
383 |
-
src: sh.image.src,
|
384 |
-
ratio: sh.image.width / sh.image.height
|
385 |
-
}
|
386 |
-
if(!this.img.ratio) this.img.ratio = 1;
|
387 |
-
if(pJS.tmp.img_type == 'svg' && pJS.tmp.source_svg != undefined){
|
388 |
-
pJS.fn.vendors.createSvgImg(this);
|
389 |
-
if(pJS.tmp.pushing){
|
390 |
-
this.img.loaded = false;
|
391 |
-
}
|
392 |
-
}
|
393 |
-
}
|
394 |
-
|
395 |
-
|
396 |
-
|
397 |
-
};
|
398 |
-
|
399 |
-
|
400 |
-
pJS.fn.particle.prototype.draw = function() {
|
401 |
-
|
402 |
-
var p = this;
|
403 |
-
|
404 |
-
if(p.radius_bubble != undefined){
|
405 |
-
var radius = p.radius_bubble;
|
406 |
-
}else{
|
407 |
-
var radius = p.radius;
|
408 |
-
}
|
409 |
-
|
410 |
-
if(p.opacity_bubble != undefined){
|
411 |
-
var opacity = p.opacity_bubble;
|
412 |
-
}else{
|
413 |
-
var opacity = p.opacity;
|
414 |
-
}
|
415 |
-
|
416 |
-
if(p.color.rgb){
|
417 |
-
var color_value = 'rgba('+p.color.rgb.r+','+p.color.rgb.g+','+p.color.rgb.b+','+opacity+')';
|
418 |
-
}else{
|
419 |
-
var color_value = 'hsla('+p.color.hsl.h+','+p.color.hsl.s+'%,'+p.color.hsl.l+'%,'+opacity+')';
|
420 |
-
}
|
421 |
-
|
422 |
-
pJS.canvas.ctx.fillStyle = color_value;
|
423 |
-
pJS.canvas.ctx.beginPath();
|
424 |
-
|
425 |
-
switch(p.shape){
|
426 |
-
|
427 |
-
case 'circle':
|
428 |
-
pJS.canvas.ctx.arc(p.x, p.y, radius, 0, Math.PI * 2, false);
|
429 |
-
break;
|
430 |
-
|
431 |
-
case 'edge':
|
432 |
-
pJS.canvas.ctx.rect(p.x-radius, p.y-radius, radius*2, radius*2);
|
433 |
-
break;
|
434 |
-
|
435 |
-
case 'triangle':
|
436 |
-
pJS.fn.vendors.drawShape(pJS.canvas.ctx, p.x-radius, p.y+radius / 1.66, radius*2, 3, 2);
|
437 |
-
break;
|
438 |
-
|
439 |
-
case 'polygon':
|
440 |
-
pJS.fn.vendors.drawShape(
|
441 |
-
pJS.canvas.ctx,
|
442 |
-
p.x - radius / (pJS.particles.shape.polygon.nb_sides/3.5), // startX
|
443 |
-
p.y - radius / (2.66/3.5), // startY
|
444 |
-
radius*2.66 / (pJS.particles.shape.polygon.nb_sides/3), // sideLength
|
445 |
-
pJS.particles.shape.polygon.nb_sides, // sideCountNumerator
|
446 |
-
1 // sideCountDenominator
|
447 |
-
);
|
448 |
-
break;
|
449 |
-
|
450 |
-
case 'star':
|
451 |
-
pJS.fn.vendors.drawShape(
|
452 |
-
pJS.canvas.ctx,
|
453 |
-
p.x - radius*2 / (pJS.particles.shape.polygon.nb_sides/4), // startX
|
454 |
-
p.y - radius / (2*2.66/3.5), // startY
|
455 |
-
radius*2*2.66 / (pJS.particles.shape.polygon.nb_sides/3), // sideLength
|
456 |
-
pJS.particles.shape.polygon.nb_sides, // sideCountNumerator
|
457 |
-
2 // sideCountDenominator
|
458 |
-
);
|
459 |
-
break;
|
460 |
-
|
461 |
-
case 'image':
|
462 |
-
|
463 |
-
function draw(){
|
464 |
-
pJS.canvas.ctx.drawImage(
|
465 |
-
img_obj,
|
466 |
-
p.x-radius,
|
467 |
-
p.y-radius,
|
468 |
-
radius*2,
|
469 |
-
radius*2 / p.img.ratio
|
470 |
-
);
|
471 |
-
}
|
472 |
-
|
473 |
-
if(pJS.tmp.img_type == 'svg'){
|
474 |
-
var img_obj = p.img.obj;
|
475 |
-
}else{
|
476 |
-
var img_obj = pJS.tmp.img_obj;
|
477 |
-
}
|
478 |
-
|
479 |
-
if(img_obj){
|
480 |
-
draw();
|
481 |
-
}
|
482 |
-
|
483 |
-
break;
|
484 |
-
|
485 |
-
}
|
486 |
-
|
487 |
-
pJS.canvas.ctx.closePath();
|
488 |
-
|
489 |
-
if(pJS.particles.shape.stroke.width > 0){
|
490 |
-
pJS.canvas.ctx.strokeStyle = pJS.particles.shape.stroke.color;
|
491 |
-
pJS.canvas.ctx.lineWidth = pJS.particles.shape.stroke.width;
|
492 |
-
pJS.canvas.ctx.stroke();
|
493 |
-
}
|
494 |
-
|
495 |
-
pJS.canvas.ctx.fill();
|
496 |
-
|
497 |
-
};
|
498 |
-
|
499 |
-
|
500 |
-
pJS.fn.particlesCreate = function(){
|
501 |
-
for(var i = 0; i < pJS.particles.number.value; i++) {
|
502 |
-
pJS.particles.array.push(new pJS.fn.particle(pJS.particles.color, pJS.particles.opacity.value));
|
503 |
-
}
|
504 |
-
};
|
505 |
-
|
506 |
-
pJS.fn.particlesUpdate = function(){
|
507 |
-
|
508 |
-
for(var i = 0; i < pJS.particles.array.length; i++){
|
509 |
-
|
510 |
-
/* the particle */
|
511 |
-
var p = pJS.particles.array[i];
|
512 |
-
|
513 |
-
// var d = ( dx = pJS.interactivity.mouse.click_pos_x - p.x ) * dx + ( dy = pJS.interactivity.mouse.click_pos_y - p.y ) * dy;
|
514 |
-
// var f = -BANG_SIZE / d;
|
515 |
-
// if ( d < BANG_SIZE ) {
|
516 |
-
// var t = Math.atan2( dy, dx );
|
517 |
-
// p.vx = f * Math.cos(t);
|
518 |
-
// p.vy = f * Math.sin(t);
|
519 |
-
// }
|
520 |
-
|
521 |
-
/* move the particle */
|
522 |
-
if(pJS.particles.move.enable){
|
523 |
-
var ms = pJS.particles.move.speed/2;
|
524 |
-
p.x += p.vx * ms;
|
525 |
-
p.y += p.vy * ms;
|
526 |
-
}
|
527 |
-
|
528 |
-
/* change opacity status */
|
529 |
-
if(pJS.particles.opacity.anim.enable) {
|
530 |
-
if(p.opacity_status == true) {
|
531 |
-
if(p.opacity >= pJS.particles.opacity.value) p.opacity_status = false;
|
532 |
-
p.opacity += p.vo;
|
533 |
-
}else {
|
534 |
-
if(p.opacity <= pJS.particles.opacity.anim.opacity_min) p.opacity_status = true;
|
535 |
-
p.opacity -= p.vo;
|
536 |
-
}
|
537 |
-
if(p.opacity < 0) p.opacity = 0;
|
538 |
-
}
|
539 |
-
|
540 |
-
/* change size */
|
541 |
-
if(pJS.particles.size.anim.enable){
|
542 |
-
if(p.size_status == true){
|
543 |
-
if(p.radius >= pJS.particles.size.value) p.size_status = false;
|
544 |
-
p.radius += p.vs;
|
545 |
-
}else{
|
546 |
-
if(p.radius <= pJS.particles.size.anim.size_min) p.size_status = true;
|
547 |
-
p.radius -= p.vs;
|
548 |
-
}
|
549 |
-
if(p.radius < 0) p.radius = 0;
|
550 |
-
}
|
551 |
-
|
552 |
-
/* change particle position if it is out of canvas */
|
553 |
-
if(pJS.particles.move.out_mode == 'bounce'){
|
554 |
-
var new_pos = {
|
555 |
-
x_left: p.radius,
|
556 |
-
x_right: pJS.canvas.w,
|
557 |
-
y_top: p.radius,
|
558 |
-
y_bottom: pJS.canvas.h
|
559 |
-
}
|
560 |
-
}else{
|
561 |
-
var new_pos = {
|
562 |
-
x_left: -p.radius,
|
563 |
-
x_right: pJS.canvas.w + p.radius,
|
564 |
-
y_top: -p.radius,
|
565 |
-
y_bottom: pJS.canvas.h + p.radius
|
566 |
-
}
|
567 |
-
}
|
568 |
-
|
569 |
-
if(p.x - p.radius > pJS.canvas.w){
|
570 |
-
p.x = new_pos.x_left;
|
571 |
-
p.y = Math.random() * pJS.canvas.h;
|
572 |
-
}
|
573 |
-
else if(p.x + p.radius < 0){
|
574 |
-
p.x = new_pos.x_right;
|
575 |
-
p.y = Math.random() * pJS.canvas.h;
|
576 |
-
}
|
577 |
-
if(p.y - p.radius > pJS.canvas.h){
|
578 |
-
p.y = new_pos.y_top;
|
579 |
-
p.x = Math.random() * pJS.canvas.w;
|
580 |
-
}
|
581 |
-
else if(p.y + p.radius < 0){
|
582 |
-
p.y = new_pos.y_bottom;
|
583 |
-
p.x = Math.random() * pJS.canvas.w;
|
584 |
-
}
|
585 |
-
|
586 |
-
/* out of canvas modes */
|
587 |
-
switch(pJS.particles.move.out_mode){
|
588 |
-
case 'bounce':
|
589 |
-
if (p.x + p.radius > pJS.canvas.w) p.vx = -p.vx;
|
590 |
-
else if (p.x - p.radius < 0) p.vx = -p.vx;
|
591 |
-
if (p.y + p.radius > pJS.canvas.h) p.vy = -p.vy;
|
592 |
-
else if (p.y - p.radius < 0) p.vy = -p.vy;
|
593 |
-
break;
|
594 |
-
}
|
595 |
-
|
596 |
-
/* events */
|
597 |
-
if(isInArray('grab', pJS.interactivity.events.onhover.mode)){
|
598 |
-
pJS.fn.modes.grabParticle(p);
|
599 |
-
}
|
600 |
-
|
601 |
-
if(isInArray('bubble', pJS.interactivity.events.onhover.mode) || isInArray('bubble', pJS.interactivity.events.onclick.mode)){
|
602 |
-
pJS.fn.modes.bubbleParticle(p);
|
603 |
-
}
|
604 |
-
|
605 |
-
if(isInArray('repulse', pJS.interactivity.events.onhover.mode) || isInArray('repulse', pJS.interactivity.events.onclick.mode)){
|
606 |
-
pJS.fn.modes.repulseParticle(p);
|
607 |
-
}
|
608 |
-
|
609 |
-
/* interaction auto between particles */
|
610 |
-
if(pJS.particles.line_linked.enable || pJS.particles.move.attract.enable){
|
611 |
-
for(var j = i + 1; j < pJS.particles.array.length; j++){
|
612 |
-
var p2 = pJS.particles.array[j];
|
613 |
-
|
614 |
-
/* link particles */
|
615 |
-
if(pJS.particles.line_linked.enable){
|
616 |
-
pJS.fn.interact.linkParticles(p,p2);
|
617 |
-
}
|
618 |
-
|
619 |
-
/* attract particles */
|
620 |
-
if(pJS.particles.move.attract.enable){
|
621 |
-
pJS.fn.interact.attractParticles(p,p2);
|
622 |
-
}
|
623 |
-
|
624 |
-
/* bounce particles */
|
625 |
-
if(pJS.particles.move.bounce){
|
626 |
-
pJS.fn.interact.bounceParticles(p,p2);
|
627 |
-
}
|
628 |
-
|
629 |
-
}
|
630 |
-
}
|
631 |
-
|
632 |
-
|
633 |
-
}
|
634 |
-
|
635 |
-
};
|
636 |
-
|
637 |
-
pJS.fn.particlesDraw = function(){
|
638 |
-
|
639 |
-
/* clear canvas */
|
640 |
-
pJS.canvas.ctx.clearRect(0, 0, pJS.canvas.w, pJS.canvas.h);
|
641 |
-
|
642 |
-
/* update each particles param */
|
643 |
-
pJS.fn.particlesUpdate();
|
644 |
-
|
645 |
-
/* draw each particle */
|
646 |
-
for(var i = 0; i < pJS.particles.array.length; i++){
|
647 |
-
var p = pJS.particles.array[i];
|
648 |
-
p.draw();
|
649 |
-
}
|
650 |
-
|
651 |
-
};
|
652 |
-
|
653 |
-
pJS.fn.particlesEmpty = function(){
|
654 |
-
pJS.particles.array = [];
|
655 |
-
};
|
656 |
-
|
657 |
-
pJS.fn.particlesRefresh = function(){
|
658 |
-
|
659 |
-
/* init all */
|
660 |
-
cancelRequestAnimFrame(pJS.fn.checkAnimFrame);
|
661 |
-
cancelRequestAnimFrame(pJS.fn.drawAnimFrame);
|
662 |
-
pJS.tmp.source_svg = undefined;
|
663 |
-
pJS.tmp.img_obj = undefined;
|
664 |
-
pJS.tmp.count_svg = 0;
|
665 |
-
pJS.fn.particlesEmpty();
|
666 |
-
pJS.fn.canvasClear();
|
667 |
-
|
668 |
-
/* restart */
|
669 |
-
pJS.fn.vendors.start();
|
670 |
-
|
671 |
-
};
|
672 |
-
|
673 |
-
|
674 |
-
/* ---------- pJS functions - particles interaction ------------ */
|
675 |
-
|
676 |
-
pJS.fn.interact.linkParticles = function(p1, p2){
|
677 |
-
|
678 |
-
var dx = p1.x - p2.x,
|
679 |
-
dy = p1.y - p2.y,
|
680 |
-
dist = Math.sqrt(dx*dx + dy*dy);
|
681 |
-
|
682 |
-
/* draw a line between p1 and p2 if the distance between them is under the config distance */
|
683 |
-
if(dist <= pJS.particles.line_linked.distance){
|
684 |
-
|
685 |
-
var opacity_line = pJS.particles.line_linked.opacity - (dist / (1/pJS.particles.line_linked.opacity)) / pJS.particles.line_linked.distance;
|
686 |
-
|
687 |
-
if(opacity_line > 0){
|
688 |
-
|
689 |
-
/* style */
|
690 |
-
var color_line = pJS.particles.line_linked.color_rgb_line;
|
691 |
-
pJS.canvas.ctx.strokeStyle = 'rgba('+color_line.r+','+color_line.g+','+color_line.b+','+opacity_line+')';
|
692 |
-
pJS.canvas.ctx.lineWidth = pJS.particles.line_linked.width;
|
693 |
-
//pJS.canvas.ctx.lineCap = 'round'; /* performance issue */
|
694 |
-
|
695 |
-
/* path */
|
696 |
-
pJS.canvas.ctx.beginPath();
|
697 |
-
pJS.canvas.ctx.moveTo(p1.x, p1.y);
|
698 |
-
pJS.canvas.ctx.lineTo(p2.x, p2.y);
|
699 |
-
pJS.canvas.ctx.stroke();
|
700 |
-
pJS.canvas.ctx.closePath();
|
701 |
-
|
702 |
-
}
|
703 |
-
|
704 |
-
}
|
705 |
-
|
706 |
-
};
|
707 |
-
|
708 |
-
|
709 |
-
pJS.fn.interact.attractParticles = function(p1, p2){
|
710 |
-
|
711 |
-
/* condensed particles */
|
712 |
-
var dx = p1.x - p2.x,
|
713 |
-
dy = p1.y - p2.y,
|
714 |
-
dist = Math.sqrt(dx*dx + dy*dy);
|
715 |
-
|
716 |
-
if(dist <= pJS.particles.line_linked.distance){
|
717 |
-
|
718 |
-
var ax = dx/(pJS.particles.move.attract.rotateX*1000),
|
719 |
-
ay = dy/(pJS.particles.move.attract.rotateY*1000);
|
720 |
-
|
721 |
-
p1.vx -= ax;
|
722 |
-
p1.vy -= ay;
|
723 |
-
|
724 |
-
p2.vx += ax;
|
725 |
-
p2.vy += ay;
|
726 |
-
|
727 |
-
}
|
728 |
-
|
729 |
-
|
730 |
-
}
|
731 |
-
|
732 |
-
|
733 |
-
pJS.fn.interact.bounceParticles = function(p1, p2){
|
734 |
-
|
735 |
-
var dx = p1.x - p2.x,
|
736 |
-
dy = p1.y - p2.y,
|
737 |
-
dist = Math.sqrt(dx*dx + dy*dy),
|
738 |
-
dist_p = p1.radius+p2.radius;
|
739 |
-
|
740 |
-
if(dist <= dist_p){
|
741 |
-
p1.vx = -p1.vx;
|
742 |
-
p1.vy = -p1.vy;
|
743 |
-
|
744 |
-
p2.vx = -p2.vx;
|
745 |
-
p2.vy = -p2.vy;
|
746 |
-
}
|
747 |
-
|
748 |
-
}
|
749 |
-
|
750 |
-
|
751 |
-
/* ---------- pJS functions - modes events ------------ */
|
752 |
-
|
753 |
-
pJS.fn.modes.pushParticles = function(nb, pos){
|
754 |
-
|
755 |
-
pJS.tmp.pushing = true;
|
756 |
-
|
757 |
-
for(var i = 0; i < nb; i++){
|
758 |
-
pJS.particles.array.push(
|
759 |
-
new pJS.fn.particle(
|
760 |
-
pJS.particles.color,
|
761 |
-
pJS.particles.opacity.value,
|
762 |
-
{
|
763 |
-
'x': pos ? pos.pos_x : Math.random() * pJS.canvas.w,
|
764 |
-
'y': pos ? pos.pos_y : Math.random() * pJS.canvas.h
|
765 |
-
}
|
766 |
-
)
|
767 |
-
)
|
768 |
-
if(i == nb-1){
|
769 |
-
if(!pJS.particles.move.enable){
|
770 |
-
pJS.fn.particlesDraw();
|
771 |
-
}
|
772 |
-
pJS.tmp.pushing = false;
|
773 |
-
}
|
774 |
-
}
|
775 |
-
|
776 |
-
};
|
777 |
-
|
778 |
-
|
779 |
-
pJS.fn.modes.removeParticles = function(nb){
|
780 |
-
|
781 |
-
pJS.particles.array.splice(0, nb);
|
782 |
-
if(!pJS.particles.move.enable){
|
783 |
-
pJS.fn.particlesDraw();
|
784 |
-
}
|
785 |
-
|
786 |
-
};
|
787 |
-
|
788 |
-
|
789 |
-
pJS.fn.modes.bubbleParticle = function(p){
|
790 |
-
|
791 |
-
/* on hover event */
|
792 |
-
if(pJS.interactivity.events.onhover.enable && isInArray('bubble', pJS.interactivity.events.onhover.mode)){
|
793 |
-
|
794 |
-
var dx_mouse = p.x - pJS.interactivity.mouse.pos_x,
|
795 |
-
dy_mouse = p.y - pJS.interactivity.mouse.pos_y,
|
796 |
-
dist_mouse = Math.sqrt(dx_mouse*dx_mouse + dy_mouse*dy_mouse),
|
797 |
-
ratio = 1 - dist_mouse / pJS.interactivity.modes.bubble.distance;
|
798 |
-
|
799 |
-
function init(){
|
800 |
-
p.opacity_bubble = p.opacity;
|
801 |
-
p.radius_bubble = p.radius;
|
802 |
-
}
|
803 |
-
|
804 |
-
/* mousemove - check ratio */
|
805 |
-
if(dist_mouse <= pJS.interactivity.modes.bubble.distance){
|
806 |
-
|
807 |
-
if(ratio >= 0 && pJS.interactivity.status == 'mousemove'){
|
808 |
-
|
809 |
-
/* size */
|
810 |
-
if(pJS.interactivity.modes.bubble.size != pJS.particles.size.value){
|
811 |
-
|
812 |
-
if(pJS.interactivity.modes.bubble.size > pJS.particles.size.value){
|
813 |
-
var size = p.radius + (pJS.interactivity.modes.bubble.size*ratio);
|
814 |
-
if(size >= 0){
|
815 |
-
p.radius_bubble = size;
|
816 |
-
}
|
817 |
-
}else{
|
818 |
-
var dif = p.radius - pJS.interactivity.modes.bubble.size,
|
819 |
-
size = p.radius - (dif*ratio);
|
820 |
-
if(size > 0){
|
821 |
-
p.radius_bubble = size;
|
822 |
-
}else{
|
823 |
-
p.radius_bubble = 0;
|
824 |
-
}
|
825 |
-
}
|
826 |
-
|
827 |
-
}
|
828 |
-
|
829 |
-
/* opacity */
|
830 |
-
if(pJS.interactivity.modes.bubble.opacity != pJS.particles.opacity.value){
|
831 |
-
|
832 |
-
if(pJS.interactivity.modes.bubble.opacity > pJS.particles.opacity.value){
|
833 |
-
var opacity = pJS.interactivity.modes.bubble.opacity*ratio;
|
834 |
-
if(opacity > p.opacity && opacity <= pJS.interactivity.modes.bubble.opacity){
|
835 |
-
p.opacity_bubble = opacity;
|
836 |
-
}
|
837 |
-
}else{
|
838 |
-
var opacity = p.opacity - (pJS.particles.opacity.value-pJS.interactivity.modes.bubble.opacity)*ratio;
|
839 |
-
if(opacity < p.opacity && opacity >= pJS.interactivity.modes.bubble.opacity){
|
840 |
-
p.opacity_bubble = opacity;
|
841 |
-
}
|
842 |
-
}
|
843 |
-
|
844 |
-
}
|
845 |
-
|
846 |
-
}
|
847 |
-
|
848 |
-
}else{
|
849 |
-
init();
|
850 |
-
}
|
851 |
-
|
852 |
-
|
853 |
-
/* mouseleave */
|
854 |
-
if(pJS.interactivity.status == 'mouseleave'){
|
855 |
-
init();
|
856 |
-
}
|
857 |
-
|
858 |
-
}
|
859 |
-
|
860 |
-
/* on click event */
|
861 |
-
else if(pJS.interactivity.events.onclick.enable && isInArray('bubble', pJS.interactivity.events.onclick.mode)){
|
862 |
-
|
863 |
-
|
864 |
-
if(pJS.tmp.bubble_clicking){
|
865 |
-
var dx_mouse = p.x - pJS.interactivity.mouse.click_pos_x,
|
866 |
-
dy_mouse = p.y - pJS.interactivity.mouse.click_pos_y,
|
867 |
-
dist_mouse = Math.sqrt(dx_mouse*dx_mouse + dy_mouse*dy_mouse),
|
868 |
-
time_spent = (new Date().getTime() - pJS.interactivity.mouse.click_time)/1000;
|
869 |
-
|
870 |
-
if(time_spent > pJS.interactivity.modes.bubble.duration){
|
871 |
-
pJS.tmp.bubble_duration_end = true;
|
872 |
-
}
|
873 |
-
|
874 |
-
if(time_spent > pJS.interactivity.modes.bubble.duration*2){
|
875 |
-
pJS.tmp.bubble_clicking = false;
|
876 |
-
pJS.tmp.bubble_duration_end = false;
|
877 |
-
}
|
878 |
-
}
|
879 |
-
|
880 |
-
|
881 |
-
function process(bubble_param, particles_param, p_obj_bubble, p_obj, id){
|
882 |
-
|
883 |
-
if(bubble_param != particles_param){
|
884 |
-
|
885 |
-
if(!pJS.tmp.bubble_duration_end){
|
886 |
-
if(dist_mouse <= pJS.interactivity.modes.bubble.distance){
|
887 |
-
if(p_obj_bubble != undefined) var obj = p_obj_bubble;
|
888 |
-
else var obj = p_obj;
|
889 |
-
if(obj != bubble_param){
|
890 |
-
var value = p_obj - (time_spent * (p_obj - bubble_param) / pJS.interactivity.modes.bubble.duration);
|
891 |
-
if(id == 'size') p.radius_bubble = value;
|
892 |
-
if(id == 'opacity') p.opacity_bubble = value;
|
893 |
-
}
|
894 |
-
}else{
|
895 |
-
if(id == 'size') p.radius_bubble = undefined;
|
896 |
-
if(id == 'opacity') p.opacity_bubble = undefined;
|
897 |
-
}
|
898 |
-
}else{
|
899 |
-
if(p_obj_bubble != undefined){
|
900 |
-
var value_tmp = p_obj - (time_spent * (p_obj - bubble_param) / pJS.interactivity.modes.bubble.duration),
|
901 |
-
dif = bubble_param - value_tmp;
|
902 |
-
value = bubble_param + dif;
|
903 |
-
if(id == 'size') p.radius_bubble = value;
|
904 |
-
if(id == 'opacity') p.opacity_bubble = value;
|
905 |
-
}
|
906 |
-
}
|
907 |
-
|
908 |
-
}
|
909 |
-
|
910 |
-
}
|
911 |
-
|
912 |
-
if(pJS.tmp.bubble_clicking){
|
913 |
-
/* size */
|
914 |
-
process(pJS.interactivity.modes.bubble.size, pJS.particles.size.value, p.radius_bubble, p.radius, 'size');
|
915 |
-
/* opacity */
|
916 |
-
process(pJS.interactivity.modes.bubble.opacity, pJS.particles.opacity.value, p.opacity_bubble, p.opacity, 'opacity');
|
917 |
-
}
|
918 |
-
|
919 |
-
}
|
920 |
-
|
921 |
-
};
|
922 |
-
|
923 |
-
|
924 |
-
pJS.fn.modes.repulseParticle = function(p){
|
925 |
-
|
926 |
-
if(pJS.interactivity.events.onhover.enable && isInArray('repulse', pJS.interactivity.events.onhover.mode) && pJS.interactivity.status == 'mousemove') {
|
927 |
-
|
928 |
-
var dx_mouse = p.x - pJS.interactivity.mouse.pos_x,
|
929 |
-
dy_mouse = p.y - pJS.interactivity.mouse.pos_y,
|
930 |
-
dist_mouse = Math.sqrt(dx_mouse*dx_mouse + dy_mouse*dy_mouse);
|
931 |
-
|
932 |
-
var normVec = {x: dx_mouse/dist_mouse, y: dy_mouse/dist_mouse},
|
933 |
-
repulseRadius = pJS.interactivity.modes.repulse.distance,
|
934 |
-
velocity = 100,
|
935 |
-
repulseFactor = clamp((1/repulseRadius)*(-1*Math.pow(dist_mouse/repulseRadius,2)+1)*repulseRadius*velocity, 0, 50);
|
936 |
-
|
937 |
-
var pos = {
|
938 |
-
x: p.x + normVec.x * repulseFactor,
|
939 |
-
y: p.y + normVec.y * repulseFactor
|
940 |
-
}
|
941 |
-
|
942 |
-
if(pJS.particles.move.out_mode == 'bounce'){
|
943 |
-
if(pos.x - p.radius > 0 && pos.x + p.radius < pJS.canvas.w) p.x = pos.x;
|
944 |
-
if(pos.y - p.radius > 0 && pos.y + p.radius < pJS.canvas.h) p.y = pos.y;
|
945 |
-
}else{
|
946 |
-
p.x = pos.x;
|
947 |
-
p.y = pos.y;
|
948 |
-
}
|
949 |
-
|
950 |
-
}
|
951 |
-
|
952 |
-
|
953 |
-
else if(pJS.interactivity.events.onclick.enable && isInArray('repulse', pJS.interactivity.events.onclick.mode)) {
|
954 |
-
|
955 |
-
if(!pJS.tmp.repulse_finish){
|
956 |
-
pJS.tmp.repulse_count++;
|
957 |
-
if(pJS.tmp.repulse_count == pJS.particles.array.length){
|
958 |
-
pJS.tmp.repulse_finish = true;
|
959 |
-
}
|
960 |
-
}
|
961 |
-
|
962 |
-
if(pJS.tmp.repulse_clicking){
|
963 |
-
|
964 |
-
var repulseRadius = Math.pow(pJS.interactivity.modes.repulse.distance/6, 3);
|
965 |
-
|
966 |
-
var dx = pJS.interactivity.mouse.click_pos_x - p.x,
|
967 |
-
dy = pJS.interactivity.mouse.click_pos_y - p.y,
|
968 |
-
d = dx*dx + dy*dy;
|
969 |
-
|
970 |
-
var force = -repulseRadius / d * 1;
|
971 |
-
|
972 |
-
function process(){
|
973 |
-
|
974 |
-
var f = Math.atan2(dy,dx);
|
975 |
-
p.vx = force * Math.cos(f);
|
976 |
-
p.vy = force * Math.sin(f);
|
977 |
-
|
978 |
-
if(pJS.particles.move.out_mode == 'bounce'){
|
979 |
-
var pos = {
|
980 |
-
x: p.x + p.vx,
|
981 |
-
y: p.y + p.vy
|
982 |
-
}
|
983 |
-
if (pos.x + p.radius > pJS.canvas.w) p.vx = -p.vx;
|
984 |
-
else if (pos.x - p.radius < 0) p.vx = -p.vx;
|
985 |
-
if (pos.y + p.radius > pJS.canvas.h) p.vy = -p.vy;
|
986 |
-
else if (pos.y - p.radius < 0) p.vy = -p.vy;
|
987 |
-
}
|
988 |
-
|
989 |
-
}
|
990 |
-
|
991 |
-
// default
|
992 |
-
if(d <= repulseRadius){
|
993 |
-
process();
|
994 |
-
}
|
995 |
-
|
996 |
-
// bang - slow motion mode
|
997 |
-
// if(!pJS.tmp.repulse_finish){
|
998 |
-
// if(d <= repulseRadius){
|
999 |
-
// process();
|
1000 |
-
// }
|
1001 |
-
// }else{
|
1002 |
-
// process();
|
1003 |
-
// }
|
1004 |
-
|
1005 |
-
|
1006 |
-
}else{
|
1007 |
-
|
1008 |
-
if(pJS.tmp.repulse_clicking == false){
|
1009 |
-
|
1010 |
-
p.vx = p.vx_i;
|
1011 |
-
p.vy = p.vy_i;
|
1012 |
-
|
1013 |
-
}
|
1014 |
-
|
1015 |
-
}
|
1016 |
-
|
1017 |
-
}
|
1018 |
-
|
1019 |
-
}
|
1020 |
-
|
1021 |
-
|
1022 |
-
pJS.fn.modes.grabParticle = function(p){
|
1023 |
-
|
1024 |
-
if(pJS.interactivity.events.onhover.enable && pJS.interactivity.status == 'mousemove'){
|
1025 |
-
|
1026 |
-
var dx_mouse = p.x - pJS.interactivity.mouse.pos_x,
|
1027 |
-
dy_mouse = p.y - pJS.interactivity.mouse.pos_y,
|
1028 |
-
dist_mouse = Math.sqrt(dx_mouse*dx_mouse + dy_mouse*dy_mouse);
|
1029 |
-
|
1030 |
-
/* draw a line between the cursor and the particle if the distance between them is under the config distance */
|
1031 |
-
if(dist_mouse <= pJS.interactivity.modes.grab.distance){
|
1032 |
-
|
1033 |
-
var opacity_line = pJS.interactivity.modes.grab.line_linked.opacity - (dist_mouse / (1/pJS.interactivity.modes.grab.line_linked.opacity)) / pJS.interactivity.modes.grab.distance;
|
1034 |
-
|
1035 |
-
if(opacity_line > 0){
|
1036 |
-
|
1037 |
-
/* style */
|
1038 |
-
var color_line = pJS.particles.line_linked.color_rgb_line;
|
1039 |
-
pJS.canvas.ctx.strokeStyle = 'rgba('+color_line.r+','+color_line.g+','+color_line.b+','+opacity_line+')';
|
1040 |
-
pJS.canvas.ctx.lineWidth = pJS.particles.line_linked.width;
|
1041 |
-
//pJS.canvas.ctx.lineCap = 'round'; /* performance issue */
|
1042 |
-
|
1043 |
-
/* path */
|
1044 |
-
pJS.canvas.ctx.beginPath();
|
1045 |
-
pJS.canvas.ctx.moveTo(p.x, p.y);
|
1046 |
-
pJS.canvas.ctx.lineTo(pJS.interactivity.mouse.pos_x, pJS.interactivity.mouse.pos_y);
|
1047 |
-
pJS.canvas.ctx.stroke();
|
1048 |
-
pJS.canvas.ctx.closePath();
|
1049 |
-
|
1050 |
-
}
|
1051 |
-
|
1052 |
-
}
|
1053 |
-
|
1054 |
-
}
|
1055 |
-
|
1056 |
-
};
|
1057 |
-
|
1058 |
-
|
1059 |
-
|
1060 |
-
/* ---------- pJS functions - vendors ------------ */
|
1061 |
-
|
1062 |
-
pJS.fn.vendors.eventsListeners = function(){
|
1063 |
-
|
1064 |
-
/* events target element */
|
1065 |
-
if(pJS.interactivity.detect_on == 'window'){
|
1066 |
-
pJS.interactivity.el = window;
|
1067 |
-
}else{
|
1068 |
-
pJS.interactivity.el = pJS.canvas.el;
|
1069 |
-
}
|
1070 |
-
|
1071 |
-
|
1072 |
-
/* detect mouse pos - on hover / click event */
|
1073 |
-
if(pJS.interactivity.events.onhover.enable || pJS.interactivity.events.onclick.enable){
|
1074 |
-
|
1075 |
-
/* el on mousemove */
|
1076 |
-
pJS.interactivity.el.addEventListener('mousemove', function(e){
|
1077 |
-
|
1078 |
-
if(pJS.interactivity.el == window){
|
1079 |
-
var pos_x = e.clientX,
|
1080 |
-
pos_y = e.clientY;
|
1081 |
-
}
|
1082 |
-
else{
|
1083 |
-
var pos_x = e.offsetX || e.clientX,
|
1084 |
-
pos_y = e.offsetY || e.clientY;
|
1085 |
-
}
|
1086 |
-
|
1087 |
-
pJS.interactivity.mouse.pos_x = pos_x;
|
1088 |
-
pJS.interactivity.mouse.pos_y = pos_y;
|
1089 |
-
|
1090 |
-
if(pJS.tmp.retina){
|
1091 |
-
pJS.interactivity.mouse.pos_x *= pJS.canvas.pxratio;
|
1092 |
-
pJS.interactivity.mouse.pos_y *= pJS.canvas.pxratio;
|
1093 |
-
}
|
1094 |
-
|
1095 |
-
pJS.interactivity.status = 'mousemove';
|
1096 |
-
|
1097 |
-
});
|
1098 |
-
|
1099 |
-
/* el on onmouseleave */
|
1100 |
-
pJS.interactivity.el.addEventListener('mouseleave', function(e){
|
1101 |
-
|
1102 |
-
pJS.interactivity.mouse.pos_x = null;
|
1103 |
-
pJS.interactivity.mouse.pos_y = null;
|
1104 |
-
pJS.interactivity.status = 'mouseleave';
|
1105 |
-
|
1106 |
-
});
|
1107 |
-
|
1108 |
-
}
|
1109 |
-
|
1110 |
-
/* on click event */
|
1111 |
-
if(pJS.interactivity.events.onclick.enable){
|
1112 |
-
|
1113 |
-
pJS.interactivity.el.addEventListener('click', function(){
|
1114 |
-
|
1115 |
-
pJS.interactivity.mouse.click_pos_x = pJS.interactivity.mouse.pos_x;
|
1116 |
-
pJS.interactivity.mouse.click_pos_y = pJS.interactivity.mouse.pos_y;
|
1117 |
-
pJS.interactivity.mouse.click_time = new Date().getTime();
|
1118 |
-
|
1119 |
-
if(pJS.interactivity.events.onclick.enable){
|
1120 |
-
|
1121 |
-
switch(pJS.interactivity.events.onclick.mode){
|
1122 |
-
|
1123 |
-
case 'push':
|
1124 |
-
if(pJS.particles.move.enable){
|
1125 |
-
pJS.fn.modes.pushParticles(pJS.interactivity.modes.push.particles_nb, pJS.interactivity.mouse);
|
1126 |
-
}else{
|
1127 |
-
if(pJS.interactivity.modes.push.particles_nb == 1){
|
1128 |
-
pJS.fn.modes.pushParticles(pJS.interactivity.modes.push.particles_nb, pJS.interactivity.mouse);
|
1129 |
-
}
|
1130 |
-
else if(pJS.interactivity.modes.push.particles_nb > 1){
|
1131 |
-
pJS.fn.modes.pushParticles(pJS.interactivity.modes.push.particles_nb);
|
1132 |
-
}
|
1133 |
-
}
|
1134 |
-
break;
|
1135 |
-
|
1136 |
-
case 'remove':
|
1137 |
-
pJS.fn.modes.removeParticles(pJS.interactivity.modes.remove.particles_nb);
|
1138 |
-
break;
|
1139 |
-
|
1140 |
-
case 'bubble':
|
1141 |
-
pJS.tmp.bubble_clicking = true;
|
1142 |
-
break;
|
1143 |
-
|
1144 |
-
case 'repulse':
|
1145 |
-
pJS.tmp.repulse_clicking = true;
|
1146 |
-
pJS.tmp.repulse_count = 0;
|
1147 |
-
pJS.tmp.repulse_finish = false;
|
1148 |
-
setTimeout(function(){
|
1149 |
-
pJS.tmp.repulse_clicking = false;
|
1150 |
-
}, pJS.interactivity.modes.repulse.duration*1000)
|
1151 |
-
break;
|
1152 |
-
|
1153 |
-
}
|
1154 |
-
|
1155 |
-
}
|
1156 |
-
|
1157 |
-
});
|
1158 |
-
|
1159 |
-
}
|
1160 |
-
|
1161 |
-
|
1162 |
-
};
|
1163 |
-
|
1164 |
-
pJS.fn.vendors.densityAutoParticles = function(){
|
1165 |
-
|
1166 |
-
if(pJS.particles.number.density.enable){
|
1167 |
-
|
1168 |
-
/* calc area */
|
1169 |
-
var area = pJS.canvas.el.width * pJS.canvas.el.height / 1000;
|
1170 |
-
if(pJS.tmp.retina){
|
1171 |
-
area = area/(pJS.canvas.pxratio*2);
|
1172 |
-
}
|
1173 |
-
|
1174 |
-
/* calc number of particles based on density area */
|
1175 |
-
var nb_particles = area * pJS.particles.number.value / pJS.particles.number.density.value_area;
|
1176 |
-
|
1177 |
-
/* add or remove X particles */
|
1178 |
-
var missing_particles = pJS.particles.array.length - nb_particles;
|
1179 |
-
if(missing_particles < 0) pJS.fn.modes.pushParticles(Math.abs(missing_particles));
|
1180 |
-
else pJS.fn.modes.removeParticles(missing_particles);
|
1181 |
-
|
1182 |
-
}
|
1183 |
-
|
1184 |
-
};
|
1185 |
-
|
1186 |
-
|
1187 |
-
pJS.fn.vendors.checkOverlap = function(p1, position){
|
1188 |
-
for(var i = 0; i < pJS.particles.array.length; i++){
|
1189 |
-
var p2 = pJS.particles.array[i];
|
1190 |
-
|
1191 |
-
var dx = p1.x - p2.x,
|
1192 |
-
dy = p1.y - p2.y,
|
1193 |
-
dist = Math.sqrt(dx*dx + dy*dy);
|
1194 |
-
|
1195 |
-
if(dist <= p1.radius + p2.radius){
|
1196 |
-
p1.x = position ? position.x : Math.random() * pJS.canvas.w;
|
1197 |
-
p1.y = position ? position.y : Math.random() * pJS.canvas.h;
|
1198 |
-
pJS.fn.vendors.checkOverlap(p1);
|
1199 |
-
}
|
1200 |
-
}
|
1201 |
-
};
|
1202 |
-
|
1203 |
-
|
1204 |
-
pJS.fn.vendors.createSvgImg = function(p){
|
1205 |
-
|
1206 |
-
/* set color to svg element */
|
1207 |
-
var svgXml = pJS.tmp.source_svg,
|
1208 |
-
rgbHex = /#([0-9A-F]{3,6})/gi,
|
1209 |
-
coloredSvgXml = svgXml.replace(rgbHex, function (m, r, g, b) {
|
1210 |
-
if(p.color.rgb){
|
1211 |
-
var color_value = 'rgba('+p.color.rgb.r+','+p.color.rgb.g+','+p.color.rgb.b+','+p.opacity+')';
|
1212 |
-
}else{
|
1213 |
-
var color_value = 'hsla('+p.color.hsl.h+','+p.color.hsl.s+'%,'+p.color.hsl.l+'%,'+p.opacity+')';
|
1214 |
-
}
|
1215 |
-
return color_value;
|
1216 |
-
});
|
1217 |
-
|
1218 |
-
/* prepare to create img with colored svg */
|
1219 |
-
var svg = new Blob([coloredSvgXml], {type: 'image/svg+xml;charset=utf-8'}),
|
1220 |
-
DOMURL = window.URL || window.webkitURL || window,
|
1221 |
-
url = DOMURL.createObjectURL(svg);
|
1222 |
-
|
1223 |
-
/* create particle img obj */
|
1224 |
-
var img = new Image();
|
1225 |
-
img.addEventListener('load', function(){
|
1226 |
-
p.img.obj = img;
|
1227 |
-
p.img.loaded = true;
|
1228 |
-
DOMURL.revokeObjectURL(url);
|
1229 |
-
pJS.tmp.count_svg++;
|
1230 |
-
});
|
1231 |
-
img.src = url;
|
1232 |
-
|
1233 |
-
};
|
1234 |
-
|
1235 |
-
|
1236 |
-
pJS.fn.vendors.destroypJS = function(){
|
1237 |
-
cancelAnimationFrame(pJS.fn.drawAnimFrame);
|
1238 |
-
canvas_el.remove();
|
1239 |
-
pJSDom = null;
|
1240 |
-
};
|
1241 |
-
|
1242 |
-
|
1243 |
-
pJS.fn.vendors.drawShape = function(c, startX, startY, sideLength, sideCountNumerator, sideCountDenominator){
|
1244 |
-
|
1245 |
-
// By Programming Thomas - https://programmingthomas.wordpress.com/2013/04/03/n-sided-shapes/
|
1246 |
-
var sideCount = sideCountNumerator * sideCountDenominator;
|
1247 |
-
var decimalSides = sideCountNumerator / sideCountDenominator;
|
1248 |
-
var interiorAngleDegrees = (180 * (decimalSides - 2)) / decimalSides;
|
1249 |
-
var interiorAngle = Math.PI - Math.PI * interiorAngleDegrees / 180; // convert to radians
|
1250 |
-
c.save();
|
1251 |
-
c.beginPath();
|
1252 |
-
c.translate(startX, startY);
|
1253 |
-
c.moveTo(0,0);
|
1254 |
-
for (var i = 0; i < sideCount; i++) {
|
1255 |
-
c.lineTo(sideLength,0);
|
1256 |
-
c.translate(sideLength,0);
|
1257 |
-
c.rotate(interiorAngle);
|
1258 |
-
}
|
1259 |
-
//c.stroke();
|
1260 |
-
c.fill();
|
1261 |
-
c.restore();
|
1262 |
-
|
1263 |
-
};
|
1264 |
-
|
1265 |
-
pJS.fn.vendors.exportImg = function(){
|
1266 |
-
window.open(pJS.canvas.el.toDataURL('image/png'), '_blank');
|
1267 |
-
};
|
1268 |
-
|
1269 |
-
|
1270 |
-
pJS.fn.vendors.loadImg = function(type){
|
1271 |
-
|
1272 |
-
pJS.tmp.img_error = undefined;
|
1273 |
-
|
1274 |
-
if(pJS.particles.shape.image.src != ''){
|
1275 |
-
|
1276 |
-
if(type == 'svg'){
|
1277 |
-
|
1278 |
-
var xhr = new XMLHttpRequest();
|
1279 |
-
xhr.open('GET', pJS.particles.shape.image.src);
|
1280 |
-
xhr.onreadystatechange = function (data) {
|
1281 |
-
if(xhr.readyState == 4){
|
1282 |
-
if(xhr.status == 200){
|
1283 |
-
pJS.tmp.source_svg = data.currentTarget.response;
|
1284 |
-
pJS.fn.vendors.checkBeforeDraw();
|
1285 |
-
}else{
|
1286 |
-
console.log('Error pJS - Image not found');
|
1287 |
-
pJS.tmp.img_error = true;
|
1288 |
-
}
|
1289 |
-
}
|
1290 |
-
}
|
1291 |
-
xhr.send();
|
1292 |
-
|
1293 |
-
}else{
|
1294 |
-
|
1295 |
-
var img = new Image();
|
1296 |
-
img.addEventListener('load', function(){
|
1297 |
-
pJS.tmp.img_obj = img;
|
1298 |
-
pJS.fn.vendors.checkBeforeDraw();
|
1299 |
-
});
|
1300 |
-
img.src = pJS.particles.shape.image.src;
|
1301 |
-
|
1302 |
-
}
|
1303 |
-
|
1304 |
-
}else{
|
1305 |
-
console.log('Error pJS - No image.src');
|
1306 |
-
pJS.tmp.img_error = true;
|
1307 |
-
}
|
1308 |
-
|
1309 |
-
};
|
1310 |
-
|
1311 |
-
|
1312 |
-
pJS.fn.vendors.draw = function(){
|
1313 |
-
|
1314 |
-
if(pJS.particles.shape.type == 'image'){
|
1315 |
-
|
1316 |
-
if(pJS.tmp.img_type == 'svg'){
|
1317 |
-
|
1318 |
-
if(pJS.tmp.count_svg >= pJS.particles.number.value){
|
1319 |
-
pJS.fn.particlesDraw();
|
1320 |
-
if(!pJS.particles.move.enable) cancelRequestAnimFrame(pJS.fn.drawAnimFrame);
|
1321 |
-
else pJS.fn.drawAnimFrame = requestAnimFrame(pJS.fn.vendors.draw);
|
1322 |
-
}else{
|
1323 |
-
//console.log('still loading...');
|
1324 |
-
if(!pJS.tmp.img_error) pJS.fn.drawAnimFrame = requestAnimFrame(pJS.fn.vendors.draw);
|
1325 |
-
}
|
1326 |
-
|
1327 |
-
}else{
|
1328 |
-
|
1329 |
-
if(pJS.tmp.img_obj != undefined){
|
1330 |
-
pJS.fn.particlesDraw();
|
1331 |
-
if(!pJS.particles.move.enable) cancelRequestAnimFrame(pJS.fn.drawAnimFrame);
|
1332 |
-
else pJS.fn.drawAnimFrame = requestAnimFrame(pJS.fn.vendors.draw);
|
1333 |
-
}else{
|
1334 |
-
if(!pJS.tmp.img_error) pJS.fn.drawAnimFrame = requestAnimFrame(pJS.fn.vendors.draw);
|
1335 |
-
}
|
1336 |
-
|
1337 |
-
}
|
1338 |
-
|
1339 |
-
}else{
|
1340 |
-
pJS.fn.particlesDraw();
|
1341 |
-
if(!pJS.particles.move.enable) cancelRequestAnimFrame(pJS.fn.drawAnimFrame);
|
1342 |
-
else pJS.fn.drawAnimFrame = requestAnimFrame(pJS.fn.vendors.draw);
|
1343 |
-
}
|
1344 |
-
|
1345 |
-
};
|
1346 |
-
|
1347 |
-
|
1348 |
-
pJS.fn.vendors.checkBeforeDraw = function(){
|
1349 |
-
|
1350 |
-
// if shape is image
|
1351 |
-
if(pJS.particles.shape.type == 'image'){
|
1352 |
-
|
1353 |
-
if(pJS.tmp.img_type == 'svg' && pJS.tmp.source_svg == undefined){
|
1354 |
-
pJS.tmp.checkAnimFrame = requestAnimFrame(check);
|
1355 |
-
}else{
|
1356 |
-
//console.log('images loaded! cancel check');
|
1357 |
-
cancelRequestAnimFrame(pJS.tmp.checkAnimFrame);
|
1358 |
-
if(!pJS.tmp.img_error){
|
1359 |
-
pJS.fn.vendors.init();
|
1360 |
-
pJS.fn.vendors.draw();
|
1361 |
-
}
|
1362 |
-
|
1363 |
-
}
|
1364 |
-
|
1365 |
-
}else{
|
1366 |
-
pJS.fn.vendors.init();
|
1367 |
-
pJS.fn.vendors.draw();
|
1368 |
-
}
|
1369 |
-
|
1370 |
-
};
|
1371 |
-
|
1372 |
-
|
1373 |
-
pJS.fn.vendors.init = function(){
|
1374 |
-
|
1375 |
-
/* init canvas + particles */
|
1376 |
-
pJS.fn.retinaInit();
|
1377 |
-
pJS.fn.canvasInit();
|
1378 |
-
pJS.fn.canvasSize();
|
1379 |
-
pJS.fn.canvasPaint();
|
1380 |
-
pJS.fn.particlesCreate();
|
1381 |
-
pJS.fn.vendors.densityAutoParticles();
|
1382 |
-
|
1383 |
-
/* particles.line_linked - convert hex colors to rgb */
|
1384 |
-
pJS.particles.line_linked.color_rgb_line = hexToRgb(pJS.particles.line_linked.color);
|
1385 |
-
|
1386 |
-
};
|
1387 |
-
|
1388 |
-
|
1389 |
-
pJS.fn.vendors.start = function(){
|
1390 |
-
|
1391 |
-
if(isInArray('image', pJS.particles.shape.type)){
|
1392 |
-
pJS.tmp.img_type = pJS.particles.shape.image.src.substr(pJS.particles.shape.image.src.length - 3);
|
1393 |
-
pJS.fn.vendors.loadImg(pJS.tmp.img_type);
|
1394 |
-
}else{
|
1395 |
-
pJS.fn.vendors.checkBeforeDraw();
|
1396 |
-
}
|
1397 |
-
|
1398 |
-
};
|
1399 |
-
|
1400 |
-
|
1401 |
-
|
1402 |
-
|
1403 |
-
/* ---------- pJS - start ------------ */
|
1404 |
-
|
1405 |
-
|
1406 |
-
pJS.fn.vendors.eventsListeners();
|
1407 |
-
|
1408 |
-
pJS.fn.vendors.start();
|
1409 |
-
|
1410 |
-
|
1411 |
-
|
1412 |
-
};
|
1413 |
-
|
1414 |
-
/* ---------- global functions - vendors ------------ */
|
1415 |
-
|
1416 |
-
Object.deepExtend = function(destination, source) {
|
1417 |
-
for (var property in source) {
|
1418 |
-
if (source[property] && source[property].constructor &&
|
1419 |
-
source[property].constructor === Object) {
|
1420 |
-
destination[property] = destination[property] || {};
|
1421 |
-
arguments.callee(destination[property], source[property]);
|
1422 |
-
} else {
|
1423 |
-
destination[property] = source[property];
|
1424 |
-
}
|
1425 |
-
}
|
1426 |
-
return destination;
|
1427 |
-
};
|
1428 |
-
|
1429 |
-
window.requestAnimFrame = (function(){
|
1430 |
-
return window.requestAnimationFrame ||
|
1431 |
-
window.webkitRequestAnimationFrame ||
|
1432 |
-
window.mozRequestAnimationFrame ||
|
1433 |
-
window.oRequestAnimationFrame ||
|
1434 |
-
window.msRequestAnimationFrame ||
|
1435 |
-
function(callback){
|
1436 |
-
window.setTimeout(callback, 1000 / 60);
|
1437 |
-
};
|
1438 |
-
})();
|
1439 |
-
|
1440 |
-
window.cancelRequestAnimFrame = ( function() {
|
1441 |
-
return window.cancelAnimationFrame ||
|
1442 |
-
window.webkitCancelRequestAnimationFrame ||
|
1443 |
-
window.mozCancelRequestAnimationFrame ||
|
1444 |
-
window.oCancelRequestAnimationFrame ||
|
1445 |
-
window.msCancelRequestAnimationFrame ||
|
1446 |
-
clearTimeout
|
1447 |
-
} )();
|
1448 |
-
|
1449 |
-
function hexToRgb(hex){
|
1450 |
-
// By Tim Down - http://stackoverflow.com/a/5624139/3493650
|
1451 |
-
// Expand shorthand form (e.g. "03F") to full form (e.g. "0033FF")
|
1452 |
-
var shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
|
1453 |
-
hex = hex.replace(shorthandRegex, function(m, r, g, b) {
|
1454 |
-
return r + r + g + g + b + b;
|
1455 |
-
});
|
1456 |
-
var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
|
1457 |
-
return result ? {
|
1458 |
-
r: parseInt(result[1], 16),
|
1459 |
-
g: parseInt(result[2], 16),
|
1460 |
-
b: parseInt(result[3], 16)
|
1461 |
-
} : null;
|
1462 |
-
};
|
1463 |
-
|
1464 |
-
function clamp(number, min, max) {
|
1465 |
-
return Math.min(Math.max(number, min), max);
|
1466 |
-
};
|
1467 |
-
|
1468 |
-
function isInArray(value, array) {
|
1469 |
-
return array.indexOf(value) > -1;
|
1470 |
-
}
|
1471 |
-
|
1472 |
-
|
1473 |
-
/* ---------- particles.js functions - start ------------ */
|
1474 |
-
|
1475 |
-
window.pJSDom = [];
|
1476 |
-
|
1477 |
-
window.particlesJS = function(tag_id, params){
|
1478 |
-
|
1479 |
-
/* no string id? so it's object params, and set the id with default id */
|
1480 |
-
if(typeof(tag_id) != 'string'){
|
1481 |
-
params = tag_id;
|
1482 |
-
tag_id = 'particles-js';
|
1483 |
-
}
|
1484 |
-
|
1485 |
-
/* no id? set the id to default id */
|
1486 |
-
if(!tag_id){
|
1487 |
-
tag_id = 'particles-js';
|
1488 |
-
}
|
1489 |
-
|
1490 |
-
/* pJS elements */
|
1491 |
-
var pJS_tag = document.getElementById(tag_id),
|
1492 |
-
pJS_canvas_class = 'particles-js-canvas-el',
|
1493 |
-
exist_canvas = pJS_tag.getElementsByClassName(pJS_canvas_class);
|
1494 |
-
|
1495 |
-
/* remove canvas if exists into the pJS target tag */
|
1496 |
-
if(exist_canvas.length){
|
1497 |
-
while(exist_canvas.length > 0){
|
1498 |
-
pJS_tag.removeChild(exist_canvas[0]);
|
1499 |
-
}
|
1500 |
-
}
|
1501 |
-
|
1502 |
-
/* create canvas element */
|
1503 |
-
var canvas_el = document.createElement('canvas');
|
1504 |
-
canvas_el.className = pJS_canvas_class;
|
1505 |
-
|
1506 |
-
/* set size canvas */
|
1507 |
-
canvas_el.style.width = "100%";
|
1508 |
-
canvas_el.style.height = "100%";
|
1509 |
-
|
1510 |
-
/* append canvas */
|
1511 |
-
var canvas = document.getElementById(tag_id).appendChild(canvas_el);
|
1512 |
-
|
1513 |
-
/* launch particle.js */
|
1514 |
-
if(canvas != null){
|
1515 |
-
pJSDom.push(new pJS(tag_id, params));
|
1516 |
-
}
|
1517 |
-
|
1518 |
-
};
|
1519 |
-
|
1520 |
-
window.particlesJS.load = function(tag_id, path_config_json, callback){
|
1521 |
-
|
1522 |
-
/* load json config */
|
1523 |
-
var xhr = new XMLHttpRequest();
|
1524 |
-
xhr.open('GET', path_config_json);
|
1525 |
-
xhr.onreadystatechange = function (data) {
|
1526 |
-
if(xhr.readyState == 4){
|
1527 |
-
if(xhr.status == 200){
|
1528 |
-
var params = JSON.parse(data.currentTarget.response);
|
1529 |
-
window.particlesJS(tag_id, params);
|
1530 |
-
if(callback) callback();
|
1531 |
-
}else{
|
1532 |
-
console.log('Error pJS - XMLHttpRequest status: '+xhr.status);
|
1533 |
-
console.log('Error pJS - File config not found');
|
1534 |
-
}
|
1535 |
-
}
|
1536 |
-
};
|
1537 |
-
xhr.send();
|
1538 |
-
|
1539 |
};
|
1 |
+
/* -----------------------------------------------
|
2 |
+
/* Author : Vincent Garreau - vincentgarreau.com
|
3 |
+
/* MIT license: http://opensource.org/licenses/MIT
|
4 |
+
/* Demo / Generator : vincentgarreau.com/particles.js
|
5 |
+
/* GitHub : github.com/VincentGarreau/particles.js
|
6 |
+
/* How to use? : Check the GitHub README
|
7 |
+
/* v2.0.0
|
8 |
+
/* ----------------------------------------------- */
|
9 |
+
|
10 |
+
var pJS = function(tag_id, params){
|
11 |
+
|
12 |
+
var canvas_el = document.querySelector('#'+tag_id+' > .particles-js-canvas-el');
|
13 |
+
|
14 |
+
/* particles.js variables with default values */
|
15 |
+
this.pJS = {
|
16 |
+
canvas: {
|
17 |
+
el: canvas_el,
|
18 |
+
w: canvas_el.offsetWidth,
|
19 |
+
h: canvas_el.offsetHeight
|
20 |
+
},
|
21 |
+
particles: {
|
22 |
+
number: {
|
23 |
+
value: 400,
|
24 |
+
density: {
|
25 |
+
enable: true,
|
26 |
+
value_area: 800
|
27 |
+
}
|
28 |
+
},
|
29 |
+
color: {
|
30 |
+
value: '#fff'
|
31 |
+
},
|
32 |
+
shape: {
|
33 |
+
type: 'circle',
|
34 |
+
stroke: {
|
35 |
+
width: 0,
|
36 |
+
color: '#ff0000'
|
37 |
+
},
|
38 |
+
polygon: {
|
39 |
+
nb_sides: 5
|
40 |
+
},
|
41 |
+
image: {
|
42 |
+
src: '',
|
43 |
+
width: 100,
|
44 |
+
height: 100
|
45 |
+
}
|
46 |
+
},
|
47 |
+
opacity: {
|
48 |
+
value: 1,
|
49 |
+
random: false,
|
50 |
+
anim: {
|
51 |
+
enable: false,
|
52 |
+
speed: 2,
|
53 |
+
opacity_min: 0,
|
54 |
+
sync: false
|
55 |
+
}
|
56 |
+
},
|
57 |
+
size: {
|
58 |
+
value: 20,
|
59 |
+
random: false,
|
60 |
+
anim: {
|
61 |
+
enable: false,
|
62 |
+
speed: 20,
|
63 |
+
size_min: 0,
|
64 |
+
sync: false
|
65 |
+
}
|
66 |
+
},
|
67 |
+
line_linked: {
|
68 |
+
enable: true,
|
69 |
+
distance: 100,
|
70 |
+
color: '#fff',
|
71 |
+
opacity: 1,
|
72 |
+
width: 1
|
73 |
+
},
|
74 |
+
move: {
|
75 |
+
enable: true,
|
76 |
+
speed: 2,
|
77 |
+
direction: 'none',
|
78 |
+
random: false,
|
79 |
+
straight: false,
|
80 |
+
out_mode: 'out',
|
81 |
+
bounce: false,
|
82 |
+
attract: {
|
83 |
+
enable: false,
|
84 |
+
rotateX: 3000,
|
85 |
+
rotateY: 3000
|
86 |
+
}
|
87 |
+
},
|
88 |
+
array: []
|
89 |
+
},
|
90 |
+
interactivity: {
|
91 |
+
detect_on: 'canvas',
|
92 |
+
events: {
|
93 |
+
onhover: {
|
94 |
+
enable: true,
|
95 |
+
mode: 'grab'
|
96 |
+
},
|
97 |
+
onclick: {
|
98 |
+
enable: true,
|
99 |
+
mode: 'push'
|
100 |
+
},
|
101 |
+
resize: true
|
102 |
+
},
|
103 |
+
modes: {
|
104 |
+
grab:{
|
105 |
+
distance: 100,
|
106 |
+
line_linked:{
|
107 |
+
opacity: 1
|
108 |
+
}
|
109 |
+
},
|
110 |
+
bubble:{
|
111 |
+
distance: 200,
|
112 |
+
size: 80,
|
113 |
+
duration: 0.4
|
114 |
+
},
|
115 |
+
repulse:{
|
116 |
+
distance: 200,
|
117 |
+
duration: 0.4
|
118 |
+
},
|
119 |
+
push:{
|
120 |
+
particles_nb: 4
|
121 |
+
},
|
122 |
+
remove:{
|
123 |
+
particles_nb: 2
|
124 |
+
}
|
125 |
+
},
|
126 |
+
mouse:{}
|
127 |
+
},
|
128 |
+
retina_detect: false,
|
129 |
+
fn: {
|
130 |
+
interact: {},
|
131 |
+
modes: {},
|
132 |
+
vendors:{}
|
133 |
+
},
|
134 |
+
tmp: {}
|
135 |
+
};
|
136 |
+
|
137 |
+
var pJS = this.pJS;
|
138 |
+
|
139 |
+
/* params settings */
|
140 |
+
if(params){
|
141 |
+
Object.deepExtend(pJS, params);
|
142 |
+
}
|
143 |
+
|
144 |
+
pJS.tmp.obj = {
|
145 |
+
size_value: pJS.particles.size.value,
|
146 |
+
size_anim_speed: pJS.particles.size.anim.speed,
|
147 |
+
move_speed: pJS.particles.move.speed,
|
148 |
+
line_linked_distance: pJS.particles.line_linked.distance,
|
149 |
+
line_linked_width: pJS.particles.line_linked.width,
|
150 |
+
mode_grab_distance: pJS.interactivity.modes.grab.distance,
|
151 |
+
mode_bubble_distance: pJS.interactivity.modes.bubble.distance,
|
152 |
+
mode_bubble_size: pJS.interactivity.modes.bubble.size,
|
153 |
+
mode_repulse_distance: pJS.interactivity.modes.repulse.distance
|
154 |
+
};
|
155 |
+
|
156 |
+
|
157 |
+
pJS.fn.retinaInit = function(){
|
158 |
+
|
159 |
+
if(pJS.retina_detect && window.devicePixelRatio > 1){
|
160 |
+
pJS.canvas.pxratio = window.devicePixelRatio;
|
161 |
+
pJS.tmp.retina = true;
|
162 |
+
}
|
163 |
+
else{
|
164 |
+
pJS.canvas.pxratio = 1;
|
165 |
+
pJS.tmp.retina = false;
|
166 |
+
}
|
167 |
+
|
168 |
+
pJS.canvas.w = pJS.canvas.el.offsetWidth * pJS.canvas.pxratio;
|
169 |
+
pJS.canvas.h = pJS.canvas.el.offsetHeight * pJS.canvas.pxratio;
|
170 |
+
|
171 |
+
pJS.particles.size.value = pJS.tmp.obj.size_value * pJS.canvas.pxratio;
|
172 |
+
pJS.particles.size.anim.speed = pJS.tmp.obj.size_anim_speed * pJS.canvas.pxratio;
|
173 |
+
pJS.particles.move.speed = pJS.tmp.obj.move_speed * pJS.canvas.pxratio;
|
174 |
+
pJS.particles.line_linked.distance = pJS.tmp.obj.line_linked_distance * pJS.canvas.pxratio;
|
175 |
+
pJS.interactivity.modes.grab.distance = pJS.tmp.obj.mode_grab_distance * pJS.canvas.pxratio;
|
176 |
+
pJS.interactivity.modes.bubble.distance = pJS.tmp.obj.mode_bubble_distance * pJS.canvas.pxratio;
|
177 |
+
pJS.particles.line_linked.width = pJS.tmp.obj.line_linked_width * pJS.canvas.pxratio;
|
178 |
+
pJS.interactivity.modes.bubble.size = pJS.tmp.obj.mode_bubble_size * pJS.canvas.pxratio;
|
179 |
+
pJS.interactivity.modes.repulse.distance = pJS.tmp.obj.mode_repulse_distance * pJS.canvas.pxratio;
|
180 |
+
|
181 |
+
};
|
182 |
+
|
183 |
+
|
184 |
+
|
185 |
+
/* ---------- pJS functions - canvas ------------ */
|
186 |
+
|
187 |
+
pJS.fn.canvasInit = function(){
|
188 |
+
pJS.canvas.ctx = pJS.canvas.el.getContext('2d');
|
189 |
+
};
|
190 |
+
|
191 |
+
pJS.fn.canvasSize = function(){
|
192 |
+
|
193 |
+
pJS.canvas.el.width = pJS.canvas.w;
|
194 |
+
pJS.canvas.el.height = pJS.canvas.h;
|
195 |
+
|
196 |
+
if(pJS && pJS.interactivity.events.resize){
|
197 |
+
|
198 |
+
window.addEventListener('resize', function(){
|
199 |
+
|
200 |
+
pJS.canvas.w = pJS.canvas.el.offsetWidth;
|
201 |
+
pJS.canvas.h = pJS.canvas.el.offsetHeight;
|
202 |
+
|
203 |
+
/* resize canvas */
|
204 |
+
if(pJS.tmp.retina){
|
205 |
+
pJS.canvas.w *= pJS.canvas.pxratio;
|
206 |
+
pJS.canvas.h *= pJS.canvas.pxratio;
|
207 |
+
}
|
208 |
+
|
209 |
+
pJS.canvas.el.width = pJS.canvas.w;
|
210 |
+
pJS.canvas.el.height = pJS.canvas.h;
|
211 |
+
|
212 |
+
/* repaint canvas on anim disabled */
|
213 |
+
if(!pJS.particles.move.enable){
|
214 |
+
pJS.fn.particlesEmpty();
|
215 |
+
pJS.fn.particlesCreate();
|
216 |
+
pJS.fn.particlesDraw();
|
217 |
+
pJS.fn.vendors.densityAutoParticles();
|
218 |
+
}
|
219 |
+
|
220 |
+
/* density particles enabled */
|
221 |
+
pJS.fn.vendors.densityAutoParticles();
|
222 |
+
|
223 |
+
});
|
224 |
+
|
225 |
+
}
|
226 |
+
|
227 |
+
};
|
228 |
+
|
229 |
+
|
230 |
+
pJS.fn.canvasPaint = function(){
|
231 |
+
pJS.canvas.ctx.fillRect(0, 0, pJS.canvas.w, pJS.canvas.h);
|
232 |
+
};
|
233 |
+
|
234 |
+
pJS.fn.canvasClear = function(){
|
235 |
+
pJS.canvas.ctx.clearRect(0, 0, pJS.canvas.w, pJS.canvas.h);
|
236 |
+
};
|
237 |
+
|
238 |
+
|
239 |
+
/* --------- pJS functions - particles ----------- */
|
240 |
+
|
241 |
+
pJS.fn.particle = function(color, opacity, position){
|
242 |
+
|
243 |
+
/* size */
|
244 |
+
this.radius = (pJS.particles.size.random ? Math.random() : 1) * pJS.particles.size.value;
|
245 |
+
if(pJS.particles.size.anim.enable){
|
246 |
+
this.size_status = false;
|
247 |
+
this.vs = pJS.particles.size.anim.speed / 100;
|
248 |
+
if(!pJS.particles.size.anim.sync){
|
249 |
+
this.vs = this.vs * Math.random();
|
250 |
+
}
|
251 |
+
}
|
252 |
+
|
253 |
+
/* position */
|
254 |
+
this.x = position ? position.x : Math.random() * pJS.canvas.w;
|
255 |
+
this.y = position ? position.y : Math.random() * pJS.canvas.h;
|
256 |
+
|
257 |
+
/* check position - into the canvas */
|
258 |
+
if(this.x > pJS.canvas.w - this.radius*2) this.x = this.x - this.radius;
|
259 |
+
else if(this.x < this.radius*2) this.x = this.x + this.radius;
|
260 |
+
if(this.y > pJS.canvas.h - this.radius*2) this.y = this.y - this.radius;
|
261 |
+
else if(this.y < this.radius*2) this.y = this.y + this.radius;
|
262 |
+
|
263 |
+
/* check position - avoid overlap */
|
264 |
+
if(pJS.particles.move.bounce){
|
265 |
+
pJS.fn.vendors.checkOverlap(this, position);
|
266 |
+
}
|
267 |
+
|
268 |
+
/* color */
|
269 |
+
this.color = {};
|
270 |
+
if(typeof(color.value) == 'object'){
|
271 |
+
|
272 |
+
if(color.value instanceof Array){
|
273 |
+
var color_selected = color.value[Math.floor(Math.random() * pJS.particles.color.value.length)];
|
274 |
+
this.color.rgb = hexToRgb(color_selected);
|
275 |
+
}else{
|
276 |
+
if(color.value.r != undefined && color.value.g != undefined && color.value.b != undefined){
|
277 |
+
this.color.rgb = {
|
278 |
+
r: color.value.r,
|
279 |
+
g: color.value.g,
|
280 |
+
b: color.value.b
|
281 |
+
}
|
282 |
+
}
|
283 |
+
if(color.value.h != undefined && color.value.s != undefined && color.value.l != undefined){
|
284 |
+
this.color.hsl = {
|
285 |
+
h: color.value.h,
|
286 |
+
s: color.value.s,
|
287 |
+
l: color.value.l
|
288 |
+
}
|
289 |
+
}
|
290 |
+
}
|
291 |
+
|
292 |
+
}
|
293 |
+
else if(color.value == 'random'){
|
294 |
+
this.color.rgb = {
|
295 |
+
r: (Math.floor(Math.random() * (255 - 0 + 1)) + 0),
|
296 |
+
g: (Math.floor(Math.random() * (255 - 0 + 1)) + 0),
|
297 |
+
b: (Math.floor(Math.random() * (255 - 0 + 1)) + 0)
|
298 |
+
}
|
299 |
+
}
|
300 |
+
else if(typeof(color.value) == 'string'){
|
301 |
+
this.color = color;
|
302 |
+
this.color.rgb = hexToRgb(this.color.value);
|
303 |
+
}
|
304 |
+
|
305 |
+
/* opacity */
|
306 |
+
this.opacity = (pJS.particles.opacity.random ? Math.random() : 1) * pJS.particles.opacity.value;
|
307 |
+
if(pJS.particles.opacity.anim.enable){
|
308 |
+
this.opacity_status = false;
|
309 |
+
this.vo = pJS.particles.opacity.anim.speed / 100;
|
310 |
+
if(!pJS.particles.opacity.anim.sync){
|
311 |
+
this.vo = this.vo * Math.random();
|
312 |
+
}
|
313 |
+
}
|
314 |
+
|
315 |
+
/* animation - velocity for speed */
|
316 |
+
var velbase = {}
|
317 |
+
switch(pJS.particles.move.direction){
|
318 |
+
case 'top':
|
319 |
+
velbase = { x:0, y:-1 };
|
320 |
+
break;
|
321 |
+
case 'top-right':
|
322 |
+
velbase = { x:0.5, y:-0.5 };
|
323 |
+
break;
|
324 |
+
case 'right':
|
325 |
+
velbase = { x:1, y:-0 };
|
326 |
+
break;
|
327 |
+
case 'bottom-right':
|
328 |
+
velbase = { x:0.5, y:0.5 };
|
329 |
+
break;
|
330 |
+
case 'bottom':
|
331 |
+
velbase = { x:0, y:1 };
|
332 |
+
break;
|
333 |
+
case 'bottom-left':
|
334 |
+
velbase = { x:-0.5, y:1 };
|
335 |
+
break;
|
336 |
+
case 'left':
|
337 |
+
velbase = { x:-1, y:0 };
|
338 |
+
break;
|
339 |
+
case 'top-left':
|
340 |
+
velbase = { x:-0.5, y:-0.5 };
|
341 |
+
break;
|
342 |
+
default:
|
343 |
+
velbase = { x:0, y:0 };
|
344 |
+
break;
|
345 |
+
}
|
346 |
+
|
347 |
+
if(pJS.particles.move.straight){
|
348 |
+
this.vx = velbase.x;
|
349 |
+
this.vy = velbase.y;
|
350 |
+
if(pJS.particles.move.random){
|
351 |
+
this.vx = this.vx * (Math.random());
|
352 |
+
this.vy = this.vy * (Math.random());
|
353 |
+
}
|
354 |
+
}else{
|
355 |
+
this.vx = velbase.x + Math.random()-0.5;
|
356 |
+
this.vy = velbase.y + Math.random()-0.5;
|
357 |
+
}
|
358 |
+
|
359 |
+
// var theta = 2.0 * Math.PI * Math.random();
|
360 |
+
// this.vx = Math.cos(theta);
|
361 |
+
// this.vy = Math.sin(theta);
|
362 |
+
|
363 |
+
this.vx_i = this.vx;
|
364 |
+
this.vy_i = this.vy;
|
365 |
+
|
366 |
+
|
367 |
+
|
368 |
+
/* if shape is image */
|
369 |
+
|
370 |
+
var shape_type = pJS.particles.shape.type;
|
371 |
+
if(typeof(shape_type) == 'object'){
|
372 |
+
if(shape_type instanceof Array){
|
373 |
+
var shape_selected = shape_type[Math.floor(Math.random() * shape_type.length)];
|
374 |
+
this.shape = shape_selected;
|
375 |
+
}
|
376 |
+
}else{
|
377 |
+
this.shape = shape_type;
|
378 |
+
}
|
379 |
+
|
380 |
+
if(this.shape == 'image'){
|
381 |
+
var sh = pJS.particles.shape;
|
382 |
+
this.img = {
|
383 |
+
src: sh.image.src,
|
384 |
+
ratio: sh.image.width / sh.image.height
|
385 |
+
}
|
386 |
+
if(!this.img.ratio) this.img.ratio = 1;
|
387 |
+
if(pJS.tmp.img_type == 'svg' && pJS.tmp.source_svg != undefined){
|
388 |
+
pJS.fn.vendors.createSvgImg(this);
|
389 |
+
if(pJS.tmp.pushing){
|
390 |
+
this.img.loaded = false;
|
391 |
+
}
|
392 |
+
}
|
393 |
+
}
|
394 |
+
|
395 |
+
|
396 |
+
|
397 |
+
};
|
398 |
+
|
399 |
+
|
400 |
+
pJS.fn.particle.prototype.draw = function() {
|
401 |
+
|
402 |
+
var p = this;
|
403 |
+
|
404 |
+
if(p.radius_bubble != undefined){
|
405 |
+
var radius = p.radius_bubble;
|
406 |
+
}else{
|
407 |
+
var radius = p.radius;
|
408 |
+
}
|
409 |
+
|
410 |
+
if(p.opacity_bubble != undefined){
|
411 |
+
var opacity = p.opacity_bubble;
|
412 |
+
}else{
|
413 |
+
var opacity = p.opacity;
|
414 |
+
}
|
415 |
+
|
416 |
+
if(p.color.rgb){
|
417 |
+
var color_value = 'rgba('+p.color.rgb.r+','+p.color.rgb.g+','+p.color.rgb.b+','+opacity+')';
|
418 |
+
}else{
|
419 |
+
var color_value = 'hsla('+p.color.hsl.h+','+p.color.hsl.s+'%,'+p.color.hsl.l+'%,'+opacity+')';
|
420 |
+
}
|
421 |
+
|
422 |
+
pJS.canvas.ctx.fillStyle = color_value;
|
423 |
+
pJS.canvas.ctx.beginPath();
|
424 |
+
|
425 |
+
switch(p.shape){
|
426 |
+
|
427 |
+
case 'circle':
|
428 |
+
pJS.canvas.ctx.arc(p.x, p.y, radius, 0, Math.PI * 2, false);
|
429 |
+
break;
|
430 |
+
|
431 |
+
case 'edge':
|
432 |
+
pJS.canvas.ctx.rect(p.x-radius, p.y-radius, radius*2, radius*2);
|
433 |
+
break;
|
434 |
+
|
435 |
+
case 'triangle':
|
436 |
+
pJS.fn.vendors.drawShape(pJS.canvas.ctx, p.x-radius, p.y+radius / 1.66, radius*2, 3, 2);
|
437 |
+
break;
|
438 |
+
|
439 |
+
case 'polygon':
|
440 |
+
pJS.fn.vendors.drawShape(
|
441 |
+
pJS.canvas.ctx,
|
442 |
+
p.x - radius / (pJS.particles.shape.polygon.nb_sides/3.5), // startX
|
443 |
+
p.y - radius / (2.66/3.5), // startY
|
444 |
+
radius*2.66 / (pJS.particles.shape.polygon.nb_sides/3), // sideLength
|
445 |
+
pJS.particles.shape.polygon.nb_sides, // sideCountNumerator
|
446 |
+
1 // sideCountDenominator
|
447 |
+
);
|
448 |
+
break;
|
449 |
+
|
450 |
+
case 'star':
|
451 |
+
pJS.fn.vendors.drawShape(
|
452 |
+
pJS.canvas.ctx,
|
453 |
+
p.x - radius*2 / (pJS.particles.shape.polygon.nb_sides/4), // startX
|
454 |
+
p.y - radius / (2*2.66/3.5), // startY
|
455 |
+
radius*2*2.66 / (pJS.particles.shape.polygon.nb_sides/3), // sideLength
|
456 |
+
pJS.particles.shape.polygon.nb_sides, // sideCountNumerator
|
457 |
+
2 // sideCountDenominator
|
458 |
+
);
|
459 |
+
break;
|
460 |
+
|
461 |
+
case 'image':
|
462 |
+
|
463 |
+
function draw(){
|
464 |
+
pJS.canvas.ctx.drawImage(
|
465 |
+
img_obj,
|
466 |
+
p.x-radius,
|
467 |
+
p.y-radius,
|
468 |
+
radius*2,
|
469 |
+
radius*2 / p.img.ratio
|
470 |
+
);
|
471 |
+
}
|
472 |
+
|
473 |
+
if(pJS.tmp.img_type == 'svg'){
|
474 |
+
var img_obj = p.img.obj;
|
475 |
+
}else{
|
476 |
+
var img_obj = pJS.tmp.img_obj;
|
477 |
+
}
|
478 |
+
|
479 |
+
if(img_obj){
|
480 |
+
draw();
|
481 |
+
}
|
482 |
+
|
483 |
+
break;
|
484 |
+
|
485 |
+
}
|
486 |
+
|
487 |
+
pJS.canvas.ctx.closePath();
|
488 |
+
|
489 |
+
if(pJS.particles.shape.stroke.width > 0){
|
490 |
+
pJS.canvas.ctx.strokeStyle = pJS.particles.shape.stroke.color;
|
491 |
+
pJS.canvas.ctx.lineWidth = pJS.particles.shape.stroke.width;
|
492 |
+
pJS.canvas.ctx.stroke();
|
493 |
+
}
|
494 |
+
|
495 |
+
pJS.canvas.ctx.fill();
|
496 |
+
|
497 |
+
};
|
498 |
+
|
499 |
+
|
500 |
+
pJS.fn.particlesCreate = function(){
|
501 |
+
for(var i = 0; i < pJS.particles.number.value; i++) {
|
502 |
+
pJS.particles.array.push(new pJS.fn.particle(pJS.particles.color, pJS.particles.opacity.value));
|
503 |
+
}
|
504 |
+
};
|
505 |
+
|
506 |
+
pJS.fn.particlesUpdate = function(){
|
507 |
+
|
508 |
+
for(var i = 0; i < pJS.particles.array.length; i++){
|
509 |
+
|
510 |
+
/* the particle */
|
511 |
+
var p = pJS.particles.array[i];
|
512 |
+
|
513 |
+
// var d = ( dx = pJS.interactivity.mouse.click_pos_x - p.x ) * dx + ( dy = pJS.interactivity.mouse.click_pos_y - p.y ) * dy;
|
514 |
+
// var f = -BANG_SIZE / d;
|
515 |
+
// if ( d < BANG_SIZE ) {
|
516 |
+
// var t = Math.atan2( dy, dx );
|
517 |
+
// p.vx = f * Math.cos(t);
|
518 |
+
// p.vy = f * Math.sin(t);
|
519 |
+
// }
|
520 |
+
|
521 |
+
/* move the particle */
|
522 |
+
if(pJS.particles.move.enable){
|
523 |
+
var ms = pJS.particles.move.speed/2;
|
524 |
+
p.x += p.vx * ms;
|
525 |
+
p.y += p.vy * ms;
|
526 |
+
}
|
527 |
+
|
528 |
+
/* change opacity status */
|
529 |
+
if(pJS.particles.opacity.anim.enable) {
|
530 |
+
if(p.opacity_status == true) {
|
531 |
+
if(p.opacity >= pJS.particles.opacity.value) p.opacity_status = false;
|
532 |
+
p.opacity += p.vo;
|
533 |
+
}else {
|
534 |
+
if(p.opacity <= pJS.particles.opacity.anim.opacity_min) p.opacity_status = true;
|
535 |
+
p.opacity -= p.vo;
|
536 |
+
}
|
537 |
+
if(p.opacity < 0) p.opacity = 0;
|
538 |
+
}
|
539 |
+
|
540 |
+
/* change size */
|
541 |
+
if(pJS.particles.size.anim.enable){
|
542 |
+
if(p.size_status == true){
|
543 |
+
if(p.radius >= pJS.particles.size.value) p.size_status = false;
|
544 |
+
p.radius += p.vs;
|
545 |
+
}else{
|
546 |
+
if(p.radius <= pJS.particles.size.anim.size_min) p.size_status = true;
|
547 |
+
p.radius -= p.vs;
|
548 |
+
}
|
549 |
+
if(p.radius < 0) p.radius = 0;
|
550 |
+
}
|
551 |
+
|
552 |
+
/* change particle position if it is out of canvas */
|
553 |
+
if(pJS.particles.move.out_mode == 'bounce'){
|
554 |
+
var new_pos = {
|
555 |
+
x_left: p.radius,
|
556 |
+
x_right: pJS.canvas.w,
|
557 |
+
y_top: p.radius,
|
558 |
+
y_bottom: pJS.canvas.h
|
559 |
+
}
|
560 |
+
}else{
|
561 |
+
var new_pos = {
|
562 |
+
x_left: -p.radius,
|
563 |
+
x_right: pJS.canvas.w + p.radius,
|
564 |
+
y_top: -p.radius,
|
565 |
+
y_bottom: pJS.canvas.h + p.radius
|
566 |
+
}
|
567 |
+
}
|
568 |
+
|
569 |
+
if(p.x - p.radius > pJS.canvas.w){
|
570 |
+
p.x = new_pos.x_left;
|
571 |
+
p.y = Math.random() * pJS.canvas.h;
|
572 |
+
}
|
573 |
+
else if(p.x + p.radius < 0){
|
574 |
+
p.x = new_pos.x_right;
|
575 |
+
p.y = Math.random() * pJS.canvas.h;
|
576 |
+
}
|
577 |
+
if(p.y - p.radius > pJS.canvas.h){
|
578 |
+
p.y = new_pos.y_top;
|
579 |
+
p.x = Math.random() * pJS.canvas.w;
|
580 |
+
}
|
581 |
+
else if(p.y + p.radius < 0){
|
582 |
+
p.y = new_pos.y_bottom;
|
583 |
+
p.x = Math.random() * pJS.canvas.w;
|
584 |
+
}
|
585 |
+
|
586 |
+
/* out of canvas modes */
|
587 |
+
switch(pJS.particles.move.out_mode){
|
588 |
+
case 'bounce':
|
589 |
+
if (p.x + p.radius > pJS.canvas.w) p.vx = -p.vx;
|
590 |
+
else if (p.x - p.radius < 0) p.vx = -p.vx;
|
591 |
+
if (p.y + p.radius > pJS.canvas.h) p.vy = -p.vy;
|
592 |
+
else if (p.y - p.radius < 0) p.vy = -p.vy;
|
593 |
+
break;
|
594 |
+
}
|
595 |
+
|
596 |
+
/* events */
|
597 |
+
if(isInArray('grab', pJS.interactivity.events.onhover.mode)){
|
598 |
+
pJS.fn.modes.grabParticle(p);
|
599 |
+
}
|
600 |
+
|
601 |
+
if(isInArray('bubble', pJS.interactivity.events.onhover.mode) || isInArray('bubble', pJS.interactivity.events.onclick.mode)){
|
602 |
+
pJS.fn.modes.bubbleParticle(p);
|
603 |
+
}
|
604 |
+
|
605 |
+
if(isInArray('repulse', pJS.interactivity.events.onhover.mode) || isInArray('repulse', pJS.interactivity.events.onclick.mode)){
|
606 |
+
pJS.fn.modes.repulseParticle(p);
|
607 |
+
}
|
608 |
+
|
609 |
+
/* interaction auto between particles */
|
610 |
+
if(pJS.particles.line_linked.enable || pJS.particles.move.attract.enable){
|
611 |
+
for(var j = i + 1; j < pJS.particles.array.length; j++){
|
612 |
+
var p2 = pJS.particles.array[j];
|
613 |
+
|
614 |
+
/* link particles */
|
615 |
+
if(pJS.particles.line_linked.enable){
|
616 |
+
pJS.fn.interact.linkParticles(p,p2);
|
617 |
+
}
|
618 |
+
|
619 |
+
/* attract particles */
|
620 |
+
if(pJS.particles.move.attract.enable){
|
621 |
+
pJS.fn.interact.attractParticles(p,p2);
|
622 |
+
}
|
623 |
+
|
624 |
+
/* bounce particles */
|
625 |
+
if(pJS.particles.move.bounce){
|
626 |
+
pJS.fn.interact.bounceParticles(p,p2);
|
627 |
+
}
|
628 |
+
|
629 |
+
}
|
630 |
+
}
|
631 |
+
|
632 |
+
|
633 |
+
}
|
634 |
+
|
635 |
+
};
|
636 |
+
|
637 |
+
pJS.fn.particlesDraw = function(){
|
638 |
+
|
639 |
+
/* clear canvas */
|
640 |
+
pJS.canvas.ctx.clearRect(0, 0, pJS.canvas.w, pJS.canvas.h);
|
641 |
+
|
642 |
+
/* update each particles param */
|
643 |
+
pJS.fn.particlesUpdate();
|
644 |
+
|
645 |
+
/* draw each particle */
|
646 |
+
for(var i = 0; i < pJS.particles.array.length; i++){
|
647 |
+
var p = pJS.particles.array[i];
|
648 |
+
p.draw();
|
649 |
+
}
|
650 |
+
|
651 |
+
};
|
652 |
+
|
653 |
+
pJS.fn.particlesEmpty = function(){
|
654 |
+
pJS.particles.array = [];
|
655 |
+
};
|
656 |
+
|
657 |
+
pJS.fn.particlesRefresh = function(){
|
658 |
+
|
659 |
+
/* init all */
|
660 |
+
cancelRequestAnimFrame(pJS.fn.checkAnimFrame);
|
661 |
+
cancelRequestAnimFrame(pJS.fn.drawAnimFrame);
|
662 |
+
pJS.tmp.source_svg = undefined;
|
663 |
+
pJS.tmp.img_obj = undefined;
|
664 |
+
pJS.tmp.count_svg = 0;
|
665 |
+
pJS.fn.particlesEmpty();
|
666 |
+
pJS.fn.canvasClear();
|
667 |
+
|
668 |
+
/* restart */
|
669 |
+
pJS.fn.vendors.start();
|
670 |
+
|
671 |
+
};
|
672 |
+
|
673 |
+
|
674 |
+
/* ---------- pJS functions - particles interaction ------------ */
|
675 |
+
|
676 |
+
pJS.fn.interact.linkParticles = function(p1, p2){
|
677 |
+
|
678 |
+
var dx = p1.x - p2.x,
|
679 |
+
dy = p1.y - p2.y,
|
680 |
+
dist = Math.sqrt(dx*dx + dy*dy);
|
681 |
+
|
682 |
+
/* draw a line between p1 and p2 if the distance between them is under the config distance */
|
683 |
+
if(dist <= pJS.particles.line_linked.distance){
|
684 |
+
|
685 |
+
var opacity_line = pJS.particles.line_linked.opacity - (dist / (1/pJS.particles.line_linked.opacity)) / pJS.particles.line_linked.distance;
|
686 |
+
|
687 |
+
if(opacity_line > 0){
|
688 |
+
|
689 |
+
/* style */
|
690 |
+
var color_line = pJS.particles.line_linked.color_rgb_line;
|
691 |
+
pJS.canvas.ctx.strokeStyle = 'rgba('+color_line.r+','+color_line.g+','+color_line.b+','+opacity_line+')';
|
692 |
+
pJS.canvas.ctx.lineWidth = pJS.particles.line_linked.width;
|
693 |
+
//pJS.canvas.ctx.lineCap = 'round'; /* performance issue */
|
694 |
+
|
695 |
+
/* path */
|
696 |
+
pJS.canvas.ctx.beginPath();
|
697 |
+
pJS.canvas.ctx.moveTo(p1.x, p1.y);
|
698 |
+
pJS.canvas.ctx.lineTo(p2.x, p2.y);
|
699 |
+
pJS.canvas.ctx.stroke();
|
700 |
+
pJS.canvas.ctx.closePath();
|
701 |
+
|
702 |
+
}
|
703 |
+
|
704 |
+
}
|
705 |
+
|
706 |
+
};
|
707 |
+
|
708 |
+
|
709 |
+
pJS.fn.interact.attractParticles = function(p1, p2){
|
710 |
+
|
711 |
+
/* condensed particles */
|
712 |
+
var dx = p1.x - p2.x,
|
713 |
+
dy = p1.y - p2.y,
|
714 |
+
dist = Math.sqrt(dx*dx + dy*dy);
|
715 |
+
|
716 |
+
if(dist <= pJS.particles.line_linked.distance){
|
717 |
+
|
718 |
+
var ax = dx/(pJS.particles.move.attract.rotateX*1000),
|
719 |
+
ay = dy/(pJS.particles.move.attract.rotateY*1000);
|
720 |
+
|
721 |
+
p1.vx -= ax;
|
722 |
+
p1.vy -= ay;
|
723 |
+
|
724 |
+
p2.vx += ax;
|
725 |
+
p2.vy += ay;
|
726 |
+
|
727 |
+
}
|
728 |
+
|
729 |
+
|
730 |
+
}
|
731 |
+
|
732 |
+
|
733 |
+
pJS.fn.interact.bounceParticles = function(p1, p2){
|
734 |
+
|
735 |
+
var dx = p1.x - p2.x,
|
736 |
+
dy = p1.y - p2.y,
|
737 |
+
dist = Math.sqrt(dx*dx + dy*dy),
|
738 |
+
dist_p = p1.radius+p2.radius;
|
739 |
+
|
740 |
+
if(dist <= dist_p){
|
741 |
+
p1.vx = -p1.vx;
|
742 |
+
p1.vy = -p1.vy;
|
743 |
+
|
744 |
+
p2.vx = -p2.vx;
|
745 |
+
p2.vy = -p2.vy;
|
746 |
+
}
|
747 |
+
|
748 |
+
}
|
749 |
+
|
750 |
+
|
751 |
+
/* ---------- pJS functions - modes events ------------ */
|
752 |
+
|
753 |
+
pJS.fn.modes.pushParticles = function(nb, pos){
|
754 |
+
|
755 |
+
pJS.tmp.pushing = true;
|
756 |
+
|
757 |
+
for(var i = 0; i < nb; i++){
|
758 |
+
pJS.particles.array.push(
|
759 |
+
new pJS.fn.particle(
|
760 |
+
pJS.particles.color,
|
761 |
+
pJS.particles.opacity.value,
|
762 |
+
{
|
763 |
+
'x': pos ? pos.pos_x : Math.random() * pJS.canvas.w,
|
764 |
+
'y': pos ? pos.pos_y : Math.random() * pJS.canvas.h
|
765 |
+
}
|
766 |
+
)
|
767 |
+
)
|
768 |
+
if(i == nb-1){
|
769 |
+
if(!pJS.particles.move.enable){
|
770 |
+
pJS.fn.particlesDraw();
|
771 |
+
}
|
772 |
+
pJS.tmp.pushing = false;
|
773 |
+
}
|
774 |
+
}
|
775 |
+
|
776 |
+
};
|
777 |
+
|
778 |
+
|
779 |
+
pJS.fn.modes.removeParticles = function(nb){
|
780 |
+
|
781 |
+
pJS.particles.array.splice(0, nb);
|
782 |
+
if(!pJS.particles.move.enable){
|
783 |
+
pJS.fn.particlesDraw();
|
784 |
+
}
|
785 |
+
|
786 |
+
};
|
787 |
+
|
788 |
+
|
789 |
+
pJS.fn.modes.bubbleParticle = function(p){
|
790 |
+
|
791 |
+
/* on hover event */
|
792 |
+
if(pJS.interactivity.events.onhover.enable && isInArray('bubble', pJS.interactivity.events.onhover.mode)){
|
793 |
+
|
794 |
+
var dx_mouse = p.x - pJS.interactivity.mouse.pos_x,
|
795 |
+
dy_mouse = p.y - pJS.interactivity.mouse.pos_y,
|
796 |
+
dist_mouse = Math.sqrt(dx_mouse*dx_mouse + dy_mouse*dy_mouse),
|
797 |
+
ratio = 1 - dist_mouse / pJS.interactivity.modes.bubble.distance;
|
798 |
+
|
799 |
+
function init(){
|
800 |
+
p.opacity_bubble = p.opacity;
|
801 |
+
p.radius_bubble = p.radius;
|
802 |
+
}
|
803 |
+
|
804 |
+
/* mousemove - check ratio */
|
805 |
+
if(dist_mouse <= pJS.interactivity.modes.bubble.distance){
|
806 |
+
|
807 |
+
if(ratio >= 0 && pJS.interactivity.status == 'mousemove'){
|
808 |
+
|
809 |
+
/* size */
|
810 |
+
if(pJS.interactivity.modes.bubble.size != pJS.particles.size.value){
|
811 |
+
|
812 |
+
if(pJS.interactivity.modes.bubble.size > pJS.particles.size.value){
|
813 |
+
var size = p.radius + (pJS.interactivity.modes.bubble.size*ratio);
|
814 |
+
if(size >= 0){
|
815 |
+
p.radius_bubble = size;
|
816 |
+
}
|
817 |
+
}else{
|
818 |
+
var dif = p.radius - pJS.interactivity.modes.bubble.size,
|
819 |
+
size = p.radius - (dif*ratio);
|
820 |
+
if(size > 0){
|
821 |
+
p.radius_bubble = size;
|
822 |
+
}else{
|
823 |
+
p.radius_bubble = 0;
|
824 |
+
}
|
825 |
+
}
|
826 |
+
|
827 |
+
}
|
828 |
+
|
829 |
+
/* opacity */
|
830 |
+
if(pJS.interactivity.modes.bubble.opacity != pJS.particles.opacity.value){
|
831 |
+
|
832 |
+
if(pJS.interactivity.modes.bubble.opacity > pJS.particles.opacity.value){
|
833 |
+
var opacity = pJS.interactivity.modes.bubble.opacity*ratio;
|
834 |
+
if(opacity > p.opacity && opacity <= pJS.interactivity.modes.bubble.opacity){
|
835 |
+
p.opacity_bubble = opacity;
|
836 |
+
}
|
837 |
+
}else{
|
838 |
+
var opacity = p.opacity - (pJS.particles.opacity.value-pJS.interactivity.modes.bubble.opacity)*ratio;
|
839 |
+
if(opacity < p.opacity && opacity >= pJS.interactivity.modes.bubble.opacity){
|
840 |
+
p.opacity_bubble = opacity;
|
841 |
+
}
|
842 |
+
}
|
843 |
+
|
844 |
+
}
|
845 |
+
|
846 |
+
}
|
847 |
+
|
848 |
+
}else{
|
849 |
+
init();
|
850 |
+
}
|
851 |
+
|
852 |
+
|
853 |
+
/* mouseleave */
|
854 |
+
if(pJS.interactivity.status == 'mouseleave'){
|
855 |
+
init();
|
856 |
+
}
|
857 |
+
|
858 |
+
}
|
859 |
+
|
860 |
+
/* on click event */
|
861 |
+
else if(pJS.interactivity.events.onclick.enable && isInArray('bubble', pJS.interactivity.events.onclick.mode)){
|
862 |
+
|
863 |
+
|
864 |
+
if(pJS.tmp.bubble_clicking){
|
865 |
+
var dx_mouse = p.x - pJS.interactivity.mouse.click_pos_x,
|
866 |
+
dy_mouse = p.y - pJS.interactivity.mouse.click_pos_y,
|
867 |
+
dist_mouse = Math.sqrt(dx_mouse*dx_mouse + dy_mouse*dy_mouse),
|
868 |
+
time_spent = (new Date().getTime() - pJS.interactivity.mouse.click_time)/1000;
|
869 |
+
|
870 |
+
if(time_spent > pJS.interactivity.modes.bubble.duration){
|
871 |
+
pJS.tmp.bubble_duration_end = true;
|
872 |
+
}
|
873 |
+
|
874 |
+
if(time_spent > pJS.interactivity.modes.bubble.duration*2){
|
875 |
+
pJS.tmp.bubble_clicking = false;
|
876 |
+
pJS.tmp.bubble_duration_end = false;
|
877 |
+
}
|
878 |
+
}
|
879 |
+
|
880 |
+
|
881 |
+
function process(bubble_param, particles_param, p_obj_bubble, p_obj, id){
|
882 |
+
|
883 |
+
if(bubble_param != particles_param){
|
884 |
+
|
885 |
+
if(!pJS.tmp.bubble_duration_end){
|
886 |
+
if(dist_mouse <= pJS.interactivity.modes.bubble.distance){
|
887 |
+
if(p_obj_bubble != undefined) var obj = p_obj_bubble;
|
888 |
+
else var obj = p_obj;
|
889 |
+
if(obj != bubble_param){
|
890 |
+
var value = p_obj - (time_spent * (p_obj - bubble_param) / pJS.interactivity.modes.bubble.duration);
|
891 |
+
if(id == 'size') p.radius_bubble = value;
|
892 |
+
if(id == 'opacity') p.opacity_bubble = value;
|
893 |
+
}
|
894 |
+
}else{
|
895 |
+
if(id == 'size') p.radius_bubble = undefined;
|
896 |
+
if(id == 'opacity') p.opacity_bubble = undefined;
|
897 |
+
}
|
898 |
+
}else{
|
899 |
+
if(p_obj_bubble != undefined){
|
900 |
+
var value_tmp = p_obj - (time_spent * (p_obj - bubble_param) / pJS.interactivity.modes.bubble.duration),
|
901 |
+
dif = bubble_param - value_tmp;
|
902 |
+
value = bubble_param + dif;
|
903 |
+
if(id == 'size') p.radius_bubble = value;
|
904 |
+
if(id == 'opacity') p.opacity_bubble = value;
|
905 |
+
}
|
906 |
+
}
|
907 |
+
|
908 |
+
}
|
909 |
+
|
910 |
+
}
|
911 |
+
|
912 |
+
if(pJS.tmp.bubble_clicking){
|
913 |
+
/* size */
|
914 |
+
process(pJS.interactivity.modes.bubble.size, pJS.particles.size.value, p.radius_bubble, p.radius, 'size');
|
915 |
+
/* opacity */
|
916 |
+
process(pJS.interactivity.modes.bubble.opacity, pJS.particles.opacity.value, p.opacity_bubble, p.opacity, 'opacity');
|
917 |
+
}
|
918 |
+
|
919 |
+
}
|
920 |
+
|
921 |
+
};
|
922 |
+
|
923 |
+
|
924 |
+
pJS.fn.modes.repulseParticle = function(p){
|
925 |
+
|
926 |
+
if(pJS.interactivity.events.onhover.enable && isInArray('repulse', pJS.interactivity.events.onhover.mode) && pJS.interactivity.status == 'mousemove') {
|
927 |
+
|
928 |
+
var dx_mouse = p.x - pJS.interactivity.mouse.pos_x,
|
929 |
+
dy_mouse = p.y - pJS.interactivity.mouse.pos_y,
|
930 |
+
dist_mouse = Math.sqrt(dx_mouse*dx_mouse + dy_mouse*dy_mouse);
|
931 |
+
|
932 |
+
var normVec = {x: dx_mouse/dist_mouse, y: dy_mouse/dist_mouse},
|
933 |
+
repulseRadius = pJS.interactivity.modes.repulse.distance,
|
934 |
+
velocity = 100,
|
935 |
+
repulseFactor = clamp((1/repulseRadius)*(-1*Math.pow(dist_mouse/repulseRadius,2)+1)*repulseRadius*velocity, 0, 50);
|
936 |
+
|
937 |
+
var pos = {
|
938 |
+
x: p.x + normVec.x * repulseFactor,
|
939 |
+
y: p.y + normVec.y * repulseFactor
|
940 |
+
}
|
941 |
+
|
942 |
+
if(pJS.particles.move.out_mode == 'bounce'){
|
943 |
+
if(pos.x - p.radius > 0 && pos.x + p.radius < pJS.canvas.w) p.x = pos.x;
|
944 |
+
if(pos.y - p.radius > 0 && pos.y + p.radius < pJS.canvas.h) p.y = pos.y;
|
945 |
+
}else{
|
946 |
+
p.x = pos.x;
|
947 |
+
p.y = pos.y;
|
948 |
+
}
|
949 |
+
|
950 |
+
}
|
951 |
+
|
952 |
+
|
953 |
+
else if(pJS.interactivity.events.onclick.enable && isInArray('repulse', pJS.interactivity.events.onclick.mode)) {
|
954 |
+
|
955 |
+
if(!pJS.tmp.repulse_finish){
|
956 |
+
pJS.tmp.repulse_count++;
|
957 |
+
if(pJS.tmp.repulse_count == pJS.particles.array.length){
|
958 |
+
pJS.tmp.repulse_finish = true;
|
959 |
+
}
|
960 |
+
}
|
961 |
+
|
962 |
+
if(pJS.tmp.repulse_clicking){
|
963 |
+
|
964 |
+
var repulseRadius = Math.pow(pJS.interactivity.modes.repulse.distance/6, 3);
|
965 |
+
|
966 |
+
var dx = pJS.interactivity.mouse.click_pos_x - p.x,
|
967 |
+
dy = pJS.interactivity.mouse.click_pos_y - p.y,
|
968 |
+
d = dx*dx + dy*dy;
|
969 |
+
|
970 |
+
var force = -repulseRadius / d * 1;
|
971 |
+
|
972 |
+
function process(){
|
973 |
+
|
974 |
+
var f = Math.atan2(dy,dx);
|
975 |
+
p.vx = force * Math.cos(f);
|
976 |
+
p.vy = force * Math.sin(f);
|
977 |
+
|
978 |
+
if(pJS.particles.move.out_mode == 'bounce'){
|
979 |
+
var pos = {
|
980 |
+
x: p.x + p.vx,
|
981 |
+
y: p.y + p.vy
|
982 |
+
}
|
983 |
+
if (pos.x + p.radius > pJS.canvas.w) p.vx = -p.vx;
|
984 |
+
else if (pos.x - p.radius < 0) p.vx = -p.vx;
|
985 |
+
if (pos.y + p.radius > pJS.canvas.h) p.vy = -p.vy;
|
986 |
+
else if (pos.y - p.radius < 0) p.vy = -p.vy;
|
987 |
+
}
|
988 |
+
|
989 |
+
}
|
990 |
+
|
991 |
+
// default
|
992 |
+
if(d <= repulseRadius){
|
993 |
+
process();
|
994 |
+
}
|
995 |
+
|
996 |
+
// bang - slow motion mode
|
997 |
+
// if(!pJS.tmp.repulse_finish){
|
998 |
+
// if(d <= repulseRadius){
|
999 |
+
// process();
|
1000 |
+
// }
|
1001 |
+
// }else{
|
1002 |
+
// process();
|
1003 |
+
// }
|
1004 |
+
|
1005 |
+
|
1006 |
+
}else{
|
1007 |
+
|
1008 |
+
if(pJS.tmp.repulse_clicking == false){
|
1009 |
+
|
1010 |
+
p.vx = p.vx_i;
|
1011 |
+
p.vy = p.vy_i;
|
1012 |
+
|
1013 |
+
}
|
1014 |
+
|
1015 |
+
}
|
1016 |
+
|
1017 |
+
}
|
1018 |
+
|
1019 |
+
}
|
1020 |
+
|
1021 |
+
|
1022 |
+
pJS.fn.modes.grabParticle = function(p){
|
1023 |
+
|
1024 |
+
if(pJS.interactivity.events.onhover.enable && pJS.interactivity.status == 'mousemove'){
|
1025 |
+
|
1026 |
+
var dx_mouse = p.x - pJS.interactivity.mouse.pos_x,
|
1027 |
+
dy_mouse = p.y - pJS.interactivity.mouse.pos_y,
|
1028 |
+
dist_mouse = Math.sqrt(dx_mouse*dx_mouse + dy_mouse*dy_mouse);
|
1029 |
+
|
1030 |
+
/* draw a line between the cursor and the particle if the distance between them is under the config distance */
|
1031 |
+
if(dist_mouse <= pJS.interactivity.modes.grab.distance){
|
1032 |
+
|
1033 |
+
var opacity_line = pJS.interactivity.modes.grab.line_linked.opacity - (dist_mouse / (1/pJS.interactivity.modes.grab.line_linked.opacity)) / pJS.interactivity.modes.grab.distance;
|
1034 |
+
|
1035 |
+
if(opacity_line > 0){
|
1036 |
+
|
1037 |
+
/* style */
|
1038 |
+
var color_line = pJS.particles.line_linked.color_rgb_line;
|
1039 |
+
pJS.canvas.ctx.strokeStyle = 'rgba('+color_line.r+','+color_line.g+','+color_line.b+','+opacity_line+')';
|
1040 |
+
pJS.canvas.ctx.lineWidth = pJS.particles.line_linked.width;
|
1041 |
+
//pJS.canvas.ctx.lineCap = 'round'; /* performance issue */
|
1042 |
+
|
1043 |
+
/* path */
|
1044 |
+
pJS.canvas.ctx.beginPath();
|
1045 |
+
pJS.canvas.ctx.moveTo(p.x, p.y);
|
1046 |
+
pJS.canvas.ctx.lineTo(pJS.interactivity.mouse.pos_x, pJS.interactivity.mouse.pos_y);
|
1047 |
+
pJS.canvas.ctx.stroke();
|
1048 |
+
pJS.canvas.ctx.closePath();
|
1049 |
+
|
1050 |
+
}
|
1051 |
+
|
1052 |
+
}
|
1053 |
+
|
1054 |
+
}
|
1055 |
+
|
1056 |
+
};
|
1057 |
+
|
1058 |
+
|
1059 |
+
|
1060 |
+
/* ---------- pJS functions - vendors ------------ */
|
1061 |
+
|
1062 |
+
pJS.fn.vendors.eventsListeners = function(){
|
1063 |
+
|
1064 |
+
/* events target element */
|
1065 |
+
if(pJS.interactivity.detect_on == 'window'){
|
1066 |
+
pJS.interactivity.el = window;
|
1067 |
+
}else{
|
1068 |
+
pJS.interactivity.el = pJS.canvas.el;
|
1069 |
+
}
|
1070 |
+
|
1071 |
+
|
1072 |
+
/* detect mouse pos - on hover / click event */
|
1073 |
+
if(pJS.interactivity.events.onhover.enable || pJS.interactivity.events.onclick.enable){
|
1074 |
+
|
1075 |
+
/* el on mousemove */
|
1076 |
+
pJS.interactivity.el.addEventListener('mousemove', function(e){
|
1077 |
+
|
1078 |
+
if(pJS.interactivity.el == window){
|
1079 |
+
var pos_x = e.clientX,
|
1080 |
+
pos_y = e.clientY;
|
1081 |
+
}
|
1082 |
+
else{
|
1083 |
+
var pos_x = e.offsetX || e.clientX,
|
1084 |
+
pos_y = e.offsetY || e.clientY;
|
1085 |
+
}
|
1086 |
+
|
1087 |
+
pJS.interactivity.mouse.pos_x = pos_x;
|
1088 |
+
pJS.interactivity.mouse.pos_y = pos_y;
|
1089 |
+
|
1090 |
+
if(pJS.tmp.retina){
|
1091 |
+
pJS.interactivity.mouse.pos_x *= pJS.canvas.pxratio;
|
1092 |
+
pJS.interactivity.mouse.pos_y *= pJS.canvas.pxratio;
|
1093 |
+
}
|
1094 |
+
|
1095 |
+
pJS.interactivity.status = 'mousemove';
|
1096 |
+
|
1097 |
+
});
|
1098 |
+
|
1099 |
+
/* el on onmouseleave */
|
1100 |
+
pJS.interactivity.el.addEventListener('mouseleave', function(e){
|
1101 |
+
|
1102 |
+
pJS.interactivity.mouse.pos_x = null;
|
1103 |
+
pJS.interactivity.mouse.pos_y = null;
|
1104 |
+
pJS.interactivity.status = 'mouseleave';
|
1105 |
+
|
1106 |
+
});
|
1107 |
+
|
1108 |
+
}
|
1109 |
+
|
1110 |
+
/* on click event */
|
1111 |
+
if(pJS.interactivity.events.onclick.enable){
|
1112 |
+
|
1113 |
+
pJS.interactivity.el.addEventListener('click', function(){
|
1114 |
+
|
1115 |
+
pJS.interactivity.mouse.click_pos_x = pJS.interactivity.mouse.pos_x;
|
1116 |
+
pJS.interactivity.mouse.click_pos_y = pJS.interactivity.mouse.pos_y;
|
1117 |
+
pJS.interactivity.mouse.click_time = new Date().getTime();
|
1118 |
+
|
1119 |
+
if(pJS.interactivity.events.onclick.enable){
|
1120 |
+
|
1121 |
+
switch(pJS.interactivity.events.onclick.mode){
|
1122 |
+
|
1123 |
+
case 'push':
|
1124 |
+
if(pJS.particles.move.enable){
|
1125 |
+
pJS.fn.modes.pushParticles(pJS.interactivity.modes.push.particles_nb, pJS.interactivity.mouse);
|
1126 |
+
}else{
|
1127 |
+
if(pJS.interactivity.modes.push.particles_nb == 1){
|
1128 |
+
pJS.fn.modes.pushParticles(pJS.interactivity.modes.push.particles_nb, pJS.interactivity.mouse);
|
1129 |
+
}
|
1130 |
+
else if(pJS.interactivity.modes.push.particles_nb > 1){
|
1131 |
+
pJS.fn.modes.pushParticles(pJS.interactivity.modes.push.particles_nb);
|
1132 |
+
}
|
1133 |
+
}
|
1134 |
+
break;
|
1135 |
+
|
1136 |
+
case 'remove':
|
1137 |
+
pJS.fn.modes.removeParticles(pJS.interactivity.modes.remove.particles_nb);
|
1138 |
+
break;
|
1139 |
+
|
1140 |
+
case 'bubble':
|
1141 |
+
pJS.tmp.bubble_clicking = true;
|
1142 |
+
break;
|
1143 |
+
|
1144 |
+
case 'repulse':
|
1145 |
+
pJS.tmp.repulse_clicking = true;
|
1146 |
+
pJS.tmp.repulse_count = 0;
|
1147 |
+
pJS.tmp.repulse_finish = false;
|
1148 |
+
setTimeout(function(){
|
1149 |
+
pJS.tmp.repulse_clicking = false;
|
1150 |
+
}, pJS.interactivity.modes.repulse.duration*1000)
|
1151 |
+
break;
|
1152 |
+
|
1153 |
+
}
|
1154 |
+
|
1155 |
+
}
|
1156 |
+
|
1157 |
+
});
|
1158 |
+
|
1159 |
+
}
|
1160 |
+
|
1161 |
+
|
1162 |
+
};
|
1163 |
+
|
1164 |
+
pJS.fn.vendors.densityAutoParticles = function(){
|
1165 |
+
|
1166 |
+
if(pJS.particles.number.density.enable){
|
1167 |
+
|
1168 |
+
/* calc area */
|
1169 |
+
var area = pJS.canvas.el.width * pJS.canvas.el.height / 1000;
|
1170 |
+
if(pJS.tmp.retina){
|
1171 |
+
area = area/(pJS.canvas.pxratio*2);
|
1172 |
+
}
|
1173 |
+
|
1174 |
+
/* calc number of particles based on density area */
|
1175 |
+
var nb_particles = area * pJS.particles.number.value / pJS.particles.number.density.value_area;
|
1176 |
+
|
1177 |
+
/* add or remove X particles */
|
1178 |
+
var missing_particles = pJS.particles.array.length - nb_particles;
|
1179 |
+
if(missing_particles < 0) pJS.fn.modes.pushParticles(Math.abs(missing_particles));
|
1180 |
+
else pJS.fn.modes.removeParticles(missing_particles);
|
1181 |
+
|
1182 |
+
}
|
1183 |
+
|
1184 |
+
};
|
1185 |
+
|
1186 |
+
|
1187 |
+
pJS.fn.vendors.checkOverlap = function(p1, position){
|
1188 |
+
for(var i = 0; i < pJS.particles.array.length; i++){
|
1189 |
+
var p2 = pJS.particles.array[i];
|
1190 |
+
|
1191 |
+
var dx = p1.x - p2.x,
|
1192 |
+
dy = p1.y - p2.y,
|
1193 |
+
dist = Math.sqrt(dx*dx + dy*dy);
|
1194 |
+
|
1195 |
+
if(dist <= p1.radius + p2.radius){
|
1196 |
+
p1.x = position ? position.x : Math.random() * pJS.canvas.w;
|
1197 |
+
p1.y = position ? position.y : Math.random() * pJS.canvas.h;
|
1198 |
+
pJS.fn.vendors.checkOverlap(p1);
|
1199 |
+
}
|
1200 |
+
}
|
1201 |
+
};
|
1202 |
+
|
1203 |
+
|
1204 |
+
pJS.fn.vendors.createSvgImg = function(p){
|
1205 |
+
|
1206 |
+
/* set color to svg element */
|
1207 |
+
var svgXml = pJS.tmp.source_svg,
|
1208 |
+
rgbHex = /#([0-9A-F]{3,6})/gi,
|
1209 |
+
coloredSvgXml = svgXml.replace(rgbHex, function (m, r, g, b) {
|
1210 |
+
if(p.color.rgb){
|
1211 |
+
var color_value = 'rgba('+p.color.rgb.r+','+p.color.rgb.g+','+p.color.rgb.b+','+p.opacity+')';
|
1212 |
+
}else{
|
1213 |
+
var color_value = 'hsla('+p.color.hsl.h+','+p.color.hsl.s+'%,'+p.color.hsl.l+'%,'+p.opacity+')';
|
1214 |
+
}
|
1215 |
+
return color_value;
|
1216 |
+
});
|
1217 |
+
|
1218 |
+
/* prepare to create img with colored svg */
|
1219 |
+
var svg = new Blob([coloredSvgXml], {type: 'image/svg+xml;charset=utf-8'}),
|
1220 |
+
DOMURL = window.URL || window.webkitURL || window,
|
1221 |
+
url = DOMURL.createObjectURL(svg);
|
1222 |
+
|
1223 |
+
/* create particle img obj */
|
1224 |
+
var img = new Image();
|
1225 |
+
img.addEventListener('load', function(){
|
1226 |
+
p.img.obj = img;
|
1227 |
+
p.img.loaded = true;
|
1228 |
+
DOMURL.revokeObjectURL(url);
|
1229 |
+
pJS.tmp.count_svg++;
|
1230 |
+
});
|
1231 |
+
img.src = url;
|
1232 |
+
|
1233 |
+
};
|
1234 |
+
|
1235 |
+
|
1236 |
+
pJS.fn.vendors.destroypJS = function(){
|
1237 |
+
cancelAnimationFrame(pJS.fn.drawAnimFrame);
|
1238 |
+
canvas_el.remove();
|
1239 |
+
pJSDom = null;
|
1240 |
+
};
|
1241 |
+
|
1242 |
+
|
1243 |
+
pJS.fn.vendors.drawShape = function(c, startX, startY, sideLength, sideCountNumerator, sideCountDenominator){
|
1244 |
+
|
1245 |
+
// By Programming Thomas - https://programmingthomas.wordpress.com/2013/04/03/n-sided-shapes/
|
1246 |
+
var sideCount = sideCountNumerator * sideCountDenominator;
|
1247 |
+
var decimalSides = sideCountNumerator / sideCountDenominator;
|
1248 |
+
var interiorAngleDegrees = (180 * (decimalSides - 2)) / decimalSides;
|
1249 |
+
var interiorAngle = Math.PI - Math.PI * interiorAngleDegrees / 180; // convert to radians
|
1250 |
+
c.save();
|
1251 |
+
c.beginPath();
|
1252 |
+
c.translate(startX, startY);
|
1253 |
+
c.moveTo(0,0);
|
1254 |
+
for (var i = 0; i < sideCount; i++) {
|
1255 |
+
c.lineTo(sideLength,0);
|
1256 |
+
c.translate(sideLength,0);
|
1257 |
+
c.rotate(interiorAngle);
|
1258 |
+
}
|
1259 |
+
//c.stroke();
|
1260 |
+
c.fill();
|
1261 |
+
c.restore();
|
1262 |
+
|
1263 |
+
};
|
1264 |
+
|
1265 |
+
pJS.fn.vendors.exportImg = function(){
|
1266 |
+
window.open(pJS.canvas.el.toDataURL('image/png'), '_blank');
|
1267 |
+
};
|
1268 |
+
|
1269 |
+
|
1270 |
+
pJS.fn.vendors.loadImg = function(type){
|
1271 |
+
|
1272 |
+
pJS.tmp.img_error = undefined;
|
1273 |
+
|
1274 |
+
if(pJS.particles.shape.image.src != ''){
|
1275 |
+
|
1276 |
+
if(type == 'svg'){
|
1277 |
+
|
1278 |
+
var xhr = new XMLHttpRequest();
|
1279 |
+
xhr.open('GET', pJS.particles.shape.image.src);
|
1280 |
+
xhr.onreadystatechange = function (data) {
|
1281 |
+
if(xhr.readyState == 4){
|
1282 |
+
if(xhr.status == 200){
|
1283 |
+
pJS.tmp.source_svg = data.currentTarget.response;
|
1284 |
+
pJS.fn.vendors.checkBeforeDraw();
|
1285 |
+
}else{
|
1286 |
+
console.log('Error pJS - Image not found');
|
1287 |
+
pJS.tmp.img_error = true;
|
1288 |
+
}
|
1289 |
+
}
|
1290 |
+
}
|
1291 |
+
xhr.send();
|
1292 |
+
|
1293 |
+
}else{
|
1294 |
+
|
1295 |
+
var img = new Image();
|
1296 |
+
img.addEventListener('load', function(){
|
1297 |
+
pJS.tmp.img_obj = img;
|
1298 |
+
pJS.fn.vendors.checkBeforeDraw();
|
1299 |
+
});
|
1300 |
+
img.src = pJS.particles.shape.image.src;
|
1301 |
+
|
1302 |
+
}
|
1303 |
+
|
1304 |
+
}else{
|
1305 |
+
console.log('Error pJS - No image.src');
|
1306 |
+
pJS.tmp.img_error = true;
|
1307 |
+
}
|
1308 |
+
|
1309 |
+
};
|
1310 |
+
|
1311 |
+
|
1312 |
+
pJS.fn.vendors.draw = function(){
|
1313 |
+
|
1314 |
+
if(pJS.particles.shape.type == 'image'){
|
1315 |
+
|
1316 |
+
if(pJS.tmp.img_type == 'svg'){
|
1317 |
+
|
1318 |
+
if(pJS.tmp.count_svg >= pJS.particles.number.value){
|
1319 |
+
pJS.fn.particlesDraw();
|
1320 |
+
if(!pJS.particles.move.enable) cancelRequestAnimFrame(pJS.fn.drawAnimFrame);
|
1321 |
+
else pJS.fn.drawAnimFrame = requestAnimFrame(pJS.fn.vendors.draw);
|
1322 |
+
}else{
|
1323 |
+
//console.log('still loading...');
|
1324 |
+
if(!pJS.tmp.img_error) pJS.fn.drawAnimFrame = requestAnimFrame(pJS.fn.vendors.draw);
|
1325 |
+
}
|
1326 |
+
|
1327 |
+
}else{
|
1328 |
+
|
1329 |
+
if(pJS.tmp.img_obj != undefined){
|
1330 |
+
pJS.fn.particlesDraw();
|
1331 |
+
if(!pJS.particles.move.enable) cancelRequestAnimFrame(pJS.fn.drawAnimFrame);
|
1332 |
+
else pJS.fn.drawAnimFrame = requestAnimFrame(pJS.fn.vendors.draw);
|
1333 |
+
}else{
|
1334 |
+
if(!pJS.tmp.img_error) pJS.fn.drawAnimFrame = requestAnimFrame(pJS.fn.vendors.draw);
|
1335 |
+
}
|
1336 |
+
|
1337 |
+
}
|
1338 |
+
|
1339 |
+
}else{
|
1340 |
+
pJS.fn.particlesDraw();
|
1341 |
+
if(!pJS.particles.move.enable) cancelRequestAnimFrame(pJS.fn.drawAnimFrame);
|
1342 |
+
else pJS.fn.drawAnimFrame = requestAnimFrame(pJS.fn.vendors.draw);
|
1343 |
+
}
|
1344 |
+
|
1345 |
+
};
|
1346 |
+
|
1347 |
+
|
1348 |
+
pJS.fn.vendors.checkBeforeDraw = function(){
|
1349 |
+
|
1350 |
+
// if shape is image
|
1351 |
+
if(pJS.particles.shape.type == 'image'){
|
1352 |
+
|
1353 |
+
if(pJS.tmp.img_type == 'svg' && pJS.tmp.source_svg == undefined){
|
1354 |
+
pJS.tmp.checkAnimFrame = requestAnimFrame(check);
|
1355 |
+
}else{
|
1356 |
+
//console.log('images loaded! cancel check');
|
1357 |
+
cancelRequestAnimFrame(pJS.tmp.checkAnimFrame);
|
1358 |
+
if(!pJS.tmp.img_error){
|
1359 |
+
pJS.fn.vendors.init();
|
1360 |
+
pJS.fn.vendors.draw();
|
1361 |
+
}
|
1362 |
+
|
1363 |
+
}
|
1364 |
+
|
1365 |
+
}else{
|
1366 |
+
pJS.fn.vendors.init();
|
1367 |
+
pJS.fn.vendors.draw();
|
1368 |
+
}
|
1369 |
+
|
1370 |
+
};
|
1371 |
+
|
1372 |
+
|
1373 |
+
pJS.fn.vendors.init = function(){
|
1374 |
+
|
1375 |
+
/* init canvas + particles */
|
1376 |
+
pJS.fn.retinaInit();
|
1377 |
+
pJS.fn.canvasInit();
|
1378 |
+
pJS.fn.canvasSize();
|
1379 |
+
pJS.fn.canvasPaint();
|
1380 |
+
pJS.fn.particlesCreate();
|
1381 |
+
pJS.fn.vendors.densityAutoParticles();
|
1382 |
+
|
1383 |
+
/* particles.line_linked - convert hex colors to rgb */
|
1384 |
+
pJS.particles.line_linked.color_rgb_line = hexToRgb(pJS.particles.line_linked.color);
|
1385 |
+
|
1386 |
+
};
|
1387 |
+
|
1388 |
+
|
1389 |
+
pJS.fn.vendors.start = function(){
|
1390 |
+
|
1391 |
+
if(isInArray('image', pJS.particles.shape.type)){
|
1392 |
+
pJS.tmp.img_type = pJS.particles.shape.image.src.substr(pJS.particles.shape.image.src.length - 3);
|
1393 |
+
pJS.fn.vendors.loadImg(pJS.tmp.img_type);
|
1394 |
+
}else{
|
1395 |
+
pJS.fn.vendors.checkBeforeDraw();
|
1396 |
+
}
|
1397 |
+
|
1398 |
+
};
|
1399 |
+
|
1400 |
+
|
1401 |
+
|
1402 |
+
|
1403 |
+
/* ---------- pJS - start ------------ */
|
1404 |
+
|
1405 |
+
|
1406 |
+
pJS.fn.vendors.eventsListeners();
|
1407 |
+
|
1408 |
+
pJS.fn.vendors.start();
|
1409 |
+
|
1410 |
+
|
1411 |
+
|
1412 |
+
};
|
1413 |
+
|
1414 |
+
/* ---------- global functions - vendors ------------ */
|
1415 |
+
|
1416 |
+
Object.deepExtend = function(destination, source) {
|
1417 |
+
for (var property in source) {
|
1418 |
+
if (source[property] && source[property].constructor &&
|
1419 |
+
source[property].constructor === Object) {
|
1420 |
+
destination[property] = destination[property] || {};
|
1421 |
+
arguments.callee(destination[property], source[property]);
|
1422 |
+
} else {
|
1423 |
+
destination[property] = source[property];
|
1424 |
+
}
|
1425 |
+
}
|
1426 |
+
return destination;
|
1427 |
+
};
|
1428 |
+
|
1429 |
+
window.requestAnimFrame = (function(){
|
1430 |
+
return window.requestAnimationFrame ||
|
1431 |
+
window.webkitRequestAnimationFrame ||
|
1432 |
+
window.mozRequestAnimationFrame ||
|
1433 |
+
window.oRequestAnimationFrame ||
|
1434 |
+
window.msRequestAnimationFrame ||
|
1435 |
+
function(callback){
|
1436 |
+
window.setTimeout(callback, 1000 / 60);
|
1437 |
+
};
|
1438 |
+
})();
|
1439 |
+
|
1440 |
+
window.cancelRequestAnimFrame = ( function() {
|
1441 |
+
return window.cancelAnimationFrame ||
|
1442 |
+
window.webkitCancelRequestAnimationFrame ||
|
1443 |
+
window.mozCancelRequestAnimationFrame ||
|
1444 |
+
window.oCancelRequestAnimationFrame ||
|
1445 |
+
window.msCancelRequestAnimationFrame ||
|
1446 |
+
clearTimeout
|
1447 |
+
} )();
|
1448 |
+
|
1449 |
+
function hexToRgb(hex){
|
1450 |
+
// By Tim Down - http://stackoverflow.com/a/5624139/3493650
|
1451 |
+
// Expand shorthand form (e.g. "03F") to full form (e.g. "0033FF")
|
1452 |
+
var shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
|
1453 |
+
hex = hex.replace(shorthandRegex, function(m, r, g, b) {
|
1454 |
+
return r + r + g + g + b + b;
|
1455 |
+
});
|
1456 |
+
var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
|
1457 |
+
return result ? {
|
1458 |
+
r: parseInt(result[1], 16),
|
1459 |
+
g: parseInt(result[2], 16),
|
1460 |
+
b: parseInt(result[3], 16)
|
1461 |
+
} : null;
|
1462 |
+
};
|
1463 |
+
|
1464 |
+
function clamp(number, min, max) {
|
1465 |
+
return Math.min(Math.max(number, min), max);
|
1466 |
+
};
|
1467 |
+
|
1468 |
+
function isInArray(value, array) {
|
1469 |
+
return array.indexOf(value) > -1;
|
1470 |
+
}
|
1471 |
+
|
1472 |
+
|
1473 |
+
/* ---------- particles.js functions - start ------------ */
|
1474 |
+
|
1475 |
+
window.pJSDom = [];
|
1476 |
+
|
1477 |
+
window.particlesJS = function(tag_id, params){
|
1478 |
+
|
1479 |
+
/* no string id? so it's object params, and set the id with default id */
|
1480 |
+
if(typeof(tag_id) != 'string'){
|
1481 |
+
params = tag_id;
|
1482 |
+
tag_id = 'particles-js';
|
1483 |
+
}
|
1484 |
+
|
1485 |
+
/* no id? set the id to default id */
|
1486 |
+
if(!tag_id){
|
1487 |
+
tag_id = 'particles-js';
|
1488 |
+
}
|
1489 |
+
|
1490 |
+
/* pJS elements */
|
1491 |
+
var pJS_tag = document.getElementById(tag_id),
|
1492 |
+
pJS_canvas_class = 'particles-js-canvas-el',
|
1493 |
+
exist_canvas = pJS_tag.getElementsByClassName(pJS_canvas_class);
|
1494 |
+
|
1495 |
+
/* remove canvas if exists into the pJS target tag */
|
1496 |
+
if(exist_canvas.length){
|
1497 |
+
while(exist_canvas.length > 0){
|
1498 |
+
pJS_tag.removeChild(exist_canvas[0]);
|
1499 |
+
}
|
1500 |
+
}
|
1501 |
+
|
1502 |
+
/* create canvas element */
|
1503 |
+
var canvas_el = document.createElement('canvas');
|
1504 |
+
canvas_el.className = pJS_canvas_class;
|
1505 |
+
|
1506 |
+
/* set size canvas */
|
1507 |
+
canvas_el.style.width = "100%";
|
1508 |
+
canvas_el.style.height = "100%";
|
1509 |
+
|
1510 |
+
/* append canvas */
|
1511 |
+
var canvas = document.getElementById(tag_id).appendChild(canvas_el);
|
1512 |
+
|
1513 |
+
/* launch particle.js */
|
1514 |
+
if(canvas != null){
|
1515 |
+
pJSDom.push(new pJS(tag_id, params));
|
1516 |
+
}
|
1517 |
+
|
1518 |
+
};
|
1519 |
+
|
1520 |
+
window.particlesJS.load = function(tag_id, path_config_json, callback){
|
1521 |
+
|
1522 |
+
/* load json config */
|
1523 |
+
var xhr = new XMLHttpRequest();
|
1524 |
+
xhr.open('GET', path_config_json);
|
1525 |
+
xhr.onreadystatechange = function (data) {
|
1526 |
+
if(xhr.readyState == 4){
|
1527 |
+
if(xhr.status == 200){
|
1528 |
+
var params = JSON.parse(data.currentTarget.response);
|
1529 |
+
window.particlesJS(tag_id, params);
|
1530 |
+
if(callback) callback();
|
1531 |
+
}else{
|
1532 |
+
console.log('Error pJS - XMLHttpRequest status: '+xhr.status);
|
1533 |
+
console.log('Error pJS - File config not found');
|
1534 |
+
}
|
1535 |
+
}
|
1536 |
+
};
|
1537 |
+
xhr.send();
|
1538 |
+
|
1539 |
};
|
assets/js/particles.min.js
CHANGED
@@ -1,9 +1,9 @@
|
|
1 |
-
/* -----------------------------------------------
|
2 |
-
/* Author : Vincent Garreau - vincentgarreau.com
|
3 |
-
/* MIT license: http://opensource.org/licenses/MIT
|
4 |
-
/* Demo / Generator : vincentgarreau.com/particles.js
|
5 |
-
/* GitHub : github.com/VincentGarreau/particles.js
|
6 |
-
/* How to use? : Check the GitHub README
|
7 |
-
/* v2.0.0
|
8 |
-
/* ----------------------------------------------- */
|
9 |
function hexToRgb(e){var a=/^#?([a-f\d])([a-f\d])([a-f\d])$/i;e=e.replace(a,function(e,a,t,i){return a+a+t+t+i+i});var t=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e);return t?{r:parseInt(t[1],16),g:parseInt(t[2],16),b:parseInt(t[3],16)}:null}function clamp(e,a,t){return Math.min(Math.max(e,a),t)}function isInArray(e,a){return a.indexOf(e)>-1}var pJS=function(e,a){var t=document.querySelector("#"+e+" > .particles-js-canvas-el");this.pJS={canvas:{el:t,w:t.offsetWidth,h:t.offsetHeight},particles:{number:{value:400,density:{enable:!0,value_area:800}},color:{value:"#fff"},shape:{type:"circle",stroke:{width:0,color:"#ff0000"},polygon:{nb_sides:5},image:{src:"",width:100,height:100}},opacity:{value:1,random:!1,anim:{enable:!1,speed:2,opacity_min:0,sync:!1}},size:{value:20,random:!1,anim:{enable:!1,speed:20,size_min:0,sync:!1}},line_linked:{enable:!0,distance:100,color:"#fff",opacity:1,width:1},move:{enable:!0,speed:2,direction:"none",random:!1,straight:!1,out_mode:"out",bounce:!1,attract:{enable:!1,rotateX:3e3,rotateY:3e3}},array:[]},interactivity:{detect_on:"canvas",events:{onhover:{enable:!0,mode:"grab"},onclick:{enable:!0,mode:"push"},resize:!0},modes:{grab:{distance:100,line_linked:{opacity:1}},bubble:{distance:200,size:80,duration:.4},repulse:{distance:200,duration:.4},push:{particles_nb:4},remove:{particles_nb:2}},mouse:{}},retina_detect:!1,fn:{interact:{},modes:{},vendors:{}},tmp:{}};var i=this.pJS;a&&Object.deepExtend(i,a),i.tmp.obj={size_value:i.particles.size.value,size_anim_speed:i.particles.size.anim.speed,move_speed:i.particles.move.speed,line_linked_distance:i.particles.line_linked.distance,line_linked_width:i.particles.line_linked.width,mode_grab_distance:i.interactivity.modes.grab.distance,mode_bubble_distance:i.interactivity.modes.bubble.distance,mode_bubble_size:i.interactivity.modes.bubble.size,mode_repulse_distance:i.interactivity.modes.repulse.distance},i.fn.retinaInit=function(){i.retina_detect&&window.devicePixelRatio>1?(i.canvas.pxratio=window.devicePixelRatio,i.tmp.retina=!0):(i.canvas.pxratio=1,i.tmp.retina=!1),i.canvas.w=i.canvas.el.offsetWidth*i.canvas.pxratio,i.canvas.h=i.canvas.el.offsetHeight*i.canvas.pxratio,i.particles.size.value=i.tmp.obj.size_value*i.canvas.pxratio,i.particles.size.anim.speed=i.tmp.obj.size_anim_speed*i.canvas.pxratio,i.particles.move.speed=i.tmp.obj.move_speed*i.canvas.pxratio,i.particles.line_linked.distance=i.tmp.obj.line_linked_distance*i.canvas.pxratio,i.interactivity.modes.grab.distance=i.tmp.obj.mode_grab_distance*i.canvas.pxratio,i.interactivity.modes.bubble.distance=i.tmp.obj.mode_bubble_distance*i.canvas.pxratio,i.particles.line_linked.width=i.tmp.obj.line_linked_width*i.canvas.pxratio,i.interactivity.modes.bubble.size=i.tmp.obj.mode_bubble_size*i.canvas.pxratio,i.interactivity.modes.repulse.distance=i.tmp.obj.mode_repulse_distance*i.canvas.pxratio},i.fn.canvasInit=function(){i.canvas.ctx=i.canvas.el.getContext("2d")},i.fn.canvasSize=function(){i.canvas.el.width=i.canvas.w,i.canvas.el.height=i.canvas.h,i&&i.interactivity.events.resize&&window.addEventListener("resize",function(){i.canvas.w=i.canvas.el.offsetWidth,i.canvas.h=i.canvas.el.offsetHeight,i.tmp.retina&&(i.canvas.w*=i.canvas.pxratio,i.canvas.h*=i.canvas.pxratio),i.canvas.el.width=i.canvas.w,i.canvas.el.height=i.canvas.h,i.particles.move.enable||(i.fn.particlesEmpty(),i.fn.particlesCreate(),i.fn.particlesDraw(),i.fn.vendors.densityAutoParticles()),i.fn.vendors.densityAutoParticles()})},i.fn.canvasPaint=function(){i.canvas.ctx.fillRect(0,0,i.canvas.w,i.canvas.h)},i.fn.canvasClear=function(){i.canvas.ctx.clearRect(0,0,i.canvas.w,i.canvas.h)},i.fn.particle=function(e,a,t){if(this.radius=(i.particles.size.random?Math.random():1)*i.particles.size.value,i.particles.size.anim.enable&&(this.size_status=!1,this.vs=i.particles.size.anim.speed/100,i.particles.size.anim.sync||(this.vs=this.vs*Math.random())),this.x=t?t.x:Math.random()*i.canvas.w,this.y=t?t.y:Math.random()*i.canvas.h,this.x>i.canvas.w-2*this.radius?this.x=this.x-this.radius:this.x<2*this.radius&&(this.x=this.x+this.radius),this.y>i.canvas.h-2*this.radius?this.y=this.y-this.radius:this.y<2*this.radius&&(this.y=this.y+this.radius),i.particles.move.bounce&&i.fn.vendors.checkOverlap(this,t),this.color={},"object"==typeof e.value)if(e.value instanceof Array){var s=e.value[Math.floor(Math.random()*i.particles.color.value.length)];this.color.rgb=hexToRgb(s)}else void 0!=e.value.r&&void 0!=e.value.g&&void 0!=e.value.b&&(this.color.rgb={r:e.value.r,g:e.value.g,b:e.value.b}),void 0!=e.value.h&&void 0!=e.value.s&&void 0!=e.value.l&&(this.color.hsl={h:e.value.h,s:e.value.s,l:e.value.l});else"random"==e.value?this.color.rgb={r:Math.floor(256*Math.random())+0,g:Math.floor(256*Math.random())+0,b:Math.floor(256*Math.random())+0}:"string"==typeof e.value&&(this.color=e,this.color.rgb=hexToRgb(this.color.value));this.opacity=(i.particles.opacity.random?Math.random():1)*i.particles.opacity.value,i.particles.opacity.anim.enable&&(this.opacity_status=!1,this.vo=i.particles.opacity.anim.speed/100,i.particles.opacity.anim.sync||(this.vo=this.vo*Math.random()));var n={};switch(i.particles.move.direction){case"top":n={x:0,y:-1};break;case"top-right":n={x:.5,y:-.5};break;case"right":n={x:1,y:-0};break;case"bottom-right":n={x:.5,y:.5};break;case"bottom":n={x:0,y:1};break;case"bottom-left":n={x:-.5,y:1};break;case"left":n={x:-1,y:0};break;case"top-left":n={x:-.5,y:-.5};break;default:n={x:0,y:0}}i.particles.move.straight?(this.vx=n.x,this.vy=n.y,i.particles.move.random&&(this.vx=this.vx*Math.random(),this.vy=this.vy*Math.random())):(this.vx=n.x+Math.random()-.5,this.vy=n.y+Math.random()-.5),this.vx_i=this.vx,this.vy_i=this.vy;var r=i.particles.shape.type;if("object"==typeof r){if(r instanceof Array){var c=r[Math.floor(Math.random()*r.length)];this.shape=c}}else this.shape=r;if("image"==this.shape){var o=i.particles.shape;this.img={src:o.image.src,ratio:o.image.width/o.image.height},this.img.ratio||(this.img.ratio=1),"svg"==i.tmp.img_type&&void 0!=i.tmp.source_svg&&(i.fn.vendors.createSvgImg(this),i.tmp.pushing&&(this.img.loaded=!1))}},i.fn.particle.prototype.draw=function(){function e(){i.canvas.ctx.drawImage(r,a.x-t,a.y-t,2*t,2*t/a.img.ratio)}var a=this;if(void 0!=a.radius_bubble)var t=a.radius_bubble;else var t=a.radius;if(void 0!=a.opacity_bubble)var s=a.opacity_bubble;else var s=a.opacity;if(a.color.rgb)var n="rgba("+a.color.rgb.r+","+a.color.rgb.g+","+a.color.rgb.b+","+s+")";else var n="hsla("+a.color.hsl.h+","+a.color.hsl.s+"%,"+a.color.hsl.l+"%,"+s+")";switch(i.canvas.ctx.fillStyle=n,i.canvas.ctx.beginPath(),a.shape){case"circle":i.canvas.ctx.arc(a.x,a.y,t,0,2*Math.PI,!1);break;case"edge":i.canvas.ctx.rect(a.x-t,a.y-t,2*t,2*t);break;case"triangle":i.fn.vendors.drawShape(i.canvas.ctx,a.x-t,a.y+t/1.66,2*t,3,2);break;case"polygon":i.fn.vendors.drawShape(i.canvas.ctx,a.x-t/(i.particles.shape.polygon.nb_sides/3.5),a.y-t/.76,2.66*t/(i.particles.shape.polygon.nb_sides/3),i.particles.shape.polygon.nb_sides,1);break;case"star":i.fn.vendors.drawShape(i.canvas.ctx,a.x-2*t/(i.particles.shape.polygon.nb_sides/4),a.y-t/1.52,2*t*2.66/(i.particles.shape.polygon.nb_sides/3),i.particles.shape.polygon.nb_sides,2);break;case"image":if("svg"==i.tmp.img_type)var r=a.img.obj;else var r=i.tmp.img_obj;r&&e()}i.canvas.ctx.closePath(),i.particles.shape.stroke.width>0&&(i.canvas.ctx.strokeStyle=i.particles.shape.stroke.color,i.canvas.ctx.lineWidth=i.particles.shape.stroke.width,i.canvas.ctx.stroke()),i.canvas.ctx.fill()},i.fn.particlesCreate=function(){for(var e=0;e<i.particles.number.value;e++)i.particles.array.push(new i.fn.particle(i.particles.color,i.particles.opacity.value))},i.fn.particlesUpdate=function(){for(var e=0;e<i.particles.array.length;e++){var a=i.particles.array[e];if(i.particles.move.enable){var t=i.particles.move.speed/2;a.x+=a.vx*t,a.y+=a.vy*t}if(i.particles.opacity.anim.enable&&(1==a.opacity_status?(a.opacity>=i.particles.opacity.value&&(a.opacity_status=!1),a.opacity+=a.vo):(a.opacity<=i.particles.opacity.anim.opacity_min&&(a.opacity_status=!0),a.opacity-=a.vo),a.opacity<0&&(a.opacity=0)),i.particles.size.anim.enable&&(1==a.size_status?(a.radius>=i.particles.size.value&&(a.size_status=!1),a.radius+=a.vs):(a.radius<=i.particles.size.anim.size_min&&(a.size_status=!0),a.radius-=a.vs),a.radius<0&&(a.radius=0)),"bounce"==i.particles.move.out_mode)var s={x_left:a.radius,x_right:i.canvas.w,y_top:a.radius,y_bottom:i.canvas.h};else var s={x_left:-a.radius,x_right:i.canvas.w+a.radius,y_top:-a.radius,y_bottom:i.canvas.h+a.radius};switch(a.x-a.radius>i.canvas.w?(a.x=s.x_left,a.y=Math.random()*i.canvas.h):a.x+a.radius<0&&(a.x=s.x_right,a.y=Math.random()*i.canvas.h),a.y-a.radius>i.canvas.h?(a.y=s.y_top,a.x=Math.random()*i.canvas.w):a.y+a.radius<0&&(a.y=s.y_bottom,a.x=Math.random()*i.canvas.w),i.particles.move.out_mode){case"bounce":a.x+a.radius>i.canvas.w?a.vx=-a.vx:a.x-a.radius<0&&(a.vx=-a.vx),a.y+a.radius>i.canvas.h?a.vy=-a.vy:a.y-a.radius<0&&(a.vy=-a.vy)}if(isInArray("grab",i.interactivity.events.onhover.mode)&&i.fn.modes.grabParticle(a),(isInArray("bubble",i.interactivity.events.onhover.mode)||isInArray("bubble",i.interactivity.events.onclick.mode))&&i.fn.modes.bubbleParticle(a),(isInArray("repulse",i.interactivity.events.onhover.mode)||isInArray("repulse",i.interactivity.events.onclick.mode))&&i.fn.modes.repulseParticle(a),i.particles.line_linked.enable||i.particles.move.attract.enable)for(var n=e+1;n<i.particles.array.length;n++){var r=i.particles.array[n];i.particles.line_linked.enable&&i.fn.interact.linkParticles(a,r),i.particles.move.attract.enable&&i.fn.interact.attractParticles(a,r),i.particles.move.bounce&&i.fn.interact.bounceParticles(a,r)}}},i.fn.particlesDraw=function(){i.canvas.ctx.clearRect(0,0,i.canvas.w,i.canvas.h),i.fn.particlesUpdate();for(var e=0;e<i.particles.array.length;e++){var a=i.particles.array[e];a.draw()}},i.fn.particlesEmpty=function(){i.particles.array=[]},i.fn.particlesRefresh=function(){cancelRequestAnimFrame(i.fn.checkAnimFrame),cancelRequestAnimFrame(i.fn.drawAnimFrame),i.tmp.source_svg=void 0,i.tmp.img_obj=void 0,i.tmp.count_svg=0,i.fn.particlesEmpty(),i.fn.canvasClear(),i.fn.vendors.start()},i.fn.interact.linkParticles=function(e,a){var t=e.x-a.x,s=e.y-a.y,n=Math.sqrt(t*t+s*s);if(n<=i.particles.line_linked.distance){var r=i.particles.line_linked.opacity-n/(1/i.particles.line_linked.opacity)/i.particles.line_linked.distance;if(r>0){var c=i.particles.line_linked.color_rgb_line;i.canvas.ctx.strokeStyle="rgba("+c.r+","+c.g+","+c.b+","+r+")",i.canvas.ctx.lineWidth=i.particles.line_linked.width,i.canvas.ctx.beginPath(),i.canvas.ctx.moveTo(e.x,e.y),i.canvas.ctx.lineTo(a.x,a.y),i.canvas.ctx.stroke(),i.canvas.ctx.closePath()}}},i.fn.interact.attractParticles=function(e,a){var t=e.x-a.x,s=e.y-a.y,n=Math.sqrt(t*t+s*s);if(n<=i.particles.line_linked.distance){var r=t/(1e3*i.particles.move.attract.rotateX),c=s/(1e3*i.particles.move.attract.rotateY);e.vx-=r,e.vy-=c,a.vx+=r,a.vy+=c}},i.fn.interact.bounceParticles=function(e,a){var t=e.x-a.x,i=e.y-a.y,s=Math.sqrt(t*t+i*i),n=e.radius+a.radius;n>=s&&(e.vx=-e.vx,e.vy=-e.vy,a.vx=-a.vx,a.vy=-a.vy)},i.fn.modes.pushParticles=function(e,a){i.tmp.pushing=!0;for(var t=0;e>t;t++)i.particles.array.push(new i.fn.particle(i.particles.color,i.particles.opacity.value,{x:a?a.pos_x:Math.random()*i.canvas.w,y:a?a.pos_y:Math.random()*i.canvas.h})),t==e-1&&(i.particles.move.enable||i.fn.particlesDraw(),i.tmp.pushing=!1)},i.fn.modes.removeParticles=function(e){i.particles.array.splice(0,e),i.particles.move.enable||i.fn.particlesDraw()},i.fn.modes.bubbleParticle=function(e){function a(){e.opacity_bubble=e.opacity,e.radius_bubble=e.radius}function t(a,t,s,n,c){if(a!=t)if(i.tmp.bubble_duration_end){if(void 0!=s){var o=n-p*(n-a)/i.interactivity.modes.bubble.duration,l=a-o;d=a+l,"size"==c&&(e.radius_bubble=d),"opacity"==c&&(e.opacity_bubble=d)}}else if(r<=i.interactivity.modes.bubble.distance){if(void 0!=s)var v=s;else var v=n;if(v!=a){var d=n-p*(n-a)/i.interactivity.modes.bubble.duration;"size"==c&&(e.radius_bubble=d),"opacity"==c&&(e.opacity_bubble=d)}}else"size"==c&&(e.radius_bubble=void 0),"opacity"==c&&(e.opacity_bubble=void 0)}if(i.interactivity.events.onhover.enable&&isInArray("bubble",i.interactivity.events.onhover.mode)){var s=e.x-i.interactivity.mouse.pos_x,n=e.y-i.interactivity.mouse.pos_y,r=Math.sqrt(s*s+n*n),c=1-r/i.interactivity.modes.bubble.distance;if(r<=i.interactivity.modes.bubble.distance){if(c>=0&&"mousemove"==i.interactivity.status){if(i.interactivity.modes.bubble.size!=i.particles.size.value)if(i.interactivity.modes.bubble.size>i.particles.size.value){var o=e.radius+i.interactivity.modes.bubble.size*c;o>=0&&(e.radius_bubble=o)}else{var l=e.radius-i.interactivity.modes.bubble.size,o=e.radius-l*c;o>0?e.radius_bubble=o:e.radius_bubble=0}if(i.interactivity.modes.bubble.opacity!=i.particles.opacity.value)if(i.interactivity.modes.bubble.opacity>i.particles.opacity.value){var v=i.interactivity.modes.bubble.opacity*c;v>e.opacity&&v<=i.interactivity.modes.bubble.opacity&&(e.opacity_bubble=v)}else{var v=e.opacity-(i.particles.opacity.value-i.interactivity.modes.bubble.opacity)*c;v<e.opacity&&v>=i.interactivity.modes.bubble.opacity&&(e.opacity_bubble=v)}}}else a();"mouseleave"==i.interactivity.status&&a()}else if(i.interactivity.events.onclick.enable&&isInArray("bubble",i.interactivity.events.onclick.mode)){if(i.tmp.bubble_clicking){var s=e.x-i.interactivity.mouse.click_pos_x,n=e.y-i.interactivity.mouse.click_pos_y,r=Math.sqrt(s*s+n*n),p=((new Date).getTime()-i.interactivity.mouse.click_time)/1e3;p>i.interactivity.modes.bubble.duration&&(i.tmp.bubble_duration_end=!0),p>2*i.interactivity.modes.bubble.duration&&(i.tmp.bubble_clicking=!1,i.tmp.bubble_duration_end=!1)}i.tmp.bubble_clicking&&(t(i.interactivity.modes.bubble.size,i.particles.size.value,e.radius_bubble,e.radius,"size"),t(i.interactivity.modes.bubble.opacity,i.particles.opacity.value,e.opacity_bubble,e.opacity,"opacity"))}},i.fn.modes.repulseParticle=function(e){function a(){var a=Math.atan2(d,p);if(e.vx=u*Math.cos(a),e.vy=u*Math.sin(a),"bounce"==i.particles.move.out_mode){var t={x:e.x+e.vx,y:e.y+e.vy};t.x+e.radius>i.canvas.w?e.vx=-e.vx:t.x-e.radius<0&&(e.vx=-e.vx),t.y+e.radius>i.canvas.h?e.vy=-e.vy:t.y-e.radius<0&&(e.vy=-e.vy)}}if(i.interactivity.events.onhover.enable&&isInArray("repulse",i.interactivity.events.onhover.mode)&&"mousemove"==i.interactivity.status){var t=e.x-i.interactivity.mouse.pos_x,s=e.y-i.interactivity.mouse.pos_y,n=Math.sqrt(t*t+s*s),r={x:t/n,y:s/n},c=i.interactivity.modes.repulse.distance,o=100,l=clamp(1/c*(-1*Math.pow(n/c,2)+1)*c*o,0,50),v={x:e.x+r.x*l,y:e.y+r.y*l};"bounce"==i.particles.move.out_mode?(v.x-e.radius>0&&v.x+e.radius<i.canvas.w&&(e.x=v.x),v.y-e.radius>0&&v.y+e.radius<i.canvas.h&&(e.y=v.y)):(e.x=v.x,e.y=v.y)}else if(i.interactivity.events.onclick.enable&&isInArray("repulse",i.interactivity.events.onclick.mode))if(i.tmp.repulse_finish||(i.tmp.repulse_count++,i.tmp.repulse_count==i.particles.array.length&&(i.tmp.repulse_finish=!0)),i.tmp.repulse_clicking){var c=Math.pow(i.interactivity.modes.repulse.distance/6,3),p=i.interactivity.mouse.click_pos_x-e.x,d=i.interactivity.mouse.click_pos_y-e.y,m=p*p+d*d,u=-c/m*1;c>=m&&a()}else 0==i.tmp.repulse_clicking&&(e.vx=e.vx_i,e.vy=e.vy_i)},i.fn.modes.grabParticle=function(e){if(i.interactivity.events.onhover.enable&&"mousemove"==i.interactivity.status){var a=e.x-i.interactivity.mouse.pos_x,t=e.y-i.interactivity.mouse.pos_y,s=Math.sqrt(a*a+t*t);if(s<=i.interactivity.modes.grab.distance){var n=i.interactivity.modes.grab.line_linked.opacity-s/(1/i.interactivity.modes.grab.line_linked.opacity)/i.interactivity.modes.grab.distance;if(n>0){var r=i.particles.line_linked.color_rgb_line;i.canvas.ctx.strokeStyle="rgba("+r.r+","+r.g+","+r.b+","+n+")",i.canvas.ctx.lineWidth=i.particles.line_linked.width,i.canvas.ctx.beginPath(),i.canvas.ctx.moveTo(e.x,e.y),i.canvas.ctx.lineTo(i.interactivity.mouse.pos_x,i.interactivity.mouse.pos_y),i.canvas.ctx.stroke(),i.canvas.ctx.closePath()}}}},i.fn.vendors.eventsListeners=function(){"window"==i.interactivity.detect_on?i.interactivity.el=window:i.interactivity.el=i.canvas.el,(i.interactivity.events.onhover.enable||i.interactivity.events.onclick.enable)&&(i.interactivity.el.addEventListener("mousemove",function(e){if(i.interactivity.el==window)var a=e.clientX,t=e.clientY;else var a=e.offsetX||e.clientX,t=e.offsetY||e.clientY;i.interactivity.mouse.pos_x=a,i.interactivity.mouse.pos_y=t,i.tmp.retina&&(i.interactivity.mouse.pos_x*=i.canvas.pxratio,i.interactivity.mouse.pos_y*=i.canvas.pxratio),i.interactivity.status="mousemove"}),i.interactivity.el.addEventListener("mouseleave",function(e){i.interactivity.mouse.pos_x=null,i.interactivity.mouse.pos_y=null,i.interactivity.status="mouseleave"})),i.interactivity.events.onclick.enable&&i.interactivity.el.addEventListener("click",function(){if(i.interactivity.mouse.click_pos_x=i.interactivity.mouse.pos_x,i.interactivity.mouse.click_pos_y=i.interactivity.mouse.pos_y,i.interactivity.mouse.click_time=(new Date).getTime(),i.interactivity.events.onclick.enable)switch(i.interactivity.events.onclick.mode){case"push":i.particles.move.enable?i.fn.modes.pushParticles(i.interactivity.modes.push.particles_nb,i.interactivity.mouse):1==i.interactivity.modes.push.particles_nb?i.fn.modes.pushParticles(i.interactivity.modes.push.particles_nb,i.interactivity.mouse):i.interactivity.modes.push.particles_nb>1&&i.fn.modes.pushParticles(i.interactivity.modes.push.particles_nb);break;case"remove":i.fn.modes.removeParticles(i.interactivity.modes.remove.particles_nb);break;case"bubble":i.tmp.bubble_clicking=!0;break;case"repulse":i.tmp.repulse_clicking=!0,i.tmp.repulse_count=0,i.tmp.repulse_finish=!1,setTimeout(function(){i.tmp.repulse_clicking=!1},1e3*i.interactivity.modes.repulse.duration)}})},i.fn.vendors.densityAutoParticles=function(){if(i.particles.number.density.enable){var e=i.canvas.el.width*i.canvas.el.height/1e3;i.tmp.retina&&(e/=2*i.canvas.pxratio);var a=e*i.particles.number.value/i.particles.number.density.value_area,t=i.particles.array.length-a;0>t?i.fn.modes.pushParticles(Math.abs(t)):i.fn.modes.removeParticles(t)}},i.fn.vendors.checkOverlap=function(e,a){for(var t=0;t<i.particles.array.length;t++){var s=i.particles.array[t],n=e.x-s.x,r=e.y-s.y,c=Math.sqrt(n*n+r*r);c<=e.radius+s.radius&&(e.x=a?a.x:Math.random()*i.canvas.w,e.y=a?a.y:Math.random()*i.canvas.h,i.fn.vendors.checkOverlap(e))}},i.fn.vendors.createSvgImg=function(e){var a=i.tmp.source_svg,t=/#([0-9A-F]{3,6})/gi,s=a.replace(t,function(a,t,i,s){if(e.color.rgb)var n="rgba("+e.color.rgb.r+","+e.color.rgb.g+","+e.color.rgb.b+","+e.opacity+")";else var n="hsla("+e.color.hsl.h+","+e.color.hsl.s+"%,"+e.color.hsl.l+"%,"+e.opacity+")";return n}),n=new Blob([s],{type:"image/svg+xml;charset=utf-8"}),r=window.URL||window.webkitURL||window,c=r.createObjectURL(n),o=new Image;o.addEventListener("load",function(){e.img.obj=o,e.img.loaded=!0,r.revokeObjectURL(c),i.tmp.count_svg++}),o.src=c},i.fn.vendors.destroypJS=function(){cancelAnimationFrame(i.fn.drawAnimFrame),t.remove(),pJSDom=null},i.fn.vendors.drawShape=function(e,a,t,i,s,n){var r=s*n,c=s/n,o=180*(c-2)/c,l=Math.PI-Math.PI*o/180;e.save(),e.beginPath(),e.translate(a,t),e.moveTo(0,0);for(var v=0;r>v;v++)e.lineTo(i,0),e.translate(i,0),e.rotate(l);e.fill(),e.restore()},i.fn.vendors.exportImg=function(){window.open(i.canvas.el.toDataURL("image/png"),"_blank")},i.fn.vendors.loadImg=function(e){if(i.tmp.img_error=void 0,""!=i.particles.shape.image.src)if("svg"==e){var a=new XMLHttpRequest;a.open("GET",i.particles.shape.image.src),a.onreadystatechange=function(e){4==a.readyState&&(200==a.status?(i.tmp.source_svg=e.currentTarget.response,i.fn.vendors.checkBeforeDraw()):(console.log("Error pJS - Image not found"),i.tmp.img_error=!0))},a.send()}else{var t=new Image;t.addEventListener("load",function(){i.tmp.img_obj=t,i.fn.vendors.checkBeforeDraw()}),t.src=i.particles.shape.image.src}else console.log("Error pJS - No image.src"),i.tmp.img_error=!0},i.fn.vendors.draw=function(){"image"==i.particles.shape.type?"svg"==i.tmp.img_type?i.tmp.count_svg>=i.particles.number.value?(i.fn.particlesDraw(),i.particles.move.enable?i.fn.drawAnimFrame=requestAnimFrame(i.fn.vendors.draw):cancelRequestAnimFrame(i.fn.drawAnimFrame)):i.tmp.img_error||(i.fn.drawAnimFrame=requestAnimFrame(i.fn.vendors.draw)):void 0!=i.tmp.img_obj?(i.fn.particlesDraw(),i.particles.move.enable?i.fn.drawAnimFrame=requestAnimFrame(i.fn.vendors.draw):cancelRequestAnimFrame(i.fn.drawAnimFrame)):i.tmp.img_error||(i.fn.drawAnimFrame=requestAnimFrame(i.fn.vendors.draw)):(i.fn.particlesDraw(),i.particles.move.enable?i.fn.drawAnimFrame=requestAnimFrame(i.fn.vendors.draw):cancelRequestAnimFrame(i.fn.drawAnimFrame))},i.fn.vendors.checkBeforeDraw=function(){"image"==i.particles.shape.type?"svg"==i.tmp.img_type&&void 0==i.tmp.source_svg?i.tmp.checkAnimFrame=requestAnimFrame(check):(cancelRequestAnimFrame(i.tmp.checkAnimFrame),i.tmp.img_error||(i.fn.vendors.init(),i.fn.vendors.draw())):(i.fn.vendors.init(),i.fn.vendors.draw())},i.fn.vendors.init=function(){i.fn.retinaInit(),i.fn.canvasInit(),i.fn.canvasSize(),i.fn.canvasPaint(),i.fn.particlesCreate(),i.fn.vendors.densityAutoParticles(),i.particles.line_linked.color_rgb_line=hexToRgb(i.particles.line_linked.color)},i.fn.vendors.start=function(){isInArray("image",i.particles.shape.type)?(i.tmp.img_type=i.particles.shape.image.src.substr(i.particles.shape.image.src.length-3),i.fn.vendors.loadImg(i.tmp.img_type)):i.fn.vendors.checkBeforeDraw()},i.fn.vendors.eventsListeners(),i.fn.vendors.start()};Object.deepExtend=function(e,a){for(var t in a)a[t]&&a[t].constructor&&a[t].constructor===Object?(e[t]=e[t]||{},arguments.callee(e[t],a[t])):e[t]=a[t];return e},window.requestAnimFrame=function(){return window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.oRequestAnimationFrame||window.msRequestAnimationFrame||function(e){window.setTimeout(e,1e3/60)}}(),window.cancelRequestAnimFrame=function(){return window.cancelAnimationFrame||window.webkitCancelRequestAnimationFrame||window.mozCancelRequestAnimationFrame||window.oCancelRequestAnimationFrame||window.msCancelRequestAnimationFrame||clearTimeout}(),window.pJSDom=[],window.particlesJS=function(e,a){"string"!=typeof e&&(a=e,e="particles-js"),e||(e="particles-js");var t=document.getElementById(e),i="particles-js-canvas-el",s=t.getElementsByClassName(i);if(s.length)for(;s.length>0;)t.removeChild(s[0]);var n=document.createElement("canvas");n.className=i,n.style.width="100%",n.style.height="100%";var r=document.getElementById(e).appendChild(n);null!=r&&pJSDom.push(new pJS(e,a))},window.particlesJS.load=function(e,a,t){var i=new XMLHttpRequest;i.open("GET",a),i.onreadystatechange=function(a){if(4==i.readyState)if(200==i.status){var s=JSON.parse(a.currentTarget.response);window.particlesJS(e,s),t&&t()}else console.log("Error pJS - XMLHttpRequest status: "+i.status),console.log("Error pJS - File config not found")},i.send()};
|
1 |
+
/* -----------------------------------------------
|
2 |
+
/* Author : Vincent Garreau - vincentgarreau.com
|
3 |
+
/* MIT license: http://opensource.org/licenses/MIT
|
4 |
+
/* Demo / Generator : vincentgarreau.com/particles.js
|
5 |
+
/* GitHub : github.com/VincentGarreau/particles.js
|
6 |
+
/* How to use? : Check the GitHub README
|
7 |
+
/* v2.0.0
|
8 |
+
/* ----------------------------------------------- */
|
9 |
function hexToRgb(e){var a=/^#?([a-f\d])([a-f\d])([a-f\d])$/i;e=e.replace(a,function(e,a,t,i){return a+a+t+t+i+i});var t=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e);return t?{r:parseInt(t[1],16),g:parseInt(t[2],16),b:parseInt(t[3],16)}:null}function clamp(e,a,t){return Math.min(Math.max(e,a),t)}function isInArray(e,a){return a.indexOf(e)>-1}var pJS=function(e,a){var t=document.querySelector("#"+e+" > .particles-js-canvas-el");this.pJS={canvas:{el:t,w:t.offsetWidth,h:t.offsetHeight},particles:{number:{value:400,density:{enable:!0,value_area:800}},color:{value:"#fff"},shape:{type:"circle",stroke:{width:0,color:"#ff0000"},polygon:{nb_sides:5},image:{src:"",width:100,height:100}},opacity:{value:1,random:!1,anim:{enable:!1,speed:2,opacity_min:0,sync:!1}},size:{value:20,random:!1,anim:{enable:!1,speed:20,size_min:0,sync:!1}},line_linked:{enable:!0,distance:100,color:"#fff",opacity:1,width:1},move:{enable:!0,speed:2,direction:"none",random:!1,straight:!1,out_mode:"out",bounce:!1,attract:{enable:!1,rotateX:3e3,rotateY:3e3}},array:[]},interactivity:{detect_on:"canvas",events:{onhover:{enable:!0,mode:"grab"},onclick:{enable:!0,mode:"push"},resize:!0},modes:{grab:{distance:100,line_linked:{opacity:1}},bubble:{distance:200,size:80,duration:.4},repulse:{distance:200,duration:.4},push:{particles_nb:4},remove:{particles_nb:2}},mouse:{}},retina_detect:!1,fn:{interact:{},modes:{},vendors:{}},tmp:{}};var i=this.pJS;a&&Object.deepExtend(i,a),i.tmp.obj={size_value:i.particles.size.value,size_anim_speed:i.particles.size.anim.speed,move_speed:i.particles.move.speed,line_linked_distance:i.particles.line_linked.distance,line_linked_width:i.particles.line_linked.width,mode_grab_distance:i.interactivity.modes.grab.distance,mode_bubble_distance:i.interactivity.modes.bubble.distance,mode_bubble_size:i.interactivity.modes.bubble.size,mode_repulse_distance:i.interactivity.modes.repulse.distance},i.fn.retinaInit=function(){i.retina_detect&&window.devicePixelRatio>1?(i.canvas.pxratio=window.devicePixelRatio,i.tmp.retina=!0):(i.canvas.pxratio=1,i.tmp.retina=!1),i.canvas.w=i.canvas.el.offsetWidth*i.canvas.pxratio,i.canvas.h=i.canvas.el.offsetHeight*i.canvas.pxratio,i.particles.size.value=i.tmp.obj.size_value*i.canvas.pxratio,i.particles.size.anim.speed=i.tmp.obj.size_anim_speed*i.canvas.pxratio,i.particles.move.speed=i.tmp.obj.move_speed*i.canvas.pxratio,i.particles.line_linked.distance=i.tmp.obj.line_linked_distance*i.canvas.pxratio,i.interactivity.modes.grab.distance=i.tmp.obj.mode_grab_distance*i.canvas.pxratio,i.interactivity.modes.bubble.distance=i.tmp.obj.mode_bubble_distance*i.canvas.pxratio,i.particles.line_linked.width=i.tmp.obj.line_linked_width*i.canvas.pxratio,i.interactivity.modes.bubble.size=i.tmp.obj.mode_bubble_size*i.canvas.pxratio,i.interactivity.modes.repulse.distance=i.tmp.obj.mode_repulse_distance*i.canvas.pxratio},i.fn.canvasInit=function(){i.canvas.ctx=i.canvas.el.getContext("2d")},i.fn.canvasSize=function(){i.canvas.el.width=i.canvas.w,i.canvas.el.height=i.canvas.h,i&&i.interactivity.events.resize&&window.addEventListener("resize",function(){i.canvas.w=i.canvas.el.offsetWidth,i.canvas.h=i.canvas.el.offsetHeight,i.tmp.retina&&(i.canvas.w*=i.canvas.pxratio,i.canvas.h*=i.canvas.pxratio),i.canvas.el.width=i.canvas.w,i.canvas.el.height=i.canvas.h,i.particles.move.enable||(i.fn.particlesEmpty(),i.fn.particlesCreate(),i.fn.particlesDraw(),i.fn.vendors.densityAutoParticles()),i.fn.vendors.densityAutoParticles()})},i.fn.canvasPaint=function(){i.canvas.ctx.fillRect(0,0,i.canvas.w,i.canvas.h)},i.fn.canvasClear=function(){i.canvas.ctx.clearRect(0,0,i.canvas.w,i.canvas.h)},i.fn.particle=function(e,a,t){if(this.radius=(i.particles.size.random?Math.random():1)*i.particles.size.value,i.particles.size.anim.enable&&(this.size_status=!1,this.vs=i.particles.size.anim.speed/100,i.particles.size.anim.sync||(this.vs=this.vs*Math.random())),this.x=t?t.x:Math.random()*i.canvas.w,this.y=t?t.y:Math.random()*i.canvas.h,this.x>i.canvas.w-2*this.radius?this.x=this.x-this.radius:this.x<2*this.radius&&(this.x=this.x+this.radius),this.y>i.canvas.h-2*this.radius?this.y=this.y-this.radius:this.y<2*this.radius&&(this.y=this.y+this.radius),i.particles.move.bounce&&i.fn.vendors.checkOverlap(this,t),this.color={},"object"==typeof e.value)if(e.value instanceof Array){var s=e.value[Math.floor(Math.random()*i.particles.color.value.length)];this.color.rgb=hexToRgb(s)}else void 0!=e.value.r&&void 0!=e.value.g&&void 0!=e.value.b&&(this.color.rgb={r:e.value.r,g:e.value.g,b:e.value.b}),void 0!=e.value.h&&void 0!=e.value.s&&void 0!=e.value.l&&(this.color.hsl={h:e.value.h,s:e.value.s,l:e.value.l});else"random"==e.value?this.color.rgb={r:Math.floor(256*Math.random())+0,g:Math.floor(256*Math.random())+0,b:Math.floor(256*Math.random())+0}:"string"==typeof e.value&&(this.color=e,this.color.rgb=hexToRgb(this.color.value));this.opacity=(i.particles.opacity.random?Math.random():1)*i.particles.opacity.value,i.particles.opacity.anim.enable&&(this.opacity_status=!1,this.vo=i.particles.opacity.anim.speed/100,i.particles.opacity.anim.sync||(this.vo=this.vo*Math.random()));var n={};switch(i.particles.move.direction){case"top":n={x:0,y:-1};break;case"top-right":n={x:.5,y:-.5};break;case"right":n={x:1,y:-0};break;case"bottom-right":n={x:.5,y:.5};break;case"bottom":n={x:0,y:1};break;case"bottom-left":n={x:-.5,y:1};break;case"left":n={x:-1,y:0};break;case"top-left":n={x:-.5,y:-.5};break;default:n={x:0,y:0}}i.particles.move.straight?(this.vx=n.x,this.vy=n.y,i.particles.move.random&&(this.vx=this.vx*Math.random(),this.vy=this.vy*Math.random())):(this.vx=n.x+Math.random()-.5,this.vy=n.y+Math.random()-.5),this.vx_i=this.vx,this.vy_i=this.vy;var r=i.particles.shape.type;if("object"==typeof r){if(r instanceof Array){var c=r[Math.floor(Math.random()*r.length)];this.shape=c}}else this.shape=r;if("image"==this.shape){var o=i.particles.shape;this.img={src:o.image.src,ratio:o.image.width/o.image.height},this.img.ratio||(this.img.ratio=1),"svg"==i.tmp.img_type&&void 0!=i.tmp.source_svg&&(i.fn.vendors.createSvgImg(this),i.tmp.pushing&&(this.img.loaded=!1))}},i.fn.particle.prototype.draw=function(){function e(){i.canvas.ctx.drawImage(r,a.x-t,a.y-t,2*t,2*t/a.img.ratio)}var a=this;if(void 0!=a.radius_bubble)var t=a.radius_bubble;else var t=a.radius;if(void 0!=a.opacity_bubble)var s=a.opacity_bubble;else var s=a.opacity;if(a.color.rgb)var n="rgba("+a.color.rgb.r+","+a.color.rgb.g+","+a.color.rgb.b+","+s+")";else var n="hsla("+a.color.hsl.h+","+a.color.hsl.s+"%,"+a.color.hsl.l+"%,"+s+")";switch(i.canvas.ctx.fillStyle=n,i.canvas.ctx.beginPath(),a.shape){case"circle":i.canvas.ctx.arc(a.x,a.y,t,0,2*Math.PI,!1);break;case"edge":i.canvas.ctx.rect(a.x-t,a.y-t,2*t,2*t);break;case"triangle":i.fn.vendors.drawShape(i.canvas.ctx,a.x-t,a.y+t/1.66,2*t,3,2);break;case"polygon":i.fn.vendors.drawShape(i.canvas.ctx,a.x-t/(i.particles.shape.polygon.nb_sides/3.5),a.y-t/.76,2.66*t/(i.particles.shape.polygon.nb_sides/3),i.particles.shape.polygon.nb_sides,1);break;case"star":i.fn.vendors.drawShape(i.canvas.ctx,a.x-2*t/(i.particles.shape.polygon.nb_sides/4),a.y-t/1.52,2*t*2.66/(i.particles.shape.polygon.nb_sides/3),i.particles.shape.polygon.nb_sides,2);break;case"image":if("svg"==i.tmp.img_type)var r=a.img.obj;else var r=i.tmp.img_obj;r&&e()}i.canvas.ctx.closePath(),i.particles.shape.stroke.width>0&&(i.canvas.ctx.strokeStyle=i.particles.shape.stroke.color,i.canvas.ctx.lineWidth=i.particles.shape.stroke.width,i.canvas.ctx.stroke()),i.canvas.ctx.fill()},i.fn.particlesCreate=function(){for(var e=0;e<i.particles.number.value;e++)i.particles.array.push(new i.fn.particle(i.particles.color,i.particles.opacity.value))},i.fn.particlesUpdate=function(){for(var e=0;e<i.particles.array.length;e++){var a=i.particles.array[e];if(i.particles.move.enable){var t=i.particles.move.speed/2;a.x+=a.vx*t,a.y+=a.vy*t}if(i.particles.opacity.anim.enable&&(1==a.opacity_status?(a.opacity>=i.particles.opacity.value&&(a.opacity_status=!1),a.opacity+=a.vo):(a.opacity<=i.particles.opacity.anim.opacity_min&&(a.opacity_status=!0),a.opacity-=a.vo),a.opacity<0&&(a.opacity=0)),i.particles.size.anim.enable&&(1==a.size_status?(a.radius>=i.particles.size.value&&(a.size_status=!1),a.radius+=a.vs):(a.radius<=i.particles.size.anim.size_min&&(a.size_status=!0),a.radius-=a.vs),a.radius<0&&(a.radius=0)),"bounce"==i.particles.move.out_mode)var s={x_left:a.radius,x_right:i.canvas.w,y_top:a.radius,y_bottom:i.canvas.h};else var s={x_left:-a.radius,x_right:i.canvas.w+a.radius,y_top:-a.radius,y_bottom:i.canvas.h+a.radius};switch(a.x-a.radius>i.canvas.w?(a.x=s.x_left,a.y=Math.random()*i.canvas.h):a.x+a.radius<0&&(a.x=s.x_right,a.y=Math.random()*i.canvas.h),a.y-a.radius>i.canvas.h?(a.y=s.y_top,a.x=Math.random()*i.canvas.w):a.y+a.radius<0&&(a.y=s.y_bottom,a.x=Math.random()*i.canvas.w),i.particles.move.out_mode){case"bounce":a.x+a.radius>i.canvas.w?a.vx=-a.vx:a.x-a.radius<0&&(a.vx=-a.vx),a.y+a.radius>i.canvas.h?a.vy=-a.vy:a.y-a.radius<0&&(a.vy=-a.vy)}if(isInArray("grab",i.interactivity.events.onhover.mode)&&i.fn.modes.grabParticle(a),(isInArray("bubble",i.interactivity.events.onhover.mode)||isInArray("bubble",i.interactivity.events.onclick.mode))&&i.fn.modes.bubbleParticle(a),(isInArray("repulse",i.interactivity.events.onhover.mode)||isInArray("repulse",i.interactivity.events.onclick.mode))&&i.fn.modes.repulseParticle(a),i.particles.line_linked.enable||i.particles.move.attract.enable)for(var n=e+1;n<i.particles.array.length;n++){var r=i.particles.array[n];i.particles.line_linked.enable&&i.fn.interact.linkParticles(a,r),i.particles.move.attract.enable&&i.fn.interact.attractParticles(a,r),i.particles.move.bounce&&i.fn.interact.bounceParticles(a,r)}}},i.fn.particlesDraw=function(){i.canvas.ctx.clearRect(0,0,i.canvas.w,i.canvas.h),i.fn.particlesUpdate();for(var e=0;e<i.particles.array.length;e++){var a=i.particles.array[e];a.draw()}},i.fn.particlesEmpty=function(){i.particles.array=[]},i.fn.particlesRefresh=function(){cancelRequestAnimFrame(i.fn.checkAnimFrame),cancelRequestAnimFrame(i.fn.drawAnimFrame),i.tmp.source_svg=void 0,i.tmp.img_obj=void 0,i.tmp.count_svg=0,i.fn.particlesEmpty(),i.fn.canvasClear(),i.fn.vendors.start()},i.fn.interact.linkParticles=function(e,a){var t=e.x-a.x,s=e.y-a.y,n=Math.sqrt(t*t+s*s);if(n<=i.particles.line_linked.distance){var r=i.particles.line_linked.opacity-n/(1/i.particles.line_linked.opacity)/i.particles.line_linked.distance;if(r>0){var c=i.particles.line_linked.color_rgb_line;i.canvas.ctx.strokeStyle="rgba("+c.r+","+c.g+","+c.b+","+r+")",i.canvas.ctx.lineWidth=i.particles.line_linked.width,i.canvas.ctx.beginPath(),i.canvas.ctx.moveTo(e.x,e.y),i.canvas.ctx.lineTo(a.x,a.y),i.canvas.ctx.stroke(),i.canvas.ctx.closePath()}}},i.fn.interact.attractParticles=function(e,a){var t=e.x-a.x,s=e.y-a.y,n=Math.sqrt(t*t+s*s);if(n<=i.particles.line_linked.distance){var r=t/(1e3*i.particles.move.attract.rotateX),c=s/(1e3*i.particles.move.attract.rotateY);e.vx-=r,e.vy-=c,a.vx+=r,a.vy+=c}},i.fn.interact.bounceParticles=function(e,a){var t=e.x-a.x,i=e.y-a.y,s=Math.sqrt(t*t+i*i),n=e.radius+a.radius;n>=s&&(e.vx=-e.vx,e.vy=-e.vy,a.vx=-a.vx,a.vy=-a.vy)},i.fn.modes.pushParticles=function(e,a){i.tmp.pushing=!0;for(var t=0;e>t;t++)i.particles.array.push(new i.fn.particle(i.particles.color,i.particles.opacity.value,{x:a?a.pos_x:Math.random()*i.canvas.w,y:a?a.pos_y:Math.random()*i.canvas.h})),t==e-1&&(i.particles.move.enable||i.fn.particlesDraw(),i.tmp.pushing=!1)},i.fn.modes.removeParticles=function(e){i.particles.array.splice(0,e),i.particles.move.enable||i.fn.particlesDraw()},i.fn.modes.bubbleParticle=function(e){function a(){e.opacity_bubble=e.opacity,e.radius_bubble=e.radius}function t(a,t,s,n,c){if(a!=t)if(i.tmp.bubble_duration_end){if(void 0!=s){var o=n-p*(n-a)/i.interactivity.modes.bubble.duration,l=a-o;d=a+l,"size"==c&&(e.radius_bubble=d),"opacity"==c&&(e.opacity_bubble=d)}}else if(r<=i.interactivity.modes.bubble.distance){if(void 0!=s)var v=s;else var v=n;if(v!=a){var d=n-p*(n-a)/i.interactivity.modes.bubble.duration;"size"==c&&(e.radius_bubble=d),"opacity"==c&&(e.opacity_bubble=d)}}else"size"==c&&(e.radius_bubble=void 0),"opacity"==c&&(e.opacity_bubble=void 0)}if(i.interactivity.events.onhover.enable&&isInArray("bubble",i.interactivity.events.onhover.mode)){var s=e.x-i.interactivity.mouse.pos_x,n=e.y-i.interactivity.mouse.pos_y,r=Math.sqrt(s*s+n*n),c=1-r/i.interactivity.modes.bubble.distance;if(r<=i.interactivity.modes.bubble.distance){if(c>=0&&"mousemove"==i.interactivity.status){if(i.interactivity.modes.bubble.size!=i.particles.size.value)if(i.interactivity.modes.bubble.size>i.particles.size.value){var o=e.radius+i.interactivity.modes.bubble.size*c;o>=0&&(e.radius_bubble=o)}else{var l=e.radius-i.interactivity.modes.bubble.size,o=e.radius-l*c;o>0?e.radius_bubble=o:e.radius_bubble=0}if(i.interactivity.modes.bubble.opacity!=i.particles.opacity.value)if(i.interactivity.modes.bubble.opacity>i.particles.opacity.value){var v=i.interactivity.modes.bubble.opacity*c;v>e.opacity&&v<=i.interactivity.modes.bubble.opacity&&(e.opacity_bubble=v)}else{var v=e.opacity-(i.particles.opacity.value-i.interactivity.modes.bubble.opacity)*c;v<e.opacity&&v>=i.interactivity.modes.bubble.opacity&&(e.opacity_bubble=v)}}}else a();"mouseleave"==i.interactivity.status&&a()}else if(i.interactivity.events.onclick.enable&&isInArray("bubble",i.interactivity.events.onclick.mode)){if(i.tmp.bubble_clicking){var s=e.x-i.interactivity.mouse.click_pos_x,n=e.y-i.interactivity.mouse.click_pos_y,r=Math.sqrt(s*s+n*n),p=((new Date).getTime()-i.interactivity.mouse.click_time)/1e3;p>i.interactivity.modes.bubble.duration&&(i.tmp.bubble_duration_end=!0),p>2*i.interactivity.modes.bubble.duration&&(i.tmp.bubble_clicking=!1,i.tmp.bubble_duration_end=!1)}i.tmp.bubble_clicking&&(t(i.interactivity.modes.bubble.size,i.particles.size.value,e.radius_bubble,e.radius,"size"),t(i.interactivity.modes.bubble.opacity,i.particles.opacity.value,e.opacity_bubble,e.opacity,"opacity"))}},i.fn.modes.repulseParticle=function(e){function a(){var a=Math.atan2(d,p);if(e.vx=u*Math.cos(a),e.vy=u*Math.sin(a),"bounce"==i.particles.move.out_mode){var t={x:e.x+e.vx,y:e.y+e.vy};t.x+e.radius>i.canvas.w?e.vx=-e.vx:t.x-e.radius<0&&(e.vx=-e.vx),t.y+e.radius>i.canvas.h?e.vy=-e.vy:t.y-e.radius<0&&(e.vy=-e.vy)}}if(i.interactivity.events.onhover.enable&&isInArray("repulse",i.interactivity.events.onhover.mode)&&"mousemove"==i.interactivity.status){var t=e.x-i.interactivity.mouse.pos_x,s=e.y-i.interactivity.mouse.pos_y,n=Math.sqrt(t*t+s*s),r={x:t/n,y:s/n},c=i.interactivity.modes.repulse.distance,o=100,l=clamp(1/c*(-1*Math.pow(n/c,2)+1)*c*o,0,50),v={x:e.x+r.x*l,y:e.y+r.y*l};"bounce"==i.particles.move.out_mode?(v.x-e.radius>0&&v.x+e.radius<i.canvas.w&&(e.x=v.x),v.y-e.radius>0&&v.y+e.radius<i.canvas.h&&(e.y=v.y)):(e.x=v.x,e.y=v.y)}else if(i.interactivity.events.onclick.enable&&isInArray("repulse",i.interactivity.events.onclick.mode))if(i.tmp.repulse_finish||(i.tmp.repulse_count++,i.tmp.repulse_count==i.particles.array.length&&(i.tmp.repulse_finish=!0)),i.tmp.repulse_clicking){var c=Math.pow(i.interactivity.modes.repulse.distance/6,3),p=i.interactivity.mouse.click_pos_x-e.x,d=i.interactivity.mouse.click_pos_y-e.y,m=p*p+d*d,u=-c/m*1;c>=m&&a()}else 0==i.tmp.repulse_clicking&&(e.vx=e.vx_i,e.vy=e.vy_i)},i.fn.modes.grabParticle=function(e){if(i.interactivity.events.onhover.enable&&"mousemove"==i.interactivity.status){var a=e.x-i.interactivity.mouse.pos_x,t=e.y-i.interactivity.mouse.pos_y,s=Math.sqrt(a*a+t*t);if(s<=i.interactivity.modes.grab.distance){var n=i.interactivity.modes.grab.line_linked.opacity-s/(1/i.interactivity.modes.grab.line_linked.opacity)/i.interactivity.modes.grab.distance;if(n>0){var r=i.particles.line_linked.color_rgb_line;i.canvas.ctx.strokeStyle="rgba("+r.r+","+r.g+","+r.b+","+n+")",i.canvas.ctx.lineWidth=i.particles.line_linked.width,i.canvas.ctx.beginPath(),i.canvas.ctx.moveTo(e.x,e.y),i.canvas.ctx.lineTo(i.interactivity.mouse.pos_x,i.interactivity.mouse.pos_y),i.canvas.ctx.stroke(),i.canvas.ctx.closePath()}}}},i.fn.vendors.eventsListeners=function(){"window"==i.interactivity.detect_on?i.interactivity.el=window:i.interactivity.el=i.canvas.el,(i.interactivity.events.onhover.enable||i.interactivity.events.onclick.enable)&&(i.interactivity.el.addEventListener("mousemove",function(e){if(i.interactivity.el==window)var a=e.clientX,t=e.clientY;else var a=e.offsetX||e.clientX,t=e.offsetY||e.clientY;i.interactivity.mouse.pos_x=a,i.interactivity.mouse.pos_y=t,i.tmp.retina&&(i.interactivity.mouse.pos_x*=i.canvas.pxratio,i.interactivity.mouse.pos_y*=i.canvas.pxratio),i.interactivity.status="mousemove"}),i.interactivity.el.addEventListener("mouseleave",function(e){i.interactivity.mouse.pos_x=null,i.interactivity.mouse.pos_y=null,i.interactivity.status="mouseleave"})),i.interactivity.events.onclick.enable&&i.interactivity.el.addEventListener("click",function(){if(i.interactivity.mouse.click_pos_x=i.interactivity.mouse.pos_x,i.interactivity.mouse.click_pos_y=i.interactivity.mouse.pos_y,i.interactivity.mouse.click_time=(new Date).getTime(),i.interactivity.events.onclick.enable)switch(i.interactivity.events.onclick.mode){case"push":i.particles.move.enable?i.fn.modes.pushParticles(i.interactivity.modes.push.particles_nb,i.interactivity.mouse):1==i.interactivity.modes.push.particles_nb?i.fn.modes.pushParticles(i.interactivity.modes.push.particles_nb,i.interactivity.mouse):i.interactivity.modes.push.particles_nb>1&&i.fn.modes.pushParticles(i.interactivity.modes.push.particles_nb);break;case"remove":i.fn.modes.removeParticles(i.interactivity.modes.remove.particles_nb);break;case"bubble":i.tmp.bubble_clicking=!0;break;case"repulse":i.tmp.repulse_clicking=!0,i.tmp.repulse_count=0,i.tmp.repulse_finish=!1,setTimeout(function(){i.tmp.repulse_clicking=!1},1e3*i.interactivity.modes.repulse.duration)}})},i.fn.vendors.densityAutoParticles=function(){if(i.particles.number.density.enable){var e=i.canvas.el.width*i.canvas.el.height/1e3;i.tmp.retina&&(e/=2*i.canvas.pxratio);var a=e*i.particles.number.value/i.particles.number.density.value_area,t=i.particles.array.length-a;0>t?i.fn.modes.pushParticles(Math.abs(t)):i.fn.modes.removeParticles(t)}},i.fn.vendors.checkOverlap=function(e,a){for(var t=0;t<i.particles.array.length;t++){var s=i.particles.array[t],n=e.x-s.x,r=e.y-s.y,c=Math.sqrt(n*n+r*r);c<=e.radius+s.radius&&(e.x=a?a.x:Math.random()*i.canvas.w,e.y=a?a.y:Math.random()*i.canvas.h,i.fn.vendors.checkOverlap(e))}},i.fn.vendors.createSvgImg=function(e){var a=i.tmp.source_svg,t=/#([0-9A-F]{3,6})/gi,s=a.replace(t,function(a,t,i,s){if(e.color.rgb)var n="rgba("+e.color.rgb.r+","+e.color.rgb.g+","+e.color.rgb.b+","+e.opacity+")";else var n="hsla("+e.color.hsl.h+","+e.color.hsl.s+"%,"+e.color.hsl.l+"%,"+e.opacity+")";return n}),n=new Blob([s],{type:"image/svg+xml;charset=utf-8"}),r=window.URL||window.webkitURL||window,c=r.createObjectURL(n),o=new Image;o.addEventListener("load",function(){e.img.obj=o,e.img.loaded=!0,r.revokeObjectURL(c),i.tmp.count_svg++}),o.src=c},i.fn.vendors.destroypJS=function(){cancelAnimationFrame(i.fn.drawAnimFrame),t.remove(),pJSDom=null},i.fn.vendors.drawShape=function(e,a,t,i,s,n){var r=s*n,c=s/n,o=180*(c-2)/c,l=Math.PI-Math.PI*o/180;e.save(),e.beginPath(),e.translate(a,t),e.moveTo(0,0);for(var v=0;r>v;v++)e.lineTo(i,0),e.translate(i,0),e.rotate(l);e.fill(),e.restore()},i.fn.vendors.exportImg=function(){window.open(i.canvas.el.toDataURL("image/png"),"_blank")},i.fn.vendors.loadImg=function(e){if(i.tmp.img_error=void 0,""!=i.particles.shape.image.src)if("svg"==e){var a=new XMLHttpRequest;a.open("GET",i.particles.shape.image.src),a.onreadystatechange=function(e){4==a.readyState&&(200==a.status?(i.tmp.source_svg=e.currentTarget.response,i.fn.vendors.checkBeforeDraw()):(console.log("Error pJS - Image not found"),i.tmp.img_error=!0))},a.send()}else{var t=new Image;t.addEventListener("load",function(){i.tmp.img_obj=t,i.fn.vendors.checkBeforeDraw()}),t.src=i.particles.shape.image.src}else console.log("Error pJS - No image.src"),i.tmp.img_error=!0},i.fn.vendors.draw=function(){"image"==i.particles.shape.type?"svg"==i.tmp.img_type?i.tmp.count_svg>=i.particles.number.value?(i.fn.particlesDraw(),i.particles.move.enable?i.fn.drawAnimFrame=requestAnimFrame(i.fn.vendors.draw):cancelRequestAnimFrame(i.fn.drawAnimFrame)):i.tmp.img_error||(i.fn.drawAnimFrame=requestAnimFrame(i.fn.vendors.draw)):void 0!=i.tmp.img_obj?(i.fn.particlesDraw(),i.particles.move.enable?i.fn.drawAnimFrame=requestAnimFrame(i.fn.vendors.draw):cancelRequestAnimFrame(i.fn.drawAnimFrame)):i.tmp.img_error||(i.fn.drawAnimFrame=requestAnimFrame(i.fn.vendors.draw)):(i.fn.particlesDraw(),i.particles.move.enable?i.fn.drawAnimFrame=requestAnimFrame(i.fn.vendors.draw):cancelRequestAnimFrame(i.fn.drawAnimFrame))},i.fn.vendors.checkBeforeDraw=function(){"image"==i.particles.shape.type?"svg"==i.tmp.img_type&&void 0==i.tmp.source_svg?i.tmp.checkAnimFrame=requestAnimFrame(check):(cancelRequestAnimFrame(i.tmp.checkAnimFrame),i.tmp.img_error||(i.fn.vendors.init(),i.fn.vendors.draw())):(i.fn.vendors.init(),i.fn.vendors.draw())},i.fn.vendors.init=function(){i.fn.retinaInit(),i.fn.canvasInit(),i.fn.canvasSize(),i.fn.canvasPaint(),i.fn.particlesCreate(),i.fn.vendors.densityAutoParticles(),i.particles.line_linked.color_rgb_line=hexToRgb(i.particles.line_linked.color)},i.fn.vendors.start=function(){isInArray("image",i.particles.shape.type)?(i.tmp.img_type=i.particles.shape.image.src.substr(i.particles.shape.image.src.length-3),i.fn.vendors.loadImg(i.tmp.img_type)):i.fn.vendors.checkBeforeDraw()},i.fn.vendors.eventsListeners(),i.fn.vendors.start()};Object.deepExtend=function(e,a){for(var t in a)a[t]&&a[t].constructor&&a[t].constructor===Object?(e[t]=e[t]||{},arguments.callee(e[t],a[t])):e[t]=a[t];return e},window.requestAnimFrame=function(){return window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.oRequestAnimationFrame||window.msRequestAnimationFrame||function(e){window.setTimeout(e,1e3/60)}}(),window.cancelRequestAnimFrame=function(){return window.cancelAnimationFrame||window.webkitCancelRequestAnimationFrame||window.mozCancelRequestAnimationFrame||window.oCancelRequestAnimationFrame||window.msCancelRequestAnimationFrame||clearTimeout}(),window.pJSDom=[],window.particlesJS=function(e,a){"string"!=typeof e&&(a=e,e="particles-js"),e||(e="particles-js");var t=document.getElementById(e),i="particles-js-canvas-el",s=t.getElementsByClassName(i);if(s.length)for(;s.length>0;)t.removeChild(s[0]);var n=document.createElement("canvas");n.className=i,n.style.width="100%",n.style.height="100%";var r=document.getElementById(e).appendChild(n);null!=r&&pJSDom.push(new pJS(e,a))},window.particlesJS.load=function(e,a,t){var i=new XMLHttpRequest;i.open("GET",a),i.onreadystatechange=function(a){if(4==i.readyState)if(200==i.status){var s=JSON.parse(a.currentTarget.response);window.particlesJS(e,s),t&&t()}else console.log("Error pJS - XMLHttpRequest status: "+i.status),console.log("Error pJS - File config not found")},i.send()};
|
assets/js/stickyanything.js
CHANGED
@@ -1,9 +1,9 @@
|
|
1 |
-
/*
|
2 |
-
Sticky-kit v1.1.2 | WTFPL | Leaf Corcoran 2015 | http://leafo.net
|
3 |
-
*/
|
4 |
-
(function(){var b,f;b=this.jQuery||window.jQuery;f=b(window);b.fn.stick_in_parent=function(d){var A,w,J,n,B,K,p,q,k,E,t;null==d&&(d={});t=d.sticky_class;B=d.inner_scrolling;E=d.recalc_every;k=d.parent;q=d.offset_top;p=d.spacer;w=d.bottoming;null==q&&(q=0);null==k&&(k=void 0);null==B&&(B=!0);null==t&&(t="is_stuck");A=b(document);null==w&&(w=!0);J=function(a,d,n,C,F,u,r,G){var v,H,m,D,I,c,g,x,y,z,h,l;if(!a.data("sticky_kit")){a.data("sticky_kit",!0);I=A.height();g=a.parent();null!=k&&(g=g.closest(k));
|
5 |
-
if(!g.length)throw"failed to find stick parent";v=m=!1;(h=null!=p?p&&a.closest(p):b("<div />"))&&h.css("position",a.css("position"));x=function(){var c,f,e;if(!G&&(I=A.height(),c=parseInt(g.css("border-top-width"),10),f=parseInt(g.css("padding-top"),10),d=parseInt(g.css("padding-bottom"),10),n=g.offset().top+c+f,C=g.height(),m&&(v=m=!1,null==p&&(a.insertAfter(h),h.detach()),a.css({position:"",top:"",width:"",bottom:""}).removeClass(t),e=!0),F=a.offset().top-(parseInt(a.css("margin-top"),10)||0)-q,
|
6 |
-
u=a.outerHeight(!0),r=a.css("float"),h&&h.css({width:a.outerWidth(!0),height:u,display:a.css("display"),"vertical-align":a.css("vertical-align"),"float":r}),e))return l()};x();if(u!==C)return D=void 0,c=q,z=E,l=function(){var b,l,e,k;if(!G&&(e=!1,null!=z&&(--z,0>=z&&(z=E,x(),e=!0)),e||A.height()===I||x(),e=f.scrollTop(),null!=D&&(l=e-D),D=e,m?(w&&(k=e+u+c>C+n,v&&!k&&(v=!1,a.css({position:"fixed",bottom:"",top:c}).trigger("sticky_kit:unbottom"))),e<F&&(m=!1,c=q,null==p&&("left"!==r&&"right"!==r||a.insertAfter(h),
|
7 |
-
h.detach()),b={position:"",width:"",top:""},a.css(b).removeClass(t).trigger("sticky_kit:unstick")),B&&(b=f.height(),u+q>b&&!v&&(c-=l,c=Math.max(b-u,c),c=Math.min(q,c),m&&a.css({top:c+"px"})))):e>F&&(m=!0,b={position:"fixed",top:c},b.width="border-box"===a.css("box-sizing")?a.outerWidth()+"px":a.width()+"px",a.css(b).addClass(t),null==p&&(a.after(h),"left"!==r&&"right"!==r||h.append(a)),a.trigger("sticky_kit:stick")),m&&w&&(null==k&&(k=e+u+c>C+n),!v&&k)))return v=!0,"static"===g.css("position")&&g.css({position:"relative"}),
|
8 |
-
a.css({position:"absolute",bottom:d,top:"auto"}).trigger("sticky_kit:bottom")},y=function(){x();return l()},H=function(){G=!0;f.off("touchmove",l);f.off("scroll",l);f.off("resize",y);b(document.body).off("sticky_kit:recalc",y);a.off("sticky_kit:detach",H);a.removeData("sticky_kit");a.css({position:"",bottom:"",top:"",width:""});g.position("position","");if(m)return null==p&&("left"!==r&&"right"!==r||a.insertAfter(h),h.remove()),a.removeClass(t)},f.on("touchmove",l),f.on("scroll",l),f.on("resize",
|
9 |
y),b(document.body).on("sticky_kit:recalc",y),a.on("sticky_kit:detach",H),setTimeout(l,0)}};n=0;for(K=this.length;n<K;n++)d=this[n],J(b(d));return this}}).call(this);
|
1 |
+
/*
|
2 |
+
Sticky-kit v1.1.2 | WTFPL | Leaf Corcoran 2015 | http://leafo.net
|
3 |
+
*/
|
4 |
+
(function(){var b,f;b=this.jQuery||window.jQuery;f=b(window);b.fn.stick_in_parent=function(d){var A,w,J,n,B,K,p,q,k,E,t;null==d&&(d={});t=d.sticky_class;B=d.inner_scrolling;E=d.recalc_every;k=d.parent;q=d.offset_top;p=d.spacer;w=d.bottoming;null==q&&(q=0);null==k&&(k=void 0);null==B&&(B=!0);null==t&&(t="is_stuck");A=b(document);null==w&&(w=!0);J=function(a,d,n,C,F,u,r,G){var v,H,m,D,I,c,g,x,y,z,h,l;if(!a.data("sticky_kit")){a.data("sticky_kit",!0);I=A.height();g=a.parent();null!=k&&(g=g.closest(k));
|
5 |
+
if(!g.length)throw"failed to find stick parent";v=m=!1;(h=null!=p?p&&a.closest(p):b("<div />"))&&h.css("position",a.css("position"));x=function(){var c,f,e;if(!G&&(I=A.height(),c=parseInt(g.css("border-top-width"),10),f=parseInt(g.css("padding-top"),10),d=parseInt(g.css("padding-bottom"),10),n=g.offset().top+c+f,C=g.height(),m&&(v=m=!1,null==p&&(a.insertAfter(h),h.detach()),a.css({position:"",top:"",width:"",bottom:""}).removeClass(t),e=!0),F=a.offset().top-(parseInt(a.css("margin-top"),10)||0)-q,
|
6 |
+
u=a.outerHeight(!0),r=a.css("float"),h&&h.css({width:a.outerWidth(!0),height:u,display:a.css("display"),"vertical-align":a.css("vertical-align"),"float":r}),e))return l()};x();if(u!==C)return D=void 0,c=q,z=E,l=function(){var b,l,e,k;if(!G&&(e=!1,null!=z&&(--z,0>=z&&(z=E,x(),e=!0)),e||A.height()===I||x(),e=f.scrollTop(),null!=D&&(l=e-D),D=e,m?(w&&(k=e+u+c>C+n,v&&!k&&(v=!1,a.css({position:"fixed",bottom:"",top:c}).trigger("sticky_kit:unbottom"))),e<F&&(m=!1,c=q,null==p&&("left"!==r&&"right"!==r||a.insertAfter(h),
|
7 |
+
h.detach()),b={position:"",width:"",top:""},a.css(b).removeClass(t).trigger("sticky_kit:unstick")),B&&(b=f.height(),u+q>b&&!v&&(c-=l,c=Math.max(b-u,c),c=Math.min(q,c),m&&a.css({top:c+"px"})))):e>F&&(m=!0,b={position:"fixed",top:c},b.width="border-box"===a.css("box-sizing")?a.outerWidth()+"px":a.width()+"px",a.css(b).addClass(t),null==p&&(a.after(h),"left"!==r&&"right"!==r||h.append(a)),a.trigger("sticky_kit:stick")),m&&w&&(null==k&&(k=e+u+c>C+n),!v&&k)))return v=!0,"static"===g.css("position")&&g.css({position:"relative"}),
|
8 |
+
a.css({position:"absolute",bottom:d,top:"auto"}).trigger("sticky_kit:bottom")},y=function(){x();return l()},H=function(){G=!0;f.off("touchmove",l);f.off("scroll",l);f.off("resize",y);b(document.body).off("sticky_kit:recalc",y);a.off("sticky_kit:detach",H);a.removeData("sticky_kit");a.css({position:"",bottom:"",top:"",width:""});g.position("position","");if(m)return null==p&&("left"!==r&&"right"!==r||a.insertAfter(h),h.remove()),a.removeClass(t)},f.on("touchmove",l),f.on("scroll",l),f.on("resize",
|
9 |
y),b(document.body).on("sticky_kit:recalc",y),a.on("sticky_kit:detach",H),setTimeout(l,0)}};n=0;for(K=this.length;n<K;n++)d=this[n],J(b(d));return this}}).call(this);
|
assets/lib/magnific.js
ADDED
@@ -0,0 +1,1861 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
/*! Magnific Popup - v1.1.0 - 2016-02-20
|
2 |
+
* http://dimsemenov.com/plugins/magnific-popup/
|
3 |
+
* Copyright (c) 2016 Dmitry Semenov; */
|
4 |
+
;(function (factory) {
|
5 |
+
if (typeof define === 'function' && define.amd) {
|
6 |
+
// AMD. Register as an anonymous module.
|
7 |
+
define(['jquery'], factory);
|
8 |
+
} else if (typeof exports === 'object') {
|
9 |
+
// Node/CommonJS
|
10 |
+
factory(require('jquery'));
|
11 |
+
} else {
|
12 |
+
// Browser globals
|
13 |
+
factory(window.jQuery || window.Zepto);
|
14 |
+
}
|
15 |
+
}(function($) {
|
16 |
+
|
17 |
+
/*>>core*/
|
18 |
+
/**
|
19 |
+
*
|
20 |
+
* Magnific Popup Core JS file
|
21 |
+
*
|
22 |
+
*/
|
23 |
+
|
24 |
+
|
25 |
+
/**
|
26 |
+
* Private static constants
|
27 |
+
*/
|
28 |
+
var CLOSE_EVENT = 'Close',
|
29 |
+
BEFORE_CLOSE_EVENT = 'BeforeClose',
|
30 |
+
AFTER_CLOSE_EVENT = 'AfterClose',
|
31 |
+
BEFORE_APPEND_EVENT = 'BeforeAppend',
|
32 |
+
MARKUP_PARSE_EVENT = 'MarkupParse',
|
33 |
+
OPEN_EVENT = 'Open',
|
34 |
+
CHANGE_EVENT = 'Change',
|
35 |
+
NS = 'mfp',
|
36 |
+
EVENT_NS = '.' + NS,
|
37 |
+
READY_CLASS = 'mfp-ready',
|
38 |
+
REMOVING_CLASS = 'mfp-removing',
|
39 |
+
PREVENT_CLOSE_CLASS = 'mfp-prevent-close';
|
40 |
+
|
41 |
+
|
42 |
+
/**
|
43 |
+
* Private vars
|
44 |
+
*/
|
45 |
+
/*jshint -W079 */
|
46 |
+
var mfp, // As we have only one instance of EaePopup object, we define it locally to not to use 'this'
|
47 |
+
EaePopup = function(){},
|
48 |
+
_isJQ = !!(window.jQuery),
|
49 |
+
_prevStatus,
|
50 |
+
_window = $(window),
|
51 |
+
_document,
|
52 |
+
_prevContentType,
|
53 |
+
_wrapClasses,
|
54 |
+
_currPopupType;
|
55 |
+
|
56 |
+
|
57 |
+
/**
|
58 |
+
* Private functions
|
59 |
+
*/
|
60 |
+
var _mfpOn = function(name, f) {
|
61 |
+
mfp.ev.on(NS + name + EVENT_NS, f);
|
62 |
+
},
|
63 |
+
_getEl = function(className, appendTo, html, raw) {
|
64 |
+
var el = document.createElement('div');
|
65 |
+
el.className = 'mfp-'+className;
|
66 |
+
if(html) {
|
67 |
+
el.innerHTML = html;
|
68 |
+
}
|
69 |
+
if(!raw) {
|
70 |
+
el = $(el);
|
71 |
+
if(appendTo) {
|
72 |
+
el.appendTo(appendTo);
|
73 |
+
}
|
74 |
+
} else if(appendTo) {
|
75 |
+
appendTo.appendChild(el);
|
76 |
+
}
|
77 |
+
return el;
|
78 |
+
},
|
79 |
+
_mfpTrigger = function(e, data) {
|
80 |
+
mfp.ev.triggerHandler(NS + e, data);
|
81 |
+
|
82 |
+
if(mfp.st.callbacks) {
|
83 |
+
// converts "mfpEventName" to "eventName" callback and triggers it if it's present
|
84 |
+
e = e.charAt(0).toLowerCase() + e.slice(1);
|
85 |
+
if(mfp.st.callbacks[e]) {
|
86 |
+
mfp.st.callbacks[e].apply(mfp, $.isArray(data) ? data : [data]);
|
87 |
+
}
|
88 |
+
}
|
89 |
+
},
|
90 |
+
_getCloseBtn = function(type) {
|
91 |
+
if(type !== _currPopupType || !mfp.currTemplate.closeBtn) {
|
92 |
+
mfp.currTemplate.closeBtn = $( mfp.st.closeMarkup.replace('%title%', mfp.st.tClose ) );
|
93 |
+
_currPopupType = type;
|
94 |
+
}
|
95 |
+
return mfp.currTemplate.closeBtn;
|
96 |
+
},
|
97 |
+
// Initialize Magnific Popup only when called at least once
|
98 |
+
_checkInstance = function() {
|
99 |
+
if(!$.eaePopup.instance) {
|
100 |
+
/*jshint -W020 */
|
101 |
+
mfp = new EaePopup();
|
102 |
+
mfp.init();
|
103 |
+
$.eaePopup.instance = mfp;
|
104 |
+
}
|
105 |
+
},
|
106 |
+
// CSS transition detection, http://stackoverflow.com/questions/7264899/detect-css-transitions-using-javascript-and-without-modernizr
|
107 |
+
supportsTransitions = function() {
|
108 |
+
var s = document.createElement('p').style, // 's' for style. better to create an element if body yet to exist
|
109 |
+
v = ['ms','O','Moz','Webkit']; // 'v' for vendor
|
110 |
+
|
111 |
+
if( s['transition'] !== undefined ) {
|
112 |
+
return true;
|
113 |
+
}
|
114 |
+
|
115 |
+
while( v.length ) {
|
116 |
+
if( v.pop() + 'Transition' in s ) {
|
117 |
+
return true;
|
118 |
+
}
|
119 |
+
}
|
120 |
+
|
121 |
+
return false;
|
122 |
+
};
|
123 |
+
|
124 |
+
|
125 |
+
|
126 |
+
/**
|
127 |
+
* Public functions
|
128 |
+
*/
|
129 |
+
EaePopup.prototype = {
|
130 |
+
|
131 |
+
constructor: EaePopup,
|
132 |
+
|
133 |
+
/**
|
134 |
+
* Initializes Magnific Popup plugin.
|
135 |
+
* This function is triggered only once when $.fn.magnificPopup or $.eaePopup is executed
|
136 |
+
*/
|
137 |
+
init: function() {
|
138 |
+
var appVersion = navigator.appVersion;
|
139 |
+
mfp.isLowIE = mfp.isIE8 = document.all && !document.addEventListener;
|
140 |
+
mfp.isAndroid = (/android/gi).test(appVersion);
|
141 |
+
mfp.isIOS = (/iphone|ipad|ipod/gi).test(appVersion);
|
142 |
+
mfp.supportsTransition = supportsTransitions();
|
143 |
+
|
144 |
+
// We disable fixed positioned lightbox on devices that don't handle it nicely.
|
145 |
+
// If you know a better way of detecting this - let me know.
|
146 |
+
mfp.probablyMobile = (mfp.isAndroid || mfp.isIOS || /(Opera Mini)|Kindle|webOS|BlackBerry|(Opera Mobi)|(Windows Phone)|IEMobile/i.test(navigator.userAgent) );
|
147 |
+
_document = $(document);
|
148 |
+
|
149 |
+
mfp.popupsCache = {};
|
150 |
+
},
|
151 |
+
|
152 |
+
/**
|
153 |
+
* Opens popup
|
154 |
+
* @param data [description]
|
155 |
+
*/
|
156 |
+
open: function(data) {
|
157 |
+
|
158 |
+
var i;
|
159 |
+
|
160 |
+
if(data.isObj === false) {
|
161 |
+
// convert jQuery collection to array to avoid conflicts later
|
162 |
+
mfp.items = data.items.toArray();
|
163 |
+
|
164 |
+
mfp.index = 0;
|
165 |
+
var items = data.items,
|
166 |
+
item;
|
167 |
+
for(i = 0; i < items.length; i++) {
|
168 |
+
item = items[i];
|
169 |
+
if(item.parsed) {
|
170 |
+
item = item.el[0];
|
171 |
+
}
|
172 |
+
if(item === data.el[0]) {
|
173 |
+
mfp.index = i;
|
174 |
+
break;
|
175 |
+
}
|
176 |
+
}
|
177 |
+
} else {
|
178 |
+
mfp.items = $.isArray(data.items) ? data.items : [data.items];
|
179 |
+
mfp.index = data.index || 0;
|
180 |
+
}
|
181 |
+
|
182 |
+
// if popup is already opened - we just update the content
|
183 |
+
if(mfp.isOpen) {
|
184 |
+
mfp.updateItemHTML();
|
185 |
+
return;
|
186 |
+
}
|
187 |
+
|
188 |
+
mfp.types = [];
|
189 |
+
_wrapClasses = 'bp-popup';
|
190 |
+
if(data.mainEl && data.mainEl.length) {
|
191 |
+
mfp.ev = data.mainEl.eq(0);
|
192 |
+
} else {
|
193 |
+
mfp.ev = _document;
|
194 |
+
}
|
195 |
+
|
196 |
+
if(data.key) {
|
197 |
+
if(!mfp.popupsCache[data.key]) {
|
198 |
+
mfp.popupsCache[data.key] = {};
|
199 |
+
}
|
200 |
+
mfp.currTemplate = mfp.popupsCache[data.key];
|
201 |
+
} else {
|
202 |
+
mfp.currTemplate = {};
|
203 |
+
}
|
204 |
+
|
205 |
+
|
206 |
+
|
207 |
+
mfp.st = $.extend(true, {}, $.eaePopup.defaults, data );
|
208 |
+
mfp.fixedContentPos = mfp.st.fixedContentPos === 'auto' ? !mfp.probablyMobile : mfp.st.fixedContentPos;
|
209 |
+
|
210 |
+
if(mfp.st.modal) {
|
211 |
+
mfp.st.closeOnContentClick = false;
|
212 |
+
mfp.st.closeOnBgClick = false;
|
213 |
+
mfp.st.showCloseBtn = false;
|
214 |
+
mfp.st.enableEscapeKey = false;
|
215 |
+
}
|
216 |
+
|
217 |
+
|
218 |
+
// Building markup
|
219 |
+
// main containers are created only once
|
220 |
+
if(!mfp.bgOverlay) {
|
221 |
+
|
222 |
+
// Dark overlay
|
223 |
+
mfp.bgOverlay = _getEl('bg').on('click'+EVENT_NS, function() {
|
224 |
+
mfp.close();
|
225 |
+
});
|
226 |
+
|
227 |
+
mfp.wrap = _getEl('wrap').attr('tabindex', -1).on('click'+EVENT_NS, function(e) {
|
228 |
+
if(mfp._checkIfClose(e.target)) {
|
229 |
+
mfp.close();
|
230 |
+
}
|
231 |
+
});
|
232 |
+
|
233 |
+
mfp.container = _getEl('container', mfp.wrap);
|
234 |
+
}
|
235 |
+
|
236 |
+
mfp.contentContainer = _getEl('content');
|
237 |
+
if(mfp.st.preloader) {
|
238 |
+
mfp.preloader = _getEl('preloader', mfp.container, mfp.st.tLoading);
|
239 |
+
}
|
240 |
+
|
241 |
+
|
242 |
+
// Initializing modules
|
243 |
+
var modules = $.eaePopup.modules;
|
244 |
+
for(i = 0; i < modules.length; i++) {
|
245 |
+
var n = modules[i];
|
246 |
+
n = n.charAt(0).toUpperCase() + n.slice(1);
|
247 |
+
mfp['init'+n].call(mfp);
|
248 |
+
}
|
249 |
+
_mfpTrigger('BeforeOpen');
|
250 |
+
|
251 |
+
|
252 |
+
if(mfp.st.showCloseBtn) {
|
253 |
+
// Close button
|
254 |
+
if(!mfp.st.closeBtnInside) {
|
255 |
+
mfp.wrap.append( _getCloseBtn() );
|
256 |
+
} else {
|
257 |
+
_mfpOn(MARKUP_PARSE_EVENT, function(e, template, values, item) {
|
258 |
+
values.close_replaceWith = _getCloseBtn(item.type);
|
259 |
+
});
|
260 |
+
_wrapClasses += ' eae-close-btn-in';
|
261 |
+
}
|
262 |
+
}
|
263 |
+
|
264 |
+
if(mfp.st.alignTop) {
|
265 |
+
_wrapClasses += ' mfp-align-top';
|
266 |
+
}
|
267 |
+
|
268 |
+
|
269 |
+
|
270 |
+
if(mfp.fixedContentPos) {
|
271 |
+
mfp.wrap.css({
|
272 |
+
overflow: mfp.st.overflowY,
|
273 |
+
overflowX: 'hidden',
|
274 |
+
overflowY: mfp.st.overflowY
|
275 |
+
});
|
276 |
+
} else {
|
277 |
+
mfp.wrap.css({
|
278 |
+
top: _window.scrollTop(),
|
279 |
+
position: 'absolute'
|
280 |
+
});
|
281 |
+
}
|
282 |
+
if( mfp.st.fixedBgPos === false || (mfp.st.fixedBgPos === 'auto' && !mfp.fixedContentPos) ) {
|
283 |
+
mfp.bgOverlay.css({
|
284 |
+
height: _document.height(),
|
285 |
+
position: 'absolute'
|
286 |
+
});
|
287 |
+
}
|
288 |
+
|
289 |
+
|
290 |
+
|
291 |
+
if(mfp.st.enableEscapeKey) {
|
292 |
+
// Close on ESC key
|
293 |
+
_document.on('keyup' + EVENT_NS, function(e) {
|
294 |
+
if(e.keyCode === 27) {
|
295 |
+
mfp.close();
|
296 |
+
}
|
297 |
+
});
|
298 |
+
}
|
299 |
+
|
300 |
+
_window.on('resize' + EVENT_NS, function() {
|
301 |
+
mfp.updateSize();
|
302 |
+
});
|
303 |
+
|
304 |
+
|
305 |
+
if(!mfp.st.closeOnContentClick) {
|
306 |
+
_wrapClasses += ' mfp-auto-cursor';
|
307 |
+
}
|
308 |
+
|
309 |
+
if(_wrapClasses)
|
310 |
+
mfp.wrap.addClass(_wrapClasses);
|
311 |
+
|
312 |
+
|
313 |
+
// this triggers recalculation of layout, so we get it once to not to trigger twice
|
314 |
+
var windowHeight = mfp.wH = _window.height();
|
315 |
+
|
316 |
+
|
317 |
+
var windowStyles = {};
|
318 |
+
|
319 |
+
if( mfp.fixedContentPos ) {
|
320 |
+
if(mfp._hasScrollBar(windowHeight)){
|
321 |
+
var s = mfp._getScrollbarSize();
|
322 |
+
if(s) {
|
323 |
+
windowStyles.marginRight = s;
|
324 |
+
}
|
325 |
+
}
|
326 |
+
}
|
327 |
+
|
328 |
+
if(mfp.fixedContentPos) {
|
329 |
+
if(!mfp.isIE7) {
|
330 |
+
windowStyles.overflow = 'hidden';
|
331 |
+
} else {
|
332 |
+
// ie7 double-scroll bug
|
333 |
+
$('body, html').css('overflow', 'hidden');
|
334 |
+
}
|
335 |
+
}
|
336 |
+
|
337 |
+
|
338 |
+
|
339 |
+
var classesToadd = mfp.st.mainClass;
|
340 |
+
if(mfp.isIE7) {
|
341 |
+
classesToadd += ' mfp-ie7';
|
342 |
+
}
|
343 |
+
if(classesToadd) {
|
344 |
+
mfp._addClassToMFP( classesToadd );
|
345 |
+
}
|
346 |
+
|
347 |
+
// add content
|
348 |
+
mfp.updateItemHTML();
|
349 |
+
|
350 |
+
_mfpTrigger('BuildControls');
|
351 |
+
|
352 |
+
// remove scrollbar, add margin e.t.c
|
353 |
+
$('html').css(windowStyles);
|
354 |
+
|
355 |
+
// add everything to DOM
|
356 |
+
mfp.bgOverlay.add(mfp.wrap).prependTo( mfp.st.prependTo || $(document.body) );
|
357 |
+
|
358 |
+
// Save last focused element
|
359 |
+
mfp._lastFocusedEl = document.activeElement;
|
360 |
+
|
361 |
+
// Wait for next cycle to allow CSS transition
|
362 |
+
setTimeout(function() {
|
363 |
+
|
364 |
+
if(mfp.content) {
|
365 |
+
mfp._addClassToMFP(READY_CLASS);
|
366 |
+
mfp._setFocus();
|
367 |
+
} else {
|
368 |
+
// if content is not defined (not loaded e.t.c) we add class only for BG
|
369 |
+
mfp.bgOverlay.addClass(READY_CLASS);
|
370 |
+
}
|
371 |
+
|
372 |
+
// Trap the focus in popup
|
373 |
+
_document.on('focusin' + EVENT_NS, mfp._onFocusIn);
|
374 |
+
|
375 |
+
}, 16);
|
376 |
+
|
377 |
+
mfp.isOpen = true;
|
378 |
+
mfp.updateSize(windowHeight);
|
379 |
+
_mfpTrigger(OPEN_EVENT);
|
380 |
+
//mfp.bgOverlay.attr('class', 'bp-popup mfp-bg');
|
381 |
+
return data;
|
382 |
+
},
|
383 |
+
|
384 |
+
/**
|
385 |
+
* Closes the popup
|
386 |
+
*/
|
387 |
+
close: function() {
|
388 |
+
if(!mfp.isOpen) return;
|
389 |
+
_mfpTrigger(BEFORE_CLOSE_EVENT);
|
390 |
+
|
391 |
+
mfp.isOpen = false;
|
392 |
+
// for CSS3 animation
|
393 |
+
if(mfp.st.removalDelay && !mfp.isLowIE && mfp.supportsTransition ) {
|
394 |
+
mfp._addClassToMFP(REMOVING_CLASS);
|
395 |
+
setTimeout(function() {
|
396 |
+
mfp._close();
|
397 |
+
}, mfp.st.removalDelay);
|
398 |
+
} else {
|
399 |
+
mfp._close();
|
400 |
+
}
|
401 |
+
},
|
402 |
+
|
403 |
+
/**
|
404 |
+
* Helper for close() function
|
405 |
+
*/
|
406 |
+
_close: function() {
|
407 |
+
_mfpTrigger(CLOSE_EVENT);
|
408 |
+
|
409 |
+
var classesToRemove = REMOVING_CLASS + ' ' + READY_CLASS + ' ';
|
410 |
+
|
411 |
+
mfp.bgOverlay.detach();
|
412 |
+
mfp.wrap.detach();
|
413 |
+
mfp.container.empty();
|
414 |
+
|
415 |
+
if(mfp.st.mainClass) {
|
416 |
+
classesToRemove += mfp.st.mainClass + ' ';
|
417 |
+
}
|
418 |
+
|
419 |
+
mfp._removeClassFromMFP(classesToRemove);
|
420 |
+
|
421 |
+
if(mfp.fixedContentPos) {
|
422 |
+
var windowStyles = {marginRight: ''};
|
423 |
+
if(mfp.isIE7) {
|
424 |
+
$('body, html').css('overflow', '');
|
425 |
+
} else {
|
426 |
+
windowStyles.overflow = '';
|
427 |
+
}
|
428 |
+
$('html').css(windowStyles);
|
429 |
+
}
|
430 |
+
|
431 |
+
_document.off('keyup' + EVENT_NS + ' focusin' + EVENT_NS);
|
432 |
+
mfp.ev.off(EVENT_NS);
|
433 |
+
|
434 |
+
// clean up DOM elements that aren't removed
|
435 |
+
mfp.wrap.attr('class', 'mfp-wrap').removeAttr('style');
|
436 |
+
mfp.bgOverlay.attr('class', 'bp-popup mfp-bg');
|
437 |
+
mfp.container.attr('class', 'mfp-container');
|
438 |
+
|
439 |
+
// remove close button from target element
|
440 |
+
if(mfp.st.showCloseBtn &&
|
441 |
+
(!mfp.st.closeBtnInside || mfp.currTemplate[mfp.currItem.type] === true)) {
|
442 |
+
if(mfp.currTemplate.closeBtn)
|
443 |
+
mfp.currTemplate.closeBtn.detach();
|
444 |
+
}
|
445 |
+
|
446 |
+
|
447 |
+
if(mfp.st.autoFocusLast && mfp._lastFocusedEl) {
|
448 |
+
$(mfp._lastFocusedEl).focus(); // put tab focus back
|
449 |
+
}
|
450 |
+
mfp.currItem = null;
|
451 |
+
mfp.content = null;
|
452 |
+
mfp.currTemplate = null;
|
453 |
+
mfp.prevHeight = 0;
|
454 |
+
|
455 |
+
_mfpTrigger(AFTER_CLOSE_EVENT);
|
456 |
+
},
|
457 |
+
|
458 |
+
updateSize: function(winHeight) {
|
459 |
+
|
460 |
+
if(mfp.isIOS) {
|
461 |
+
// fixes iOS nav bars https://github.com/dimsemenov/Magnific-Popup/issues/2
|
462 |
+
var zoomLevel = document.documentElement.clientWidth / window.innerWidth;
|
463 |
+
var height = window.innerHeight * zoomLevel;
|
464 |
+
mfp.wrap.css('height', height);
|
465 |
+
mfp.wH = height;
|
466 |
+
} else {
|
467 |
+
mfp.wH = winHeight || _window.height();
|
468 |
+
}
|
469 |
+
// Fixes #84: popup incorrectly positioned with position:relative on body
|
470 |
+
if(!mfp.fixedContentPos) {
|
471 |
+
mfp.wrap.css('height', mfp.wH);
|
472 |
+
}
|
473 |
+
|
474 |
+
_mfpTrigger('Resize');
|
475 |
+
|
476 |
+
},
|
477 |
+
|
478 |
+
/**
|
479 |
+
* Set content of popup based on current index
|
480 |
+
*/
|
481 |
+
updateItemHTML: function() {
|
482 |
+
var item = mfp.items[mfp.index];
|
483 |
+
|
484 |
+
// Detach and perform modifications
|
485 |
+
mfp.contentContainer.detach();
|
486 |
+
|
487 |
+
if(mfp.content)
|
488 |
+
mfp.content.detach();
|
489 |
+
|
490 |
+
if(!item.parsed) {
|
491 |
+
item = mfp.parseEl( mfp.index );
|
492 |
+
}
|
493 |
+
|
494 |
+
var type = item.type;
|
495 |
+
|
496 |
+
_mfpTrigger('BeforeChange', [mfp.currItem ? mfp.currItem.type : '', type]);
|
497 |
+
// BeforeChange event works like so:
|
498 |
+
// _mfpOn('BeforeChange', function(e, prevType, newType) { });
|
499 |
+
|
500 |
+
mfp.currItem = item;
|
501 |
+
|
502 |
+
if(!mfp.currTemplate[type]) {
|
503 |
+
var markup = mfp.st[type] ? mfp.st[type].markup : false;
|
504 |
+
|
505 |
+
// allows to modify markup
|
506 |
+
_mfpTrigger('FirstMarkupParse', markup);
|
507 |
+
|
508 |
+
if(markup) {
|
509 |
+
mfp.currTemplate[type] = $(markup);
|
510 |
+
} else {
|
511 |
+
// if there is no markup found we just define that template is parsed
|
512 |
+
mfp.currTemplate[type] = true;
|
513 |
+
}
|
514 |
+
}
|
515 |
+
|
516 |
+
if(_prevContentType && _prevContentType !== item.type) {
|
517 |
+
mfp.container.removeClass('mfp-'+_prevContentType+'-holder');
|
518 |
+
}
|
519 |
+
|
520 |
+
var newContent = mfp['get' + type.charAt(0).toUpperCase() + type.slice(1)](item, mfp.currTemplate[type]);
|
521 |
+
mfp.appendContent(newContent, type);
|
522 |
+
|
523 |
+
item.preloaded = true;
|
524 |
+
|
525 |
+
_mfpTrigger(CHANGE_EVENT, item);
|
526 |
+
_prevContentType = item.type;
|
527 |
+
|
528 |
+
// Append container back after its content changed
|
529 |
+
mfp.container.prepend(mfp.contentContainer);
|
530 |
+
|
531 |
+
_mfpTrigger('AfterChange');
|
532 |
+
},
|
533 |
+
|
534 |
+
|
535 |
+
/**
|
536 |
+
* Set HTML content of popup
|
537 |
+
*/
|
538 |
+
appendContent: function(newContent, type) {
|
539 |
+
mfp.content = newContent;
|
540 |
+
|
541 |
+
if(newContent) {
|
542 |
+
if(mfp.st.showCloseBtn && mfp.st.closeBtnInside &&
|
543 |
+
mfp.currTemplate[type] === true) {
|
544 |
+
// if there is no markup, we just append close button element inside
|
545 |
+
if(!mfp.content.find('.eae-close').length) {
|
546 |
+
mfp.content.append(_getCloseBtn());
|
547 |
+
}
|
548 |
+
} else {
|
549 |
+
mfp.content = newContent;
|
550 |
+
}
|
551 |
+
} else {
|
552 |
+
mfp.content = '';
|
553 |
+
}
|
554 |
+
|
555 |
+
_mfpTrigger(BEFORE_APPEND_EVENT);
|
556 |
+
mfp.container.addClass('mfp-'+type+'-holder');
|
557 |
+
|
558 |
+
mfp.contentContainer.append(mfp.content);
|
559 |
+
},
|
560 |
+
|
561 |
+
|
562 |
+
/**
|
563 |
+
* Creates Magnific Popup data object based on given data
|
564 |
+
* @param {int} index Index of item to parse
|
565 |
+
*/
|
566 |
+
parseEl: function(index) {
|
567 |
+
var item = mfp.items[index],
|
568 |
+
type;
|
569 |
+
|
570 |
+
if(item.tagName) {
|
571 |
+
item = { el: $(item) };
|
572 |
+
} else {
|
573 |
+
type = item.type;
|
574 |
+
item = { data: item, src: item.src };
|
575 |
+
}
|
576 |
+
|
577 |
+
if(item.el) {
|
578 |
+
var types = mfp.types;
|
579 |
+
|
580 |
+
// check for 'mfp-TYPE' class
|
581 |
+
for(var i = 0; i < types.length; i++) {
|
582 |
+
if( item.el.hasClass('mfp-'+types[i]) ) {
|
583 |
+
type = types[i];
|
584 |
+
break;
|
585 |
+
}
|
586 |
+
}
|
587 |
+
|
588 |
+
item.src = item.el.attr('data-mfp-src');
|
589 |
+
if(!item.src) {
|
590 |
+
item.src = item.el.attr('href');
|
591 |
+
}
|
592 |
+
}
|
593 |
+
|
594 |
+
item.type = type || mfp.st.type || 'inline';
|
595 |
+
item.index = index;
|
596 |
+
item.parsed = true;
|
597 |
+
mfp.items[index] = item;
|
598 |
+
_mfpTrigger('ElementParse', item);
|
599 |
+
|
600 |
+
return mfp.items[index];
|
601 |
+
},
|
602 |
+
|
603 |
+
|
604 |
+
/**
|
605 |
+
* Initializes single popup or a group of popups
|
606 |
+
*/
|
607 |
+
addGroup: function(el, options) {
|
608 |
+
var eHandler = function(e) {
|
609 |
+
e.mfpEl = this;
|
610 |
+
mfp._openClick(e, el, options);
|
611 |
+
};
|
612 |
+
|
613 |
+
if(!options) {
|
614 |
+
options = {};
|
615 |
+
}
|
616 |
+
|
617 |
+
var eName = 'click.magnificPopup';
|
618 |
+
options.mainEl = el;
|
619 |
+
|
620 |
+
if(options.items) {
|
621 |
+
options.isObj = true;
|
622 |
+
el.off(eName).on(eName, eHandler);
|
623 |
+
} else {
|
624 |
+
options.isObj = false;
|
625 |
+
if(options.delegate) {
|
626 |
+
el.off(eName).on(eName, options.delegate , eHandler);
|
627 |
+
} else {
|
628 |
+
options.items = el;
|
629 |
+
el.off(eName).on(eName, eHandler);
|
630 |
+
}
|
631 |
+
}
|
632 |
+
},
|
633 |
+
_openClick: function(e, el, options) {
|
634 |
+
|
635 |
+
var midClick = options.midClick !== undefined ? options.midClick : $.eaePopup.defaults.midClick;
|
636 |
+
|
637 |
+
|
638 |
+
if(!midClick && ( e.which === 2 || e.ctrlKey || e.metaKey || e.altKey || e.shiftKey ) ) {
|
639 |
+
return;
|
640 |
+
}
|
641 |
+
|
642 |
+
var disableOn = options.disableOn !== undefined ? options.disableOn : $.eaePopup.defaults.disableOn;
|
643 |
+
|
644 |
+
if(disableOn) {
|
645 |
+
if($.isFunction(disableOn)) {
|
646 |
+
if( !disableOn.call(mfp) ) {
|
647 |
+
return true;
|
648 |
+
}
|
649 |
+
} else { // else it's number
|
650 |
+
if( _window.width() < disableOn ) {
|
651 |
+
return true;
|
652 |
+
}
|
653 |
+
}
|
654 |
+
}
|
655 |
+
|
656 |
+
if(e.type) {
|
657 |
+
e.preventDefault();
|
658 |
+
|
659 |
+
// This will prevent popup from closing if element is inside and popup is already opened
|
660 |
+
if(mfp.isOpen) {
|
661 |
+
e.stopPropagation();
|
662 |
+
}
|
663 |
+
}
|
664 |
+
|
665 |
+
options.el = $(e.mfpEl);
|
666 |
+
if(options.delegate) {
|
667 |
+
options.items = el.find(options.delegate);
|
668 |
+
}
|
669 |
+
mfp.open(options);
|
670 |
+
},
|
671 |
+
|
672 |
+
|
673 |
+
/**
|
674 |
+
* Updates text on preloader
|
675 |
+
*/
|
676 |
+
updateStatus: function(status, text) {
|
677 |
+
|
678 |
+
if(mfp.preloader) {
|
679 |
+
if(_prevStatus !== status) {
|
680 |
+
mfp.container.removeClass('mfp-s-'+_prevStatus);
|
681 |
+
}
|
682 |
+
|
683 |
+
if(!text && status === 'loading') {
|
684 |
+
text = mfp.st.tLoading;
|
685 |
+
}
|
686 |
+
|
687 |
+
var data = {
|
688 |
+
status: status,
|
689 |
+
text: text
|
690 |
+
};
|
691 |
+
// allows to modify status
|
692 |
+
_mfpTrigger('UpdateStatus', data);
|
693 |
+
|
694 |
+
status = data.status;
|
695 |
+
text = data.text;
|
696 |
+
|
697 |
+
mfp.preloader.html(text);
|
698 |
+
|
699 |
+
mfp.preloader.find('a').on('click', function(e) {
|
700 |
+
e.stopImmediatePropagation();
|
701 |
+
});
|
702 |
+
|
703 |
+
mfp.container.addClass('mfp-s-'+status);
|
704 |
+
_prevStatus = status;
|
705 |
+
}
|
706 |
+
},
|
707 |
+
|
708 |
+
|
709 |
+
/*
|
710 |
+
"Private" helpers that aren't private at all
|
711 |
+
*/
|
712 |
+
// Check to close popup or not
|
713 |
+
// "target" is an element that was clicked
|
714 |
+
_checkIfClose: function(target) {
|
715 |
+
|
716 |
+
if($(target).hasClass(PREVENT_CLOSE_CLASS)) {
|
717 |
+
return;
|
718 |
+
}
|
719 |
+
|
720 |
+
var closeOnContent = mfp.st.closeOnContentClick;
|
721 |
+
var closeOnBg = mfp.st.closeOnBgClick;
|
722 |
+
|
723 |
+
if(closeOnContent && closeOnBg) {
|
724 |
+
return true;
|
725 |
+
} else {
|
726 |
+
|
727 |
+
// We close the popup if click is on close button or on preloader. Or if there is no content.
|
728 |
+
if(!mfp.content || $(target).hasClass('eae-close') || (mfp.preloader && target === mfp.preloader[0]) ) {
|
729 |
+
return true;
|
730 |
+
}
|
731 |
+
|
732 |
+
// if click is outside the content
|
733 |
+
if( (target !== mfp.content[0] && !$.contains(mfp.content[0], target)) ) {
|
734 |
+
if(closeOnBg) {
|
735 |
+
// last check, if the clicked element is in DOM, (in case it's removed onclick)
|
736 |
+
if( $.contains(document, target) ) {
|
737 |
+
return true;
|
738 |
+
}
|
739 |
+
}
|
740 |
+
} else if(closeOnContent) {
|
741 |
+
return true;
|
742 |
+
}
|
743 |
+
|
744 |
+
}
|
745 |
+
return false;
|
746 |
+
},
|
747 |
+
_addClassToMFP: function(cName) {
|
748 |
+
mfp.bgOverlay.addClass(cName);
|
749 |
+
mfp.wrap.addClass(cName);
|
750 |
+
},
|
751 |
+
_removeClassFromMFP: function(cName) {
|
752 |
+
this.bgOverlay.removeClass(cName);
|
753 |
+
mfp.wrap.removeClass(cName);
|
754 |
+
},
|
755 |
+
_hasScrollBar: function(winHeight) {
|
756 |
+
return ( (mfp.isIE7 ? _document.height() : document.body.scrollHeight) > (winHeight || _window.height()) );
|
757 |
+
},
|
758 |
+
_setFocus: function() {
|
759 |
+
(mfp.st.focus ? mfp.content.find(mfp.st.focus).eq(0) : mfp.wrap).focus();
|
760 |
+
},
|
761 |
+
_onFocusIn: function(e) {
|
762 |
+
if( e.target !== mfp.wrap[0] && !$.contains(mfp.wrap[0], e.target) ) {
|
763 |
+
mfp._setFocus();
|
764 |
+
return false;
|
765 |
+
}
|
766 |
+
},
|
767 |
+
_parseMarkup: function(template, values, item) {
|
768 |
+
var arr;
|
769 |
+
if(item.data) {
|
770 |
+
values = $.extend(item.data, values);
|
771 |
+
}
|
772 |
+
_mfpTrigger(MARKUP_PARSE_EVENT, [template, values, item] );
|
773 |
+
|
774 |
+
$.each(values, function(key, value) {
|
775 |
+
if(value === undefined || value === false) {
|
776 |
+
return true;
|
777 |
+
}
|
778 |
+
arr = key.split('_');
|
779 |
+
if(arr.length > 1) {
|
780 |
+
var el = template.find(EVENT_NS + '-'+arr[0]);
|
781 |
+
|
782 |
+
if(el.length > 0) {
|
783 |
+
var attr = arr[1];
|
784 |
+
if(attr === 'replaceWith') {
|
785 |
+
if(el[0] !== value[0]) {
|
786 |
+
el.replaceWith(value);
|
787 |
+
}
|
788 |
+
} else if(attr === 'img') {
|
789 |
+
if(el.is('img')) {
|
790 |
+
el.attr('src', value);
|
791 |
+
} else {
|
792 |
+
el.replaceWith( $('<img>').attr('src', value).attr('class', el.attr('class')) );
|
793 |
+
}
|
794 |
+
} else {
|
795 |
+
el.attr(arr[1], value);
|
796 |
+
}
|
797 |
+
}
|
798 |
+
|
799 |
+
} else {
|
800 |
+
template.find(EVENT_NS + '-'+key).html(value);
|
801 |
+
}
|
802 |
+
});
|
803 |
+
},
|
804 |
+
|
805 |
+
_getScrollbarSize: function() {
|
806 |
+
// thx David
|
807 |
+
if(mfp.scrollbarSize === undefined) {
|
808 |
+
var scrollDiv = document.createElement("div");
|
809 |
+
scrollDiv.style.cssText = 'width: 99px; height: 99px; overflow: scroll; position: absolute; top: -9999px;';
|
810 |
+
document.body.appendChild(scrollDiv);
|
811 |
+
mfp.scrollbarSize = scrollDiv.offsetWidth - scrollDiv.clientWidth;
|
812 |
+
document.body.removeChild(scrollDiv);
|
813 |
+
}
|
814 |
+
return mfp.scrollbarSize;
|
815 |
+
}
|
816 |
+
|
817 |
+
}; /* EaePopup core prototype end */
|
818 |
+
|
819 |
+
|
820 |
+
|
821 |
+
|
822 |
+
/**
|
823 |
+
* Public static functions
|
824 |
+
*/
|
825 |
+
$.eaePopup = {
|
826 |
+
instance: null,
|
827 |
+
proto: EaePopup.prototype,
|
828 |
+
modules: [],
|
829 |
+
|
830 |
+
open: function(options, index) {
|
831 |
+
_checkInstance();
|
832 |
+
|
833 |
+
if(!options) {
|
834 |
+
options = {};
|
835 |
+
} else {
|
836 |
+
options = $.extend(true, {}, options);
|
837 |
+
}
|
838 |
+
|
839 |
+
options.isObj = true;
|
840 |
+
options.index = index || 0;
|
841 |
+
return this.instance.open(options);
|
842 |
+
},
|
843 |
+
|
844 |
+
close: function() {
|
845 |
+
return $.eaePopup.instance && $.eaePopup.instance.close();
|
846 |
+
},
|
847 |
+
|
848 |
+
registerModule: function(name, module) {
|
849 |
+
if(module.options) {
|
850 |
+
$.eaePopup.defaults[name] = module.options;
|
851 |
+
}
|
852 |
+
$.extend(this.proto, module.proto);
|
853 |
+
this.modules.push(name);
|
854 |
+
},
|
855 |
+
|
856 |
+
defaults: {
|
857 |
+
|
858 |
+
// Info about options is in docs:
|
859 |
+
// http://dimsemenov.com/plugins/magnific-popup/documentation.html#options
|
860 |
+
|
861 |
+
disableOn: 0,
|
862 |
+
|
863 |
+
key: null,
|
864 |
+
|
865 |
+
midClick: false,
|
866 |
+
|
867 |
+
mainClass: '',
|
868 |
+
|
869 |
+
preloader: true,
|
870 |
+
|
871 |
+
focus: '', // CSS selector of input to focus after popup is opened
|
872 |
+
|
873 |
+
closeOnContentClick: false,
|
874 |
+
|
875 |
+
closeOnBgClick: true,
|
876 |
+
|
877 |
+
closeBtnInside: true,
|
878 |
+
|
879 |
+
showCloseBtn: true,
|
880 |
+
|
881 |
+
enableEscapeKey: true,
|
882 |
+
|
883 |
+
modal: false,
|
884 |
+
|
885 |
+
alignTop: false,
|
886 |
+
|
887 |
+
removalDelay: 0,
|
888 |
+
|
889 |
+
prependTo: null,
|
890 |
+
|
891 |
+
fixedContentPos: 'auto',
|
892 |
+
|
893 |
+
fixedBgPos: 'auto',
|
894 |
+
|
895 |
+
overflowY: 'auto',
|
896 |
+
|
897 |
+
closeMarkup: '<button title="%title%" type="button" class="eae-close">×</button>',
|
898 |
+
|
899 |
+
tClose: 'Close (Esc)',
|
900 |
+
|
901 |
+
tLoading: 'Loading...',
|
902 |
+
|
903 |
+
autoFocusLast: true
|
904 |
+
|
905 |
+
}
|
906 |
+
};
|
907 |
+
|
908 |
+
|
909 |
+
|
910 |
+
$.fn.eaePopup = function(options) {
|
911 |
+
_checkInstance();
|
912 |
+
//console.log('popup');
|
913 |
+
var jqEl = $(this);
|
914 |
+
|
915 |
+
// We call some API method of first param is a string
|
916 |
+
if (typeof options === "string" ) {
|
917 |
+
|
918 |
+
if(options === 'open') {
|
919 |
+
var items,
|
920 |
+
itemOpts = _isJQ ? jqEl.data('magnificPopup') : jqEl[0].magnificPopup,
|
921 |
+
index = parseInt(arguments[1], 10) || 0;
|
922 |
+
|
923 |
+
if(itemOpts.items) {
|
924 |
+
items = itemOpts.items[index];
|
925 |
+
} else {
|
926 |
+
items = jqEl;
|
927 |
+
if(itemOpts.delegate) {
|
928 |
+
items = items.find(itemOpts.delegate);
|
929 |
+
}
|
930 |
+
items = items.eq( index );
|
931 |
+
}
|
932 |
+
mfp._openClick({mfpEl:items}, jqEl, itemOpts);
|
933 |
+
} else {
|
934 |
+
if(mfp.isOpen)
|
935 |
+
mfp[options].apply(mfp, Array.prototype.slice.call(arguments, 1));
|
936 |
+
}
|
937 |
+
|
938 |
+
} else {
|
939 |
+
// clone options obj
|
940 |
+
options = $.extend(true, {}, options);
|
941 |
+
|
942 |
+
/*
|
943 |
+
* As Zepto doesn't support .data() method for objects
|
944 |
+
* and it works only in normal browsers
|
945 |
+
* we assign "options" object directly to the DOM element. FTW!
|
946 |
+
*/
|
947 |
+
if(_isJQ) {
|
948 |
+
jqEl.data('magnificPopup', options);
|
949 |
+
} else {
|
950 |
+
jqEl[0].magnificPopup = options;
|
951 |
+
}
|
952 |
+
|
953 |
+
mfp.addGroup(jqEl, options);
|
954 |
+
|
955 |
+
}
|
956 |
+
return jqEl;
|
957 |
+
};
|
958 |
+
|
959 |
+
/*>>core*/
|
960 |
+
|
961 |
+
/*>>inline*/
|
962 |
+
|
963 |
+
var INLINE_NS = 'inline',
|
964 |
+
_hiddenClass,
|
965 |
+
_inlinePlaceholder,
|
966 |
+
_lastInlineElement,
|
967 |
+
_putInlineElementsBack = function() {
|
968 |
+
if(_lastInlineElement) {
|
969 |
+
_inlinePlaceholder.after( _lastInlineElement.addClass(_hiddenClass) ).detach();
|
970 |
+
_lastInlineElement = null;
|
971 |
+
}
|
972 |
+
};
|
973 |
+
|
974 |
+
$.eaePopup.registerModule(INLINE_NS, {
|
975 |
+
options: {
|
976 |
+
hiddenClass: 'hide', // will be appended with `mfp-` prefix
|
977 |
+
markup: '',
|
978 |
+
tNotFound: 'Content not found'
|
979 |
+
},
|
980 |
+
proto: {
|
981 |
+
|
982 |
+
initInline: function() {
|
983 |
+
mfp.types.push(INLINE_NS);
|
984 |
+
|
985 |
+
_mfpOn(CLOSE_EVENT+'.'+INLINE_NS, function() {
|
986 |
+
_putInlineElementsBack();
|
987 |
+
});
|
988 |
+
},
|
989 |
+
|
990 |
+
getInline: function(item, template) {
|
991 |
+
|
992 |
+
_putInlineElementsBack();
|
993 |
+
|
994 |
+
if(item.src) {
|
995 |
+
var inlineSt = mfp.st.inline,
|
996 |
+
el = $(item.src);
|
997 |
+
|
998 |
+
if(el.length) {
|
999 |
+
|
1000 |
+
// If target element has parent - we replace it with placeholder and put it back after popup is closed
|
1001 |
+
var parent = el[0].parentNode;
|
1002 |
+
if(parent && parent.tagName) {
|
1003 |
+
if(!_inlinePlaceholder) {
|
1004 |
+
_hiddenClass = inlineSt.hiddenClass;
|
1005 |
+
_inlinePlaceholder = _getEl(_hiddenClass);
|
1006 |
+
_hiddenClass = 'mfp-'+_hiddenClass;
|
1007 |
+
}
|
1008 |
+
// replace target inline element with placeholder
|
1009 |
+
_lastInlineElement = el.after(_inlinePlaceholder).detach().removeClass(_hiddenClass);
|
1010 |
+
}
|
1011 |
+
|
1012 |
+
mfp.updateStatus('ready');
|
1013 |
+
} else {
|
1014 |
+
mfp.updateStatus('error', inlineSt.tNotFound);
|
1015 |
+
el = $('<div>');
|
1016 |
+
}
|
1017 |
+
|
1018 |
+
item.inlineElement = el;
|
1019 |
+
return el;
|
1020 |
+
}
|
1021 |
+
|
1022 |
+
mfp.updateStatus('ready');
|
1023 |
+
mfp._parseMarkup(template, {}, item);
|
1024 |
+
return template;
|
1025 |
+
}
|
1026 |
+
}
|
1027 |
+
});
|
1028 |
+
|
1029 |
+
/*>>inline*/
|
1030 |
+
|
1031 |
+
/*>>ajax*/
|
1032 |
+
var AJAX_NS = 'ajax',
|
1033 |
+
_ajaxCur,
|
1034 |
+
_removeAjaxCursor = function() {
|
1035 |
+
if(_ajaxCur) {
|
1036 |
+
$(document.body).removeClass(_ajaxCur);
|
1037 |
+
}
|
1038 |
+
},
|
1039 |
+
_destroyAjaxRequest = function() {
|
1040 |
+
_removeAjaxCursor();
|
1041 |
+
if(mfp.req) {
|
1042 |
+
mfp.req.abort();
|
1043 |
+
}
|
1044 |
+
};
|
1045 |
+
|
1046 |
+
$.eaePopup.registerModule(AJAX_NS, {
|
1047 |
+
|
1048 |
+
options: {
|
1049 |
+
settings: null,
|
1050 |
+
cursor: 'mfp-ajax-cur',
|
1051 |
+
tError: '<a href="%url%">The content</a> could not be loaded.'
|
1052 |
+
},
|
1053 |
+
|
1054 |
+
proto: {
|
1055 |
+
initAjax: function() {
|
1056 |
+
mfp.types.push(AJAX_NS);
|
1057 |
+
_ajaxCur = mfp.st.ajax.cursor;
|
1058 |
+
|
1059 |
+
_mfpOn(CLOSE_EVENT+'.'+AJAX_NS, _destroyAjaxRequest);
|
1060 |
+
_mfpOn('BeforeChange.' + AJAX_NS, _destroyAjaxRequest);
|
1061 |
+
},
|
1062 |
+
getAjax: function(item) {
|
1063 |
+
|
1064 |
+
if(_ajaxCur) {
|
1065 |
+
$(document.body).addClass(_ajaxCur);
|
1066 |
+
}
|
1067 |
+
|
1068 |
+
mfp.updateStatus('loading');
|
1069 |
+
|
1070 |
+
var opts = $.extend({
|
1071 |
+
url: item.src,
|
1072 |
+
success: function(data, textStatus, jqXHR) {
|
1073 |
+
var temp = {
|
1074 |
+
data:data,
|
1075 |
+
xhr:jqXHR
|
1076 |
+
};
|
1077 |
+
|
1078 |
+
_mfpTrigger('ParseAjax', temp);
|
1079 |
+
|
1080 |
+
mfp.appendContent( $(temp.data), AJAX_NS );
|
1081 |
+
|
1082 |
+
item.finished = true;
|
1083 |
+
|
1084 |
+
_removeAjaxCursor();
|
1085 |
+
|
1086 |
+
mfp._setFocus();
|
1087 |
+
|
1088 |
+
setTimeout(function() {
|
1089 |
+
mfp.wrap.addClass(READY_CLASS);
|
1090 |
+
}, 16);
|
1091 |
+
|
1092 |
+
mfp.updateStatus('ready');
|
1093 |
+
|
1094 |
+
_mfpTrigger('AjaxContentAdded');
|
1095 |
+
},
|
1096 |
+
error: function() {
|
1097 |
+
_removeAjaxCursor();
|
1098 |
+
item.finished = item.loadError = true;
|
1099 |
+
mfp.updateStatus('error', mfp.st.ajax.tError.replace('%url%', item.src));
|
1100 |
+
}
|
1101 |
+
}, mfp.st.ajax.settings);
|
1102 |
+
|
1103 |
+
mfp.req = $.ajax(opts);
|
1104 |
+
|
1105 |
+
return '';
|
1106 |
+
}
|
1107 |
+
}
|
1108 |
+
});
|
1109 |
+
|
1110 |
+
/*>>ajax*/
|
1111 |
+
|
1112 |
+
/*>>image*/
|
1113 |
+
var _imgInterval,
|
1114 |
+
_getTitle = function(item) {
|
1115 |
+
if(item.data && item.data.title !== undefined)
|
1116 |
+
return item.data.title;
|
1117 |
+
|
1118 |
+
var src = mfp.st.image.titleSrc;
|
1119 |
+
|
1120 |
+
if(src) {
|
1121 |
+
if($.isFunction(src)) {
|
1122 |
+
return src.call(mfp, item);
|
1123 |
+
} else if(item.el) {
|
1124 |
+
return item.el.attr(src) || '';
|
1125 |
+
}
|
1126 |
+
}
|
1127 |
+
return '';
|
1128 |
+
};
|
1129 |
+
|
1130 |
+
$.eaePopup.registerModule('image', {
|
1131 |
+
|
1132 |
+
options: {
|
1133 |
+
markup: '<div class="mfp-figure">'+
|
1134 |
+
'<div class="eae-close"></div>'+
|
1135 |
+
'<figure>'+
|
1136 |
+
'<div class="mfp-img"></div>'+
|
1137 |
+
'<figcaption>'+
|
1138 |
+
'<div class="mfp-bottom-bar">'+
|
1139 |
+
'<div class="mfp-title"></div>'+
|
1140 |
+
'<div class="mfp-counter"></div>'+
|
1141 |
+
'</div>'+
|
1142 |
+
'</figcaption>'+
|
1143 |
+
'</figure>'+
|
1144 |
+
'</div>',
|
1145 |
+
cursor: 'mfp-zoom-out-cur',
|
1146 |
+
titleSrc: 'title',
|
1147 |
+
verticalFit: true,
|
1148 |
+
tError: '<a href="%url%">The image</a> could not be loaded.'
|
1149 |
+
},
|
1150 |
+
|
1151 |
+
proto: {
|
1152 |
+
initImage: function() {
|
1153 |
+
var imgSt = mfp.st.image,
|
1154 |
+
ns = '.image';
|
1155 |
+
|
1156 |
+
mfp.types.push('image');
|
1157 |
+
|
1158 |
+
_mfpOn(OPEN_EVENT+ns, function() {
|
1159 |
+
if(mfp.currItem.type === 'image' && imgSt.cursor) {
|
1160 |
+
$(document.body).addClass(imgSt.cursor);
|
1161 |
+
}
|
1162 |
+
});
|
1163 |
+
|
1164 |
+
_mfpOn(CLOSE_EVENT+ns, function() {
|
1165 |
+
if(imgSt.cursor) {
|
1166 |
+
$(document.body).removeClass(imgSt.cursor);
|
1167 |
+
}
|
1168 |
+
_window.off('resize' + EVENT_NS);
|
1169 |
+
});
|
1170 |
+
|
1171 |
+
_mfpOn('Resize'+ns, mfp.resizeImage);
|
1172 |
+
if(mfp.isLowIE) {
|
1173 |
+
_mfpOn('AfterChange', mfp.resizeImage);
|
1174 |
+
}
|
1175 |
+
},
|
1176 |
+
resizeImage: function() {
|
1177 |
+
var item = mfp.currItem;
|
1178 |
+
if(!item || !item.img) return;
|
1179 |
+
|
1180 |
+
if(mfp.st.image.verticalFit) {
|
1181 |
+
var decr = 0;
|
1182 |
+
// fix box-sizing in ie7/8
|
1183 |
+
if(mfp.isLowIE) {
|
1184 |
+
decr = parseInt(item.img.css('padding-top'), 10) + parseInt(item.img.css('padding-bottom'),10);
|
1185 |
+
}
|
1186 |
+
item.img.css('max-height', mfp.wH-decr);
|
1187 |
+
}
|
1188 |
+
},
|
1189 |
+
_onImageHasSize: function(item) {
|
1190 |
+
if(item.img) {
|
1191 |
+
|
1192 |
+
item.hasSize = true;
|
1193 |
+
|
1194 |
+
if(_imgInterval) {
|
1195 |
+
clearInterval(_imgInterval);
|
1196 |
+
}
|
1197 |
+
|
1198 |
+
item.isCheckingImgSize = false;
|
1199 |
+
|
1200 |
+
_mfpTrigger('ImageHasSize', item);
|
1201 |
+
|
1202 |
+
if(item.imgHidden) {
|
1203 |
+
if(mfp.content)
|
1204 |
+
mfp.content.removeClass('mfp-loading');
|
1205 |
+
|
1206 |
+
item.imgHidden = false;
|
1207 |
+
}
|
1208 |
+
|
1209 |
+
}
|
1210 |
+
},
|
1211 |
+
|
1212 |
+
/**
|
1213 |
+
* Function that loops until the image has size to display elements that rely on it asap
|
1214 |
+
*/
|
1215 |
+
findImageSize: function(item) {
|
1216 |
+
|
1217 |
+
var counter = 0,
|
1218 |
+
img = item.img[0],
|
1219 |
+
mfpSetInterval = function(delay) {
|
1220 |
+
|
1221 |
+
if(_imgInterval) {
|
1222 |
+
clearInterval(_imgInterval);
|
1223 |
+
}
|
1224 |
+
// decelerating interval that checks for size of an image
|
1225 |
+
_imgInterval = setInterval(function() {
|
1226 |
+
if(img.naturalWidth > 0) {
|
1227 |
+
mfp._onImageHasSize(item);
|
1228 |
+
return;
|
1229 |
+
}
|
1230 |
+
|
1231 |
+
if(counter > 200) {
|
1232 |
+
clearInterval(_imgInterval);
|
1233 |
+
}
|
1234 |
+
|
1235 |
+
counter++;
|
1236 |
+
if(counter === 3) {
|
1237 |
+
mfpSetInterval(10);
|
1238 |
+
} else if(counter === 40) {
|
1239 |
+
mfpSetInterval(50);
|
1240 |
+
} else if(counter === 100) {
|
1241 |
+
mfpSetInterval(500);
|
1242 |
+
}
|
1243 |
+
}, delay);
|
1244 |
+
};
|
1245 |
+
|
1246 |
+
mfpSetInterval(1);
|
1247 |
+
},
|
1248 |
+
|
1249 |
+
getImage: function(item, template) {
|
1250 |
+
|
1251 |
+
var guard = 0,
|
1252 |
+
|
1253 |
+
// image load complete handler
|
1254 |
+
onLoadComplete = function() {
|
1255 |
+
if(item) {
|
1256 |
+
if (item.img[0].complete) {
|
1257 |
+
item.img.off('.mfploader');
|
1258 |
+
|
1259 |
+
if(item === mfp.currItem){
|
1260 |
+
mfp._onImageHasSize(item);
|
1261 |
+
|
1262 |
+
mfp.updateStatus('ready');
|
1263 |
+
}
|
1264 |
+
|
1265 |
+
item.hasSize = true;
|
1266 |
+
item.loaded = true;
|
1267 |
+
|
1268 |
+
_mfpTrigger('ImageLoadComplete');
|
1269 |
+
|
1270 |
+
}
|
1271 |
+
else {
|
1272 |
+
// if image complete check fails 200 times (20 sec), we assume that there was an error.
|
1273 |
+
guard++;
|
1274 |
+
if(guard < 200) {
|
1275 |
+
setTimeout(onLoadComplete,100);
|
1276 |
+
} else {
|
1277 |
+
onLoadError();
|
1278 |
+
}
|
1279 |
+
}
|
1280 |
+
}
|
1281 |
+
},
|
1282 |
+
|
1283 |
+
// image error handler
|
1284 |
+
onLoadError = function() {
|
1285 |
+
if(item) {
|
1286 |
+
item.img.off('.mfploader');
|
1287 |
+
if(item === mfp.currItem){
|
1288 |
+
mfp._onImageHasSize(item);
|
1289 |
+
mfp.updateStatus('error', imgSt.tError.replace('%url%', item.src) );
|
1290 |
+
}
|
1291 |
+
|
1292 |
+
item.hasSize = true;
|
1293 |
+
item.loaded = true;
|
1294 |
+
item.loadError = true;
|
1295 |
+
}
|
1296 |
+
},
|
1297 |
+
imgSt = mfp.st.image;
|
1298 |
+
|
1299 |
+
|
1300 |
+
var el = template.find('.mfp-img');
|
1301 |
+
if(el.length) {
|
1302 |
+
var img = document.createElement('img');
|
1303 |
+
img.className = 'mfp-img';
|
1304 |
+
if(item.el && item.el.find('img').length) {
|
1305 |
+
img.alt = item.el.find('img').attr('alt');
|
1306 |
+
}
|
1307 |
+
item.img = $(img).on('load.mfploader', onLoadComplete).on('error.mfploader', onLoadError);
|
1308 |
+
img.src = item.src;
|
1309 |
+
|
1310 |
+
// without clone() "error" event is not firing when IMG is replaced by new IMG
|
1311 |
+
// TODO: find a way to avoid such cloning
|
1312 |
+
if(el.is('img')) {
|
1313 |
+
item.img = item.img.clone();
|
1314 |
+
}
|
1315 |
+
|
1316 |
+
img = item.img[0];
|
1317 |
+
if(img.naturalWidth > 0) {
|
1318 |
+
item.hasSize = true;
|
1319 |
+
} else if(!img.width) {
|
1320 |
+
item.hasSize = false;
|
1321 |
+
}
|
1322 |
+
}
|
1323 |
+
|
1324 |
+
mfp._parseMarkup(template, {
|
1325 |
+
title: _getTitle(item),
|
1326 |
+
img_replaceWith: item.img
|
1327 |
+
}, item);
|
1328 |
+
|
1329 |
+
mfp.resizeImage();
|
1330 |
+
|
1331 |
+
if(item.hasSize) {
|
1332 |
+
if(_imgInterval) clearInterval(_imgInterval);
|
1333 |
+
|
1334 |
+
if(item.loadError) {
|
1335 |
+
template.addClass('mfp-loading');
|
1336 |
+
mfp.updateStatus('error', imgSt.tError.replace('%url%', item.src) );
|
1337 |
+
} else {
|
1338 |
+
template.removeClass('mfp-loading');
|
1339 |
+
mfp.updateStatus('ready');
|
1340 |
+
}
|
1341 |
+
return template;
|
1342 |
+
}
|
1343 |
+
|
1344 |
+
mfp.updateStatus('loading');
|
1345 |
+
item.loading = true;
|
1346 |
+
|
1347 |
+
if(!item.hasSize) {
|
1348 |
+
item.imgHidden = true;
|
1349 |
+
template.addClass('mfp-loading');
|
1350 |
+
mfp.findImageSize(item);
|
1351 |
+
}
|
1352 |
+
|
1353 |
+
return template;
|
1354 |
+
}
|
1355 |
+
}
|
1356 |
+
});
|
1357 |
+
|
1358 |
+
/*>>image*/
|
1359 |
+
|
1360 |
+
/*>>zoom*/
|
1361 |
+
var hasMozTransform,
|
1362 |
+
getHasMozTransform = function() {
|
1363 |
+
if(hasMozTransform === undefined) {
|
1364 |
+
hasMozTransform = document.createElement('p').style.MozTransform !== undefined;
|
1365 |
+
}
|
1366 |
+
return hasMozTransform;
|
1367 |
+
};
|
1368 |
+
|
1369 |
+
$.eaePopup.registerModule('zoom', {
|
1370 |
+
|
1371 |
+
options: {
|
1372 |
+
enabled: false,
|
1373 |
+
easing: 'ease-in-out',
|
1374 |
+
duration: 300,
|
1375 |
+
opener: function(element) {
|
1376 |
+
return element.is('img') ? element : element.find('img');
|
1377 |
+
}
|
1378 |
+
},
|
1379 |
+
|
1380 |
+
proto: {
|
1381 |
+
|
1382 |
+
initZoom: function() {
|
1383 |
+
var zoomSt = mfp.st.zoom,
|
1384 |
+
ns = '.zoom',
|
1385 |
+
image;
|
1386 |
+
|
1387 |
+
if(!zoomSt.enabled || !mfp.supportsTransition) {
|
1388 |
+
return;
|
1389 |
+
}
|
1390 |
+
|
1391 |
+
var duration = zoomSt.duration,
|
1392 |
+
getElToAnimate = function(image) {
|
1393 |
+
var newImg = image.clone().removeAttr('style').removeAttr('class').addClass('mfp-animated-image'),
|
1394 |
+
transition = 'all '+(zoomSt.duration/1000)+'s ' + zoomSt.easing,
|
1395 |
+
cssObj = {
|
1396 |
+
position: 'fixed',
|
1397 |
+
zIndex: 9999,
|
1398 |
+
left: 0,
|
1399 |
+
top: 0,
|
1400 |
+
'-webkit-backface-visibility': 'hidden'
|
1401 |
+
},
|
1402 |
+
t = 'transition';
|
1403 |
+
|
1404 |
+
cssObj['-webkit-'+t] = cssObj['-moz-'+t] = cssObj['-o-'+t] = cssObj[t] = transition;
|
1405 |
+
|
1406 |
+
newImg.css(cssObj);
|
1407 |
+
return newImg;
|
1408 |
+
},
|
1409 |
+
showMainContent = function() {
|
1410 |
+
mfp.content.css('visibility', 'visible');
|
1411 |
+
},
|
1412 |
+
openTimeout,
|
1413 |
+
animatedImg;
|
1414 |
+
|
1415 |
+
_mfpOn('BuildControls'+ns, function() {
|
1416 |
+
if(mfp._allowZoom()) {
|
1417 |
+
|
1418 |
+
clearTimeout(openTimeout);
|
1419 |
+
mfp.content.css('visibility', 'hidden');
|
1420 |
+
|
1421 |
+
// Basically, all code below does is clones existing image, puts in on top of the current one and animated it
|
1422 |
+
|
1423 |
+
image = mfp._getItemToZoom();
|
1424 |
+
|
1425 |
+
if(!image) {
|
1426 |
+
showMainContent();
|
1427 |
+
return;
|
1428 |
+
}
|
1429 |
+
|
1430 |
+
animatedImg = getElToAnimate(image);
|
1431 |
+
|
1432 |
+
animatedImg.css( mfp._getOffset() );
|
1433 |
+
|
1434 |
+
mfp.wrap.append(animatedImg);
|
1435 |
+
|
1436 |
+
openTimeout = setTimeout(function() {
|
1437 |
+
animatedImg.css( mfp._getOffset( true ) );
|
1438 |
+
openTimeout = setTimeout(function() {
|
1439 |
+
|
1440 |
+
showMainContent();
|
1441 |
+
|
1442 |
+
setTimeout(function() {
|
1443 |
+
animatedImg.remove();
|
1444 |
+
image = animatedImg = null;
|
1445 |
+
_mfpTrigger('ZoomAnimationEnded');
|
1446 |
+
}, 16); // avoid blink when switching images
|
1447 |
+
|
1448 |
+
}, duration); // this timeout equals animation duration
|
1449 |
+
|
1450 |
+
}, 16); // by adding this timeout we avoid short glitch at the beginning of animation
|
1451 |
+
|
1452 |
+
|
1453 |
+
// Lots of timeouts...
|
1454 |
+
}
|
1455 |
+
});
|
1456 |
+
_mfpOn(BEFORE_CLOSE_EVENT+ns, function() {
|
1457 |
+
if(mfp._allowZoom()) {
|
1458 |
+
|
1459 |
+
clearTimeout(openTimeout);
|
1460 |
+
|
1461 |
+
mfp.st.removalDelay = duration;
|
1462 |
+
|
1463 |
+
if(!image) {
|
1464 |
+
image = mfp._getItemToZoom();
|
1465 |
+
if(!image) {
|
1466 |
+
return;
|
1467 |
+
}
|
1468 |
+
animatedImg = getElToAnimate(image);
|
1469 |
+
}
|
1470 |
+
|
1471 |
+
animatedImg.css( mfp._getOffset(true) );
|
1472 |
+
mfp.wrap.append(animatedImg);
|
1473 |
+
mfp.content.css('visibility', 'hidden');
|
1474 |
+
|
1475 |
+
setTimeout(function() {
|
1476 |
+
animatedImg.css( mfp._getOffset() );
|
1477 |
+
}, 16);
|
1478 |
+
}
|
1479 |
+
|
1480 |
+
});
|
1481 |
+
|
1482 |
+
_mfpOn(CLOSE_EVENT+ns, function() {
|
1483 |
+
if(mfp._allowZoom()) {
|
1484 |
+
showMainContent();
|
1485 |
+
if(animatedImg) {
|
1486 |
+
animatedImg.remove();
|
1487 |
+
}
|
1488 |
+
image = null;
|
1489 |
+
}
|
1490 |
+
});
|
1491 |
+
},
|
1492 |
+
|
1493 |
+
_allowZoom: function() {
|
1494 |
+
return mfp.currItem.type === 'image';
|
1495 |
+
},
|
1496 |
+
|
1497 |
+
_getItemToZoom: function() {
|
1498 |
+
if(mfp.currItem.hasSize) {
|
1499 |
+
return mfp.currItem.img;
|
1500 |
+
} else {
|
1501 |
+
return false;
|
1502 |
+
}
|
1503 |
+
},
|
1504 |
+
|
1505 |
+
// Get element postion relative to viewport
|
1506 |
+
_getOffset: function(isLarge) {
|
1507 |
+
var el;
|
1508 |
+
if(isLarge) {
|
1509 |
+
el = mfp.currItem.img;
|
1510 |
+
} else {
|
1511 |
+
el = mfp.st.zoom.opener(mfp.currItem.el || mfp.currItem);
|
1512 |
+
}
|
1513 |
+
|
1514 |
+
var offset = el.offset();
|
1515 |
+
var paddingTop = parseInt(el.css('padding-top'),10);
|
1516 |
+
var paddingBottom = parseInt(el.css('padding-bottom'),10);
|
1517 |
+
offset.top -= ( $(window).scrollTop() - paddingTop );
|
1518 |
+
|
1519 |
+
|
1520 |
+
/*
|
1521 |
+
|
1522 |
+
Animating left + top + width/height looks glitchy in Firefox, but perfect in Chrome. And vice-versa.
|
1523 |
+
|
1524 |
+
*/
|
1525 |
+
var obj = {
|
1526 |
+
width: el.width(),
|
1527 |
+
// fix Zepto height+padding issue
|
1528 |
+
height: (_isJQ ? el.innerHeight() : el[0].offsetHeight) - paddingBottom - paddingTop
|
1529 |
+
};
|
1530 |
+
|
1531 |
+
// I hate to do this, but there is no another option
|
1532 |
+
if( getHasMozTransform() ) {
|
1533 |
+
obj['-moz-transform'] = obj['transform'] = 'translate(' + offset.left + 'px,' + offset.top + 'px)';
|
1534 |
+
} else {
|
1535 |
+
obj.left = offset.left;
|
1536 |
+
obj.top = offset.top;
|
1537 |
+
}
|
1538 |
+
return obj;
|
1539 |
+
}
|
1540 |
+
|
1541 |
+
}
|
1542 |
+
});
|
1543 |
+
|
1544 |
+
|
1545 |
+
|
1546 |
+
/*>>zoom*/
|
1547 |
+
|
1548 |
+
/*>>iframe*/
|
1549 |
+
|
1550 |
+
var IFRAME_NS = 'iframe',
|
1551 |
+
_emptyPage = '//about:blank',
|
1552 |
+
|
1553 |
+
_fixIframeBugs = function(isShowing) {
|
1554 |
+
if(mfp.currTemplate[IFRAME_NS]) {
|
1555 |
+
var el = mfp.currTemplate[IFRAME_NS].find('iframe');
|
1556 |
+
if(el.length) {
|
1557 |
+
// reset src after the popup is closed to avoid "video keeps playing after popup is closed" bug
|
1558 |
+
if(!isShowing) {
|
1559 |
+
el[0].src = _emptyPage;
|
1560 |
+
}
|
1561 |
+
|
1562 |
+
// IE8 black screen bug fix
|
1563 |
+
if(mfp.isIE8) {
|
1564 |
+
el.css('display', isShowing ? 'block' : 'none');
|
1565 |
+
}
|
1566 |
+
}
|
1567 |
+
}
|
1568 |
+
};
|
1569 |
+
|
1570 |
+
$.eaePopup.registerModule(IFRAME_NS, {
|
1571 |
+
|
1572 |
+
options: {
|
1573 |
+
markup: '<div class="mfp-iframe-scaler">'+
|
1574 |
+
'<div class="eae-close"></div>'+
|
1575 |
+
'<iframe class="mfp-iframe" src="//about:blank" frameborder="0" allowfullscreen></iframe>'+
|
1576 |
+
'</div>',
|
1577 |
+
|
1578 |
+
srcAction: 'iframe_src',
|
1579 |
+
|
1580 |
+
// we don't care and support only one default type of URL by default
|
1581 |
+
patterns: {
|
1582 |
+
youtube: {
|
1583 |
+
index: 'youtube.com',
|
1584 |
+
id: 'v=',
|
1585 |
+
src: '//www.youtube.com/embed/%id%?autoplay=1'
|
1586 |
+
},
|
1587 |
+
vimeo: {
|
1588 |
+
index: 'vimeo.com/',
|
1589 |
+
id: '/',
|
1590 |
+
src: '//player.vimeo.com/video/%id%?autoplay=1'
|
1591 |
+
},
|
1592 |
+
gmaps: {
|
1593 |
+
index: '//maps.google.',
|
1594 |
+
src: '%id%&output=embed'
|
1595 |
+
}
|
1596 |
+
}
|
1597 |
+
},
|
1598 |
+
|
1599 |
+
proto: {
|
1600 |
+
initIframe: function() {
|
1601 |
+
mfp.types.push(IFRAME_NS);
|
1602 |
+
|
1603 |
+
_mfpOn('BeforeChange', function(e, prevType, newType) {
|
1604 |
+
if(prevType !== newType) {
|
1605 |
+
if(prevType === IFRAME_NS) {
|
1606 |
+
_fixIframeBugs(); // iframe if removed
|
1607 |
+
} else if(newType === IFRAME_NS) {
|
1608 |
+
_fixIframeBugs(true); // iframe is showing
|
1609 |
+
}
|
1610 |
+
}// else {
|
1611 |
+
// iframe source is switched, don't do anything
|
1612 |
+
//}
|
1613 |
+
});
|
1614 |
+
|
1615 |
+
_mfpOn(CLOSE_EVENT + '.' + IFRAME_NS, function() {
|
1616 |
+
_fixIframeBugs();
|
1617 |
+
});
|
1618 |
+
},
|
1619 |
+
|
1620 |
+
getIframe: function(item, template) {
|
1621 |
+
var embedSrc = item.src;
|
1622 |
+
var iframeSt = mfp.st.iframe;
|
1623 |
+
|
1624 |
+
$.each(iframeSt.patterns, function() {
|
1625 |
+
if(embedSrc.indexOf( this.index ) > -1) {
|
1626 |
+
if(this.id) {
|
1627 |
+
if(typeof this.id === 'string') {
|
1628 |
+
embedSrc = embedSrc.substr(embedSrc.lastIndexOf(this.id)+this.id.length, embedSrc.length);
|
1629 |
+
} else {
|
1630 |
+
embedSrc = this.id.call( this, embedSrc );
|
1631 |
+
}
|
1632 |
+
}
|
1633 |
+
embedSrc = this.src.replace('%id%', embedSrc );
|
1634 |
+
return false; // break;
|
1635 |
+
}
|
1636 |
+
});
|
1637 |
+
|
1638 |
+
var dataObj = {};
|
1639 |
+
if(iframeSt.srcAction) {
|
1640 |
+
dataObj[iframeSt.srcAction] = embedSrc;
|
1641 |
+
}
|
1642 |
+
mfp._parseMarkup(template, dataObj, item);
|
1643 |
+
|
1644 |
+
mfp.updateStatus('ready');
|
1645 |
+
|
1646 |
+
return template;
|
1647 |
+
}
|
1648 |
+
}
|
1649 |
+
});
|
1650 |
+
|
1651 |
+
|
1652 |
+
|
1653 |
+
/*>>iframe*/
|
1654 |
+
|
1655 |
+
/*>>gallery*/
|
1656 |
+
/**
|
1657 |
+
* Get looped index depending on number of slides
|
1658 |
+
*/
|
1659 |
+
var _getLoopedId = function(index) {
|
1660 |
+
var numSlides = mfp.items.length;
|
1661 |
+
if(index > numSlides - 1) {
|
1662 |
+
return index - numSlides;
|
1663 |
+
} else if(index < 0) {
|
1664 |
+
return numSlides + index;
|
1665 |
+
}
|
1666 |
+
return index;
|
1667 |
+
},
|
1668 |
+
_replaceCurrTotal = function(text, curr, total) {
|
1669 |
+
return text.replace(/%curr%/gi, curr + 1).replace(/%total%/gi, total);
|
1670 |
+
};
|
1671 |
+
|
1672 |
+
$.eaePopup.registerModule('gallery', {
|
1673 |
+
|
1674 |
+
options: {
|
1675 |
+
enabled: false,
|
1676 |
+
arrowMarkup: '<button title="%title%" type="button" class="mfp-arrow mfp-arrow-%dir%"></button>',
|
1677 |
+
preload: [0,2],
|
1678 |
+
navigateByImgClick: true,
|
1679 |
+
arrows: true,
|
1680 |
+
|
1681 |
+
tPrev: 'Previous (Left arrow key)',
|
1682 |
+
tNext: 'Next (Right arrow key)',
|
1683 |
+
tCounter: '%curr% of %total%'
|
1684 |
+
},
|
1685 |
+
|
1686 |
+
proto: {
|
1687 |
+
initGallery: function() {
|
1688 |
+
|
1689 |
+
var gSt = mfp.st.gallery,
|
1690 |
+
ns = '.mfp-gallery';
|
1691 |
+
|
1692 |
+
mfp.direction = true; // true - next, false - prev
|
1693 |
+
|
1694 |
+
if(!gSt || !gSt.enabled ) return false;
|
1695 |
+
|
1696 |
+
_wrapClasses += ' mfp-gallery';
|
1697 |
+
|
1698 |
+
_mfpOn(OPEN_EVENT+ns, function() {
|
1699 |
+
|
1700 |
+
if(gSt.navigateByImgClick) {
|
1701 |
+
mfp.wrap.on('click'+ns, '.mfp-img', function() {
|
1702 |
+
if(mfp.items.length > 1) {
|
1703 |
+
mfp.next();
|
1704 |
+
return false;
|
1705 |
+
}
|
1706 |
+
});
|
1707 |
+
}
|
1708 |
+
|
1709 |
+
_document.on('keydown'+ns, function(e) {
|
1710 |
+
if (e.keyCode === 37) {
|
1711 |
+
mfp.prev();
|
1712 |
+
} else if (e.keyCode === 39) {
|
1713 |
+
mfp.next();
|
1714 |
+
}
|
1715 |
+
});
|
1716 |
+
});
|
1717 |
+
|
1718 |
+
_mfpOn('UpdateStatus'+ns, function(e, data) {
|
1719 |
+
if(data.text) {
|
1720 |
+
data.text = _replaceCurrTotal(data.text, mfp.currItem.index, mfp.items.length);
|
1721 |
+
}
|
1722 |
+
});
|
1723 |
+
|
1724 |
+
_mfpOn(MARKUP_PARSE_EVENT+ns, function(e, element, values, item) {
|
1725 |
+
var l = mfp.items.length;
|
1726 |
+
values.counter = l > 1 ? _replaceCurrTotal(gSt.tCounter, item.index, l) : '';
|
1727 |
+
});
|
1728 |
+
|
1729 |
+
_mfpOn('BuildControls' + ns, function() {
|
1730 |
+
if(mfp.items.length > 1 && gSt.arrows && !mfp.arrowLeft) {
|
1731 |
+
var markup = gSt.arrowMarkup,
|
1732 |
+
arrowLeft = mfp.arrowLeft = $( markup.replace(/%title%/gi, gSt.tPrev).replace(/%dir%/gi, 'left') ).addClass(PREVENT_CLOSE_CLASS),
|
1733 |
+
arrowRight = mfp.arrowRight = $( markup.replace(/%title%/gi, gSt.tNext).replace(/%dir%/gi, 'right') ).addClass(PREVENT_CLOSE_CLASS);
|
1734 |
+
|
1735 |
+
arrowLeft.click(function() {
|
1736 |
+
mfp.prev();
|
1737 |
+
});
|
1738 |
+
arrowRight.click(function() {
|
1739 |
+
mfp.next();
|
1740 |
+
});
|
1741 |
+
|
1742 |
+
mfp.container.append(arrowLeft.add(arrowRight));
|
1743 |
+
}
|
1744 |
+
});
|
1745 |
+
|
1746 |
+
_mfpOn(CHANGE_EVENT+ns, function() {
|
1747 |
+
if(mfp._preloadTimeout) clearTimeout(mfp._preloadTimeout);
|
1748 |
+
|
1749 |
+
mfp._preloadTimeout = setTimeout(function() {
|
1750 |
+
mfp.preloadNearbyImages();
|
1751 |
+
mfp._preloadTimeout = null;
|
1752 |
+
}, 16);
|
1753 |
+
});
|
1754 |
+
|
1755 |
+
|
1756 |
+
_mfpOn(CLOSE_EVENT+ns, function() {
|
1757 |
+
_document.off(ns);
|
1758 |
+
mfp.wrap.off('click'+ns);
|
1759 |
+
mfp.arrowRight = mfp.arrowLeft = null;
|
1760 |
+
});
|
1761 |
+
|
1762 |
+
},
|
1763 |
+
next: function() {
|
1764 |
+
mfp.direction = true;
|
1765 |
+
mfp.index = _getLoopedId(mfp.index + 1);
|
1766 |
+
mfp.updateItemHTML();
|
1767 |
+
},
|
1768 |
+
prev: function() {
|
1769 |
+
mfp.direction = false;
|
1770 |
+
mfp.index = _getLoopedId(mfp.index - 1);
|
1771 |
+
mfp.updateItemHTML();
|
1772 |
+
},
|
1773 |
+
goTo: function(newIndex) {
|
1774 |
+
mfp.direction = (newIndex >= mfp.index);
|
1775 |
+
mfp.index = newIndex;
|
1776 |
+
mfp.updateItemHTML();
|
1777 |
+
},
|
1778 |
+
preloadNearbyImages: function() {
|
1779 |
+
var p = mfp.st.gallery.preload,
|
1780 |
+
preloadBefore = Math.min(p[0], mfp.items.length),
|
1781 |
+
preloadAfter = Math.min(p[1], mfp.items.length),
|
1782 |
+
i;
|
1783 |
+
|
1784 |
+
for(i = 1; i <= (mfp.direction ? preloadAfter : preloadBefore); i++) {
|
1785 |
+
mfp._preloadItem(mfp.index+i);
|
1786 |
+
}
|
1787 |
+
for(i = 1; i <= (mfp.direction ? preloadBefore : preloadAfter); i++) {
|
1788 |
+
mfp._preloadItem(mfp.index-i);
|
1789 |
+
}
|
1790 |
+
},
|
1791 |
+
_preloadItem: function(index) {
|
1792 |
+
index = _getLoopedId(index);
|
1793 |
+
|
1794 |
+
if(mfp.items[index].preloaded) {
|
1795 |
+
return;
|
1796 |
+
}
|
1797 |
+
|
1798 |
+
var item = mfp.items[index];
|
1799 |
+
if(!item.parsed) {
|
1800 |
+
item = mfp.parseEl( index );
|
1801 |
+
}
|
1802 |
+
|
1803 |
+
_mfpTrigger('LazyLoad', item);
|
1804 |
+
|
1805 |
+
if(item.type === 'image') {
|
1806 |
+
item.img = $('<img class="mfp-img" />').on('load.mfploader', function() {
|
1807 |
+
item.hasSize = true;
|
1808 |
+
}).on('error.mfploader', function() {
|
1809 |
+
item.hasSize = true;
|
1810 |
+
item.loadError = true;
|
1811 |
+
_mfpTrigger('LazyLoadError', item);
|
1812 |
+
}).attr('src', item.src);
|
1813 |
+
}
|
1814 |
+
|
1815 |
+
|
1816 |
+
item.preloaded = true;
|
1817 |
+
}
|
1818 |
+
}
|
1819 |
+
});
|
1820 |
+
|
1821 |
+
/*>>gallery*/
|
1822 |
+
|
1823 |
+
/*>>retina*/
|
1824 |
+
|
1825 |
+
var RETINA_NS = 'retina';
|
1826 |
+
|
1827 |
+
$.eaePopup.registerModule(RETINA_NS, {
|
1828 |
+
options: {
|
1829 |
+
replaceSrc: function(item) {
|
1830 |
+
return item.src.replace(/\.\w+$/, function(m) { return '@2x' + m; });
|
1831 |
+
},
|
1832 |
+
ratio: 1 // Function or number. Set to 1 to disable.
|
1833 |
+
},
|
1834 |
+
proto: {
|
1835 |
+
initRetina: function() {
|
1836 |
+
if(window.devicePixelRatio > 1) {
|
1837 |
+
|
1838 |
+
var st = mfp.st.retina,
|
1839 |
+
ratio = st.ratio;
|
1840 |
+
|
1841 |
+
ratio = !isNaN(ratio) ? ratio : ratio();
|
1842 |
+
|
1843 |
+
if(ratio > 1) {
|
1844 |
+
_mfpOn('ImageHasSize' + '.' + RETINA_NS, function(e, item) {
|
1845 |
+
item.img.css({
|
1846 |
+
'max-width': item.img[0].naturalWidth / ratio,
|
1847 |
+
'width': '100%'
|
1848 |
+
});
|
1849 |
+
});
|
1850 |
+
_mfpOn('ElementParse' + '.' + RETINA_NS, function(e, item) {
|
1851 |
+
item.src = st.replaceSrc(item, ratio);
|
1852 |
+
});
|
1853 |
+
}
|
1854 |
+
}
|
1855 |
+
|
1856 |
+
}
|
1857 |
+
}
|
1858 |
+
});
|
1859 |
+
|
1860 |
+
/*>>retina*/
|
1861 |
+
_checkInstance(); }));
|
assets/lib/vegas/overlays/00.png
ADDED
Binary file
|
assets/lib/vegas/overlays/01.png
ADDED
Binary file
|
assets/lib/vegas/overlays/02.png
ADDED
Binary file
|
assets/lib/vegas/overlays/03.png
ADDED
Binary file
|
assets/lib/vegas/overlays/04.png
ADDED
Binary file
|
assets/lib/vegas/overlays/05.png
ADDED
Binary file
|
assets/lib/vegas/overlays/06.png
ADDED
Binary file
|
assets/lib/vegas/overlays/07.png
ADDED
Binary file
|
assets/lib/vegas/overlays/08.png
ADDED
Binary file
|
assets/lib/vegas/overlays/09.png
ADDED
Binary file
|
assets/lib/vegas/vegas.css
ADDED
@@ -0,0 +1,629 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
.vegas-wrapper,
|
2 |
+
.vegas-overlay,
|
3 |
+
.vegas-timer,
|
4 |
+
.vegas-slide,
|
5 |
+
.vegas-slide-inner {
|
6 |
+
position: absolute;
|
7 |
+
top: 0;
|
8 |
+
left: 0;
|
9 |
+
bottom: 0;
|
10 |
+
right: 0;
|
11 |
+
overflow: hidden;
|
12 |
+
border: none;
|
13 |
+
padding: 0;
|
14 |
+
margin: 0;
|
15 |
+
}
|
16 |
+
|
17 |
+
.vegas-overlay {
|
18 |
+
opacity: .5;
|
19 |
+
//background: transparent url("overlays/02.png") center center repeat;
|
20 |
+
}
|
21 |
+
|
22 |
+
.vegas-timer {
|
23 |
+
top: auto;
|
24 |
+
bottom: 0;
|
25 |
+
height: 2px;
|
26 |
+
}
|
27 |
+
|
28 |
+
.vegas-timer-progress {
|
29 |
+
width: 0%;
|
30 |
+
height: 100%;
|
31 |
+
background: white;
|
32 |
+
-webkit-transition: width ease-out;
|
33 |
+
transition: width ease-out;
|
34 |
+
}
|
35 |
+
|
36 |
+
.vegas-timer-running .vegas-timer-progress {
|
37 |
+
width: 100%;
|
38 |
+
}
|
39 |
+
|
40 |
+
.vegas-slide,
|
41 |
+
.vegas-slide-inner {
|
42 |
+
margin: 0;
|
43 |
+
padding: 0;
|
44 |
+
background: transparent center center no-repeat;
|
45 |
+
-webkit-transform: translateZ(0);
|
46 |
+
transform: translateZ(0);
|
47 |
+
will-change: transform, opacity;
|
48 |
+
}
|
49 |
+
|
50 |
+
body .vegas-container {
|
51 |
+
overflow: hidden !important;
|
52 |
+
position: relative;
|
53 |
+
}
|
54 |
+
|
55 |
+
.vegas-video {
|
56 |
+
min-width: 100%;
|
57 |
+
min-height: 100%;
|
58 |
+
width: auto;
|
59 |
+
height: auto;
|
60 |
+
}
|
61 |
+
|
62 |
+
body.vegas-container {
|
63 |
+
overflow: auto;
|
64 |
+
position: static;
|
65 |
+
z-index: -2;
|
66 |
+
}
|
67 |
+
|
68 |
+
body.vegas-container > .vegas-timer,
|
69 |
+
body.vegas-container > .vegas-overlay,
|
70 |
+
body.vegas-container > .vegas-slide {
|
71 |
+
position: fixed;
|
72 |
+
z-index: -1;
|
73 |
+
}
|
74 |
+
|
75 |
+
/* Target Safari IOS7+ in order to add 76px */
|
76 |
+
_::full-page-media, _:future,
|
77 |
+
:root body.vegas-container > .vegas-slide,
|
78 |
+
:root body.vegas-container > .vegas-overlay {
|
79 |
+
bottom: -76px;
|
80 |
+
}
|
81 |
+
|
82 |
+
/*******************************************/
|
83 |
+
/* blur transition */
|
84 |
+
/*******************************************/
|
85 |
+
.vegas-transition-blur,
|
86 |
+
.vegas-transition-blur2 {
|
87 |
+
opacity: 0;
|
88 |
+
-webkit-filter: blur(32px);
|
89 |
+
filter: blur(32px);
|
90 |
+
}
|
91 |
+
|
92 |
+
.vegas-transition-blur-in,
|
93 |
+
.vegas-transition-blur2-in {
|
94 |
+
opacity: 1;
|
95 |
+
-webkit-filter: blur(0px);
|
96 |
+
filter: blur(0px);
|
97 |
+
}
|
98 |
+
|
99 |
+
.vegas-transition-blur2-out {
|
100 |
+
opacity: 0;
|
101 |
+
}
|
102 |
+
|
103 |
+
/*******************************************/
|
104 |
+
/* burn transition */
|
105 |
+
/*******************************************/
|
106 |
+
.vegas-transition-burn,
|
107 |
+
.vegas-transition-burn2 {
|
108 |
+
opacity: 0;
|
109 |
+
-webkit-filter: contrast(1000%) saturate(1000%);
|
110 |
+
filter: contrast(1000%) saturate(1000%);
|
111 |
+
}
|
112 |
+
|
113 |
+
.vegas-transition-burn-in,
|
114 |
+
.vegas-transition-burn2-in {
|
115 |
+
opacity: 1;
|
116 |
+
-webkit-filter: contrast(100%) saturate(100%);
|
117 |
+
filter: contrast(100%) saturate(100%);
|
118 |
+
}
|
119 |
+
|
120 |
+
.vegas-transition-burn2-out {
|
121 |
+
opacity: 0;
|
122 |
+
-webkit-filter: contrast(1000%) saturate(1000%);
|
123 |
+
filter: contrast(1000%) saturate(1000%);
|
124 |
+
}
|
125 |
+
|
126 |
+
/*******************************************/
|
127 |
+
/* fade transition */
|
128 |
+
/*******************************************/
|
129 |
+
.vegas-transition-fade,
|
130 |
+
.vegas-transition-fade2 {
|
131 |
+
opacity: 0;
|
132 |
+
}
|
133 |
+
|
134 |
+
.vegas-transition-fade-in,
|
135 |
+
.vegas-transition-fade2-in {
|
136 |
+
opacity: 1;
|
137 |
+
}
|
138 |
+
|
139 |
+
.vegas-transition-fade2-out {
|
140 |
+
opacity: 0;
|
141 |
+
}
|
142 |
+
|
143 |
+
/*******************************************/
|
144 |
+
/* flash transition */
|
145 |
+
/*******************************************/
|
146 |
+
.vegas-transition-flash,
|
147 |
+
.vegas-transition-flash2 {
|
148 |
+
opacity: 0;
|
149 |
+
-webkit-filter: brightness(25);
|
150 |
+
filter: brightness(25);
|
151 |
+
}
|
152 |
+
|
153 |
+
.vegas-transition-flash-in,
|
154 |
+
.vegas-transition-flash2-in {
|
155 |
+
opacity: 1;
|
156 |
+
-webkit-filter: brightness(1);
|
157 |
+
filter: brightness(1);
|
158 |
+
}
|
159 |
+
|
160 |
+
.vegas-transition-flash2-out {
|
161 |
+
opacity: 0;
|
162 |
+
-webkit-filter: brightness(25);
|
163 |
+
filter: brightness(25);
|
164 |
+
}
|
165 |
+
|
166 |
+
/*******************************************/
|
167 |
+
/* negative transition */
|
168 |
+
/*******************************************/
|
169 |
+
.vegas-transition-negative,
|
170 |
+
.vegas-transition-negative2 {
|
171 |
+
opacity: 0;
|
172 |
+
-webkit-filter: invert(100%);
|
173 |
+
filter: invert(100%);
|
174 |
+
}
|
175 |
+
|
176 |
+
.vegas-transition-negative-in,
|
177 |
+
.vegas-transition-negative2-in {
|
178 |
+
opacity: 1;
|
179 |
+
-webkit-filter: invert(0);
|
180 |
+
filter: invert(0);
|
181 |
+
}
|
182 |
+
|
183 |
+
.vegas-transition-negative2-out {
|
184 |
+
opacity: 0;
|
185 |
+
-webkit-filter: invert(100%);
|
186 |
+
filter: invert(100%);
|
187 |
+
}
|
188 |
+
|
189 |
+
/*******************************************/
|
190 |
+
/* slideDown transition */
|
191 |
+
/*******************************************/
|
192 |
+
.vegas-transition-slideDown,
|
193 |
+
.vegas-transition-slideDown2 {
|
194 |
+
-webkit-transform: translateY(-100%);
|
195 |
+
transform: translateY(-100%);
|
196 |
+
}
|
197 |
+
|
198 |
+
.vegas-transition-slideDown-in,
|
199 |
+
.vegas-transition-slideDown2-in {
|
200 |
+
-webkit-transform: translateY(0%);
|
201 |
+
transform: translateY(0%);
|
202 |
+
}
|
203 |
+
|
204 |
+
.vegas-transition-slideDown2-out {
|
205 |
+
-webkit-transform: translateY(100%);
|
206 |
+
transform: translateY(100%);
|
207 |
+
}
|
208 |
+
|
209 |
+
/*******************************************/
|
210 |
+
/* slideLeft transition */
|
211 |
+
/*******************************************/
|
212 |
+
.vegas-transition-slideLeft,
|
213 |
+
.vegas-transition-slideLeft2 {
|
214 |
+
-webkit-transform: translateX(100%);
|
215 |
+
transform: translateX(100%);
|
216 |
+
}
|
217 |
+
|
218 |
+
.vegas-transition-slideLeft-in,
|
219 |
+
.vegas-transition-slideLeft2-in {
|
220 |
+
-webkit-transform: translateX(0%);
|
221 |
+
transform: translateX(0%);
|
222 |
+
}
|
223 |
+
|
224 |
+
.vegas-transition-slideLeft2-out {
|
225 |
+
-webkit-transform: translateX(-100%);
|
226 |
+
transform: translateX(-100%);
|
227 |
+
}
|
228 |
+
|
229 |
+
/*******************************************/
|
230 |
+
/* slideRight transition */
|
231 |
+
/*******************************************/
|
232 |
+
.vegas-transition-slideRight,
|
233 |
+
.vegas-transition-slideRight2 {
|
234 |
+
-webkit-transform: translateX(-100%);
|
235 |
+
transform: translateX(-100%);
|
236 |
+
}
|
237 |
+
|
238 |
+
.vegas-transition-slideRight-in,
|
239 |
+
.vegas-transition-slideRight2-in {
|
240 |
+
-webkit-transform: translateX(0%);
|
241 |
+
transform: translateX(0%);
|
242 |
+
}
|
243 |
+
|
244 |
+
.vegas-transition-slideRight2-out {
|
245 |
+
-webkit-transform: translateX(100%);
|
246 |
+
transform: translateX(100%);
|
247 |
+
}
|
248 |
+
|
249 |
+
/*******************************************/
|
250 |
+
/* slideUp transition */
|
251 |
+
/*******************************************/
|
252 |
+
.vegas-transition-slideUp,
|
253 |
+
.vegas-transition-slideUp2 {
|
254 |
+
-webkit-transform: translateY(100%);
|
255 |
+
transform: translateY(100%);
|
256 |
+
}
|
257 |
+
|
258 |
+
.vegas-transition-slideUp-in,
|
259 |
+
.vegas-transition-slideUp2-in {
|
260 |
+
-webkit-transform: translateY(0%);
|
261 |
+
transform: translateY(0%);
|
262 |
+
}
|
263 |
+
|
264 |
+
.vegas-transition-slideUp2-out {
|
265 |
+
-webkit-transform: translateY(-100%);
|
266 |
+
transform: translateY(-100%);
|
267 |
+
}
|
268 |
+
|
269 |
+
/*******************************************/
|
270 |
+
/* swirlLeft transition */
|
271 |
+
/*******************************************/
|
272 |
+
.vegas-transition-swirlLeft,
|
273 |
+
.vegas-transition-swirlLeft2 {
|
274 |
+
-webkit-transform: scale(2) rotate(35deg);
|
275 |
+
transform: scale(2) rotate(35deg);
|
276 |
+
opacity: 0;
|
277 |
+
}
|
278 |
+
|
279 |
+
.vegas-transition-swirlLeft-in,
|
280 |
+
.vegas-transition-swirlLeft2-in {
|
281 |
+
-webkit-transform: scale(1) rotate(0deg);
|
282 |
+
transform: scale(1) rotate(0deg);
|
283 |
+
opacity: 1;
|
284 |
+
}
|
285 |
+
|
286 |
+
.vegas-transition-swirlLeft2-out {
|
287 |
+
-webkit-transform: scale(2) rotate(-35deg);
|
288 |
+
transform: scale(2) rotate(-35deg);
|
289 |
+
opacity: 0;
|
290 |
+
}
|
291 |
+
|
292 |
+
/*******************************************/
|
293 |
+
/* swirlRight transition */
|
294 |
+
/*******************************************/
|
295 |
+
.vegas-transition-swirlRight,
|
296 |
+
.vegas-transition-swirlRight2 {
|
297 |
+
-webkit-transform: scale(2) rotate(-35deg);
|
298 |
+
transform: scale(2) rotate(-35deg);
|
299 |
+
opacity: 0;
|
300 |
+
}
|
301 |
+
|
302 |
+
.vegas-transition-swirlRight-in,
|
303 |
+
.vegas-transition-swirlRight2-in {
|
304 |
+
-webkit-transform: scale(1) rotate(0deg);
|
305 |
+
transform: scale(1) rotate(0deg);
|
306 |
+
opacity: 1;
|
307 |
+
}
|
308 |
+
|
309 |
+
.vegas-transition-swirlRight2-out {
|
310 |
+
-webkit-transform: scale(2) rotate(35deg);
|
311 |
+
transform: scale(2) rotate(35deg);
|
312 |
+
opacity: 0;
|
313 |
+
}
|
314 |
+
|
315 |
+
/*******************************************/
|
316 |
+
/* zoomIn transition */
|
317 |
+
/*******************************************/
|
318 |
+
.vegas-transition-zoomIn,
|
319 |
+
.vegas-transition-zoomIn2 {
|
320 |
+
-webkit-transform: scale(0);
|
321 |
+
transform: scale(0);
|
322 |
+
opacity: 0;
|
323 |
+
}
|
324 |
+
|
325 |
+
.vegas-transition-zoomIn-in,
|
326 |
+
.vegas-transition-zoomIn2-in {
|
327 |
+
-webkit-transform: scale(1);
|
328 |
+
transform: scale(1);
|
329 |
+
opacity: 1;
|
330 |
+
}
|
331 |
+
|
332 |
+
.vegas-transition-zoomIn2-out {
|
333 |
+
-webkit-transform: scale(2);
|
334 |
+
transform: scale(2);
|
335 |
+
opacity: 0;
|
336 |
+
}
|
337 |
+
|
338 |
+
/*******************************************/
|
339 |
+
/* zoomOut transition */
|
340 |
+
/*******************************************/
|
341 |
+
.vegas-transition-zoomOut,
|
342 |
+
.vegas-transition-zoomOut2 {
|
343 |
+
-webkit-transform: scale(2);
|
344 |
+
transform: scale(2);
|
345 |
+
opacity: 0;
|
346 |
+
}
|
347 |
+
|
348 |
+
.vegas-transition-zoomOut-in,
|
349 |
+
.vegas-transition-zoomOut2-in {
|
350 |
+
-webkit-transform: scale(1);
|
351 |
+
transform: scale(1);
|
352 |
+
opacity: 1;
|
353 |
+
}
|
354 |
+
|
355 |
+
.vegas-transition-zoomOut2-out {
|
356 |
+
-webkit-transform: scale(0);
|
357 |
+
transform: scale(0);
|
358 |
+
opacity: 0;
|
359 |
+
}
|
360 |
+
|
361 |
+
/*******************************************/
|
362 |
+
/* kenburns animation */
|
363 |
+
/*******************************************/
|
364 |
+
.vegas-animation-kenburns {
|
365 |
+
-webkit-animation: kenburns ease-out;
|
366 |
+
animation: kenburns ease-out;
|
367 |
+
}
|
368 |
+
|
369 |
+
@-webkit-keyframes kenburns {
|
370 |
+
0% {
|
371 |
+
-webkit-transform: scale(1.5);
|
372 |
+
transform: scale(1.5);
|
373 |
+
}
|
374 |
+
100% {
|
375 |
+
-webkit-transform: scale(1);
|
376 |
+
transform: scale(1);
|
377 |
+
}
|
378 |
+
}
|
379 |
+
|
380 |
+
@keyframes kenburns {
|
381 |
+
0% {
|
382 |
+
-webkit-transform: scale(1.5);
|
383 |
+
transform: scale(1.5);
|
384 |
+
}
|
385 |
+
100% {
|
386 |
+
-webkit-transform: scale(1);
|
387 |
+
transform: scale(1);
|
388 |
+
}
|
389 |
+
}
|
390 |
+
|
391 |
+
/*******************************************/
|
392 |
+
/* kenburnsDownLeft animation */
|
393 |
+
/*******************************************/
|
394 |
+
.vegas-animation-kenburnsDownLeft {
|
395 |
+
-webkit-animation: kenburnsDownLeft ease-out;
|
396 |
+
animation: kenburnsDownLeft ease-out;
|
397 |
+
}
|
398 |
+
|
399 |
+
@-webkit-keyframes kenburnsDownLeft {
|
400 |
+
0% {
|
401 |
+
-webkit-transform: scale(1.5) translate(10%, -10%);
|
402 |
+
transform: scale(1.5) translate(10%, -10%);
|
403 |
+
}
|
404 |
+
100% {
|
405 |
+
-webkit-transform: scale(1) translate(0, 0);
|
406 |
+
transform: scale(1) translate(0, 0);
|
407 |
+
}
|
408 |
+
}
|
409 |
+
|
410 |
+
@keyframes kenburnsDownLeft {
|
411 |
+
0% {
|
412 |
+
-webkit-transform: scale(1.5) translate(10%, -10%);
|
413 |
+
transform: scale(1.5) translate(10%, -10%);
|
414 |
+
}
|
415 |
+
100% {
|
416 |
+
-webkit-transform: scale(1) translate(0, 0);
|
417 |
+
transform: scale(1) translate(0, 0);
|
418 |
+
}
|
419 |
+
}
|
420 |
+
|
421 |
+
/*******************************************/
|
422 |
+
/* kenburnsDownRight animation */
|
423 |
+
/*******************************************/
|
424 |
+
.vegas-animation-kenburnsDownRight {
|
425 |
+
-webkit-animation: kenburnsDownRight ease-out;
|
426 |
+
animation: kenburnsDownRight ease-out;
|
427 |
+
}
|
428 |
+
|
429 |
+
@-webkit-keyframes kenburnsDownRight {
|
430 |
+
0% {
|
431 |
+
-webkit-transform: scale(1.5) translate(-10%, -10%);
|
432 |
+
transform: scale(1.5) translate(-10%, -10%);
|
433 |
+
}
|
434 |
+
100% {
|
435 |
+
-webkit-transform: scale(1) translate(0, 0);
|
436 |
+
transform: scale(1) translate(0, 0);
|
437 |
+
}
|
438 |
+
}
|
439 |
+
|
440 |
+
@keyframes kenburnsDownRight {
|
441 |
+
0% {
|
442 |
+
-webkit-transform: scale(1.5) translate(-10%, -10%);
|
443 |
+
transform: scale(1.5) translate(-10%, -10%);
|
444 |
+
}
|
445 |
+
100% {
|
446 |
+
-webkit-transform: scale(1) translate(0, 0);
|
447 |
+
transform: scale(1) translate(0, 0);
|
448 |
+
}
|
449 |
+
}
|
450 |
+
|
451 |
+
/*******************************************/
|
452 |
+
/* kenburnsDown animation */
|
453 |
+
/*******************************************/
|
454 |
+
.vegas-animation-kenburnsDown {
|
455 |
+
-webkit-animation: kenburnsDown ease-out;
|
456 |
+
animation: kenburnsDown ease-out;
|
457 |
+
}
|
458 |
+
|
459 |
+
@-webkit-keyframes kenburnsDown {
|
460 |
+
0% {
|
461 |
+
-webkit-transform: scale(1.5) translate(0, -10%);
|
462 |
+
transform: scale(1.5) translate(0, -10%);
|
463 |
+
}
|
464 |
+
100% {
|
465 |
+
-webkit-transform: scale(1) translate(0, 0);
|
466 |
+
transform: scale(1) translate(0, 0);
|
467 |
+
}
|
468 |
+
}
|
469 |
+
|
470 |
+
@keyframes kenburnsDown {
|
471 |
+
0% {
|
472 |
+
-webkit-transform: scale(1.5) translate(0, -10%);
|
473 |
+
transform: scale(1.5) translate(0, -10%);
|
474 |
+
}
|
475 |
+
100% {
|
476 |
+
-webkit-transform: scale(1) translate(0, 0);
|
477 |
+
transform: scale(1) translate(0, 0);
|
478 |
+
}
|
479 |
+
}
|
480 |
+
|
481 |
+
/*******************************************/
|
482 |
+
/* kenburnsLeft animation */
|
483 |
+
/*******************************************/
|
484 |
+
.vegas-animation-kenburnsLeft {
|
485 |
+
-webkit-animation: kenburnsLeft ease-out;
|
486 |
+
animation: kenburnsLeft ease-out;
|
487 |
+
}
|
488 |
+
|
489 |
+
@-webkit-keyframes kenburnsLeft {
|
490 |
+
0% {
|
491 |
+
-webkit-transform: scale(1.5) translate(10%, 0);
|
492 |
+
transform: scale(1.5) translate(10%, 0);
|
493 |
+
}
|
494 |
+
100% {
|
495 |
+
-webkit-transform: scale(1) translate(0, 0);
|
496 |
+
transform: scale(1) translate(0, 0);
|
497 |
+
}
|
498 |
+
}
|
499 |
+
|
500 |
+
@keyframes kenburnsLeft {
|
501 |
+
0% {
|
502 |
+
-webkit-transform: scale(1.5) translate(10%, 0);
|
503 |
+
transform: scale(1.5) translate(10%, 0);
|
504 |
+
}
|
505 |
+
100% {
|
506 |
+
-webkit-transform: scale(1) translate(0, 0);
|
507 |
+
transform: scale(1) translate(0, 0);
|
508 |
+
}
|
509 |
+
}
|
510 |
+
|
511 |
+
/*******************************************/
|
512 |
+
/* kenburnsRight animation */
|
513 |
+
/*******************************************/
|
514 |
+
.vegas-animation-kenburnsRight {
|
515 |
+
-webkit-animation: kenburnsRight ease-out;
|
516 |
+
animation: kenburnsRight ease-out;
|
517 |
+
}
|
518 |
+
|
519 |
+
@-webkit-keyframes kenburnsRight {
|
520 |
+
0% {
|
521 |
+
-webkit-transform: scale(1.5) translate(-10%, 0);
|
522 |
+
transform: scale(1.5) translate(-10%, 0);
|
523 |
+
}
|
524 |
+
100% {
|
525 |
+
-webkit-transform: scale(1) translate(0, 0);
|
526 |
+
transform: scale(1) translate(0, 0);
|
527 |
+
}
|
528 |
+
}
|
529 |
+
|
530 |
+
@keyframes kenburnsRight {
|
531 |
+
0% {
|
532 |
+
-webkit-transform: scale(1.5) translate(-10%, 0);
|
533 |
+
transform: scale(1.5) translate(-10%, 0);
|
534 |
+
}
|
535 |
+
100% {
|
536 |
+
-webkit-transform: scale(1) translate(0, 0);
|
537 |
+
transform: scale(1) translate(0, 0);
|
538 |
+
}
|
539 |
+
}
|
540 |
+
|
541 |
+
/*******************************************/
|
542 |
+
/* kenburnsUpLeft animation */
|
543 |
+
/*******************************************/
|
544 |
+
.vegas-animation-kenburnsUpLeft {
|
545 |
+
-webkit-animation: kenburnsUpLeft ease-out;
|
546 |
+
animation: kenburnsUpLeft ease-out;
|
547 |
+
}
|
548 |
+
|
549 |
+
@-webkit-keyframes kenburnsUpLeft {
|
550 |
+
0% {
|
551 |
+
-webkit-transform: scale(1.5) translate(10%, 10%);
|
552 |
+
transform: scale(1.5) translate(10%, 10%);
|
553 |
+
}
|
554 |
+
100% {
|
555 |
+
-webkit-transform: scale(1) translate(0, 0);
|
556 |
+
transform: scale(1) translate(0, 0);
|
557 |
+
}
|
558 |
+
}
|
559 |
+
|
560 |
+
@keyframes kenburnsUpLeft {
|
561 |
+
0% {
|
562 |
+
-webkit-transform: scale(1.5) translate(10%, 10%);
|
563 |
+
transform: scale(1.5) translate(10%, 10%);
|
564 |
+
}
|
565 |
+
100% {
|
566 |
+
-webkit-transform: scale(1) translate(0, 0);
|
567 |
+
transform: scale(1) translate(0, 0);
|
568 |
+
}
|
569 |
+
}
|
570 |
+
|
571 |
+
/*******************************************/
|
572 |
+
/* kenburnsUpRight animation */
|
573 |
+
/*******************************************/
|
574 |
+
.vegas-animation-kenburnsUpRight {
|
575 |
+
-webkit-animation: kenburnsUpRight ease-out;
|
576 |
+
animation: kenburnsUpRight ease-out;
|
577 |
+
}
|
578 |
+
|
579 |
+
@-webkit-keyframes kenburnsUpRight {
|
580 |
+
0% {
|
581 |
+
-webkit-transform: scale(1.5) translate(-10%, 10%);
|
582 |
+
transform: scale(1.5) translate(-10%, 10%);
|
583 |
+
}
|
584 |
+
100% {
|
585 |
+
-webkit-transform: scale(1) translate(0, 0);
|
586 |
+
transform: scale(1) translate(0, 0);
|
587 |
+
}
|
588 |
+
}
|
589 |
+
|
590 |
+
@keyframes kenburnsUpRight {
|
591 |
+
0% {
|
592 |
+
-webkit-transform: scale(1.5) translate(-10%, 10%);
|
593 |
+
transform: scale(1.5) translate(-10%, 10%);
|
594 |
+
}
|
595 |
+
100% {
|
596 |
+
-webkit-transform: scale(1) translate(0, 0);
|
597 |
+
transform: scale(1) translate(0, 0);
|
598 |
+
}
|
599 |
+
}
|
600 |
+
|
601 |
+
/*******************************************/
|
602 |
+
/* kenburnsUp animation */
|
603 |
+
/*******************************************/
|
604 |
+
.vegas-animation-kenburnsUp {
|
605 |
+
-webkit-animation: kenburnsUp ease-out;
|
606 |
+
animation: kenburnsUp ease-out;
|
607 |
+
}
|
608 |
+
|
609 |
+
@-webkit-keyframes kenburnsUp {
|
610 |
+
0% {
|
611 |
+
-webkit-transform: scale(1.5) translate(0, 10%);
|
612 |
+
transform: scale(1.5) translate(0, 10%);
|
613 |
+
}
|
614 |
+
100% {
|
615 |
+
-webkit-transform: scale(1) translate(0, 0);
|
616 |
+
transform: scale(1) translate(0, 0);
|
617 |
+
}
|
618 |
+
}
|
619 |
+
|
620 |
+
@keyframes kenburnsUp {
|
621 |
+
0% {
|
622 |
+
-webkit-transform: scale(1.5) translate(0, 10%);
|
623 |
+
transform: scale(1.5) translate(0, 10%);
|
624 |
+
}
|
625 |
+
100% {
|
626 |
+
-webkit-transform: scale(1) translate(0, 0);
|
627 |
+
transform: scale(1) translate(0, 0);
|
628 |
+
}
|
629 |
+
}
|
assets/lib/vegas/vegas.js
ADDED
@@ -0,0 +1,747 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
/*!-----------------------------------------------------------------------------
|
2 |
+
* Vegas - Fullscreen Backgrounds and Slideshows.
|
3 |
+
* v2.4.0 - built 2017-01-04
|
4 |
+
* Licensed under the MIT License.
|
5 |
+
* http://vegas.jaysalvat.com/
|
6 |
+
* ----------------------------------------------------------------------------
|
7 |
+
* Copyright (C) 2010-2017 Jay Salvat
|
8 |
+
* http://jaysalvat.com/
|
9 |
+
* --------------------------------------------------------------------------*/
|
10 |
+
|
11 |
+
(function ($) {
|
12 |
+
'use strict';
|
13 |
+
|
14 |
+
var defaults = {
|
15 |
+
slide: 0,
|
16 |
+
delay: 5000,
|
17 |
+
loop: true,
|
18 |
+
preload: false,
|
19 |
+
preloadImage: false,
|
20 |
+
preloadVideo: false,
|
21 |
+
timer: true,
|
22 |
+
overlay: false,
|
23 |
+
autoplay: true,
|
24 |
+
shuffle: false,
|
25 |
+
cover: true,
|
26 |
+
color: null,
|
27 |
+
align: 'center',
|
28 |
+
valign: 'center',
|
29 |
+
firstTransition: null,
|
30 |
+
firstTransitionDuration: null,
|
31 |
+
transition: 'fade',
|
32 |
+
transitionDuration: 1000,
|
33 |
+
transitionRegister: [],
|
34 |
+
animation: null,
|
35 |
+
animationDuration: 'auto',
|
36 |
+
animationRegister: [],
|
37 |
+
slidesToKeep: 1,
|
38 |
+
init: function () {},
|
39 |
+
play: function () {},
|
40 |
+
pause: function () {},
|
41 |
+
walk: function () {},
|
42 |
+
slides: [
|
43 |
+
// {
|
44 |
+
// src: null,
|
45 |
+
// color: null,
|
46 |
+
// delay: null,
|
47 |
+
// align: null,
|
48 |
+
// valign: null,
|
49 |
+
// transition: null,
|
50 |
+
// transitionDuration: null,
|
51 |
+
// animation: null,
|
52 |
+
// animationDuration: null,
|
53 |
+
// cover: true,
|
54 |
+
// video: {
|
55 |
+
// src: [],
|
56 |
+
// mute: true,
|
57 |
+
// loop: true
|
58 |
+
// }
|
59 |
+
// ...
|
60 |
+
]
|
61 |
+
};
|
62 |
+
|
63 |
+
var videoCache = {};
|
64 |
+
|
65 |
+
var Vegas = function (elmt, options) {
|
66 |
+
this.elmt = elmt;
|
67 |
+
this.settings = $.extend({}, defaults, $.vegas.defaults, options);
|
68 |
+
this.slide = this.settings.slide;
|
69 |
+
this.total = this.settings.slides.length;
|
70 |
+
this.noshow = this.total < 2;
|
71 |
+
this.paused = !this.settings.autoplay || this.noshow;
|
72 |
+
this.ended = false;
|
73 |
+
this.$elmt = $(elmt);
|
74 |
+
this.$timer = null;
|
75 |
+
this.$overlay = null;
|
76 |
+
this.$slide = null;
|
77 |
+
this.timeout = null;
|
78 |
+
this.first = true;
|
79 |
+
|
80 |
+
this.transitions = [
|
81 |
+
'fade', 'fade2',
|
82 |
+
'blur', 'blur2',
|
83 |
+
'flash', 'flash2',
|
84 |
+
'negative', 'negative2',
|
85 |
+
'burn', 'burn2',
|
86 |
+
'slideLeft', 'slideLeft2',
|
87 |
+
'slideRight', 'slideRight2',
|
88 |
+
'slideUp', 'slideUp2',
|
89 |
+
'slideDown', 'slideDown2',
|
90 |
+
'zoomIn', 'zoomIn2',
|
91 |
+
'zoomOut', 'zoomOut2',
|
92 |
+
'swirlLeft', 'swirlLeft2',
|
93 |
+
'swirlRight', 'swirlRight2'
|
94 |
+
];
|
95 |
+
|
96 |
+
this.animations = [
|
97 |
+
'kenburns',
|
98 |
+
'kenburnsLeft', 'kenburnsRight',
|
99 |
+
'kenburnsUp', 'kenburnsUpLeft', 'kenburnsUpRight',
|
100 |
+
'kenburnsDown', 'kenburnsDownLeft', 'kenburnsDownRight'
|
101 |
+
];
|
102 |
+
|
103 |
+
if (this.settings.transitionRegister instanceof Array === false) {
|
104 |
+
this.settings.transitionRegister = [ this.settings.transitionRegister ];
|
105 |
+
}
|
106 |
+
|
107 |
+
if (this.settings.animationRegister instanceof Array === false) {
|
108 |
+
this.settings.animationRegister = [ this.settings.animationRegister ];
|
109 |
+
}
|
110 |
+
|
111 |
+
this.transitions = this.transitions.concat(this.settings.transitionRegister);
|
112 |
+
this.animations = this.animations.concat(this.settings.animationRegister);
|
113 |
+
|
114 |
+
this.support = {
|
115 |
+
objectFit: 'objectFit' in document.body.style,
|
116 |
+
transition: 'transition' in document.body.style || 'WebkitTransition' in document.body.style,
|
117 |
+
video: $.vegas.isVideoCompatible()
|
118 |
+
};
|
119 |
+
|
120 |
+
if (this.settings.shuffle === true) {
|
121 |
+
this.shuffle();
|
122 |
+
}
|
123 |
+
|
124 |
+
this._init();
|
125 |
+
};
|
126 |
+
|
127 |
+
Vegas.prototype = {
|
128 |
+
_init: function () {
|
129 |
+
var $wrapper,
|
130 |
+
$overlay,
|
131 |
+
$timer,
|
132 |
+
isBody = this.elmt.tagName === 'BODY',
|
133 |
+
timer = this.settings.timer,
|
134 |
+
overlay = this.settings.overlay,
|
135 |
+
self = this;
|
136 |
+
|
137 |
+
// Preloading
|
138 |
+
this._preload();
|
139 |
+
|
140 |
+
// Wrapper with content
|
141 |
+
if (!isBody) {
|
142 |
+
this.$elmt.css('height', this.$elmt.css('height'));
|
143 |
+
|
144 |
+
$wrapper = $('<div class="vegas-wrapper">')
|
145 |
+
.css('overflow', this.$elmt.css('overflow'))
|
146 |
+
.css('padding', this.$elmt.css('padding'));
|
147 |
+
|
148 |
+
// Some browsers don't compute padding shorthand
|
149 |
+
if (!this.$elmt.css('padding')) {
|
150 |
+
$wrapper
|
151 |
+
.css('padding-top', this.$elmt.css('padding-top'))
|
152 |
+
.css('padding-bottom', this.$elmt.css('padding-bottom'))
|
153 |
+
.css('padding-left', this.$elmt.css('padding-left'))
|
154 |
+
.css('padding-right', this.$elmt.css('padding-right'));
|
155 |
+
}
|
156 |
+
|
157 |
+
this.$elmt.clone(true).children().appendTo($wrapper);
|
158 |
+
this.elmt.innerHTML = '';
|
159 |
+
}
|
160 |
+
|
161 |
+
// Timer
|
162 |
+
if (timer && this.support.transition) {
|
163 |
+
$timer = $('<div class="vegas-timer"><div class="vegas-timer-progress">');
|
164 |
+
this.$timer = $timer;
|
165 |
+
this.$elmt.prepend($timer);
|
166 |
+
}
|
167 |
+
|
168 |
+
// Overlay
|
169 |
+
if (overlay) {
|
170 |
+
$overlay = $('<div class="vegas-overlay">');
|
171 |
+
|
172 |
+
if (typeof overlay === 'string') {
|
173 |
+
$overlay.css('background-image', 'url(' + overlay + ')');
|
174 |
+
}
|
175 |
+
|
176 |
+
this.$overlay = $overlay;
|
177 |
+
this.$elmt.prepend($overlay);
|
178 |
+
}
|
179 |
+
|
180 |
+
// Container
|
181 |
+
this.$elmt.addClass('vegas-container');
|
182 |
+
|
183 |
+
if (!isBody) {
|
184 |
+
this.$elmt.append($wrapper);
|
185 |
+
}
|
186 |
+
|
187 |
+
setTimeout(function () {
|
188 |
+
self.trigger('init');
|
189 |
+
self._goto(self.slide);
|
190 |
+
|
191 |
+
if (self.settings.autoplay) {
|
192 |
+
self.trigger('play');
|
193 |
+
}
|
194 |
+
}, 1);
|
195 |
+
},
|
196 |
+
|
197 |
+
_preload: function () {
|
198 |
+
var img, i;
|
199 |
+
|
200 |
+
for (i = 0; i < this.settings.slides.length; i++) {
|
201 |
+
if (this.settings.preload || this.settings.preloadImages) {
|
202 |
+
if (this.settings.slides[i].src) {
|
203 |
+
img = new Image();
|
204 |
+
img.src = this.settings.slides[i].src;
|
205 |
+
}
|
206 |
+
}
|
207 |
+
|
208 |
+
if (this.settings.preload || this.settings.preloadVideos) {
|
209 |
+
if (this.support.video && this.settings.slides[i].video) {
|
210 |
+
if (this.settings.slides[i].video instanceof Array) {
|
211 |
+
this._video(this.settings.slides[i].video);
|
212 |
+
} else {
|
213 |
+
this._video(this.settings.slides[i].video.src);
|
214 |
+
}
|
215 |
+
}
|
216 |
+
}
|
217 |
+
}
|
218 |
+
},
|
219 |
+
|
220 |
+
_random: function (array) {
|
221 |
+
return array[Math.floor(Math.random() * array.length)];
|
222 |
+
},
|
223 |
+
|
224 |
+
_slideShow: function () {
|
225 |
+
var self = this;
|
226 |
+
|
227 |
+
if (this.total > 1 && !this.ended && !this.paused && !this.noshow) {
|
228 |
+
this.timeout = setTimeout(function () {
|
229 |
+
self.next();
|
230 |
+
}, this._options('delay'));
|
231 |
+
}
|
232 |
+
},
|
233 |
+
|
234 |
+
_timer: function (state) {
|
235 |
+
var self = this;
|
236 |
+
|
237 |
+
clearTimeout(this.timeout);
|
238 |
+
|
239 |
+
if (!this.$timer) {
|
240 |
+
return;
|
241 |
+
}
|
242 |
+
|
243 |
+
this.$timer
|
244 |
+
.removeClass('vegas-timer-running')
|
245 |
+
.find('div')
|
246 |
+
.css('transition-duration', '0ms');
|
247 |
+
|
248 |
+
if (this.ended || this.paused || this.noshow) {
|
249 |
+
return;
|
250 |
+
}
|
251 |
+
|
252 |
+
if (state) {
|
253 |
+
setTimeout(function () {
|
254 |
+
self.$timer
|
255 |
+
.addClass('vegas-timer-running')
|
256 |
+
.find('div')
|
257 |
+
.css('transition-duration', self._options('delay') - 100 + 'ms');
|
258 |
+
}, 100);
|
259 |
+
}
|
260 |
+
},
|
261 |
+
|
262 |
+
_video: function (srcs) {
|
263 |
+
var video,
|
264 |
+
source,
|
265 |
+
cacheKey = srcs.toString();
|
266 |
+
|
267 |
+
if (videoCache[cacheKey]) {
|
268 |
+
return videoCache[cacheKey];
|
269 |
+
}
|
270 |
+
|
271 |
+
if (srcs instanceof Array === false) {
|
272 |
+
srcs = [ srcs ];
|
273 |
+
}
|
274 |
+
|
275 |
+
video = document.createElement('video');
|
276 |
+
video.preload = true;
|
277 |
+
|
278 |
+
srcs.forEach(function (src) {
|
279 |
+
source = document.createElement('source');
|
280 |
+
source.src = src;
|
281 |
+
video.appendChild(source);
|
282 |
+
});
|
283 |
+
|
284 |
+
videoCache[cacheKey] = video;
|
285 |
+
|
286 |
+
return video;
|
287 |
+
},
|
288 |
+
|
289 |
+
_fadeOutSound: function (video, duration) {
|
290 |
+
var self = this,
|
291 |
+
delay = duration / 10,
|
292 |
+
volume = video.volume - 0.09;
|
293 |
+
|
294 |
+
if (volume > 0) {
|
295 |
+
video.volume = volume;
|
296 |
+
|
297 |
+
setTimeout(function () {
|
298 |
+
self._fadeOutSound(video, duration);
|
299 |
+
}, delay);
|
300 |
+
} else {
|
301 |
+
video.pause();
|
302 |
+
}
|
303 |
+
},
|
304 |
+
|
305 |
+
_fadeInSound: function (video, duration) {
|
306 |
+
var self = this,
|
307 |
+
delay = duration / 10,
|
308 |
+
volume = video.volume + 0.09;
|
309 |
+
|
310 |
+
if (volume < 1) {
|
311 |
+
video.volume = volume;
|
312 |
+
|
313 |
+
setTimeout(function () {
|
314 |
+
self._fadeInSound(video, duration);
|
315 |
+
}, delay);
|
316 |
+
}
|
317 |
+
},
|
318 |
+
|
319 |
+
_options: function (key, i) {
|
320 |
+
if (i === undefined) {
|
321 |
+
i = this.slide;
|
322 |
+
}
|
323 |
+
|
324 |
+
if (this.settings.slides[i][key] !== undefined) {
|
325 |
+
return this.settings.slides[i][key];
|
326 |
+
}
|
327 |
+
|
328 |
+
return this.settings[key];
|
329 |
+
},
|
330 |
+
|
331 |
+
_goto: function (nb) {
|
332 |
+
if (typeof this.settings.slides[nb] === 'undefined') {
|
333 |
+
nb = 0;
|
334 |
+
}
|
335 |
+
|
336 |
+
this.slide = nb;
|
337 |
+
|
338 |
+
var $slide,
|
339 |
+
$inner,
|
340 |
+
$video,
|
341 |
+
$slides = this.$elmt.children('.vegas-slide'),
|
342 |
+
src = this.settings.slides[nb].src,
|
343 |
+
videoSettings = this.settings.slides[nb].video,
|
344 |
+
delay = this._options('delay'),
|
345 |
+
align = this._options('align'),
|
346 |
+
valign = this._options('valign'),
|
347 |
+
cover = this._options('cover'),
|
348 |
+
color = this._options('color') || this.$elmt.css('background-color'),
|
349 |
+
self = this,
|
350 |
+
total = $slides.length,
|
351 |
+
video,
|
352 |
+
img;
|
353 |
+
|
354 |
+
var transition = this._options('transition'),
|
355 |
+
transitionDuration = this._options('transitionDuration'),
|
356 |
+
animation = this._options('animation'),
|
357 |
+
animationDuration = this._options('animationDuration');
|
358 |
+
|
359 |
+
if (this.settings.firstTransition && this.first) {
|
360 |
+
transition = this.settings.firstTransition || transition;
|
361 |
+
}
|
362 |
+
|
363 |
+
if (this.settings.firstTransitionDuration && this.first) {
|
364 |
+
transitionDuration = this.settings.firstTransitionDuration || transitionDuration;
|
365 |
+
}
|
366 |
+
|
367 |
+
if (this.first) {
|
368 |
+
this.first = false;
|
369 |
+
}
|
370 |
+
|
371 |
+
if (cover !== 'repeat') {
|
372 |
+
if (cover === true) {
|
373 |
+
cover = 'cover';
|
374 |
+
} else if (cover === false) {
|
375 |
+
cover = 'contain';
|
376 |
+
}
|
377 |
+
}
|
378 |
+
|
379 |
+
if (transition === 'random' || transition instanceof Array) {
|
380 |
+
if (transition instanceof Array) {
|
381 |
+
transition = this._random(transition);
|
382 |
+
} else {
|
383 |
+
transition = this._random(this.transitions);
|
384 |
+
}
|
385 |
+
}
|
386 |
+
|
387 |
+
if (animation === 'random' || animation instanceof Array) {
|
388 |
+
if (animation instanceof Array) {
|
389 |
+
animation = this._random(animation);
|
390 |
+
} else {
|
391 |
+
animation = this._random(this.animations);
|
392 |
+
}
|
393 |
+
}
|
394 |
+
|
395 |
+
if (transitionDuration === 'auto' || transitionDuration > delay) {
|
396 |
+
transitionDuration = delay;
|
397 |
+
}
|
398 |
+
|
399 |
+
if (animationDuration === 'auto') {
|
400 |
+
animationDuration = delay;
|
401 |
+
}
|
402 |
+
|
403 |
+
$slide = $('<div class="vegas-slide"></div>');
|
404 |
+
|
405 |
+
if (this.support.transition && transition) {
|
406 |
+
$slide.addClass('vegas-transition-' + transition);
|
407 |
+
}
|
408 |
+
|
409 |
+
// Video
|
410 |
+
|
411 |
+
if (this.support.video && videoSettings) {
|
412 |
+
if (videoSettings instanceof Array) {
|
413 |
+
video = this._video(videoSettings);
|
414 |
+
} else {
|
415 |
+
video = this._video(videoSettings.src);
|
416 |
+
}
|
417 |
+
|
418 |
+
video.loop = videoSettings.loop !== undefined ? videoSettings.loop : true;
|
419 |
+
video.muted = videoSettings.mute !== undefined ? videoSettings.mute : true;
|
420 |
+
|
421 |
+
if (video.muted === false) {
|
422 |
+
video.volume = 0;
|
423 |
+
this._fadeInSound(video, transitionDuration);
|
424 |
+
} else {
|
425 |
+
video.pause();
|
426 |
+
}
|
427 |
+
|
428 |
+
$video = $(video)
|
429 |
+
.addClass('vegas-video')
|
430 |
+
.css('background-color', color);
|
431 |
+
|
432 |
+
if (this.support.objectFit) {
|
433 |
+
$video
|
434 |
+
.css('object-position', align + ' ' + valign)
|
435 |
+
.css('object-fit', cover)
|
436 |
+
.css('width', '100%')
|
437 |
+
.css('height', '100%');
|
438 |
+
} else if (cover === 'contain') {
|
439 |
+
$video
|
440 |
+
.css('width', '100%')
|
441 |
+
.css('height', '100%');
|
442 |
+
}
|
443 |
+
|
444 |
+
$slide.append($video);
|
445 |
+
|
446 |
+
// Image
|
447 |
+
|
448 |
+
} else {
|
449 |
+
img = new Image();
|
450 |
+
|
451 |
+
$inner = $('<div class="vegas-slide-inner"></div>')
|
452 |
+
.css('background-image', 'url("' + src + '")')
|
453 |
+
.css('background-color', color)
|
454 |
+
.css('background-position', align + ' ' + valign);
|
455 |
+
|
456 |
+
if (cover === 'repeat') {
|
457 |
+
$inner.css('background-repeat', 'repeat');
|
458 |
+
} else {
|
459 |
+
$inner.css('background-size', cover);
|
460 |
+
}
|
461 |
+
|
462 |
+
if (this.support.transition && animation) {
|
463 |
+
$inner
|
464 |
+
.addClass('vegas-animation-' + animation)
|
465 |
+
.css('animation-duration', animationDuration + 'ms');
|
466 |
+
}
|
467 |
+
|
468 |
+
$slide.append($inner);
|
469 |
+
}
|
470 |
+
|
471 |
+
if (!this.support.transition) {
|
472 |
+
$slide.css('display', 'none');
|
473 |
+
}
|
474 |
+
|
475 |
+
if (total) {
|
476 |
+
$slides.eq(total - 1).after($slide);
|
477 |
+
} else {
|
478 |
+
this.$elmt.prepend($slide);
|
479 |
+
}
|
480 |
+
|
481 |
+
$slides
|
482 |
+
.css('transition', 'all 0ms')
|
483 |
+
.each(function () {
|
484 |
+
this.className = 'vegas-slide';
|
485 |
+
|
486 |
+
if (this.tagName === 'VIDEO') {
|
487 |
+
this.className += ' vegas-video';
|
488 |
+
}
|
489 |
+
|
490 |
+
if (transition) {
|
491 |
+
this.className += ' vegas-transition-' + transition;
|
492 |
+
this.className += ' vegas-transition-' + transition + '-in';
|
493 |
+
}
|
494 |
+
}
|
495 |
+
);
|
496 |
+
|
497 |
+
self._timer(false);
|
498 |
+
|
499 |
+
function go () {
|
500 |
+
self._timer(true);
|
501 |
+
|
502 |
+
setTimeout(function () {
|
503 |
+
if (transition) {
|
504 |
+
if (self.support.transition) {
|
505 |
+
$slides
|
506 |
+
.css('transition', 'all ' + transitionDuration + 'ms')
|
507 |
+
.addClass('vegas-transition-' + transition + '-out');
|
508 |
+
|
509 |
+
$slides.each(function () {
|
510 |
+
var video = $slides.find('video').get(0);
|
511 |
+
|
512 |
+
if (video) {
|
513 |
+
video.volume = 1;
|
514 |
+
self._fadeOutSound(video, transitionDuration);
|
515 |
+
}
|
516 |
+
});
|
517 |
+
|
518 |
+
$slide
|
519 |
+
.css('transition', 'all ' + transitionDuration + 'ms')
|
520 |
+
.addClass('vegas-transition-' + transition + '-in');
|
521 |
+
} else {
|
522 |
+
$slide.fadeIn(transitionDuration);
|
523 |
+
}
|
524 |
+
}
|
525 |
+
|
526 |
+
for (var i = 0; i < $slides.length - self.settings.slidesToKeep; i++) {
|
527 |
+
$slides.eq(i).remove();
|
528 |
+
}
|
529 |
+
|
530 |
+
self.trigger('walk');
|
531 |
+
self._slideShow();
|
532 |
+
}, 100);
|
533 |
+
}
|
534 |
+
if (video) {
|
535 |
+
if (video.readyState === 4) {
|
536 |
+
video.currentTime = 0;
|
537 |
+
}
|
538 |
+
|
539 |
+
video.play();
|
540 |
+
go();
|
541 |
+
} else {
|
542 |
+
img.src = src;
|
543 |
+
|
544 |
+
if (img.complete) {
|
545 |
+
go();
|
546 |
+
} else {
|
547 |
+
img.onload = go;
|
548 |
+
}
|
549 |
+
}
|
550 |
+
},
|
551 |
+
|
552 |
+
_end: function () {
|
553 |
+
this.ended = true;
|
554 |
+
this._timer(false);
|
555 |
+
this.trigger('end');
|
556 |
+
},
|
557 |
+
|
558 |
+
shuffle: function () {
|
559 |
+
var temp,
|
560 |
+
rand;
|
561 |
+
|
562 |
+
for (var i = this.total - 1; i > 0; i--) {
|
563 |
+
rand = Math.floor(Math.random() * (i + 1));
|
564 |
+
temp = this.settings.slides[i];
|
565 |
+
|
566 |
+
this.settings.slides[i] = this.settings.slides[rand];
|
567 |
+
this.settings.slides[rand] = temp;
|
568 |
+
}
|
569 |
+
},
|
570 |
+
|
571 |
+
play: function () {
|
572 |
+
if (this.paused) {
|
573 |
+
this.paused = false;
|
574 |
+
this.next();
|
575 |
+
this.trigger('play');
|
576 |
+
}
|
577 |
+
},
|
578 |
+
|
579 |
+
pause: function () {
|
580 |
+
this._timer(false);
|
581 |
+
this.paused = true;
|
582 |
+
this.trigger('pause');
|
583 |
+
},
|
584 |
+
|
585 |
+
toggle: function () {
|
586 |
+
if (this.paused) {
|
587 |
+
this.play();
|
588 |
+
} else {
|
589 |
+
this.pause();
|
590 |
+
}
|
591 |
+
},
|
592 |
+
|
593 |
+
playing: function () {
|
594 |
+
return !this.paused && !this.noshow;
|
595 |
+
},
|
596 |
+
|
597 |
+
current: function (advanced) {
|
598 |
+
if (advanced) {
|
599 |
+
return {
|
600 |
+
slide: this.slide,
|
601 |
+
data: this.settings.slides[this.slide]
|
602 |
+
};
|
603 |
+
}
|
604 |
+
return this.slide;
|
605 |
+
},
|
606 |
+
|
607 |
+
jump: function (nb) {
|
608 |
+
if (nb < 0 || nb > this.total - 1 || nb === this.slide) {
|
609 |
+
return;
|
610 |
+
}
|
611 |
+
|
612 |
+
this.slide = nb;
|
613 |
+
this._goto(this.slide);
|
614 |
+
},
|
615 |
+
|
616 |
+
next: function () {
|
617 |
+
this.slide++;
|
618 |
+
|
619 |
+
if (this.slide >= this.total) {
|
620 |
+
if (!this.settings.loop) {
|
621 |
+
return this._end();
|
622 |
+
}
|
623 |
+
|
624 |
+
this.slide = 0;
|
625 |
+
}
|
626 |
+
|
627 |
+
this._goto(this.slide);
|
628 |
+
},
|
629 |
+
|
630 |
+
previous: function () {
|
631 |
+
this.slide--;
|
632 |
+
|
633 |
+
if (this.slide < 0) {
|
634 |
+
if (!this.settings.loop) {
|
635 |
+
this.slide++;
|
636 |
+
return;
|
637 |
+
} else {
|
638 |
+
this.slide = this.total - 1;
|
639 |
+
}
|
640 |
+
}
|
641 |
+
|
642 |
+
this._goto(this.slide);
|
643 |
+
},
|
644 |
+
|
645 |
+
trigger: function (fn) {
|
646 |
+
var params = [];
|
647 |
+
|
648 |
+
if (fn === 'init') {
|
649 |
+
params = [ this.settings ];
|
650 |
+
} else {
|
651 |
+
params = [
|
652 |
+
this.slide,
|
653 |
+
this.settings.slides[this.slide]
|
654 |
+
];
|
655 |
+
}
|
656 |
+
|
657 |
+
this.$elmt.trigger('vegas' + fn, params);
|
658 |
+
|
659 |
+
if (typeof this.settings[fn] === 'function') {
|
660 |
+
this.settings[fn].apply(this.$elmt, params);
|
661 |
+
}
|
662 |
+
},
|
663 |
+
|
664 |
+
options: function (key, value) {
|
665 |
+
var oldSlides = this.settings.slides.slice();
|
666 |
+
|
667 |
+
if (typeof key === 'object') {
|
668 |
+
this.settings = $.extend({}, defaults, $.vegas.defaults, key);
|
669 |
+
} else if (typeof key === 'string') {
|
670 |
+
if (value === undefined) {
|
671 |
+
return this.settings[key];
|
672 |
+
}
|
673 |
+
this.settings[key] = value;
|
674 |
+
} else {
|
675 |
+
return this.settings;
|
676 |
+
}
|
677 |
+
|
678 |
+
// In case slides have changed
|
679 |
+
if (this.settings.slides !== oldSlides) {
|
680 |
+
this.total = this.settings.slides.length;
|
681 |
+
this.noshow = this.total < 2;
|
682 |
+
this._preload();
|
683 |
+
}
|
684 |
+
},
|
685 |
+
|
686 |
+
destroy: function () {
|
687 |
+
clearTimeout(this.timeout);
|
688 |
+
|
689 |
+
this.$elmt.removeClass('vegas-container');
|
690 |
+
this.$elmt.find('> .vegas-slide').remove();
|
691 |
+
this.$elmt.find('> .vegas-wrapper').clone(true).children().appendTo(this.$elmt);
|
692 |
+
this.$elmt.find('> .vegas-wrapper').remove();
|
693 |
+
|
694 |
+
if (this.settings.timer) {
|
695 |
+
this.$timer.remove();
|
696 |
+
}
|
697 |
+
|
698 |
+
if (this.settings.overlay) {
|
699 |
+
this.$overlay.remove();
|
700 |
+
}
|
701 |
+
|
702 |
+
this.elmt._vegas = null;
|
703 |
+
}
|
704 |
+
};
|
705 |
+
|
706 |
+
$.fn.vegas = function(options) {
|
707 |
+
var args = arguments,
|
708 |
+
error = false,
|
709 |
+
returns;
|
710 |
+
|
711 |
+
if (options === undefined || typeof options === 'object') {
|
712 |
+
return this.each(function () {
|
713 |
+
if (!this._vegas) {
|
714 |
+
this._vegas = new Vegas(this, options);
|
715 |
+
}
|
716 |
+
});
|
717 |
+
} else if (typeof options === 'string') {
|
718 |
+
this.each(function () {
|
719 |
+
var instance = this._vegas;
|
720 |
+
|
721 |
+
if (!instance) {
|
722 |
+
throw new Error('No Vegas applied to this element.');
|
723 |
+
}
|
724 |
+
|
725 |
+
if (typeof instance[options] === 'function' && options[0] !== '_') {
|
726 |
+
returns = instance[options].apply(instance, [].slice.call(args, 1));
|
727 |
+
} else {
|
728 |
+
error = true;
|
729 |
+
}
|
730 |
+
});
|
731 |
+
|
732 |
+
if (error) {
|
733 |
+
throw new Error('No method "' + options + '" in Vegas.');
|
734 |
+
}
|
735 |
+
|
736 |
+
return returns !== undefined ? returns : this;
|
737 |
+
}
|
738 |
+
};
|
739 |
+
|
740 |
+
$.vegas = {};
|
741 |
+
$.vegas.defaults = defaults;
|
742 |
+
|
743 |
+
$.vegas.isVideoCompatible = function () {
|
744 |
+
return !/(Android|webOS|Phone|iPad|iPod|BlackBerry|Windows Phone)/i.test(navigator.userAgent);
|
745 |
+
};
|
746 |
+
|
747 |
+
})(window.jQuery || window.Zepto);
|
assets/lib/vegas/vegas.min.css
ADDED
@@ -0,0 +1,2 @@
|
|
|
|
|
1 |
+
.vegas-overlay,.vegas-slide,.vegas-slide-inner,.vegas-timer,.vegas-wrapper{position:absolute;top:0;left:0;bottom:0;right:0;overflow:hidden;border:none;padding:0;margin:0}.vegas-overlay{opacity:.5;}.vegas-timer{top:auto;bottom:0;height:2px}.vegas-timer-progress{width:0;height:100%;background:#fff;-webkit-transition:width ease-out;transition:width ease-out}.vegas-timer-running .vegas-timer-progress{width:100%}.vegas-slide,.vegas-slide-inner{margin:0;padding:0;background:center center no-repeat;-webkit-transform:translateZ(0);transform:translateZ(0);will-change:transform,opacity}body .vegas-container{overflow:hidden!important;position:relative}.vegas-video{min-width:100%;min-height:100%;width:auto;height:auto}body.vegas-container{overflow:auto;position:static;z-index:-2}body.vegas-container>.vegas-overlay,body.vegas-container>.vegas-slide,body.vegas-container>.vegas-timer{position:fixed;z-index:-1}:root body.vegas-container>.vegas-overlay,:root body.vegas-container>.vegas-slide,_::full-page-media,_:future{bottom:-76px}.vegas-transition-blur,.vegas-transition-blur2{opacity:0;-webkit-filter:blur(32px);filter:blur(32px)}.vegas-transition-blur-in,.vegas-transition-blur2-in{opacity:1;-webkit-filter:blur(0);filter:blur(0)}.vegas-transition-blur2-out{opacity:0}.vegas-transition-burn,.vegas-transition-burn2{opacity:0;-webkit-filter:contrast(1000%) saturate(1000%);filter:contrast(1000%) saturate(1000%)}.vegas-transition-burn-in,.vegas-transition-burn2-in{opacity:1;-webkit-filter:contrast(100%) saturate(100%);filter:contrast(100%) saturate(100%)}.vegas-transition-burn2-out{opacity:0;-webkit-filter:contrast(1000%) saturate(1000%);filter:contrast(1000%) saturate(1000%)}.vegas-transition-fade,.vegas-transition-fade2{opacity:0}.vegas-transition-fade-in,.vegas-transition-fade2-in{opacity:1}.vegas-transition-fade2-out{opacity:0}.vegas-transition-flash,.vegas-transition-flash2{opacity:0;-webkit-filter:brightness(25);filter:brightness(25)}.vegas-transition-flash-in,.vegas-transition-flash2-in{opacity:1;-webkit-filter:brightness(1);filter:brightness(1)}.vegas-transition-flash2-out{opacity:0;-webkit-filter:brightness(25);filter:brightness(25)}.vegas-transition-negative,.vegas-transition-negative2{opacity:0;-webkit-filter:invert(100%);filter:invert(100%)}.vegas-transition-negative-in,.vegas-transition-negative2-in{opacity:1;-webkit-filter:invert(0);filter:invert(0)}.vegas-transition-negative2-out{opacity:0;-webkit-filter:invert(100%);filter:invert(100%)}.vegas-transition-slideDown,.vegas-transition-slideDown2{-webkit-transform:translateY(-100%);transform:translateY(-100%)}.vegas-transition-slideDown-in,.vegas-transition-slideDown2-in{-webkit-transform:translateY(0);transform:translateY(0)}.vegas-transition-slideDown2-out{-webkit-transform:translateY(100%);transform:translateY(100%)}.vegas-transition-slideLeft,.vegas-transition-slideLeft2{-webkit-transform:translateX(100%);transform:translateX(100%)}.vegas-transition-slideLeft-in,.vegas-transition-slideLeft2-in{-webkit-transform:translateX(0);transform:translateX(0)}.vegas-transition-slideLeft2-out,.vegas-transition-slideRight,.vegas-transition-slideRight2{-webkit-transform:translateX(-100%);transform:translateX(-100%)}.vegas-transition-slideRight-in,.vegas-transition-slideRight2-in{-webkit-transform:translateX(0);transform:translateX(0)}.vegas-transition-slideRight2-out{-webkit-transform:translateX(100%);transform:translateX(100%)}.vegas-transition-slideUp,.vegas-transition-slideUp2{-webkit-transform:translateY(100%);transform:translateY(100%)}.vegas-transition-slideUp-in,.vegas-transition-slideUp2-in{-webkit-transform:translateY(0);transform:translateY(0)}.vegas-transition-slideUp2-out{-webkit-transform:translateY(-100%);transform:translateY(-100%)}.vegas-transition-swirlLeft,.vegas-transition-swirlLeft2{-webkit-transform:scale(2) rotate(35deg);transform:scale(2) rotate(35deg);opacity:0}.vegas-transition-swirlLeft-in,.vegas-transition-swirlLeft2-in{-webkit-transform:scale(1) rotate(0);transform:scale(1) rotate(0);opacity:1}.vegas-transition-swirlLeft2-out,.vegas-transition-swirlRight,.vegas-transition-swirlRight2{-webkit-transform:scale(2) rotate(-35deg);transform:scale(2) rotate(-35deg);opacity:0}.vegas-transition-swirlRight-in,.vegas-transition-swirlRight2-in{-webkit-transform:scale(1) rotate(0);transform:scale(1) rotate(0);opacity:1}.vegas-transition-swirlRight2-out{-webkit-transform:scale(2) rotate(35deg);transform:scale(2) rotate(35deg);opacity:0}.vegas-transition-zoomIn,.vegas-transition-zoomIn2{-webkit-transform:scale(0);transform:scale(0);opacity:0}.vegas-transition-zoomIn-in,.vegas-transition-zoomIn2-in{-webkit-transform:scale(1);transform:scale(1);opacity:1}.vegas-transition-zoomIn2-out,.vegas-transition-zoomOut,.vegas-transition-zoomOut2{-webkit-transform:scale(2);transform:scale(2);opacity:0}.vegas-transition-zoomOut-in,.vegas-transition-zoomOut2-in{-webkit-transform:scale(1);transform:scale(1);opacity:1}.vegas-transition-zoomOut2-out{-webkit-transform:scale(0);transform:scale(0);opacity:0}.vegas-animation-kenburns{-webkit-animation:kenburns ease-out;animation:kenburns ease-out}@-webkit-keyframes kenburns{0%{-webkit-transform:scale(1.5);transform:scale(1.5)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes kenburns{0%{-webkit-transform:scale(1.5);transform:scale(1.5)}100%{-webkit-transform:scale(1);transform:scale(1)}}.vegas-animation-kenburnsDownLeft{-webkit-animation:kenburnsDownLeft ease-out;animation:kenburnsDownLeft ease-out}@-webkit-keyframes kenburnsDownLeft{0%{-webkit-transform:scale(1.5) translate(10%,-10%);transform:scale(1.5) translate(10%,-10%)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}@keyframes kenburnsDownLeft{0%{-webkit-transform:scale(1.5) translate(10%,-10%);transform:scale(1.5) translate(10%,-10%)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}.vegas-animation-kenburnsDownRight{-webkit-animation:kenburnsDownRight ease-out;animation:kenburnsDownRight ease-out}@-webkit-keyframes kenburnsDownRight{0%{-webkit-transform:scale(1.5) translate(-10%,-10%);transform:scale(1.5) translate(-10%,-10%)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}@keyframes kenburnsDownRight{0%{-webkit-transform:scale(1.5) translate(-10%,-10%);transform:scale(1.5) translate(-10%,-10%)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}.vegas-animation-kenburnsDown{-webkit-animation:kenburnsDown ease-out;animation:kenburnsDown ease-out}@-webkit-keyframes kenburnsDown{0%{-webkit-transform:scale(1.5) translate(0,-10%);transform:scale(1.5) translate(0,-10%)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}@keyframes kenburnsDown{0%{-webkit-transform:scale(1.5) translate(0,-10%);transform:scale(1.5) translate(0,-10%)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}.vegas-animation-kenburnsLeft{-webkit-animation:kenburnsLeft ease-out;animation:kenburnsLeft ease-out}@-webkit-keyframes kenburnsLeft{0%{-webkit-transform:scale(1.5) translate(10%,0);transform:scale(1.5) translate(10%,0)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}@keyframes kenburnsLeft{0%{-webkit-transform:scale(1.5) translate(10%,0);transform:scale(1.5) translate(10%,0)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}.vegas-animation-kenburnsRight{-webkit-animation:kenburnsRight ease-out;animation:kenburnsRight ease-out}@-webkit-keyframes kenburnsRight{0%{-webkit-transform:scale(1.5) translate(-10%,0);transform:scale(1.5) translate(-10%,0)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}@keyframes kenburnsRight{0%{-webkit-transform:scale(1.5) translate(-10%,0);transform:scale(1.5) translate(-10%,0)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}.vegas-animation-kenburnsUpLeft{-webkit-animation:kenburnsUpLeft ease-out;animation:kenburnsUpLeft ease-out}@-webkit-keyframes kenburnsUpLeft{0%{-webkit-transform:scale(1.5) translate(10%,10%);transform:scale(1.5) translate(10%,10%)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}@keyframes kenburnsUpLeft{0%{-webkit-transform:scale(1.5) translate(10%,10%);transform:scale(1.5) translate(10%,10%)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}.vegas-animation-kenburnsUpRight{-webkit-animation:kenburnsUpRight ease-out;animation:kenburnsUpRight ease-out}@-webkit-keyframes kenburnsUpRight{0%{-webkit-transform:scale(1.5) translate(-10%,10%);transform:scale(1.5) translate(-10%,10%)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}@keyframes kenburnsUpRight{0%{-webkit-transform:scale(1.5) translate(-10%,10%);transform:scale(1.5) translate(-10%,10%)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}.vegas-animation-kenburnsUp{-webkit-animation:kenburnsUp ease-out;animation:kenburnsUp ease-out}@-webkit-keyframes kenburnsUp{0%{-webkit-transform:scale(1.5) translate(0,10%);transform:scale(1.5) translate(0,10%)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}@keyframes kenburnsUp{0%{-webkit-transform:scale(1.5) translate(0,10%);transform:scale(1.5) translate(0,10%)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}
|
2 |
+
/*# sourceMappingURL=vegas.min.css.map */
|
assets/lib/vegas/vegas.min.css.map
ADDED
@@ -0,0 +1 @@
|
|
|
1 |
+
{"version":3,"names":[],"mappings":"","sources":["vegas.css"],"sourcesContent":[".vegas-wrapper,\n.vegas-overlay,\n.vegas-timer,\n.vegas-slide,\n.vegas-slide-inner {\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n overflow: hidden;\n border: none;\n padding: 0;\n margin: 0;\n}\n\n.vegas-overlay {\n opacity: .5;\n background: transparent url(\"overlays/02.png\") center center repeat;\n}\n\n.vegas-timer {\n top: auto;\n bottom: 0;\n height: 2px;\n}\n\n.vegas-timer-progress {\n width: 0%;\n height: 100%;\n background: white;\n -webkit-transition: width ease-out;\n transition: width ease-out;\n}\n\n.vegas-timer-running .vegas-timer-progress {\n width: 100%;\n}\n\n.vegas-slide,\n.vegas-slide-inner {\n margin: 0;\n padding: 0;\n background: transparent center center no-repeat;\n -webkit-transform: translateZ(0);\n transform: translateZ(0);\n will-change: transform, opacity;\n}\n\nbody .vegas-container {\n overflow: hidden !important;\n position: relative;\n}\n\n.vegas-video {\n min-width: 100%;\n min-height: 100%;\n width: auto;\n height: auto;\n}\n\nbody.vegas-container {\n overflow: auto;\n position: static;\n z-index: -2;\n}\n\nbody.vegas-container > .vegas-timer,\nbody.vegas-container > .vegas-overlay,\nbody.vegas-container > .vegas-slide {\n position: fixed;\n z-index: -1;\n}\n\n/* Target Safari IOS7+ in order to add 76px */\n_::full-page-media, _:future,\n:root body.vegas-container > .vegas-slide,\n:root body.vegas-container > .vegas-overlay {\n bottom: -76px;\n}\n\n/*******************************************/\n/* blur transition */\n/*******************************************/\n.vegas-transition-blur,\n.vegas-transition-blur2 {\n opacity: 0;\n -webkit-filter: blur(32px);\n filter: blur(32px);\n}\n\n.vegas-transition-blur-in,\n.vegas-transition-blur2-in {\n opacity: 1;\n -webkit-filter: blur(0px);\n filter: blur(0px);\n}\n\n.vegas-transition-blur2-out {\n opacity: 0;\n}\n\n/*******************************************/\n/* burn transition */\n/*******************************************/\n.vegas-transition-burn,\n.vegas-transition-burn2 {\n opacity: 0;\n -webkit-filter: contrast(1000%) saturate(1000%);\n filter: contrast(1000%) saturate(1000%);\n}\n\n.vegas-transition-burn-in,\n.vegas-transition-burn2-in {\n opacity: 1;\n -webkit-filter: contrast(100%) saturate(100%);\n filter: contrast(100%) saturate(100%);\n}\n\n.vegas-transition-burn2-out {\n opacity: 0;\n -webkit-filter: contrast(1000%) saturate(1000%);\n filter: contrast(1000%) saturate(1000%);\n}\n\n/*******************************************/\n/* fade transition */\n/*******************************************/\n.vegas-transition-fade,\n.vegas-transition-fade2 {\n opacity: 0;\n}\n\n.vegas-transition-fade-in,\n.vegas-transition-fade2-in {\n opacity: 1;\n}\n\n.vegas-transition-fade2-out {\n opacity: 0;\n}\n\n/*******************************************/\n/* flash transition */\n/*******************************************/\n.vegas-transition-flash,\n.vegas-transition-flash2 {\n opacity: 0;\n -webkit-filter: brightness(25);\n filter: brightness(25);\n}\n\n.vegas-transition-flash-in,\n.vegas-transition-flash2-in {\n opacity: 1;\n -webkit-filter: brightness(1);\n filter: brightness(1);\n}\n\n.vegas-transition-flash2-out {\n opacity: 0;\n -webkit-filter: brightness(25);\n filter: brightness(25);\n}\n\n/*******************************************/\n/* negative transition */\n/*******************************************/\n.vegas-transition-negative,\n.vegas-transition-negative2 {\n opacity: 0;\n -webkit-filter: invert(100%);\n filter: invert(100%);\n}\n\n.vegas-transition-negative-in,\n.vegas-transition-negative2-in {\n opacity: 1;\n -webkit-filter: invert(0);\n filter: invert(0);\n}\n\n.vegas-transition-negative2-out {\n opacity: 0;\n -webkit-filter: invert(100%);\n filter: invert(100%);\n}\n\n/*******************************************/\n/* slideDown transition */\n/*******************************************/\n.vegas-transition-slideDown,\n.vegas-transition-slideDown2 {\n -webkit-transform: translateY(-100%);\n transform: translateY(-100%);\n}\n\n.vegas-transition-slideDown-in,\n.vegas-transition-slideDown2-in {\n -webkit-transform: translateY(0%);\n transform: translateY(0%);\n}\n\n.vegas-transition-slideDown2-out {\n -webkit-transform: translateY(100%);\n transform: translateY(100%);\n}\n\n/*******************************************/\n/* slideLeft transition */\n/*******************************************/\n.vegas-transition-slideLeft,\n.vegas-transition-slideLeft2 {\n -webkit-transform: translateX(100%);\n transform: translateX(100%);\n}\n\n.vegas-transition-slideLeft-in,\n.vegas-transition-slideLeft2-in {\n -webkit-transform: translateX(0%);\n transform: translateX(0%);\n}\n\n.vegas-transition-slideLeft2-out {\n -webkit-transform: translateX(-100%);\n transform: translateX(-100%);\n}\n\n/*******************************************/\n/* slideRight transition */\n/*******************************************/\n.vegas-transition-slideRight,\n.vegas-transition-slideRight2 {\n -webkit-transform: translateX(-100%);\n transform: translateX(-100%);\n}\n\n.vegas-transition-slideRight-in,\n.vegas-transition-slideRight2-in {\n -webkit-transform: translateX(0%);\n transform: translateX(0%);\n}\n\n.vegas-transition-slideRight2-out {\n -webkit-transform: translateX(100%);\n transform: translateX(100%);\n}\n\n/*******************************************/\n/* slideUp transition */\n/*******************************************/\n.vegas-transition-slideUp,\n.vegas-transition-slideUp2 {\n -webkit-transform: translateY(100%);\n transform: translateY(100%);\n}\n\n.vegas-transition-slideUp-in,\n.vegas-transition-slideUp2-in {\n -webkit-transform: translateY(0%);\n transform: translateY(0%);\n}\n\n.vegas-transition-slideUp2-out {\n -webkit-transform: translateY(-100%);\n transform: translateY(-100%);\n}\n\n/*******************************************/\n/* swirlLeft transition */\n/*******************************************/\n.vegas-transition-swirlLeft,\n.vegas-transition-swirlLeft2 {\n -webkit-transform: scale(2) rotate(35deg);\n transform: scale(2) rotate(35deg);\n opacity: 0;\n}\n\n.vegas-transition-swirlLeft-in,\n.vegas-transition-swirlLeft2-in {\n -webkit-transform: scale(1) rotate(0deg);\n transform: scale(1) rotate(0deg);\n opacity: 1;\n}\n\n.vegas-transition-swirlLeft2-out {\n -webkit-transform: scale(2) rotate(-35deg);\n transform: scale(2) rotate(-35deg);\n opacity: 0;\n}\n\n/*******************************************/\n/* swirlRight transition */\n/*******************************************/\n.vegas-transition-swirlRight,\n.vegas-transition-swirlRight2 {\n -webkit-transform: scale(2) rotate(-35deg);\n transform: scale(2) rotate(-35deg);\n opacity: 0;\n}\n\n.vegas-transition-swirlRight-in,\n.vegas-transition-swirlRight2-in {\n -webkit-transform: scale(1) rotate(0deg);\n transform: scale(1) rotate(0deg);\n opacity: 1;\n}\n\n.vegas-transition-swirlRight2-out {\n -webkit-transform: scale(2) rotate(35deg);\n transform: scale(2) rotate(35deg);\n opacity: 0;\n}\n\n/*******************************************/\n/* zoomIn transition */\n/*******************************************/\n.vegas-transition-zoomIn,\n.vegas-transition-zoomIn2 {\n -webkit-transform: scale(0);\n transform: scale(0);\n opacity: 0;\n}\n\n.vegas-transition-zoomIn-in,\n.vegas-transition-zoomIn2-in {\n -webkit-transform: scale(1);\n transform: scale(1);\n opacity: 1;\n}\n\n.vegas-transition-zoomIn2-out {\n -webkit-transform: scale(2);\n transform: scale(2);\n opacity: 0;\n}\n\n/*******************************************/\n/* zoomOut transition */\n/*******************************************/\n.vegas-transition-zoomOut,\n.vegas-transition-zoomOut2 {\n -webkit-transform: scale(2);\n transform: scale(2);\n opacity: 0;\n}\n\n.vegas-transition-zoomOut-in,\n.vegas-transition-zoomOut2-in {\n -webkit-transform: scale(1);\n transform: scale(1);\n opacity: 1;\n}\n\n.vegas-transition-zoomOut2-out {\n -webkit-transform: scale(0);\n transform: scale(0);\n opacity: 0;\n}\n\n/*******************************************/\n/* kenburns animation */\n/*******************************************/\n.vegas-animation-kenburns {\n -webkit-animation: kenburns ease-out;\n animation: kenburns ease-out;\n}\n\n@-webkit-keyframes kenburns {\n 0% {\n -webkit-transform: scale(1.5);\n transform: scale(1.5);\n }\n 100% {\n -webkit-transform: scale(1);\n transform: scale(1);\n }\n}\n\n@keyframes kenburns {\n 0% {\n -webkit-transform: scale(1.5);\n transform: scale(1.5);\n }\n 100% {\n -webkit-transform: scale(1);\n transform: scale(1);\n }\n}\n\n/*******************************************/\n/* kenburnsDownLeft animation */\n/*******************************************/\n.vegas-animation-kenburnsDownLeft {\n -webkit-animation: kenburnsDownLeft ease-out;\n animation: kenburnsDownLeft ease-out;\n}\n\n@-webkit-keyframes kenburnsDownLeft {\n 0% {\n -webkit-transform: scale(1.5) translate(10%, -10%);\n transform: scale(1.5) translate(10%, -10%);\n }\n 100% {\n -webkit-transform: scale(1) translate(0, 0);\n transform: scale(1) translate(0, 0);\n }\n}\n\n@keyframes kenburnsDownLeft {\n 0% {\n -webkit-transform: scale(1.5) translate(10%, -10%);\n transform: scale(1.5) translate(10%, -10%);\n }\n 100% {\n -webkit-transform: scale(1) translate(0, 0);\n transform: scale(1) translate(0, 0);\n }\n}\n\n/*******************************************/\n/* kenburnsDownRight animation */\n/*******************************************/\n.vegas-animation-kenburnsDownRight {\n -webkit-animation: kenburnsDownRight ease-out;\n animation: kenburnsDownRight ease-out;\n}\n\n@-webkit-keyframes kenburnsDownRight {\n 0% {\n -webkit-transform: scale(1.5) translate(-10%, -10%);\n transform: scale(1.5) translate(-10%, -10%);\n }\n 100% {\n -webkit-transform: scale(1) translate(0, 0);\n transform: scale(1) translate(0, 0);\n }\n}\n\n@keyframes kenburnsDownRight {\n 0% {\n -webkit-transform: scale(1.5) translate(-10%, -10%);\n transform: scale(1.5) translate(-10%, -10%);\n }\n 100% {\n -webkit-transform: scale(1) translate(0, 0);\n transform: scale(1) translate(0, 0);\n }\n}\n\n/*******************************************/\n/* kenburnsDown animation */\n/*******************************************/\n.vegas-animation-kenburnsDown {\n -webkit-animation: kenburnsDown ease-out;\n animation: kenburnsDown ease-out;\n}\n\n@-webkit-keyframes kenburnsDown {\n 0% {\n -webkit-transform: scale(1.5) translate(0, -10%);\n transform: scale(1.5) translate(0, -10%);\n }\n 100% {\n -webkit-transform: scale(1) translate(0, 0);\n transform: scale(1) translate(0, 0);\n }\n}\n\n@keyframes kenburnsDown {\n 0% {\n -webkit-transform: scale(1.5) translate(0, -10%);\n transform: scale(1.5) translate(0, -10%);\n }\n 100% {\n -webkit-transform: scale(1) translate(0, 0);\n transform: scale(1) translate(0, 0);\n }\n}\n\n/*******************************************/\n/* kenburnsLeft animation */\n/*******************************************/\n.vegas-animation-kenburnsLeft {\n -webkit-animation: kenburnsLeft ease-out;\n animation: kenburnsLeft ease-out;\n}\n\n@-webkit-keyframes kenburnsLeft {\n 0% {\n -webkit-transform: scale(1.5) translate(10%, 0);\n transform: scale(1.5) translate(10%, 0);\n }\n 100% {\n -webkit-transform: scale(1) translate(0, 0);\n transform: scale(1) translate(0, 0);\n }\n}\n\n@keyframes kenburnsLeft {\n 0% {\n -webkit-transform: scale(1.5) translate(10%, 0);\n transform: scale(1.5) translate(10%, 0);\n }\n 100% {\n -webkit-transform: scale(1) translate(0, 0);\n transform: scale(1) translate(0, 0);\n }\n}\n\n/*******************************************/\n/* kenburnsRight animation */\n/*******************************************/\n.vegas-animation-kenburnsRight {\n -webkit-animation: kenburnsRight ease-out;\n animation: kenburnsRight ease-out;\n}\n\n@-webkit-keyframes kenburnsRight {\n 0% {\n -webkit-transform: scale(1.5) translate(-10%, 0);\n transform: scale(1.5) translate(-10%, 0);\n }\n 100% {\n -webkit-transform: scale(1) translate(0, 0);\n transform: scale(1) translate(0, 0);\n }\n}\n\n@keyframes kenburnsRight {\n 0% {\n -webkit-transform: scale(1.5) translate(-10%, 0);\n transform: scale(1.5) translate(-10%, 0);\n }\n 100% {\n -webkit-transform: scale(1) translate(0, 0);\n transform: scale(1) translate(0, 0);\n }\n}\n\n/*******************************************/\n/* kenburnsUpLeft animation */\n/*******************************************/\n.vegas-animation-kenburnsUpLeft {\n -webkit-animation: kenburnsUpLeft ease-out;\n animation: kenburnsUpLeft ease-out;\n}\n\n@-webkit-keyframes kenburnsUpLeft {\n 0% {\n -webkit-transform: scale(1.5) translate(10%, 10%);\n transform: scale(1.5) translate(10%, 10%);\n }\n 100% {\n -webkit-transform: scale(1) translate(0, 0);\n transform: scale(1) translate(0, 0);\n }\n}\n\n@keyframes kenburnsUpLeft {\n 0% {\n -webkit-transform: scale(1.5) translate(10%, 10%);\n transform: scale(1.5) translate(10%, 10%);\n }\n 100% {\n -webkit-transform: scale(1) translate(0, 0);\n transform: scale(1) translate(0, 0);\n }\n}\n\n/*******************************************/\n/* kenburnsUpRight animation */\n/*******************************************/\n.vegas-animation-kenburnsUpRight {\n -webkit-animation: kenburnsUpRight ease-out;\n animation: kenburnsUpRight ease-out;\n}\n\n@-webkit-keyframes kenburnsUpRight {\n 0% {\n -webkit-transform: scale(1.5) translate(-10%, 10%);\n transform: scale(1.5) translate(-10%, 10%);\n }\n 100% {\n -webkit-transform: scale(1) translate(0, 0);\n transform: scale(1) translate(0, 0);\n }\n}\n\n@keyframes kenburnsUpRight {\n 0% {\n -webkit-transform: scale(1.5) translate(-10%, 10%);\n transform: scale(1.5) translate(-10%, 10%);\n }\n 100% {\n -webkit-transform: scale(1) translate(0, 0);\n transform: scale(1) translate(0, 0);\n }\n}\n\n/*******************************************/\n/* kenburnsUp animation */\n/*******************************************/\n.vegas-animation-kenburnsUp {\n -webkit-animation: kenburnsUp ease-out;\n animation: kenburnsUp ease-out;\n}\n\n@-webkit-keyframes kenburnsUp {\n 0% {\n -webkit-transform: scale(1.5) translate(0, 10%);\n transform: scale(1.5) translate(0, 10%);\n }\n 100% {\n -webkit-transform: scale(1) translate(0, 0);\n transform: scale(1) translate(0, 0);\n }\n}\n\n@keyframes kenburnsUp {\n 0% {\n -webkit-transform: scale(1.5) translate(0, 10%);\n transform: scale(1.5) translate(0, 10%);\n }\n 100% {\n -webkit-transform: scale(1) translate(0, 0);\n transform: scale(1) translate(0, 0);\n }\n}\n"],"file":"vegas.min.css"}
|
assets/lib/vegas/vegas.min.js
ADDED
@@ -0,0 +1,2 @@
|
|
|
|
|
1 |
+
!function(t){"use strict";var s={slide:0,delay:5e3,loop:!0,preload:!1,preloadImage:!1,preloadVideo:!1,timer:!0,overlay:!1,autoplay:!0,shuffle:!1,cover:!0,color:null,align:"center",valign:"center",firstTransition:null,firstTransitionDuration:null,transition:"fade",transitionDuration:1e3,transitionRegister:[],animation:null,animationDuration:"auto",animationRegister:[],slidesToKeep:1,init:function(){},play:function(){},pause:function(){},walk:function(){},slides:[]},i={},e=function(i,e){this.elmt=i,this.settings=t.extend({},s,t.vegas.defaults,e),this.slide=this.settings.slide,this.total=this.settings.slides.length,this.noshow=this.total<2,this.paused=!this.settings.autoplay||this.noshow,this.ended=!1,this.$elmt=t(i),this.$timer=null,this.$overlay=null,this.$slide=null,this.timeout=null,this.first=!0,this.transitions=["fade","fade2","blur","blur2","flash","flash2","negative","negative2","burn","burn2","slideLeft","slideLeft2","slideRight","slideRight2","slideUp","slideUp2","slideDown","slideDown2","zoomIn","zoomIn2","zoomOut","zoomOut2","swirlLeft","swirlLeft2","swirlRight","swirlRight2"],this.animations=["kenburns","kenburnsLeft","kenburnsRight","kenburnsUp","kenburnsUpLeft","kenburnsUpRight","kenburnsDown","kenburnsDownLeft","kenburnsDownRight"],this.settings.transitionRegister instanceof Array==!1&&(this.settings.transitionRegister=[this.settings.transitionRegister]),this.settings.animationRegister instanceof Array==!1&&(this.settings.animationRegister=[this.settings.animationRegister]),this.transitions=this.transitions.concat(this.settings.transitionRegister),this.animations=this.animations.concat(this.settings.animationRegister),this.support={objectFit:"objectFit"in document.body.style,transition:"transition"in document.body.style||"WebkitTransition"in document.body.style,video:t.vegas.isVideoCompatible()},this.settings.shuffle===!0&&this.shuffle(),this._init()};e.prototype={_init:function(){var s,i,e,n="BODY"===this.elmt.tagName,o=this.settings.timer,a=this.settings.overlay,r=this;this._preload(),n||(this.$elmt.css("height",this.$elmt.css("height")),s=t('<div class="vegas-wrapper">').css("overflow",this.$elmt.css("overflow")).css("padding",this.$elmt.css("padding")),this.$elmt.css("padding")||s.css("padding-top",this.$elmt.css("padding-top")).css("padding-bottom",this.$elmt.css("padding-bottom")).css("padding-left",this.$elmt.css("padding-left")).css("padding-right",this.$elmt.css("padding-right")),this.$elmt.clone(!0).children().appendTo(s),this.elmt.innerHTML=""),o&&this.support.transition&&(e=t('<div class="vegas-timer"><div class="vegas-timer-progress">'),this.$timer=e,this.$elmt.prepend(e)),a&&(i=t('<div class="vegas-overlay">'),"string"==typeof a&&i.css("background-image","url("+a+")"),this.$overlay=i,this.$elmt.prepend(i)),this.$elmt.addClass("vegas-container"),n||this.$elmt.append(s),setTimeout(function(){r.trigger("init"),r._goto(r.slide),r.settings.autoplay&&r.trigger("play")},1)},_preload:function(){var t,s;for(s=0;s<this.settings.slides.length;s++)(this.settings.preload||this.settings.preloadImages)&&this.settings.slides[s].src&&(t=new Image,t.src=this.settings.slides[s].src),(this.settings.preload||this.settings.preloadVideos)&&this.support.video&&this.settings.slides[s].video&&(this.settings.slides[s].video instanceof Array?this._video(this.settings.slides[s].video):this._video(this.settings.slides[s].video.src))},_random:function(t){return t[Math.floor(Math.random()*t.length)]},_slideShow:function(){var t=this;this.total>1&&!this.ended&&!this.paused&&!this.noshow&&(this.timeout=setTimeout(function(){t.next()},this._options("delay")))},_timer:function(t){var s=this;clearTimeout(this.timeout),this.$timer&&(this.$timer.removeClass("vegas-timer-running").find("div").css("transition-duration","0ms"),this.ended||this.paused||this.noshow||t&&setTimeout(function(){s.$timer.addClass("vegas-timer-running").find("div").css("transition-duration",s._options("delay")-100+"ms")},100))},_video:function(t){var s,e,n=t.toString();return i[n]?i[n]:(t instanceof Array==!1&&(t=[t]),s=document.createElement("video"),s.preload=!0,t.forEach(function(t){e=document.createElement("source"),e.src=t,s.appendChild(e)}),i[n]=s,s)},_fadeOutSound:function(t,s){var i=this,e=s/10,n=t.volume-.09;n>0?(t.volume=n,setTimeout(function(){i._fadeOutSound(t,s)},e)):t.pause()},_fadeInSound:function(t,s){var i=this,e=s/10,n=t.volume+.09;n<1&&(t.volume=n,setTimeout(function(){i._fadeInSound(t,s)},e))},_options:function(t,s){return void 0===s&&(s=this.slide),void 0!==this.settings.slides[s][t]?this.settings.slides[s][t]:this.settings[t]},_goto:function(s){function i(){f._timer(!0),setTimeout(function(){y&&(f.support.transition?(h.css("transition","all "+_+"ms").addClass("vegas-transition-"+y+"-out"),h.each(function(){var t=h.find("video").get(0);t&&(t.volume=1,f._fadeOutSound(t,_))}),e.css("transition","all "+_+"ms").addClass("vegas-transition-"+y+"-in")):e.fadeIn(_));for(var t=0;t<h.length-f.settings.slidesToKeep;t++)h.eq(t).remove();f.trigger("walk"),f._slideShow()},100)}"undefined"==typeof this.settings.slides[s]&&(s=0),this.slide=s;var e,n,o,a,r,h=this.$elmt.children(".vegas-slide"),d=this.settings.slides[s].src,l=this.settings.slides[s].video,g=this._options("delay"),u=this._options("align"),c=this._options("valign"),p=this._options("cover"),m=this._options("color")||this.$elmt.css("background-color"),f=this,v=h.length,y=this._options("transition"),_=this._options("transitionDuration"),w=this._options("animation"),b=this._options("animationDuration");this.settings.firstTransition&&this.first&&(y=this.settings.firstTransition||y),this.settings.firstTransitionDuration&&this.first&&(_=this.settings.firstTransitionDuration||_),this.first&&(this.first=!1),"repeat"!==p&&(p===!0?p="cover":p===!1&&(p="contain")),("random"===y||y instanceof Array)&&(y=y instanceof Array?this._random(y):this._random(this.transitions)),("random"===w||w instanceof Array)&&(w=w instanceof Array?this._random(w):this._random(this.animations)),("auto"===_||_>g)&&(_=g),"auto"===b&&(b=g),e=t('<div class="vegas-slide"></div>'),this.support.transition&&y&&e.addClass("vegas-transition-"+y),this.support.video&&l?(a=l instanceof Array?this._video(l):this._video(l.src),a.loop=void 0===l.loop||l.loop,a.muted=void 0===l.mute||l.mute,a.muted===!1?(a.volume=0,this._fadeInSound(a,_)):a.pause(),o=t(a).addClass("vegas-video").css("background-color",m),this.support.objectFit?o.css("object-position",u+" "+c).css("object-fit",p).css("width","100%").css("height","100%"):"contain"===p&&o.css("width","100%").css("height","100%"),e.append(o)):(r=new Image,n=t('<div class="vegas-slide-inner"></div>').css("background-image",'url("'+d+'")').css("background-color",m).css("background-position",u+" "+c),"repeat"===p?n.css("background-repeat","repeat"):n.css("background-size",p),this.support.transition&&w&&n.addClass("vegas-animation-"+w).css("animation-duration",b+"ms"),e.append(n)),this.support.transition||e.css("display","none"),v?h.eq(v-1).after(e):this.$elmt.prepend(e),h.css("transition","all 0ms").each(function(){this.className="vegas-slide","VIDEO"===this.tagName&&(this.className+=" vegas-video"),y&&(this.className+=" vegas-transition-"+y,this.className+=" vegas-transition-"+y+"-in")}),f._timer(!1),a?(4===a.readyState&&(a.currentTime=0),a.play(),i()):(r.src=d,r.complete?i():r.onload=i)},_end:function(){this.ended=!0,this._timer(!1),this.trigger("end")},shuffle:function(){for(var t,s,i=this.total-1;i>0;i--)s=Math.floor(Math.random()*(i+1)),t=this.settings.slides[i],this.settings.slides[i]=this.settings.slides[s],this.settings.slides[s]=t},play:function(){this.paused&&(this.paused=!1,this.next(),this.trigger("play"))},pause:function(){this._timer(!1),this.paused=!0,this.trigger("pause")},toggle:function(){this.paused?this.play():this.pause()},playing:function(){return!this.paused&&!this.noshow},current:function(t){return t?{slide:this.slide,data:this.settings.slides[this.slide]}:this.slide},jump:function(t){t<0||t>this.total-1||t===this.slide||(this.slide=t,this._goto(this.slide))},next:function(){if(this.slide++,this.slide>=this.total){if(!this.settings.loop)return this._end();this.slide=0}this._goto(this.slide)},previous:function(){if(this.slide--,this.slide<0){if(!this.settings.loop)return void this.slide++;this.slide=this.total-1}this._goto(this.slide)},trigger:function(t){var s=[];s="init"===t?[this.settings]:[this.slide,this.settings.slides[this.slide]],this.$elmt.trigger("vegas"+t,s),"function"==typeof this.settings[t]&&this.settings[t].apply(this.$elmt,s)},options:function(i,e){var n=this.settings.slides.slice();if("object"==typeof i)this.settings=t.extend({},s,t.vegas.defaults,i);else{if("string"!=typeof i)return this.settings;if(void 0===e)return this.settings[i];this.settings[i]=e}this.settings.slides!==n&&(this.total=this.settings.slides.length,this.noshow=this.total<2,this._preload())},destroy:function(){clearTimeout(this.timeout),this.$elmt.removeClass("vegas-container"),this.$elmt.find("> .vegas-slide").remove(),this.$elmt.find("> .vegas-wrapper").clone(!0).children().appendTo(this.$elmt),this.$elmt.find("> .vegas-wrapper").remove(),this.settings.timer&&this.$timer.remove(),this.settings.overlay&&this.$overlay.remove(),this.elmt._vegas=null}},t.fn.vegas=function(t){var s,i=arguments,n=!1;if(void 0===t||"object"==typeof t)return this.each(function(){this._vegas||(this._vegas=new e(this,t))});if("string"==typeof t){if(this.each(function(){var e=this._vegas;if(!e)throw new Error("No Vegas applied to this element.");"function"==typeof e[t]&&"_"!==t[0]?s=e[t].apply(e,[].slice.call(i,1)):n=!0}),n)throw new Error('No method "'+t+'" in Vegas.');return void 0!==s?s:this}},t.vegas={},t.vegas.defaults=s,t.vegas.isVideoCompatible=function(){return!/(Android|webOS|Phone|iPad|iPod|BlackBerry|Windows Phone)/i.test(navigator.userAgent)}}(window.jQuery||window.Zepto);
|
2 |
+
//# sourceMappingURL=vegas.min.js.map
|
assets/lib/vegas/vegas.min.js.map
ADDED
@@ -0,0 +1 @@
|
|
|
1 |
+
{"version":3,"sources":["vegas.min.js"],"names":["$","defaults","slide","delay","loop","preload","preloadImage","preloadVideo","timer","overlay","autoplay","shuffle","cover","color","align","valign","firstTransition","firstTransitionDuration","transition","transitionDuration","transitionRegister","animation","animationDuration","animationRegister","slidesToKeep","init","play","pause","walk","slides","videoCache","Vegas","elmt","options","this","settings","extend","vegas","total","length","noshow","paused","ended","$elmt","$timer","$overlay","$slide","timeout","first","transitions","animations","Array","concat","support","objectFit","document","body","style","video","isVideoCompatible","_init","prototype","$wrapper","isBody","tagName","self","_preload","css","clone","children","appendTo","innerHTML","prepend","addClass","append","setTimeout","trigger","_goto","img","i","preloadImages","src","Image","preloadVideos","_video","_random","array","Math","floor","random","_slideShow","next","_options","_timer","state","clearTimeout","removeClass","find","srcs","source","cacheKey","toString","createElement","forEach","appendChild","_fadeOutSound","duration","volume","_fadeInSound","key","undefined","nb","go","$slides","each","get","fadeIn","eq","remove","$inner","$video","videoSettings","muted","mute","after","className","readyState","currentTime","complete","onload","_end","temp","rand","toggle","playing","current","advanced","data","jump","previous","fn","params","apply","value","oldSlides","slice","destroy","_vegas","returns","args","arguments","error","instance","Error","call","test","navigator","userAgent","window","jQuery","Zepto"],"mappings":"CAUA,SAAWA,GACP,YAEA,IAAIC,IACAC,MAAyB,EACzBC,MAAyB,IACzBC,MAAyB,EACzBC,SAAyB,EACzBC,cAAyB,EACzBC,cAAyB,EACzBC,OAAyB,EACzBC,SAAyB,EACzBC,UAAyB,EACzBC,SAAyB,EACzBC,OAAyB,EACzBC,MAAyB,KACzBC,MAAyB,SACzBC,OAAyB,SACzBC,gBAAyB,KACzBC,wBAAyB,KACzBC,WAAyB,OACzBC,mBAAyB,IACzBC,sBACAC,UAAyB,KACzBC,kBAAyB,OACzBC,qBACAC,aAAyB,EACzBC,KAAO,aACPC,KAAO,aACPC,MAAO,aACPC,KAAO,aACPC,WAqBAC,KAEAC,EAAQ,SAAUC,EAAMC,GACxBC,KAAKF,KAAeA,EACpBE,KAAKC,SAAenC,EAAEoC,UAAWnC,EAAUD,EAAEqC,MAAMpC,SAAUgC,GAC7DC,KAAKhC,MAAegC,KAAKC,SAASjC,MAClCgC,KAAKI,MAAeJ,KAAKC,SAASN,OAAOU,OACzCL,KAAKM,OAAeN,KAAKI,MAAQ,EACjCJ,KAAKO,QAAgBP,KAAKC,SAASzB,UAAYwB,KAAKM,OACpDN,KAAKQ,OAAe,EACpBR,KAAKS,MAAe3C,EAAEgC,GACtBE,KAAKU,OAAe,KACpBV,KAAKW,SAAe,KACpBX,KAAKY,OAAe,KACpBZ,KAAKa,QAAe,KACpBb,KAAKc,OAAe,EAEpBd,KAAKe,aACD,OAAQ,QACR,OAAQ,QACR,QAAS,SACT,WAAY,YACZ,OAAQ,QACR,YAAa,aACb,aAAc,cACd,UAAW,WACX,YAAa,aACb,SAAU,UACV,UAAW,WACX,YAAa,aACb,aAAc,eAGlBf,KAAKgB,YACD,WACA,eAAgB,gBAChB,aAAc,iBAAkB,kBAChC,eAAgB,mBAAoB,qBAGpChB,KAAKC,SAASf,6BAA8B+B,SAAU,IACtDjB,KAAKC,SAASf,oBAAuBc,KAAKC,SAASf,qBAGnDc,KAAKC,SAASZ,4BAA6B4B,SAAU,IACrDjB,KAAKC,SAASZ,mBAAsBW,KAAKC,SAASZ,oBAGtDW,KAAKe,YAAcf,KAAKe,YAAYG,OAAOlB,KAAKC,SAASf,oBACzDc,KAAKgB,WAAchB,KAAKgB,WAAWE,OAAOlB,KAAKC,SAASZ,mBAExDW,KAAKmB,SACDC,UAAY,aAAgBC,UAASC,KAAKC,MAC1CvC,WAAY,cAAgBqC,UAASC,KAAKC,OAAS,oBAAsBF,UAASC,KAAKC,MACvFC,MAAY1D,EAAEqC,MAAMsB,qBAGpBzB,KAAKC,SAASxB,WAAY,GAC1BuB,KAAKvB,UAGTuB,KAAK0B,QAGT7B,GAAM8B,WACFD,MAAO,WACH,GAAIE,GACAjB,EACAD,EACAmB,EAAgC,SAAtB7B,KAAKF,KAAKgC,QACpBxD,EAAU0B,KAAKC,SAAS3B,MACxBC,EAAUyB,KAAKC,SAAS1B,QACxBwD,EAAU/B,IAGdA,MAAKgC,WAGAH,IACD7B,KAAKS,MAAMwB,IAAI,SAAUjC,KAAKS,MAAMwB,IAAI,WAExCL,EAAW9D,EAAE,+BACRmE,IAAI,WAAYjC,KAAKS,MAAMwB,IAAI,aAC/BA,IAAI,UAAYjC,KAAKS,MAAMwB,IAAI,YAG/BjC,KAAKS,MAAMwB,IAAI,YAChBL,EACKK,IAAI,cAAkBjC,KAAKS,MAAMwB,IAAI,gBACrCA,IAAI,iBAAkBjC,KAAKS,MAAMwB,IAAI,mBACrCA,IAAI,eAAkBjC,KAAKS,MAAMwB,IAAI,iBACrCA,IAAI,gBAAkBjC,KAAKS,MAAMwB,IAAI,kBAG9CjC,KAAKS,MAAMyB,OAAM,GAAMC,WAAWC,SAASR,GAC3C5B,KAAKF,KAAKuC,UAAY,IAItB/D,GAAS0B,KAAKmB,QAAQnC,aACtB0B,EAAS5C,EAAE,+DACXkC,KAAKU,OAASA,EACdV,KAAKS,MAAM6B,QAAQ5B,IAInBnC,IACAoC,EAAW7C,EAAE,+BAEU,gBAAZS,IACPoC,EAASsB,IAAI,mBAAoB,OAAS1D,EAAU,KAGxDyB,KAAKW,SAAWA,EAChBX,KAAKS,MAAM6B,QAAQ3B,IAIvBX,KAAKS,MAAM8B,SAAS,mBAEfV,GACD7B,KAAKS,MAAM+B,OAAOZ,GAGtBa,WAAW,WACPV,EAAKW,QAAQ,QACbX,EAAKY,MAAMZ,EAAK/D,OAEZ+D,EAAK9B,SAASzB,UACduD,EAAKW,QAAQ,SAElB,IAGPV,SAAU,WACN,GAAIY,GAAKC,CAET,KAAKA,EAAI,EAAGA,EAAI7C,KAAKC,SAASN,OAAOU,OAAQwC,KACrC7C,KAAKC,SAAS9B,SAAW6B,KAAKC,SAAS6C,gBACnC9C,KAAKC,SAASN,OAAOkD,GAAGE,MACxBH,EAAM,GAAII,OACVJ,EAAIG,IAAM/C,KAAKC,SAASN,OAAOkD,GAAGE,MAItC/C,KAAKC,SAAS9B,SAAW6B,KAAKC,SAASgD,gBACnCjD,KAAKmB,QAAQK,OAASxB,KAAKC,SAASN,OAAOkD,GAAGrB,QAC1CxB,KAAKC,SAASN,OAAOkD,GAAGrB,gBAAiBP,OACzCjB,KAAKkD,OAAOlD,KAAKC,SAASN,OAAOkD,GAAGrB,OAEpCxB,KAAKkD,OAAOlD,KAAKC,SAASN,OAAOkD,GAAGrB,MAAMuB,OAO9DI,QAAS,SAAUC,GACf,MAAOA,GAAMC,KAAKC,MAAMD,KAAKE,SAAWH,EAAM/C,UAGlDmD,WAAY,WACR,GAAIzB,GAAO/B,IAEPA,MAAKI,MAAQ,IAAMJ,KAAKQ,QAAUR,KAAKO,SAAWP,KAAKM,SACvDN,KAAKa,QAAU4B,WAAW,WACtBV,EAAK0B,QACNzD,KAAK0D,SAAS,YAIzBC,OAAQ,SAAUC,GACd,GAAI7B,GAAO/B,IAEX6D,cAAa7D,KAAKa,SAEbb,KAAKU,SAIVV,KAAKU,OACAoD,YAAY,uBACRC,KAAK,OACD9B,IAAI,sBAAuB,OAEpCjC,KAAKQ,OAASR,KAAKO,QAAUP,KAAKM,QAIlCsD,GACAnB,WAAW,WACRV,EAAKrB,OACH6B,SAAS,uBACLwB,KAAK,OACD9B,IAAI,sBAAuBF,EAAK2B,SAAS,SAAW,IAAM,OACpE,OAIXR,OAAQ,SAAUc,GACd,GAAIxC,GACAyC,EACAC,EAAWF,EAAKG,UAEpB,OAAIvE,GAAWsE,GACJtE,EAAWsE,IAGlBF,YAAgB/C,SAAU,IAC1B+C,GAASA,IAGbxC,EAAQH,SAAS+C,cAAc,SAC/B5C,EAAMrD,SAAU,EAEhB6F,EAAKK,QAAQ,SAAUtB,GACnBkB,EAAS5C,SAAS+C,cAAc,UAChCH,EAAOlB,IAAMA,EACbvB,EAAM8C,YAAYL,KAGtBrE,EAAWsE,GAAY1C,EAEhBA,IAGX+C,cAAe,SAAU/C,EAAOgD,GAC5B,GAAIzC,GAAS/B,KACT/B,EAASuG,EAAW,GACpBC,EAASjD,EAAMiD,OAAS,GAExBA,GAAS,GACTjD,EAAMiD,OAASA,EAEfhC,WAAW,WACPV,EAAKwC,cAAc/C,EAAOgD,IAC3BvG,IAEHuD,EAAM/B,SAIdiF,aAAc,SAAUlD,EAAOgD,GAC3B,GAAIzC,GAAS/B,KACT/B,EAASuG,EAAW,GACpBC,EAASjD,EAAMiD,OAAS,GAExBA,GAAS,IACTjD,EAAMiD,OAASA,EAEfhC,WAAW,WACPV,EAAK2C,aAAalD,EAAOgD,IAC1BvG,KAIXyF,SAAU,SAAUiB,EAAK9B,GAKrB,MAJU+B,UAAN/B,IACAA,EAAI7C,KAAKhC,OAGwB4G,SAAjC5E,KAAKC,SAASN,OAAOkD,GAAG8B,GACjB3E,KAAKC,SAASN,OAAOkD,GAAG8B,GAG5B3E,KAAKC,SAAS0E,IAGzBhC,MAAO,SAAUkC,GAwKb,QAASC,KACL/C,EAAK4B,QAAO,GAEZlB,WAAW,WACHzD,IACI+C,EAAKZ,QAAQnC,YACb+F,EACK9C,IAAI,aAAc,OAAShD,EAAqB,MAChDsD,SAAS,oBAAsBvD,EAAa,QAEjD+F,EAAQC,KAAK,WACT,GAAIxD,GAAQuD,EAAQhB,KAAK,SAASkB,IAAI,EAElCzD,KACAA,EAAMiD,OAAS,EACf1C,EAAKwC,cAAc/C,EAAOvC,MAIlC2B,EACKqB,IAAI,aAAc,OAAShD,EAAqB,MAChDsD,SAAS,oBAAsBvD,EAAa,QAEjD4B,EAAOsE,OAAOjG,GAItB,KAAK,GAAI4D,GAAI,EAAGA,EAAIkC,EAAQ1E,OAAS0B,EAAK9B,SAASX,aAAcuD,IAC5DkC,EAAQI,GAAGtC,GAAGuC,QAGnBrD,GAAKW,QAAQ,QACbX,EAAKyB,cACN,KAxMiC,mBAA7BxD,MAAKC,SAASN,OAAOkF,KAC5BA,EAAK,GAGT7E,KAAKhC,MAAQ6G,CAEb,IAAIjE,GACAyE,EACAC,EAWA9D,EACAoB,EAXAmC,EAAgB/E,KAAKS,MAAM0B,SAAS,gBACpCY,EAAgB/C,KAAKC,SAASN,OAAOkF,GAAI9B,IACzCwC,EAAgBvF,KAAKC,SAASN,OAAOkF,GAAIrD,MACzCvD,EAAgB+B,KAAK0D,SAAS,SAC9B9E,EAAgBoB,KAAK0D,SAAS,SAC9B7E,EAAgBmB,KAAK0D,SAAS,UAC9BhF,EAAgBsB,KAAK0D,SAAS,SAC9B/E,EAAgBqB,KAAK0D,SAAS,UAAY1D,KAAKS,MAAMwB,IAAI,oBACzDF,EAAgB/B,KAChBI,EAAgB2E,EAAQ1E,OAIxBrB,EAAqBgB,KAAK0D,SAAS,cACnCzE,EAAqBe,KAAK0D,SAAS,sBACnCvE,EAAqBa,KAAK0D,SAAS,aACnCtE,EAAqBY,KAAK0D,SAAS,oBAEnC1D,MAAKC,SAASnB,iBAAmBkB,KAAKc,QACtC9B,EAAagB,KAAKC,SAASnB,iBAAmBE,GAG9CgB,KAAKC,SAASlB,yBAA2BiB,KAAKc,QAC9C7B,EAAqBe,KAAKC,SAASlB,yBAA2BE,GAG9De,KAAKc,QACLd,KAAKc,OAAQ,GAGH,WAAVpC,IACIA,KAAU,EACVA,EAAQ,QACDA,KAAU,IACjBA,EAAQ,aAIG,WAAfM,GAA2BA,YAAsBiC,UAE7CjC,EADAA,YAAsBiC,OACTjB,KAAKmD,QAAQnE,GAEbgB,KAAKmD,QAAQnD,KAAKe,eAIrB,WAAd5B,GAA0BA,YAAqB8B,UAE3C9B,EADAA,YAAqB8B,OACTjB,KAAKmD,QAAQhE,GAEba,KAAKmD,QAAQnD,KAAKgB,cAIX,SAAvB/B,GAAiCA,EAAqBhB,KACtDgB,EAAqBhB,GAGC,SAAtBmB,IACAA,EAAoBnB,GAGxB2C,EAAS9C,EAAE,mCAEPkC,KAAKmB,QAAQnC,YAAcA,GAC3B4B,EAAO2B,SAAS,oBAAsBvD,GAKtCgB,KAAKmB,QAAQK,OAAS+D,GAElB/D,EADA+D,YAAyBtE,OACjBjB,KAAKkD,OAAOqC,GAEZvF,KAAKkD,OAAOqC,EAAcxC,KAGtCvB,EAAMtD,KAA+B0G,SAAvBW,EAAcrH,MAAqBqH,EAAcrH,KAC/DsD,EAAMgE,MAA+BZ,SAAvBW,EAAcE,MAAqBF,EAAcE,KAE3DjE,EAAMgE,SAAU,GAChBhE,EAAMiD,OAAS,EACfzE,KAAK0E,aAAalD,EAAOvC,IAEzBuC,EAAM/B,QAGV6F,EAASxH,EAAE0D,GACNe,SAAS,eACTN,IAAI,mBAAoBtD,GAEzBqB,KAAKmB,QAAQC,UACbkE,EACKrD,IAAI,kBAAmBrD,EAAQ,IAAMC,GACrCoD,IAAI,aAAcvD,GAClBuD,IAAI,QAAU,QACdA,IAAI,SAAU,QACF,YAAVvD,GACP4G,EACKrD,IAAI,QAAU,QACdA,IAAI,SAAU,QAGvBrB,EAAO4B,OAAO8C,KAKd1C,EAAM,GAAII,OAEVqC,EAASvH,EAAE,yCACNmE,IAAI,mBAAuB,QAAUc,EAAM,MAC3Cd,IAAI,mBAAuBtD,GAC3BsD,IAAI,sBAAuBrD,EAAQ,IAAMC,GAEhC,WAAVH,EACA2G,EAAOpD,IAAI,oBAAqB,UAEhCoD,EAAOpD,IAAI,kBAAmBvD,GAG9BsB,KAAKmB,QAAQnC,YAAcG,GAC3BkG,EACK9C,SAAS,mBAAqBpD,GAC9B8C,IAAI,qBAAuB7C,EAAoB,MAGxDwB,EAAO4B,OAAO6C,IAGbrF,KAAKmB,QAAQnC,YACd4B,EAAOqB,IAAI,UAAW,QAGtB7B,EACA2E,EAAQI,GAAG/E,EAAQ,GAAGsF,MAAM9E,GAE5BZ,KAAKS,MAAM6B,QAAQ1B,GAGvBmE,EACK9C,IAAI,aAAc,WAClB+C,KAAK,WACFhF,KAAK2F,UAAa,cAEG,UAAjB3F,KAAK8B,UACL9B,KAAK2F,WAAa,gBAGlB3G,IACAgB,KAAK2F,WAAa,qBAAuB3G,EACzCgB,KAAK2F,WAAa,qBAAuB3G,EAAa,SAKlE+C,EAAK4B,QAAO,GAqCRnC,GACyB,IAArBA,EAAMoE,aACNpE,EAAMqE,YAAc,GAGxBrE,EAAMhC,OACNsF,MAEAlC,EAAIG,IAAMA,EAENH,EAAIkD,SACJhB,IAEAlC,EAAImD,OAASjB,IAKzBkB,KAAM,WACFhG,KAAKQ,OAAQ,EACbR,KAAK2D,QAAO,GACZ3D,KAAK0C,QAAQ,QAGjBjE,QAAS,WAIL,IAAK,GAHDwH,GACAC,EAEKrD,EAAI7C,KAAKI,MAAQ,EAAGyC,EAAI,EAAGA,IAChCqD,EAAO7C,KAAKC,MAAMD,KAAKE,UAAYV,EAAI,IACvCoD,EAAOjG,KAAKC,SAASN,OAAOkD,GAE5B7C,KAAKC,SAASN,OAAOkD,GAAK7C,KAAKC,SAASN,OAAOuG,GAC/ClG,KAAKC,SAASN,OAAOuG,GAAQD,GAIrCzG,KAAM,WACEQ,KAAKO,SACLP,KAAKO,QAAS,EACdP,KAAKyD,OACLzD,KAAK0C,QAAQ,UAIrBjD,MAAO,WACHO,KAAK2D,QAAO,GACZ3D,KAAKO,QAAS,EACdP,KAAK0C,QAAQ,UAGjByD,OAAQ,WACAnG,KAAKO,OACLP,KAAKR,OAELQ,KAAKP,SAIb2G,QAAS,WACL,OAAQpG,KAAKO,SAAWP,KAAKM,QAGjC+F,QAAS,SAAUC,GACf,MAAIA,IAEItI,MAAOgC,KAAKhC,MACZuI,KAAOvG,KAAKC,SAASN,OAAOK,KAAKhC,QAGlCgC,KAAKhC,OAGhBwI,KAAM,SAAU3B,GACRA,EAAK,GAAKA,EAAK7E,KAAKI,MAAQ,GAAKyE,IAAO7E,KAAKhC,QAIjDgC,KAAKhC,MAAQ6G,EACb7E,KAAK2C,MAAM3C,KAAKhC,SAGpByF,KAAM,WAGF,GAFAzD,KAAKhC,QAEDgC,KAAKhC,OAASgC,KAAKI,MAAO,CAC1B,IAAKJ,KAAKC,SAAS/B,KACf,MAAO8B,MAAKgG,MAGhBhG,MAAKhC,MAAQ,EAGjBgC,KAAK2C,MAAM3C,KAAKhC,QAGpByI,SAAU,WAGN,GAFAzG,KAAKhC,QAEDgC,KAAKhC,MAAQ,EAAG,CAChB,IAAKgC,KAAKC,SAAS/B,KAEf,WADA8B,MAAKhC,OAGLgC,MAAKhC,MAAQgC,KAAKI,MAAQ,EAIlCJ,KAAK2C,MAAM3C,KAAKhC,QAGpB0E,QAAS,SAAUgE,GACf,GAAIC,KAGAA,GADO,SAAPD,GACW1G,KAAKC,WAGZD,KAAKhC,MACLgC,KAAKC,SAASN,OAAOK,KAAKhC,QAIlCgC,KAAKS,MAAMiC,QAAQ,QAAUgE,EAAIC,GAEA,kBAAtB3G,MAAKC,SAASyG,IACrB1G,KAAKC,SAASyG,GAAIE,MAAM5G,KAAKS,MAAOkG,IAI5C5G,QAAS,SAAU4E,EAAKkC,GACpB,GAAIC,GAAY9G,KAAKC,SAASN,OAAOoH,OAErC,IAAmB,gBAARpC,GACP3E,KAAKC,SAAWnC,EAAEoC,UAAWnC,EAAUD,EAAEqC,MAAMpC,SAAU4G,OACtD,CAAA,GAAmB,gBAARA,GAMd,MAAO3E,MAAKC,QALZ,IAAc2E,SAAViC,EACA,MAAO7G,MAAKC,SAAS0E,EAEzB3E,MAAKC,SAAS0E,GAAOkC,EAMrB7G,KAAKC,SAASN,SAAWmH,IACzB9G,KAAKI,MAASJ,KAAKC,SAASN,OAAOU,OACnCL,KAAKM,OAASN,KAAKI,MAAQ,EAC3BJ,KAAKgC,aAIbgF,QAAS,WACLnD,aAAa7D,KAAKa,SAElBb,KAAKS,MAAMqD,YAAY,mBACvB9D,KAAKS,MAAMsD,KAAK,kBAAkBqB,SAClCpF,KAAKS,MAAMsD,KAAK,oBAAoB7B,OAAM,GAAMC,WAAWC,SAASpC,KAAKS,OACzET,KAAKS,MAAMsD,KAAK,oBAAoBqB,SAEhCpF,KAAKC,SAAS3B,OACd0B,KAAKU,OAAO0E,SAGZpF,KAAKC,SAAS1B,SACdyB,KAAKW,SAASyE,SAGlBpF,KAAKF,KAAKmH,OAAS,OAI3BnJ,EAAE4I,GAAGvG,MAAQ,SAASJ,GAClB,GAEImH,GAFAC,EAAOC,UACPC,GAAQ,CAGZ,IAAgBzC,SAAZ7E,GAA4C,gBAAZA,GAChC,MAAOC,MAAKgF,KAAK,WACRhF,KAAKiH,SACNjH,KAAKiH,OAAS,GAAIpH,GAAMG,KAAMD,KAGnC,IAAuB,gBAAZA,GAAsB,CAepC,GAdAC,KAAKgF,KAAK,WACN,GAAIsC,GAAWtH,KAAKiH,MAEpB,KAAKK,EACD,KAAM,IAAIC,OAAM,oCAGa,mBAAtBD,GAASvH,IAA0C,MAAfA,EAAQ,GACnDmH,EAAUI,EAASvH,GAAS6G,MAAMU,KAAaP,MAAMS,KAAKL,EAAM,IAEhEE,GAAQ,IAIZA,EACA,KAAM,IAAIE,OAAM,cAAgBxH,EAAU,cAG9C,OAAmB6E,UAAZsC,EAAwBA,EAAUlH,OAIjDlC,EAAEqC,SACFrC,EAAEqC,MAAMpC,SAAWA,EAEnBD,EAAEqC,MAAMsB,kBAAoB,WACxB,OAAQ,4DAA4DgG,KAAKC,UAAUC,aAGxFC,OAAOC,QAAUD,OAAOE","file":"vegas.min.js","sourcesContent":["/*!-----------------------------------------------------------------------------\n * Vegas - Fullscreen Backgrounds and Slideshows.\n * v2.4.0 - built 2017-01-04\n * Licensed under the MIT License.\n * http://vegas.jaysalvat.com/\n * ----------------------------------------------------------------------------\n * Copyright (C) 2010-2017 Jay Salvat\n * http://jaysalvat.com/\n * --------------------------------------------------------------------------*/\n\n(function ($) {\n 'use strict';\n\n var defaults = {\n slide: 0,\n delay: 5000,\n loop: true,\n preload: false,\n preloadImage: false,\n preloadVideo: false,\n timer: true,\n overlay: false,\n autoplay: true,\n shuffle: false,\n cover: true,\n color: null,\n align: 'center',\n valign: 'center',\n firstTransition: null,\n firstTransitionDuration: null,\n transition: 'fade',\n transitionDuration: 1000,\n transitionRegister: [],\n animation: null,\n animationDuration: 'auto',\n animationRegister: [],\n slidesToKeep: 1,\n init: function () {},\n play: function () {},\n pause: function () {},\n walk: function () {},\n slides: [\n // {\n // src: null,\n // color: null,\n // delay: null,\n // align: null,\n // valign: null,\n // transition: null,\n // transitionDuration: null,\n // animation: null,\n // animationDuration: null,\n // cover: true,\n // video: {\n // src: [],\n // mute: true,\n // loop: true\n // }\n // ...\n ]\n };\n\n var videoCache = {};\n\n var Vegas = function (elmt, options) {\n this.elmt = elmt;\n this.settings = $.extend({}, defaults, $.vegas.defaults, options);\n this.slide = this.settings.slide;\n this.total = this.settings.slides.length;\n this.noshow = this.total < 2;\n this.paused = !this.settings.autoplay || this.noshow;\n this.ended = false;\n this.$elmt = $(elmt);\n this.$timer = null;\n this.$overlay = null;\n this.$slide = null;\n this.timeout = null;\n this.first = true;\n\n this.transitions = [\n 'fade', 'fade2',\n 'blur', 'blur2',\n 'flash', 'flash2',\n 'negative', 'negative2',\n 'burn', 'burn2',\n 'slideLeft', 'slideLeft2',\n 'slideRight', 'slideRight2',\n 'slideUp', 'slideUp2',\n 'slideDown', 'slideDown2',\n 'zoomIn', 'zoomIn2',\n 'zoomOut', 'zoomOut2',\n 'swirlLeft', 'swirlLeft2',\n 'swirlRight', 'swirlRight2'\n ];\n\n this.animations = [\n 'kenburns',\n 'kenburnsLeft', 'kenburnsRight',\n 'kenburnsUp', 'kenburnsUpLeft', 'kenburnsUpRight',\n 'kenburnsDown', 'kenburnsDownLeft', 'kenburnsDownRight'\n ];\n\n if (this.settings.transitionRegister instanceof Array === false) {\n this.settings.transitionRegister = [ this.settings.transitionRegister ];\n }\n\n if (this.settings.animationRegister instanceof Array === false) {\n this.settings.animationRegister = [ this.settings.animationRegister ];\n }\n\n this.transitions = this.transitions.concat(this.settings.transitionRegister);\n this.animations = this.animations.concat(this.settings.animationRegister);\n\n this.support = {\n objectFit: 'objectFit' in document.body.style,\n transition: 'transition' in document.body.style || 'WebkitTransition' in document.body.style,\n video: $.vegas.isVideoCompatible()\n };\n\n if (this.settings.shuffle === true) {\n this.shuffle();\n }\n\n this._init();\n };\n\n Vegas.prototype = {\n _init: function () {\n var $wrapper,\n $overlay,\n $timer,\n isBody = this.elmt.tagName === 'BODY',\n timer = this.settings.timer,\n overlay = this.settings.overlay,\n self = this;\n\n // Preloading\n this._preload();\n\n // Wrapper with content\n if (!isBody) {\n this.$elmt.css('height', this.$elmt.css('height'));\n\n $wrapper = $('<div class=\"vegas-wrapper\">')\n .css('overflow', this.$elmt.css('overflow'))\n .css('padding', this.$elmt.css('padding'));\n\n // Some browsers don't compute padding shorthand\n if (!this.$elmt.css('padding')) {\n $wrapper\n .css('padding-top', this.$elmt.css('padding-top'))\n .css('padding-bottom', this.$elmt.css('padding-bottom'))\n .css('padding-left', this.$elmt.css('padding-left'))\n .css('padding-right', this.$elmt.css('padding-right'));\n }\n\n this.$elmt.clone(true).children().appendTo($wrapper);\n this.elmt.innerHTML = '';\n }\n\n // Timer\n if (timer && this.support.transition) {\n $timer = $('<div class=\"vegas-timer\"><div class=\"vegas-timer-progress\">');\n this.$timer = $timer;\n this.$elmt.prepend($timer);\n }\n\n // Overlay\n if (overlay) {\n $overlay = $('<div class=\"vegas-overlay\">');\n\n if (typeof overlay === 'string') {\n $overlay.css('background-image', 'url(' + overlay + ')');\n }\n\n this.$overlay = $overlay;\n this.$elmt.prepend($overlay);\n }\n\n // Container\n this.$elmt.addClass('vegas-container');\n\n if (!isBody) {\n this.$elmt.append($wrapper);\n }\n\n setTimeout(function () {\n self.trigger('init');\n self._goto(self.slide);\n\n if (self.settings.autoplay) {\n self.trigger('play');\n }\n }, 1);\n },\n\n _preload: function () {\n var img, i;\n\n for (i = 0; i < this.settings.slides.length; i++) {\n if (this.settings.preload || this.settings.preloadImages) {\n if (this.settings.slides[i].src) {\n img = new Image();\n img.src = this.settings.slides[i].src;\n }\n }\n\n if (this.settings.preload || this.settings.preloadVideos) {\n if (this.support.video && this.settings.slides[i].video) {\n if (this.settings.slides[i].video instanceof Array) {\n this._video(this.settings.slides[i].video);\n } else {\n this._video(this.settings.slides[i].video.src);\n }\n }\n }\n }\n },\n\n _random: function (array) {\n return array[Math.floor(Math.random() * array.length)];\n },\n\n _slideShow: function () {\n var self = this;\n\n if (this.total > 1 && !this.ended && !this.paused && !this.noshow) {\n this.timeout = setTimeout(function () {\n self.next();\n }, this._options('delay'));\n }\n },\n\n _timer: function (state) {\n var self = this;\n\n clearTimeout(this.timeout);\n\n if (!this.$timer) {\n return;\n }\n\n this.$timer\n .removeClass('vegas-timer-running')\n .find('div')\n .css('transition-duration', '0ms');\n\n if (this.ended || this.paused || this.noshow) {\n return;\n }\n\n if (state) {\n setTimeout(function () {\n self.$timer\n .addClass('vegas-timer-running')\n .find('div')\n .css('transition-duration', self._options('delay') - 100 + 'ms');\n }, 100);\n }\n },\n\n _video: function (srcs) {\n var video,\n source,\n cacheKey = srcs.toString();\n\n if (videoCache[cacheKey]) {\n return videoCache[cacheKey];\n }\n\n if (srcs instanceof Array === false) {\n srcs = [ srcs ];\n }\n\n video = document.createElement('video');\n video.preload = true;\n\n srcs.forEach(function (src) {\n source = document.createElement('source');\n source.src = src;\n video.appendChild(source);\n });\n\n videoCache[cacheKey] = video;\n\n return video;\n },\n\n _fadeOutSound: function (video, duration) {\n var self = this,\n delay = duration / 10,\n volume = video.volume - 0.09;\n\n if (volume > 0) {\n video.volume = volume;\n\n setTimeout(function () {\n self._fadeOutSound(video, duration);\n }, delay);\n } else {\n video.pause();\n }\n },\n\n _fadeInSound: function (video, duration) {\n var self = this,\n delay = duration / 10,\n volume = video.volume + 0.09;\n\n if (volume < 1) {\n video.volume = volume;\n\n setTimeout(function () {\n self._fadeInSound(video, duration);\n }, delay);\n }\n },\n\n _options: function (key, i) {\n if (i === undefined) {\n i = this.slide;\n }\n\n if (this.settings.slides[i][key] !== undefined) {\n return this.settings.slides[i][key];\n }\n\n return this.settings[key];\n },\n\n _goto: function (nb) {\n if (typeof this.settings.slides[nb] === 'undefined') {\n nb = 0;\n }\n\n this.slide = nb;\n\n var $slide,\n $inner,\n $video,\n $slides = this.$elmt.children('.vegas-slide'),\n src = this.settings.slides[nb].src,\n videoSettings = this.settings.slides[nb].video,\n delay = this._options('delay'),\n align = this._options('align'),\n valign = this._options('valign'),\n cover = this._options('cover'),\n color = this._options('color') || this.$elmt.css('background-color'),\n self = this,\n total = $slides.length,\n video,\n img;\n\n var transition = this._options('transition'),\n transitionDuration = this._options('transitionDuration'),\n animation = this._options('animation'),\n animationDuration = this._options('animationDuration');\n\n if (this.settings.firstTransition && this.first) {\n transition = this.settings.firstTransition || transition;\n }\n\n if (this.settings.firstTransitionDuration && this.first) {\n transitionDuration = this.settings.firstTransitionDuration || transitionDuration;\n }\n\n if (this.first) {\n this.first = false;\n }\n\n if (cover !== 'repeat') {\n if (cover === true) {\n cover = 'cover';\n } else if (cover === false) {\n cover = 'contain';\n }\n }\n\n if (transition === 'random' || transition instanceof Array) {\n if (transition instanceof Array) {\n transition = this._random(transition);\n } else {\n transition = this._random(this.transitions);\n }\n }\n\n if (animation === 'random' || animation instanceof Array) {\n if (animation instanceof Array) {\n animation = this._random(animation);\n } else {\n animation = this._random(this.animations);\n }\n }\n\n if (transitionDuration === 'auto' || transitionDuration > delay) {\n transitionDuration = delay;\n }\n\n if (animationDuration === 'auto') {\n animationDuration = delay;\n }\n\n $slide = $('<div class=\"vegas-slide\"></div>');\n\n if (this.support.transition && transition) {\n $slide.addClass('vegas-transition-' + transition);\n }\n\n // Video\n\n if (this.support.video && videoSettings) {\n if (videoSettings instanceof Array) {\n video = this._video(videoSettings);\n } else {\n video = this._video(videoSettings.src);\n }\n\n video.loop = videoSettings.loop !== undefined ? videoSettings.loop : true;\n video.muted = videoSettings.mute !== undefined ? videoSettings.mute : true;\n\n if (video.muted === false) {\n video.volume = 0;\n this._fadeInSound(video, transitionDuration);\n } else {\n video.pause();\n }\n\n $video = $(video)\n .addClass('vegas-video')\n .css('background-color', color);\n\n if (this.support.objectFit) {\n $video\n .css('object-position', align + ' ' + valign)\n .css('object-fit', cover)\n .css('width', '100%')\n .css('height', '100%');\n } else if (cover === 'contain') {\n $video\n .css('width', '100%')\n .css('height', '100%');\n }\n\n $slide.append($video);\n\n // Image\n\n } else {\n img = new Image();\n\n $inner = $('<div class=\"vegas-slide-inner\"></div>')\n .css('background-image', 'url(\"' + src + '\")')\n .css('background-color', color)\n .css('background-position', align + ' ' + valign);\n\n if (cover === 'repeat') {\n $inner.css('background-repeat', 'repeat');\n } else {\n $inner.css('background-size', cover);\n }\n\n if (this.support.transition && animation) {\n $inner\n .addClass('vegas-animation-' + animation)\n .css('animation-duration', animationDuration + 'ms');\n }\n\n $slide.append($inner);\n }\n\n if (!this.support.transition) {\n $slide.css('display', 'none');\n }\n\n if (total) {\n $slides.eq(total - 1).after($slide);\n } else {\n this.$elmt.prepend($slide);\n }\n\n $slides\n .css('transition', 'all 0ms')\n .each(function () {\n this.className = 'vegas-slide';\n\n if (this.tagName === 'VIDEO') {\n this.className += ' vegas-video'; \n }\n\n if (transition) {\n this.className += ' vegas-transition-' + transition;\n this.className += ' vegas-transition-' + transition + '-in';\n }\n }\n );\n\n self._timer(false);\n\n function go () {\n self._timer(true);\n\n setTimeout(function () {\n if (transition) {\n if (self.support.transition) {\n $slides\n .css('transition', 'all ' + transitionDuration + 'ms')\n .addClass('vegas-transition-' + transition + '-out');\n\n $slides.each(function () {\n var video = $slides.find('video').get(0);\n\n if (video) {\n video.volume = 1;\n self._fadeOutSound(video, transitionDuration);\n }\n });\n\n $slide\n .css('transition', 'all ' + transitionDuration + 'ms')\n .addClass('vegas-transition-' + transition + '-in');\n } else {\n $slide.fadeIn(transitionDuration);\n }\n }\n\n for (var i = 0; i < $slides.length - self.settings.slidesToKeep; i++) {\n $slides.eq(i).remove();\n }\n\n self.trigger('walk');\n self._slideShow();\n }, 100);\n }\n if (video) {\n if (video.readyState === 4) {\n video.currentTime = 0;\n }\n\n video.play();\n go();\n } else {\n img.src = src;\n\n if (img.complete) {\n go();\n } else {\n img.onload = go;\n }\n }\n },\n\n _end: function () {\n this.ended = true;\n this._timer(false);\n this.trigger('end');\n },\n\n shuffle: function () {\n var temp,\n rand;\n\n for (var i = this.total - 1; i > 0; i--) {\n rand = Math.floor(Math.random() * (i + 1));\n temp = this.settings.slides[i];\n\n this.settings.slides[i] = this.settings.slides[rand];\n this.settings.slides[rand] = temp;\n }\n },\n\n play: function () {\n if (this.paused) {\n this.paused = false;\n this.next();\n this.trigger('play');\n }\n },\n\n pause: function () {\n this._timer(false);\n this.paused = true;\n this.trigger('pause');\n },\n\n toggle: function () {\n if (this.paused) {\n this.play();\n } else {\n this.pause();\n }\n },\n\n playing: function () {\n return !this.paused && !this.noshow;\n },\n\n current: function (advanced) {\n if (advanced) {\n return {\n slide: this.slide,\n data: this.settings.slides[this.slide]\n };\n }\n return this.slide;\n },\n\n jump: function (nb) {\n if (nb < 0 || nb > this.total - 1 || nb === this.slide) {\n return;\n }\n\n this.slide = nb;\n this._goto(this.slide);\n },\n\n next: function () {\n this.slide++;\n\n if (this.slide >= this.total) {\n if (!this.settings.loop) {\n return this._end();\n }\n\n this.slide = 0;\n }\n\n this._goto(this.slide);\n },\n\n previous: function () {\n this.slide--;\n\n if (this.slide < 0) {\n if (!this.settings.loop) {\n this.slide++;\n return;\n } else {\n this.slide = this.total - 1;\n }\n }\n\n this._goto(this.slide);\n },\n\n trigger: function (fn) {\n var params = [];\n\n if (fn === 'init') {\n params = [ this.settings ];\n } else {\n params = [\n this.slide,\n this.settings.slides[this.slide]\n ];\n }\n\n this.$elmt.trigger('vegas' + fn, params);\n\n if (typeof this.settings[fn] === 'function') {\n this.settings[fn].apply(this.$elmt, params);\n }\n },\n\n options: function (key, value) {\n var oldSlides = this.settings.slides.slice();\n\n if (typeof key === 'object') {\n this.settings = $.extend({}, defaults, $.vegas.defaults, key);\n } else if (typeof key === 'string') {\n if (value === undefined) {\n return this.settings[key];\n }\n this.settings[key] = value;\n } else {\n return this.settings;\n }\n\n // In case slides have changed\n if (this.settings.slides !== oldSlides) {\n this.total = this.settings.slides.length;\n this.noshow = this.total < 2;\n this._preload();\n }\n },\n\n destroy: function () {\n clearTimeout(this.timeout);\n\n this.$elmt.removeClass('vegas-container');\n this.$elmt.find('> .vegas-slide').remove();\n this.$elmt.find('> .vegas-wrapper').clone(true).children().appendTo(this.$elmt);\n this.$elmt.find('> .vegas-wrapper').remove();\n\n if (this.settings.timer) {\n this.$timer.remove();\n }\n\n if (this.settings.overlay) {\n this.$overlay.remove();\n }\n\n this.elmt._vegas = null;\n }\n };\n\n $.fn.vegas = function(options) {\n var args = arguments,\n error = false,\n returns;\n\n if (options === undefined || typeof options === 'object') {\n return this.each(function () {\n if (!this._vegas) {\n this._vegas = new Vegas(this, options);\n }\n });\n } else if (typeof options === 'string') {\n this.each(function () {\n var instance = this._vegas;\n\n if (!instance) {\n throw new Error('No Vegas applied to this element.');\n }\n\n if (typeof instance[options] === 'function' && options[0] !== '_') {\n returns = instance[options].apply(instance, [].slice.call(args, 1));\n } else {\n error = true;\n }\n });\n\n if (error) {\n throw new Error('No method \"' + options + '\" in Vegas.');\n }\n\n return returns !== undefined ? returns : this;\n }\n };\n\n $.vegas = {};\n $.vegas.defaults = defaults;\n\n $.vegas.isVideoCompatible = function () {\n return !/(Android|webOS|Phone|iPad|iPod|BlackBerry|Windows Phone)/i.test(navigator.userAgent);\n };\n\n})(window.jQuery || window.Zepto);\n"]}
|
elementor-addon-elements.php
CHANGED
@@ -1,108 +1,117 @@
|
|
1 |
-
<?php
|
2 |
-
/**
|
3 |
-
* Plugin Name: Elementor Addon Elements
|
4 |
-
* Description: Add new elements to Elementor page builder plugin.
|
5 |
-
* Plugin URI: http://www.
|
6 |
-
* Author: WebTechStreet
|
7 |
-
* Version: 1.
|
8 |
-
* Author URI: http://www.webtchstreet.com/
|
9 |
-
*
|
10 |
-
* Text Domain: wts-eae
|
11 |
-
*/
|
12 |
-
|
13 |
-
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
14 |
-
|
15 |
-
define( 'ELEMENTOR_ADDON_URL', plugins_url( '/', __FILE__ ) );
|
16 |
-
define( 'ELEMENTOR_ADDON_PATH', plugin_dir_path( __FILE__ ) );
|
17 |
-
|
18 |
-
|
19 |
-
require_once ELEMENTOR_ADDON_PATH.'inc/elementor-helper.php';
|
20 |
-
|
21 |
-
if(is_admin()){
|
22 |
-
require_once ELEMENTOR_ADDON_PATH. 'inc/admin/settings-page.php';
|
23 |
-
require_once ELEMENTOR_ADDON_PATH. 'inc/admin/controls.php';
|
24 |
-
require_once ELEMENTOR_ADDON_PATH. 'inc/admin/Settings.php';
|
25 |
-
}
|
26 |
-
|
27 |
-
|
28 |
-
function add_new_elements(){
|
29 |
-
|
30 |
-
|
31 |
-
require_once ELEMENTOR_ADDON_PATH.'inc/helper.php';
|
32 |
-
|
33 |
-
// load elements
|
34 |
-
require_once ELEMENTOR_ADDON_PATH.'elements/textseparator.php';
|
35 |
-
require_once ELEMENTOR_ADDON_PATH.'elements/pricetable.php';
|
36 |
-
require_once ELEMENTOR_ADDON_PATH.'elements/flipbox.php';
|
37 |
-
require_once ELEMENTOR_ADDON_PATH.'elements/shape-separator.php';
|
38 |
-
require_once ELEMENTOR_ADDON_PATH.'elements/post-list.php';
|
39 |
-
require_once ELEMENTOR_ADDON_PATH.'elements/animated-text.php';
|
40 |
-
require_once ELEMENTOR_ADDON_PATH.'elements/splittext.php';
|
41 |
-
|
42 |
-
require_once ELEMENTOR_ADDON_PATH.'elements/twitter.php';
|
43 |
-
|
44 |
-
require_once ELEMENTOR_ADDON_PATH.'elements/gmap.php';
|
45 |
-
|
46 |
-
require_once ELEMENTOR_ADDON_PATH.'elements/image-compare.php';
|
47 |
-
|
48 |
-
|
49 |
-
|
50 |
-
|
51 |
-
|
52 |
-
|
53 |
-
|
54 |
-
|
55 |
-
|
56 |
-
|
57 |
-
|
58 |
-
|
59 |
-
|
60 |
-
|
61 |
-
|
62 |
-
|
63 |
-
|
64 |
-
|
65 |
-
|
66 |
-
|
67 |
-
|
68 |
-
|
69 |
-
|
70 |
-
|
71 |
-
|
72 |
-
|
73 |
-
|
74 |
-
|
75 |
-
|
76 |
-
|
77 |
-
|
78 |
-
|
79 |
-
|
80 |
-
|
81 |
-
|
82 |
-
|
83 |
-
|
84 |
-
|
85 |
-
|
86 |
-
|
87 |
-
|
88 |
-
|
89 |
-
|
90 |
-
|
91 |
-
|
92 |
-
function
|
93 |
-
|
94 |
-
|
95 |
-
|
96 |
-
|
97 |
-
|
98 |
-
|
99 |
-
|
100 |
-
|
101 |
-
|
102 |
-
|
103 |
-
|
104 |
-
|
105 |
-
|
106 |
-
|
107 |
-
|
108 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
<?php
|
2 |
+
/**
|
3 |
+
* Plugin Name: Elementor Addon Elements
|
4 |
+
* Description: Add new elements to Elementor page builder plugin.
|
5 |
+
* Plugin URI: http://www.webtechstreet.com/
|
6 |
+
* Author: WebTechStreet
|
7 |
+
* Version: 1.2
|
8 |
+
* Author URI: http://www.webtchstreet.com/
|
9 |
+
*
|
10 |
+
* Text Domain: wts-eae
|
11 |
+
*/
|
12 |
+
|
13 |
+
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
14 |
+
|
15 |
+
define( 'ELEMENTOR_ADDON_URL', plugins_url( '/', __FILE__ ) );
|
16 |
+
define( 'ELEMENTOR_ADDON_PATH', plugin_dir_path( __FILE__ ) );
|
17 |
+
|
18 |
+
|
19 |
+
require_once ELEMENTOR_ADDON_PATH.'inc/elementor-helper.php';
|
20 |
+
|
21 |
+
if(is_admin()){
|
22 |
+
require_once ELEMENTOR_ADDON_PATH. 'inc/admin/settings-page.php';
|
23 |
+
require_once ELEMENTOR_ADDON_PATH. 'inc/admin/controls.php';
|
24 |
+
require_once ELEMENTOR_ADDON_PATH. 'inc/admin/Settings.php';
|
25 |
+
}
|
26 |
+
|
27 |
+
|
28 |
+
function add_new_elements(){
|
29 |
+
|
30 |
+
|
31 |
+
require_once ELEMENTOR_ADDON_PATH.'inc/helper.php';
|
32 |
+
|
33 |
+
// load elements
|
34 |
+
require_once ELEMENTOR_ADDON_PATH.'elements/textseparator.php';
|
35 |
+
require_once ELEMENTOR_ADDON_PATH.'elements/pricetable.php';
|
36 |
+
require_once ELEMENTOR_ADDON_PATH.'elements/flipbox.php';
|
37 |
+
require_once ELEMENTOR_ADDON_PATH.'elements/shape-separator.php';
|
38 |
+
require_once ELEMENTOR_ADDON_PATH.'elements/post-list.php';
|
39 |
+
require_once ELEMENTOR_ADDON_PATH.'elements/animated-text.php';
|
40 |
+
require_once ELEMENTOR_ADDON_PATH.'elements/splittext.php';
|
41 |
+
|
42 |
+
require_once ELEMENTOR_ADDON_PATH.'elements/twitter.php';
|
43 |
+
|
44 |
+
require_once ELEMENTOR_ADDON_PATH.'elements/gmap.php';
|
45 |
+
|
46 |
+
require_once ELEMENTOR_ADDON_PATH.'elements/image-compare.php';
|
47 |
+
require_once ELEMENTOR_ADDON_PATH.'elements/modal-popup.php';
|
48 |
+
|
49 |
+
|
50 |
+
}
|
51 |
+
add_action('elementor/widgets/widgets_registered','add_new_elements');
|
52 |
+
|
53 |
+
|
54 |
+
|
55 |
+
|
56 |
+
|
57 |
+
function eae_scripts(){
|
58 |
+
wp_enqueue_style('eae-css',ELEMENTOR_ADDON_URL.'assets/css/eae.css');
|
59 |
+
|
60 |
+
/* animated text css and js file*/
|
61 |
+
wp_enqueue_script('animated-main',ELEMENTOR_ADDON_URL.'assets/js/animated-main.js', array('jquery'),'1.0', true);
|
62 |
+
|
63 |
+
wp_enqueue_script('eae-main',ELEMENTOR_ADDON_URL.'assets/js/eae.js', array('jquery', 'wts-magnific'),'1.0', true);
|
64 |
+
|
65 |
+
wp_enqueue_script('eae-particles',ELEMENTOR_ADDON_URL.'assets/js/particles.js', array('jquery'),'1.0', true);
|
66 |
+
|
67 |
+
wp_enqueue_style('vegas-css',ELEMENTOR_ADDON_URL.'assets/lib/vegas/vegas.css' );
|
68 |
+
wp_enqueue_script('vegas',ELEMENTOR_ADDON_URL.'assets/lib/vegas/vegas.js',array('jquery'),'2.4.0', true);
|
69 |
+
wp_enqueue_script('wts-magnific',ELEMENTOR_ADDON_URL.'assets/lib/magnific.js',array('jquery'),'1.9', true);
|
70 |
+
|
71 |
+
|
72 |
+
|
73 |
+
|
74 |
+
$map_key = get_option('wts_eae_gmap_key');
|
75 |
+
if(isset($map_key) && $map_key != ''){
|
76 |
+
wp_register_script('eae-gmap', 'https://maps.googleapis.com/maps/api/js?key='.$map_key);
|
77 |
+
}
|
78 |
+
|
79 |
+
wp_register_script('pinit', '//assets.pinterest.com/js/pinit.js', '', '', false);
|
80 |
+
|
81 |
+
|
82 |
+
wp_register_script('eae-stickyanything',ELEMENTOR_ADDON_URL.'assets/js/stickyanything.js',array('jquery'),'1.1.2',true);
|
83 |
+
|
84 |
+
$localize_data = array(
|
85 |
+
'plugin_url' => plugins_url('elementor-addon-elements')
|
86 |
+
);
|
87 |
+
wp_localize_script( 'eae-main', 'eae_editor', $localize_data );
|
88 |
+
|
89 |
+
}
|
90 |
+
add_action( 'wp_enqueue_scripts', 'eae_scripts' );
|
91 |
+
|
92 |
+
function eae_editor_enqueue_scripts(){
|
93 |
+
wp_enqueue_script('eae-particles',ELEMENTOR_ADDON_URL.'assets/js/particles.js', array('jquery'),'1.0', true);
|
94 |
+
}
|
95 |
+
add_action('elementor/editor/wp_head', 'eae_editor_enqueue_scripts');
|
96 |
+
|
97 |
+
|
98 |
+
|
99 |
+
|
100 |
+
|
101 |
+
function _editor_enqueue_scripts(){
|
102 |
+
$map_key = get_option('wts_eae_gmap_key');
|
103 |
+
if(isset($map_key) && $map_key != ''){
|
104 |
+
wp_enqueue_script('eae-gmap', 'https://maps.googleapis.com/maps/api/js?key='.$map_key);
|
105 |
+
}
|
106 |
+
|
107 |
+
wp_enqueue_script('pinit', '//assets.pinterest.com/js/pinit.js');
|
108 |
+
}
|
109 |
+
add_action('elementor/editor/wp_head', '_editor_enqueue_scripts');
|
110 |
+
|
111 |
+
|
112 |
+
|
113 |
+
|
114 |
+
|
115 |
+
|
116 |
+
|
117 |
+
|
elements/advance-tabs.php
CHANGED
@@ -1,743 +1,743 @@
|
|
1 |
-
<?php
|
2 |
-
namespace Elementor;
|
3 |
-
|
4 |
-
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
5 |
-
|
6 |
-
class Widget_Advance_Tabs extends Widget_Base {
|
7 |
-
|
8 |
-
public function get_name() {
|
9 |
-
return 'wts-advance-tabs';
|
10 |
-
}
|
11 |
-
|
12 |
-
public function get_title() {
|
13 |
-
return __( 'EAE - Advance Tabs', '
|
14 |
-
}
|
15 |
-
|
16 |
-
public function get_icon() {
|
17 |
-
return 'eicon-divider wts-eae-pe';
|
18 |
-
}
|
19 |
-
|
20 |
-
|
21 |
-
public function get_categories() {
|
22 |
-
return [ 'wts-eae' ];
|
23 |
-
}
|
24 |
-
|
25 |
-
public function get_script_depends() {
|
26 |
-
return [ 'eae-stickyanything' ];
|
27 |
-
}
|
28 |
-
|
29 |
-
protected function _register_controls() {
|
30 |
-
|
31 |
-
$this->start_controls_section(
|
32 |
-
'section_tabs',
|
33 |
-
[
|
34 |
-
'label' => __( 'Tabs', '
|
35 |
-
]
|
36 |
-
);
|
37 |
-
$this->add_control(
|
38 |
-
'tab_position',
|
39 |
-
[
|
40 |
-
'label' => __( 'Tab Position', '
|
41 |
-
'type' => Controls_Manager::SELECT,
|
42 |
-
'options' => [
|
43 |
-
'top' => __( 'Top', '
|
44 |
-
'left' => __( 'Left', '
|
45 |
-
],
|
46 |
-
'default' => 'top',
|
47 |
-
'prefix_class' => 'eae-nav-pos-',
|
48 |
-
]
|
49 |
-
);
|
50 |
-
|
51 |
-
$this->add_control(
|
52 |
-
'tab_Sticky',
|
53 |
-
[
|
54 |
-
'label' => __( 'Sticky Tab', '
|
55 |
-
'type' => Controls_Manager::SWITCHER,
|
56 |
-
'options' => [
|
57 |
-
'yes' => __( 'Yes', '
|
58 |
-
'no' => __( 'No', '
|
59 |
-
],
|
60 |
-
'default' => 'no',
|
61 |
-
//'prefix_class' => 'eae-nav-sticky-',
|
62 |
-
|
63 |
-
]
|
64 |
-
);
|
65 |
-
|
66 |
-
$this->add_control(
|
67 |
-
'scroll_offset',
|
68 |
-
[
|
69 |
-
'label' => __( 'Scroll Offset', '
|
70 |
-
'type' => Controls_Manager::TEXT,
|
71 |
-
'default' => 20,
|
72 |
-
'condition' => [
|
73 |
-
'tab_Sticky' => 'yes',
|
74 |
-
],
|
75 |
-
]
|
76 |
-
);
|
77 |
-
|
78 |
-
$repeater = new Repeater();
|
79 |
-
|
80 |
-
$repeater->add_control('tab_title',
|
81 |
-
[
|
82 |
-
'label' => __( 'Tab Title', '
|
83 |
-
'type' => Controls_Manager::TEXT,
|
84 |
-
'default' => __( 'Tab Title', '
|
85 |
-
'placeholder' => __( 'Tab Title', '
|
86 |
-
'label_block' => true,
|
87 |
-
]
|
88 |
-
);
|
89 |
-
|
90 |
-
$repeater->add_control(
|
91 |
-
'tab_element',
|
92 |
-
[
|
93 |
-
'label' => __( 'Tab Element', '
|
94 |
-
'type' => Controls_Manager::CHOOSE,
|
95 |
-
'options' => [
|
96 |
-
'none' => [
|
97 |
-
'title' => __( 'None', '
|
98 |
-
'icon' => 'fa fa-ban',
|
99 |
-
],
|
100 |
-
'image' => [
|
101 |
-
'title' => __( 'Image', '
|
102 |
-
'icon' => 'fa fa-picture-o',
|
103 |
-
],
|
104 |
-
'icon' => [
|
105 |
-
'title' => __( 'Icon', '
|
106 |
-
'icon' => 'fa fa-star',
|
107 |
-
|
108 |
-
],
|
109 |
-
],
|
110 |
-
'default' => 'icon',
|
111 |
-
]
|
112 |
-
);
|
113 |
-
|
114 |
-
$repeater->add_control('tab_image',
|
115 |
-
[
|
116 |
-
'label' => __( 'Choose Image', '
|
117 |
-
'type' => Controls_Manager::MEDIA,
|
118 |
-
'default' => [
|
119 |
-
'url' => Utils::get_placeholder_image_src(),
|
120 |
-
],
|
121 |
-
'condition' => [
|
122 |
-
'tab_element' => 'image',
|
123 |
-
],
|
124 |
-
'show_label' => true,
|
125 |
-
]
|
126 |
-
);
|
127 |
-
|
128 |
-
$repeater->add_group_control(
|
129 |
-
Group_Control_Image_Size::get_type(),
|
130 |
-
[
|
131 |
-
'name' => 'tab_image_size', // Actually its `image_size`
|
132 |
-
'default' => 'thumbnail',
|
133 |
-
'condition' => [
|
134 |
-
'tab_element' => 'image',
|
135 |
-
'tab_image[id]!' => '',
|
136 |
-
],
|
137 |
-
]
|
138 |
-
);
|
139 |
-
|
140 |
-
$repeater->add_control(
|
141 |
-
'tab_icon',
|
142 |
-
[
|
143 |
-
'label' => __( 'Icon', '
|
144 |
-
'type' => Controls_Manager::ICON,
|
145 |
-
'default' => 'fa fa-star',
|
146 |
-
'condition' => [
|
147 |
-
'tab_element' => 'icon',
|
148 |
-
],
|
149 |
-
]
|
150 |
-
);
|
151 |
-
|
152 |
-
$repeater->add_control('tab_content',
|
153 |
-
[
|
154 |
-
'label' => __( 'Content', '
|
155 |
-
'default' => __( 'Tab Content', '
|
156 |
-
'placeholder' => __( 'Tab Content', '
|
157 |
-
'type' => Controls_Manager::WYSIWYG,
|
158 |
-
'show_label' => true,
|
159 |
-
]
|
160 |
-
);
|
161 |
-
|
162 |
-
$this->add_control(
|
163 |
-
'eae_tabs',
|
164 |
-
[
|
165 |
-
'label' => __( 'Tabs Items', '
|
166 |
-
'type' => Controls_Manager::REPEATER,
|
167 |
-
'default' => [
|
168 |
-
[
|
169 |
-
'tab_title' => __( 'Adv Tab 1', '
|
170 |
-
'tab_content' => __( 'Advance responsive tab', '
|
171 |
-
],
|
172 |
-
[
|
173 |
-
'tab_title' => __( 'Adv Tab 2', '
|
174 |
-
'tab_content' => __( 'Advance responsive tab', '
|
175 |
-
],
|
176 |
-
],
|
177 |
-
'show_label' => true,
|
178 |
-
'fields' => array_values($repeater->get_controls()),
|
179 |
-
'title_field' => '{{{ tab_title }}}',
|
180 |
-
]
|
181 |
-
);
|
182 |
-
|
183 |
-
$this->end_controls_section();
|
184 |
-
|
185 |
-
$this->start_controls_section(
|
186 |
-
'tab_style',
|
187 |
-
[
|
188 |
-
'label' => __('General', '
|
189 |
-
'tab' => Controls_Manager::TAB_STYLE
|
190 |
-
]
|
191 |
-
);
|
192 |
-
|
193 |
-
|
194 |
-
$this->add_group_control(
|
195 |
-
Group_Control_Border::get_type(),
|
196 |
-
[
|
197 |
-
'name' => 'tab_title_border',
|
198 |
-
'selector' => '{{WRAPPER}} .eae-tab-nav li',
|
199 |
-
]
|
200 |
-
);
|
201 |
-
|
202 |
-
$this->add_control(
|
203 |
-
'bord_separator',
|
204 |
-
[
|
205 |
-
'label' => __('', '
|
206 |
-
'type' => Controls_Manager::HEADING,
|
207 |
-
'separator' => 'before',
|
208 |
-
]
|
209 |
-
);
|
210 |
-
|
211 |
-
$this->start_controls_tabs( 'advance_tabs_menu_style' );
|
212 |
-
|
213 |
-
|
214 |
-
$this->start_controls_tab(
|
215 |
-
'tab_menu_item_normal',
|
216 |
-
[
|
217 |
-
'label' => __( 'Normal', '
|
218 |
-
]
|
219 |
-
);
|
220 |
-
|
221 |
-
|
222 |
-
$this->add_control(
|
223 |
-
'tab_color',
|
224 |
-
[
|
225 |
-
'label' => __('Color', '
|
226 |
-
'type' => Controls_Manager::COLOR,
|
227 |
-
'scheme' => [
|
228 |
-
'type' => Scheme_Color::get_type(),
|
229 |
-
'value' => Scheme_Color::COLOR_1
|
230 |
-
],
|
231 |
-
'selectors' => [
|
232 |
-
'{{WRAPPER}} .eae-tab-nav li span' => 'color: {{VALUE}}'
|
233 |
-
]
|
234 |
-
]
|
235 |
-
);
|
236 |
-
|
237 |
-
$this->add_control(
|
238 |
-
'icon_color',
|
239 |
-
[
|
240 |
-
'label' => __('Icon Color', '
|
241 |
-
'type' => Controls_Manager::COLOR,
|
242 |
-
'scheme' => [
|
243 |
-
'type' => Scheme_Color::get_type(),
|
244 |
-
'value' => Scheme_Color::COLOR_1
|
245 |
-
],
|
246 |
-
'selectors' => [
|
247 |
-
'{{WRAPPER}} .eae-tab-nav li i' => 'color: {{VALUE}}'
|
248 |
-
]
|
249 |
-
]
|
250 |
-
);
|
251 |
-
|
252 |
-
$this->add_control(
|
253 |
-
'tab_background_color',
|
254 |
-
[
|
255 |
-
'label' => __('Background Color', '
|
256 |
-
'type' => Controls_Manager::COLOR,
|
257 |
-
'selectors' => [
|
258 |
-
'{{WRAPPER}} .eae-tab-nav li' => 'background-color: {{VALUE}}'
|
259 |
-
]
|
260 |
-
]
|
261 |
-
);
|
262 |
-
$this->add_control(
|
263 |
-
'tab_border_color',
|
264 |
-
[
|
265 |
-
'label' => __('Border Color', '
|
266 |
-
'type' => Controls_Manager::COLOR,
|
267 |
-
'selectors' => [
|
268 |
-
'{{WRAPPER}} .eae-tab-nav li' => 'border-color: {{VALUE}}'
|
269 |
-
]
|
270 |
-
]
|
271 |
-
);
|
272 |
-
|
273 |
-
$this->add_responsive_control(
|
274 |
-
'tab_title_border_radius',
|
275 |
-
[
|
276 |
-
'label' => __( 'Border Radius', '
|
277 |
-
'type' => Controls_Manager::DIMENSIONS,
|
278 |
-
'size_units' => [ 'px', '%' ],
|
279 |
-
'selectors' => [
|
280 |
-
'{{WRAPPER}} .eae-tab-nav li' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
281 |
-
],
|
282 |
-
]
|
283 |
-
);
|
284 |
-
|
285 |
-
$this -> end_controls_tab();
|
286 |
-
|
287 |
-
$this->start_controls_tab(
|
288 |
-
'tab_menu_item_hover',
|
289 |
-
[
|
290 |
-
'label' => __( 'hover/active', '
|
291 |
-
]
|
292 |
-
);
|
293 |
-
|
294 |
-
|
295 |
-
$this->add_control(
|
296 |
-
'tab_color_hover',
|
297 |
-
[
|
298 |
-
'label' => __('Color', '
|
299 |
-
'type' => Controls_Manager::COLOR,
|
300 |
-
'scheme' => [
|
301 |
-
'type' => Scheme_Color::get_type(),
|
302 |
-
'value' => Scheme_Color::COLOR_1
|
303 |
-
],
|
304 |
-
'selectors' => [
|
305 |
-
'{{WRAPPER}} .eae-tab-nav li:hover span, {{WRAPPER}} .eae-tabs nav li.tab-current span' => 'color: {{VALUE}}'
|
306 |
-
]
|
307 |
-
]
|
308 |
-
);
|
309 |
-
|
310 |
-
$this->add_control(
|
311 |
-
'icon_color_hover',
|
312 |
-
[
|
313 |
-
'label' => __('Icon Color', '
|
314 |
-
'type' => Controls_Manager::COLOR,
|
315 |
-
'scheme' => [
|
316 |
-
'type' => Scheme_Color::get_type(),
|
317 |
-
'value' => Scheme_Color::COLOR_2
|
318 |
-
],
|
319 |
-
'selectors' => [
|
320 |
-
'{{WRAPPER}} .eae-tab-nav li:hover i, {{WRAPPER}} .eae-tabs nav li.tab-current i' => 'color: {{VALUE}}'
|
321 |
-
]
|
322 |
-
]
|
323 |
-
);
|
324 |
-
|
325 |
-
$this->add_control(
|
326 |
-
'tab_background_color_hover',
|
327 |
-
[
|
328 |
-
'label' => __('Background Color', '
|
329 |
-
'type' => Controls_Manager::COLOR,
|
330 |
-
'selectors' => [
|
331 |
-
'{{WRAPPER}} .eae-tab-nav li:hover, {{WRAPPER}} .eae-tabs nav li.tab-current' => 'background-color: {{VALUE}}'
|
332 |
-
]
|
333 |
-
]
|
334 |
-
);
|
335 |
-
$this->add_control(
|
336 |
-
'tab_border_color_hover',
|
337 |
-
[
|
338 |
-
'label' => __('Border Color', '
|
339 |
-
'type' => Controls_Manager::COLOR,
|
340 |
-
'selectors' => [
|
341 |
-
'{{WRAPPER}} .eae-tab-nav li:hover' => 'border-color: {{VALUE}}'
|
342 |
-
]
|
343 |
-
]
|
344 |
-
);
|
345 |
-
|
346 |
-
|
347 |
-
$this->add_responsive_control(
|
348 |
-
'tab_title_border_radius_hover',
|
349 |
-
[
|
350 |
-
'label' => __( 'Border Radius', '
|
351 |
-
'type' => Controls_Manager::DIMENSIONS,
|
352 |
-
'size_units' => [ 'px', '%' ],
|
353 |
-
'selectors' => [
|
354 |
-
'{{WRAPPER}} .eae-tab-nav li:hover, {{WRAPPER}} .eae-tabs nav li.tab-current ' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
355 |
-
],
|
356 |
-
]
|
357 |
-
);
|
358 |
-
|
359 |
-
$this -> end_controls_tab();
|
360 |
-
|
361 |
-
$this -> end_controls_tabs();
|
362 |
-
|
363 |
-
$this->add_control(
|
364 |
-
'tab_head',
|
365 |
-
[
|
366 |
-
'label' => __('', '
|
367 |
-
'type' => Controls_Manager::HEADING,
|
368 |
-
'separator' => 'before',
|
369 |
-
]
|
370 |
-
);
|
371 |
-
|
372 |
-
$this->add_control(
|
373 |
-
'separator_color',
|
374 |
-
[
|
375 |
-
'label' => __('Separator Color', '
|
376 |
-
'type' => Controls_Manager::COLOR,
|
377 |
-
'scheme' => [
|
378 |
-
'type' => Scheme_Color::get_type(),
|
379 |
-
'value' => Scheme_Color::COLOR_1
|
380 |
-
],
|
381 |
-
'selectors' => [
|
382 |
-
'{{WRAPPER}}.eae-nav-pos-top nav li.tab-current::before' => 'background: {{VALUE}}',
|
383 |
-
'{{WRAPPER}}.eae-nav-pos-top nav li.tab-current::after' => 'background: {{VALUE}}',
|
384 |
-
]
|
385 |
-
]
|
386 |
-
);
|
387 |
-
|
388 |
-
$this->add_control(
|
389 |
-
'separator_height',
|
390 |
-
[
|
391 |
-
'label' => __( 'Separator Height', '
|
392 |
-
'type' => Controls_Manager::SLIDER,
|
393 |
-
'default' => [
|
394 |
-
'size' => 1,
|
395 |
-
],
|
396 |
-
'range' => [
|
397 |
-
'px' => [
|
398 |
-
'min' => 0,
|
399 |
-
'max' => 5,
|
400 |
-
],
|
401 |
-
],
|
402 |
-
'selectors' => [
|
403 |
-
'{{WRAPPER}}.eae-nav-pos-top nav li.tab-current::before' => 'height: {{SIZE}}px',
|
404 |
-
'{{WRAPPER}}.eae-nav-pos-top nav li.tab-current::after' => 'height: {{SIZE}}px',
|
405 |
-
],
|
406 |
-
]
|
407 |
-
);
|
408 |
-
|
409 |
-
$this->add_responsive_control(
|
410 |
-
'nav_width',
|
411 |
-
[
|
412 |
-
'label' => __( 'Tab Width', '
|
413 |
-
'type' => Controls_Manager::SLIDER,
|
414 |
-
'default' => [
|
415 |
-
'size' => 20,
|
416 |
-
],
|
417 |
-
'range' => [
|
418 |
-
'%' => [
|
419 |
-
'min' => 20,
|
420 |
-
'max' => 100,
|
421 |
-
],
|
422 |
-
],
|
423 |
-
'selectors' => [
|
424 |
-
'{{WRAPPER}}.eae-nav-pos-left .eae-tabs nav' => 'width: calc({{SIZE}}% - 1%);',
|
425 |
-
'{{WRAPPER}}.eae-nav-pos-left .eae-content' => 'width: calc(100% - {{SIZE}}% - 1%);',
|
426 |
-
//'{{WRAPPER}}.eae-nav-pos-top .eae-tabs nav li' => 'width: {{SIZE}}%;',
|
427 |
-
],
|
428 |
-
]
|
429 |
-
);
|
430 |
-
|
431 |
-
$this->add_control(
|
432 |
-
'show_text_mobile',
|
433 |
-
[
|
434 |
-
'label' => __( 'Title on Mobile', '
|
435 |
-
'type' => Controls_Manager::SELECT,
|
436 |
-
'options' => [
|
437 |
-
'yes' => __( 'Yes', '
|
438 |
-
'no' => __( 'No', '
|
439 |
-
],
|
440 |
-
'default' => 'no',
|
441 |
-
]
|
442 |
-
);
|
443 |
-
|
444 |
-
$this->add_group_control(
|
445 |
-
Group_Control_Typography::get_type(),
|
446 |
-
[
|
447 |
-
'name' => 'typography',
|
448 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
449 |
-
'selector' => '{{WRAPPER}} .eae-tab-nav li span',
|
450 |
-
]
|
451 |
-
|
452 |
-
);
|
453 |
-
|
454 |
-
|
455 |
-
$this->add_responsive_control(
|
456 |
-
'tab_title_align',
|
457 |
-
[
|
458 |
-
'label' => __( 'Alignment', '
|
459 |
-
'type' => Controls_Manager::CHOOSE,
|
460 |
-
'options' => [
|
461 |
-
'left' => [
|
462 |
-
'title' => __( 'Left', '
|
463 |
-
'icon' => 'fa fa-align-left',
|
464 |
-
],
|
465 |
-
'center' => [
|
466 |
-
'title' => __( 'Center', '
|
467 |
-
'icon' => 'fa fa-align-center',
|
468 |
-
],
|
469 |
-
'right' => [
|
470 |
-
'title' => __( 'Right', '
|
471 |
-
'icon' => 'fa fa-align-right',
|
472 |
-
],
|
473 |
-
],
|
474 |
-
'selectors' => [
|
475 |
-
'{{WRAPPER}} .eae-tabs nav' => 'text-align: {{VALUE}};',
|
476 |
-
],
|
477 |
-
]
|
478 |
-
);
|
479 |
-
|
480 |
-
$this->add_responsive_control(
|
481 |
-
'icon_size',
|
482 |
-
[
|
483 |
-
'label' => __( 'Icon Size', '
|
484 |
-
'type' => Controls_Manager::SLIDER,
|
485 |
-
'default' => [
|
486 |
-
'size' => 20,
|
487 |
-
],
|
488 |
-
'range' => [
|
489 |
-
'px' => [
|
490 |
-
'min' => 6,
|
491 |
-
'max' => 30,
|
492 |
-
],
|
493 |
-
],
|
494 |
-
'selectors' => [
|
495 |
-
'{{WRAPPER}} .eae-tab-nav li a>:first-child' => 'width: {{SIZE}}{{UNIT}};',
|
496 |
-
'{{WRAPPER}} .eae-tab-nav li a>:first-child ' => 'font-size: {{SIZE}}{{UNIT}};',
|
497 |
-
],
|
498 |
-
]
|
499 |
-
);
|
500 |
-
|
501 |
-
|
502 |
-
$this->end_controls_section();
|
503 |
-
|
504 |
-
$this->start_controls_section(
|
505 |
-
'tab_content_style',
|
506 |
-
[
|
507 |
-
'label' => __('Content', '
|
508 |
-
'tab' => Controls_Manager::TAB_STYLE
|
509 |
-
]
|
510 |
-
);
|
511 |
-
|
512 |
-
$this->add_responsive_control(
|
513 |
-
'tab_text_align',
|
514 |
-
[
|
515 |
-
'label' => __( 'Alignment', '
|
516 |
-
'type' => Controls_Manager::CHOOSE,
|
517 |
-
'options' => [
|
518 |
-
'left' => [
|
519 |
-
'title' => __( 'Left', '
|
520 |
-
'icon' => 'fa fa-align-left',
|
521 |
-
],
|
522 |
-
'center' => [
|
523 |
-
'title' => __( 'Center', '
|
524 |
-
'icon' => 'fa fa-align-center',
|
525 |
-
],
|
526 |
-
'right' => [
|
527 |
-
'title' => __( 'Right', '
|
528 |
-
'icon' => 'fa fa-align-right',
|
529 |
-
],
|
530 |
-
'justify' => [
|
531 |
-
'title' => __( 'Justified', '
|
532 |
-
'icon' => 'fa fa-align-justify',
|
533 |
-
],
|
534 |
-
],
|
535 |
-
'selectors' => [
|
536 |
-
'{{WRAPPER}} .eae-content section' => 'text-align: {{VALUE}};',
|
537 |
-
],
|
538 |
-
]
|
539 |
-
);
|
540 |
-
|
541 |
-
$this->add_control(
|
542 |
-
'text_color',
|
543 |
-
[
|
544 |
-
'label' => __( 'Text Color', '
|
545 |
-
'type' => Controls_Manager::COLOR,
|
546 |
-
'default' => '',
|
547 |
-
'selectors' => [
|
548 |
-
'{{WRAPPER}} .eae-content section' => 'color: {{VALUE}};',
|
549 |
-
],
|
550 |
-
'scheme' => [
|
551 |
-
'type' => Scheme_Color::get_type(),
|
552 |
-
'value' => Scheme_Color::COLOR_3,
|
553 |
-
],
|
554 |
-
]
|
555 |
-
);
|
556 |
-
|
557 |
-
$this->add_group_control(
|
558 |
-
Group_Control_Typography::get_type(),
|
559 |
-
[
|
560 |
-
'name' => 'content_typography',
|
561 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_3,
|
562 |
-
'selector' => '{{WRAPPER}} .eae-content section'
|
563 |
-
]
|
564 |
-
);
|
565 |
-
|
566 |
-
$this->add_group_control(
|
567 |
-
Group_Control_Border::get_type(),
|
568 |
-
[
|
569 |
-
'name' => 'tab_content_border',
|
570 |
-
'selector' => '{{WRAPPER}} .eae-content section',
|
571 |
-
'separator' => 'before',
|
572 |
-
]
|
573 |
-
);
|
574 |
-
|
575 |
-
$this->add_responsive_control(
|
576 |
-
'tab_content_border_radius',
|
577 |
-
[
|
578 |
-
'label' => __( 'Border Radius', '
|
579 |
-
'type' => Controls_Manager::DIMENSIONS,
|
580 |
-
'size_units' => [ 'px', '%' ],
|
581 |
-
'selectors' => [
|
582 |
-
'{{WRAPPER}} .eae-content section' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
583 |
-
],
|
584 |
-
]
|
585 |
-
);
|
586 |
-
|
587 |
-
$this->end_controls_section();
|
588 |
-
}
|
589 |
-
|
590 |
-
|
591 |
-
protected function render() {
|
592 |
-
$settings = $this->get_settings();
|
593 |
-
//print_r($this->get_id());
|
594 |
-
//echo "<pre>";print_r($settings['eae_tabs']);echo "</pre>";
|
595 |
-
|
596 |
-
?>
|
597 |
-
|
598 |
-
<?php if(count($settings['eae_tabs'])){
|
599 |
-
?>
|
600 |
-
<div id="advance_tabs" class="eae-tabs text-mobile-<?php echo $settings['show_text_mobile'] ?>" data-sticky-menu="<?php echo "eae-nav-sticky-".$settings['tab_Sticky'] ?>" data-scroll-offset="<?php echo $settings['scroll_offset'] ?>" >
|
601 |
-
<nav class="eae-tab-nav">
|
602 |
-
<ul>
|
603 |
-
<?php
|
604 |
-
$a_style="";
|
605 |
-
$var1 = 1;
|
606 |
-
foreach ($settings['eae_tabs'] as $tab){
|
607 |
-
if($var1 == 1)
|
608 |
-
{
|
609 |
-
$cont ="class='tab-current'";
|
610 |
-
}
|
611 |
-
else{
|
612 |
-
$cont ="";
|
613 |
-
}
|
614 |
-
$var1 ++;
|
615 |
-
?>
|
616 |
-
<li <?php echo $cont; ?> ><a href="<?php echo '#'.$tab['_id']; ?> " >
|
617 |
-
<?php
|
618 |
-
if($tab['tab_element']== "none")
|
619 |
-
$a_style="";
|
620 |
-
if($tab['tab_element']== "icon")
|
621 |
-
$a_style = '<i class="'.$tab['tab_icon'].'"></i>';
|
622 |
-
if($tab['tab_element']== "image")
|
623 |
-
$a_style = '<img src="'.$tab['tab_image']['url'].'"></img>';
|
624 |
-
|
625 |
-
echo $a_style;
|
626 |
-
?>
|
627 |
-
<span><?php echo $tab['tab_title']; ?></span></a></li>
|
628 |
-
<?php
|
629 |
-
}
|
630 |
-
|
631 |
-
?>
|
632 |
-
</ul>
|
633 |
-
</nav>
|
634 |
-
<div class="eae-content">
|
635 |
-
<?php
|
636 |
-
$var = 1;
|
637 |
-
foreach ($settings['eae_tabs'] as $index => $tab){
|
638 |
-
$eae_tab_content_key = $this->get_repeater_setting_key( 'tab_content', 'eae_tabs', $index );
|
639 |
-
if($var == 1)
|
640 |
-
{
|
641 |
-
$this->add_render_attribute( $eae_tab_content_key, [
|
642 |
-
'class' => [ 'content-current'],
|
643 |
-
] );
|
644 |
-
}
|
645 |
-
$var++;
|
646 |
-
|
647 |
-
$this->add_inline_editing_attributes( $eae_tab_content_key, 'advanced' );
|
648 |
-
|
649 |
-
?>
|
650 |
-
|
651 |
-
<section id="<?php echo "#".$tab['_id']; ?>" <?php echo $this->get_render_attribute_string( $eae_tab_content_key); ?> >
|
652 |
-
<?php
|
653 |
-
echo $tab['tab_content'];
|
654 |
-
?>
|
655 |
-
</section>
|
656 |
-
|
657 |
-
<?php
|
658 |
-
}
|
659 |
-
?>
|
660 |
-
|
661 |
-
</div>
|
662 |
-
</div>
|
663 |
-
<?php
|
664 |
-
}
|
665 |
-
}
|
666 |
-
|
667 |
-
protected function _content_template() {
|
668 |
-
?>
|
669 |
-
<# if(settings.eae_tabs){ #>
|
670 |
-
<div id="advance_tabs" class="eae-tabs text-mobile-{{{settings.show_text_mobile }}}" data-sticky-menu="eae-nav-sticky-{{{settings.tab_Sticky}}}" data-scroll-offset="{{{settings.scroll_offset}}}" >
|
671 |
-
<nav class="eae-tab-nav">
|
672 |
-
<ul>
|
673 |
-
<#
|
674 |
-
|
675 |
-
var var1 = 1;
|
676 |
-
var cont ="";
|
677 |
-
_.each( settings.eae_tabs, function( tab, index ) {
|
678 |
-
var a_style="";
|
679 |
-
if(var1 == 1)
|
680 |
-
{
|
681 |
-
cont ="class='tab-current'";
|
682 |
-
}
|
683 |
-
else{
|
684 |
-
cont ="";
|
685 |
-
}
|
686 |
-
var1 ++;
|
687 |
-
#>
|
688 |
-
<li {{{cont}}} ><a href="{{{'#'+settings.eae_tabs._id }}} " >
|
689 |
-
<#
|
690 |
-
view.addRenderAttribute('iconclass','class',tab.tab_icon);
|
691 |
-
if(tab.tab_element == "none")
|
692 |
-
a_style="";
|
693 |
-
if(tab.tab_element == "icon")
|
694 |
-
a_style = '<i class="'+ tab.tab_icon + '"></i>';
|
695 |
-
if(tab.tab_element== "image")
|
696 |
-
a_style = '<img src="+ tab.tab_image.url +"/>';
|
697 |
-
#>
|
698 |
-
|
699 |
-
{{{a_style}}}
|
700 |
-
<span>{{{ tab.tab_title}}}</span></a></li>
|
701 |
-
<# } ); #>
|
702 |
-
|
703 |
-
</ul>
|
704 |
-
</nav>
|
705 |
-
|
706 |
-
<div class="eae-content">
|
707 |
-
<#
|
708 |
-
var var2 = 1;
|
709 |
-
var cont ="";
|
710 |
-
_.each( settings.eae_tabs, function( tab, index ) {
|
711 |
-
var eae_tab_content_key = view.getRepeaterSettingKey( 'tab_content', 'eae_tabs', index );
|
712 |
-
|
713 |
-
if(var2 == 1)
|
714 |
-
{
|
715 |
-
view.addRenderAttribute( eae_tab_content_key, {
|
716 |
-
'class': 'content-current',
|
717 |
-
});
|
718 |
-
}
|
719 |
-
else{
|
720 |
-
cont ="";
|
721 |
-
}
|
722 |
-
var2++;
|
723 |
-
view.addInlineEditingAttributes( eae_tab_content_key, 'advanced' );
|
724 |
-
|
725 |
-
#>
|
726 |
-
<section id="#{{{tab._id}}}" {{{ view.getRenderAttributeString(eae_tab_content_key)}}}>
|
727 |
-
{{{tab.tab_content}}}
|
728 |
-
</section>
|
729 |
-
|
730 |
-
<#
|
731 |
-
});
|
732 |
-
#>
|
733 |
-
|
734 |
-
</div>
|
735 |
-
</div>
|
736 |
-
<# } #>
|
737 |
-
<?php
|
738 |
-
}
|
739 |
-
|
740 |
-
|
741 |
-
}
|
742 |
-
|
743 |
Plugin::instance()->widgets_manager->register_widget_type( new Widget_Advance_Tabs() );
|
1 |
+
<?php
|
2 |
+
namespace Elementor;
|
3 |
+
|
4 |
+
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
5 |
+
|
6 |
+
class Widget_Advance_Tabs extends Widget_Base {
|
7 |
+
|
8 |
+
public function get_name() {
|
9 |
+
return 'wts-advance-tabs';
|
10 |
+
}
|
11 |
+
|
12 |
+
public function get_title() {
|
13 |
+
return __( 'EAE - Advance Tabs', 'wts-eae' );
|
14 |
+
}
|
15 |
+
|
16 |
+
public function get_icon() {
|
17 |
+
return 'eicon-divider wts-eae-pe';
|
18 |
+
}
|
19 |
+
|
20 |
+
|
21 |
+
public function get_categories() {
|
22 |
+
return [ 'wts-eae' ];
|
23 |
+
}
|
24 |
+
|
25 |
+
public function get_script_depends() {
|
26 |
+
return [ 'eae-stickyanything' ];
|
27 |
+
}
|
28 |
+
|
29 |
+
protected function _register_controls() {
|
30 |
+
|
31 |
+
$this->start_controls_section(
|
32 |
+
'section_tabs',
|
33 |
+
[
|
34 |
+
'label' => __( 'Tabs', 'wts-eae' )
|
35 |
+
]
|
36 |
+
);
|
37 |
+
$this->add_control(
|
38 |
+
'tab_position',
|
39 |
+
[
|
40 |
+
'label' => __( 'Tab Position', 'wts-eae' ),
|
41 |
+
'type' => Controls_Manager::SELECT,
|
42 |
+
'options' => [
|
43 |
+
'top' => __( 'Top', 'wts-eae' ),
|
44 |
+
'left' => __( 'Left', 'wts-eae' ),
|
45 |
+
],
|
46 |
+
'default' => 'top',
|
47 |
+
'prefix_class' => 'eae-nav-pos-',
|
48 |
+
]
|
49 |
+
);
|
50 |
+
|
51 |
+
$this->add_control(
|
52 |
+
'tab_Sticky',
|
53 |
+
[
|
54 |
+
'label' => __( 'Sticky Tab', 'wts-eae' ),
|
55 |
+
'type' => Controls_Manager::SWITCHER,
|
56 |
+
'options' => [
|
57 |
+
'yes' => __( 'Yes', 'wts-eae' ),
|
58 |
+
'no' => __( 'No', 'wts-eae' ),
|
59 |
+
],
|
60 |
+
'default' => 'no',
|
61 |
+
//'prefix_class' => 'eae-nav-sticky-',
|
62 |
+
|
63 |
+
]
|
64 |
+
);
|
65 |
+
|
66 |
+
$this->add_control(
|
67 |
+
'scroll_offset',
|
68 |
+
[
|
69 |
+
'label' => __( 'Scroll Offset', 'wts-eae' ),
|
70 |
+
'type' => Controls_Manager::TEXT,
|
71 |
+
'default' => 20,
|
72 |
+
'condition' => [
|
73 |
+
'tab_Sticky' => 'yes',
|
74 |
+
],
|
75 |
+
]
|
76 |
+
);
|
77 |
+
|
78 |
+
$repeater = new Repeater();
|
79 |
+
|
80 |
+
$repeater->add_control('tab_title',
|
81 |
+
[
|
82 |
+
'label' => __( 'Tab Title', 'wts-eae' ),
|
83 |
+
'type' => Controls_Manager::TEXT,
|
84 |
+
'default' => __( 'Tab Title', 'wts-eae' ),
|
85 |
+
'placeholder' => __( 'Tab Title', 'wts-eae' ),
|
86 |
+
'label_block' => true,
|
87 |
+
]
|
88 |
+
);
|
89 |
+
|
90 |
+
$repeater->add_control(
|
91 |
+
'tab_element',
|
92 |
+
[
|
93 |
+
'label' => __( 'Tab Element', 'wts-eae' ),
|
94 |
+
'type' => Controls_Manager::CHOOSE,
|
95 |
+
'options' => [
|
96 |
+
'none' => [
|
97 |
+
'title' => __( 'None', 'wts-eae' ),
|
98 |
+
'icon' => 'fa fa-ban',
|
99 |
+
],
|
100 |
+
'image' => [
|
101 |
+
'title' => __( 'Image', 'wts-eae' ),
|
102 |
+
'icon' => 'fa fa-picture-o',
|
103 |
+
],
|
104 |
+
'icon' => [
|
105 |
+
'title' => __( 'Icon', 'wts-eae' ),
|
106 |
+
'icon' => 'fa fa-star',
|
107 |
+
|
108 |
+
],
|
109 |
+
],
|
110 |
+
'default' => 'icon',
|
111 |
+
]
|
112 |
+
);
|
113 |
+
|
114 |
+
$repeater->add_control('tab_image',
|
115 |
+
[
|
116 |
+
'label' => __( 'Choose Image', 'wts-eae' ),
|
117 |
+
'type' => Controls_Manager::MEDIA,
|
118 |
+
'default' => [
|
119 |
+
'url' => Utils::get_placeholder_image_src(),
|
120 |
+
],
|
121 |
+
'condition' => [
|
122 |
+
'tab_element' => 'image',
|
123 |
+
],
|
124 |
+
'show_label' => true,
|
125 |
+
]
|
126 |
+
);
|
127 |
+
|
128 |
+
$repeater->add_group_control(
|
129 |
+
Group_Control_Image_Size::get_type(),
|
130 |
+
[
|
131 |
+
'name' => 'tab_image_size', // Actually its `image_size`
|
132 |
+
'default' => 'thumbnail',
|
133 |
+
'condition' => [
|
134 |
+
'tab_element' => 'image',
|
135 |
+
'tab_image[id]!' => '',
|
136 |
+
],
|
137 |
+
]
|
138 |
+
);
|
139 |
+
|
140 |
+
$repeater->add_control(
|
141 |
+
'tab_icon',
|
142 |
+
[
|
143 |
+
'label' => __( 'Icon', 'wts-eae' ),
|
144 |
+
'type' => Controls_Manager::ICON,
|
145 |
+
'default' => 'fa fa-star',
|
146 |
+
'condition' => [
|
147 |
+
'tab_element' => 'icon',
|
148 |
+
],
|
149 |
+
]
|
150 |
+
);
|
151 |
+
|
152 |
+
$repeater->add_control('tab_content',
|
153 |
+
[
|
154 |
+
'label' => __( 'Content', 'wts-eae' ),
|
155 |
+
'default' => __( 'Tab Content', 'wts-eae' ),
|
156 |
+
'placeholder' => __( 'Tab Content', 'wts-eae' ),
|
157 |
+
'type' => Controls_Manager::WYSIWYG,
|
158 |
+
'show_label' => true,
|
159 |
+
]
|
160 |
+
);
|
161 |
+
|
162 |
+
$this->add_control(
|
163 |
+
'eae_tabs',
|
164 |
+
[
|
165 |
+
'label' => __( 'Tabs Items', 'wts-eae' ),
|
166 |
+
'type' => Controls_Manager::REPEATER,
|
167 |
+
'default' => [
|
168 |
+
[
|
169 |
+
'tab_title' => __( 'Adv Tab 1', 'wts-eae' ),
|
170 |
+
'tab_content' => __( 'Advance responsive tab', 'wts-eae' ),
|
171 |
+
],
|
172 |
+
[
|
173 |
+
'tab_title' => __( 'Adv Tab 2', 'wts-eae' ),
|
174 |
+
'tab_content' => __( 'Advance responsive tab', 'wts-eae' ),
|
175 |
+
],
|
176 |
+
],
|
177 |
+
'show_label' => true,
|
178 |
+
'fields' => array_values($repeater->get_controls()),
|
179 |
+
'title_field' => '{{{ tab_title }}}',
|
180 |
+
]
|
181 |
+
);
|
182 |
+
|
183 |
+
$this->end_controls_section();
|
184 |
+
|
185 |
+
$this->start_controls_section(
|
186 |
+
'tab_style',
|
187 |
+
[
|
188 |
+
'label' => __('General', 'wts-eae'),
|
189 |
+
'tab' => Controls_Manager::TAB_STYLE
|
190 |
+
]
|
191 |
+
);
|
192 |
+
|
193 |
+
|
194 |
+
$this->add_group_control(
|
195 |
+
Group_Control_Border::get_type(),
|
196 |
+
[
|
197 |
+
'name' => 'tab_title_border',
|
198 |
+
'selector' => '{{WRAPPER}} .eae-tab-nav li',
|
199 |
+
]
|
200 |
+
);
|
201 |
+
|
202 |
+
$this->add_control(
|
203 |
+
'bord_separator',
|
204 |
+
[
|
205 |
+
'label' => __('', 'wts-eae'),
|
206 |
+
'type' => Controls_Manager::HEADING,
|
207 |
+
'separator' => 'before',
|
208 |
+
]
|
209 |
+
);
|
210 |
+
|
211 |
+
$this->start_controls_tabs( 'advance_tabs_menu_style' );
|
212 |
+
|
213 |
+
|
214 |
+
$this->start_controls_tab(
|
215 |
+
'tab_menu_item_normal',
|
216 |
+
[
|
217 |
+
'label' => __( 'Normal', 'wts-eae' ),
|
218 |
+
]
|
219 |
+
);
|
220 |
+
|
221 |
+
|
222 |
+
$this->add_control(
|
223 |
+
'tab_color',
|
224 |
+
[
|
225 |
+
'label' => __('Color', 'wts-eae'),
|
226 |
+
'type' => Controls_Manager::COLOR,
|
227 |
+
'scheme' => [
|
228 |
+
'type' => Scheme_Color::get_type(),
|
229 |
+
'value' => Scheme_Color::COLOR_1
|
230 |
+
],
|
231 |
+
'selectors' => [
|
232 |
+
'{{WRAPPER}} .eae-tab-nav li span' => 'color: {{VALUE}}'
|
233 |
+
]
|
234 |
+
]
|
235 |
+
);
|
236 |
+
|
237 |
+
$this->add_control(
|
238 |
+
'icon_color',
|
239 |
+
[
|
240 |
+
'label' => __('Icon Color', 'wts-eae'),
|
241 |
+
'type' => Controls_Manager::COLOR,
|
242 |
+
'scheme' => [
|
243 |
+
'type' => Scheme_Color::get_type(),
|
244 |
+
'value' => Scheme_Color::COLOR_1
|
245 |
+
],
|
246 |
+
'selectors' => [
|
247 |
+
'{{WRAPPER}} .eae-tab-nav li i' => 'color: {{VALUE}}'
|
248 |
+
]
|
249 |
+
]
|
250 |
+
);
|
251 |
+
|
252 |
+
$this->add_control(
|
253 |
+
'tab_background_color',
|
254 |
+
[
|
255 |
+
'label' => __('Background Color', 'wts-eae'),
|
256 |
+
'type' => Controls_Manager::COLOR,
|
257 |
+
'selectors' => [
|
258 |
+
'{{WRAPPER}} .eae-tab-nav li' => 'background-color: {{VALUE}}'
|
259 |
+
]
|
260 |
+
]
|
261 |
+
);
|
262 |
+
$this->add_control(
|
263 |
+
'tab_border_color',
|
264 |
+
[
|
265 |
+
'label' => __('Border Color', 'wts-eae'),
|
266 |
+
'type' => Controls_Manager::COLOR,
|
267 |
+
'selectors' => [
|
268 |
+
'{{WRAPPER}} .eae-tab-nav li' => 'border-color: {{VALUE}}'
|
269 |
+
]
|
270 |
+
]
|
271 |
+
);
|
272 |
+
|
273 |
+
$this->add_responsive_control(
|
274 |
+
'tab_title_border_radius',
|
275 |
+
[
|
276 |
+
'label' => __( 'Border Radius', 'wts-eae' ),
|
277 |
+
'type' => Controls_Manager::DIMENSIONS,
|
278 |
+
'size_units' => [ 'px', '%' ],
|
279 |
+
'selectors' => [
|
280 |
+
'{{WRAPPER}} .eae-tab-nav li' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
281 |
+
],
|
282 |
+
]
|
283 |
+
);
|
284 |
+
|
285 |
+
$this -> end_controls_tab();
|
286 |
+
|
287 |
+
$this->start_controls_tab(
|
288 |
+
'tab_menu_item_hover',
|
289 |
+
[
|
290 |
+
'label' => __( 'hover/active', 'wts-eae' ),
|
291 |
+
]
|
292 |
+
);
|
293 |
+
|
294 |
+
|
295 |
+
$this->add_control(
|
296 |
+
'tab_color_hover',
|
297 |
+
[
|
298 |
+
'label' => __('Color', 'wts-eae'),
|
299 |
+
'type' => Controls_Manager::COLOR,
|
300 |
+
'scheme' => [
|
301 |
+
'type' => Scheme_Color::get_type(),
|
302 |
+
'value' => Scheme_Color::COLOR_1
|
303 |
+
],
|
304 |
+
'selectors' => [
|
305 |
+
'{{WRAPPER}} .eae-tab-nav li:hover span, {{WRAPPER}} .eae-tabs nav li.tab-current span' => 'color: {{VALUE}}'
|
306 |
+
]
|
307 |
+
]
|
308 |
+
);
|
309 |
+
|
310 |
+
$this->add_control(
|
311 |
+
'icon_color_hover',
|
312 |
+
[
|
313 |
+
'label' => __('Icon Color', 'wts-eae'),
|
314 |
+
'type' => Controls_Manager::COLOR,
|
315 |
+
'scheme' => [
|
316 |
+
'type' => Scheme_Color::get_type(),
|
317 |
+
'value' => Scheme_Color::COLOR_2
|
318 |
+
],
|
319 |
+
'selectors' => [
|
320 |
+
'{{WRAPPER}} .eae-tab-nav li:hover i, {{WRAPPER}} .eae-tabs nav li.tab-current i' => 'color: {{VALUE}}'
|
321 |
+
]
|
322 |
+
]
|
323 |
+
);
|
324 |
+
|
325 |
+
$this->add_control(
|
326 |
+
'tab_background_color_hover',
|
327 |
+
[
|
328 |
+
'label' => __('Background Color', 'wts-eae'),
|
329 |
+
'type' => Controls_Manager::COLOR,
|
330 |
+
'selectors' => [
|
331 |
+
'{{WRAPPER}} .eae-tab-nav li:hover, {{WRAPPER}} .eae-tabs nav li.tab-current' => 'background-color: {{VALUE}}'
|
332 |
+
]
|
333 |
+
]
|
334 |
+
);
|
335 |
+
$this->add_control(
|
336 |
+
'tab_border_color_hover',
|
337 |
+
[
|
338 |
+
'label' => __('Border Color', 'wts-eae'),
|
339 |
+
'type' => Controls_Manager::COLOR,
|
340 |
+
'selectors' => [
|
341 |
+
'{{WRAPPER}} .eae-tab-nav li:hover' => 'border-color: {{VALUE}}'
|
342 |
+
]
|
343 |
+
]
|
344 |
+
);
|
345 |
+
|
346 |
+
|
347 |
+
$this->add_responsive_control(
|
348 |
+
'tab_title_border_radius_hover',
|
349 |
+
[
|
350 |
+
'label' => __( 'Border Radius', 'wts-eae' ),
|
351 |
+
'type' => Controls_Manager::DIMENSIONS,
|
352 |
+
'size_units' => [ 'px', '%' ],
|
353 |
+
'selectors' => [
|
354 |
+
'{{WRAPPER}} .eae-tab-nav li:hover, {{WRAPPER}} .eae-tabs nav li.tab-current ' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
355 |
+
],
|
356 |
+
]
|
357 |
+
);
|
358 |
+
|
359 |
+
$this -> end_controls_tab();
|
360 |
+
|
361 |
+
$this -> end_controls_tabs();
|
362 |
+
|
363 |
+
$this->add_control(
|
364 |
+
'tab_head',
|
365 |
+
[
|
366 |
+
'label' => __('', 'wts-eae'),
|
367 |
+
'type' => Controls_Manager::HEADING,
|
368 |
+
'separator' => 'before',
|
369 |
+
]
|
370 |
+
);
|
371 |
+
|
372 |
+
$this->add_control(
|
373 |
+
'separator_color',
|
374 |
+
[
|
375 |
+
'label' => __('Separator Color', 'wts-eae'),
|
376 |
+
'type' => Controls_Manager::COLOR,
|
377 |
+
'scheme' => [
|
378 |
+
'type' => Scheme_Color::get_type(),
|
379 |
+
'value' => Scheme_Color::COLOR_1
|
380 |
+
],
|
381 |
+
'selectors' => [
|
382 |
+
'{{WRAPPER}}.eae-nav-pos-top nav li.tab-current::before' => 'background: {{VALUE}}',
|
383 |
+
'{{WRAPPER}}.eae-nav-pos-top nav li.tab-current::after' => 'background: {{VALUE}}',
|
384 |
+
]
|
385 |
+
]
|
386 |
+
);
|
387 |
+
|
388 |
+
$this->add_control(
|
389 |
+
'separator_height',
|
390 |
+
[
|
391 |
+
'label' => __( 'Separator Height', 'wts-eae' ),
|
392 |
+
'type' => Controls_Manager::SLIDER,
|
393 |
+
'default' => [
|
394 |
+
'size' => 1,
|
395 |
+
],
|
396 |
+
'range' => [
|
397 |
+
'px' => [
|
398 |
+
'min' => 0,
|
399 |
+
'max' => 5,
|
400 |
+
],
|
401 |
+
],
|
402 |
+
'selectors' => [
|
403 |
+
'{{WRAPPER}}.eae-nav-pos-top nav li.tab-current::before' => 'height: {{SIZE}}px',
|
404 |
+
'{{WRAPPER}}.eae-nav-pos-top nav li.tab-current::after' => 'height: {{SIZE}}px',
|
405 |
+
],
|
406 |
+
]
|
407 |
+
);
|
408 |
+
|
409 |
+
$this->add_responsive_control(
|
410 |
+
'nav_width',
|
411 |
+
[
|
412 |
+
'label' => __( 'Tab Width', 'wts-eae' ),
|
413 |
+
'type' => Controls_Manager::SLIDER,
|
414 |
+
'default' => [
|
415 |
+
'size' => 20,
|
416 |
+
],
|
417 |
+
'range' => [
|
418 |
+
'%' => [
|
419 |
+
'min' => 20,
|
420 |
+
'max' => 100,
|
421 |
+
],
|
422 |
+
],
|
423 |
+
'selectors' => [
|
424 |
+
'{{WRAPPER}}.eae-nav-pos-left .eae-tabs nav' => 'width: calc({{SIZE}}% - 1%);',
|
425 |
+
'{{WRAPPER}}.eae-nav-pos-left .eae-content' => 'width: calc(100% - {{SIZE}}% - 1%);',
|
426 |
+
//'{{WRAPPER}}.eae-nav-pos-top .eae-tabs nav li' => 'width: {{SIZE}}%;',
|
427 |
+
],
|
428 |
+
]
|
429 |
+
);
|
430 |
+
|
431 |
+
$this->add_control(
|
432 |
+
'show_text_mobile',
|
433 |
+
[
|
434 |
+
'label' => __( 'Title on Mobile', 'wts-eae' ),
|
435 |
+
'type' => Controls_Manager::SELECT,
|
436 |
+
'options' => [
|
437 |
+
'yes' => __( 'Yes', 'wts-eae' ),
|
438 |
+
'no' => __( 'No', 'wts-eae' ),
|
439 |
+
],
|
440 |
+
'default' => 'no',
|
441 |
+
]
|
442 |
+
);
|
443 |
+
|
444 |
+
$this->add_group_control(
|
445 |
+
Group_Control_Typography::get_type(),
|
446 |
+
[
|
447 |
+
'name' => 'typography',
|
448 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
449 |
+
'selector' => '{{WRAPPER}} .eae-tab-nav li span',
|
450 |
+
]
|
451 |
+
|
452 |
+
);
|
453 |
+
|
454 |
+
|
455 |
+
$this->add_responsive_control(
|
456 |
+
'tab_title_align',
|
457 |
+
[
|
458 |
+
'label' => __( 'Alignment', 'wts-eae' ),
|
459 |
+
'type' => Controls_Manager::CHOOSE,
|
460 |
+
'options' => [
|
461 |
+
'left' => [
|
462 |
+
'title' => __( 'Left', 'wts-eae' ),
|
463 |
+
'icon' => 'fa fa-align-left',
|
464 |
+
],
|
465 |
+
'center' => [
|
466 |
+
'title' => __( 'Center', 'wts-eae' ),
|
467 |
+
'icon' => 'fa fa-align-center',
|
468 |
+
],
|
469 |
+
'right' => [
|
470 |
+
'title' => __( 'Right', 'wts-eae' ),
|
471 |
+
'icon' => 'fa fa-align-right',
|
472 |
+
],
|
473 |
+
],
|
474 |
+
'selectors' => [
|
475 |
+
'{{WRAPPER}} .eae-tabs nav' => 'text-align: {{VALUE}};',
|
476 |
+
],
|
477 |
+
]
|
478 |
+
);
|
479 |
+
|
480 |
+
$this->add_responsive_control(
|
481 |
+
'icon_size',
|
482 |
+
[
|
483 |
+
'label' => __( 'Icon Size', 'wts-eae' ),
|
484 |
+
'type' => Controls_Manager::SLIDER,
|
485 |
+
'default' => [
|
486 |
+
'size' => 20,
|
487 |
+
],
|
488 |
+
'range' => [
|
489 |
+
'px' => [
|
490 |
+
'min' => 6,
|
491 |
+
'max' => 30,
|
492 |
+
],
|
493 |
+
],
|
494 |
+
'selectors' => [
|
495 |
+
'{{WRAPPER}} .eae-tab-nav li a>:first-child' => 'width: {{SIZE}}{{UNIT}};',
|
496 |
+
'{{WRAPPER}} .eae-tab-nav li a>:first-child ' => 'font-size: {{SIZE}}{{UNIT}};',
|
497 |
+
],
|
498 |
+
]
|
499 |
+
);
|
500 |
+
|
501 |
+
|
502 |
+
$this->end_controls_section();
|
503 |
+
|
504 |
+
$this->start_controls_section(
|
505 |
+
'tab_content_style',
|
506 |
+
[
|
507 |
+
'label' => __('Content', 'wts-eae'),
|
508 |
+
'tab' => Controls_Manager::TAB_STYLE
|
509 |
+
]
|
510 |
+
);
|
511 |
+
|
512 |
+
$this->add_responsive_control(
|
513 |
+
'tab_text_align',
|
514 |
+
[
|
515 |
+
'label' => __( 'Alignment', 'wts-eae' ),
|
516 |
+
'type' => Controls_Manager::CHOOSE,
|
517 |
+
'options' => [
|
518 |
+
'left' => [
|
519 |
+
'title' => __( 'Left', 'wts-eae' ),
|
520 |
+
'icon' => 'fa fa-align-left',
|
521 |
+
],
|
522 |
+
'center' => [
|
523 |
+
'title' => __( 'Center', 'wts-eae' ),
|
524 |
+
'icon' => 'fa fa-align-center',
|
525 |
+
],
|
526 |
+
'right' => [
|
527 |
+
'title' => __( 'Right', 'wts-eae' ),
|
528 |
+
'icon' => 'fa fa-align-right',
|
529 |
+
],
|
530 |
+
'justify' => [
|
531 |
+
'title' => __( 'Justified', 'wts-eae' ),
|
532 |
+
'icon' => 'fa fa-align-justify',
|
533 |
+
],
|
534 |
+
],
|
535 |
+
'selectors' => [
|
536 |
+
'{{WRAPPER}} .eae-content section' => 'text-align: {{VALUE}};',
|
537 |
+
],
|
538 |
+
]
|
539 |
+
);
|
540 |
+
|
541 |
+
$this->add_control(
|
542 |
+
'text_color',
|
543 |
+
[
|
544 |
+
'label' => __( 'Text Color', 'wts-eae' ),
|
545 |
+
'type' => Controls_Manager::COLOR,
|
546 |
+
'default' => '',
|
547 |
+
'selectors' => [
|
548 |
+
'{{WRAPPER}} .eae-content section' => 'color: {{VALUE}};',
|
549 |
+
],
|
550 |
+
'scheme' => [
|
551 |
+
'type' => Scheme_Color::get_type(),
|
552 |
+
'value' => Scheme_Color::COLOR_3,
|
553 |
+
],
|
554 |
+
]
|
555 |
+
);
|
556 |
+
|
557 |
+
$this->add_group_control(
|
558 |
+
Group_Control_Typography::get_type(),
|
559 |
+
[
|
560 |
+
'name' => 'content_typography',
|
561 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_3,
|
562 |
+
'selector' => '{{WRAPPER}} .eae-content section'
|
563 |
+
]
|
564 |
+
);
|
565 |
+
|
566 |
+
$this->add_group_control(
|
567 |
+
Group_Control_Border::get_type(),
|
568 |
+
[
|
569 |
+
'name' => 'tab_content_border',
|
570 |
+
'selector' => '{{WRAPPER}} .eae-content section',
|
571 |
+
'separator' => 'before',
|
572 |
+
]
|
573 |
+
);
|
574 |
+
|
575 |
+
$this->add_responsive_control(
|
576 |
+
'tab_content_border_radius',
|
577 |
+
[
|
578 |
+
'label' => __( 'Border Radius', 'wts-eae' ),
|
579 |
+
'type' => Controls_Manager::DIMENSIONS,
|
580 |
+
'size_units' => [ 'px', '%' ],
|
581 |
+
'selectors' => [
|
582 |
+
'{{WRAPPER}} .eae-content section' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
583 |
+
],
|
584 |
+
]
|
585 |
+
);
|
586 |
+
|
587 |
+
$this->end_controls_section();
|
588 |
+
}
|
589 |
+
|
590 |
+
|
591 |
+
protected function render() {
|
592 |
+
$settings = $this->get_settings();
|
593 |
+
//print_r($this->get_id());
|
594 |
+
//echo "<pre>";print_r($settings['eae_tabs']);echo "</pre>";
|
595 |
+
|
596 |
+
?>
|
597 |
+
|
598 |
+
<?php if(count($settings['eae_tabs'])){
|
599 |
+
?>
|
600 |
+
<div id="advance_tabs" class="eae-tabs text-mobile-<?php echo $settings['show_text_mobile'] ?>" data-sticky-menu="<?php echo "eae-nav-sticky-".$settings['tab_Sticky'] ?>" data-scroll-offset="<?php echo $settings['scroll_offset'] ?>" >
|
601 |
+
<nav class="eae-tab-nav">
|
602 |
+
<ul>
|
603 |
+
<?php
|
604 |
+
$a_style="";
|
605 |
+
$var1 = 1;
|
606 |
+
foreach ($settings['eae_tabs'] as $tab){
|
607 |
+
if($var1 == 1)
|
608 |
+
{
|
609 |
+
$cont ="class='tab-current'";
|
610 |
+
}
|
611 |
+
else{
|
612 |
+
$cont ="";
|
613 |
+
}
|
614 |
+
$var1 ++;
|
615 |
+
?>
|
616 |
+
<li <?php echo $cont; ?> ><a href="<?php echo '#'.$tab['_id']; ?> " >
|
617 |
+
<?php
|
618 |
+
if($tab['tab_element']== "none")
|
619 |
+
$a_style="";
|
620 |
+
if($tab['tab_element']== "icon")
|
621 |
+
$a_style = '<i class="'.$tab['tab_icon'].'"></i>';
|
622 |
+
if($tab['tab_element']== "image")
|
623 |
+
$a_style = '<img src="'.$tab['tab_image']['url'].'"></img>';
|
624 |
+
|
625 |
+
echo $a_style;
|
626 |
+
?>
|
627 |
+
<span><?php echo $tab['tab_title']; ?></span></a></li>
|
628 |
+
<?php
|
629 |
+
}
|
630 |
+
|
631 |
+
?>
|
632 |
+
</ul>
|
633 |
+
</nav>
|
634 |
+
<div class="eae-content">
|
635 |
+
<?php
|
636 |
+
$var = 1;
|
637 |
+
foreach ($settings['eae_tabs'] as $index => $tab){
|
638 |
+
$eae_tab_content_key = $this->get_repeater_setting_key( 'tab_content', 'eae_tabs', $index );
|
639 |
+
if($var == 1)
|
640 |
+
{
|
641 |
+
$this->add_render_attribute( $eae_tab_content_key, [
|
642 |
+
'class' => [ 'content-current'],
|
643 |
+
] );
|
644 |
+
}
|
645 |
+
$var++;
|
646 |
+
|
647 |
+
$this->add_inline_editing_attributes( $eae_tab_content_key, 'advanced' );
|
648 |
+
|
649 |
+
?>
|
650 |
+
|
651 |
+
<section id="<?php echo "#".$tab['_id']; ?>" <?php echo $this->get_render_attribute_string( $eae_tab_content_key); ?> >
|
652 |
+
<?php
|
653 |
+
echo $tab['tab_content'];
|
654 |
+
?>
|
655 |
+
</section>
|
656 |
+
|
657 |
+
<?php
|
658 |
+
}
|
659 |
+
?>
|
660 |
+
|
661 |
+
</div>
|
662 |
+
</div>
|
663 |
+
<?php
|
664 |
+
}
|
665 |
+
}
|
666 |
+
|
667 |
+
protected function _content_template() {
|
668 |
+
?>
|
669 |
+
<# if(settings.eae_tabs){ #>
|
670 |
+
<div id="advance_tabs" class="eae-tabs text-mobile-{{{settings.show_text_mobile }}}" data-sticky-menu="eae-nav-sticky-{{{settings.tab_Sticky}}}" data-scroll-offset="{{{settings.scroll_offset}}}" >
|
671 |
+
<nav class="eae-tab-nav">
|
672 |
+
<ul>
|
673 |
+
<#
|
674 |
+
|
675 |
+
var var1 = 1;
|
676 |
+
var cont ="";
|
677 |
+
_.each( settings.eae_tabs, function( tab, index ) {
|
678 |
+
var a_style="";
|
679 |
+
if(var1 == 1)
|
680 |
+
{
|
681 |
+
cont ="class='tab-current'";
|
682 |
+
}
|
683 |
+
else{
|
684 |
+
cont ="";
|
685 |
+
}
|
686 |
+
var1 ++;
|
687 |
+
#>
|
688 |
+
<li {{{cont}}} ><a href="{{{'#'+settings.eae_tabs._id }}} " >
|
689 |
+
<#
|
690 |
+
view.addRenderAttribute('iconclass','class',tab.tab_icon);
|
691 |
+
if(tab.tab_element == "none")
|
692 |
+
a_style="";
|
693 |
+
if(tab.tab_element == "icon")
|
694 |
+
a_style = '<i class="'+ tab.tab_icon + '"></i>';
|
695 |
+
if(tab.tab_element== "image")
|
696 |
+
a_style = '<img src="+ tab.tab_image.url +"/>';
|
697 |
+
#>
|
698 |
+
|
699 |
+
{{{a_style}}}
|
700 |
+
<span>{{{ tab.tab_title}}}</span></a></li>
|
701 |
+
<# } ); #>
|
702 |
+
|
703 |
+
</ul>
|
704 |
+
</nav>
|
705 |
+
|
706 |
+
<div class="eae-content">
|
707 |
+
<#
|
708 |
+
var var2 = 1;
|
709 |
+
var cont ="";
|
710 |
+
_.each( settings.eae_tabs, function( tab, index ) {
|
711 |
+
var eae_tab_content_key = view.getRepeaterSettingKey( 'tab_content', 'eae_tabs', index );
|
712 |
+
|
713 |
+
if(var2 == 1)
|
714 |
+
{
|
715 |
+
view.addRenderAttribute( eae_tab_content_key, {
|
716 |
+
'class': 'content-current',
|
717 |
+
});
|
718 |
+
}
|
719 |
+
else{
|
720 |
+
cont ="";
|
721 |
+
}
|
722 |
+
var2++;
|
723 |
+
view.addInlineEditingAttributes( eae_tab_content_key, 'advanced' );
|
724 |
+
|
725 |
+
#>
|
726 |
+
<section id="#{{{tab._id}}}" {{{ view.getRenderAttributeString(eae_tab_content_key)}}}>
|
727 |
+
{{{tab.tab_content}}}
|
728 |
+
</section>
|
729 |
+
|
730 |
+
<#
|
731 |
+
});
|
732 |
+
#>
|
733 |
+
|
734 |
+
</div>
|
735 |
+
</div>
|
736 |
+
<# } #>
|
737 |
+
<?php
|
738 |
+
}
|
739 |
+
|
740 |
+
|
741 |
+
}
|
742 |
+
|
743 |
Plugin::instance()->widgets_manager->register_widget_type( new Widget_Advance_Tabs() );
|
elements/animated-text.php
CHANGED
@@ -1,395 +1,395 @@
|
|
1 |
-
<?php
|
2 |
-
namespace Elementor;
|
3 |
-
|
4 |
-
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
5 |
-
|
6 |
-
class Widget_AnimatedText extends Widget_Base {
|
7 |
-
|
8 |
-
public function get_name() {
|
9 |
-
return 'wts-AnimatedText';
|
10 |
-
}
|
11 |
-
|
12 |
-
public function get_title() {
|
13 |
-
return __( 'EAE - Animated Text', '
|
14 |
-
}
|
15 |
-
|
16 |
-
public function get_icon() {
|
17 |
-
return 'eicon-animation-text wts-eae-pe';
|
18 |
-
}
|
19 |
-
|
20 |
-
public function get_categories() {
|
21 |
-
return [ 'wts-eae' ];
|
22 |
-
}
|
23 |
-
|
24 |
-
protected function _register_controls() {
|
25 |
-
$this->start_controls_section(
|
26 |
-
'section_general',
|
27 |
-
[
|
28 |
-
'label' => __( 'General', '
|
29 |
-
]
|
30 |
-
);
|
31 |
-
|
32 |
-
|
33 |
-
$this->add_responsive_control(
|
34 |
-
'text-align',
|
35 |
-
[
|
36 |
-
'label' => __( 'Alignment', '
|
37 |
-
'type' => Controls_Manager::CHOOSE,
|
38 |
-
'options' => [
|
39 |
-
'left' => [
|
40 |
-
'title' => __( 'Left', '
|
41 |
-
'icon' => 'fa fa-align-left',
|
42 |
-
],
|
43 |
-
'center' => [
|
44 |
-
'title' => __( 'Center', '
|
45 |
-
'icon' => 'fa fa-align-center',
|
46 |
-
],
|
47 |
-
'right' => [
|
48 |
-
'title' => __( 'Right', '
|
49 |
-
'icon' => 'fa fa-align-right',
|
50 |
-
]
|
51 |
-
],
|
52 |
-
'default' => '',
|
53 |
-
'selectors' => [
|
54 |
-
'{{WRAPPER}} .eae-at-animation' => 'text-align: {{VALUE}};',
|
55 |
-
]
|
56 |
-
]
|
57 |
-
);
|
58 |
-
|
59 |
-
$this->add_control(
|
60 |
-
'pre-text',
|
61 |
-
[
|
62 |
-
'label' => __( 'Pre Text', '
|
63 |
-
'type' => Controls_Manager::TEXTAREA,
|
64 |
-
'placeholder' => __( 'Enter text', '
|
65 |
-
'default' => __( 'I Love', '
|
66 |
-
]
|
67 |
-
);
|
68 |
-
|
69 |
-
|
70 |
-
$this->add_control(
|
71 |
-
'animation-text-list',
|
72 |
-
[
|
73 |
-
'label' => __( 'Animated Text List', '
|
74 |
-
'type' => Controls_Manager::REPEATER,
|
75 |
-
'default' => [
|
76 |
-
[
|
77 |
-
'text' => __( 'Football', '
|
78 |
-
],
|
79 |
-
[
|
80 |
-
'text' => __( 'Cricket', '
|
81 |
-
],
|
82 |
-
[
|
83 |
-
'text' => __( 'Basketball', '
|
84 |
-
],
|
85 |
-
],
|
86 |
-
'fields' => [
|
87 |
-
[
|
88 |
-
'name' => 'text',
|
89 |
-
'label' => __( 'Text', '
|
90 |
-
'type' => Controls_Manager::TEXT,
|
91 |
-
'label_block' => true,
|
92 |
-
'placeholder' => __( 'Text to animate', '
|
93 |
-
'default' => __( '', '
|
94 |
-
],
|
95 |
-
],
|
96 |
-
'title_field' => '{{{ text }}}'
|
97 |
-
]
|
98 |
-
);
|
99 |
-
|
100 |
-
$this->add_control(
|
101 |
-
'post-text',
|
102 |
-
[
|
103 |
-
'label' => __( 'Post Text', '
|
104 |
-
'type' => Controls_Manager::TEXTAREA,
|
105 |
-
'placeholder' => __( 'Enter text', '
|
106 |
-
'default' => __( 'Very Much', '
|
107 |
-
]
|
108 |
-
);
|
109 |
-
|
110 |
-
$this->end_controls_section();
|
111 |
-
|
112 |
-
$this->start_controls_section(
|
113 |
-
'section_pre_text_style',
|
114 |
-
[
|
115 |
-
'label' => __( 'Pre Text', '
|
116 |
-
'tab' => Controls_Manager::TAB_STYLE,
|
117 |
-
]
|
118 |
-
);
|
119 |
-
|
120 |
-
|
121 |
-
$this->add_control(
|
122 |
-
'pre_text_color',
|
123 |
-
[
|
124 |
-
'label' => __( 'Pre Text Color', '
|
125 |
-
'type' => Controls_Manager::COLOR,
|
126 |
-
'scheme' => [
|
127 |
-
'type' => Scheme_Color::get_type(),
|
128 |
-
'value' => Scheme_Color::COLOR_1,
|
129 |
-
],
|
130 |
-
'selectors' => [
|
131 |
-
'{{WRAPPER}} .eae-at-pre-text' => 'color: {{VALUE}};',
|
132 |
-
],
|
133 |
-
]
|
134 |
-
);
|
135 |
-
|
136 |
-
$this->add_group_control(
|
137 |
-
Group_Control_Typography::get_type(),
|
138 |
-
[
|
139 |
-
'name' => 'pre_text_typography',
|
140 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
141 |
-
'selector' => '{{WRAPPER}} .eae-at-pre-text',
|
142 |
-
]
|
143 |
-
);
|
144 |
-
|
145 |
-
|
146 |
-
$this->end_controls_section();
|
147 |
-
|
148 |
-
|
149 |
-
$this->start_controls_section(
|
150 |
-
'section_animation_text_style',
|
151 |
-
[
|
152 |
-
'label' => __( 'Animated Text', '
|
153 |
-
'tab' => Controls_Manager::TAB_STYLE,
|
154 |
-
]
|
155 |
-
);
|
156 |
-
|
157 |
-
|
158 |
-
$this->add_group_control(
|
159 |
-
Group_Control_Typography::get_type(),
|
160 |
-
[
|
161 |
-
'name' => 'animation_color_typography',
|
162 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
163 |
-
'selector' => '{{WRAPPER}} .eae-at-animation-text, {{WRAPPER}} .eae-at-animation-text i',
|
164 |
-
]
|
165 |
-
);
|
166 |
-
|
167 |
-
|
168 |
-
$this->add_control(
|
169 |
-
'animation_color',
|
170 |
-
[
|
171 |
-
'label' => __( 'Animation Text Color', '
|
172 |
-
'type' => Controls_Manager::COLOR,
|
173 |
-
'scheme' => [
|
174 |
-
'type' => Scheme_Color::get_type(),
|
175 |
-
'value' => Scheme_Color::COLOR_4,
|
176 |
-
],
|
177 |
-
'selectors' => [
|
178 |
-
'{{WRAPPER}} .eae-at-animation-text' => 'color: {{VALUE}};',
|
179 |
-
],
|
180 |
-
]
|
181 |
-
);
|
182 |
-
|
183 |
-
$this->add_group_control(
|
184 |
-
Group_Control_Border::get_type(),
|
185 |
-
[
|
186 |
-
'name' => 'animated_text_border',
|
187 |
-
'label' => __( 'Box Border', '
|
188 |
-
'selector' => '{{WRAPPER}} .eae-at-animation-text-wrapper .eae-at-animation-text.is-visible',
|
189 |
-
]
|
190 |
-
);
|
191 |
-
|
192 |
-
|
193 |
-
|
194 |
-
$this->add_control(
|
195 |
-
'box_border_radius',
|
196 |
-
[
|
197 |
-
'label' => __( 'Border Radius', '
|
198 |
-
'type' => Controls_Manager::DIMENSIONS,
|
199 |
-
'size_units' => [ 'px', '%' ],
|
200 |
-
'selectors' => [
|
201 |
-
'{{WRAPPER}} .eae-at-animation-text-wrapper .eae-at-animation-text.is-visible' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
202 |
-
],
|
203 |
-
]
|
204 |
-
);
|
205 |
-
|
206 |
-
$this->add_control(
|
207 |
-
'box_padding',
|
208 |
-
[
|
209 |
-
'label' => __( 'Padding', '
|
210 |
-
'type' => Controls_Manager::DIMENSIONS,
|
211 |
-
'size_units' => [ 'px', '%' ],
|
212 |
-
'selectors' => [
|
213 |
-
'{{WRAPPER}} .eae-at-animation-text-wrapper .eae-at-animation-text.is-visible' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
214 |
-
],
|
215 |
-
]
|
216 |
-
);
|
217 |
-
$this->add_control(
|
218 |
-
'box_margin',
|
219 |
-
[
|
220 |
-
'label' => __( 'Margin', '
|
221 |
-
'type' => Controls_Manager::DIMENSIONS,
|
222 |
-
'size_units' => [ 'px', '%' ],
|
223 |
-
'selectors' => [
|
224 |
-
'{{WRAPPER}} .eae-at-animation-text-wrapper .eae-at-animation-text.is-visible' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
225 |
-
],
|
226 |
-
]
|
227 |
-
);
|
228 |
-
|
229 |
-
|
230 |
-
|
231 |
-
$this->add_group_control(
|
232 |
-
Group_Control_Background::get_type(),
|
233 |
-
[
|
234 |
-
'name' => 'animation_section_bg',
|
235 |
-
'label' => __( 'Section Background', '
|
236 |
-
'types' => [ 'classic','gradient' ],
|
237 |
-
'selector' => '{{WRAPPER}} .eae-at-animation-text-wrapper .eae-at-animation-text.is-visible',
|
238 |
-
]
|
239 |
-
);
|
240 |
-
|
241 |
-
|
242 |
-
|
243 |
-
$this->end_controls_section();
|
244 |
-
|
245 |
-
$this->start_controls_section(
|
246 |
-
'section_cursor_style',
|
247 |
-
[
|
248 |
-
'label' => __( 'Cursor Control', '
|
249 |
-
'tab' => Controls_Manager::TAB_STYLE,
|
250 |
-
]
|
251 |
-
);
|
252 |
-
|
253 |
-
|
254 |
-
$this->add_control(
|
255 |
-
'cursor_color',
|
256 |
-
[
|
257 |
-
'label' => __( 'Color', '
|
258 |
-
'type' => Controls_Manager::COLOR,
|
259 |
-
'scheme' => [
|
260 |
-
'type' => Scheme_Color::get_type(),
|
261 |
-
'value' => Scheme_Color::COLOR_1,
|
262 |
-
],
|
263 |
-
'default' => '#54595f',
|
264 |
-
'selectors' => [
|
265 |
-
'{{WRAPPER}} .eae-at-animation-text-wrapper::after' => 'background-color: {{VALUE}};',
|
266 |
-
],
|
267 |
-
]
|
268 |
-
);
|
269 |
-
|
270 |
-
$this->add_responsive_control(
|
271 |
-
'cursor_width',
|
272 |
-
[
|
273 |
-
'label' => __( 'Width', '
|
274 |
-
'type' => Controls_Manager::SLIDER,
|
275 |
-
'size_units' => [ 'px' ],
|
276 |
-
'default' => [
|
277 |
-
'size' => 1,
|
278 |
-
'unit' => 'px',
|
279 |
-
],
|
280 |
-
'range' => [
|
281 |
-
'px' => [
|
282 |
-
'min' => 1,
|
283 |
-
'max' => 5,
|
284 |
-
],
|
285 |
-
],
|
286 |
-
'selectors' => [
|
287 |
-
'{{WRAPPER}} .eae-at-animation.type .eae-at-animation-text-wrapper::after' => 'width: {{SIZE}}{{UNIT}};',
|
288 |
-
],
|
289 |
-
]
|
290 |
-
);
|
291 |
-
|
292 |
-
$this->end_controls_section();
|
293 |
-
|
294 |
-
$this->start_controls_section(
|
295 |
-
'section_post_text_style',
|
296 |
-
[
|
297 |
-
'label' => __( 'Post Text', '
|
298 |
-
'tab' => Controls_Manager::TAB_STYLE,
|
299 |
-
]
|
300 |
-
);
|
301 |
-
|
302 |
-
|
303 |
-
$this->add_control(
|
304 |
-
'post_text_color',
|
305 |
-
[
|
306 |
-
'label' => __( 'Post Text Color', '
|
307 |
-
'type' => Controls_Manager::COLOR,
|
308 |
-
'scheme' => [
|
309 |
-
'type' => Scheme_Color::get_type(),
|
310 |
-
'value' => Scheme_Color::COLOR_1,
|
311 |
-
],
|
312 |
-
'selectors' => [
|
313 |
-
'{{WRAPPER}} .eae-at-post-text' => 'color: {{VALUE}};',
|
314 |
-
],
|
315 |
-
]
|
316 |
-
);
|
317 |
-
|
318 |
-
$this->add_group_control(
|
319 |
-
Group_Control_Typography::get_type(),
|
320 |
-
[
|
321 |
-
'name' => 'post_text_typography',
|
322 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
323 |
-
'selector' => '{{WRAPPER}} .eae-at-post-text',
|
324 |
-
]
|
325 |
-
);
|
326 |
-
|
327 |
-
$this->end_controls_section();
|
328 |
-
}
|
329 |
-
|
330 |
-
protected function render(){
|
331 |
-
$settings = $this->get_settings();
|
332 |
-
|
333 |
-
$this->add_render_attribute('eae-at-animated-text-wrapper','class','eae-at-animation-text-wrapper');
|
334 |
-
|
335 |
-
$this->add_render_attribute('eae-at-animated-text-wrapper','class','waiting');
|
336 |
-
|
337 |
-
$this->add_render_attribute('eae-at-animated-text','class','eae-at-animation-text');
|
338 |
-
|
339 |
-
$this->add_render_attribute('eae-at-pre-txt','class','eae-at-pre-text');
|
340 |
-
|
341 |
-
$this->add_render_attribute('eae-at-animated','class','eae-at-animation');
|
342 |
-
|
343 |
-
$this->add_render_attribute('eae-at-animated','class','type');
|
344 |
-
|
345 |
-
$this->add_render_attribute('eae-at-animated','class','letters');
|
346 |
-
|
347 |
-
$this->add_render_attribute('eae-at-post-txt','class','eae-at-post-text');
|
348 |
-
|
349 |
-
?>
|
350 |
-
<div id="eae-at-<?php echo $this->get_id(); ?>" class="eae-animtext-wrapper">
|
351 |
-
<div <?php echo $this->get_render_attribute_string( 'eae-at-animated' ); ?>>
|
352 |
-
<span <?php echo $this->get_render_attribute_string( 'eae-at-pre-txt' ); ?>><?php echo $settings['pre-text']; ?></span>
|
353 |
-
<?php if(count($settings['animation-text-list'])){
|
354 |
-
?>
|
355 |
-
<span <?php echo $this->get_render_attribute_string( 'eae-at-animated-text-wrapper' ); ?>>
|
356 |
-
<?php
|
357 |
-
foreach($settings['animation-text-list'] as $animation_text){
|
358 |
-
?>
|
359 |
-
|
360 |
-
<span <?php echo $this->get_render_attribute_string( 'eae-at-animated-text' ); ?>><?php echo $animation_text['text']; ?></span>
|
361 |
-
|
362 |
-
<?php
|
363 |
-
}
|
364 |
-
?>
|
365 |
-
</span>
|
366 |
-
<?php
|
367 |
-
}?>
|
368 |
-
<span <?php echo $this->get_render_attribute_string( 'eae-at-post-txt' ); ?>><?php echo $settings['post-text']; ?></span>
|
369 |
-
</div>
|
370 |
-
</div>
|
371 |
-
<script>
|
372 |
-
console.log('before-trigger');
|
373 |
-
jQuery(document).trigger('elementor/render/animation-text','#eae-at-<?php echo $this->get_id(); ?>');
|
374 |
-
|
375 |
-
jQuery(document).ready(function(){
|
376 |
-
jQuery(document).trigger('elementor/render/animation-text','#eae-at-<?php echo $this->get_id(); ?>');
|
377 |
-
});
|
378 |
-
</script>
|
379 |
-
<?php
|
380 |
-
}
|
381 |
-
|
382 |
-
protected function content_template() {
|
383 |
-
?>
|
384 |
-
<#
|
385 |
-
|
386 |
-
box_html = '';
|
387 |
-
|
388 |
-
print( separator_html );
|
389 |
-
#>
|
390 |
-
<?php
|
391 |
-
}
|
392 |
-
}
|
393 |
-
|
394 |
-
Plugin::instance()->widgets_manager->register_widget_type( new Widget_AnimatedText() );
|
395 |
?>
|
1 |
+
<?php
|
2 |
+
namespace Elementor;
|
3 |
+
|
4 |
+
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
5 |
+
|
6 |
+
class Widget_AnimatedText extends Widget_Base {
|
7 |
+
|
8 |
+
public function get_name() {
|
9 |
+
return 'wts-AnimatedText';
|
10 |
+
}
|
11 |
+
|
12 |
+
public function get_title() {
|
13 |
+
return __( 'EAE - Animated Text', 'wts-eae' );
|
14 |
+
}
|
15 |
+
|
16 |
+
public function get_icon() {
|
17 |
+
return 'eicon-animation-text wts-eae-pe';
|
18 |
+
}
|
19 |
+
|
20 |
+
public function get_categories() {
|
21 |
+
return [ 'wts-eae' ];
|
22 |
+
}
|
23 |
+
|
24 |
+
protected function _register_controls() {
|
25 |
+
$this->start_controls_section(
|
26 |
+
'section_general',
|
27 |
+
[
|
28 |
+
'label' => __( 'General', 'wts-eae' )
|
29 |
+
]
|
30 |
+
);
|
31 |
+
|
32 |
+
|
33 |
+
$this->add_responsive_control(
|
34 |
+
'text-align',
|
35 |
+
[
|
36 |
+
'label' => __( 'Alignment', 'wts-eae' ),
|
37 |
+
'type' => Controls_Manager::CHOOSE,
|
38 |
+
'options' => [
|
39 |
+
'left' => [
|
40 |
+
'title' => __( 'Left', 'wts-eae' ),
|
41 |
+
'icon' => 'fa fa-align-left',
|
42 |
+
],
|
43 |
+
'center' => [
|
44 |
+
'title' => __( 'Center', 'wts-eae' ),
|
45 |
+
'icon' => 'fa fa-align-center',
|
46 |
+
],
|
47 |
+
'right' => [
|
48 |
+
'title' => __( 'Right', 'wts-eae' ),
|
49 |
+
'icon' => 'fa fa-align-right',
|
50 |
+
]
|
51 |
+
],
|
52 |
+
'default' => '',
|
53 |
+
'selectors' => [
|
54 |
+
'{{WRAPPER}} .eae-at-animation' => 'text-align: {{VALUE}};',
|
55 |
+
]
|
56 |
+
]
|
57 |
+
);
|
58 |
+
|
59 |
+
$this->add_control(
|
60 |
+
'pre-text',
|
61 |
+
[
|
62 |
+
'label' => __( 'Pre Text', 'wts-eae' ),
|
63 |
+
'type' => Controls_Manager::TEXTAREA,
|
64 |
+
'placeholder' => __( 'Enter text', 'wts-eae' ),
|
65 |
+
'default' => __( 'I Love', 'wts-eae' ),
|
66 |
+
]
|
67 |
+
);
|
68 |
+
|
69 |
+
|
70 |
+
$this->add_control(
|
71 |
+
'animation-text-list',
|
72 |
+
[
|
73 |
+
'label' => __( 'Animated Text List', 'wts-eae' ),
|
74 |
+
'type' => Controls_Manager::REPEATER,
|
75 |
+
'default' => [
|
76 |
+
[
|
77 |
+
'text' => __( 'Football', 'wts-eae' ),
|
78 |
+
],
|
79 |
+
[
|
80 |
+
'text' => __( 'Cricket', 'wts-eae' ),
|
81 |
+
],
|
82 |
+
[
|
83 |
+
'text' => __( 'Basketball', 'wts-eae' ),
|
84 |
+
],
|
85 |
+
],
|
86 |
+
'fields' => [
|
87 |
+
[
|
88 |
+
'name' => 'text',
|
89 |
+
'label' => __( 'Text', 'wts-eae' ),
|
90 |
+
'type' => Controls_Manager::TEXT,
|
91 |
+
'label_block' => true,
|
92 |
+
'placeholder' => __( 'Text to animate', 'wts-eae' ),
|
93 |
+
'default' => __( '', 'wts-eae' ),
|
94 |
+
],
|
95 |
+
],
|
96 |
+
'title_field' => '{{{ text }}}'
|
97 |
+
]
|
98 |
+
);
|
99 |
+
|
100 |
+
$this->add_control(
|
101 |
+
'post-text',
|
102 |
+
[
|
103 |
+
'label' => __( 'Post Text', 'wts-eae' ),
|
104 |
+
'type' => Controls_Manager::TEXTAREA,
|
105 |
+
'placeholder' => __( 'Enter text', 'wts-eae' ),
|
106 |
+
'default' => __( 'Very Much', 'wts-eae' ),
|
107 |
+
]
|
108 |
+
);
|
109 |
+
|
110 |
+
$this->end_controls_section();
|
111 |
+
|
112 |
+
$this->start_controls_section(
|
113 |
+
'section_pre_text_style',
|
114 |
+
[
|
115 |
+
'label' => __( 'Pre Text', 'wts-eae' ),
|
116 |
+
'tab' => Controls_Manager::TAB_STYLE,
|
117 |
+
]
|
118 |
+
);
|
119 |
+
|
120 |
+
|
121 |
+
$this->add_control(
|
122 |
+
'pre_text_color',
|
123 |
+
[
|
124 |
+
'label' => __( 'Pre Text Color', 'wts-eae' ),
|
125 |
+
'type' => Controls_Manager::COLOR,
|
126 |
+
'scheme' => [
|
127 |
+
'type' => Scheme_Color::get_type(),
|
128 |
+
'value' => Scheme_Color::COLOR_1,
|
129 |
+
],
|
130 |
+
'selectors' => [
|
131 |
+
'{{WRAPPER}} .eae-at-pre-text' => 'color: {{VALUE}};',
|
132 |
+
],
|
133 |
+
]
|
134 |
+
);
|
135 |
+
|
136 |
+
$this->add_group_control(
|
137 |
+
Group_Control_Typography::get_type(),
|
138 |
+
[
|
139 |
+
'name' => 'pre_text_typography',
|
140 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
141 |
+
'selector' => '{{WRAPPER}} .eae-at-pre-text',
|
142 |
+
]
|
143 |
+
);
|
144 |
+
|
145 |
+
|
146 |
+
$this->end_controls_section();
|
147 |
+
|
148 |
+
|
149 |
+
$this->start_controls_section(
|
150 |
+
'section_animation_text_style',
|
151 |
+
[
|
152 |
+
'label' => __( 'Animated Text', 'wts-eae' ),
|
153 |
+
'tab' => Controls_Manager::TAB_STYLE,
|
154 |
+
]
|
155 |
+
);
|
156 |
+
|
157 |
+
|
158 |
+
$this->add_group_control(
|
159 |
+
Group_Control_Typography::get_type(),
|
160 |
+
[
|
161 |
+
'name' => 'animation_color_typography',
|
162 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
163 |
+
'selector' => '{{WRAPPER}} .eae-at-animation-text, {{WRAPPER}} .eae-at-animation-text i',
|
164 |
+
]
|
165 |
+
);
|
166 |
+
|
167 |
+
|
168 |
+
$this->add_control(
|
169 |
+
'animation_color',
|
170 |
+
[
|
171 |
+
'label' => __( 'Animation Text Color', 'wts-eae' ),
|
172 |
+
'type' => Controls_Manager::COLOR,
|
173 |
+
'scheme' => [
|
174 |
+
'type' => Scheme_Color::get_type(),
|
175 |
+
'value' => Scheme_Color::COLOR_4,
|
176 |
+
],
|
177 |
+
'selectors' => [
|
178 |
+
'{{WRAPPER}} .eae-at-animation-text' => 'color: {{VALUE}};',
|
179 |
+
],
|
180 |
+
]
|
181 |
+
);
|
182 |
+
|
183 |
+
$this->add_group_control(
|
184 |
+
Group_Control_Border::get_type(),
|
185 |
+
[
|
186 |
+
'name' => 'animated_text_border',
|
187 |
+
'label' => __( 'Box Border', 'wts-eae' ),
|
188 |
+
'selector' => '{{WRAPPER}} .eae-at-animation-text-wrapper .eae-at-animation-text.is-visible',
|
189 |
+
]
|
190 |
+
);
|
191 |
+
|
192 |
+
|
193 |
+
|
194 |
+
$this->add_control(
|
195 |
+
'box_border_radius',
|
196 |
+
[
|
197 |
+
'label' => __( 'Border Radius', 'wts-eae' ),
|
198 |
+
'type' => Controls_Manager::DIMENSIONS,
|
199 |
+
'size_units' => [ 'px', '%' ],
|
200 |
+
'selectors' => [
|
201 |
+
'{{WRAPPER}} .eae-at-animation-text-wrapper .eae-at-animation-text.is-visible' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
202 |
+
],
|
203 |
+
]
|
204 |
+
);
|
205 |
+
|
206 |
+
$this->add_control(
|
207 |
+
'box_padding',
|
208 |
+
[
|
209 |
+
'label' => __( 'Padding', 'wts-eae' ),
|
210 |
+
'type' => Controls_Manager::DIMENSIONS,
|
211 |
+
'size_units' => [ 'px', '%' ],
|
212 |
+
'selectors' => [
|
213 |
+
'{{WRAPPER}} .eae-at-animation-text-wrapper .eae-at-animation-text.is-visible' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
214 |
+
],
|
215 |
+
]
|
216 |
+
);
|
217 |
+
$this->add_control(
|
218 |
+
'box_margin',
|
219 |
+
[
|
220 |
+
'label' => __( 'Margin', 'wts-eae' ),
|
221 |
+
'type' => Controls_Manager::DIMENSIONS,
|
222 |
+
'size_units' => [ 'px', '%' ],
|
223 |
+
'selectors' => [
|
224 |
+
'{{WRAPPER}} .eae-at-animation-text-wrapper .eae-at-animation-text.is-visible' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
225 |
+
],
|
226 |
+
]
|
227 |
+
);
|
228 |
+
|
229 |
+
|
230 |
+
|
231 |
+
$this->add_group_control(
|
232 |
+
Group_Control_Background::get_type(),
|
233 |
+
[
|
234 |
+
'name' => 'animation_section_bg',
|
235 |
+
'label' => __( 'Section Background', 'wts-eae' ),
|
236 |
+
'types' => [ 'classic','gradient' ],
|
237 |
+
'selector' => '{{WRAPPER}} .eae-at-animation-text-wrapper .eae-at-animation-text.is-visible',
|
238 |
+
]
|
239 |
+
);
|
240 |
+
|
241 |
+
|
242 |
+
|
243 |
+
$this->end_controls_section();
|
244 |
+
|
245 |
+
$this->start_controls_section(
|
246 |
+
'section_cursor_style',
|
247 |
+
[
|
248 |
+
'label' => __( 'Cursor Control', 'wts-eae' ),
|
249 |
+
'tab' => Controls_Manager::TAB_STYLE,
|
250 |
+
]
|
251 |
+
);
|
252 |
+
|
253 |
+
|
254 |
+
$this->add_control(
|
255 |
+
'cursor_color',
|
256 |
+
[
|
257 |
+
'label' => __( 'Color', 'wts-eae' ),
|
258 |
+
'type' => Controls_Manager::COLOR,
|
259 |
+
'scheme' => [
|
260 |
+
'type' => Scheme_Color::get_type(),
|
261 |
+
'value' => Scheme_Color::COLOR_1,
|
262 |
+
],
|
263 |
+
'default' => '#54595f',
|
264 |
+
'selectors' => [
|
265 |
+
'{{WRAPPER}} .eae-at-animation-text-wrapper::after' => 'background-color: {{VALUE}};',
|
266 |
+
],
|
267 |
+
]
|
268 |
+
);
|
269 |
+
|
270 |
+
$this->add_responsive_control(
|
271 |
+
'cursor_width',
|
272 |
+
[
|
273 |
+
'label' => __( 'Width', 'wts-eae' ),
|
274 |
+
'type' => Controls_Manager::SLIDER,
|
275 |
+
'size_units' => [ 'px' ],
|
276 |
+
'default' => [
|
277 |
+
'size' => 1,
|
278 |
+
'unit' => 'px',
|
279 |
+
],
|
280 |
+
'range' => [
|
281 |
+
'px' => [
|
282 |
+
'min' => 1,
|
283 |
+
'max' => 5,
|
284 |
+
],
|
285 |
+
],
|
286 |
+
'selectors' => [
|
287 |
+
'{{WRAPPER}} .eae-at-animation.type .eae-at-animation-text-wrapper::after' => 'width: {{SIZE}}{{UNIT}};',
|
288 |
+
],
|
289 |
+
]
|
290 |
+
);
|
291 |
+
|
292 |
+
$this->end_controls_section();
|
293 |
+
|
294 |
+
$this->start_controls_section(
|
295 |
+
'section_post_text_style',
|
296 |
+
[
|
297 |
+
'label' => __( 'Post Text', 'wts-eae' ),
|
298 |
+
'tab' => Controls_Manager::TAB_STYLE,
|
299 |
+
]
|
300 |
+
);
|
301 |
+
|
302 |
+
|
303 |
+
$this->add_control(
|
304 |
+
'post_text_color',
|
305 |
+
[
|
306 |
+
'label' => __( 'Post Text Color', 'wts-eae' ),
|
307 |
+
'type' => Controls_Manager::COLOR,
|
308 |
+
'scheme' => [
|
309 |
+
'type' => Scheme_Color::get_type(),
|
310 |
+
'value' => Scheme_Color::COLOR_1,
|
311 |
+
],
|
312 |
+
'selectors' => [
|
313 |
+
'{{WRAPPER}} .eae-at-post-text' => 'color: {{VALUE}};',
|
314 |
+
],
|
315 |
+
]
|
316 |
+
);
|
317 |
+
|
318 |
+
$this->add_group_control(
|
319 |
+
Group_Control_Typography::get_type(),
|
320 |
+
[
|
321 |
+
'name' => 'post_text_typography',
|
322 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
323 |
+
'selector' => '{{WRAPPER}} .eae-at-post-text',
|
324 |
+
]
|
325 |
+
);
|
326 |
+
|
327 |
+
$this->end_controls_section();
|
328 |
+
}
|
329 |
+
|
330 |
+
protected function render(){
|
331 |
+
$settings = $this->get_settings();
|
332 |
+
|
333 |
+
$this->add_render_attribute('eae-at-animated-text-wrapper','class','eae-at-animation-text-wrapper');
|
334 |
+
|
335 |
+
$this->add_render_attribute('eae-at-animated-text-wrapper','class','waiting');
|
336 |
+
|
337 |
+
$this->add_render_attribute('eae-at-animated-text','class','eae-at-animation-text');
|
338 |
+
|
339 |
+
$this->add_render_attribute('eae-at-pre-txt','class','eae-at-pre-text');
|
340 |
+
|
341 |
+
$this->add_render_attribute('eae-at-animated','class','eae-at-animation');
|
342 |
+
|
343 |
+
$this->add_render_attribute('eae-at-animated','class','type');
|
344 |
+
|
345 |
+
$this->add_render_attribute('eae-at-animated','class','letters');
|
346 |
+
|
347 |
+
$this->add_render_attribute('eae-at-post-txt','class','eae-at-post-text');
|
348 |
+
|
349 |
+
?>
|
350 |
+
<div id="eae-at-<?php echo $this->get_id(); ?>" class="eae-animtext-wrapper">
|
351 |
+
<div <?php echo $this->get_render_attribute_string( 'eae-at-animated' ); ?>>
|
352 |
+
<span <?php echo $this->get_render_attribute_string( 'eae-at-pre-txt' ); ?>><?php echo $settings['pre-text']; ?></span>
|
353 |
+
<?php if(count($settings['animation-text-list'])){
|
354 |
+
?>
|
355 |
+
<span <?php echo $this->get_render_attribute_string( 'eae-at-animated-text-wrapper' ); ?>>
|
356 |
+
<?php
|
357 |
+
foreach($settings['animation-text-list'] as $animation_text){
|
358 |
+
?>
|
359 |
+
|
360 |
+
<span <?php echo $this->get_render_attribute_string( 'eae-at-animated-text' ); ?>><?php echo $animation_text['text']; ?></span>
|
361 |
+
|
362 |
+
<?php
|
363 |
+
}
|
364 |
+
?>
|
365 |
+
</span>
|
366 |
+
<?php
|
367 |
+
}?>
|
368 |
+
<span <?php echo $this->get_render_attribute_string( 'eae-at-post-txt' ); ?>><?php echo $settings['post-text']; ?></span>
|
369 |
+
</div>
|
370 |
+
</div>
|
371 |
+
<script>
|
372 |
+
console.log('before-trigger');
|
373 |
+
jQuery(document).trigger('elementor/render/animation-text','#eae-at-<?php echo $this->get_id(); ?>');
|
374 |
+
|
375 |
+
jQuery(document).ready(function(){
|
376 |
+
jQuery(document).trigger('elementor/render/animation-text','#eae-at-<?php echo $this->get_id(); ?>');
|
377 |
+
});
|
378 |
+
</script>
|
379 |
+
<?php
|
380 |
+
}
|
381 |
+
|
382 |
+
protected function content_template() {
|
383 |
+
?>
|
384 |
+
<#
|
385 |
+
|
386 |
+
box_html = '';
|
387 |
+
|
388 |
+
print( separator_html );
|
389 |
+
#>
|
390 |
+
<?php
|
391 |
+
}
|
392 |
+
}
|
393 |
+
|
394 |
+
Plugin::instance()->widgets_manager->register_widget_type( new Widget_AnimatedText() );
|
395 |
?>
|
elements/bg-slider.php
ADDED
@@ -0,0 +1,367 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
<?php
|
2 |
+
namespace Elementor;
|
3 |
+
|
4 |
+
use Elementor\Controls_Manager;
|
5 |
+
|
6 |
+
class EAE_Bg_Slider {
|
7 |
+
private static $_instance = null;
|
8 |
+
|
9 |
+
public static function instance() {
|
10 |
+
if ( is_null( self::$_instance ) ) {
|
11 |
+
self::$_instance = new self();
|
12 |
+
}
|
13 |
+
return self::$_instance;
|
14 |
+
}
|
15 |
+
|
16 |
+
private function __construct() {
|
17 |
+
add_action('elementor/element/after_section_end',[ $this, '_add_controls'],10,3);
|
18 |
+
|
19 |
+
add_action( 'elementor/frontend/element/before_render', [ $this, '_before_render'],10,1);
|
20 |
+
|
21 |
+
add_action( 'elementor/frontend/column/before_render', [ $this, '_before_render'],10,1);
|
22 |
+
add_action( 'elementor/frontend/section/before_render', [ $this, '_before_render'],10,1);
|
23 |
+
|
24 |
+
add_action( 'elementor/element/print_template', [ $this, '_print_template'],10,2);
|
25 |
+
add_action( 'elementor/section/print_template', [ $this, '_print_template'],10,2);
|
26 |
+
add_action( 'elementor/column/print_template', [ $this, '_print_template'],10,2);
|
27 |
+
|
28 |
+
}
|
29 |
+
|
30 |
+
public function _add_controls( $element, $section_id, $args ) {
|
31 |
+
if ( ('section' === $element->get_name() && 'section_background' === $section_id) || ('column' === $element->get_name() && 'section_style' === $section_id)) {
|
32 |
+
|
33 |
+
$element->start_controls_section(
|
34 |
+
'_eae_section_bg_slider',
|
35 |
+
[
|
36 |
+
'label' => __( 'EAE - Background Slider', 'wts-eae' ),
|
37 |
+
'tab' => Controls_Manager::TAB_STYLE
|
38 |
+
]
|
39 |
+
);
|
40 |
+
|
41 |
+
$element->add_control(
|
42 |
+
'eae_bg_slider_images',
|
43 |
+
[
|
44 |
+
'label' => __( 'Add Images', 'wts-eae' ),
|
45 |
+
'type' => Controls_Manager::GALLERY,
|
46 |
+
'default' => [],
|
47 |
+
]
|
48 |
+
);
|
49 |
+
|
50 |
+
$element->add_group_control(
|
51 |
+
Group_Control_Image_Size::get_type(),
|
52 |
+
[
|
53 |
+
'name' => 'eae_thumbnail',
|
54 |
+
]
|
55 |
+
);
|
56 |
+
|
57 |
+
/*$slides_to_show = range( 1, 10 );
|
58 |
+
$slides_to_show = array_combine( $slides_to_show, $slides_to_show );
|
59 |
+
|
60 |
+
$element->add_control(
|
61 |
+
'slides_to_show',
|
62 |
+
[
|
63 |
+
'label' => __( 'Slides to Show', 'eae' ),
|
64 |
+
'type' => Controls_Manager::SELECT,
|
65 |
+
'default' => '3',
|
66 |
+
'options' => $slides_to_show,
|
67 |
+
]
|
68 |
+
);*/
|
69 |
+
/*$element->add_control(
|
70 |
+
'slide',
|
71 |
+
[
|
72 |
+
'label' => __( 'Initial Slide', 'eae' ),
|
73 |
+
'type' => Controls_Manager::TEXT,
|
74 |
+
'label_block' => true,
|
75 |
+
'placeholder' => __( 'Initial Slide', 'eae' ),
|
76 |
+
'default' => __( '0', 'eae' ),
|
77 |
+
]
|
78 |
+
);*/
|
79 |
+
|
80 |
+
$element->add_control(
|
81 |
+
'eae_slider_transition',
|
82 |
+
[
|
83 |
+
'label' => __( 'Transition', 'wts-eae' ),
|
84 |
+
'type' => Controls_Manager::SELECT,
|
85 |
+
'options' => [
|
86 |
+
'fade' => __( 'Fade', 'wts-eae' ),
|
87 |
+
'fade2' => __( 'Fade2', 'wts-eae' ),
|
88 |
+
'slideLeft' => __( 'slide Left', 'wts-eae' ),
|
89 |
+
'slideLeft2' => __( 'Slide Left 2', 'wts-eae' ),
|
90 |
+
'slideRight' => __( 'Slide Right', 'wts-eae' ),
|
91 |
+
'slideRight2' => __( 'Slide Right 2', 'wts-eae' ),
|
92 |
+
'slideUp' => __( 'Slide Up', 'wts-eae' ),
|
93 |
+
'slideUp2' => __( 'Slide Up 2', 'wts-eae' ),
|
94 |
+
'slideDown' => __( 'Slide Down', 'wts-eae' ),
|
95 |
+
'slideDown2' => __( 'Slide Down 2', 'wts-eae' ),
|
96 |
+
'zoomIn' => __( 'Zoom In', 'wts-eae' ),
|
97 |
+
'zoomIn2' => __( 'Zoom In 2', 'wts-eae' ),
|
98 |
+
'zoomOut' => __( 'Zoom Out', 'wts-eae' ),
|
99 |
+
'zoomOut2' => __( 'Zoom Out 2', 'wts-eae' ),
|
100 |
+
'swirlLeft' => __( 'Swirl Left', 'wts-eae' ),
|
101 |
+
'swirlLeft2' => __( 'Swirl Left 2', 'wts-eae' ),
|
102 |
+
'swirlRight' => __( 'Swirl Right', 'wts-eae' ),
|
103 |
+
'swirlRight2' => __( 'Swirl Right 2', 'wts-eae' ),
|
104 |
+
'burn' => __( 'Burn', 'wts-eae' ),
|
105 |
+
'burn2' => __( 'Burn 2', 'wts-eae' ),
|
106 |
+
'blur' => __( 'Blur', 'wts-eae' ),
|
107 |
+
'blur2' => __( 'Blur 2', 'wts-eae' ),
|
108 |
+
'flash' => __( 'Flash', 'wts-eae' ),
|
109 |
+
'flash2' => __( 'Flash 2', 'wts-eae' ),
|
110 |
+
'random' => __( 'Random', 'wts-eae' )
|
111 |
+
],
|
112 |
+
'default' => 'fade',
|
113 |
+
]
|
114 |
+
);
|
115 |
+
$element->add_control(
|
116 |
+
'eae_slider_animation',
|
117 |
+
[
|
118 |
+
'label' => __( 'Animation', 'wts-eae' ),
|
119 |
+
'type' => Controls_Manager::SELECT,
|
120 |
+
'options' => [
|
121 |
+
'kenburns' => __( 'Kenburns', 'wts-eae' ),
|
122 |
+
'kenburnsUp' => __( 'Kenburns Up', 'wts-eae' ),
|
123 |
+
'kenburnsDown' => __( 'Kenburns Down', 'wts-eae' ),
|
124 |
+
'kenburnsRight' => __( 'Kenburns Right', 'wts-eae' ),
|
125 |
+
'kenburnsLeft' => __( 'Kenburns Left', 'wts-eae' ),
|
126 |
+
'kenburnsUpLeft' => __( 'Kenburns Up Left', 'wts-eae' ),
|
127 |
+
'kenburnsUpRight' => __( 'Kenburns Up Right', 'wts-eae' ),
|
128 |
+
'kenburnsDownLeft' => __( 'Kenburns Down Left', 'wts-eae' ),
|
129 |
+
'kenburnsDownRight' => __( 'Kenburns Down Right', 'wts-eae' ),
|
130 |
+
'random' => __( 'Random', 'wts-eae' ),
|
131 |
+
'' => __( 'None', 'wts-eae' )
|
132 |
+
],
|
133 |
+
'default' => 'kenburns',
|
134 |
+
]
|
135 |
+
);
|
136 |
+
|
137 |
+
$element->add_control(
|
138 |
+
'eae_custom_overlay_switcher',
|
139 |
+
[
|
140 |
+
'label' => __( 'Custom Overlay', 'wts-eae' ),
|
141 |
+
'type' => Controls_Manager::SWITCHER,
|
142 |
+
'default' => '',
|
143 |
+
'label_on' => __( 'Show', 'wts-eae' ),
|
144 |
+
'label_off' => __( 'Hide', 'wts-eae' ),
|
145 |
+
'return_value' => 'yes',
|
146 |
+
]
|
147 |
+
);
|
148 |
+
/*$element->add_control(
|
149 |
+
'custom_overlay',
|
150 |
+
[
|
151 |
+
'label' => __( 'Overlay Image', 'wts-eae' ),
|
152 |
+
'type' => Controls_Manager::MEDIA,
|
153 |
+
'condition' => [
|
154 |
+
'eae_custom_overlay_switcher' => 'yes',
|
155 |
+
]
|
156 |
+
]
|
157 |
+
);*/
|
158 |
+
$element->add_group_control(
|
159 |
+
Group_Control_Background::get_type(),
|
160 |
+
[
|
161 |
+
'name' => 'eae_slider_custom_overlay',
|
162 |
+
'label' => __( 'Overlay Image', 'wts-eae' ),
|
163 |
+
'types' => [ 'none', 'classic', 'gradient' ],
|
164 |
+
'selector' => '{{WRAPPER}} .vegas-overlay',
|
165 |
+
'condition' => [
|
166 |
+
'eae_custom_overlay_switcher' => 'yes',
|
167 |
+
]
|
168 |
+
]
|
169 |
+
);
|
170 |
+
$element->add_control(
|
171 |
+
'eae_slider_overlay',
|
172 |
+
[
|
173 |
+
'label' => __( 'Overlay', 'wts-eae' ),
|
174 |
+
'type' => Controls_Manager::SELECT,
|
175 |
+
'options' => [
|
176 |
+
'' => __( 'None', 'wts-eae' ),
|
177 |
+
'01' => __( 'Style 1', 'wts-eae' ),
|
178 |
+
'02' => __( 'Style 2', 'wts-eae' ),
|
179 |
+
'03' => __( 'Style 3', 'wts-eae' ),
|
180 |
+
'04' => __( 'Style 4', 'wts-eae' ),
|
181 |
+
'05' => __( 'Style 5', 'wts-eae' ),
|
182 |
+
'06' => __( 'Style 6', 'wts-eae' ),
|
183 |
+
'07' => __( 'Style 7', 'wts-eae' ),
|
184 |
+
'08' => __( 'Style 8', 'wts-eae' ),
|
185 |
+
'09' => __( 'Style 9', 'wts-eae' )
|
186 |
+
],
|
187 |
+
'default' => '01',
|
188 |
+
'condition' => [
|
189 |
+
'eae_custom_overlay_switcher' => '',
|
190 |
+
]
|
191 |
+
]
|
192 |
+
);
|
193 |
+
$element->add_control(
|
194 |
+
'eae_slider_cover',
|
195 |
+
[
|
196 |
+
'label' => __( 'Cover', 'wts-eae' ),
|
197 |
+
'type' => Controls_Manager::SELECT,
|
198 |
+
'options' => [
|
199 |
+
'true' => __( 'True', 'wts-eae' ),
|
200 |
+
'false' => __( 'False', 'wts-eae' )
|
201 |
+
],
|
202 |
+
'default' => 'true',
|
203 |
+
]
|
204 |
+
);
|
205 |
+
$element->add_control(
|
206 |
+
'eae_slider_delay',
|
207 |
+
[
|
208 |
+
'label' => __( 'Delay', 'wts-eae' ),
|
209 |
+
'type' => Controls_Manager::TEXT,
|
210 |
+
'label_block' => true,
|
211 |
+
'placeholder' => __( 'Delay', 'wts-eae' ),
|
212 |
+
'default' => __( '5000', 'wts-eae' ),
|
213 |
+
]
|
214 |
+
);
|
215 |
+
$element->add_control(
|
216 |
+
'eae_slider_timer_bar',
|
217 |
+
[
|
218 |
+
'label' => __( 'Timer', 'wts-eae' ),
|
219 |
+
'type' => Controls_Manager::SELECT,
|
220 |
+
'options' => [
|
221 |
+
'true' => __( 'True', 'wts-eae' ),
|
222 |
+
'false' => __( 'False', 'wts-eae' )
|
223 |
+
],
|
224 |
+
'default' => 'true',
|
225 |
+
]
|
226 |
+
);
|
227 |
+
|
228 |
+
$element->end_controls_section();
|
229 |
+
|
230 |
+
}
|
231 |
+
}
|
232 |
+
|
233 |
+
function _before_render( \Elementor\Element_Base $element ) {
|
234 |
+
|
235 |
+
if ( $element->get_name() != 'section' && $element->get_name() != 'column' ) {
|
236 |
+
return;
|
237 |
+
}
|
238 |
+
$settings = $element->get_settings();
|
239 |
+
//echo '<pre>'; print_r($settings);
|
240 |
+
|
241 |
+
$element->add_render_attribute( '_wrapper', 'class', 'has_eae_slider' );
|
242 |
+
$element->add_render_attribute( 'eae-bs-background-slideshow-wrapper', 'class', 'eae-bs-background-slideshow-wrapper' );
|
243 |
+
|
244 |
+
$element->add_render_attribute( 'eae-bs-backgroundslideshow', 'class', 'eae-at-backgroundslideshow' );
|
245 |
+
|
246 |
+
$slides = [];
|
247 |
+
|
248 |
+
if ( empty( $settings['eae_bg_slider_images'] ) ) {
|
249 |
+
return;
|
250 |
+
}
|
251 |
+
|
252 |
+
foreach ( $settings['eae_bg_slider_images'] as $attachment ) {
|
253 |
+
$image_url = Group_Control_Image_Size::get_attachment_image_src( $attachment['id'], 'eae_thumbnail', $settings );
|
254 |
+
$slides[] = [ 'src' => $image_url ];
|
255 |
+
}
|
256 |
+
|
257 |
+
if ( empty( $slides ) ) {
|
258 |
+
return;
|
259 |
+
}
|
260 |
+
|
261 |
+
?>
|
262 |
+
|
263 |
+
<script type="text/javascript">
|
264 |
+
jQuery(document).ready(function () {
|
265 |
+
jQuery(".elementor-element-<?php echo $element->get_id(); ?>").prepend('<div class="eae-section-bs"><div class="eae-section-bs-inner"></div></div>');
|
266 |
+
var bgimage = '<?php echo $settings["eae_slider_custom_overlay_image"]['url']; ?>';
|
267 |
+
if ('<?php echo $settings["eae_custom_overlay_switcher"]; ?>' == 'yes') {
|
268 |
+
|
269 |
+
//if(bgimage == ''){
|
270 |
+
// var bgoverlay = '<?php echo $settings["eae_slider_custom_overlay_image"]['url']; ?>';
|
271 |
+
//}else{
|
272 |
+
var bgoverlay = '<?php echo plugins_url() . "/elementor-addon-elements/assets/lib/vegas/overlays/00.png"; ?>';
|
273 |
+
// }
|
274 |
+
} else {
|
275 |
+
if ('<?php echo $settings["eae_slider_overlay"]; ?>') {
|
276 |
+
var bgoverlay = '<?php echo plugins_url() . "/elementor-addon-elements/assets/lib/vegas/overlays/" . $settings["eae_slider_overlay"] . ".png"; ?>';
|
277 |
+
} else {
|
278 |
+
var bgoverlay = '<?php echo plugins_url() . "/elementor-addon-elements/assets/lib/vegas/overlays/00.png"; ?>';
|
279 |
+
}
|
280 |
+
}
|
281 |
+
|
282 |
+
|
283 |
+
jQuery(".elementor-element-<?php echo $element->get_id(); ?>").children('.eae-section-bs').children('.eae-section-bs-inner').vegas({
|
284 |
+
slides: <?php echo json_encode( $slides ) ?>,
|
285 |
+
transition: '<?php echo $settings['eae_slider_transition']; ?>',
|
286 |
+
animation: '<?php echo $settings['eae_slider_animation']; ?>',
|
287 |
+
overlay: bgoverlay,
|
288 |
+
cover: <?php echo $settings['eae_slider_cover']; ?>,
|
289 |
+
delay: <?php echo $settings['eae_slider_delay']; ?>,
|
290 |
+
timer: <?php echo $settings['eae_slider_timer_bar']; ?>
|
291 |
+
});
|
292 |
+
if ('<?php echo $settings["eae_custom_overlay_switcher"]; ?>' == 'yes') {
|
293 |
+
jQuery(".elementor-element-<?php echo $element->get_id(); ?>").children('.eae-section-bs').children('.eae-section-bs-inner').children('.vegas-overlay').css('background-image', '');
|
294 |
+
}
|
295 |
+
});
|
296 |
+
</script>
|
297 |
+
<?php
|
298 |
+
}
|
299 |
+
|
300 |
+
function _print_template( $template, $widget ) {
|
301 |
+
if ( $widget->get_name() != 'section' && $widget->get_name() != 'column' ) {
|
302 |
+
return $template;
|
303 |
+
}
|
304 |
+
|
305 |
+
$old_template = $template;
|
306 |
+
ob_start();
|
307 |
+
?>
|
308 |
+
<#
|
309 |
+
|
310 |
+
var rand_id = Math.random().toString(36).substring(7);
|
311 |
+
var slides_path_string = '';
|
312 |
+
var eae_transition = settings.eae_slider_transition;
|
313 |
+
var eae_animation = settings.eae_slider_animation;
|
314 |
+
var eae_custom_overlay = settings.eae_custom_overlay_switcher;
|
315 |
+
var eae_overlay = '';
|
316 |
+
var eae_cover = settings.eae_slider_cover;
|
317 |
+
var eae_delay = settings.eae_slider_delay;
|
318 |
+
var eae_timer = settings.eae_slider_timer_bar;
|
319 |
+
|
320 |
+
if(!_.isUndefined(settings.eae_bg_slider_images) && settings.eae_bg_slider_images.length){
|
321 |
+
var slider_data = [];
|
322 |
+
slides = settings.eae_bg_slider_images;
|
323 |
+
for(var i in slides){
|
324 |
+
slider_data[i] = slides[i].url;
|
325 |
+
}
|
326 |
+
slides_path_string = slider_data.join();
|
327 |
+
}
|
328 |
+
|
329 |
+
if(settings.eae_custom_overlay_switcher == 'yes'){
|
330 |
+
//if(settings.eae_slider_custom_overlay_image.url){
|
331 |
+
//eae_overlay = settings.eae_slider_custom_overlay_image.url;
|
332 |
+
//}else{
|
333 |
+
eae_overlay = '00.png';
|
334 |
+
//}
|
335 |
+
}else{
|
336 |
+
if(settings.eae_slider_overlay){
|
337 |
+
eae_overlay = settings.eae_slider_overlay + '.png';
|
338 |
+
}else{
|
339 |
+
eae_overlay = '00.png';
|
340 |
+
}
|
341 |
+
}
|
342 |
+
#>
|
343 |
+
|
344 |
+
<div class="eae-section-bs">
|
345 |
+
<div class="eae-section-bs-inner"
|
346 |
+
data-eae-bg-slider="{{ slides_path_string }}"
|
347 |
+
data-eae-bg-slider-transition="{{ eae_transition }}"
|
348 |
+
data-eae-bg-slider-animation="{{ eae_animation }}"
|
349 |
+
data-eae-bg-custom-overlay="{{ eae_custom_overlay }}"
|
350 |
+
data-eae-bg-slider-overlay="{{ eae_overlay }}"
|
351 |
+
data-eae-bg-slider-cover="{{ eae_cover }}"
|
352 |
+
data-eae-bs-slider-delay="{{ eae_delay }}"
|
353 |
+
data-eae-bs-slider-timer="{{ eae_timer }}"
|
354 |
+
></div>
|
355 |
+
</div>
|
356 |
+
|
357 |
+
<?php
|
358 |
+
$slider_content = ob_get_contents();
|
359 |
+
ob_end_clean();
|
360 |
+
$template = $slider_content . $old_template;
|
361 |
+
|
362 |
+
return $template;
|
363 |
+
}
|
364 |
+
|
365 |
+
}
|
366 |
+
|
367 |
+
EAE_Bg_Slider::instance();
|
elements/control-test.php
CHANGED
@@ -1,111 +1,111 @@
|
|
1 |
-
<?php
|
2 |
-
namespace Elementor;
|
3 |
-
|
4 |
-
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
5 |
-
|
6 |
-
class Widget_Test_Control extends Widget_Base {
|
7 |
-
|
8 |
-
public function get_name() {
|
9 |
-
return 'wts-testcontrol';
|
10 |
-
}
|
11 |
-
|
12 |
-
public function get_title() {
|
13 |
-
return __( 'EAE - Test Control', 'elementor' );
|
14 |
-
}
|
15 |
-
|
16 |
-
public function get_icon() {
|
17 |
-
return 'eicon-flip-box wts-eae-pe';
|
18 |
-
}
|
19 |
-
|
20 |
-
public function get_categories() {
|
21 |
-
return [ 'wts-eae' ];
|
22 |
-
}
|
23 |
-
|
24 |
-
protected function _register_controls() {
|
25 |
-
$this->start_controls_section(
|
26 |
-
'section_general',
|
27 |
-
[
|
28 |
-
'label' => __( 'General', 'elementor' )
|
29 |
-
]
|
30 |
-
);
|
31 |
-
|
32 |
-
$this->add_group_control(
|
33 |
-
Group_Control_Background::get_type(),
|
34 |
-
[
|
35 |
-
'name' => 'front_box_background_out',
|
36 |
-
'types' => [ 'classic', 'gradient'],
|
37 |
-
//'selector' => '{{WRAPPER}} .divTest',
|
38 |
-
]
|
39 |
-
);
|
40 |
-
|
41 |
-
$this->add_control(
|
42 |
-
'front_box__color',
|
43 |
-
[
|
44 |
-
'label' => __( 'Title', 'elementor' ),
|
45 |
-
'type' => Controls_Manager::COLOR,
|
46 |
-
'selectors' => [
|
47 |
-
'{{WRAPPER}} {{CURRENT_ITEM}}.divTest' => 'color: {{VALUE}};',
|
48 |
-
],
|
49 |
-
]
|
50 |
-
);
|
51 |
-
|
52 |
-
$repeater = new Repeater();
|
53 |
-
|
54 |
-
$repeater->add_group_control(
|
55 |
-
Group_Control_Background::get_type(),
|
56 |
-
[
|
57 |
-
'name' => 'front_box_background_ind',
|
58 |
-
'types' => [ 'classic', 'gradient'],
|
59 |
-
'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.divTest',
|
60 |
-
]
|
61 |
-
);
|
62 |
-
$repeater->add_group_control(
|
63 |
-
Group_Control_Typography::get_type(),
|
64 |
-
[
|
65 |
-
'name' => 'front_box_title_typography',
|
66 |
-
'label' => __( 'Title Typography', 'elementor' ),
|
67 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
68 |
-
'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.divTest',
|
69 |
-
|
70 |
-
]
|
71 |
-
);
|
72 |
-
|
73 |
-
$repeater->add_control(
|
74 |
-
'front_box_title_color',
|
75 |
-
[
|
76 |
-
'label' => __( 'Title', 'elementor' ),
|
77 |
-
'type' => Controls_Manager::COLOR,
|
78 |
-
'selectors' => [
|
79 |
-
'{{WRAPPER}} {{CURRENT_ITEM}} i' => 'color: {{VALUE}};',
|
80 |
-
],
|
81 |
-
]
|
82 |
-
);
|
83 |
-
|
84 |
-
$this->add_control(
|
85 |
-
'eae_flip_box_set',
|
86 |
-
[
|
87 |
-
'label' => __( 'Flip Box', 'elementor' ),
|
88 |
-
'type' => Controls_Manager::REPEATER,
|
89 |
-
'show_label' => true,
|
90 |
-
'fields' => array_values($repeater->get_controls()),
|
91 |
-
]
|
92 |
-
);
|
93 |
-
|
94 |
-
}
|
95 |
-
|
96 |
-
protected function render( ) {
|
97 |
-
$settings = $this->get_settings_for_display();
|
98 |
-
//print_r($settings['eae_flip_box_set']);
|
99 |
-
foreach ($settings['eae_flip_box_set'] as $flipbox) {
|
100 |
-
?>
|
101 |
-
<div class="elementor-repeater-item-<?php echo $flipbox['_id']; ?> divTest">
|
102 |
-
Satish
|
103 |
-
<i>Kumar</i>
|
104 |
-
</div>
|
105 |
-
|
106 |
-
<?php
|
107 |
-
}
|
108 |
-
}
|
109 |
-
}
|
110 |
-
|
111 |
Plugin::instance()->widgets_manager->register_widget_type( new Widget_Test_Control() );
|
1 |
+
<?php
|
2 |
+
namespace Elementor;
|
3 |
+
|
4 |
+
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
5 |
+
|
6 |
+
class Widget_Test_Control extends Widget_Base {
|
7 |
+
|
8 |
+
public function get_name() {
|
9 |
+
return 'wts-testcontrol';
|
10 |
+
}
|
11 |
+
|
12 |
+
public function get_title() {
|
13 |
+
return __( 'EAE - Test Control', 'elementor' );
|
14 |
+
}
|
15 |
+
|
16 |
+
public function get_icon() {
|
17 |
+
return 'eicon-flip-box wts-eae-pe';
|
18 |
+
}
|
19 |
+
|
20 |
+
public function get_categories() {
|
21 |
+
return [ 'wts-eae' ];
|
22 |
+
}
|
23 |
+
|
24 |
+
protected function _register_controls() {
|
25 |
+
$this->start_controls_section(
|
26 |
+
'section_general',
|
27 |
+
[
|
28 |
+
'label' => __( 'General', 'elementor' )
|
29 |
+
]
|
30 |
+
);
|
31 |
+
|
32 |
+
$this->add_group_control(
|
33 |
+
Group_Control_Background::get_type(),
|
34 |
+
[
|
35 |
+
'name' => 'front_box_background_out',
|
36 |
+
'types' => [ 'classic', 'gradient'],
|
37 |
+
//'selector' => '{{WRAPPER}} .divTest',
|
38 |
+
]
|
39 |
+
);
|
40 |
+
|
41 |
+
$this->add_control(
|
42 |
+
'front_box__color',
|
43 |
+
[
|
44 |
+
'label' => __( 'Title', 'elementor' ),
|
45 |
+
'type' => Controls_Manager::COLOR,
|
46 |
+
'selectors' => [
|
47 |
+
'{{WRAPPER}} {{CURRENT_ITEM}}.divTest' => 'color: {{VALUE}};',
|
48 |
+
],
|
49 |
+
]
|
50 |
+
);
|
51 |
+
|
52 |
+
$repeater = new Repeater();
|
53 |
+
|
54 |
+
$repeater->add_group_control(
|
55 |
+
Group_Control_Background::get_type(),
|
56 |
+
[
|
57 |
+
'name' => 'front_box_background_ind',
|
58 |
+
'types' => [ 'classic', 'gradient'],
|
59 |
+
'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.divTest',
|
60 |
+
]
|
61 |
+
);
|
62 |
+
$repeater->add_group_control(
|
63 |
+
Group_Control_Typography::get_type(),
|
64 |
+
[
|
65 |
+
'name' => 'front_box_title_typography',
|
66 |
+
'label' => __( 'Title Typography', 'elementor' ),
|
67 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
68 |
+
'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.divTest',
|
69 |
+
|
70 |
+
]
|
71 |
+
);
|
72 |
+
|
73 |
+
$repeater->add_control(
|
74 |
+
'front_box_title_color',
|
75 |
+
[
|
76 |
+
'label' => __( 'Title', 'elementor' ),
|
77 |
+
'type' => Controls_Manager::COLOR,
|
78 |
+
'selectors' => [
|
79 |
+
'{{WRAPPER}} {{CURRENT_ITEM}} i' => 'color: {{VALUE}};',
|
80 |
+
],
|
81 |
+
]
|
82 |
+
);
|
83 |
+
|
84 |
+
$this->add_control(
|
85 |
+
'eae_flip_box_set',
|
86 |
+
[
|
87 |
+
'label' => __( 'Flip Box', 'elementor' ),
|
88 |
+
'type' => Controls_Manager::REPEATER,
|
89 |
+
'show_label' => true,
|
90 |
+
'fields' => array_values($repeater->get_controls()),
|
91 |
+
]
|
92 |
+
);
|
93 |
+
|
94 |
+
}
|
95 |
+
|
96 |
+
protected function render( ) {
|
97 |
+
$settings = $this->get_settings_for_display();
|
98 |
+
//print_r($settings['eae_flip_box_set']);
|
99 |
+
foreach ($settings['eae_flip_box_set'] as $flipbox) {
|
100 |
+
?>
|
101 |
+
<div class="elementor-repeater-item-<?php echo $flipbox['_id']; ?> divTest">
|
102 |
+
Satish
|
103 |
+
<i>Kumar</i>
|
104 |
+
</div>
|
105 |
+
|
106 |
+
<?php
|
107 |
+
}
|
108 |
+
}
|
109 |
+
}
|
110 |
+
|
111 |
Plugin::instance()->widgets_manager->register_widget_type( new Widget_Test_Control() );
|
elements/flip-box-set.php
CHANGED
@@ -1,1800 +1,1800 @@
|
|
1 |
-
<?php
|
2 |
-
namespace Elementor;
|
3 |
-
|
4 |
-
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
5 |
-
|
6 |
-
class Widget_FlipBoxSet extends Widget_Base {
|
7 |
-
|
8 |
-
public function get_name() {
|
9 |
-
return 'wts-flipboxset';
|
10 |
-
}
|
11 |
-
|
12 |
-
public function get_title() {
|
13 |
-
return __( 'EAE - Flip Box Set', 'elementor' );
|
14 |
-
}
|
15 |
-
|
16 |
-
public function get_icon() {
|
17 |
-
return 'eicon-flip-box wts-eae-pe';
|
18 |
-
}
|
19 |
-
|
20 |
-
public function get_categories() {
|
21 |
-
return [ 'wts-eae' ];
|
22 |
-
}
|
23 |
-
|
24 |
-
protected function _register_controls() {
|
25 |
-
|
26 |
-
$this->start_controls_section(
|
27 |
-
'section_general',
|
28 |
-
[
|
29 |
-
'label' => __( 'General', 'elementor' )
|
30 |
-
]
|
31 |
-
);
|
32 |
-
|
33 |
-
$this->add_responsive_control(
|
34 |
-
'flip_box_count_row',
|
35 |
-
[
|
36 |
-
'label' => __( 'Column', 'elementor' ),
|
37 |
-
'type' => Controls_Manager::NUMBER,
|
38 |
-
'desktop_default' => '3',
|
39 |
-
'tablet_default' => '2',
|
40 |
-
'mobile_default' => '1',
|
41 |
-
'min' => 1,
|
42 |
-
'max' => 6,
|
43 |
-
'selectors' => [
|
44 |
-
'{{WRAPPER}} .eae-flip-box-wrapper' => 'width: calc(100%/{{
|
45 |
-
]
|
46 |
-
]
|
47 |
-
);
|
48 |
-
$repeater = new Repeater();
|
49 |
-
|
50 |
-
$repeater->add_control(
|
51 |
-
'front_box_heading',
|
52 |
-
[
|
53 |
-
'label' => __('Front Box', 'elementor'),
|
54 |
-
'type' => Controls_Manager::HEADING,
|
55 |
-
]
|
56 |
-
);
|
57 |
-
|
58 |
-
$repeater -> start_controls_tabs( 'front_box' );
|
59 |
-
|
60 |
-
$repeater -> start_controls_tab(
|
61 |
-
'front_box_content',
|
62 |
-
[
|
63 |
-
'label' => __( 'Content', 'elementor' ),
|
64 |
-
]
|
65 |
-
);
|
66 |
-
|
67 |
-
$repeater->add_control(
|
68 |
-
'front_box_element',
|
69 |
-
[
|
70 |
-
'label' => __( 'Box Element', 'elementor' ),
|
71 |
-
'type' => Controls_Manager::CHOOSE,
|
72 |
-
'options' => [
|
73 |
-
'none' => [
|
74 |
-
'title' => __( 'None', 'elementor' ),
|
75 |
-
'icon' => 'fa fa-ban',
|
76 |
-
],
|
77 |
-
'image' => [
|
78 |
-
'title' => __( 'Image', 'elementor' ),
|
79 |
-
'icon' => 'fa fa-picture-o',
|
80 |
-
],
|
81 |
-
'icon' => [
|
82 |
-
'title' => __( 'Icon', 'elementor' ),
|
83 |
-
'icon' => 'fa fa-star',
|
84 |
-
|
85 |
-
],
|
86 |
-
],
|
87 |
-
'default' => 'icon',
|
88 |
-
]
|
89 |
-
);
|
90 |
-
|
91 |
-
$repeater->add_control('front_box_image',
|
92 |
-
[
|
93 |
-
'label' => __( 'Choose Image', 'elementor' ),
|
94 |
-
'type' => Controls_Manager::MEDIA,
|
95 |
-
'default' => [
|
96 |
-
'url' => Utils::get_placeholder_image_src(),
|
97 |
-
],
|
98 |
-
'condition' => [
|
99 |
-
'front_box_element' => 'image',
|
100 |
-
],
|
101 |
-
'show_label'=> true,
|
102 |
-
]
|
103 |
-
);
|
104 |
-
|
105 |
-
$repeater->add_group_control(
|
106 |
-
Group_Control_Image_Size::get_type(),
|
107 |
-
[
|
108 |
-
'name' => 'front_image_size', // Actually its `image_size`
|
109 |
-
'default' => 'thumbnail',
|
110 |
-
'condition' => [
|
111 |
-
'front_box_element' => 'image',
|
112 |
-
'front_box_image[id]!' => '',
|
113 |
-
],
|
114 |
-
]
|
115 |
-
);
|
116 |
-
$repeater->add_control(
|
117 |
-
'front_image_width',
|
118 |
-
[
|
119 |
-
'label' => __( 'Image Width', 'elementor' ),
|
120 |
-
'type' => Controls_Manager::SLIDER,
|
121 |
-
'range' => [
|
122 |
-
'px' => [
|
123 |
-
'min' => 6,
|
124 |
-
'max' => 300,
|
125 |
-
],
|
126 |
-
],
|
127 |
-
'default' => [
|
128 |
-
'size' => 100,
|
129 |
-
],
|
130 |
-
'selectors' => [
|
131 |
-
'{{WRAPPER}} {{CURRENT_ITEM}} .eae-flip-box-front img' => 'max-width: {{SIZE}}{{UNIT}};',
|
132 |
-
],
|
133 |
-
'condition' => [
|
134 |
-
'front_box_element' => 'image',
|
135 |
-
'front_box_image[id]!' => '',
|
136 |
-
],
|
137 |
-
]
|
138 |
-
);
|
139 |
-
|
140 |
-
$repeater->add_control(
|
141 |
-
'front_icon',
|
142 |
-
[
|
143 |
-
'label' => __( 'Icon', 'elementor' ),
|
144 |
-
'type' => Controls_Manager::ICON,
|
145 |
-
'label_block' => true,
|
146 |
-
'default' => 'fa fa-star',
|
147 |
-
'condition' => [
|
148 |
-
'front_box_element' => 'icon',
|
149 |
-
],
|
150 |
-
]
|
151 |
-
);
|
152 |
-
|
153 |
-
$repeater->add_control(
|
154 |
-
'front_title',
|
155 |
-
[
|
156 |
-
'label' => __( 'Title', 'elementor' ),
|
157 |
-
'type' => Controls_Manager::TEXT,
|
158 |
-
'placeholder' => __( 'Enter text', 'elementor' ),
|
159 |
-
'default' => __( 'Text Title', 'elementor' ),
|
160 |
-
]
|
161 |
-
);
|
162 |
-
|
163 |
-
$repeater->add_control(
|
164 |
-
'front_title_html_tag',
|
165 |
-
[
|
166 |
-
'label' => __( 'HTML Tag', 'elementor' ),
|
167 |
-
'type' => Controls_Manager::SELECT,
|
168 |
-
'options' => [
|
169 |
-
'h1' => __( 'H1', 'elementor' ),
|
170 |
-
'h2' => __( 'H2', 'elementor' ),
|
171 |
-
'h3' => __( 'H3', 'elementor' ),
|
172 |
-
'h4' => __( 'H4', 'elementor' ),
|
173 |
-
'h5' => __( 'H5', 'elementor' ),
|
174 |
-
'h6' => __( 'H6', 'elementor' )
|
175 |
-
],
|
176 |
-
'default' => 'h3',
|
177 |
-
]
|
178 |
-
);
|
179 |
-
|
180 |
-
$repeater->add_control(
|
181 |
-
'front_text',
|
182 |
-
[
|
183 |
-
'label' => __( 'Text', 'elementor' ),
|
184 |
-
'type' => Controls_Manager::TEXTAREA,
|
185 |
-
'placeholder' => __( 'Enter text', 'elementor' ),
|
186 |
-
'default' => __( 'Add some nice text here.', 'elementor' ),
|
187 |
-
]
|
188 |
-
);
|
189 |
-
$repeater -> end_controls_tab();
|
190 |
-
|
191 |
-
$repeater -> start_controls_tab(
|
192 |
-
'front_box_background_ind_head',
|
193 |
-
[
|
194 |
-
'label' => __( 'Style', 'elementor' ),
|
195 |
-
]
|
196 |
-
);
|
197 |
-
|
198 |
-
$repeater->add_control(
|
199 |
-
'style_indv',
|
200 |
-
[
|
201 |
-
'label' => __( 'Overwrite Global Style', 'elementor' ),
|
202 |
-
'type' => Controls_Manager::SWITCHER,
|
203 |
-
'options' => [
|
204 |
-
'yes' => __( 'Yes', 'elementor' ),
|
205 |
-
'no' => __( 'No', 'elementor' ),
|
206 |
-
],
|
207 |
-
'default' => 'no',
|
208 |
-
|
209 |
-
]
|
210 |
-
);
|
211 |
-
|
212 |
-
$repeater->add_control(
|
213 |
-
'front_icon_view',
|
214 |
-
[
|
215 |
-
'label' => __( 'View', 'elementor' ),
|
216 |
-
'type' => Controls_Manager::SELECT,
|
217 |
-
'options' => [
|
218 |
-
'default' => __( 'Default', 'elementor' ),
|
219 |
-
'stacked' => __( 'Stacked', 'elementor' ),
|
220 |
-
'framed' => __( 'Framed', 'elementor' ),
|
221 |
-
],
|
222 |
-
'default' => 'default',
|
223 |
-
'condition' => [
|
224 |
-
'front_box_element' => 'icon',
|
225 |
-
'style_indv' => 'yes',
|
226 |
-
],
|
227 |
-
|
228 |
-
]
|
229 |
-
);
|
230 |
-
|
231 |
-
$repeater->add_control(
|
232 |
-
'front_icon_shape',
|
233 |
-
[
|
234 |
-
'label' => __( 'Shape', 'elementor' ),
|
235 |
-
'type' => Controls_Manager::SELECT,
|
236 |
-
'options' => [
|
237 |
-
'circle' => __( 'Circle', 'elementor' ),
|
238 |
-
'square' => __( 'Square', 'elementor' ),
|
239 |
-
],
|
240 |
-
'default' => 'circle',
|
241 |
-
'condition' => [
|
242 |
-
'front_box_element' => 'icon',
|
243 |
-
'front_icon_view!' => 'default',
|
244 |
-
'style_indv' => 'yes',
|
245 |
-
],
|
246 |
-
]
|
247 |
-
);
|
248 |
-
|
249 |
-
|
250 |
-
$repeater->add_group_control(
|
251 |
-
Group_Control_Background::get_type(),
|
252 |
-
[
|
253 |
-
'name' => 'front_box_background_ind',
|
254 |
-
'types' => [ 'classic', 'gradient'],
|
255 |
-
'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-front',
|
256 |
-
'condition' => [
|
257 |
-
'style_indv' => 'yes',
|
258 |
-
],
|
259 |
-
]
|
260 |
-
);
|
261 |
-
$repeater->add_control(
|
262 |
-
'front_box_background_overlay_ind',
|
263 |
-
[
|
264 |
-
'label' => __( 'Background Overlay', 'elementor-pro' ),
|
265 |
-
'type' => Controls_Manager::COLOR,
|
266 |
-
'default' => '',
|
267 |
-
'separator' => 'before',
|
268 |
-
'condition' => [
|
269 |
-
'front_box_background_ind_image[id]!' => '',
|
270 |
-
'style_indv' => 'yes',
|
271 |
-
],
|
272 |
-
]
|
273 |
-
);
|
274 |
-
$repeater->add_control(
|
275 |
-
'front_box_title_color_indv',
|
276 |
-
[
|
277 |
-
'label' => __( 'Title', 'elementor' ),
|
278 |
-
'type' => Controls_Manager::COLOR,
|
279 |
-
'scheme' => [
|
280 |
-
'type' => Scheme_Color::get_type(),
|
281 |
-
'value' => Scheme_Color::COLOR_1,
|
282 |
-
],
|
283 |
-
'default' => '#FFF',
|
284 |
-
'selectors' => [
|
285 |
-
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .front-icon-title ' => 'color: {{VALUE}};',
|
286 |
-
],
|
287 |
-
'condition' => [
|
288 |
-
'style_indv' => 'yes',
|
289 |
-
],
|
290 |
-
]
|
291 |
-
);
|
292 |
-
|
293 |
-
$repeater->add_group_control(
|
294 |
-
Group_Control_Typography::get_type(),
|
295 |
-
[
|
296 |
-
'name' => 'front_box_title_typography_indv',
|
297 |
-
'label' => __( 'Title Typography', 'elementor' ),
|
298 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
299 |
-
'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .front-icon-title',
|
300 |
-
'condition' => [
|
301 |
-
'style_indv' => 'yes',
|
302 |
-
],
|
303 |
-
]
|
304 |
-
);
|
305 |
-
|
306 |
-
$repeater->add_control(
|
307 |
-
'front_box_text_color_indv',
|
308 |
-
[
|
309 |
-
'label' => __( 'Description Color', 'elementor' ),
|
310 |
-
'type' => Controls_Manager::COLOR,
|
311 |
-
'scheme' => [
|
312 |
-
'type' => Scheme_Color::get_type(),
|
313 |
-
'value' => Scheme_Color::COLOR_1,
|
314 |
-
],
|
315 |
-
'default' => '#FFF',
|
316 |
-
'selectors' => [
|
317 |
-
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-front p' => 'color: {{VALUE}};',
|
318 |
-
],
|
319 |
-
'condition' => [
|
320 |
-
'style_indv' => 'yes',
|
321 |
-
],
|
322 |
-
|
323 |
-
]
|
324 |
-
);
|
325 |
-
|
326 |
-
$repeater->add_group_control(
|
327 |
-
Group_Control_Typography::get_type(),
|
328 |
-
[
|
329 |
-
'name' => 'front_box_text_typography_indv',
|
330 |
-
'label' => __( 'Description Typography', 'elementor' ),
|
331 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
332 |
-
'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-front p',
|
333 |
-
'condition' => [
|
334 |
-
'style_indv' => 'yes',
|
335 |
-
],
|
336 |
-
]
|
337 |
-
);
|
338 |
-
|
339 |
-
|
340 |
-
/**
|
341 |
-
* Front Box icons styles
|
342 |
-
**/
|
343 |
-
$repeater->add_control(
|
344 |
-
'front_box_icon_color_indv',
|
345 |
-
[
|
346 |
-
'label' => __( 'Icon Color', 'elementor' ),
|
347 |
-
'type' => Controls_Manager::COLOR,
|
348 |
-
'scheme' => [
|
349 |
-
'type' => Scheme_Color::get_type(),
|
350 |
-
'value' => Scheme_Color::COLOR_1,
|
351 |
-
],
|
352 |
-
'default' => '#FFF',
|
353 |
-
'selectors' => [
|
354 |
-
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-front .icon-wrapper i' => 'color: {{VALUE}};',
|
355 |
-
],
|
356 |
-
'condition' => [
|
357 |
-
'style_indv' => 'yes',
|
358 |
-
],
|
359 |
-
]
|
360 |
-
);
|
361 |
-
|
362 |
-
$repeater->add_control(
|
363 |
-
'front_box_icon_fill_color_indv',
|
364 |
-
[
|
365 |
-
'label' => __( 'Icon Fill Color', 'elementor' ),
|
366 |
-
'type' => Controls_Manager::COLOR,
|
367 |
-
'scheme' => [
|
368 |
-
'type' => Scheme_Color::get_type(),
|
369 |
-
'value' => Scheme_Color::COLOR_1,
|
370 |
-
],
|
371 |
-
'selectors' => [
|
372 |
-
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-fb-icon-view-stacked' => 'background-color: {{VALUE}};',
|
373 |
-
],
|
374 |
-
'condition' => [
|
375 |
-
'front_icon_view' => 'stacked',
|
376 |
-
'style_indv' => 'yes',
|
377 |
-
],
|
378 |
-
]
|
379 |
-
);
|
380 |
-
|
381 |
-
$repeater->add_group_control(
|
382 |
-
Group_Control_Border::get_type(),
|
383 |
-
[
|
384 |
-
'name' => 'front_box_icon_border_indv',
|
385 |
-
'label' => __( 'Box Border', 'elementor' ),
|
386 |
-
'placeholder' => '1px',
|
387 |
-
'default' => '1px',
|
388 |
-
'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-front .eae-fb-icon-view-framed, {{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-front .eae-fb-icon-view-stacked',
|
389 |
-
'label_block' => true,
|
390 |
-
'condition' => [
|
391 |
-
'front_icon_view!' => 'default',
|
392 |
-
'style_indv' => 'yes',
|
393 |
-
],
|
394 |
-
]
|
395 |
-
);
|
396 |
-
|
397 |
-
$repeater->add_control(
|
398 |
-
'front_icon_size_indv',
|
399 |
-
[
|
400 |
-
'label' => __( 'Icon Size', 'elementor' ),
|
401 |
-
'type' => Controls_Manager::SLIDER,
|
402 |
-
'range' => [
|
403 |
-
'px' => [
|
404 |
-
'min' => 6,
|
405 |
-
'max' => 300,
|
406 |
-
],
|
407 |
-
],
|
408 |
-
'selectors' => [
|
409 |
-
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-front .icon-wrapper i' => 'font-size: {{SIZE}}{{UNIT}};',
|
410 |
-
],
|
411 |
-
'condition' => [
|
412 |
-
'style_indv' => 'yes',
|
413 |
-
],
|
414 |
-
]
|
415 |
-
);
|
416 |
-
|
417 |
-
$repeater->add_control(
|
418 |
-
'front_icon_padding_indv',
|
419 |
-
[
|
420 |
-
'label' => __( 'Icon Padding', 'elementor' ),
|
421 |
-
'type' => Controls_Manager::SLIDER,
|
422 |
-
'selectors' => [
|
423 |
-
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-front .icon-wrapper' => 'padding: {{SIZE}}{{UNIT}};',
|
424 |
-
],
|
425 |
-
'default' => [
|
426 |
-
'size' => 1.5,
|
427 |
-
'unit' => 'em',
|
428 |
-
],
|
429 |
-
'range' => [
|
430 |
-
'em' => [
|
431 |
-
'min' => 0,
|
432 |
-
],
|
433 |
-
],
|
434 |
-
'condition' => [
|
435 |
-
'front_icon_view!' => 'default',
|
436 |
-
'style_indv' => 'yes',
|
437 |
-
],
|
438 |
-
]
|
439 |
-
);
|
440 |
-
|
441 |
-
$repeater->end_controls_tab();
|
442 |
-
|
443 |
-
$repeater->end_controls_tabs();
|
444 |
-
|
445 |
-
$repeater->add_control(
|
446 |
-
'back_box_heading',
|
447 |
-
[
|
448 |
-
'label' => __('Back Box', 'elementor'),
|
449 |
-
'type' => Controls_Manager::HEADING,
|
450 |
-
]
|
451 |
-
);
|
452 |
-
|
453 |
-
$repeater->start_controls_tabs( 'back_box_a' );
|
454 |
-
|
455 |
-
$repeater->start_controls_tab(
|
456 |
-
'back_box_content',
|
457 |
-
[
|
458 |
-
'label' => __( 'Content', 'elementor' ),
|
459 |
-
]
|
460 |
-
);
|
461 |
-
|
462 |
-
|
463 |
-
|
464 |
-
$repeater->add_control(
|
465 |
-
'back_box_element',
|
466 |
-
[
|
467 |
-
'label' => __( 'Box Element', 'elementor' ),
|
468 |
-
'type' => Controls_Manager::CHOOSE,
|
469 |
-
'options' => [
|
470 |
-
'none' => [
|
471 |
-
'title' => __( 'None', 'elementor' ),
|
472 |
-
'icon' => 'fa fa-ban',
|
473 |
-
],
|
474 |
-
'image'=> [
|
475 |
-
'title' => __( 'Image', 'elementor' ),
|
476 |
-
'icon' => 'fa fa-picture-o',
|
477 |
-
],
|
478 |
-
'icon' => [
|
479 |
-
'title' => __( 'Icon', 'elementor' ),
|
480 |
-
'icon' => 'fa fa-star',
|
481 |
-
|
482 |
-
],
|
483 |
-
],
|
484 |
-
'default' => 'icon',
|
485 |
-
]
|
486 |
-
);
|
487 |
-
|
488 |
-
$repeater->add_control('back_box_image',
|
489 |
-
[
|
490 |
-
'label' => __( 'Choose Image', 'elementor' ),
|
491 |
-
'type' => Controls_Manager::MEDIA,
|
492 |
-
'default' => [
|
493 |
-
'url' => Utils::get_placeholder_image_src(),
|
494 |
-
],
|
495 |
-
'condition' => [
|
496 |
-
'back_box_element' => 'image',
|
497 |
-
],
|
498 |
-
'show_label' => true,
|
499 |
-
]
|
500 |
-
);
|
501 |
-
|
502 |
-
$repeater->add_group_control(
|
503 |
-
Group_Control_Image_Size::get_type(),
|
504 |
-
[
|
505 |
-
'name' => 'back_image_size', // Actually its `image_size`
|
506 |
-
'default' => 'thumbnail',
|
507 |
-
'condition' => [
|
508 |
-
'back_box_element' => 'image',
|
509 |
-
'back_box_image[id]!' => '',
|
510 |
-
],
|
511 |
-
]
|
512 |
-
);
|
513 |
-
$repeater->add_control(
|
514 |
-
'back_image_width',
|
515 |
-
[
|
516 |
-
'label' => __( 'Image Width', 'elementor' ),
|
517 |
-
'type' => Controls_Manager::SLIDER,
|
518 |
-
'range' => [
|
519 |
-
'px' => [
|
520 |
-
'min' => 6,
|
521 |
-
'max' => 300,
|
522 |
-
],
|
523 |
-
],
|
524 |
-
'default' => [
|
525 |
-
'size' => 100,
|
526 |
-
],
|
527 |
-
'selectors' => [
|
528 |
-
'{{WRAPPER}} {{CURRENT_ITEM}} .eae-flip-box-back img' => 'max-width: {{SIZE}}{{UNIT}};',
|
529 |
-
],
|
530 |
-
'condition' => [
|
531 |
-
'back_box_element' => 'image',
|
532 |
-
'back_box_image[id]!' => '',
|
533 |
-
],
|
534 |
-
]
|
535 |
-
);
|
536 |
-
|
537 |
-
$repeater->add_control(
|
538 |
-
'back_icon',
|
539 |
-
[
|
540 |
-
'label' => __( 'Icon', 'elementor' ),
|
541 |
-
'type' => Controls_Manager::ICON,
|
542 |
-
'label_block' => true,
|
543 |
-
'default' => 'fa fa-star',
|
544 |
-
'condition' => [
|
545 |
-
'back_box_element' => 'icon',
|
546 |
-
],
|
547 |
-
]
|
548 |
-
);
|
549 |
-
|
550 |
-
|
551 |
-
$repeater->add_control(
|
552 |
-
'back_title',
|
553 |
-
[
|
554 |
-
'label' => __( 'Title', 'elementor' ),
|
555 |
-
'type' => Controls_Manager::TEXT,
|
556 |
-
'placeholder' => __( 'Enter text', 'elementor' ),
|
557 |
-
'default' => __( 'Text Title', 'elementor' ),
|
558 |
-
]
|
559 |
-
);
|
560 |
-
|
561 |
-
$repeater->add_control(
|
562 |
-
'back_title_html_tag',
|
563 |
-
[
|
564 |
-
'label' => __( 'HTML Tag', 'elementor' ),
|
565 |
-
'type' => Controls_Manager::SELECT,
|
566 |
-
'options' => [
|
567 |
-
'h1' => __( 'H1', 'elementor' ),
|
568 |
-
'h2' => __( 'H2', 'elementor' ),
|
569 |
-
'h3' => __( 'H3', 'elementor' ),
|
570 |
-
'h4' => __( 'H4', 'elementor' ),
|
571 |
-
'h5' => __( 'H5', 'elementor' ),
|
572 |
-
'h6' => __( 'H6', 'elementor' )
|
573 |
-
],
|
574 |
-
'default' => 'h3',
|
575 |
-
]
|
576 |
-
);
|
577 |
-
|
578 |
-
$repeater->add_control(
|
579 |
-
'back_text',
|
580 |
-
[
|
581 |
-
'label' => __( 'Text', 'elementor' ),
|
582 |
-
'type' => Controls_Manager::TEXTAREA,
|
583 |
-
'placeholder' => __( 'Enter text', 'elementor' ),
|
584 |
-
'default' => __( 'Add some nice text here.', 'elementor' ),
|
585 |
-
]
|
586 |
-
);
|
587 |
-
$repeater -> end_controls_tab();
|
588 |
-
|
589 |
-
$repeater -> start_controls_tab(
|
590 |
-
'back_box_background_head',
|
591 |
-
[
|
592 |
-
'label' => __( 'Style', 'elementor' ),
|
593 |
-
]
|
594 |
-
);
|
595 |
-
|
596 |
-
$repeater->add_control(
|
597 |
-
'back_icon_view',
|
598 |
-
[
|
599 |
-
'label' => __( 'View', 'elementor' ),
|
600 |
-
'type' => Controls_Manager::SELECT,
|
601 |
-
'options' => [
|
602 |
-
'default' => __( 'Default', 'elementor' ),
|
603 |
-
'stacked' => __( 'Stacked', 'elementor' ),
|
604 |
-
'framed' => __( 'Framed', 'elementor' ),
|
605 |
-
],
|
606 |
-
'default' => 'default',
|
607 |
-
'condition' => [
|
608 |
-
'back_box_element' => 'icon',
|
609 |
-
],
|
610 |
-
|
611 |
-
]
|
612 |
-
);
|
613 |
-
|
614 |
-
$repeater->add_control(
|
615 |
-
'back_icon_shape',
|
616 |
-
[
|
617 |
-
'label' => __( 'Shape', 'elementor' ),
|
618 |
-
'type' => Controls_Manager::SELECT,
|
619 |
-
'options' => [
|
620 |
-
'circle' => __( 'Circle', 'elementor' ),
|
621 |
-
'square' => __( 'Square', 'elementor' ),
|
622 |
-
],
|
623 |
-
'default' => 'circle',
|
624 |
-
'condition' => [
|
625 |
-
'back_box_element' => 'icon',
|
626 |
-
'back_icon_view!' => 'default',
|
627 |
-
],
|
628 |
-
]
|
629 |
-
);
|
630 |
-
|
631 |
-
$repeater->add_group_control(
|
632 |
-
Group_Control_Background::get_type(),
|
633 |
-
[
|
634 |
-
'name' => 'back_box_background_ind',
|
635 |
-
'types' => [ 'classic', 'gradient' ],
|
636 |
-
'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-back',
|
637 |
-
'condition' => [
|
638 |
-
'style_indv' => 'yes',
|
639 |
-
],
|
640 |
-
]
|
641 |
-
);
|
642 |
-
|
643 |
-
$repeater->add_control(
|
644 |
-
'back_box_background_overlay_ind',
|
645 |
-
[
|
646 |
-
'label' => __( 'Background Overlay', 'elementor' ),
|
647 |
-
'type' => Controls_Manager::COLOR,
|
648 |
-
'default' => '',
|
649 |
-
'separator' => 'before',
|
650 |
-
'condition' => [
|
651 |
-
'back_box_background_ind_image[id]!' => '',
|
652 |
-
'style_indv' => 'yes',
|
653 |
-
|
654 |
-
],
|
655 |
-
]
|
656 |
-
);
|
657 |
-
$repeater->add_control(
|
658 |
-
'back_box_title_color_indv',
|
659 |
-
[
|
660 |
-
'label' => __( 'Title', 'elementor' ),
|
661 |
-
'type' => Controls_Manager::COLOR,
|
662 |
-
'scheme' => [
|
663 |
-
'type' => Scheme_Color::get_type(),
|
664 |
-
'value' => Scheme_Color::COLOR_1,
|
665 |
-
],
|
666 |
-
'default' => '#FFF',
|
667 |
-
'selectors' => [
|
668 |
-
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .back-icon-title' => 'color: {{VALUE}};',
|
669 |
-
],
|
670 |
-
'condition' => [
|
671 |
-
'style_indv' => 'yes',
|
672 |
-
],
|
673 |
-
|
674 |
-
]
|
675 |
-
);
|
676 |
-
|
677 |
-
$repeater->add_group_control(
|
678 |
-
Group_Control_Typography::get_type(),
|
679 |
-
[
|
680 |
-
'name' => 'back_box_title_typography_indv',
|
681 |
-
'label' => __( 'Title Typography', 'elementor' ),
|
682 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
683 |
-
'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .back-icon-title',
|
684 |
-
'condition' => [
|
685 |
-
'style_indv' => 'yes',
|
686 |
-
],
|
687 |
-
]
|
688 |
-
);
|
689 |
-
|
690 |
-
$repeater->add_control(
|
691 |
-
'back_box_text_color_indv',
|
692 |
-
[
|
693 |
-
'label' => __( 'Description Color', 'elementor' ),
|
694 |
-
'type' => Controls_Manager::COLOR,
|
695 |
-
'scheme' => [
|
696 |
-
'type' => Scheme_Color::get_type(),
|
697 |
-
'value' => Scheme_Color::COLOR_1,
|
698 |
-
],
|
699 |
-
'default' => '#FFF',
|
700 |
-
'selectors' => [
|
701 |
-
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-back p' => 'color: {{VALUE}};',
|
702 |
-
],
|
703 |
-
'condition' => [
|
704 |
-
'style_indv' => 'yes',
|
705 |
-
],
|
706 |
-
|
707 |
-
]
|
708 |
-
);
|
709 |
-
|
710 |
-
$repeater->add_group_control(
|
711 |
-
Group_Control_Typography::get_type(),
|
712 |
-
[
|
713 |
-
'name' => 'back_box_text_typography_indv',
|
714 |
-
'label' => __( 'Description Typography', 'elementor' ),
|
715 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
716 |
-
'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-back p',
|
717 |
-
'condition' => [
|
718 |
-
'style_indv' => 'yes',
|
719 |
-
],
|
720 |
-
]
|
721 |
-
);
|
722 |
-
|
723 |
-
|
724 |
-
/**
|
725 |
-
* Back Box icons styles
|
726 |
-
**/
|
727 |
-
$repeater->add_control(
|
728 |
-
'back_box_icon_color_indv',
|
729 |
-
[
|
730 |
-
'label' => __( 'Icon Color', 'elementor' ),
|
731 |
-
'type' => Controls_Manager::COLOR,
|
732 |
-
'scheme' => [
|
733 |
-
'type' => Scheme_Color::get_type(),
|
734 |
-
'value' => Scheme_Color::COLOR_1,
|
735 |
-
],
|
736 |
-
'default' => '#FFF',
|
737 |
-
'selectors' => [
|
738 |
-
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-back .icon-wrapper i' => 'color: {{VALUE}};',
|
739 |
-
],
|
740 |
-
'condition' => [
|
741 |
-
'back_icon!' => '',
|
742 |
-
'style_indv' => 'yes',
|
743 |
-
],
|
744 |
-
]
|
745 |
-
);
|
746 |
-
|
747 |
-
$repeater->add_control(
|
748 |
-
'back_box_icon_fill_color_indv',
|
749 |
-
[
|
750 |
-
'label' => __( 'Icon Fill Color', 'elementor' ),
|
751 |
-
'type' => Controls_Manager::COLOR,
|
752 |
-
'scheme' => [
|
753 |
-
'type' => Scheme_Color::get_type(),
|
754 |
-
'value' => Scheme_Color::COLOR_1,
|
755 |
-
],
|
756 |
-
'selectors' => [
|
757 |
-
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-back .eae-fb-icon-view-stacked' => 'background-color: {{VALUE}};',
|
758 |
-
],
|
759 |
-
'condition' => [
|
760 |
-
'front_icon_view' => 'stacked',
|
761 |
-
'style_indv' => 'yes',
|
762 |
-
],
|
763 |
-
]
|
764 |
-
);
|
765 |
-
|
766 |
-
$repeater->add_group_control(
|
767 |
-
Group_Control_Border::get_type(),
|
768 |
-
[
|
769 |
-
'name' => 'back_box_icon_border_indv',
|
770 |
-
'label' => __( 'Box Border', 'elementor' ),
|
771 |
-
'placeholder' => '1px',
|
772 |
-
'default' => '1px',
|
773 |
-
'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-back .eae-fb-icon-view-framed, {{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-back .eae-fb-icon-view-stacked',
|
774 |
-
'label_block' => true,
|
775 |
-
'condition' => [
|
776 |
-
'back_icon_view!' => 'default',
|
777 |
-
'style_indv' => 'yes',
|
778 |
-
],
|
779 |
-
]
|
780 |
-
);
|
781 |
-
|
782 |
-
$repeater->add_control(
|
783 |
-
'back_icon_size_indv',
|
784 |
-
[
|
785 |
-
'label' => __( 'Icon Size', 'elementor' ),
|
786 |
-
'type' => Controls_Manager::SLIDER,
|
787 |
-
'range' => [
|
788 |
-
'px' => [
|
789 |
-
'min' => 6,
|
790 |
-
'max' => 300,
|
791 |
-
],
|
792 |
-
],
|
793 |
-
'selectors' => [
|
794 |
-
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-back .icon-wrapper i' => 'font-size: {{SIZE}}{{UNIT}};',
|
795 |
-
],
|
796 |
-
'condition' => [
|
797 |
-
'style_indv' => 'yes',
|
798 |
-
],
|
799 |
-
]
|
800 |
-
);
|
801 |
-
|
802 |
-
$repeater->add_control(
|
803 |
-
'back_icon_padding_indv',
|
804 |
-
[
|
805 |
-
'label' => __( 'Icon Padding', 'elementor' ),
|
806 |
-
'type' => Controls_Manager::SLIDER,
|
807 |
-
'selectors' => [
|
808 |
-
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-back .icon-wrapper' => 'padding: {{SIZE}}{{UNIT}};',
|
809 |
-
],
|
810 |
-
'default' => [
|
811 |
-
'size' => 1.5,
|
812 |
-
'unit' => 'em',
|
813 |
-
],
|
814 |
-
'range' => [
|
815 |
-
'em' => [
|
816 |
-
'min' => 0,
|
817 |
-
],
|
818 |
-
],
|
819 |
-
'condition' => [
|
820 |
-
'back_icon_view!' => 'default',
|
821 |
-
'style_indv' => 'yes',
|
822 |
-
],
|
823 |
-
]
|
824 |
-
);
|
825 |
-
|
826 |
-
$repeater->end_controls_tab();
|
827 |
-
|
828 |
-
$repeater->end_controls_tabs();
|
829 |
-
|
830 |
-
$repeater->add_control(
|
831 |
-
'action_button',
|
832 |
-
[
|
833 |
-
'label' => __('Action Button', 'elementor'),
|
834 |
-
'type' => Controls_Manager::HEADING,
|
835 |
-
]
|
836 |
-
);
|
837 |
-
$repeater->start_controls_tabs( 'back_box_button_style' );
|
838 |
-
|
839 |
-
$repeater->start_controls_tab(
|
840 |
-
'action_button_content',
|
841 |
-
[
|
842 |
-
'label' => __( 'Content', 'elementor' ),
|
843 |
-
]
|
844 |
-
);
|
845 |
-
|
846 |
-
|
847 |
-
$repeater->add_control(
|
848 |
-
'action_text',
|
849 |
-
[
|
850 |
-
'label' => __( 'Button Text', 'elementor' ),
|
851 |
-
'type' => Controls_Manager::TEXT,
|
852 |
-
'placeholder' => __( 'Buy', 'elementor' ),
|
853 |
-
'default' => __( 'Buy Now', 'elementor' ),
|
854 |
-
]
|
855 |
-
);
|
856 |
-
|
857 |
-
$repeater->add_control(
|
858 |
-
'link',
|
859 |
-
[
|
860 |
-
'label' => __( 'Link to', 'elementor' ),
|
861 |
-
'type' => Controls_Manager::URL,
|
862 |
-
'placeholder' => __( 'http://your-link.com', 'elementor' ),
|
863 |
-
'separator' => 'before',
|
864 |
-
]
|
865 |
-
);
|
866 |
-
$repeater->end_controls_tab();
|
867 |
-
|
868 |
-
$repeater->start_controls_tab(
|
869 |
-
'action_button_Style_indv',
|
870 |
-
[
|
871 |
-
'label' => __( 'Style', 'elementor' ),
|
872 |
-
]
|
873 |
-
);
|
874 |
-
|
875 |
-
$repeater->add_control(
|
876 |
-
'button_text_color_indv',
|
877 |
-
[
|
878 |
-
'label' => __( 'Text Color', 'elementor' ),
|
879 |
-
'type' => Controls_Manager::COLOR,
|
880 |
-
'default' => '#fff',
|
881 |
-
'selectors' => [
|
882 |
-
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-fb-button' => 'color: {{VALUE}};',
|
883 |
-
],
|
884 |
-
'condition' => [
|
885 |
-
'style_indv' => 'yes',
|
886 |
-
],
|
887 |
-
]
|
888 |
-
);
|
889 |
-
|
890 |
-
$repeater->add_group_control(
|
891 |
-
Group_Control_Typography::get_type(),
|
892 |
-
[
|
893 |
-
'name' => 'typography_indv',
|
894 |
-
'label' => __( 'Typography', 'elementor' ),
|
895 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
896 |
-
'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-fb-button',
|
897 |
-
'condition' => [
|
898 |
-
'style_indv' => 'yes',
|
899 |
-
],
|
900 |
-
]
|
901 |
-
);
|
902 |
-
|
903 |
-
$repeater->add_control(
|
904 |
-
'background_color_indv',
|
905 |
-
[
|
906 |
-
'label' => __( 'Background Color', 'elementor' ),
|
907 |
-
'type' => Controls_Manager::COLOR,
|
908 |
-
'scheme' => [
|
909 |
-
'type' => Scheme_Color::get_type(),
|
910 |
-
'value' => Scheme_Color::COLOR_4,
|
911 |
-
],
|
912 |
-
'default' => '#93C64F',
|
913 |
-
'selectors' => [
|
914 |
-
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-fb-button' => 'background-color: {{VALUE}};',
|
915 |
-
],
|
916 |
-
'condition' => [
|
917 |
-
'style_indv'=> 'yes',
|
918 |
-
],
|
919 |
-
]
|
920 |
-
);
|
921 |
-
|
922 |
-
$repeater->add_group_control(
|
923 |
-
Group_Control_Border::get_type(),
|
924 |
-
[
|
925 |
-
'name' => 'border_indv',
|
926 |
-
'label' => __( 'Border', 'elementor' ),
|
927 |
-
'placeholder' => '1px',
|
928 |
-
'default' => '1px',
|
929 |
-
'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-fb-button',
|
930 |
-
'condition' => [
|
931 |
-
'style_indv' => 'yes',
|
932 |
-
],
|
933 |
-
]
|
934 |
-
);
|
935 |
-
|
936 |
-
$repeater->add_control(
|
937 |
-
'border_radius_indv',
|
938 |
-
[
|
939 |
-
'label' => __( 'Border Radius', 'elementor' ),
|
940 |
-
'type' => Controls_Manager::DIMENSIONS,
|
941 |
-
'size_units' => [ 'px', '%' ],
|
942 |
-
'selectors' => [
|
943 |
-
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-fb-button' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
944 |
-
],
|
945 |
-
'condition' => [
|
946 |
-
'style_indv' => 'yes',
|
947 |
-
],
|
948 |
-
]
|
949 |
-
);
|
950 |
-
|
951 |
-
$repeater->add_control(
|
952 |
-
'text_padding_indv',
|
953 |
-
[
|
954 |
-
'label' => __( 'Text Padding', 'elementor' ),
|
955 |
-
'type' => Controls_Manager::DIMENSIONS,
|
956 |
-
'size_units' => [ 'px', 'em', '%' ],
|
957 |
-
'selectors' => [
|
958 |
-
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-fb-button' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
959 |
-
],
|
960 |
-
'condition' => [
|
961 |
-
'style_indv' => 'yes',
|
962 |
-
],
|
963 |
-
]
|
964 |
-
);
|
965 |
-
|
966 |
-
$repeater->end_controls_tab();
|
967 |
-
|
968 |
-
$repeater->end_controls_tabs();
|
969 |
-
|
970 |
-
$this->add_control(
|
971 |
-
'eae_flip_box_set',
|
972 |
-
[
|
973 |
-
'label' => __( 'Flip Box', 'elementor' ),
|
974 |
-
'type' => Controls_Manager::REPEATER,
|
975 |
-
'show_label' => true,
|
976 |
-
'fields' => array_values($repeater->get_controls()),
|
977 |
-
]
|
978 |
-
);
|
979 |
-
|
980 |
-
$this->end_controls_section();
|
981 |
-
|
982 |
-
$this->start_controls_section(
|
983 |
-
'section_general_style',
|
984 |
-
[
|
985 |
-
'label' => __( 'General', 'elementor' ),
|
986 |
-
'tab' => Controls_Manager::TAB_STYLE
|
987 |
-
]
|
988 |
-
);
|
989 |
-
|
990 |
-
$this->add_control(
|
991 |
-
'animation_style',
|
992 |
-
[
|
993 |
-
'label' => __( 'Animation Style', 'elementor' ),
|
994 |
-
'type' => Controls_Manager::SELECT,
|
995 |
-
'options' => [
|
996 |
-
'horizontal' => __( 'Horizontal', 'elementor' ),
|
997 |
-
'vertical' => __( 'Vertical', 'elementor' ),
|
998 |
-
'flipcard flipcard-rotate-top-down' => __( 'Cube - Top Down', 'elementor' ),
|
999 |
-
'flipcard flipcard-rotate-down-top' => __( 'Cube - Down Top', 'elementor' ),
|
1000 |
-
'flipcard flipcard-rotate-left-right' => __( 'Cube - Left Right', 'elementor' ),
|
1001 |
-
'flipcard flipcard-rotate-right-left' => __( 'Cube - Right Left', 'elementor' ),
|
1002 |
-
'fade' =>__('Fade','elementor'),
|
1003 |
-
'' =>__('Rollover','elementor'),
|
1004 |
-
'flip box' =>__('Flip Box','elementor'),
|
1005 |
-
'flip box fade' =>__('Flip Box Fade','elementor'),
|
1006 |
-
'flip box fade up' =>__('Fade Up','elementor'),
|
1007 |
-
'flip box fade hideback' =>__('Fade Hideback','elementor'),
|
1008 |
-
'flip box fade up hideback' =>__('Fade Up Hideback','elementor'),
|
1009 |
-
'nananana' =>__('Nananana','elementor'),
|
1010 |
-
'zommin' => __( 'Zoom In', 'elementor' ),
|
1011 |
-
'zoomout' => __( 'Zoom Out', 'elementor' ),
|
1012 |
-
],
|
1013 |
-
'default' => 'vertical',
|
1014 |
-
'prefix_class' => 'eae-fb-animate-'
|
1015 |
-
]
|
1016 |
-
);
|
1017 |
-
|
1018 |
-
|
1019 |
-
$this->add_group_control(
|
1020 |
-
Group_Control_Border::get_type(),
|
1021 |
-
[
|
1022 |
-
'name' => 'flip_box_border',
|
1023 |
-
'label' => __( 'Box Border', 'elementor' ),
|
1024 |
-
'selector' => '{{WRAPPER}} .eae-flip-box-inner > div',
|
1025 |
-
]
|
1026 |
-
);
|
1027 |
-
|
1028 |
-
|
1029 |
-
|
1030 |
-
$this->add_control(
|
1031 |
-
'box_border_radius',
|
1032 |
-
[
|
1033 |
-
'label' => __( 'Border Radius', 'elementor' ),
|
1034 |
-
'type' => Controls_Manager::DIMENSIONS,
|
1035 |
-
'size_units' => [ 'px', '%' ],
|
1036 |
-
'selectors' => [
|
1037 |
-
'{{WRAPPER}} .eae-flip-box-front' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
1038 |
-
'{{WRAPPER}} .eae-flip-box-back' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
1039 |
-
],
|
1040 |
-
]
|
1041 |
-
);
|
1042 |
-
|
1043 |
-
$this->add_control(
|
1044 |
-
'box_height',
|
1045 |
-
[
|
1046 |
-
'type' => Controls_Manager::TEXT,
|
1047 |
-
'label' => __( 'Box Height', 'elementor' ),
|
1048 |
-
'placeholder' => __( '250', 'elementor' ),
|
1049 |
-
'default' => __( '250', 'elementor' ),
|
1050 |
-
'selectors' => [
|
1051 |
-
'{{WRAPPER}} .eae-flip-box-inner' => 'height: {{VALUE}}px;',
|
1052 |
-
'{{WRAPPER}}.eae-fb-animate-flipcard .eae-flip-box-front' => 'transform-origin: center center calc(-{{VALUE}}px/2);-webkit-transform-origin:center center calc(-{{VALUE}}px/2);',
|
1053 |
-
'{{WRAPPER}}.eae-fb-animate-flipcard .eae-flip-box-back' => 'transform-origin: center center calc(-{{VALUE }}px/2);-webkit-transform-origin:center center calc(-{{VALUE}}px/2);'
|
1054 |
-
],
|
1055 |
-
]
|
1056 |
-
);
|
1057 |
-
|
1058 |
-
$this->end_controls_section();
|
1059 |
-
|
1060 |
-
$this->start_controls_section(
|
1061 |
-
'section-front-box-style',
|
1062 |
-
[
|
1063 |
-
'label' => __( 'Front Box', 'elementor' ),
|
1064 |
-
'tab' => Controls_Manager::TAB_STYLE
|
1065 |
-
]
|
1066 |
-
);
|
1067 |
-
$this->add_control(
|
1068 |
-
'front_icon_view_global',
|
1069 |
-
[
|
1070 |
-
'label' => __( 'View', 'elementor' ),
|
1071 |
-
'type' => Controls_Manager::SELECT,
|
1072 |
-
'options' => [
|
1073 |
-
'default' => __( 'Default', 'elementor' ),
|
1074 |
-
'stacked' => __( 'Stacked', 'elementor' ),
|
1075 |
-
'framed' => __( 'Framed', 'elementor' ),
|
1076 |
-
],
|
1077 |
-
'default' => 'default',
|
1078 |
-
|
1079 |
-
]
|
1080 |
-
);
|
1081 |
-
|
1082 |
-
$this->add_control(
|
1083 |
-
'front_icon_shape_global',
|
1084 |
-
[
|
1085 |
-
'label' => __( 'Shape', 'elementor' ),
|
1086 |
-
'type' => Controls_Manager::SELECT,
|
1087 |
-
'options' => [
|
1088 |
-
'circle' => __( 'Circle', 'elementor' ),
|
1089 |
-
'square' => __( 'Square', 'elementor' ),
|
1090 |
-
],
|
1091 |
-
'default' => 'circle',
|
1092 |
-
'condition' => [
|
1093 |
-
'front_icon_view_global!' => 'default',
|
1094 |
-
],
|
1095 |
-
]
|
1096 |
-
);
|
1097 |
-
|
1098 |
-
$this->add_group_control(
|
1099 |
-
Group_Control_Background::get_type(),
|
1100 |
-
[
|
1101 |
-
'name' => 'front_box_background',
|
1102 |
-
'label' => __( 'Front Box Background', 'elementor' ),
|
1103 |
-
'types' => [ 'classic','gradient' ],
|
1104 |
-
'selector' => '{{WRAPPER}} .overwrite-style-no .eae-flip-box-front',
|
1105 |
-
]
|
1106 |
-
|
1107 |
-
);
|
1108 |
-
|
1109 |
-
|
1110 |
-
$this->add_control(
|
1111 |
-
'front_box_title_color',
|
1112 |
-
[
|
1113 |
-
'label' => __( 'Title', 'elementor' ),
|
1114 |
-
'type' => Controls_Manager::COLOR,
|
1115 |
-
'scheme' => [
|
1116 |
-
'type' => Scheme_Color::get_type(),
|
1117 |
-
'value' => Scheme_Color::COLOR_1,
|
1118 |
-
],
|
1119 |
-
'default' => '#FFF',
|
1120 |
-
'selectors' => [
|
1121 |
-
'{{WRAPPER}} .front-icon-title ' => 'color: {{VALUE}};',
|
1122 |
-
],
|
1123 |
-
]
|
1124 |
-
);
|
1125 |
-
|
1126 |
-
$this->add_group_control(
|
1127 |
-
Group_Control_Typography::get_type(),
|
1128 |
-
[
|
1129 |
-
'name' => 'front_box_title_typography',
|
1130 |
-
'label' => __( 'Title Typography', 'elementor' ),
|
1131 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
1132 |
-
'selector' => '{{WRAPPER}} .front-icon-title',
|
1133 |
-
]
|
1134 |
-
);
|
1135 |
-
|
1136 |
-
$this->add_control(
|
1137 |
-
'front_box_text_color',
|
1138 |
-
[
|
1139 |
-
'label' => __( 'Description Color', 'elementor' ),
|
1140 |
-
'type' => Controls_Manager::COLOR,
|
1141 |
-
'scheme' => [
|
1142 |
-
'type' => Scheme_Color::get_type(),
|
1143 |
-
'value' => Scheme_Color::COLOR_1,
|
1144 |
-
],
|
1145 |
-
'default' => '#FFF',
|
1146 |
-
'selectors' => [
|
1147 |
-
'{{WRAPPER}} .eae-flip-box-front p' => 'color: {{VALUE}};',
|
1148 |
-
],
|
1149 |
-
|
1150 |
-
]
|
1151 |
-
);
|
1152 |
-
|
1153 |
-
$this->add_group_control(
|
1154 |
-
Group_Control_Typography::get_type(),
|
1155 |
-
[
|
1156 |
-
'name' => 'front_box_text_typography',
|
1157 |
-
'label' => __( 'Description Typography', 'elementor' ),
|
1158 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
1159 |
-
'selector' => '{{WRAPPER}} .eae-flip-box-front p',
|
1160 |
-
]
|
1161 |
-
);
|
1162 |
-
|
1163 |
-
|
1164 |
-
/**
|
1165 |
-
* Front Box icons styles
|
1166 |
-
**/
|
1167 |
-
$this->add_control(
|
1168 |
-
'front_box_icon_color',
|
1169 |
-
[
|
1170 |
-
'label' => __( 'Icon Color', 'elementor' ),
|
1171 |
-
'type' => Controls_Manager::COLOR,
|
1172 |
-
'scheme' => [
|
1173 |
-
'type' => Scheme_Color::get_type(),
|
1174 |
-
'value' => Scheme_Color::COLOR_1,
|
1175 |
-
],
|
1176 |
-
'default' => '#FFF',
|
1177 |
-
'selectors' => [
|
1178 |
-
'{{WRAPPER}} .eae-flip-box-front .icon-wrapper i' => 'color: {{VALUE}};',
|
1179 |
-
],
|
1180 |
-
]
|
1181 |
-
);
|
1182 |
-
|
1183 |
-
$this->add_control(
|
1184 |
-
'front_box_icon_fill_color',
|
1185 |
-
[
|
1186 |
-
'label' => __( 'Icon Fill Color', 'elementor' ),
|
1187 |
-
'type' => Controls_Manager::COLOR,
|
1188 |
-
'scheme' => [
|
1189 |
-
'type' => Scheme_Color::get_type(),
|
1190 |
-
'value' => Scheme_Color::COLOR_1,
|
1191 |
-
],
|
1192 |
-
'selectors' => [
|
1193 |
-
'{{WRAPPER}} .eae-fb-icon-view-stacked' => 'background-color: {{VALUE}};',
|
1194 |
-
],
|
1195 |
-
'condition' => [
|
1196 |
-
'front_icon_view_global' => 'stacked'
|
1197 |
-
],
|
1198 |
-
]
|
1199 |
-
);
|
1200 |
-
|
1201 |
-
$this->add_group_control(
|
1202 |
-
Group_Control_Border::get_type(),
|
1203 |
-
[
|
1204 |
-
'name' => 'front_box_icon_border',
|
1205 |
-
'label' => __( 'Box Border', 'elementor' ),
|
1206 |
-
'placeholder' => '1px',
|
1207 |
-
'default' => '1px',
|
1208 |
-
'selector' => '{{WRAPPER}} .eae-flip-box-front .eae-fb-icon-view-framed, {{WRAPPER}} .eae-flip-box-front .eae-fb-icon-view-stacked',
|
1209 |
-
'label_block' => true,
|
1210 |
-
'condition' => [
|
1211 |
-
'front_icon_view_global!' => 'default'
|
1212 |
-
],
|
1213 |
-
]
|
1214 |
-
);
|
1215 |
-
|
1216 |
-
$this->add_control(
|
1217 |
-
'front_icon_size',
|
1218 |
-
[
|
1219 |
-
'label' => __( 'Icon Size', 'elementor' ),
|
1220 |
-
'type' => Controls_Manager::SLIDER,
|
1221 |
-
'range' => [
|
1222 |
-
'px' => [
|
1223 |
-
'min' => 6,
|
1224 |
-
'max' => 300,
|
1225 |
-
],
|
1226 |
-
],
|
1227 |
-
'selectors' => [
|
1228 |
-
'{{WRAPPER}} .eae-flip-box-front .icon-wrapper i' => 'font-size: {{SIZE}}{{UNIT}};',
|
1229 |
-
],
|
1230 |
-
]
|
1231 |
-
);
|
1232 |
-
|
1233 |
-
$this->add_control(
|
1234 |
-
'front_icon_padding',
|
1235 |
-
[
|
1236 |
-
'label' => __( 'Icon Padding', 'elementor' ),
|
1237 |
-
'type' => Controls_Manager::SLIDER,
|
1238 |
-
'selectors' => [
|
1239 |
-
'{{WRAPPER}} .eae-flip-box-front .icon-wrapper' => 'padding: {{SIZE}}{{UNIT}};',
|
1240 |
-
],
|
1241 |
-
'default' => [
|
1242 |
-
'size' => 1.5,
|
1243 |
-
'unit' => 'em',
|
1244 |
-
],
|
1245 |
-
'range' => [
|
1246 |
-
'em' => [
|
1247 |
-
'min' => 0,
|
1248 |
-
],
|
1249 |
-
],
|
1250 |
-
]
|
1251 |
-
);
|
1252 |
-
|
1253 |
-
$this->end_controls_section();
|
1254 |
-
|
1255 |
-
|
1256 |
-
|
1257 |
-
$this->start_controls_section(
|
1258 |
-
'section-back-box-style',
|
1259 |
-
[
|
1260 |
-
'label' => __( 'Back Box', 'elementor' ),
|
1261 |
-
'tab' => Controls_Manager::TAB_STYLE
|
1262 |
-
]
|
1263 |
-
);
|
1264 |
-
|
1265 |
-
$this->add_control(
|
1266 |
-
'back_icon_view_global',
|
1267 |
-
[
|
1268 |
-
'label' => __( 'View', 'elementor' ),
|
1269 |
-
'type' => Controls_Manager::SELECT,
|
1270 |
-
'options' => [
|
1271 |
-
'default' => __( 'Default', 'elementor' ),
|
1272 |
-
'stacked' => __( 'Stacked', 'elementor' ),
|
1273 |
-
'framed' => __( 'Framed', 'elementor' ),
|
1274 |
-
],
|
1275 |
-
'default' => 'default',
|
1276 |
-
]
|
1277 |
-
);
|
1278 |
-
|
1279 |
-
$this->add_control(
|
1280 |
-
'back_icon_shape_global',
|
1281 |
-
[
|
1282 |
-
'label' => __( 'Shape', 'elementor' ),
|
1283 |
-
'type' => Controls_Manager::SELECT,
|
1284 |
-
'options' => [
|
1285 |
-
'circle' => __( 'Circle', 'elementor' ),
|
1286 |
-
'square' => __( 'Square', 'elementor' ),
|
1287 |
-
],
|
1288 |
-
'default' => 'circle',
|
1289 |
-
|
1290 |
-
]
|
1291 |
-
);
|
1292 |
-
$this->add_group_control(
|
1293 |
-
Group_Control_Background::get_type(),
|
1294 |
-
[
|
1295 |
-
'name' => 'back_box_background',
|
1296 |
-
'label' => __( 'Back Box Background', 'elementor' ),
|
1297 |
-
'types' => [ 'classic','gradient' ],
|
1298 |
-
'selector' => '{{WRAPPER}} .eae-flip-box-back',
|
1299 |
-
]
|
1300 |
-
);
|
1301 |
-
|
1302 |
-
$this->add_control(
|
1303 |
-
'back_box_title_color',
|
1304 |
-
[
|
1305 |
-
'label' => __( 'Title', 'elementor' ),
|
1306 |
-
'type' => Controls_Manager::COLOR,
|
1307 |
-
'scheme' => [
|
1308 |
-
'type' => Scheme_Color::get_type(),
|
1309 |
-
'value' => Scheme_Color::COLOR_1,
|
1310 |
-
],
|
1311 |
-
'default' => '#FFF',
|
1312 |
-
'selectors' => [
|
1313 |
-
'{{WRAPPER}} .back-icon-title' => 'color: {{VALUE}};',
|
1314 |
-
],
|
1315 |
-
|
1316 |
-
]
|
1317 |
-
);
|
1318 |
-
|
1319 |
-
$this->add_group_control(
|
1320 |
-
Group_Control_Typography::get_type(),
|
1321 |
-
[
|
1322 |
-
'name' => 'back_box_title_typography',
|
1323 |
-
'label' => __( 'Title Typography', 'elementor' ),
|
1324 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
1325 |
-
'selector' => '{{WRAPPER}} .back-icon-title',
|
1326 |
-
]
|
1327 |
-
);
|
1328 |
-
|
1329 |
-
$this->add_control(
|
1330 |
-
'back_box_text_color',
|
1331 |
-
[
|
1332 |
-
'label' => __( 'Description Color', 'elementor' ),
|
1333 |
-
'type' => Controls_Manager::COLOR,
|
1334 |
-
'scheme' => [
|
1335 |
-
'type' => Scheme_Color::get_type(),
|
1336 |
-
'value' => Scheme_Color::COLOR_1,
|
1337 |
-
],
|
1338 |
-
'default' => '#FFF',
|
1339 |
-
'selectors' => [
|
1340 |
-
'{{WRAPPER}} .eae-flip-box-back p' => 'color: {{VALUE}};',
|
1341 |
-
],
|
1342 |
-
|
1343 |
-
]
|
1344 |
-
);
|
1345 |
-
|
1346 |
-
$this->add_group_control(
|
1347 |
-
Group_Control_Typography::get_type(),
|
1348 |
-
[
|
1349 |
-
'name' => 'back_box_text_typography',
|
1350 |
-
'label' => __( 'Description Typography', 'elementor' ),
|
1351 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
1352 |
-
'selector' => '{{WRAPPER}} .eae-flip-box-back p',
|
1353 |
-
]
|
1354 |
-
);
|
1355 |
-
|
1356 |
-
|
1357 |
-
/**
|
1358 |
-
* Back Box icons styles
|
1359 |
-
**/
|
1360 |
-
$this->add_control(
|
1361 |
-
'back_box_icon_color',
|
1362 |
-
[
|
1363 |
-
'label' => __( 'Icon Color', 'elementor' ),
|
1364 |
-
'type' => Controls_Manager::COLOR,
|
1365 |
-
'scheme' => [
|
1366 |
-
'type' => Scheme_Color::get_type(),
|
1367 |
-
'value' => Scheme_Color::COLOR_1,
|
1368 |
-
],
|
1369 |
-
'default' => '#FFF',
|
1370 |
-
'selectors' => [
|
1371 |
-
'{{WRAPPER}} .eae-flip-box-back .icon-wrapper i' => 'color: {{VALUE}};',
|
1372 |
-
],
|
1373 |
-
]
|
1374 |
-
);
|
1375 |
-
|
1376 |
-
$this->add_control(
|
1377 |
-
'back_box_icon_fill_color',
|
1378 |
-
[
|
1379 |
-
'label' => __( 'Icon Fill Color', 'elementor' ),
|
1380 |
-
'type' => Controls_Manager::COLOR,
|
1381 |
-
'scheme' => [
|
1382 |
-
'type' => Scheme_Color::get_type(),
|
1383 |
-
'value' => Scheme_Color::COLOR_1,
|
1384 |
-
],
|
1385 |
-
'selectors' => [
|
1386 |
-
'{{WRAPPER}} .eae-flip-box-back .eae-fb-icon-view-stacked' => 'background-color: {{VALUE}};',
|
1387 |
-
],
|
1388 |
-
'condition' => [
|
1389 |
-
'back_icon_view_global' => 'stacked'
|
1390 |
-
],
|
1391 |
-
]
|
1392 |
-
);
|
1393 |
-
|
1394 |
-
$this->add_group_control(
|
1395 |
-
Group_Control_Border::get_type(),
|
1396 |
-
[
|
1397 |
-
'name' => 'back_box_icon_border',
|
1398 |
-
'label' => __( 'Box Border', 'elementor' ),
|
1399 |
-
'placeholder' => '1px',
|
1400 |
-
'default' => '1px',
|
1401 |
-
'selector' => '{{WRAPPER}} .eae-flip-box-back .eae-fb-icon-view-framed, {{WRAPPER}} .eae-flip-box-back .eae-fb-icon-view-stacked',
|
1402 |
-
'label_block' => true,
|
1403 |
-
'condition' => [
|
1404 |
-
'back_icon_view!' => 'default'
|
1405 |
-
],
|
1406 |
-
]
|
1407 |
-
);
|
1408 |
-
|
1409 |
-
$this->add_control(
|
1410 |
-
'back_icon_size',
|
1411 |
-
[
|
1412 |
-
'label' => __( 'Icon Size', 'elementor' ),
|
1413 |
-
'type' => Controls_Manager::SLIDER,
|
1414 |
-
'range' => [
|
1415 |
-
'px' => [
|
1416 |
-
'min' => 6,
|
1417 |
-
'max' => 300,
|
1418 |
-
],
|
1419 |
-
],
|
1420 |
-
'selectors' => [
|
1421 |
-
'{{WRAPPER}} .eae-flip-box-back .icon-wrapper i' => 'font-size: {{SIZE}}{{UNIT}};',
|
1422 |
-
],
|
1423 |
-
]
|
1424 |
-
);
|
1425 |
-
|
1426 |
-
$this->add_control(
|
1427 |
-
'back_icon_padding',
|
1428 |
-
[
|
1429 |
-
'label' => __( 'Icon Padding', 'elementor' ),
|
1430 |
-
'type' => Controls_Manager::SLIDER,
|
1431 |
-
'selectors' => [
|
1432 |
-
'{{WRAPPER}} .eae-flip-box-back .icon-wrapper' => 'padding: {{SIZE}}{{UNIT}};',
|
1433 |
-
],
|
1434 |
-
'default' => [
|
1435 |
-
'size' => 1.5,
|
1436 |
-
'unit' => 'em',
|
1437 |
-
],
|
1438 |
-
'range' => [
|
1439 |
-
'em' => [
|
1440 |
-
'min' => 0,
|
1441 |
-
],
|
1442 |
-
],
|
1443 |
-
'condition' => [
|
1444 |
-
'back_icon_view!' => 'default',
|
1445 |
-
],
|
1446 |
-
]
|
1447 |
-
);
|
1448 |
-
|
1449 |
-
|
1450 |
-
|
1451 |
-
$this->end_controls_section();
|
1452 |
-
|
1453 |
-
$this->start_controls_section(
|
1454 |
-
'section-action-button-style',
|
1455 |
-
[
|
1456 |
-
'label' => __( 'Action Button', 'elementor' ),
|
1457 |
-
'tab' => Controls_Manager::TAB_STYLE,
|
1458 |
-
]
|
1459 |
-
);
|
1460 |
-
|
1461 |
-
$this->add_control(
|
1462 |
-
'button_text_color',
|
1463 |
-
[
|
1464 |
-
'label' => __( 'Text Color', 'elementor' ),
|
1465 |
-
'type' => Controls_Manager::COLOR,
|
1466 |
-
'default' => '#fff',
|
1467 |
-
'selectors' => [
|
1468 |
-
'{{WRAPPER}} .eae-fb-button' => 'color: {{VALUE}};',
|
1469 |
-
],
|
1470 |
-
]
|
1471 |
-
);
|
1472 |
-
|
1473 |
-
$this->add_group_control(
|
1474 |
-
Group_Control_Typography::get_type(),
|
1475 |
-
[
|
1476 |
-
'name' => 'typography',
|
1477 |
-
'label' => __( 'Typography', 'elementor' ),
|
1478 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
1479 |
-
'selector' => '{{WRAPPER}} .eae-fb-button',
|
1480 |
-
]
|
1481 |
-
);
|
1482 |
-
|
1483 |
-
$this->add_control(
|
1484 |
-
'background_color',
|
1485 |
-
[
|
1486 |
-
'label' => __( 'Background Color', 'elementor' ),
|
1487 |
-
'type' => Controls_Manager::COLOR,
|
1488 |
-
'scheme' => [
|
1489 |
-
'type' => Scheme_Color::get_type(),
|
1490 |
-
'value' => Scheme_Color::COLOR_4,
|
1491 |
-
],
|
1492 |
-
'default' => '#93C64F',
|
1493 |
-
'selectors' => [
|
1494 |
-
'{{WRAPPER}} .eae-fb-button' => 'background-color: {{VALUE}};',
|
1495 |
-
],
|
1496 |
-
]
|
1497 |
-
);
|
1498 |
-
|
1499 |
-
$this->add_group_control(
|
1500 |
-
Group_Control_Border::get_type(),
|
1501 |
-
[
|
1502 |
-
'name' => 'border',
|
1503 |
-
'label' => __( 'Border', 'elementor' ),
|
1504 |
-
'placeholder' => '1px',
|
1505 |
-
'default' => '1px',
|
1506 |
-
'selector' => '{{WRAPPER}} .eae-fb-button',
|
1507 |
-
]
|
1508 |
-
);
|
1509 |
-
|
1510 |
-
$this->add_control(
|
1511 |
-
'border_radius',
|
1512 |
-
[
|
1513 |
-
'label' => __( 'Border Radius', 'elementor' ),
|
1514 |
-
'type' => Controls_Manager::DIMENSIONS,
|
1515 |
-
'size_units' => [ 'px', '%' ],
|
1516 |
-
'selectors' => [
|
1517 |
-
'{{WRAPPER}} .eae-fb-button' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
1518 |
-
],
|
1519 |
-
]
|
1520 |
-
);
|
1521 |
-
|
1522 |
-
$this->add_control(
|
1523 |
-
'text_padding',
|
1524 |
-
[
|
1525 |
-
'label' => __( 'Text Padding', 'elementor' ),
|
1526 |
-
'type' => Controls_Manager::DIMENSIONS,
|
1527 |
-
'size_units' => [ 'px', 'em', '%' ],
|
1528 |
-
'selectors' => [
|
1529 |
-
'{{WRAPPER}} .eae-fb-button' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
1530 |
-
],
|
1531 |
-
]
|
1532 |
-
);
|
1533 |
-
|
1534 |
-
$this->end_controls_section();
|
1535 |
-
|
1536 |
-
}
|
1537 |
-
protected function render( ) {
|
1538 |
-
$settings = $this->get_settings_for_display();
|
1539 |
-
|
1540 |
-
if(count($settings['eae_flip_box_set'])){
|
1541 |
-
//echo "<pre>";print_r($settings);echo "</pre>";
|
1542 |
-
?>
|
1543 |
-
<div class="eae-flip-box">
|
1544 |
-
<?php
|
1545 |
-
foreach ($settings['eae_flip_box_set'] as $flipbox){
|
1546 |
-
//echo "<pre>";print_r($flipbox);echo "</pre>";
|
1547 |
-
if($flipbox['front_box_element'] == "icon") {
|
1548 |
-
if($flipbox['style_indv'] == "yes") {
|
1549 |
-
$this->add_render_attribute( $flipbox['_id'].'-front-icon-wrapper', 'class', 'icon-wrapper' );
|
1550 |
-
$this->add_render_attribute( $flipbox['_id'].'-front-icon-wrapper', 'class', 'eae-fb-icon-view-' . $flipbox['front_icon_view'] );
|
1551 |
-
$this->add_render_attribute( $flipbox['_id'].'-front-icon-wrapper', 'class', 'eae-fb-icon-shape-' . $flipbox['front_icon_shape'] );
|
1552 |
-
}
|
1553 |
-
else
|
1554 |
-
{
|
1555 |
-
$this->add_render_attribute( $flipbox['_id'].'-front-icon-wrapper', 'class', 'icon-wrapper' );
|
1556 |
-
$this->add_render_attribute( $flipbox['_id'].'-front-icon-wrapper', 'class', 'eae-fb-icon-view-' . $settings['front_icon_view_global'] );
|
1557 |
-
$this->add_render_attribute( $flipbox['_id'].'-front-icon-wrapper', 'class', 'eae-fb-icon-shape-' . $settings['front_icon_shape_global'] );
|
1558 |
-
}
|
1559 |
-
$this->add_render_attribute( $flipbox['_id'].'-front-icon-title', 'class', 'front-icon-title' );
|
1560 |
-
$this->add_render_attribute( $flipbox['_id'].'-front-icon', 'class', $flipbox['front_icon'] );
|
1561 |
-
}
|
1562 |
-
if($flipbox['back_box_element'] == "icon") {
|
1563 |
-
if($flipbox['style_indv'] == "yes") {
|
1564 |
-
$this->add_render_attribute($flipbox['_id'] . '-back-icon-wrapper', 'class', 'icon-wrapper');
|
1565 |
-
$this->add_render_attribute($flipbox['_id'] . '-back-icon-wrapper', 'class', 'eae-fb-icon-view-' . $flipbox['back_icon_view']);
|
1566 |
-
$this->add_render_attribute($flipbox['_id'] . '-back-icon-wrapper', 'class', 'eae-fb-icon-shape-' . $flipbox['back_icon_shape']);
|
1567 |
-
}
|
1568 |
-
else
|
1569 |
-
{
|
1570 |
-
$this->add_render_attribute( $flipbox['_id'].'-back-icon-wrapper', 'class', 'icon-wrapper' );
|
1571 |
-
$this->add_render_attribute( $flipbox['_id'].'-back-icon-wrapper', 'class', 'eae-fb-icon-view-' . $settings['back_icon_view_global'] );
|
1572 |
-
$this->add_render_attribute( $flipbox['_id'].'-back-icon-wrapper', 'class', 'eae-fb-icon-shape-' . $settings['back_icon_shape_global'] );
|
1573 |
-
}
|
1574 |
-
$this->add_render_attribute( $flipbox['_id'].'-back-icon-title', 'class', 'back-icon-title' );
|
1575 |
-
$this->add_render_attribute( $flipbox['_id'].'-back-icon', 'class', $flipbox['back_icon'] );
|
1576 |
-
}
|
1577 |
-
$this->add_render_attribute( $flipbox['_id'].'-button', 'class', 'eae-fb-button' );
|
1578 |
-
if ( ! empty( $flipbox['link']['url'] ) ) {
|
1579 |
-
$this->add_render_attribute( $flipbox['_id'].'-button', 'href', $flipbox['link']['url'] );
|
1580 |
-
|
1581 |
-
if ( ! empty( $flipbox['link']['is_external'] ) ) {
|
1582 |
-
$this->add_render_attribute( $flipbox['_id'].'-button', 'target', '_blank' );
|
1583 |
-
}
|
1584 |
-
}
|
1585 |
-
?>
|
1586 |
-
|
1587 |
-
<div class="elementor-repeater-item-<?php echo $flipbox['_id']; ?> overwrite-style-<?php echo $flipbox['style_indv']; ?> eae-flip-box-wrapper ">
|
1588 |
-
<div class="eae-flip-box-inner" >
|
1589 |
-
|
1590 |
-
<div class="eae-flip-box-front">
|
1591 |
-
<div class="flipbox-content">
|
1592 |
-
<?php if($flipbox['front_box_element'] == "icon") {?>
|
1593 |
-
<?php if(!empty($flipbox['front_icon'])){ ?>
|
1594 |
-
<div <?php echo $this->get_render_attribute_string( $flipbox['_id'].'-front-icon-wrapper' ); ?>>
|
1595 |
-
<i <?php echo $this->get_render_attribute_string( $flipbox['_id'].'-front-icon' ); ?>></i>
|
1596 |
-
</div>
|
1597 |
-
<?php } } ?>
|
1598 |
-
<?php if($flipbox['front_box_element'] == "image"){
|
1599 |
-
if($flipbox['front_box_image']['url'] !="")
|
1600 |
-
{
|
1601 |
-
$pix = wp_get_attachment_image_src($flipbox['front_box_image']['id'],$flipbox['front_image_size_size']);
|
1602 |
-
echo "<img src='".$pix[0]."'>";
|
1603 |
-
|
1604 |
-
}
|
1605 |
-
}?>
|
1606 |
-
|
1607 |
-
<?php if(!empty($flipbox['front_title'])){ ?>
|
1608 |
-
<<?php echo $flipbox['front_title_html_tag']; ?> <?php echo $this->get_render_attribute_string( $flipbox['_id'].'-front-icon-title' ); ?> >
|
1609 |
-
<?php echo $flipbox['front_title']; ?>
|
1610 |
-
</<?php echo $flipbox['front_title_html_tag']; ?>>
|
1611 |
-
<?php } ?>
|
1612 |
-
|
1613 |
-
<?php if(!empty($flipbox['front_text'])){ ?>
|
1614 |
-
<p>
|
1615 |
-
<?php echo $flipbox['front_text']; ?>
|
1616 |
-
</p>
|
1617 |
-
<?php } ?>
|
1618 |
-
</div>
|
1619 |
-
</div>
|
1620 |
-
|
1621 |
-
<div class="eae-flip-box-back">
|
1622 |
-
<div class="flipbox-content">
|
1623 |
-
<?php if($flipbox['back_box_element'] == "icon") {?>
|
1624 |
-
<?php if(!empty($flipbox['back_icon'])){ ?>
|
1625 |
-
<div <?php echo $this->get_render_attribute_string( $flipbox['_id'].'-back-icon-wrapper' ); ?>>
|
1626 |
-
<i <?php echo $this->get_render_attribute_string( $flipbox['_id'].'-back-icon' ); ?>></i>
|
1627 |
-
</div>
|
1628 |
-
<?php } }?>
|
1629 |
-
<?php if($flipbox['back_box_element'] == "image"){
|
1630 |
-
if($flipbox['back_box_image']['url'] !="")
|
1631 |
-
{
|
1632 |
-
//echo "<img src='".$flipbox['back_box_image']['url']."'>";
|
1633 |
-
$back_pix = wp_get_attachment_image_src($flipbox['back_box_image']['id'],$flipbox['back_image_size_size']);
|
1634 |
-
echo "<img src='".$back_pix[0]."'>";
|
1635 |
-
}
|
1636 |
-
}?>
|
1637 |
-
<?php if(!empty($flipbox['back_title'])){ ?>
|
1638 |
-
<<?php echo $flipbox['back_title_html_tag']; ?> <?php echo $this->get_render_attribute_string( 'back-icon-title' ); ?> >
|
1639 |
-
<?php echo $flipbox['back_title']; ?>
|
1640 |
-
</<?php echo $flipbox['back_title_html_tag']; ?>>
|
1641 |
-
<?php } ?>
|
1642 |
-
|
1643 |
-
<?php if(!empty($flipbox['back_text'])){ ?>
|
1644 |
-
<p>
|
1645 |
-
<?php echo $flipbox['back_text']; ?>
|
1646 |
-
</p>
|
1647 |
-
<?php } ?>
|
1648 |
-
|
1649 |
-
<?php if(!empty($flipbox['action_text'])){ ?>
|
1650 |
-
<div class="eae-fb-button-wrapper">
|
1651 |
-
<a <?php echo $this->get_render_attribute_string( $flipbox['_id'].'-button' ); ?>>
|
1652 |
-
<span class="elementor-button-text"><?php echo $flipbox['action_text']; ?></span>
|
1653 |
-
</a>
|
1654 |
-
</div>
|
1655 |
-
<?php } ?>
|
1656 |
-
</div>
|
1657 |
-
</div>
|
1658 |
-
|
1659 |
-
</div>
|
1660 |
-
</div>
|
1661 |
-
|
1662 |
-
<?php
|
1663 |
-
}
|
1664 |
-
?>
|
1665 |
-
</div>
|
1666 |
-
<?php }
|
1667 |
-
|
1668 |
-
}
|
1669 |
-
|
1670 |
-
protected function _content_template() {
|
1671 |
-
?>
|
1672 |
-
<div class="eae-flip-box">
|
1673 |
-
<#
|
1674 |
-
|
1675 |
-
if(settings.eae_flip_box_set.length){
|
1676 |
-
settings.eae_flip_box_set.forEach(flipbox);
|
1677 |
-
|
1678 |
-
function flipbox(item, index){
|
1679 |
-
if(item.front_box_element == "icon") {
|
1680 |
-
if(item.style_indv == "yes") {
|
1681 |
-
view.addRenderAttribute( item._id + '-front-icon-wrapper', 'class', 'icon-wrapper' );
|
1682 |
-
view.addRenderAttribute( item._id + '-front-icon-wrapper', 'class', 'eae-fb-icon-view-' + item.front_icon_view );
|
1683 |
-
view.addRenderAttribute( item._id + '-front-icon-wrapper', 'class', 'eae-fb-icon-shape-' + item.front_icon_shape );
|
1684 |
-
}
|
1685 |
-
else
|
1686 |
-
{
|
1687 |
-
view.addRenderAttribute( item._id + '-front-icon-wrapper', 'class', 'icon-wrapper' );
|
1688 |
-
view.addRenderAttribute( item._id + '-front-icon-wrapper', 'class', 'eae-fb-icon-view-' + item.front_icon_view_global );
|
1689 |
-
view.addRenderAttribute( item._id + '-front-icon-wrapper', 'class', 'eae-fb-icon-shape-' + item.front_icon_shape_global );
|
1690 |
-
}
|
1691 |
-
view.addRenderAttribute( item._id + '-front-icon-title', 'class', 'front-icon-title' );
|
1692 |
-
view.addRenderAttribute( item._id + '-front-icon', 'class', item.front_icon );
|
1693 |
-
}
|
1694 |
-
if(item.back_box_element == "icon") {
|
1695 |
-
if(item.style_indv == "yes") {
|
1696 |
-
view.addRenderAttribute(item._id + '-back-icon-wrapper', 'class', 'icon-wrapper');
|
1697 |
-
view.addRenderAttribute(item._id + '-back-icon-wrapper', 'class', 'eae-fb-icon-view-' + item.back_icon_view);
|
1698 |
-
view.addRenderAttribute(item._id + '-back-icon-wrapper', 'class', 'eae-fb-icon-shape-' + item.back_icon_shape);
|
1699 |
-
}
|
1700 |
-
else
|
1701 |
-
{
|
1702 |
-
view.addRenderAttribute( item._id + '-back-icon-wrapper', 'class', 'icon-wrapper' );
|
1703 |
-
view.addRenderAttribute( item._id + '-back-icon-wrapper', 'class', 'eae-fb-icon-view-' + item.back_icon_view_global );
|
1704 |
-
view.addRenderAttribute( item._id + '-back-icon-wrapper', 'class', 'eae-fb-icon-shape-' + item.back_icon_shape_global );
|
1705 |
-
}
|
1706 |
-
view.addRenderAttribute( item._id + '-back-icon-title', 'class', 'back-icon-title' );
|
1707 |
-
view.addRenderAttribute( item._id + '-back-icon', 'class', item.back_icon );
|
1708 |
-
}
|
1709 |
-
|
1710 |
-
view.addRenderAttribute( item._id + '-button', 'class', 'eae-fb-button' );
|
1711 |
-
if ( item.link.url !== "" ) {
|
1712 |
-
view.addRenderAttribute( item._id + '-button', 'href', item.link.url);
|
1713 |
-
|
1714 |
-
if ( item.link.is_external !== "" ) {
|
1715 |
-
view.addRenderAttribute( item._id + '-button', 'target', '_blank' );
|
1716 |
-
}
|
1717 |
-
}
|
1718 |
-
|
1719 |
-
#>
|
1720 |
-
|
1721 |
-
<div class="elementor-repeater-item-{{{ item._id }}} overwrite-style-{{{ item.style_indv }}} eae-flip-box-wrapper ">
|
1722 |
-
<div class="eae-flip-box-inner" >
|
1723 |
-
|
1724 |
-
<div class="eae-flip-box-front">
|
1725 |
-
<div class="flipbox-content">
|
1726 |
-
|
1727 |
-
<# if(item.front_box_element == "icon") {
|
1728 |
-
if(item.front_icon !== ""){ #>
|
1729 |
-
<div {{{ view.getRenderAttributeString( item._id + '-front-icon-wrapper' ) }}}>
|
1730 |
-
<i {{{ view.getRenderAttributeString( item._id + '-front-icon' ) }}}></i>
|
1731 |
-
</div>
|
1732 |
-
<# } } #>
|
1733 |
-
<# if(item.front_box_element == "image"){
|
1734 |
-
if(item.front_box_image.url !="")
|
1735 |
-
{ #>
|
1736 |
-
<img src='{{{ item.front_box_image.url }}}'>
|
1737 |
-
<# }
|
1738 |
-
}#>
|
1739 |
-
|
1740 |
-
<# if(item.front_title !== "" ){ #>
|
1741 |
-
<{{{ item.front_title_html_tag }}} {{{ view.getRenderAttributeString( item._id + '-front-icon-title' ) }}} >
|
1742 |
-
{{{ item.front_title }}}
|
1743 |
-
</{{{ item.front_title_html_tag }}}>
|
1744 |
-
<# } #>
|
1745 |
-
|
1746 |
-
<# if(item.front_text !== ""){ #>
|
1747 |
-
<p>
|
1748 |
-
{{{ item.front_text }}}
|
1749 |
-
</p>
|
1750 |
-
<# } #>
|
1751 |
-
|
1752 |
-
|
1753 |
-
</div>
|
1754 |
-
</div>
|
1755 |
-
|
1756 |
-
<div class="eae-flip-box-back">
|
1757 |
-
<div class="flipbox-content">
|
1758 |
-
<# if(item.back_box_element == "icon") { #>
|
1759 |
-
<# if(item.back_icon !== "" ){ #>
|
1760 |
-
<div {{{ view.getRenderAttributeString( item._id + '-back-icon-wrapper' ) }}}>
|
1761 |
-
<i {{{ view.getRenderAttributeString( item._id + '-back-icon' ) }}}></i>
|
1762 |
-
</div>
|
1763 |
-
<# } } #>
|
1764 |
-
<# if(item.back_box_element == "image"){
|
1765 |
-
if(item.back_box_image.url !="")
|
1766 |
-
{ #>
|
1767 |
-
<img src='{{{ item.back_box_image.url }}}'>
|
1768 |
-
<# }
|
1769 |
-
} #>
|
1770 |
-
<# if(item.back_title !== "" ){ #>
|
1771 |
-
<{{{ item.back_title_html_tag }}} {{{ view.getRenderAttributeString( 'back-icon-title' ) }}} >
|
1772 |
-
{{{ item.back_title }}}
|
1773 |
-
</{{{ item.back_title_html_tag }}}>
|
1774 |
-
<# } #>
|
1775 |
-
|
1776 |
-
<# if(item.back_text !== ""){ #>
|
1777 |
-
<p>
|
1778 |
-
{{{ item.back_text }}}
|
1779 |
-
</p>
|
1780 |
-
<# } #>
|
1781 |
-
|
1782 |
-
<# if(item.action_text !== ""){ #>
|
1783 |
-
<div class="eae-fb-button-wrapper">
|
1784 |
-
<a {{{ view.getRenderAttributeString( item._id + '-button' ) }}}>
|
1785 |
-
<span class="elementor-button-text">{{{ item.action_text }}}</span>
|
1786 |
-
</a>
|
1787 |
-
</div>
|
1788 |
-
<# } #>
|
1789 |
-
</div>
|
1790 |
-
</div>
|
1791 |
-
</div>
|
1792 |
-
</div>
|
1793 |
-
|
1794 |
-
|
1795 |
-
<# } } #>
|
1796 |
-
</div>
|
1797 |
-
<?php
|
1798 |
-
}
|
1799 |
-
}
|
1800 |
Plugin::instance()->widgets_manager->register_widget_type( new Widget_FlipBoxSet() );
|
1 |
+
<?php
|
2 |
+
namespace Elementor;
|
3 |
+
|
4 |
+
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
5 |
+
|
6 |
+
class Widget_FlipBoxSet extends Widget_Base {
|
7 |
+
|
8 |
+
public function get_name() {
|
9 |
+
return 'wts-flipboxset';
|
10 |
+
}
|
11 |
+
|
12 |
+
public function get_title() {
|
13 |
+
return __( 'EAE - Flip Box Set', 'elementor' );
|
14 |
+
}
|
15 |
+
|
16 |
+
public function get_icon() {
|
17 |
+
return 'eicon-flip-box wts-eae-pe';
|
18 |
+
}
|
19 |
+
|
20 |
+
public function get_categories() {
|
21 |
+
return [ 'wts-eae' ];
|
22 |
+
}
|
23 |
+
|
24 |
+
protected function _register_controls() {
|
25 |
+
|
26 |
+
$this->start_controls_section(
|
27 |
+
'section_general',
|
28 |
+
[
|
29 |
+
'label' => __( 'General', 'elementor' )
|
30 |
+
]
|
31 |
+
);
|
32 |
+
|
33 |
+
$this->add_responsive_control(
|
34 |
+
'flip_box_count_row',
|
35 |
+
[
|
36 |
+
'label' => __( 'Column', 'elementor' ),
|
37 |
+
'type' => Controls_Manager::NUMBER,
|
38 |
+
'desktop_default' => '3',
|
39 |
+
'tablet_default' => '2',
|
40 |
+
'mobile_default' => '1',
|
41 |
+
'min' => 1,
|
42 |
+
'max' => 6,
|
43 |
+
'selectors' => [
|
44 |
+
'{{WRAPPER}} .eae-flip-box-wrapper' => 'width: calc(100%/{{VALUE}} - 1%) ',
|
45 |
+
]
|
46 |
+
]
|
47 |
+
);
|
48 |
+
$repeater = new Repeater();
|
49 |
+
|
50 |
+
$repeater->add_control(
|
51 |
+
'front_box_heading',
|
52 |
+
[
|
53 |
+
'label' => __('Front Box', 'elementor'),
|
54 |
+
'type' => Controls_Manager::HEADING,
|
55 |
+
]
|
56 |
+
);
|
57 |
+
|
58 |
+
$repeater -> start_controls_tabs( 'front_box' );
|
59 |
+
|
60 |
+
$repeater -> start_controls_tab(
|
61 |
+
'front_box_content',
|
62 |
+
[
|
63 |
+
'label' => __( 'Content', 'elementor' ),
|
64 |
+
]
|
65 |
+
);
|
66 |
+
|
67 |
+
$repeater->add_control(
|
68 |
+
'front_box_element',
|
69 |
+
[
|
70 |
+
'label' => __( 'Box Element', 'elementor' ),
|
71 |
+
'type' => Controls_Manager::CHOOSE,
|
72 |
+
'options' => [
|
73 |
+
'none' => [
|
74 |
+
'title' => __( 'None', 'elementor' ),
|
75 |
+
'icon' => 'fa fa-ban',
|
76 |
+
],
|
77 |
+
'image' => [
|
78 |
+
'title' => __( 'Image', 'elementor' ),
|
79 |
+
'icon' => 'fa fa-picture-o',
|
80 |
+
],
|
81 |
+
'icon' => [
|
82 |
+
'title' => __( 'Icon', 'elementor' ),
|
83 |
+
'icon' => 'fa fa-star',
|
84 |
+
|
85 |
+
],
|
86 |
+
],
|
87 |
+
'default' => 'icon',
|
88 |
+
]
|
89 |
+
);
|
90 |
+
|
91 |
+
$repeater->add_control('front_box_image',
|
92 |
+
[
|
93 |
+
'label' => __( 'Choose Image', 'elementor' ),
|
94 |
+
'type' => Controls_Manager::MEDIA,
|
95 |
+
'default' => [
|
96 |
+
'url' => Utils::get_placeholder_image_src(),
|
97 |
+
],
|
98 |
+
'condition' => [
|
99 |
+
'front_box_element' => 'image',
|
100 |
+
],
|
101 |
+
'show_label'=> true,
|
102 |
+
]
|
103 |
+
);
|
104 |
+
|
105 |
+
$repeater->add_group_control(
|
106 |
+
Group_Control_Image_Size::get_type(),
|
107 |
+
[
|
108 |
+
'name' => 'front_image_size', // Actually its `image_size`
|
109 |
+
'default' => 'thumbnail',
|
110 |
+
'condition' => [
|
111 |
+
'front_box_element' => 'image',
|
112 |
+
'front_box_image[id]!' => '',
|
113 |
+
],
|
114 |
+
]
|
115 |
+
);
|
116 |
+
$repeater->add_control(
|
117 |
+
'front_image_width',
|
118 |
+
[
|
119 |
+
'label' => __( 'Image Width', 'elementor' ),
|
120 |
+
'type' => Controls_Manager::SLIDER,
|
121 |
+
'range' => [
|
122 |
+
'px' => [
|
123 |
+
'min' => 6,
|
124 |
+
'max' => 300,
|
125 |
+
],
|
126 |
+
],
|
127 |
+
'default' => [
|
128 |
+
'size' => 100,
|
129 |
+
],
|
130 |
+
'selectors' => [
|
131 |
+
'{{WRAPPER}} {{CURRENT_ITEM}} .eae-flip-box-front img' => 'max-width: {{SIZE}}{{UNIT}};',
|
132 |
+
],
|
133 |
+
'condition' => [
|
134 |
+
'front_box_element' => 'image',
|
135 |
+
'front_box_image[id]!' => '',
|
136 |
+
],
|
137 |
+
]
|
138 |
+
);
|
139 |
+
|
140 |
+
$repeater->add_control(
|
141 |
+
'front_icon',
|
142 |
+
[
|
143 |
+
'label' => __( 'Icon', 'elementor' ),
|
144 |
+
'type' => Controls_Manager::ICON,
|
145 |
+
'label_block' => true,
|
146 |
+
'default' => 'fa fa-star',
|
147 |
+
'condition' => [
|
148 |
+
'front_box_element' => 'icon',
|
149 |
+
],
|
150 |
+
]
|
151 |
+
);
|
152 |
+
|
153 |
+
$repeater->add_control(
|
154 |
+
'front_title',
|
155 |
+
[
|
156 |
+
'label' => __( 'Title', 'elementor' ),
|
157 |
+
'type' => Controls_Manager::TEXT,
|
158 |
+
'placeholder' => __( 'Enter text', 'elementor' ),
|
159 |
+
'default' => __( 'Text Title', 'elementor' ),
|
160 |
+
]
|
161 |
+
);
|
162 |
+
|
163 |
+
$repeater->add_control(
|
164 |
+
'front_title_html_tag',
|
165 |
+
[
|
166 |
+
'label' => __( 'HTML Tag', 'elementor' ),
|
167 |
+
'type' => Controls_Manager::SELECT,
|
168 |
+
'options' => [
|
169 |
+
'h1' => __( 'H1', 'elementor' ),
|
170 |
+
'h2' => __( 'H2', 'elementor' ),
|
171 |
+
'h3' => __( 'H3', 'elementor' ),
|
172 |
+
'h4' => __( 'H4', 'elementor' ),
|
173 |
+
'h5' => __( 'H5', 'elementor' ),
|
174 |
+
'h6' => __( 'H6', 'elementor' )
|
175 |
+
],
|
176 |
+
'default' => 'h3',
|
177 |
+
]
|
178 |
+
);
|
179 |
+
|
180 |
+
$repeater->add_control(
|
181 |
+
'front_text',
|
182 |
+
[
|
183 |
+
'label' => __( 'Text', 'elementor' ),
|
184 |
+
'type' => Controls_Manager::TEXTAREA,
|
185 |
+
'placeholder' => __( 'Enter text', 'elementor' ),
|
186 |
+
'default' => __( 'Add some nice text here.', 'elementor' ),
|
187 |
+
]
|
188 |
+
);
|
189 |
+
$repeater -> end_controls_tab();
|
190 |
+
|
191 |
+
$repeater -> start_controls_tab(
|
192 |
+
'front_box_background_ind_head',
|
193 |
+
[
|
194 |
+
'label' => __( 'Style', 'elementor' ),
|
195 |
+
]
|
196 |
+
);
|
197 |
+
|
198 |
+
$repeater->add_control(
|
199 |
+
'style_indv',
|
200 |
+
[
|
201 |
+
'label' => __( 'Overwrite Global Style', 'elementor' ),
|
202 |
+
'type' => Controls_Manager::SWITCHER,
|
203 |
+
'options' => [
|
204 |
+
'yes' => __( 'Yes', 'elementor' ),
|
205 |
+
'no' => __( 'No', 'elementor' ),
|
206 |
+
],
|
207 |
+
'default' => 'no',
|
208 |
+
|
209 |
+
]
|
210 |
+
);
|
211 |
+
|
212 |
+
$repeater->add_control(
|
213 |
+
'front_icon_view',
|
214 |
+
[
|
215 |
+
'label' => __( 'View', 'elementor' ),
|
216 |
+
'type' => Controls_Manager::SELECT,
|
217 |
+
'options' => [
|
218 |
+
'default' => __( 'Default', 'elementor' ),
|
219 |
+
'stacked' => __( 'Stacked', 'elementor' ),
|
220 |
+
'framed' => __( 'Framed', 'elementor' ),
|
221 |
+
],
|
222 |
+
'default' => 'default',
|
223 |
+
'condition' => [
|
224 |
+
'front_box_element' => 'icon',
|
225 |
+
'style_indv' => 'yes',
|
226 |
+
],
|
227 |
+
|
228 |
+
]
|
229 |
+
);
|
230 |
+
|
231 |
+
$repeater->add_control(
|
232 |
+
'front_icon_shape',
|
233 |
+
[
|
234 |
+
'label' => __( 'Shape', 'elementor' ),
|
235 |
+
'type' => Controls_Manager::SELECT,
|
236 |
+
'options' => [
|
237 |
+
'circle' => __( 'Circle', 'elementor' ),
|
238 |
+
'square' => __( 'Square', 'elementor' ),
|
239 |
+
],
|
240 |
+
'default' => 'circle',
|
241 |
+
'condition' => [
|
242 |
+
'front_box_element' => 'icon',
|
243 |
+
'front_icon_view!' => 'default',
|
244 |
+
'style_indv' => 'yes',
|
245 |
+
],
|
246 |
+
]
|
247 |
+
);
|
248 |
+
|
249 |
+
|
250 |
+
$repeater->add_group_control(
|
251 |
+
Group_Control_Background::get_type(),
|
252 |
+
[
|
253 |
+
'name' => 'front_box_background_ind',
|
254 |
+
'types' => [ 'classic', 'gradient'],
|
255 |
+
'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-front',
|
256 |
+
'condition' => [
|
257 |
+
'style_indv' => 'yes',
|
258 |
+
],
|
259 |
+
]
|
260 |
+
);
|
261 |
+
$repeater->add_control(
|
262 |
+
'front_box_background_overlay_ind',
|
263 |
+
[
|
264 |
+
'label' => __( 'Background Overlay', 'elementor-pro' ),
|
265 |
+
'type' => Controls_Manager::COLOR,
|
266 |
+
'default' => '',
|
267 |
+
'separator' => 'before',
|
268 |
+
'condition' => [
|
269 |
+
'front_box_background_ind_image[id]!' => '',
|
270 |
+
'style_indv' => 'yes',
|
271 |
+
],
|
272 |
+
]
|
273 |
+
);
|
274 |
+
$repeater->add_control(
|
275 |
+
'front_box_title_color_indv',
|
276 |
+
[
|
277 |
+
'label' => __( 'Title', 'elementor' ),
|
278 |
+
'type' => Controls_Manager::COLOR,
|
279 |
+
'scheme' => [
|
280 |
+
'type' => Scheme_Color::get_type(),
|
281 |
+
'value' => Scheme_Color::COLOR_1,
|
282 |
+
],
|
283 |
+
'default' => '#FFF',
|
284 |
+
'selectors' => [
|
285 |
+
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .front-icon-title ' => 'color: {{VALUE}};',
|
286 |
+
],
|
287 |
+
'condition' => [
|
288 |
+
'style_indv' => 'yes',
|
289 |
+
],
|
290 |
+
]
|
291 |
+
);
|
292 |
+
|
293 |
+
$repeater->add_group_control(
|
294 |
+
Group_Control_Typography::get_type(),
|
295 |
+
[
|
296 |
+
'name' => 'front_box_title_typography_indv',
|
297 |
+
'label' => __( 'Title Typography', 'elementor' ),
|
298 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
299 |
+
'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .front-icon-title',
|
300 |
+
'condition' => [
|
301 |
+
'style_indv' => 'yes',
|
302 |
+
],
|
303 |
+
]
|
304 |
+
);
|
305 |
+
|
306 |
+
$repeater->add_control(
|
307 |
+
'front_box_text_color_indv',
|
308 |
+
[
|
309 |
+
'label' => __( 'Description Color', 'elementor' ),
|
310 |
+
'type' => Controls_Manager::COLOR,
|
311 |
+
'scheme' => [
|
312 |
+
'type' => Scheme_Color::get_type(),
|
313 |
+
'value' => Scheme_Color::COLOR_1,
|
314 |
+
],
|
315 |
+
'default' => '#FFF',
|
316 |
+
'selectors' => [
|
317 |
+
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-front p' => 'color: {{VALUE}};',
|
318 |
+
],
|
319 |
+
'condition' => [
|
320 |
+
'style_indv' => 'yes',
|
321 |
+
],
|
322 |
+
|
323 |
+
]
|
324 |
+
);
|
325 |
+
|
326 |
+
$repeater->add_group_control(
|
327 |
+
Group_Control_Typography::get_type(),
|
328 |
+
[
|
329 |
+
'name' => 'front_box_text_typography_indv',
|
330 |
+
'label' => __( 'Description Typography', 'elementor' ),
|
331 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
332 |
+
'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-front p',
|
333 |
+
'condition' => [
|
334 |
+
'style_indv' => 'yes',
|
335 |
+
],
|
336 |
+
]
|
337 |
+
);
|
338 |
+
|
339 |
+
|
340 |
+
/**
|
341 |
+
* Front Box icons styles
|
342 |
+
**/
|
343 |
+
$repeater->add_control(
|
344 |
+
'front_box_icon_color_indv',
|
345 |
+
[
|
346 |
+
'label' => __( 'Icon Color', 'elementor' ),
|
347 |
+
'type' => Controls_Manager::COLOR,
|
348 |
+
'scheme' => [
|
349 |
+
'type' => Scheme_Color::get_type(),
|
350 |
+
'value' => Scheme_Color::COLOR_1,
|
351 |
+
],
|
352 |
+
'default' => '#FFF',
|
353 |
+
'selectors' => [
|
354 |
+
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-front .icon-wrapper i' => 'color: {{VALUE}};',
|
355 |
+
],
|
356 |
+
'condition' => [
|
357 |
+
'style_indv' => 'yes',
|
358 |
+
],
|
359 |
+
]
|
360 |
+
);
|
361 |
+
|
362 |
+
$repeater->add_control(
|
363 |
+
'front_box_icon_fill_color_indv',
|
364 |
+
[
|
365 |
+
'label' => __( 'Icon Fill Color', 'elementor' ),
|
366 |
+
'type' => Controls_Manager::COLOR,
|
367 |
+
'scheme' => [
|
368 |
+
'type' => Scheme_Color::get_type(),
|
369 |
+
'value' => Scheme_Color::COLOR_1,
|
370 |
+
],
|
371 |
+
'selectors' => [
|
372 |
+
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-fb-icon-view-stacked' => 'background-color: {{VALUE}};',
|
373 |
+
],
|
374 |
+
'condition' => [
|
375 |
+
'front_icon_view' => 'stacked',
|
376 |
+
'style_indv' => 'yes',
|
377 |
+
],
|
378 |
+
]
|
379 |
+
);
|
380 |
+
|
381 |
+
$repeater->add_group_control(
|
382 |
+
Group_Control_Border::get_type(),
|
383 |
+
[
|
384 |
+
'name' => 'front_box_icon_border_indv',
|
385 |
+
'label' => __( 'Box Border', 'elementor' ),
|
386 |
+
'placeholder' => '1px',
|
387 |
+
'default' => '1px',
|
388 |
+
'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-front .eae-fb-icon-view-framed, {{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-front .eae-fb-icon-view-stacked',
|
389 |
+
'label_block' => true,
|
390 |
+
'condition' => [
|
391 |
+
'front_icon_view!' => 'default',
|
392 |
+
'style_indv' => 'yes',
|
393 |
+
],
|
394 |
+
]
|
395 |
+
);
|
396 |
+
|
397 |
+
$repeater->add_control(
|
398 |
+
'front_icon_size_indv',
|
399 |
+
[
|
400 |
+
'label' => __( 'Icon Size', 'elementor' ),
|
401 |
+
'type' => Controls_Manager::SLIDER,
|
402 |
+
'range' => [
|
403 |
+
'px' => [
|
404 |
+
'min' => 6,
|
405 |
+
'max' => 300,
|
406 |
+
],
|
407 |
+
],
|
408 |
+
'selectors' => [
|
409 |
+
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-front .icon-wrapper i' => 'font-size: {{SIZE}}{{UNIT}};',
|
410 |
+
],
|
411 |
+
'condition' => [
|
412 |
+
'style_indv' => 'yes',
|
413 |
+
],
|
414 |
+
]
|
415 |
+
);
|
416 |
+
|
417 |
+
$repeater->add_control(
|
418 |
+
'front_icon_padding_indv',
|
419 |
+
[
|
420 |
+
'label' => __( 'Icon Padding', 'elementor' ),
|
421 |
+
'type' => Controls_Manager::SLIDER,
|
422 |
+
'selectors' => [
|
423 |
+
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-front .icon-wrapper' => 'padding: {{SIZE}}{{UNIT}};',
|
424 |
+
],
|
425 |
+
'default' => [
|
426 |
+
'size' => 1.5,
|
427 |
+
'unit' => 'em',
|
428 |
+
],
|
429 |
+
'range' => [
|
430 |
+
'em' => [
|
431 |
+
'min' => 0,
|
432 |
+
],
|
433 |
+
],
|
434 |
+
'condition' => [
|
435 |
+
'front_icon_view!' => 'default',
|
436 |
+
'style_indv' => 'yes',
|
437 |
+
],
|
438 |
+
]
|
439 |
+
);
|
440 |
+
|
441 |
+
$repeater->end_controls_tab();
|
442 |
+
|
443 |
+
$repeater->end_controls_tabs();
|
444 |
+
|
445 |
+
$repeater->add_control(
|
446 |
+
'back_box_heading',
|
447 |
+
[
|
448 |
+
'label' => __('Back Box', 'elementor'),
|
449 |
+
'type' => Controls_Manager::HEADING,
|
450 |
+
]
|
451 |
+
);
|
452 |
+
|
453 |
+
$repeater->start_controls_tabs( 'back_box_a' );
|
454 |
+
|
455 |
+
$repeater->start_controls_tab(
|
456 |
+
'back_box_content',
|
457 |
+
[
|
458 |
+
'label' => __( 'Content', 'elementor' ),
|
459 |
+
]
|
460 |
+
);
|
461 |
+
|
462 |
+
|
463 |
+
|
464 |
+
$repeater->add_control(
|
465 |
+
'back_box_element',
|
466 |
+
[
|
467 |
+
'label' => __( 'Box Element', 'elementor' ),
|
468 |
+
'type' => Controls_Manager::CHOOSE,
|
469 |
+
'options' => [
|
470 |
+
'none' => [
|
471 |
+
'title' => __( 'None', 'elementor' ),
|
472 |
+
'icon' => 'fa fa-ban',
|
473 |
+
],
|
474 |
+
'image'=> [
|
475 |
+
'title' => __( 'Image', 'elementor' ),
|
476 |
+
'icon' => 'fa fa-picture-o',
|
477 |
+
],
|
478 |
+
'icon' => [
|
479 |
+
'title' => __( 'Icon', 'elementor' ),
|
480 |
+
'icon' => 'fa fa-star',
|
481 |
+
|
482 |
+
],
|
483 |
+
],
|
484 |
+
'default' => 'icon',
|
485 |
+
]
|
486 |
+
);
|
487 |
+
|
488 |
+
$repeater->add_control('back_box_image',
|
489 |
+
[
|
490 |
+
'label' => __( 'Choose Image', 'elementor' ),
|
491 |
+
'type' => Controls_Manager::MEDIA,
|
492 |
+
'default' => [
|
493 |
+
'url' => Utils::get_placeholder_image_src(),
|
494 |
+
],
|
495 |
+
'condition' => [
|
496 |
+
'back_box_element' => 'image',
|
497 |
+
],
|
498 |
+
'show_label' => true,
|
499 |
+
]
|
500 |
+
);
|
501 |
+
|
502 |
+
$repeater->add_group_control(
|
503 |
+
Group_Control_Image_Size::get_type(),
|
504 |
+
[
|
505 |
+
'name' => 'back_image_size', // Actually its `image_size`
|
506 |
+
'default' => 'thumbnail',
|
507 |
+
'condition' => [
|
508 |
+
'back_box_element' => 'image',
|
509 |
+
'back_box_image[id]!' => '',
|
510 |
+
],
|
511 |
+
]
|
512 |
+
);
|
513 |
+
$repeater->add_control(
|
514 |
+
'back_image_width',
|
515 |
+
[
|
516 |
+
'label' => __( 'Image Width', 'elementor' ),
|
517 |
+
'type' => Controls_Manager::SLIDER,
|
518 |
+
'range' => [
|
519 |
+
'px' => [
|
520 |
+
'min' => 6,
|
521 |
+
'max' => 300,
|
522 |
+
],
|
523 |
+
],
|
524 |
+
'default' => [
|
525 |
+
'size' => 100,
|
526 |
+
],
|
527 |
+
'selectors' => [
|
528 |
+
'{{WRAPPER}} {{CURRENT_ITEM}} .eae-flip-box-back img' => 'max-width: {{SIZE}}{{UNIT}};',
|
529 |
+
],
|
530 |
+
'condition' => [
|
531 |
+
'back_box_element' => 'image',
|
532 |
+
'back_box_image[id]!' => '',
|
533 |
+
],
|
534 |
+
]
|
535 |
+
);
|
536 |
+
|
537 |
+
$repeater->add_control(
|
538 |
+
'back_icon',
|
539 |
+
[
|
540 |
+
'label' => __( 'Icon', 'elementor' ),
|
541 |
+
'type' => Controls_Manager::ICON,
|
542 |
+
'label_block' => true,
|
543 |
+
'default' => 'fa fa-star',
|
544 |
+
'condition' => [
|
545 |
+
'back_box_element' => 'icon',
|
546 |
+
],
|
547 |
+
]
|
548 |
+
);
|
549 |
+
|
550 |
+
|
551 |
+
$repeater->add_control(
|
552 |
+
'back_title',
|
553 |
+
[
|
554 |
+
'label' => __( 'Title', 'elementor' ),
|
555 |
+
'type' => Controls_Manager::TEXT,
|
556 |
+
'placeholder' => __( 'Enter text', 'elementor' ),
|
557 |
+
'default' => __( 'Text Title', 'elementor' ),
|
558 |
+
]
|
559 |
+
);
|
560 |
+
|
561 |
+
$repeater->add_control(
|
562 |
+
'back_title_html_tag',
|
563 |
+
[
|
564 |
+
'label' => __( 'HTML Tag', 'elementor' ),
|
565 |
+
'type' => Controls_Manager::SELECT,
|
566 |
+
'options' => [
|
567 |
+
'h1' => __( 'H1', 'elementor' ),
|
568 |
+
'h2' => __( 'H2', 'elementor' ),
|
569 |
+
'h3' => __( 'H3', 'elementor' ),
|
570 |
+
'h4' => __( 'H4', 'elementor' ),
|
571 |
+
'h5' => __( 'H5', 'elementor' ),
|
572 |
+
'h6' => __( 'H6', 'elementor' )
|
573 |
+
],
|
574 |
+
'default' => 'h3',
|
575 |
+
]
|
576 |
+
);
|
577 |
+
|
578 |
+
$repeater->add_control(
|
579 |
+
'back_text',
|
580 |
+
[
|
581 |
+
'label' => __( 'Text', 'elementor' ),
|
582 |
+
'type' => Controls_Manager::TEXTAREA,
|
583 |
+
'placeholder' => __( 'Enter text', 'elementor' ),
|
584 |
+
'default' => __( 'Add some nice text here.', 'elementor' ),
|
585 |
+
]
|
586 |
+
);
|
587 |
+
$repeater -> end_controls_tab();
|
588 |
+
|
589 |
+
$repeater -> start_controls_tab(
|
590 |
+
'back_box_background_head',
|
591 |
+
[
|
592 |
+
'label' => __( 'Style', 'elementor' ),
|
593 |
+
]
|
594 |
+
);
|
595 |
+
|
596 |
+
$repeater->add_control(
|
597 |
+
'back_icon_view',
|
598 |
+
[
|
599 |
+
'label' => __( 'View', 'elementor' ),
|
600 |
+
'type' => Controls_Manager::SELECT,
|
601 |
+
'options' => [
|
602 |
+
'default' => __( 'Default', 'elementor' ),
|
603 |
+
'stacked' => __( 'Stacked', 'elementor' ),
|
604 |
+
'framed' => __( 'Framed', 'elementor' ),
|
605 |
+
],
|
606 |
+
'default' => 'default',
|
607 |
+
'condition' => [
|
608 |
+
'back_box_element' => 'icon',
|
609 |
+
],
|
610 |
+
|
611 |
+
]
|
612 |
+
);
|
613 |
+
|
614 |
+
$repeater->add_control(
|
615 |
+
'back_icon_shape',
|
616 |
+
[
|
617 |
+
'label' => __( 'Shape', 'elementor' ),
|
618 |
+
'type' => Controls_Manager::SELECT,
|
619 |
+
'options' => [
|
620 |
+
'circle' => __( 'Circle', 'elementor' ),
|
621 |
+
'square' => __( 'Square', 'elementor' ),
|
622 |
+
],
|
623 |
+
'default' => 'circle',
|
624 |
+
'condition' => [
|
625 |
+
'back_box_element' => 'icon',
|
626 |
+
'back_icon_view!' => 'default',
|
627 |
+
],
|
628 |
+
]
|
629 |
+
);
|
630 |
+
|
631 |
+
$repeater->add_group_control(
|
632 |
+
Group_Control_Background::get_type(),
|
633 |
+
[
|
634 |
+
'name' => 'back_box_background_ind',
|
635 |
+
'types' => [ 'classic', 'gradient' ],
|
636 |
+
'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-back',
|
637 |
+
'condition' => [
|
638 |
+
'style_indv' => 'yes',
|
639 |
+
],
|
640 |
+
]
|
641 |
+
);
|
642 |
+
|
643 |
+
$repeater->add_control(
|
644 |
+
'back_box_background_overlay_ind',
|
645 |
+
[
|
646 |
+
'label' => __( 'Background Overlay', 'elementor' ),
|
647 |
+
'type' => Controls_Manager::COLOR,
|
648 |
+
'default' => '',
|
649 |
+
'separator' => 'before',
|
650 |
+
'condition' => [
|
651 |
+
'back_box_background_ind_image[id]!' => '',
|
652 |
+
'style_indv' => 'yes',
|
653 |
+
|
654 |
+
],
|
655 |
+
]
|
656 |
+
);
|
657 |
+
$repeater->add_control(
|
658 |
+
'back_box_title_color_indv',
|
659 |
+
[
|
660 |
+
'label' => __( 'Title', 'elementor' ),
|
661 |
+
'type' => Controls_Manager::COLOR,
|
662 |
+
'scheme' => [
|
663 |
+
'type' => Scheme_Color::get_type(),
|
664 |
+
'value' => Scheme_Color::COLOR_1,
|
665 |
+
],
|
666 |
+
'default' => '#FFF',
|
667 |
+
'selectors' => [
|
668 |
+
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .back-icon-title' => 'color: {{VALUE}};',
|
669 |
+
],
|
670 |
+
'condition' => [
|
671 |
+
'style_indv' => 'yes',
|
672 |
+
],
|
673 |
+
|
674 |
+
]
|
675 |
+
);
|
676 |
+
|
677 |
+
$repeater->add_group_control(
|
678 |
+
Group_Control_Typography::get_type(),
|
679 |
+
[
|
680 |
+
'name' => 'back_box_title_typography_indv',
|
681 |
+
'label' => __( 'Title Typography', 'elementor' ),
|
682 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
683 |
+
'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .back-icon-title',
|
684 |
+
'condition' => [
|
685 |
+
'style_indv' => 'yes',
|
686 |
+
],
|
687 |
+
]
|
688 |
+
);
|
689 |
+
|
690 |
+
$repeater->add_control(
|
691 |
+
'back_box_text_color_indv',
|
692 |
+
[
|
693 |
+
'label' => __( 'Description Color', 'elementor' ),
|
694 |
+
'type' => Controls_Manager::COLOR,
|
695 |
+
'scheme' => [
|
696 |
+
'type' => Scheme_Color::get_type(),
|
697 |
+
'value' => Scheme_Color::COLOR_1,
|
698 |
+
],
|
699 |
+
'default' => '#FFF',
|
700 |
+
'selectors' => [
|
701 |
+
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-back p' => 'color: {{VALUE}};',
|
702 |
+
],
|
703 |
+
'condition' => [
|
704 |
+
'style_indv' => 'yes',
|
705 |
+
],
|
706 |
+
|
707 |
+
]
|
708 |
+
);
|
709 |
+
|
710 |
+
$repeater->add_group_control(
|
711 |
+
Group_Control_Typography::get_type(),
|
712 |
+
[
|
713 |
+
'name' => 'back_box_text_typography_indv',
|
714 |
+
'label' => __( 'Description Typography', 'elementor' ),
|
715 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
716 |
+
'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-back p',
|
717 |
+
'condition' => [
|
718 |
+
'style_indv' => 'yes',
|
719 |
+
],
|
720 |
+
]
|
721 |
+
);
|
722 |
+
|
723 |
+
|
724 |
+
/**
|
725 |
+
* Back Box icons styles
|
726 |
+
**/
|
727 |
+
$repeater->add_control(
|
728 |
+
'back_box_icon_color_indv',
|
729 |
+
[
|
730 |
+
'label' => __( 'Icon Color', 'elementor' ),
|
731 |
+
'type' => Controls_Manager::COLOR,
|
732 |
+
'scheme' => [
|
733 |
+
'type' => Scheme_Color::get_type(),
|
734 |
+
'value' => Scheme_Color::COLOR_1,
|
735 |
+
],
|
736 |
+
'default' => '#FFF',
|
737 |
+
'selectors' => [
|
738 |
+
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-back .icon-wrapper i' => 'color: {{VALUE}};',
|
739 |
+
],
|
740 |
+
'condition' => [
|
741 |
+
'back_icon!' => '',
|
742 |
+
'style_indv' => 'yes',
|
743 |
+
],
|
744 |
+
]
|
745 |
+
);
|
746 |
+
|
747 |
+
$repeater->add_control(
|
748 |
+
'back_box_icon_fill_color_indv',
|
749 |
+
[
|
750 |
+
'label' => __( 'Icon Fill Color', 'elementor' ),
|
751 |
+
'type' => Controls_Manager::COLOR,
|
752 |
+
'scheme' => [
|
753 |
+
'type' => Scheme_Color::get_type(),
|
754 |
+
'value' => Scheme_Color::COLOR_1,
|
755 |
+
],
|
756 |
+
'selectors' => [
|
757 |
+
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-back .eae-fb-icon-view-stacked' => 'background-color: {{VALUE}};',
|
758 |
+
],
|
759 |
+
'condition' => [
|
760 |
+
'front_icon_view' => 'stacked',
|
761 |
+
'style_indv' => 'yes',
|
762 |
+
],
|
763 |
+
]
|
764 |
+
);
|
765 |
+
|
766 |
+
$repeater->add_group_control(
|
767 |
+
Group_Control_Border::get_type(),
|
768 |
+
[
|
769 |
+
'name' => 'back_box_icon_border_indv',
|
770 |
+
'label' => __( 'Box Border', 'elementor' ),
|
771 |
+
'placeholder' => '1px',
|
772 |
+
'default' => '1px',
|
773 |
+
'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-back .eae-fb-icon-view-framed, {{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-back .eae-fb-icon-view-stacked',
|
774 |
+
'label_block' => true,
|
775 |
+
'condition' => [
|
776 |
+
'back_icon_view!' => 'default',
|
777 |
+
'style_indv' => 'yes',
|
778 |
+
],
|
779 |
+
]
|
780 |
+
);
|
781 |
+
|
782 |
+
$repeater->add_control(
|
783 |
+
'back_icon_size_indv',
|
784 |
+
[
|
785 |
+
'label' => __( 'Icon Size', 'elementor' ),
|
786 |
+
'type' => Controls_Manager::SLIDER,
|
787 |
+
'range' => [
|
788 |
+
'px' => [
|
789 |
+
'min' => 6,
|
790 |
+
'max' => 300,
|
791 |
+
],
|
792 |
+
],
|
793 |
+
'selectors' => [
|
794 |
+
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-back .icon-wrapper i' => 'font-size: {{SIZE}}{{UNIT}};',
|
795 |
+
],
|
796 |
+
'condition' => [
|
797 |
+
'style_indv' => 'yes',
|
798 |
+
],
|
799 |
+
]
|
800 |
+
);
|
801 |
+
|
802 |
+
$repeater->add_control(
|
803 |
+
'back_icon_padding_indv',
|
804 |
+
[
|
805 |
+
'label' => __( 'Icon Padding', 'elementor' ),
|
806 |
+
'type' => Controls_Manager::SLIDER,
|
807 |
+
'selectors' => [
|
808 |
+
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-flip-box-back .icon-wrapper' => 'padding: {{SIZE}}{{UNIT}};',
|
809 |
+
],
|
810 |
+
'default' => [
|
811 |
+
'size' => 1.5,
|
812 |
+
'unit' => 'em',
|
813 |
+
],
|
814 |
+
'range' => [
|
815 |
+
'em' => [
|
816 |
+
'min' => 0,
|
817 |
+
],
|
818 |
+
],
|
819 |
+
'condition' => [
|
820 |
+
'back_icon_view!' => 'default',
|
821 |
+
'style_indv' => 'yes',
|
822 |
+
],
|
823 |
+
]
|
824 |
+
);
|
825 |
+
|
826 |
+
$repeater->end_controls_tab();
|
827 |
+
|
828 |
+
$repeater->end_controls_tabs();
|
829 |
+
|
830 |
+
$repeater->add_control(
|
831 |
+
'action_button',
|
832 |
+
[
|
833 |
+
'label' => __('Action Button', 'elementor'),
|
834 |
+
'type' => Controls_Manager::HEADING,
|
835 |
+
]
|
836 |
+
);
|
837 |
+
$repeater->start_controls_tabs( 'back_box_button_style' );
|
838 |
+
|
839 |
+
$repeater->start_controls_tab(
|
840 |
+
'action_button_content',
|
841 |
+
[
|
842 |
+
'label' => __( 'Content', 'elementor' ),
|
843 |
+
]
|
844 |
+
);
|
845 |
+
|
846 |
+
|
847 |
+
$repeater->add_control(
|
848 |
+
'action_text',
|
849 |
+
[
|
850 |
+
'label' => __( 'Button Text', 'elementor' ),
|
851 |
+
'type' => Controls_Manager::TEXT,
|
852 |
+
'placeholder' => __( 'Buy', 'elementor' ),
|
853 |
+
'default' => __( 'Buy Now', 'elementor' ),
|
854 |
+
]
|
855 |
+
);
|
856 |
+
|
857 |
+
$repeater->add_control(
|
858 |
+
'link',
|
859 |
+
[
|
860 |
+
'label' => __( 'Link to', 'elementor' ),
|
861 |
+
'type' => Controls_Manager::URL,
|
862 |
+
'placeholder' => __( 'http://your-link.com', 'elementor' ),
|
863 |
+
'separator' => 'before',
|
864 |
+
]
|
865 |
+
);
|
866 |
+
$repeater->end_controls_tab();
|
867 |
+
|
868 |
+
$repeater->start_controls_tab(
|
869 |
+
'action_button_Style_indv',
|
870 |
+
[
|
871 |
+
'label' => __( 'Style', 'elementor' ),
|
872 |
+
]
|
873 |
+
);
|
874 |
+
|
875 |
+
$repeater->add_control(
|
876 |
+
'button_text_color_indv',
|
877 |
+
[
|
878 |
+
'label' => __( 'Text Color', 'elementor' ),
|
879 |
+
'type' => Controls_Manager::COLOR,
|
880 |
+
'default' => '#fff',
|
881 |
+
'selectors' => [
|
882 |
+
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-fb-button' => 'color: {{VALUE}};',
|
883 |
+
],
|
884 |
+
'condition' => [
|
885 |
+
'style_indv' => 'yes',
|
886 |
+
],
|
887 |
+
]
|
888 |
+
);
|
889 |
+
|
890 |
+
$repeater->add_group_control(
|
891 |
+
Group_Control_Typography::get_type(),
|
892 |
+
[
|
893 |
+
'name' => 'typography_indv',
|
894 |
+
'label' => __( 'Typography', 'elementor' ),
|
895 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
896 |
+
'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-fb-button',
|
897 |
+
'condition' => [
|
898 |
+
'style_indv' => 'yes',
|
899 |
+
],
|
900 |
+
]
|
901 |
+
);
|
902 |
+
|
903 |
+
$repeater->add_control(
|
904 |
+
'background_color_indv',
|
905 |
+
[
|
906 |
+
'label' => __( 'Background Color', 'elementor' ),
|
907 |
+
'type' => Controls_Manager::COLOR,
|
908 |
+
'scheme' => [
|
909 |
+
'type' => Scheme_Color::get_type(),
|
910 |
+
'value' => Scheme_Color::COLOR_4,
|
911 |
+
],
|
912 |
+
'default' => '#93C64F',
|
913 |
+
'selectors' => [
|
914 |
+
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-fb-button' => 'background-color: {{VALUE}};',
|
915 |
+
],
|
916 |
+
'condition' => [
|
917 |
+
'style_indv'=> 'yes',
|
918 |
+
],
|
919 |
+
]
|
920 |
+
);
|
921 |
+
|
922 |
+
$repeater->add_group_control(
|
923 |
+
Group_Control_Border::get_type(),
|
924 |
+
[
|
925 |
+
'name' => 'border_indv',
|
926 |
+
'label' => __( 'Border', 'elementor' ),
|
927 |
+
'placeholder' => '1px',
|
928 |
+
'default' => '1px',
|
929 |
+
'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-fb-button',
|
930 |
+
'condition' => [
|
931 |
+
'style_indv' => 'yes',
|
932 |
+
],
|
933 |
+
]
|
934 |
+
);
|
935 |
+
|
936 |
+
$repeater->add_control(
|
937 |
+
'border_radius_indv',
|
938 |
+
[
|
939 |
+
'label' => __( 'Border Radius', 'elementor' ),
|
940 |
+
'type' => Controls_Manager::DIMENSIONS,
|
941 |
+
'size_units' => [ 'px', '%' ],
|
942 |
+
'selectors' => [
|
943 |
+
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-fb-button' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
944 |
+
],
|
945 |
+
'condition' => [
|
946 |
+
'style_indv' => 'yes',
|
947 |
+
],
|
948 |
+
]
|
949 |
+
);
|
950 |
+
|
951 |
+
$repeater->add_control(
|
952 |
+
'text_padding_indv',
|
953 |
+
[
|
954 |
+
'label' => __( 'Text Padding', 'elementor' ),
|
955 |
+
'type' => Controls_Manager::DIMENSIONS,
|
956 |
+
'size_units' => [ 'px', 'em', '%' ],
|
957 |
+
'selectors' => [
|
958 |
+
'{{WRAPPER}} {{CURRENT_ITEM}}.overwrite-style-yes .eae-fb-button' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
959 |
+
],
|
960 |
+
'condition' => [
|
961 |
+
'style_indv' => 'yes',
|
962 |
+
],
|
963 |
+
]
|
964 |
+
);
|
965 |
+
|
966 |
+
$repeater->end_controls_tab();
|
967 |
+
|
968 |
+
$repeater->end_controls_tabs();
|
969 |
+
|
970 |
+
$this->add_control(
|
971 |
+
'eae_flip_box_set',
|
972 |
+
[
|
973 |
+
'label' => __( 'Flip Box', 'elementor' ),
|
974 |
+
'type' => Controls_Manager::REPEATER,
|
975 |
+
'show_label' => true,
|
976 |
+
'fields' => array_values($repeater->get_controls()),
|
977 |
+
]
|
978 |
+
);
|
979 |
+
|
980 |
+
$this->end_controls_section();
|
981 |
+
|
982 |
+
$this->start_controls_section(
|
983 |
+
'section_general_style',
|
984 |
+
[
|
985 |
+
'label' => __( 'General', 'elementor' ),
|
986 |
+
'tab' => Controls_Manager::TAB_STYLE
|
987 |
+
]
|
988 |
+
);
|
989 |
+
|
990 |
+
$this->add_control(
|
991 |
+
'animation_style',
|
992 |
+
[
|
993 |
+
'label' => __( 'Animation Style', 'elementor' ),
|
994 |
+
'type' => Controls_Manager::SELECT,
|
995 |
+
'options' => [
|
996 |
+
'horizontal' => __( 'Horizontal', 'elementor' ),
|
997 |
+
'vertical' => __( 'Vertical', 'elementor' ),
|
998 |
+
'flipcard flipcard-rotate-top-down' => __( 'Cube - Top Down', 'elementor' ),
|
999 |
+
'flipcard flipcard-rotate-down-top' => __( 'Cube - Down Top', 'elementor' ),
|
1000 |
+
'flipcard flipcard-rotate-left-right' => __( 'Cube - Left Right', 'elementor' ),
|
1001 |
+
'flipcard flipcard-rotate-right-left' => __( 'Cube - Right Left', 'elementor' ),
|
1002 |
+
'fade' =>__('Fade','elementor'),
|
1003 |
+
'' =>__('Rollover','elementor'),
|
1004 |
+
'flip box' =>__('Flip Box','elementor'),
|
1005 |
+
'flip box fade' =>__('Flip Box Fade','elementor'),
|
1006 |
+
'flip box fade up' =>__('Fade Up','elementor'),
|
1007 |
+
'flip box fade hideback' =>__('Fade Hideback','elementor'),
|
1008 |
+
'flip box fade up hideback' =>__('Fade Up Hideback','elementor'),
|
1009 |
+
'nananana' =>__('Nananana','elementor'),
|
1010 |
+
'zommin' => __( 'Zoom In', 'elementor' ),
|
1011 |
+
'zoomout' => __( 'Zoom Out', 'elementor' ),
|
1012 |
+
],
|
1013 |
+
'default' => 'vertical',
|
1014 |
+
'prefix_class' => 'eae-fb-animate-'
|
1015 |
+
]
|
1016 |
+
);
|
1017 |
+
|
1018 |
+
|
1019 |
+
$this->add_group_control(
|
1020 |
+
Group_Control_Border::get_type(),
|
1021 |
+
[
|
1022 |
+
'name' => 'flip_box_border',
|
1023 |
+
'label' => __( 'Box Border', 'elementor' ),
|
1024 |
+
'selector' => '{{WRAPPER}} .eae-flip-box-inner > div',
|
1025 |
+
]
|
1026 |
+
);
|
1027 |
+
|
1028 |
+
|
1029 |
+
|
1030 |
+
$this->add_control(
|
1031 |
+
'box_border_radius',
|
1032 |
+
[
|
1033 |
+
'label' => __( 'Border Radius', 'elementor' ),
|
1034 |
+
'type' => Controls_Manager::DIMENSIONS,
|
1035 |
+
'size_units' => [ 'px', '%' ],
|
1036 |
+
'selectors' => [
|
1037 |
+
'{{WRAPPER}} .eae-flip-box-front' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
1038 |
+
'{{WRAPPER}} .eae-flip-box-back' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
1039 |
+
],
|
1040 |
+
]
|
1041 |
+
);
|
1042 |
+
|
1043 |
+
$this->add_control(
|
1044 |
+
'box_height',
|
1045 |
+
[
|
1046 |
+
'type' => Controls_Manager::TEXT,
|
1047 |
+
'label' => __( 'Box Height', 'elementor' ),
|
1048 |
+
'placeholder' => __( '250', 'elementor' ),
|
1049 |
+
'default' => __( '250', 'elementor' ),
|
1050 |
+
'selectors' => [
|
1051 |
+
'{{WRAPPER}} .eae-flip-box-inner' => 'height: {{VALUE}}px;',
|
1052 |
+
'{{WRAPPER}}.eae-fb-animate-flipcard .eae-flip-box-front' => 'transform-origin: center center calc(-{{VALUE}}px/2);-webkit-transform-origin:center center calc(-{{VALUE}}px/2);',
|
1053 |
+
'{{WRAPPER}}.eae-fb-animate-flipcard .eae-flip-box-back' => 'transform-origin: center center calc(-{{VALUE }}px/2);-webkit-transform-origin:center center calc(-{{VALUE}}px/2);'
|
1054 |
+
],
|
1055 |
+
]
|
1056 |
+
);
|
1057 |
+
|
1058 |
+
$this->end_controls_section();
|
1059 |
+
|
1060 |
+
$this->start_controls_section(
|
1061 |
+
'section-front-box-style',
|
1062 |
+
[
|
1063 |
+
'label' => __( 'Front Box', 'elementor' ),
|
1064 |
+
'tab' => Controls_Manager::TAB_STYLE
|
1065 |
+
]
|
1066 |
+
);
|
1067 |
+
$this->add_control(
|
1068 |
+
'front_icon_view_global',
|
1069 |
+
[
|
1070 |
+
'label' => __( 'View', 'elementor' ),
|
1071 |
+
'type' => Controls_Manager::SELECT,
|
1072 |
+
'options' => [
|
1073 |
+
'default' => __( 'Default', 'elementor' ),
|
1074 |
+
'stacked' => __( 'Stacked', 'elementor' ),
|
1075 |
+
'framed' => __( 'Framed', 'elementor' ),
|
1076 |
+
],
|
1077 |
+
'default' => 'default',
|
1078 |
+
|
1079 |
+
]
|
1080 |
+
);
|
1081 |
+
|
1082 |
+
$this->add_control(
|
1083 |
+
'front_icon_shape_global',
|
1084 |
+
[
|
1085 |
+
'label' => __( 'Shape', 'elementor' ),
|
1086 |
+
'type' => Controls_Manager::SELECT,
|
1087 |
+
'options' => [
|
1088 |
+
'circle' => __( 'Circle', 'elementor' ),
|
1089 |
+
'square' => __( 'Square', 'elementor' ),
|
1090 |
+
],
|
1091 |
+
'default' => 'circle',
|
1092 |
+
'condition' => [
|
1093 |
+
'front_icon_view_global!' => 'default',
|
1094 |
+
],
|
1095 |
+
]
|
1096 |
+
);
|
1097 |
+
|
1098 |
+
$this->add_group_control(
|
1099 |
+
Group_Control_Background::get_type(),
|
1100 |
+
[
|
1101 |
+
'name' => 'front_box_background',
|
1102 |
+
'label' => __( 'Front Box Background', 'elementor' ),
|
1103 |
+
'types' => [ 'classic','gradient' ],
|
1104 |
+
'selector' => '{{WRAPPER}} .overwrite-style-no .eae-flip-box-front',
|
1105 |
+
]
|
1106 |
+
|
1107 |
+
);
|
1108 |
+
|
1109 |
+
|
1110 |
+
$this->add_control(
|
1111 |
+
'front_box_title_color',
|
1112 |
+
[
|
1113 |
+
'label' => __( 'Title', 'elementor' ),
|
1114 |
+
'type' => Controls_Manager::COLOR,
|
1115 |
+
'scheme' => [
|
1116 |
+
'type' => Scheme_Color::get_type(),
|
1117 |
+
'value' => Scheme_Color::COLOR_1,
|
1118 |
+
],
|
1119 |
+
'default' => '#FFF',
|
1120 |
+
'selectors' => [
|
1121 |
+
'{{WRAPPER}} .front-icon-title ' => 'color: {{VALUE}};',
|
1122 |
+
],
|
1123 |
+
]
|
1124 |
+
);
|
1125 |
+
|
1126 |
+
$this->add_group_control(
|
1127 |
+
Group_Control_Typography::get_type(),
|
1128 |
+
[
|
1129 |
+
'name' => 'front_box_title_typography',
|
1130 |
+
'label' => __( 'Title Typography', 'elementor' ),
|
1131 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
1132 |
+
'selector' => '{{WRAPPER}} .front-icon-title',
|
1133 |
+
]
|
1134 |
+
);
|
1135 |
+
|
1136 |
+
$this->add_control(
|
1137 |
+
'front_box_text_color',
|
1138 |
+
[
|
1139 |
+
'label' => __( 'Description Color', 'elementor' ),
|
1140 |
+
'type' => Controls_Manager::COLOR,
|
1141 |
+
'scheme' => [
|
1142 |
+
'type' => Scheme_Color::get_type(),
|
1143 |
+
'value' => Scheme_Color::COLOR_1,
|
1144 |
+
],
|
1145 |
+
'default' => '#FFF',
|
1146 |
+
'selectors' => [
|
1147 |
+
'{{WRAPPER}} .eae-flip-box-front p' => 'color: {{VALUE}};',
|
1148 |
+
],
|
1149 |
+
|
1150 |
+
]
|
1151 |
+
);
|
1152 |
+
|
1153 |
+
$this->add_group_control(
|
1154 |
+
Group_Control_Typography::get_type(),
|
1155 |
+
[
|
1156 |
+
'name' => 'front_box_text_typography',
|
1157 |
+
'label' => __( 'Description Typography', 'elementor' ),
|
1158 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
1159 |
+
'selector' => '{{WRAPPER}} .eae-flip-box-front p',
|
1160 |
+
]
|
1161 |
+
);
|
1162 |
+
|
1163 |
+
|
1164 |
+
/**
|
1165 |
+
* Front Box icons styles
|
1166 |
+
**/
|
1167 |
+
$this->add_control(
|
1168 |
+
'front_box_icon_color',
|
1169 |
+
[
|
1170 |
+
'label' => __( 'Icon Color', 'elementor' ),
|
1171 |
+
'type' => Controls_Manager::COLOR,
|
1172 |
+
'scheme' => [
|
1173 |
+
'type' => Scheme_Color::get_type(),
|
1174 |
+
'value' => Scheme_Color::COLOR_1,
|
1175 |
+
],
|
1176 |
+
'default' => '#FFF',
|
1177 |
+
'selectors' => [
|
1178 |
+
'{{WRAPPER}} .eae-flip-box-front .icon-wrapper i' => 'color: {{VALUE}};',
|
1179 |
+
],
|
1180 |
+
]
|
1181 |
+
);
|
1182 |
+
|
1183 |
+
$this->add_control(
|
1184 |
+
'front_box_icon_fill_color',
|
1185 |
+
[
|
1186 |
+
'label' => __( 'Icon Fill Color', 'elementor' ),
|
1187 |
+
'type' => Controls_Manager::COLOR,
|
1188 |
+
'scheme' => [
|
1189 |
+
'type' => Scheme_Color::get_type(),
|
1190 |
+
'value' => Scheme_Color::COLOR_1,
|
1191 |
+
],
|
1192 |
+
'selectors' => [
|
1193 |
+
'{{WRAPPER}} .eae-fb-icon-view-stacked' => 'background-color: {{VALUE}};',
|
1194 |
+
],
|
1195 |
+
'condition' => [
|
1196 |
+
'front_icon_view_global' => 'stacked'
|
1197 |
+
],
|
1198 |
+
]
|
1199 |
+
);
|
1200 |
+
|
1201 |
+
$this->add_group_control(
|
1202 |
+
Group_Control_Border::get_type(),
|
1203 |
+
[
|
1204 |
+
'name' => 'front_box_icon_border',
|
1205 |
+
'label' => __( 'Box Border', 'elementor' ),
|
1206 |
+
'placeholder' => '1px',
|
1207 |
+
'default' => '1px',
|
1208 |
+
'selector' => '{{WRAPPER}} .eae-flip-box-front .eae-fb-icon-view-framed, {{WRAPPER}} .eae-flip-box-front .eae-fb-icon-view-stacked',
|
1209 |
+
'label_block' => true,
|
1210 |
+
'condition' => [
|
1211 |
+
'front_icon_view_global!' => 'default'
|
1212 |
+
],
|
1213 |
+
]
|
1214 |
+
);
|
1215 |
+
|
1216 |
+
$this->add_control(
|
1217 |
+
'front_icon_size',
|
1218 |
+
[
|
1219 |
+
'label' => __( 'Icon Size', 'elementor' ),
|
1220 |
+
'type' => Controls_Manager::SLIDER,
|
1221 |
+
'range' => [
|
1222 |
+
'px' => [
|
1223 |
+
'min' => 6,
|
1224 |
+
'max' => 300,
|
1225 |
+
],
|
1226 |
+
],
|
1227 |
+
'selectors' => [
|
1228 |
+
'{{WRAPPER}} .eae-flip-box-front .icon-wrapper i' => 'font-size: {{SIZE}}{{UNIT}};',
|
1229 |
+
],
|
1230 |
+
]
|
1231 |
+
);
|
1232 |
+
|
1233 |
+
$this->add_control(
|
1234 |
+
'front_icon_padding',
|
1235 |
+
[
|
1236 |
+
'label' => __( 'Icon Padding', 'elementor' ),
|
1237 |
+
'type' => Controls_Manager::SLIDER,
|
1238 |
+
'selectors' => [
|
1239 |
+
'{{WRAPPER}} .eae-flip-box-front .icon-wrapper' => 'padding: {{SIZE}}{{UNIT}};',
|
1240 |
+
],
|
1241 |
+
'default' => [
|
1242 |
+
'size' => 1.5,
|
1243 |
+
'unit' => 'em',
|
1244 |
+
],
|
1245 |
+
'range' => [
|
1246 |
+
'em' => [
|
1247 |
+
'min' => 0,
|
1248 |
+
],
|
1249 |
+
],
|
1250 |
+
]
|
1251 |
+
);
|
1252 |
+
|
1253 |
+
$this->end_controls_section();
|
1254 |
+
|
1255 |
+
|
1256 |
+
|
1257 |
+
$this->start_controls_section(
|
1258 |
+
'section-back-box-style',
|
1259 |
+
[
|
1260 |
+
'label' => __( 'Back Box', 'elementor' ),
|
1261 |
+
'tab' => Controls_Manager::TAB_STYLE
|
1262 |
+
]
|
1263 |
+
);
|
1264 |
+
|
1265 |
+
$this->add_control(
|
1266 |
+
'back_icon_view_global',
|
1267 |
+
[
|
1268 |
+
'label' => __( 'View', 'elementor' ),
|
1269 |
+
'type' => Controls_Manager::SELECT,
|
1270 |
+
'options' => [
|
1271 |
+
'default' => __( 'Default', 'elementor' ),
|
1272 |
+
'stacked' => __( 'Stacked', 'elementor' ),
|
1273 |
+
'framed' => __( 'Framed', 'elementor' ),
|
1274 |
+
],
|
1275 |
+
'default' => 'default',
|
1276 |
+
]
|
1277 |
+
);
|
1278 |
+
|
1279 |
+
$this->add_control(
|
1280 |
+
'back_icon_shape_global',
|
1281 |
+
[
|
1282 |
+
'label' => __( 'Shape', 'elementor' ),
|
1283 |
+
'type' => Controls_Manager::SELECT,
|
1284 |
+
'options' => [
|
1285 |
+
'circle' => __( 'Circle', 'elementor' ),
|
1286 |
+
'square' => __( 'Square', 'elementor' ),
|
1287 |
+
],
|
1288 |
+
'default' => 'circle',
|
1289 |
+
|
1290 |
+
]
|
1291 |
+
);
|
1292 |
+
$this->add_group_control(
|
1293 |
+
Group_Control_Background::get_type(),
|
1294 |
+
[
|
1295 |
+
'name' => 'back_box_background',
|
1296 |
+
'label' => __( 'Back Box Background', 'elementor' ),
|
1297 |
+
'types' => [ 'classic','gradient' ],
|
1298 |
+
'selector' => '{{WRAPPER}} .eae-flip-box-back',
|
1299 |
+
]
|
1300 |
+
);
|
1301 |
+
|
1302 |
+
$this->add_control(
|
1303 |
+
'back_box_title_color',
|
1304 |
+
[
|
1305 |
+
'label' => __( 'Title', 'elementor' ),
|
1306 |
+
'type' => Controls_Manager::COLOR,
|
1307 |
+
'scheme' => [
|
1308 |
+
'type' => Scheme_Color::get_type(),
|
1309 |
+
'value' => Scheme_Color::COLOR_1,
|
1310 |
+
],
|
1311 |
+
'default' => '#FFF',
|
1312 |
+
'selectors' => [
|
1313 |
+
'{{WRAPPER}} .back-icon-title' => 'color: {{VALUE}};',
|
1314 |
+
],
|
1315 |
+
|
1316 |
+
]
|
1317 |
+
);
|
1318 |
+
|
1319 |
+
$this->add_group_control(
|
1320 |
+
Group_Control_Typography::get_type(),
|
1321 |
+
[
|
1322 |
+
'name' => 'back_box_title_typography',
|
1323 |
+
'label' => __( 'Title Typography', 'elementor' ),
|
1324 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
1325 |
+
'selector' => '{{WRAPPER}} .back-icon-title',
|
1326 |
+
]
|
1327 |
+
);
|
1328 |
+
|
1329 |
+
$this->add_control(
|
1330 |
+
'back_box_text_color',
|
1331 |
+
[
|
1332 |
+
'label' => __( 'Description Color', 'elementor' ),
|
1333 |
+
'type' => Controls_Manager::COLOR,
|
1334 |
+
'scheme' => [
|
1335 |
+
'type' => Scheme_Color::get_type(),
|
1336 |
+
'value' => Scheme_Color::COLOR_1,
|
1337 |
+
],
|
1338 |
+
'default' => '#FFF',
|
1339 |
+
'selectors' => [
|
1340 |
+
'{{WRAPPER}} .eae-flip-box-back p' => 'color: {{VALUE}};',
|
1341 |
+
],
|
1342 |
+
|
1343 |
+
]
|
1344 |
+
);
|
1345 |
+
|
1346 |
+
$this->add_group_control(
|
1347 |
+
Group_Control_Typography::get_type(),
|
1348 |
+
[
|
1349 |
+
'name' => 'back_box_text_typography',
|
1350 |
+
'label' => __( 'Description Typography', 'elementor' ),
|
1351 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
1352 |
+
'selector' => '{{WRAPPER}} .eae-flip-box-back p',
|
1353 |
+
]
|
1354 |
+
);
|
1355 |
+
|
1356 |
+
|
1357 |
+
/**
|
1358 |
+
* Back Box icons styles
|
1359 |
+
**/
|
1360 |
+
$this->add_control(
|
1361 |
+
'back_box_icon_color',
|
1362 |
+
[
|
1363 |
+
'label' => __( 'Icon Color', 'elementor' ),
|
1364 |
+
'type' => Controls_Manager::COLOR,
|
1365 |
+
'scheme' => [
|
1366 |
+
'type' => Scheme_Color::get_type(),
|
1367 |
+
'value' => Scheme_Color::COLOR_1,
|
1368 |
+
],
|
1369 |
+
'default' => '#FFF',
|
1370 |
+
'selectors' => [
|
1371 |
+
'{{WRAPPER}} .eae-flip-box-back .icon-wrapper i' => 'color: {{VALUE}};',
|
1372 |
+
],
|
1373 |
+
]
|
1374 |
+
);
|
1375 |
+
|
1376 |
+
$this->add_control(
|
1377 |
+
'back_box_icon_fill_color',
|
1378 |
+
[
|
1379 |
+
'label' => __( 'Icon Fill Color', 'elementor' ),
|
1380 |
+
'type' => Controls_Manager::COLOR,
|
1381 |
+
'scheme' => [
|
1382 |
+
'type' => Scheme_Color::get_type(),
|
1383 |
+
'value' => Scheme_Color::COLOR_1,
|
1384 |
+
],
|
1385 |
+
'selectors' => [
|
1386 |
+
'{{WRAPPER}} .eae-flip-box-back .eae-fb-icon-view-stacked' => 'background-color: {{VALUE}};',
|
1387 |
+
],
|
1388 |
+
'condition' => [
|
1389 |
+
'back_icon_view_global' => 'stacked'
|
1390 |
+
],
|
1391 |
+
]
|
1392 |
+
);
|
1393 |
+
|
1394 |
+
$this->add_group_control(
|
1395 |
+
Group_Control_Border::get_type(),
|
1396 |
+
[
|
1397 |
+
'name' => 'back_box_icon_border',
|
1398 |
+
'label' => __( 'Box Border', 'elementor' ),
|
1399 |
+
'placeholder' => '1px',
|
1400 |
+
'default' => '1px',
|
1401 |
+
'selector' => '{{WRAPPER}} .eae-flip-box-back .eae-fb-icon-view-framed, {{WRAPPER}} .eae-flip-box-back .eae-fb-icon-view-stacked',
|
1402 |
+
'label_block' => true,
|
1403 |
+
'condition' => [
|
1404 |
+
'back_icon_view!' => 'default'
|
1405 |
+
],
|
1406 |
+
]
|
1407 |
+
);
|
1408 |
+
|
1409 |
+
$this->add_control(
|
1410 |
+
'back_icon_size',
|
1411 |
+
[
|
1412 |
+
'label' => __( 'Icon Size', 'elementor' ),
|
1413 |
+
'type' => Controls_Manager::SLIDER,
|
1414 |
+
'range' => [
|
1415 |
+
'px' => [
|
1416 |
+
'min' => 6,
|
1417 |
+
'max' => 300,
|
1418 |
+
],
|
1419 |
+
],
|
1420 |
+
'selectors' => [
|
1421 |
+
'{{WRAPPER}} .eae-flip-box-back .icon-wrapper i' => 'font-size: {{SIZE}}{{UNIT}};',
|
1422 |
+
],
|
1423 |
+
]
|
1424 |
+
);
|
1425 |
+
|
1426 |
+
$this->add_control(
|
1427 |
+
'back_icon_padding',
|
1428 |
+
[
|
1429 |
+
'label' => __( 'Icon Padding', 'elementor' ),
|
1430 |
+
'type' => Controls_Manager::SLIDER,
|
1431 |
+
'selectors' => [
|
1432 |
+
'{{WRAPPER}} .eae-flip-box-back .icon-wrapper' => 'padding: {{SIZE}}{{UNIT}};',
|
1433 |
+
],
|
1434 |
+
'default' => [
|
1435 |
+
'size' => 1.5,
|
1436 |
+
'unit' => 'em',
|
1437 |
+
],
|
1438 |
+
'range' => [
|
1439 |
+
'em' => [
|
1440 |
+
'min' => 0,
|
1441 |
+
],
|
1442 |
+
],
|
1443 |
+
'condition' => [
|
1444 |
+
'back_icon_view!' => 'default',
|
1445 |
+
],
|
1446 |
+
]
|
1447 |
+
);
|
1448 |
+
|
1449 |
+
|
1450 |
+
|
1451 |
+
$this->end_controls_section();
|
1452 |
+
|
1453 |
+
$this->start_controls_section(
|
1454 |
+
'section-action-button-style',
|
1455 |
+
[
|
1456 |
+
'label' => __( 'Action Button', 'elementor' ),
|
1457 |
+
'tab' => Controls_Manager::TAB_STYLE,
|
1458 |
+
]
|
1459 |
+
);
|
1460 |
+
|
1461 |
+
$this->add_control(
|
1462 |
+
'button_text_color',
|
1463 |
+
[
|
1464 |
+
'label' => __( 'Text Color', 'elementor' ),
|
1465 |
+
'type' => Controls_Manager::COLOR,
|
1466 |
+
'default' => '#fff',
|
1467 |
+
'selectors' => [
|
1468 |
+
'{{WRAPPER}} .eae-fb-button' => 'color: {{VALUE}};',
|
1469 |
+
],
|
1470 |
+
]
|
1471 |
+
);
|
1472 |
+
|
1473 |
+
$this->add_group_control(
|
1474 |
+
Group_Control_Typography::get_type(),
|
1475 |
+
[
|
1476 |
+
'name' => 'typography',
|
1477 |
+
'label' => __( 'Typography', 'elementor' ),
|
1478 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
1479 |
+
'selector' => '{{WRAPPER}} .eae-fb-button',
|
1480 |
+
]
|
1481 |
+
);
|
1482 |
+
|
1483 |
+
$this->add_control(
|
1484 |
+
'background_color',
|
1485 |
+
[
|
1486 |
+
'label' => __( 'Background Color', 'elementor' ),
|
1487 |
+
'type' => Controls_Manager::COLOR,
|
1488 |
+
'scheme' => [
|
1489 |
+
'type' => Scheme_Color::get_type(),
|
1490 |
+
'value' => Scheme_Color::COLOR_4,
|
1491 |
+
],
|
1492 |
+
'default' => '#93C64F',
|
1493 |
+
'selectors' => [
|
1494 |
+
'{{WRAPPER}} .eae-fb-button' => 'background-color: {{VALUE}};',
|
1495 |
+
],
|
1496 |
+
]
|
1497 |
+
);
|
1498 |
+
|
1499 |
+
$this->add_group_control(
|
1500 |
+
Group_Control_Border::get_type(),
|
1501 |
+
[
|
1502 |
+
'name' => 'border',
|
1503 |
+
'label' => __( 'Border', 'elementor' ),
|
1504 |
+
'placeholder' => '1px',
|
1505 |
+
'default' => '1px',
|
1506 |
+
'selector' => '{{WRAPPER}} .eae-fb-button',
|
1507 |
+
]
|
1508 |
+
);
|
1509 |
+
|
1510 |
+
$this->add_control(
|
1511 |
+
'border_radius',
|
1512 |
+
[
|
1513 |
+
'label' => __( 'Border Radius', 'elementor' ),
|
1514 |
+
'type' => Controls_Manager::DIMENSIONS,
|
1515 |
+
'size_units' => [ 'px', '%' ],
|
1516 |
+
'selectors' => [
|
1517 |
+
'{{WRAPPER}} .eae-fb-button' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
1518 |
+
],
|
1519 |
+
]
|
1520 |
+
);
|
1521 |
+
|
1522 |
+
$this->add_control(
|
1523 |
+
'text_padding',
|
1524 |
+
[
|
1525 |
+
'label' => __( 'Text Padding', 'elementor' ),
|
1526 |
+
'type' => Controls_Manager::DIMENSIONS,
|
1527 |
+
'size_units' => [ 'px', 'em', '%' ],
|
1528 |
+
'selectors' => [
|
1529 |
+
'{{WRAPPER}} .eae-fb-button' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
1530 |
+
],
|
1531 |
+
]
|
1532 |
+
);
|
1533 |
+
|
1534 |
+
$this->end_controls_section();
|
1535 |
+
|
1536 |
+
}
|
1537 |
+
protected function render( ) {
|
1538 |
+
$settings = $this->get_settings_for_display();
|
1539 |
+
|
1540 |
+
if(count($settings['eae_flip_box_set'])){
|
1541 |
+
//echo "<pre>";print_r($settings);echo "</pre>";
|
1542 |
+
?>
|
1543 |
+
<div class="eae-flip-box">
|
1544 |
+
<?php
|
1545 |
+
foreach ($settings['eae_flip_box_set'] as $flipbox){
|
1546 |
+
//echo "<pre>";print_r($flipbox);echo "</pre>";
|
1547 |
+
if($flipbox['front_box_element'] == "icon") {
|
1548 |
+
if($flipbox['style_indv'] == "yes") {
|
1549 |
+
$this->add_render_attribute( $flipbox['_id'].'-front-icon-wrapper', 'class', 'icon-wrapper' );
|
1550 |
+
$this->add_render_attribute( $flipbox['_id'].'-front-icon-wrapper', 'class', 'eae-fb-icon-view-' . $flipbox['front_icon_view'] );
|
1551 |
+
$this->add_render_attribute( $flipbox['_id'].'-front-icon-wrapper', 'class', 'eae-fb-icon-shape-' . $flipbox['front_icon_shape'] );
|
1552 |
+
}
|
1553 |
+
else
|
1554 |
+
{
|
1555 |
+
$this->add_render_attribute( $flipbox['_id'].'-front-icon-wrapper', 'class', 'icon-wrapper' );
|
1556 |
+
$this->add_render_attribute( $flipbox['_id'].'-front-icon-wrapper', 'class', 'eae-fb-icon-view-' . $settings['front_icon_view_global'] );
|
1557 |
+
$this->add_render_attribute( $flipbox['_id'].'-front-icon-wrapper', 'class', 'eae-fb-icon-shape-' . $settings['front_icon_shape_global'] );
|
1558 |
+
}
|
1559 |
+
$this->add_render_attribute( $flipbox['_id'].'-front-icon-title', 'class', 'front-icon-title' );
|
1560 |
+
$this->add_render_attribute( $flipbox['_id'].'-front-icon', 'class', $flipbox['front_icon'] );
|
1561 |
+
}
|
1562 |
+
if($flipbox['back_box_element'] == "icon") {
|
1563 |
+
if($flipbox['style_indv'] == "yes") {
|
1564 |
+
$this->add_render_attribute($flipbox['_id'] . '-back-icon-wrapper', 'class', 'icon-wrapper');
|
1565 |
+
$this->add_render_attribute($flipbox['_id'] . '-back-icon-wrapper', 'class', 'eae-fb-icon-view-' . $flipbox['back_icon_view']);
|
1566 |
+
$this->add_render_attribute($flipbox['_id'] . '-back-icon-wrapper', 'class', 'eae-fb-icon-shape-' . $flipbox['back_icon_shape']);
|
1567 |
+
}
|
1568 |
+
else
|
1569 |
+
{
|
1570 |
+
$this->add_render_attribute( $flipbox['_id'].'-back-icon-wrapper', 'class', 'icon-wrapper' );
|
1571 |
+
$this->add_render_attribute( $flipbox['_id'].'-back-icon-wrapper', 'class', 'eae-fb-icon-view-' . $settings['back_icon_view_global'] );
|
1572 |
+
$this->add_render_attribute( $flipbox['_id'].'-back-icon-wrapper', 'class', 'eae-fb-icon-shape-' . $settings['back_icon_shape_global'] );
|
1573 |
+
}
|
1574 |
+
$this->add_render_attribute( $flipbox['_id'].'-back-icon-title', 'class', 'back-icon-title' );
|
1575 |
+
$this->add_render_attribute( $flipbox['_id'].'-back-icon', 'class', $flipbox['back_icon'] );
|
1576 |
+
}
|
1577 |
+
$this->add_render_attribute( $flipbox['_id'].'-button', 'class', 'eae-fb-button' );
|
1578 |
+
if ( ! empty( $flipbox['link']['url'] ) ) {
|
1579 |
+
$this->add_render_attribute( $flipbox['_id'].'-button', 'href', $flipbox['link']['url'] );
|
1580 |
+
|
1581 |
+
if ( ! empty( $flipbox['link']['is_external'] ) ) {
|
1582 |
+
$this->add_render_attribute( $flipbox['_id'].'-button', 'target', '_blank' );
|
1583 |
+
}
|
1584 |
+
}
|
1585 |
+
?>
|
1586 |
+
|
1587 |
+
<div class="elementor-repeater-item-<?php echo $flipbox['_id']; ?> overwrite-style-<?php echo $flipbox['style_indv']; ?> eae-flip-box-wrapper ">
|
1588 |
+
<div class="eae-flip-box-inner" >
|
1589 |
+
|
1590 |
+
<div class="eae-flip-box-front">
|
1591 |
+
<div class="flipbox-content">
|
1592 |
+
<?php if($flipbox['front_box_element'] == "icon") {?>
|
1593 |
+
<?php if(!empty($flipbox['front_icon'])){ ?>
|
1594 |
+
<div <?php echo $this->get_render_attribute_string( $flipbox['_id'].'-front-icon-wrapper' ); ?>>
|
1595 |
+
<i <?php echo $this->get_render_attribute_string( $flipbox['_id'].'-front-icon' ); ?>></i>
|
1596 |
+
</div>
|
1597 |
+
<?php } } ?>
|
1598 |
+
<?php if($flipbox['front_box_element'] == "image"){
|
1599 |
+
if($flipbox['front_box_image']['url'] !="")
|
1600 |
+
{
|
1601 |
+
$pix = wp_get_attachment_image_src($flipbox['front_box_image']['id'],$flipbox['front_image_size_size']);
|
1602 |
+
echo "<img src='".$pix[0]."'>";
|
1603 |
+
|
1604 |
+
}
|
1605 |
+
}?>
|
1606 |
+
|
1607 |
+
<?php if(!empty($flipbox['front_title'])){ ?>
|
1608 |
+
<<?php echo $flipbox['front_title_html_tag']; ?> <?php echo $this->get_render_attribute_string( $flipbox['_id'].'-front-icon-title' ); ?> >
|
1609 |
+
<?php echo $flipbox['front_title']; ?>
|
1610 |
+
</<?php echo $flipbox['front_title_html_tag']; ?>>
|
1611 |
+
<?php } ?>
|
1612 |
+
|
1613 |
+
<?php if(!empty($flipbox['front_text'])){ ?>
|
1614 |
+
<p>
|
1615 |
+
<?php echo $flipbox['front_text']; ?>
|
1616 |
+
</p>
|
1617 |
+
<?php } ?>
|
1618 |
+
</div>
|
1619 |
+
</div>
|
1620 |
+
|
1621 |
+
<div class="eae-flip-box-back">
|
1622 |
+
<div class="flipbox-content">
|
1623 |
+
<?php if($flipbox['back_box_element'] == "icon") {?>
|
1624 |
+
<?php if(!empty($flipbox['back_icon'])){ ?>
|
1625 |
+
<div <?php echo $this->get_render_attribute_string( $flipbox['_id'].'-back-icon-wrapper' ); ?>>
|
1626 |
+
<i <?php echo $this->get_render_attribute_string( $flipbox['_id'].'-back-icon' ); ?>></i>
|
1627 |
+
</div>
|
1628 |
+
<?php } }?>
|
1629 |
+
<?php if($flipbox['back_box_element'] == "image"){
|
1630 |
+
if($flipbox['back_box_image']['url'] !="")
|
1631 |
+
{
|
1632 |
+
//echo "<img src='".$flipbox['back_box_image']['url']."'>";
|
1633 |
+
$back_pix = wp_get_attachment_image_src($flipbox['back_box_image']['id'],$flipbox['back_image_size_size']);
|
1634 |
+
echo "<img src='".$back_pix[0]."'>";
|
1635 |
+
}
|
1636 |
+
}?>
|
1637 |
+
<?php if(!empty($flipbox['back_title'])){ ?>
|
1638 |
+
<<?php echo $flipbox['back_title_html_tag']; ?> <?php echo $this->get_render_attribute_string( 'back-icon-title' ); ?> >
|
1639 |
+
<?php echo $flipbox['back_title']; ?>
|
1640 |
+
</<?php echo $flipbox['back_title_html_tag']; ?>>
|
1641 |
+
<?php } ?>
|
1642 |
+
|
1643 |
+
<?php if(!empty($flipbox['back_text'])){ ?>
|
1644 |
+
<p>
|
1645 |
+
<?php echo $flipbox['back_text']; ?>
|
1646 |
+
</p>
|
1647 |
+
<?php } ?>
|
1648 |
+
|
1649 |
+
<?php if(!empty($flipbox['action_text'])){ ?>
|
1650 |
+
<div class="eae-fb-button-wrapper">
|
1651 |
+
<a <?php echo $this->get_render_attribute_string( $flipbox['_id'].'-button' ); ?>>
|
1652 |
+
<span class="elementor-button-text"><?php echo $flipbox['action_text']; ?></span>
|
1653 |
+
</a>
|
1654 |
+
</div>
|
1655 |
+
<?php } ?>
|
1656 |
+
</div>
|
1657 |
+
</div>
|
1658 |
+
|
1659 |
+
</div>
|
1660 |
+
</div>
|
1661 |
+
|
1662 |
+
<?php
|
1663 |
+
}
|
1664 |
+
?>
|
1665 |
+
</div>
|
1666 |
+
<?php }
|
1667 |
+
|
1668 |
+
}
|
1669 |
+
|
1670 |
+
protected function _content_template() {
|
1671 |
+
?>
|
1672 |
+
<div class="eae-flip-box">
|
1673 |
+
<#
|
1674 |
+
|
1675 |
+
if(settings.eae_flip_box_set.length){
|
1676 |
+
settings.eae_flip_box_set.forEach(flipbox);
|
1677 |
+
|
1678 |
+
function flipbox(item, index){
|
1679 |
+
if(item.front_box_element == "icon") {
|
1680 |
+
if(item.style_indv == "yes") {
|
1681 |
+
view.addRenderAttribute( item._id + '-front-icon-wrapper', 'class', 'icon-wrapper' );
|
1682 |
+
view.addRenderAttribute( item._id + '-front-icon-wrapper', 'class', 'eae-fb-icon-view-' + item.front_icon_view );
|
1683 |
+
view.addRenderAttribute( item._id + '-front-icon-wrapper', 'class', 'eae-fb-icon-shape-' + item.front_icon_shape );
|
1684 |
+
}
|
1685 |
+
else
|
1686 |
+
{
|
1687 |
+
view.addRenderAttribute( item._id + '-front-icon-wrapper', 'class', 'icon-wrapper' );
|
1688 |
+
view.addRenderAttribute( item._id + '-front-icon-wrapper', 'class', 'eae-fb-icon-view-' + item.front_icon_view_global );
|
1689 |
+
view.addRenderAttribute( item._id + '-front-icon-wrapper', 'class', 'eae-fb-icon-shape-' + item.front_icon_shape_global );
|
1690 |
+
}
|
1691 |
+
view.addRenderAttribute( item._id + '-front-icon-title', 'class', 'front-icon-title' );
|
1692 |
+
view.addRenderAttribute( item._id + '-front-icon', 'class', item.front_icon );
|
1693 |
+
}
|
1694 |
+
if(item.back_box_element == "icon") {
|
1695 |
+
if(item.style_indv == "yes") {
|
1696 |
+
view.addRenderAttribute(item._id + '-back-icon-wrapper', 'class', 'icon-wrapper');
|
1697 |
+
view.addRenderAttribute(item._id + '-back-icon-wrapper', 'class', 'eae-fb-icon-view-' + item.back_icon_view);
|
1698 |
+
view.addRenderAttribute(item._id + '-back-icon-wrapper', 'class', 'eae-fb-icon-shape-' + item.back_icon_shape);
|
1699 |
+
}
|
1700 |
+
else
|
1701 |
+
{
|
1702 |
+
view.addRenderAttribute( item._id + '-back-icon-wrapper', 'class', 'icon-wrapper' );
|
1703 |
+
view.addRenderAttribute( item._id + '-back-icon-wrapper', 'class', 'eae-fb-icon-view-' + item.back_icon_view_global );
|
1704 |
+
view.addRenderAttribute( item._id + '-back-icon-wrapper', 'class', 'eae-fb-icon-shape-' + item.back_icon_shape_global );
|
1705 |
+
}
|
1706 |
+
view.addRenderAttribute( item._id + '-back-icon-title', 'class', 'back-icon-title' );
|
1707 |
+
view.addRenderAttribute( item._id + '-back-icon', 'class', item.back_icon );
|
1708 |
+
}
|
1709 |
+
|
1710 |
+
view.addRenderAttribute( item._id + '-button', 'class', 'eae-fb-button' );
|
1711 |
+
if ( item.link.url !== "" ) {
|
1712 |
+
view.addRenderAttribute( item._id + '-button', 'href', item.link.url);
|
1713 |
+
|
1714 |
+
if ( item.link.is_external !== "" ) {
|
1715 |
+
view.addRenderAttribute( item._id + '-button', 'target', '_blank' );
|
1716 |
+
}
|
1717 |
+
}
|
1718 |
+
|
1719 |
+
#>
|
1720 |
+
|
1721 |
+
<div class="elementor-repeater-item-{{{ item._id }}} overwrite-style-{{{ item.style_indv }}} eae-flip-box-wrapper ">
|
1722 |
+
<div class="eae-flip-box-inner" >
|
1723 |
+
|
1724 |
+
<div class="eae-flip-box-front">
|
1725 |
+
<div class="flipbox-content">
|
1726 |
+
|
1727 |
+
<# if(item.front_box_element == "icon") {
|
1728 |
+
if(item.front_icon !== ""){ #>
|
1729 |
+
<div {{{ view.getRenderAttributeString( item._id + '-front-icon-wrapper' ) }}}>
|
1730 |
+
<i {{{ view.getRenderAttributeString( item._id + '-front-icon' ) }}}></i>
|
1731 |
+
</div>
|
1732 |
+
<# } } #>
|
1733 |
+
<# if(item.front_box_element == "image"){
|
1734 |
+
if(item.front_box_image.url !="")
|
1735 |
+
{ #>
|
1736 |
+
<img src='{{{ item.front_box_image.url }}}'>
|
1737 |
+
<# }
|
1738 |
+
}#>
|
1739 |
+
|
1740 |
+
<# if(item.front_title !== "" ){ #>
|
1741 |
+
<{{{ item.front_title_html_tag }}} {{{ view.getRenderAttributeString( item._id + '-front-icon-title' ) }}} >
|
1742 |
+
{{{ item.front_title }}}
|
1743 |
+
</{{{ item.front_title_html_tag }}}>
|
1744 |
+
<# } #>
|
1745 |
+
|
1746 |
+
<# if(item.front_text !== ""){ #>
|
1747 |
+
<p>
|
1748 |
+
{{{ item.front_text }}}
|
1749 |
+
</p>
|
1750 |
+
<# } #>
|
1751 |
+
|
1752 |
+
|
1753 |
+
</div>
|
1754 |
+
</div>
|
1755 |
+
|
1756 |
+
<div class="eae-flip-box-back">
|
1757 |
+
<div class="flipbox-content">
|
1758 |
+
<# if(item.back_box_element == "icon") { #>
|
1759 |
+
<# if(item.back_icon !== "" ){ #>
|
1760 |
+
<div {{{ view.getRenderAttributeString( item._id + '-back-icon-wrapper' ) }}}>
|
1761 |
+
<i {{{ view.getRenderAttributeString( item._id + '-back-icon' ) }}}></i>
|
1762 |
+
</div>
|
1763 |
+
<# } } #>
|
1764 |
+
<# if(item.back_box_element == "image"){
|
1765 |
+
if(item.back_box_image.url !="")
|
1766 |
+
{ #>
|
1767 |
+
<img src='{{{ item.back_box_image.url }}}'>
|
1768 |
+
<# }
|
1769 |
+
} #>
|
1770 |
+
<# if(item.back_title !== "" ){ #>
|
1771 |
+
<{{{ item.back_title_html_tag }}} {{{ view.getRenderAttributeString( 'back-icon-title' ) }}} >
|
1772 |
+
{{{ item.back_title }}}
|
1773 |
+
</{{{ item.back_title_html_tag }}}>
|
1774 |
+
<# } #>
|
1775 |
+
|
1776 |
+
<# if(item.back_text !== ""){ #>
|
1777 |
+
<p>
|
1778 |
+
{{{ item.back_text }}}
|
1779 |
+
</p>
|
1780 |
+
<# } #>
|
1781 |
+
|
1782 |
+
<# if(item.action_text !== ""){ #>
|
1783 |
+
<div class="eae-fb-button-wrapper">
|
1784 |
+
<a {{{ view.getRenderAttributeString( item._id + '-button' ) }}}>
|
1785 |
+
<span class="elementor-button-text">{{{ item.action_text }}}</span>
|
1786 |
+
</a>
|
1787 |
+
</div>
|
1788 |
+
<# } #>
|
1789 |
+
</div>
|
1790 |
+
</div>
|
1791 |
+
</div>
|
1792 |
+
</div>
|
1793 |
+
|
1794 |
+
|
1795 |
+
<# } } #>
|
1796 |
+
</div>
|
1797 |
+
<?php
|
1798 |
+
}
|
1799 |
+
}
|
1800 |
Plugin::instance()->widgets_manager->register_widget_type( new Widget_FlipBoxSet() );
|
elements/flipbox.php
CHANGED
@@ -1,841 +1,853 @@
|
|
1 |
-
<?php
|
2 |
-
namespace Elementor;
|
3 |
-
|
4 |
-
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
5 |
-
|
6 |
-
class Widget_FlipBox extends Widget_Base {
|
7 |
-
|
8 |
-
public function get_name() {
|
9 |
-
return 'wts-flipbox';
|
10 |
-
}
|
11 |
-
|
12 |
-
public function get_title() {
|
13 |
-
return __( 'EAE - Flip Box', '
|
14 |
-
}
|
15 |
-
|
16 |
-
public function get_icon() {
|
17 |
-
return 'eicon-flip-box wts-eae-pe';
|
18 |
-
}
|
19 |
-
|
20 |
-
public function get_categories() {
|
21 |
-
return [ 'wts-eae' ];
|
22 |
-
}
|
23 |
-
|
24 |
-
protected function _register_controls() {
|
25 |
-
|
26 |
-
$this->start_controls_section(
|
27 |
-
'section_front_box',
|
28 |
-
[
|
29 |
-
'label' => __( 'Front Box', '
|
30 |
-
]
|
31 |
-
);
|
32 |
-
|
33 |
-
$this->add_control(
|
34 |
-
'front_icon',
|
35 |
-
[
|
36 |
-
'label' => __( 'Icon', '
|
37 |
-
'type' => Controls_Manager::ICON,
|
38 |
-
'label_block' => true,
|
39 |
-
'default' => 'fa fa-star',
|
40 |
-
]
|
41 |
-
);
|
42 |
-
|
43 |
-
$this->add_control(
|
44 |
-
'front_icon_view',
|
45 |
-
[
|
46 |
-
'label' => __( 'View', '
|
47 |
-
'type' => Controls_Manager::SELECT,
|
48 |
-
'options' => [
|
49 |
-
'default' => __( 'Default', '
|
50 |
-
'stacked' => __( 'Stacked', '
|
51 |
-
'framed' => __( 'Framed', '
|
52 |
-
],
|
53 |
-
'default' => 'default',
|
54 |
-
|
55 |
-
]
|
56 |
-
);
|
57 |
-
|
58 |
-
$this->add_control(
|
59 |
-
'front_icon_shape',
|
60 |
-
[
|
61 |
-
'label' => __( 'Shape', '
|
62 |
-
'type' => Controls_Manager::SELECT,
|
63 |
-
'options' => [
|
64 |
-
'circle' => __( 'Circle', '
|
65 |
-
'square' => __( 'Square', '
|
66 |
-
],
|
67 |
-
'default' => 'circle',
|
68 |
-
'condition' => [
|
69 |
-
'front_icon_view!' => 'default',
|
70 |
-
],
|
71 |
-
|
72 |
-
]
|
73 |
-
);
|
74 |
-
|
75 |
-
$this->add_control(
|
76 |
-
'front_title',
|
77 |
-
[
|
78 |
-
'label' => __( 'Title', '
|
79 |
-
'type' => Controls_Manager::TEXT,
|
80 |
-
'dynamic' => [
|
81 |
-
'active' => true,
|
82 |
-
],
|
83 |
-
'placeholder' => __( 'Enter text', '
|
84 |
-
'default' => __( 'Text Title', '
|
85 |
-
]
|
86 |
-
);
|
87 |
-
|
88 |
-
$this->add_control(
|
89 |
-
'front_title_html_tag',
|
90 |
-
[
|
91 |
-
'label' => __( 'HTML Tag', '
|
92 |
-
'type' => Controls_Manager::SELECT,
|
93 |
-
'options' => [
|
94 |
-
'h1' => __( 'H1', '
|
95 |
-
'h2' => __( 'H2', '
|
96 |
-
'h3' => __( 'H3', '
|
97 |
-
'h4' => __( 'H4', '
|
98 |
-
'h5' => __( 'H5', '
|
99 |
-
'h6' => __( 'H6', '
|
100 |
-
],
|
101 |
-
'default' => 'h3',
|
102 |
-
]
|
103 |
-
);
|
104 |
-
|
105 |
-
$this->add_control(
|
106 |
-
'front-text',
|
107 |
-
[
|
108 |
-
'label' => __( 'Text', '
|
109 |
-
'type' => Controls_Manager::TEXTAREA,
|
110 |
-
'dynamic' => [
|
111 |
-
'active' => true,
|
112 |
-
],
|
113 |
-
'placeholder' => __( 'Enter text', '
|
114 |
-
'default' => __( 'Add some nice text here.', '
|
115 |
-
]
|
116 |
-
);
|
117 |
-
|
118 |
-
$this->end_controls_section();
|
119 |
-
|
120 |
-
$this->start_controls_section(
|
121 |
-
'section_back_box',
|
122 |
-
[
|
123 |
-
'label' => __( 'Back Box', '
|
124 |
-
]
|
125 |
-
);
|
126 |
-
|
127 |
-
$this->add_control(
|
128 |
-
'back_icon',
|
129 |
-
[
|
130 |
-
'label' => __( 'Icon', '
|
131 |
-
'type' => Controls_Manager::ICON,
|
132 |
-
'label_block' => true,
|
133 |
-
'default' => 'fa fa-star',
|
134 |
-
]
|
135 |
-
);
|
136 |
-
|
137 |
-
$this->add_control(
|
138 |
-
'back_icon_view',
|
139 |
-
[
|
140 |
-
'label' => __( 'View', '
|
141 |
-
'type' => Controls_Manager::SELECT,
|
142 |
-
'options' => [
|
143 |
-
'default' => __( 'Default', '
|
144 |
-
'stacked' => __( 'Stacked', '
|
145 |
-
'framed' => __( 'Framed', '
|
146 |
-
],
|
147 |
-
'default' => 'default',
|
148 |
-
|
149 |
-
]
|
150 |
-
);
|
151 |
-
|
152 |
-
$this->add_control(
|
153 |
-
'back_icon_shape',
|
154 |
-
[
|
155 |
-
'label' => __( 'Shape', '
|
156 |
-
'type' => Controls_Manager::SELECT,
|
157 |
-
'options' => [
|
158 |
-
'circle' => __( 'Circle', '
|
159 |
-
'square' => __( 'Square', '
|
160 |
-
],
|
161 |
-
'default' => 'circle',
|
162 |
-
'condition' => [
|
163 |
-
'back_icon_view!' => 'default',
|
164 |
-
],
|
165 |
-
|
166 |
-
]
|
167 |
-
);
|
168 |
-
|
169 |
-
$this->add_control(
|
170 |
-
'back_title',
|
171 |
-
[
|
172 |
-
'label' => __( 'Title', '
|
173 |
-
'type' => Controls_Manager::TEXT,
|
174 |
-
'dynamic' => [
|
175 |
-
'active' => true,
|
176 |
-
],
|
177 |
-
'placeholder' => __( 'Enter text', '
|
178 |
-
'default' => __( 'Text Title', '
|
179 |
-
]
|
180 |
-
);
|
181 |
-
|
182 |
-
$this->add_control(
|
183 |
-
'back_title_html_tag',
|
184 |
-
[
|
185 |
-
'label' => __( 'HTML Tag', '
|
186 |
-
'type' => Controls_Manager::SELECT,
|
187 |
-
'options' => [
|
188 |
-
'h1' => __( 'H1', '
|
189 |
-
'h2' => __( 'H2', '
|
190 |
-
'h3' => __( 'H3', '
|
191 |
-
'h4' => __( 'H4', '
|
192 |
-
'h5' => __( 'H5', '
|
193 |
-
'h6' => __( 'H6', '
|
194 |
-
],
|
195 |
-
'default' => 'h3',
|
196 |
-
]
|
197 |
-
);
|
198 |
-
|
199 |
-
$this->add_control(
|
200 |
-
'back_text',
|
201 |
-
[
|
202 |
-
'label' => __( 'Text', '
|
203 |
-
'type' => Controls_Manager::TEXTAREA,
|
204 |
-
'dynamic' => [
|
205 |
-
'active' => true,
|
206 |
-
],
|
207 |
-
'placeholder' => __( 'Enter text', '
|
208 |
-
'default' => __( 'Add some nice text here.', '
|
209 |
-
]
|
210 |
-
);
|
211 |
-
|
212 |
-
$this->end_controls_section();
|
213 |
-
|
214 |
-
|
215 |
-
$this->start_controls_section(
|
216 |
-
'section-action-button',
|
217 |
-
[
|
218 |
-
'label' => __( 'Action Button', '
|
219 |
-
]
|
220 |
-
);
|
221 |
-
|
222 |
-
$this->add_control(
|
223 |
-
'action_text',
|
224 |
-
[
|
225 |
-
'label' => __( 'Button Text', '
|
226 |
-
'type' => Controls_Manager::TEXT,
|
227 |
-
'placeholder' => __( 'Buy', '
|
228 |
-
'default' => __( 'Buy Now', '
|
229 |
-
]
|
230 |
-
);
|
231 |
-
|
232 |
-
$this->add_control(
|
233 |
-
'link',
|
234 |
-
[
|
235 |
-
'label' => __( 'Link to', '
|
236 |
-
'type' => Controls_Manager::URL,
|
237 |
-
'dynamic' => [
|
238 |
-
'active' => true,
|
239 |
-
],
|
240 |
-
'placeholder' => __( 'http://your-link.com', '
|
241 |
-
'separator' => 'before',
|
242 |
-
]
|
243 |
-
);
|
244 |
-
|
245 |
-
$this->end_controls_section();
|
246 |
-
|
247 |
-
$this->start_controls_section(
|
248 |
-
'section-general-style',
|
249 |
-
[
|
250 |
-
'label' => __( 'General', '
|
251 |
-
'tab' => Controls_Manager::TAB_STYLE
|
252 |
-
]
|
253 |
-
);
|
254 |
-
|
255 |
-
$this->add_control(
|
256 |
-
'animation_style',
|
257 |
-
[
|
258 |
-
'label' => __( 'Animation Style', '
|
259 |
-
'type' => Controls_Manager::SELECT,
|
260 |
-
'options' => [
|
261 |
-
'horizontal'
|
262 |
-
'vertical'
|
263 |
-
'fade'
|
264 |
-
|
265 |
-
|
266 |
-
|
267 |
-
|
268 |
-
|
269 |
-
|
270 |
-
|
271 |
-
|
272 |
-
|
273 |
-
|
274 |
-
|
275 |
-
|
276 |
-
|
277 |
-
|
278 |
-
|
279 |
-
|
280 |
-
|
281 |
-
|
282 |
-
|
283 |
-
|
284 |
-
[
|
285 |
-
'
|
286 |
-
'
|
287 |
-
'
|
288 |
-
|
289 |
-
|
290 |
-
|
291 |
-
|
292 |
-
|
293 |
-
|
294 |
-
|
295 |
-
|
296 |
-
|
297 |
-
|
298 |
-
|
299 |
-
|
300 |
-
|
301 |
-
|
302 |
-
|
303 |
-
|
304 |
-
|
305 |
-
|
306 |
-
|
307 |
-
|
308 |
-
|
309 |
-
|
310 |
-
|
311 |
-
|
312 |
-
|
313 |
-
|
314 |
-
|
315 |
-
|
316 |
-
|
317 |
-
|
318 |
-
|
319 |
-
|
320 |
-
|
321 |
-
|
322 |
-
|
323 |
-
|
324 |
-
|
325 |
-
|
326 |
-
|
327 |
-
|
328 |
-
|
329 |
-
|
330 |
-
|
331 |
-
|
332 |
-
|
333 |
-
|
334 |
-
|
335 |
-
|
336 |
-
|
337 |
-
|
338 |
-
|
339 |
-
|
340 |
-
|
341 |
-
|
342 |
-
|
343 |
-
|
344 |
-
|
345 |
-
|
346 |
-
|
347 |
-
|
348 |
-
|
349 |
-
|
350 |
-
|
351 |
-
|
352 |
-
|
353 |
-
|
354 |
-
|
355 |
-
|
356 |
-
|
357 |
-
|
358 |
-
|
359 |
-
|
360 |
-
|
361 |
-
|
362 |
-
|
363 |
-
|
364 |
-
|
365 |
-
|
366 |
-
|
367 |
-
|
368 |
-
|
369 |
-
|
370 |
-
|
371 |
-
|
372 |
-
|
373 |
-
|
374 |
-
|
375 |
-
|
376 |
-
|
377 |
-
|
378 |
-
|
379 |
-
|
380 |
-
|
381 |
-
|
382 |
-
|
383 |
-
|
384 |
-
|
385 |
-
|
386 |
-
|
387 |
-
|
388 |
-
|
389 |
-
|
390 |
-
|
391 |
-
|
392 |
-
|
393 |
-
|
394 |
-
|
395 |
-
|
396 |
-
|
397 |
-
|
398 |
-
|
399 |
-
|
400 |
-
|
401 |
-
|
402 |
-
|
403 |
-
|
404 |
-
|
405 |
-
|
406 |
-
|
407 |
-
|
408 |
-
|
409 |
-
|
410 |
-
|
411 |
-
|
412 |
-
'
|
413 |
-
|
414 |
-
|
415 |
-
|
416 |
-
'
|
417 |
-
],
|
418 |
-
|
419 |
-
|
420 |
-
|
421 |
-
|
422 |
-
|
423 |
-
|
424 |
-
|
425 |
-
|
426 |
-
|
427 |
-
|
428 |
-
|
429 |
-
|
430 |
-
|
431 |
-
|
432 |
-
|
433 |
-
|
434 |
-
|
435 |
-
|
436 |
-
|
437 |
-
|
438 |
-
|
439 |
-
|
440 |
-
|
441 |
-
|
442 |
-
|
443 |
-
|
444 |
-
|
445 |
-
|
446 |
-
'
|
447 |
-
'
|
448 |
-
'
|
449 |
-
|
450 |
-
|
451 |
-
|
452 |
-
|
453 |
-
|
454 |
-
|
455 |
-
|
456 |
-
|
457 |
-
|
458 |
-
|
459 |
-
|
460 |
-
|
461 |
-
|
462 |
-
|
463 |
-
|
464 |
-
|
465 |
-
|
466 |
-
|
467 |
-
|
468 |
-
|
469 |
-
|
470 |
-
|
471 |
-
|
472 |
-
|
473 |
-
|
474 |
-
|
475 |
-
|
476 |
-
|
477 |
-
'
|
478 |
-
'
|
479 |
-
],
|
480 |
-
|
481 |
-
|
482 |
-
|
483 |
-
|
484 |
-
|
485 |
-
|
486 |
-
|
487 |
-
|
488 |
-
|
489 |
-
|
490 |
-
|
491 |
-
|
492 |
-
|
493 |
-
|
494 |
-
|
495 |
-
|
496 |
-
|
497 |
-
|
498 |
-
|
499 |
-
|
500 |
-
|
501 |
-
|
502 |
-
|
503 |
-
|
504 |
-
|
505 |
-
|
506 |
-
|
507 |
-
|
508 |
-
|
509 |
-
|
510 |
-
|
511 |
-
|
512 |
-
|
513 |
-
|
514 |
-
|
515 |
-
|
516 |
-
|
517 |
-
|
518 |
-
|
519 |
-
|
520 |
-
|
521 |
-
|
522 |
-
|
523 |
-
|
524 |
-
|
525 |
-
|
526 |
-
|
527 |
-
|
528 |
-
|
529 |
-
|
530 |
-
|
531 |
-
|
532 |
-
|
533 |
-
|
534 |
-
|
535 |
-
|
536 |
-
|
537 |
-
|
538 |
-
|
539 |
-
|
540 |
-
|
541 |
-
|
542 |
-
|
543 |
-
|
544 |
-
|
545 |
-
|
546 |
-
|
547 |
-
|
548 |
-
|
549 |
-
|
550 |
-
|
551 |
-
|
552 |
-
|
553 |
-
|
554 |
-
|
555 |
-
|
556 |
-
|
557 |
-
|
558 |
-
|
559 |
-
|
560 |
-
|
561 |
-
|
562 |
-
|
563 |
-
|
564 |
-
|
565 |
-
|
566 |
-
|
567 |
-
|
568 |
-
|
569 |
-
|
570 |
-
|
571 |
-
|
572 |
-
|
573 |
-
|
574 |
-
|
575 |
-
|
576 |
-
|
577 |
-
|
578 |
-
|
579 |
-
|
580 |
-
|
581 |
-
|
582 |
-
|
583 |
-
|
584 |
-
|
585 |
-
|
586 |
-
|
587 |
-
|
588 |
-
|
589 |
-
|
590 |
-
'
|
591 |
-
|
592 |
-
|
593 |
-
|
594 |
-
'
|
595 |
-
],
|
596 |
-
|
597 |
-
|
598 |
-
|
599 |
-
|
600 |
-
|
601 |
-
|
602 |
-
|
603 |
-
|
604 |
-
|
605 |
-
|
606 |
-
|
607 |
-
|
608 |
-
|
609 |
-
|
610 |
-
|
611 |
-
|
612 |
-
|
613 |
-
|
614 |
-
|
615 |
-
|
616 |
-
|
617 |
-
|
618 |
-
|
619 |
-
|
620 |
-
|
621 |
-
|
622 |
-
|
623 |
-
|
624 |
-
'
|
625 |
-
'
|
626 |
-
'
|
627 |
-
|
628 |
-
|
629 |
-
|
630 |
-
|
631 |
-
|
632 |
-
|
633 |
-
|
634 |
-
|
635 |
-
|
636 |
-
|
637 |
-
|
638 |
-
|
639 |
-
|
640 |
-
|
641 |
-
|
642 |
-
|
643 |
-
|
644 |
-
|
645 |
-
|
646 |
-
|
647 |
-
|
648 |
-
|
649 |
-
|
650 |
-
|
651 |
-
|
652 |
-
|
653 |
-
|
654 |
-
|
655 |
-
'
|
656 |
-
'
|
657 |
-
],
|
658 |
-
|
659 |
-
|
660 |
-
|
661 |
-
|
662 |
-
|
663 |
-
|
664 |
-
|
665 |
-
|
666 |
-
|
667 |
-
|
668 |
-
|
669 |
-
|
670 |
-
|
671 |
-
|
672 |
-
|
673 |
-
|
674 |
-
|
675 |
-
|
676 |
-
|
677 |
-
|
678 |
-
|
679 |
-
|
680 |
-
|
681 |
-
|
682 |
-
|
683 |
-
|
684 |
-
|
685 |
-
|
686 |
-
|
687 |
-
[
|
688 |
-
'
|
689 |
-
'
|
690 |
-
'
|
691 |
-
'
|
692 |
-
|
693 |
-
|
694 |
-
|
695 |
-
|
696 |
-
|
697 |
-
|
698 |
-
|
699 |
-
|
700 |
-
'
|
701 |
-
|
702 |
-
|
703 |
-
|
704 |
-
|
705 |
-
|
706 |
-
|
707 |
-
|
708 |
-
|
709 |
-
|
710 |
-
|
711 |
-
|
712 |
-
|
713 |
-
|
714 |
-
|
715 |
-
|
716 |
-
'
|
717 |
-
'
|
718 |
-
|
719 |
-
|
720 |
-
|
721 |
-
|
722 |
-
|
723 |
-
|
724 |
-
|
725 |
-
|
726 |
-
'
|
727 |
-
'
|
728 |
-
'
|
729 |
-
|
730 |
-
|
731 |
-
]
|
732 |
-
);
|
733 |
-
|
734 |
-
$this->add_control(
|
735 |
-
'
|
736 |
-
[
|
737 |
-
'label' => __( '
|
738 |
-
'type' => Controls_Manager::DIMENSIONS,
|
739 |
-
'size_units' => [ 'px', '
|
740 |
-
'selectors' => [
|
741 |
-
'{{WRAPPER}} .eae-fb-button' => '
|
742 |
-
],
|
743 |
-
]
|
744 |
-
);
|
745 |
-
|
746 |
-
|
747 |
-
|
748 |
-
|
749 |
-
|
750 |
-
|
751 |
-
|
752 |
-
|
753 |
-
|
754 |
-
|
755 |
-
|
756 |
-
|
757 |
-
|
758 |
-
|
759 |
-
$this->
|
760 |
-
|
761 |
-
|
762 |
-
|
763 |
-
|
764 |
-
|
765 |
-
|
766 |
-
|
767 |
-
|
768 |
-
$this->
|
769 |
-
|
770 |
-
|
771 |
-
$this->add_render_attribute(
|
772 |
-
|
773 |
-
|
774 |
-
|
775 |
-
|
776 |
-
|
777 |
-
|
778 |
-
|
779 |
-
|
780 |
-
|
781 |
-
|
782 |
-
|
783 |
-
|
784 |
-
|
785 |
-
|
786 |
-
|
787 |
-
|
788 |
-
|
789 |
-
|
790 |
-
|
791 |
-
|
792 |
-
|
793 |
-
|
794 |
-
|
795 |
-
|
796 |
-
|
797 |
-
|
798 |
-
<?php if(!empty($settings['
|
799 |
-
<
|
800 |
-
<?php echo $
|
801 |
-
</
|
802 |
-
<?php } ?>
|
803 |
-
|
804 |
-
|
805 |
-
|
806 |
-
|
807 |
-
|
808 |
-
<?php
|
809 |
-
|
810 |
-
|
811 |
-
|
812 |
-
|
813 |
-
|
814 |
-
<?php
|
815 |
-
|
816 |
-
|
817 |
-
|
818 |
-
|
819 |
-
|
820 |
-
<?php if(!empty($settings['
|
821 |
-
<
|
822 |
-
<?php echo $
|
823 |
-
</
|
824 |
-
<?php } ?>
|
825 |
-
|
826 |
-
<?php if(!empty($settings['
|
827 |
-
|
828 |
-
|
829 |
-
|
830 |
-
|
831 |
-
|
832 |
-
<?php
|
833 |
-
|
834 |
-
|
835 |
-
|
836 |
-
|
837 |
-
|
838 |
-
|
839 |
-
|
840 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
841 |
Plugin::instance()->widgets_manager->register_widget_type( new Widget_FlipBox() );
|
1 |
+
<?php
|
2 |
+
namespace Elementor;
|
3 |
+
|
4 |
+
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
5 |
+
|
6 |
+
class Widget_FlipBox extends Widget_Base {
|
7 |
+
|
8 |
+
public function get_name() {
|
9 |
+
return 'wts-flipbox';
|
10 |
+
}
|
11 |
+
|
12 |
+
public function get_title() {
|
13 |
+
return __( 'EAE - Flip Box', 'wts-eae' );
|
14 |
+
}
|
15 |
+
|
16 |
+
public function get_icon() {
|
17 |
+
return 'eicon-flip-box wts-eae-pe';
|
18 |
+
}
|
19 |
+
|
20 |
+
public function get_categories() {
|
21 |
+
return [ 'wts-eae' ];
|
22 |
+
}
|
23 |
+
|
24 |
+
protected function _register_controls() {
|
25 |
+
|
26 |
+
$this->start_controls_section(
|
27 |
+
'section_front_box',
|
28 |
+
[
|
29 |
+
'label' => __( 'Front Box', 'wts-eae' )
|
30 |
+
]
|
31 |
+
);
|
32 |
+
|
33 |
+
$this->add_control(
|
34 |
+
'front_icon',
|
35 |
+
[
|
36 |
+
'label' => __( 'Icon', 'wts-eae' ),
|
37 |
+
'type' => Controls_Manager::ICON,
|
38 |
+
'label_block' => true,
|
39 |
+
'default' => 'fa fa-star',
|
40 |
+
]
|
41 |
+
);
|
42 |
+
|
43 |
+
$this->add_control(
|
44 |
+
'front_icon_view',
|
45 |
+
[
|
46 |
+
'label' => __( 'View', 'wts-eae' ),
|
47 |
+
'type' => Controls_Manager::SELECT,
|
48 |
+
'options' => [
|
49 |
+
'default' => __( 'Default', 'wts-eae' ),
|
50 |
+
'stacked' => __( 'Stacked', 'wts-eae' ),
|
51 |
+
'framed' => __( 'Framed', 'wts-eae' ),
|
52 |
+
],
|
53 |
+
'default' => 'default',
|
54 |
+
|
55 |
+
]
|
56 |
+
);
|
57 |
+
|
58 |
+
$this->add_control(
|
59 |
+
'front_icon_shape',
|
60 |
+
[
|
61 |
+
'label' => __( 'Shape', 'wts-eae' ),
|
62 |
+
'type' => Controls_Manager::SELECT,
|
63 |
+
'options' => [
|
64 |
+
'circle' => __( 'Circle', 'wts-eae' ),
|
65 |
+
'square' => __( 'Square', 'wts-eae' ),
|
66 |
+
],
|
67 |
+
'default' => 'circle',
|
68 |
+
'condition' => [
|
69 |
+
'front_icon_view!' => 'default',
|
70 |
+
],
|
71 |
+
|
72 |
+
]
|
73 |
+
);
|
74 |
+
|
75 |
+
$this->add_control(
|
76 |
+
'front_title',
|
77 |
+
[
|
78 |
+
'label' => __( 'Title', 'wts-eae' ),
|
79 |
+
'type' => Controls_Manager::TEXT,
|
80 |
+
'dynamic' => [
|
81 |
+
'active' => true,
|
82 |
+
],
|
83 |
+
'placeholder' => __( 'Enter text', 'wts-eae' ),
|
84 |
+
'default' => __( 'Text Title', 'wts-eae' ),
|
85 |
+
]
|
86 |
+
);
|
87 |
+
|
88 |
+
$this->add_control(
|
89 |
+
'front_title_html_tag',
|
90 |
+
[
|
91 |
+
'label' => __( 'HTML Tag', 'wts-eae' ),
|
92 |
+
'type' => Controls_Manager::SELECT,
|
93 |
+
'options' => [
|
94 |
+
'h1' => __( 'H1', 'wts-eae' ),
|
95 |
+
'h2' => __( 'H2', 'wts-eae' ),
|
96 |
+
'h3' => __( 'H3', 'wts-eae' ),
|
97 |
+
'h4' => __( 'H4', 'wts-eae' ),
|
98 |
+
'h5' => __( 'H5', 'wts-eae' ),
|
99 |
+
'h6' => __( 'H6', 'wts-eae' )
|
100 |
+
],
|
101 |
+
'default' => 'h3',
|
102 |
+
]
|
103 |
+
);
|
104 |
+
|
105 |
+
$this->add_control(
|
106 |
+
'front-text',
|
107 |
+
[
|
108 |
+
'label' => __( 'Text', 'wts-eae' ),
|
109 |
+
'type' => Controls_Manager::TEXTAREA,
|
110 |
+
'dynamic' => [
|
111 |
+
'active' => true,
|
112 |
+
],
|
113 |
+
'placeholder' => __( 'Enter text', 'wts-eae' ),
|
114 |
+
'default' => __( 'Add some nice text here.', 'wts-eae' ),
|
115 |
+
]
|
116 |
+
);
|
117 |
+
|
118 |
+
$this->end_controls_section();
|
119 |
+
|
120 |
+
$this->start_controls_section(
|
121 |
+
'section_back_box',
|
122 |
+
[
|
123 |
+
'label' => __( 'Back Box', 'wts-eae' )
|
124 |
+
]
|
125 |
+
);
|
126 |
+
|
127 |
+
$this->add_control(
|
128 |
+
'back_icon',
|
129 |
+
[
|
130 |
+
'label' => __( 'Icon', 'wts-eae' ),
|
131 |
+
'type' => Controls_Manager::ICON,
|
132 |
+
'label_block' => true,
|
133 |
+
'default' => 'fa fa-star',
|
134 |
+
]
|
135 |
+
);
|
136 |
+
|
137 |
+
$this->add_control(
|
138 |
+
'back_icon_view',
|
139 |
+
[
|
140 |
+
'label' => __( 'View', 'wts-eae' ),
|
141 |
+
'type' => Controls_Manager::SELECT,
|
142 |
+
'options' => [
|
143 |
+
'default' => __( 'Default', 'wts-eae' ),
|
144 |
+
'stacked' => __( 'Stacked', 'wts-eae' ),
|
145 |
+
'framed' => __( 'Framed', 'wts-eae' ),
|
146 |
+
],
|
147 |
+
'default' => 'default',
|
148 |
+
|
149 |
+
]
|
150 |
+
);
|
151 |
+
|
152 |
+
$this->add_control(
|
153 |
+
'back_icon_shape',
|
154 |
+
[
|
155 |
+
'label' => __( 'Shape', 'wts-eae' ),
|
156 |
+
'type' => Controls_Manager::SELECT,
|
157 |
+
'options' => [
|
158 |
+
'circle' => __( 'Circle', 'wts-eae' ),
|
159 |
+
'square' => __( 'Square', 'wts-eae' ),
|
160 |
+
],
|
161 |
+
'default' => 'circle',
|
162 |
+
'condition' => [
|
163 |
+
'back_icon_view!' => 'default',
|
164 |
+
],
|
165 |
+
|
166 |
+
]
|
167 |
+
);
|
168 |
+
|
169 |
+
$this->add_control(
|
170 |
+
'back_title',
|
171 |
+
[
|
172 |
+
'label' => __( 'Title', 'wts-eae' ),
|
173 |
+
'type' => Controls_Manager::TEXT,
|
174 |
+
'dynamic' => [
|
175 |
+
'active' => true,
|
176 |
+
],
|
177 |
+
'placeholder' => __( 'Enter text', 'wts-eae' ),
|
178 |
+
'default' => __( 'Text Title', 'wts-eae' ),
|
179 |
+
]
|
180 |
+
);
|
181 |
+
|
182 |
+
$this->add_control(
|
183 |
+
'back_title_html_tag',
|
184 |
+
[
|
185 |
+
'label' => __( 'HTML Tag', 'wts-eae' ),
|
186 |
+
'type' => Controls_Manager::SELECT,
|
187 |
+
'options' => [
|
188 |
+
'h1' => __( 'H1', 'wts-eae' ),
|
189 |
+
'h2' => __( 'H2', 'wts-eae' ),
|
190 |
+
'h3' => __( 'H3', 'wts-eae' ),
|
191 |
+
'h4' => __( 'H4', 'wts-eae' ),
|
192 |
+
'h5' => __( 'H5', 'wts-eae' ),
|
193 |
+
'h6' => __( 'H6', 'wts-eae' )
|
194 |
+
],
|
195 |
+
'default' => 'h3',
|
196 |
+
]
|
197 |
+
);
|
198 |
+
|
199 |
+
$this->add_control(
|
200 |
+
'back_text',
|
201 |
+
[
|
202 |
+
'label' => __( 'Text', 'wts-eae' ),
|
203 |
+
'type' => Controls_Manager::TEXTAREA,
|
204 |
+
'dynamic' => [
|
205 |
+
'active' => true,
|
206 |
+
],
|
207 |
+
'placeholder' => __( 'Enter text', 'wts-eae' ),
|
208 |
+
'default' => __( 'Add some nice text here.', 'wts-eae' ),
|
209 |
+
]
|
210 |
+
);
|
211 |
+
|
212 |
+
$this->end_controls_section();
|
213 |
+
|
214 |
+
|
215 |
+
$this->start_controls_section(
|
216 |
+
'section-action-button',
|
217 |
+
[
|
218 |
+
'label' => __( 'Action Button', 'wts-eae' ),
|
219 |
+
]
|
220 |
+
);
|
221 |
+
|
222 |
+
$this->add_control(
|
223 |
+
'action_text',
|
224 |
+
[
|
225 |
+
'label' => __( 'Button Text', 'wts-eae' ),
|
226 |
+
'type' => Controls_Manager::TEXT,
|
227 |
+
'placeholder' => __( 'Buy', 'wts-eae' ),
|
228 |
+
'default' => __( 'Buy Now', 'wts-eae' ),
|
229 |
+
]
|
230 |
+
);
|
231 |
+
|
232 |
+
$this->add_control(
|
233 |
+
'link',
|
234 |
+
[
|
235 |
+
'label' => __( 'Link to', 'wts-eae' ),
|
236 |
+
'type' => Controls_Manager::URL,
|
237 |
+
'dynamic' => [
|
238 |
+
'active' => true,
|
239 |
+
],
|
240 |
+
'placeholder' => __( 'http://your-link.com', 'wts-eae' ),
|
241 |
+
'separator' => 'before',
|
242 |
+
]
|
243 |
+
);
|
244 |
+
|
245 |
+
$this->end_controls_section();
|
246 |
+
|
247 |
+
$this->start_controls_section(
|
248 |
+
'section-general-style',
|
249 |
+
[
|
250 |
+
'label' => __( 'General', 'wts-eae' ),
|
251 |
+
'tab' => Controls_Manager::TAB_STYLE
|
252 |
+
]
|
253 |
+
);
|
254 |
+
|
255 |
+
$this->add_control(
|
256 |
+
'animation_style',
|
257 |
+
[
|
258 |
+
'label' => __( 'Animation Style', 'wts-eae' ),
|
259 |
+
'type' => Controls_Manager::SELECT,
|
260 |
+
'options' => [
|
261 |
+
'horizontal' => __( 'Flip Horizontal', 'wts-eae' ),
|
262 |
+
'vertical' => __( 'Flip Vertical', 'wts-eae' ),
|
263 |
+
'fade' => __( 'Fade','wts-eae'),
|
264 |
+
'flipcard flipcard-rotate-top-down' => __( 'Cube - Top Down', 'wts-eae' ),
|
265 |
+
'flipcard flipcard-rotate-down-top' => __( 'Cube - Down Top', 'wts-eae' ),
|
266 |
+
//'flipcard flipcard-rotate-left-right' => __( 'Cube - Left Right', 'wts-eae' ),
|
267 |
+
//'flipcard flipcard-rotate-right-left' => __( 'Cube - Right Left', 'wts-eae' ),
|
268 |
+
'flip box' => __( 'Flip Box','wts-eae'),
|
269 |
+
'flip box fade' => __( 'Flip Box Fade','wts-eae'),
|
270 |
+
'flip box fade up' => __( 'Fade Up','wts-eae'),
|
271 |
+
'flip box fade hideback' => __( 'Fade Hideback','wts-eae'),
|
272 |
+
'flip box fade up hideback' => __( 'Fade Up Hideback','wts-eae'),
|
273 |
+
'nananana' => __( 'Nananana','wts-eae'),
|
274 |
+
'' => __( 'Rollover','wts-eae'),
|
275 |
+
],
|
276 |
+
'default' => 'vertical',
|
277 |
+
'prefix_class' => 'eae-fb-animate-'
|
278 |
+
]
|
279 |
+
);
|
280 |
+
|
281 |
+
|
282 |
+
$this->add_group_control(
|
283 |
+
Group_Control_Border::get_type(),
|
284 |
+
[
|
285 |
+
'name' => 'flip_box_border',
|
286 |
+
'label' => __( 'Box Border', 'wts-eae' ),
|
287 |
+
'selector' => '{{WRAPPER}} .eae-flip-box-inner > div',
|
288 |
+
]
|
289 |
+
);
|
290 |
+
|
291 |
+
|
292 |
+
|
293 |
+
$this->add_control(
|
294 |
+
'box_border_radius',
|
295 |
+
[
|
296 |
+
'label' => __( 'Border Radius', 'wts-eae' ),
|
297 |
+
'type' => Controls_Manager::DIMENSIONS,
|
298 |
+
'size_units' => [ 'px', '%' ],
|
299 |
+
'selectors' => [
|
300 |
+
'{{WRAPPER}} .eae-flip-box-front' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
301 |
+
'{{WRAPPER}} .eae-flip-box-back' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
302 |
+
],
|
303 |
+
]
|
304 |
+
);
|
305 |
+
|
306 |
+
$this->add_control(
|
307 |
+
'box_height',
|
308 |
+
[
|
309 |
+
'type' => Controls_Manager::TEXT,
|
310 |
+
'label' => __( 'Box Height', 'wts-eae' ),
|
311 |
+
'placeholder' => __( '250', 'wts-eae' ),
|
312 |
+
'default' => __( '250', 'wts-eae' ),
|
313 |
+
'selectors' => [
|
314 |
+
'{{WRAPPER}} .eae-flip-box-inner' => 'height: {{VALUE}}px;',
|
315 |
+
'{{WRAPPER}}.eae-fb-animate-flipcard .eae-flip-box-front' => 'transform-origin: center center calc(-{{VALUE}}px/2);-webkit-transform-origin:center center calc(-{{VALUE}}px/2);',
|
316 |
+
'{{WRAPPER}}.eae-fb-animate-flipcard .eae-flip-box-back' => 'transform-origin: center center calc(-{{VALUE }}px/2);-webkit-transform-origin:center center calc(-{{VALUE}}px/2);'
|
317 |
+
],
|
318 |
+
]
|
319 |
+
);
|
320 |
+
|
321 |
+
$this->end_controls_section();
|
322 |
+
|
323 |
+
$this->start_controls_section(
|
324 |
+
'section-front-box-style',
|
325 |
+
[
|
326 |
+
'label' => __( 'Front Box', 'wts-eae' ),
|
327 |
+
'tab' => Controls_Manager::TAB_STYLE
|
328 |
+
]
|
329 |
+
);
|
330 |
+
|
331 |
+
$this->add_group_control(
|
332 |
+
Group_Control_Background::get_type(),
|
333 |
+
[
|
334 |
+
'name' => 'front_box_background',
|
335 |
+
'label' => __( 'Front Box Background', 'wts-eae' ),
|
336 |
+
'types' => [ 'classic','gradient' ],
|
337 |
+
'selector' => '{{WRAPPER}} .eae-flip-box-front',
|
338 |
+
]
|
339 |
+
);
|
340 |
+
|
341 |
+
|
342 |
+
$this->add_control(
|
343 |
+
'front_box_title_color',
|
344 |
+
[
|
345 |
+
'label' => __( 'Title', 'wts-eae' ),
|
346 |
+
'type' => Controls_Manager::COLOR,
|
347 |
+
'scheme' => [
|
348 |
+
'type' => Scheme_Color::get_type(),
|
349 |
+
'value' => Scheme_Color::COLOR_1,
|
350 |
+
],
|
351 |
+
'default' => '#FFF',
|
352 |
+
'selectors' => [
|
353 |
+
'{{WRAPPER}} .front-icon-title' => 'color: {{VALUE}};',
|
354 |
+
],
|
355 |
+
'condition' => [
|
356 |
+
'front_title!' => ''
|
357 |
+
],
|
358 |
+
]
|
359 |
+
);
|
360 |
+
|
361 |
+
$this->add_group_control(
|
362 |
+
Group_Control_Typography::get_type(),
|
363 |
+
[
|
364 |
+
'name' => 'front_box_title_typography',
|
365 |
+
'label' => __( 'Title Typography', 'wts-eae' ),
|
366 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
367 |
+
'selector' => '{{WRAPPER}} .front-icon-title',
|
368 |
+
]
|
369 |
+
);
|
370 |
+
|
371 |
+
$this->add_control(
|
372 |
+
'front_box_text_color',
|
373 |
+
[
|
374 |
+
'label' => __( 'Description Color', 'wts-eae' ),
|
375 |
+
'type' => Controls_Manager::COLOR,
|
376 |
+
'scheme' => [
|
377 |
+
'type' => Scheme_Color::get_type(),
|
378 |
+
'value' => Scheme_Color::COLOR_1,
|
379 |
+
],
|
380 |
+
'default' => '#FFF',
|
381 |
+
'selectors' => [
|
382 |
+
'{{WRAPPER}} .eae-flip-box-front p' => 'color: {{VALUE}};',
|
383 |
+
],
|
384 |
+
|
385 |
+
]
|
386 |
+
);
|
387 |
+
|
388 |
+
$this->add_group_control(
|
389 |
+
Group_Control_Typography::get_type(),
|
390 |
+
[
|
391 |
+
'name' => 'front_box_text_typography',
|
392 |
+
'label' => __( 'Description Typography', 'wts-eae' ),
|
393 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
394 |
+
'selector' => '{{WRAPPER}} .eae-flip-box-front p',
|
395 |
+
]
|
396 |
+
);
|
397 |
+
|
398 |
+
|
399 |
+
/**
|
400 |
+
* Front Box icons styles
|
401 |
+
**/
|
402 |
+
$this->add_control(
|
403 |
+
'front_box_icon_color',
|
404 |
+
[
|
405 |
+
'label' => __( 'Icon Color', 'wts-eae' ),
|
406 |
+
'type' => Controls_Manager::COLOR,
|
407 |
+
'scheme' => [
|
408 |
+
'type' => Scheme_Color::get_type(),
|
409 |
+
'value' => Scheme_Color::COLOR_1,
|
410 |
+
],
|
411 |
+
'default' => '#FFF',
|
412 |
+
'selectors' => [
|
413 |
+
'{{WRAPPER}} .eae-flip-box-front .icon-wrapper i' => 'color: {{VALUE}};',
|
414 |
+
],
|
415 |
+
'condition' => [
|
416 |
+
'front_icon!' => ''
|
417 |
+
],
|
418 |
+
]
|
419 |
+
);
|
420 |
+
|
421 |
+
$this->add_control(
|
422 |
+
'front_box_icon_fill_color',
|
423 |
+
[
|
424 |
+
'label' => __( 'Icon Fill Color', 'wts-eae' ),
|
425 |
+
'type' => Controls_Manager::COLOR,
|
426 |
+
'scheme' => [
|
427 |
+
'type' => Scheme_Color::get_type(),
|
428 |
+
'value' => Scheme_Color::COLOR_1,
|
429 |
+
],
|
430 |
+
'default' => '#92BE43',
|
431 |
+
'selectors' => [
|
432 |
+
'{{WRAPPER}} .eae-fb-icon-view-stacked' => 'background-color: {{VALUE}};',
|
433 |
+
],
|
434 |
+
'condition' => [
|
435 |
+
'front_icon_view' => 'stacked'
|
436 |
+
],
|
437 |
+
]
|
438 |
+
);
|
439 |
+
|
440 |
+
$this->add_group_control(
|
441 |
+
Group_Control_Border::get_type(),
|
442 |
+
[
|
443 |
+
'name' => 'front_box_icon_border',
|
444 |
+
'label' => __( 'Box Border', 'wts-eae' ),
|
445 |
+
'placeholder' => '1px',
|
446 |
+
'default' => '1px',
|
447 |
+
'selector' => '{{WRAPPER}} .eae-flip-box-front .eae-fb-icon-view-framed, {{WRAPPER}} .eae-flip-box-front .eae-fb-icon-view-stacked',
|
448 |
+
'label_block' => true,
|
449 |
+
'condition' => [
|
450 |
+
'front_icon_view!' => 'default'
|
451 |
+
],
|
452 |
+
]
|
453 |
+
);
|
454 |
+
|
455 |
+
$this->add_control(
|
456 |
+
'front_icon_size',
|
457 |
+
[
|
458 |
+
'label' => __( 'Icon Size', 'wts-eae' ),
|
459 |
+
'type' => Controls_Manager::SLIDER,
|
460 |
+
'range' => [
|
461 |
+
'px' => [
|
462 |
+
'min' => 6,
|
463 |
+
'max' => 300,
|
464 |
+
],
|
465 |
+
],
|
466 |
+
'selectors' => [
|
467 |
+
'{{WRAPPER}} .eae-flip-box-front .icon-wrapper i' => 'font-size: {{SIZE}}{{UNIT}};',
|
468 |
+
],
|
469 |
+
]
|
470 |
+
);
|
471 |
+
|
472 |
+
$this->add_control(
|
473 |
+
'front_icon_padding',
|
474 |
+
[
|
475 |
+
'label' => __( 'Icon Padding', 'wts-eae' ),
|
476 |
+
'type' => Controls_Manager::SLIDER,
|
477 |
+
'selectors' => [
|
478 |
+
'{{WRAPPER}} .eae-flip-box-front .icon-wrapper' => 'padding: {{SIZE}}{{UNIT}};',
|
479 |
+
],
|
480 |
+
'default' => [
|
481 |
+
'size' => 1.5,
|
482 |
+
'unit' => 'em',
|
483 |
+
],
|
484 |
+
'range' => [
|
485 |
+
'em' => [
|
486 |
+
'min' => 0,
|
487 |
+
],
|
488 |
+
],
|
489 |
+
'condition' => [
|
490 |
+
'front_icon_view!' => 'default',
|
491 |
+
],
|
492 |
+
]
|
493 |
+
);
|
494 |
+
|
495 |
+
|
496 |
+
|
497 |
+
|
498 |
+
|
499 |
+
$this->end_controls_section();
|
500 |
+
|
501 |
+
|
502 |
+
|
503 |
+
$this->start_controls_section(
|
504 |
+
'section-back-box-style',
|
505 |
+
[
|
506 |
+
'label' => __( 'Back Box', 'wts-eae' ),
|
507 |
+
'tab' => Controls_Manager::TAB_STYLE
|
508 |
+
]
|
509 |
+
);
|
510 |
+
|
511 |
+
|
512 |
+
$this->add_group_control(
|
513 |
+
Group_Control_Background::get_type(),
|
514 |
+
[
|
515 |
+
'name' => 'back_box_background',
|
516 |
+
'label' => __( 'Back Box Background', 'wts-eae' ),
|
517 |
+
'types' => [ 'classic','gradient' ],
|
518 |
+
'selector' => '{{WRAPPER}} .eae-flip-box-back',
|
519 |
+
]
|
520 |
+
);
|
521 |
+
|
522 |
+
$this->add_control(
|
523 |
+
'back_box_title_color',
|
524 |
+
[
|
525 |
+
'label' => __( 'Title', 'wts-eae' ),
|
526 |
+
'type' => Controls_Manager::COLOR,
|
527 |
+
'scheme' => [
|
528 |
+
'type' => Scheme_Color::get_type(),
|
529 |
+
'value' => Scheme_Color::COLOR_1,
|
530 |
+
],
|
531 |
+
'default' => '#FFF',
|
532 |
+
'selectors' => [
|
533 |
+
'{{WRAPPER}} .back-icon-title' => 'color: {{VALUE}};',
|
534 |
+
],
|
535 |
+
|
536 |
+
]
|
537 |
+
);
|
538 |
+
|
539 |
+
$this->add_group_control(
|
540 |
+
Group_Control_Typography::get_type(),
|
541 |
+
[
|
542 |
+
'name' => 'back_box_title_typography',
|
543 |
+
'label' => __( 'Title Typography', 'wts-eae' ),
|
544 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
545 |
+
'selector' => '{{WRAPPER}} .back-icon-title',
|
546 |
+
]
|
547 |
+
);
|
548 |
+
|
549 |
+
$this->add_control(
|
550 |
+
'back_box_text_color',
|
551 |
+
[
|
552 |
+
'label' => __( 'Description Color', 'wts-eae' ),
|
553 |
+
'type' => Controls_Manager::COLOR,
|
554 |
+
'scheme' => [
|
555 |
+
'type' => Scheme_Color::get_type(),
|
556 |
+
'value' => Scheme_Color::COLOR_1,
|
557 |
+
],
|
558 |
+
'default' => '#FFF',
|
559 |
+
'selectors' => [
|
560 |
+
'{{WRAPPER}} .eae-flip-box-back p' => 'color: {{VALUE}};',
|
561 |
+
],
|
562 |
+
|
563 |
+
]
|
564 |
+
);
|
565 |
+
|
566 |
+
$this->add_group_control(
|
567 |
+
Group_Control_Typography::get_type(),
|
568 |
+
[
|
569 |
+
'name' => 'back_box_text_typography',
|
570 |
+
'label' => __( 'Description Typography', 'wts-eae' ),
|
571 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
572 |
+
'selector' => '{{WRAPPER}} .eae-flip-box-back p',
|
573 |
+
]
|
574 |
+
);
|
575 |
+
|
576 |
+
|
577 |
+
/**
|
578 |
+
* Back Box icons styles
|
579 |
+
**/
|
580 |
+
$this->add_control(
|
581 |
+
'back_box_icon_color',
|
582 |
+
[
|
583 |
+
'label' => __( 'Icon Color', 'wts-eae' ),
|
584 |
+
'type' => Controls_Manager::COLOR,
|
585 |
+
'scheme' => [
|
586 |
+
'type' => Scheme_Color::get_type(),
|
587 |
+
'value' => Scheme_Color::COLOR_1,
|
588 |
+
],
|
589 |
+
'default' => '#FFF',
|
590 |
+
'selectors' => [
|
591 |
+
'{{WRAPPER}} .eae-flip-box-back .icon-wrapper i' => 'color: {{VALUE}};',
|
592 |
+
],
|
593 |
+
'condition' => [
|
594 |
+
'back_icon!' => ''
|
595 |
+
],
|
596 |
+
]
|
597 |
+
);
|
598 |
+
|
599 |
+
$this->add_control(
|
600 |
+
'back_box_icon_fill_color',
|
601 |
+
[
|
602 |
+
'label' => __( 'Icon Fill Color', 'wts-eae' ),
|
603 |
+
'type' => Controls_Manager::COLOR,
|
604 |
+
'scheme' => [
|
605 |
+
'type' => Scheme_Color::get_type(),
|
606 |
+
'value' => Scheme_Color::COLOR_1,
|
607 |
+
],
|
608 |
+
'default' => '#92BE43',
|
609 |
+
'selectors' => [
|
610 |
+
'{{WRAPPER}} .eae-flip-box-back .eae-fb-icon-view-stacked' => 'background-color: {{VALUE}};',
|
611 |
+
],
|
612 |
+
'condition' => [
|
613 |
+
'front_icon_view' => 'stacked'
|
614 |
+
],
|
615 |
+
]
|
616 |
+
);
|
617 |
+
|
618 |
+
$this->add_group_control(
|
619 |
+
Group_Control_Border::get_type(),
|
620 |
+
[
|
621 |
+
'name' => 'back_box_icon_border',
|
622 |
+
'label' => __( 'Box Border', 'wts-eae' ),
|
623 |
+
'placeholder' => '1px',
|
624 |
+
'default' => '1px',
|
625 |
+
'selector' => '{{WRAPPER}} .eae-flip-box-back .eae-fb-icon-view-framed, {{WRAPPER}} .eae-flip-box-back .eae-fb-icon-view-stacked',
|
626 |
+
'label_block' => true,
|
627 |
+
'condition' => [
|
628 |
+
'back_icon_view!' => 'default'
|
629 |
+
],
|
630 |
+
]
|
631 |
+
);
|
632 |
+
|
633 |
+
$this->add_control(
|
634 |
+
'back_icon_size',
|
635 |
+
[
|
636 |
+
'label' => __( 'Icon Size', 'wts-eae' ),
|
637 |
+
'type' => Controls_Manager::SLIDER,
|
638 |
+
'range' => [
|
639 |
+
'px' => [
|
640 |
+
'min' => 6,
|
641 |
+
'max' => 300,
|
642 |
+
],
|
643 |
+
],
|
644 |
+
'selectors' => [
|
645 |
+
'{{WRAPPER}} .eae-flip-box-back .icon-wrapper i' => 'font-size: {{SIZE}}{{UNIT}};',
|
646 |
+
],
|
647 |
+
]
|
648 |
+
);
|
649 |
+
|
650 |
+
$this->add_control(
|
651 |
+
'back_icon_padding',
|
652 |
+
[
|
653 |
+
'label' => __( 'Icon Padding', 'wts-eae' ),
|
654 |
+
'type' => Controls_Manager::SLIDER,
|
655 |
+
'selectors' => [
|
656 |
+
'{{WRAPPER}} .eae-flip-box-back .icon-wrapper' => 'padding: {{SIZE}}{{UNIT}};',
|
657 |
+
],
|
658 |
+
'default' => [
|
659 |
+
'size' => 1.5,
|
660 |
+
'unit' => 'em',
|
661 |
+
],
|
662 |
+
'range' => [
|
663 |
+
'em' => [
|
664 |
+
'min' => 0,
|
665 |
+
],
|
666 |
+
],
|
667 |
+
'condition' => [
|
668 |
+
'back_icon_view!' => 'default',
|
669 |
+
],
|
670 |
+
]
|
671 |
+
);
|
672 |
+
|
673 |
+
|
674 |
+
|
675 |
+
$this->end_controls_section();
|
676 |
+
|
677 |
+
$this->start_controls_section(
|
678 |
+
'section-action-button-style',
|
679 |
+
[
|
680 |
+
'label' => __( 'Action Button', 'wts-eae' ),
|
681 |
+
'tab' => Controls_Manager::TAB_STYLE,
|
682 |
+
]
|
683 |
+
);
|
684 |
+
|
685 |
+
$this->add_control(
|
686 |
+
'button_text_color',
|
687 |
+
[
|
688 |
+
'label' => __( 'Text Color', 'wts-eae' ),
|
689 |
+
'type' => Controls_Manager::COLOR,
|
690 |
+
'default' => '#fff',
|
691 |
+
'selectors' => [
|
692 |
+
'{{WRAPPER}} .eae-fb-button' => 'color: {{VALUE}};',
|
693 |
+
],
|
694 |
+
]
|
695 |
+
);
|
696 |
+
|
697 |
+
$this->add_group_control(
|
698 |
+
Group_Control_Typography::get_type(),
|
699 |
+
[
|
700 |
+
'name' => 'typography',
|
701 |
+
'label' => __( 'Typography', 'wts-eae' ),
|
702 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
703 |
+
'selector' => '{{WRAPPER}} .eae-fb-button',
|
704 |
+
]
|
705 |
+
);
|
706 |
+
|
707 |
+
$this->add_control(
|
708 |
+
'background_color',
|
709 |
+
[
|
710 |
+
'label' => __( 'Background Color', 'wts-eae' ),
|
711 |
+
'type' => Controls_Manager::COLOR,
|
712 |
+
'scheme' => [
|
713 |
+
'type' => Scheme_Color::get_type(),
|
714 |
+
'value' => Scheme_Color::COLOR_4,
|
715 |
+
],
|
716 |
+
'default' => '#93C64F',
|
717 |
+
'selectors' => [
|
718 |
+
'{{WRAPPER}} .eae-fb-button' => 'background-color: {{VALUE}};',
|
719 |
+
],
|
720 |
+
]
|
721 |
+
);
|
722 |
+
|
723 |
+
$this->add_group_control(
|
724 |
+
Group_Control_Border::get_type(),
|
725 |
+
[
|
726 |
+
'name' => 'border',
|
727 |
+
'label' => __( 'Border', 'wts-eae' ),
|
728 |
+
'placeholder' => '1px',
|
729 |
+
'default' => '1px',
|
730 |
+
'selector' => '{{WRAPPER}} .eae-fb-button',
|
731 |
+
]
|
732 |
+
);
|
733 |
+
|
734 |
+
$this->add_control(
|
735 |
+
'border_radius',
|
736 |
+
[
|
737 |
+
'label' => __( 'Border Radius', 'wts-eae' ),
|
738 |
+
'type' => Controls_Manager::DIMENSIONS,
|
739 |
+
'size_units' => [ 'px', '%' ],
|
740 |
+
'selectors' => [
|
741 |
+
'{{WRAPPER}} .eae-fb-button' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
742 |
+
],
|
743 |
+
]
|
744 |
+
);
|
745 |
+
|
746 |
+
$this->add_control(
|
747 |
+
'text_padding',
|
748 |
+
[
|
749 |
+
'label' => __( 'Text Padding', 'wts-eae' ),
|
750 |
+
'type' => Controls_Manager::DIMENSIONS,
|
751 |
+
'size_units' => [ 'px', 'em', '%' ],
|
752 |
+
'selectors' => [
|
753 |
+
'{{WRAPPER}} .eae-fb-button' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
754 |
+
],
|
755 |
+
]
|
756 |
+
);
|
757 |
+
|
758 |
+
|
759 |
+
$this->end_controls_section();
|
760 |
+
|
761 |
+
|
762 |
+
|
763 |
+
|
764 |
+
|
765 |
+
}
|
766 |
+
|
767 |
+
protected function render( ) {
|
768 |
+
$settings = $this->get_settings_for_display();
|
769 |
+
|
770 |
+
$this->add_render_attribute('front-icon-wrapper','class','icon-wrapper');
|
771 |
+
$this->add_render_attribute('front-icon-wrapper','class','eae-fb-icon-view-'.$settings['front_icon_view']);
|
772 |
+
$this->add_render_attribute('front-icon-wrapper','class','eae-fb-icon-shape-'.$settings['front_icon_shape']);
|
773 |
+
$this->add_render_attribute('front-icon-title','class','front-icon-title');
|
774 |
+
$this->add_render_attribute('front-icon','class',$settings['front_icon']);
|
775 |
+
|
776 |
+
|
777 |
+
$this->add_render_attribute('back-icon-wrapper','class','icon-wrapper');
|
778 |
+
$this->add_render_attribute('back-icon-wrapper','class','eae-fb-icon-view-'.$settings['back_icon_view']);
|
779 |
+
$this->add_render_attribute('back-icon-wrapper','class','eae-fb-icon-shape-'.$settings['back_icon_shape']);
|
780 |
+
$this->add_render_attribute('back-icon-title','class','back-icon-title');
|
781 |
+
$this->add_render_attribute('back-icon','class',$settings['back_icon']);
|
782 |
+
|
783 |
+
$this->add_render_attribute( 'button', 'class', 'eae-fb-button' );
|
784 |
+
if ( ! empty( $settings['link']['url'] ) ) {
|
785 |
+
$this->add_render_attribute( 'button', 'href', $settings['link']['url'] );
|
786 |
+
|
787 |
+
if ( ! empty( $settings['link']['is_external'] ) ) {
|
788 |
+
$this->add_render_attribute( 'button', 'target', '_blank' );
|
789 |
+
}
|
790 |
+
}
|
791 |
+
|
792 |
+
?>
|
793 |
+
<div class="eae-flip-box-wrapper">
|
794 |
+
<div class="eae-flip-box-inner">
|
795 |
+
|
796 |
+
<div class="eae-flip-box-front">
|
797 |
+
<div class="flipbox-content">
|
798 |
+
<?php if(!empty($settings['front_icon'])){ ?>
|
799 |
+
<div <?php echo $this->get_render_attribute_string( 'front-icon-wrapper' ); ?>>
|
800 |
+
<i <?php echo $this->get_render_attribute_string( 'front-icon' ); ?>></i>
|
801 |
+
</div>
|
802 |
+
<?php } ?>
|
803 |
+
|
804 |
+
<?php if(!empty($settings['front_title'])){ ?>
|
805 |
+
<<?php echo $settings['front_title_html_tag']; ?> <?php echo $this->get_render_attribute_string( 'front-icon-title' ); ?> >
|
806 |
+
<?php echo $settings['front_title']; ?>
|
807 |
+
</<?php echo $settings['front_title_html_tag']; ?>>
|
808 |
+
<?php } ?>
|
809 |
+
|
810 |
+
<?php if(!empty($settings['front-text'])){ ?>
|
811 |
+
<p>
|
812 |
+
<?php echo $settings['front-text']; ?>
|
813 |
+
</p>
|
814 |
+
<?php } ?>
|
815 |
+
</div>
|
816 |
+
</div>
|
817 |
+
|
818 |
+
<div class="eae-flip-box-back">
|
819 |
+
<div class="flipbox-content">
|
820 |
+
<?php if(!empty($settings['back_icon'])){ ?>
|
821 |
+
<div <?php echo $this->get_render_attribute_string( 'back-icon-wrapper' ); ?>>
|
822 |
+
<i <?php echo $this->get_render_attribute_string( 'back-icon' ); ?>></i>
|
823 |
+
</div>
|
824 |
+
<?php } ?>
|
825 |
+
|
826 |
+
<?php if(!empty($settings['back_title'])){ ?>
|
827 |
+
<<?php echo $settings['back_title_html_tag']; ?> <?php echo $this->get_render_attribute_string( 'back-icon-title' ); ?> >
|
828 |
+
<?php echo $settings['back_title']; ?>
|
829 |
+
</<?php echo $settings['back_title_html_tag']; ?>>
|
830 |
+
<?php } ?>
|
831 |
+
|
832 |
+
<?php if(!empty($settings['back_text'])){ ?>
|
833 |
+
<p>
|
834 |
+
<?php echo $settings['back_text']; ?>
|
835 |
+
</p>
|
836 |
+
<?php } ?>
|
837 |
+
|
838 |
+
<?php if(!empty($settings['action_text'])){ ?>
|
839 |
+
<div class="eae-fb-button-wrapper">
|
840 |
+
<a <?php echo $this->get_render_attribute_string( 'button' ); ?>>
|
841 |
+
<span class="elementor-button-text"><?php echo $settings['action_text']; ?></span>
|
842 |
+
</a>
|
843 |
+
</div>
|
844 |
+
<?php } ?>
|
845 |
+
</div>
|
846 |
+
</div>
|
847 |
+
|
848 |
+
</div>
|
849 |
+
</div>
|
850 |
+
<?php
|
851 |
+
}
|
852 |
+
}
|
853 |
Plugin::instance()->widgets_manager->register_widget_type( new Widget_FlipBox() );
|
elements/gmap.php
CHANGED
@@ -1,203 +1,217 @@
|
|
1 |
-
<?php
|
2 |
-
namespace EAE;
|
3 |
-
|
4 |
-
use Elementor\Repeater;
|
5 |
-
use Elementor\Widget_Base;
|
6 |
-
use Elementor\Controls_Manager;
|
7 |
-
use Elementor\Plugin;
|
8 |
-
|
9 |
-
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
10 |
-
|
11 |
-
class Widget_TextSeparator extends Widget_Base {
|
12 |
-
|
13 |
-
public function get_name() {
|
14 |
-
return 'wts-gmap';
|
15 |
-
}
|
16 |
-
|
17 |
-
public function get_title() {
|
18 |
-
return __( 'EAE - Google Map', 'wts-eae' );
|
19 |
-
}
|
20 |
-
|
21 |
-
public function get_icon() {
|
22 |
-
return 'eicon-google-maps wts-eae-map';
|
23 |
-
}
|
24 |
-
|
25 |
-
|
26 |
-
public function get_categories() {
|
27 |
-
return [ 'wts-eae' ];
|
28 |
-
}
|
29 |
-
|
30 |
-
public function get_script_depends() {
|
31 |
-
return ['eae-gmap'];
|
32 |
-
}
|
33 |
-
|
34 |
-
|
35 |
-
protected function _register_controls() {
|
36 |
-
|
37 |
-
$this->start_controls_section(
|
38 |
-
'general',
|
39 |
-
[
|
40 |
-
'label' => __('General', 'wts-eae')
|
41 |
-
]
|
42 |
-
);
|
43 |
-
|
44 |
-
|
45 |
-
$map_key = get_option('wts_eae_gmap_key');
|
46 |
-
if(!isset($map_key) || $map_key == ''){
|
47 |
-
$this->add_control(
|
48 |
-
'notice',
|
49 |
-
[
|
50 |
-
'type' => Controls_Manager::RAW_HTML,
|
51 |
-
'raw' => '<div class="eae-notice">
|
52 |
-
<a target="_blank" href="'.admin_url('admin.php?page=eae').'">Click Here</a> to add google map api key.
|
53 |
-
</div>'
|
54 |
-
]
|
55 |
-
);
|
56 |
-
}
|
57 |
-
|
58 |
-
|
59 |
-
$repeater = new Repeater();
|
60 |
-
|
61 |
-
$repeater->add_control(
|
62 |
-
'lat',
|
63 |
-
[
|
64 |
-
'label' => __('Latitude', 'wts-eae'),
|
65 |
-
'type' => Controls_Manager::TEXT,
|
66 |
-
'placeholder' => __('Enter latitude value here', 'wts-eae')
|
67 |
-
]
|
68 |
-
);
|
69 |
-
|
70 |
-
$repeater->add_control(
|
71 |
-
'long',
|
72 |
-
[
|
73 |
-
'label' => __('Longitude', 'wts-eae'),
|
74 |
-
'type' => Controls_Manager::TEXT,
|
75 |
-
'placeholder' => __('Enter latitude value here', 'wts-eae')
|
76 |
-
]
|
77 |
-
);
|
78 |
-
|
79 |
-
$repeater->add_control(
|
80 |
-
'address',
|
81 |
-
[
|
82 |
-
'label' => __('Address', 'wts-eae'),
|
83 |
-
'type' => Controls_Manager::WYSIWYG,
|
84 |
-
'placeholder' => __('Enter address', 'wts-eae')
|
85 |
-
]
|
86 |
-
);
|
87 |
-
|
88 |
-
$repeater->add_control(
|
89 |
-
'icon',
|
90 |
-
[
|
91 |
-
'label' => __('Icon', 'wts-eae'),
|
92 |
-
'type' => Controls_Manager::MEDIA
|
93 |
-
]
|
94 |
-
);
|
95 |
-
|
96 |
-
$repeater->add_control(
|
97 |
-
'icon_size',
|
98 |
-
[
|
99 |
-
'label' => __('Icon Size', 'wts-eae'),
|
100 |
-
'type' => Controls_Manager::SLIDER,
|
101 |
-
'range' => [
|
102 |
-
'px' => [
|
103 |
-
'min' => 20,
|
104 |
-
'max' => 200,
|
105 |
-
],
|
106 |
-
],
|
107 |
-
'default' => [
|
108 |
-
'size' => 50,
|
109 |
-
'unit' => 'px',
|
110 |
-
]
|
111 |
-
]
|
112 |
-
);
|
113 |
-
|
114 |
-
$this->add_control('markers',
|
115 |
-
[
|
116 |
-
'label' => __('Markers', 'wts-eae'),
|
117 |
-
'type' => Controls_Manager::REPEATER,
|
118 |
-
'fields' => array_values($repeater->get_controls()),
|
119 |
-
'default' => [
|
120 |
-
[
|
121 |
-
'lat' => '28.612912',
|
122 |
-
'long' => '77.229510',
|
123 |
-
'address' => __('Put Address Here', 'wts-eae')
|
124 |
-
]
|
125 |
-
]
|
126 |
-
]
|
127 |
-
);
|
128 |
-
|
129 |
-
$this->add_responsive_control(
|
130 |
-
'height',
|
131 |
-
[
|
132 |
-
'label' => __('Height','wts-eae'),
|
133 |
-
'type' => Controls_Manager::NUMBER,
|
134 |
-
'default' => 200,
|
135 |
-
'selectors' => [
|
136 |
-
'{{WRAPPER}} .eae-markers' => 'height:{{VALUE}}px'
|
137 |
-
]
|
138 |
-
]
|
139 |
-
);
|
140 |
-
$this->add_control(
|
141 |
-
'zoom',
|
142 |
-
[
|
143 |
-
'label' => __('Zoom','wts-eae'),
|
144 |
-
'type' => Controls_Manager::SLIDER,
|
145 |
-
'range' => [
|
146 |
-
'px' => [
|
147 |
-
'min' => 6,
|
148 |
-
'max' => 20,
|
149 |
-
]
|
150 |
-
],
|
151 |
-
'default' => [
|
152 |
-
'unit' => 'px',
|
153 |
-
'size' => 10,
|
154 |
-
],
|
155 |
-
]
|
156 |
-
);
|
157 |
-
|
158 |
-
|
159 |
-
|
160 |
-
|
161 |
-
|
162 |
-
|
163 |
-
|
164 |
-
|
165 |
-
|
166 |
-
|
167 |
-
|
168 |
-
|
169 |
-
|
170 |
-
|
171 |
-
|
172 |
-
|
173 |
-
|
174 |
-
|
175 |
-
|
176 |
-
|
177 |
-
|
178 |
-
|
179 |
-
|
180 |
-
|
181 |
-
|
182 |
-
|
183 |
-
|
184 |
-
|
185 |
-
|
186 |
-
|
187 |
-
|
188 |
-
|
189 |
-
|
190 |
-
|
191 |
-
|
192 |
-
|
193 |
-
|
194 |
-
|
195 |
-
|
196 |
-
|
197 |
-
|
198 |
-
|
199 |
-
|
200 |
-
|
201 |
-
|
202 |
-
|
203 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
<?php
|
2 |
+
namespace EAE;
|
3 |
+
|
4 |
+
use Elementor\Repeater;
|
5 |
+
use Elementor\Widget_Base;
|
6 |
+
use Elementor\Controls_Manager;
|
7 |
+
use Elementor\Plugin;
|
8 |
+
|
9 |
+
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
10 |
+
|
11 |
+
class Widget_TextSeparator extends Widget_Base {
|
12 |
+
|
13 |
+
public function get_name() {
|
14 |
+
return 'wts-gmap';
|
15 |
+
}
|
16 |
+
|
17 |
+
public function get_title() {
|
18 |
+
return __( 'EAE - Google Map', 'wts-eae' );
|
19 |
+
}
|
20 |
+
|
21 |
+
public function get_icon() {
|
22 |
+
return 'eicon-google-maps wts-eae-map';
|
23 |
+
}
|
24 |
+
|
25 |
+
|
26 |
+
public function get_categories() {
|
27 |
+
return [ 'wts-eae' ];
|
28 |
+
}
|
29 |
+
|
30 |
+
public function get_script_depends() {
|
31 |
+
return ['eae-gmap'];
|
32 |
+
}
|
33 |
+
|
34 |
+
|
35 |
+
protected function _register_controls() {
|
36 |
+
|
37 |
+
$this->start_controls_section(
|
38 |
+
'general',
|
39 |
+
[
|
40 |
+
'label' => __('General', 'wts-eae')
|
41 |
+
]
|
42 |
+
);
|
43 |
+
|
44 |
+
|
45 |
+
$map_key = get_option('wts_eae_gmap_key');
|
46 |
+
if(!isset($map_key) || $map_key == ''){
|
47 |
+
$this->add_control(
|
48 |
+
'notice',
|
49 |
+
[
|
50 |
+
'type' => Controls_Manager::RAW_HTML,
|
51 |
+
'raw' => '<div class="eae-notice">
|
52 |
+
<a target="_blank" href="'.admin_url('admin.php?page=eae').'">Click Here</a> to add google map api key.
|
53 |
+
</div>'
|
54 |
+
]
|
55 |
+
);
|
56 |
+
}
|
57 |
+
|
58 |
+
|
59 |
+
$repeater = new Repeater();
|
60 |
+
|
61 |
+
$repeater->add_control(
|
62 |
+
'lat',
|
63 |
+
[
|
64 |
+
'label' => __('Latitude', 'wts-eae'),
|
65 |
+
'type' => Controls_Manager::TEXT,
|
66 |
+
'placeholder' => __('Enter latitude value here', 'wts-eae')
|
67 |
+
]
|
68 |
+
);
|
69 |
+
|
70 |
+
$repeater->add_control(
|
71 |
+
'long',
|
72 |
+
[
|
73 |
+
'label' => __('Longitude', 'wts-eae'),
|
74 |
+
'type' => Controls_Manager::TEXT,
|
75 |
+
'placeholder' => __('Enter latitude value here', 'wts-eae')
|
76 |
+
]
|
77 |
+
);
|
78 |
+
|
79 |
+
$repeater->add_control(
|
80 |
+
'address',
|
81 |
+
[
|
82 |
+
'label' => __('Address', 'wts-eae'),
|
83 |
+
'type' => Controls_Manager::WYSIWYG,
|
84 |
+
'placeholder' => __('Enter address', 'wts-eae')
|
85 |
+
]
|
86 |
+
);
|
87 |
+
|
88 |
+
$repeater->add_control(
|
89 |
+
'icon',
|
90 |
+
[
|
91 |
+
'label' => __('Icon', 'wts-eae'),
|
92 |
+
'type' => Controls_Manager::MEDIA
|
93 |
+
]
|
94 |
+
);
|
95 |
+
|
96 |
+
$repeater->add_control(
|
97 |
+
'icon_size',
|
98 |
+
[
|
99 |
+
'label' => __('Icon Size', 'wts-eae'),
|
100 |
+
'type' => Controls_Manager::SLIDER,
|
101 |
+
'range' => [
|
102 |
+
'px' => [
|
103 |
+
'min' => 20,
|
104 |
+
'max' => 200,
|
105 |
+
],
|
106 |
+
],
|
107 |
+
'default' => [
|
108 |
+
'size' => 50,
|
109 |
+
'unit' => 'px',
|
110 |
+
]
|
111 |
+
]
|
112 |
+
);
|
113 |
+
|
114 |
+
$this->add_control('markers',
|
115 |
+
[
|
116 |
+
'label' => __('Markers', 'wts-eae'),
|
117 |
+
'type' => Controls_Manager::REPEATER,
|
118 |
+
'fields' => array_values($repeater->get_controls()),
|
119 |
+
'default' => [
|
120 |
+
[
|
121 |
+
'lat' => '28.612912',
|
122 |
+
'long' => '77.229510',
|
123 |
+
'address' => __('Put Address Here', 'wts-eae')
|
124 |
+
]
|
125 |
+
]
|
126 |
+
]
|
127 |
+
);
|
128 |
+
|
129 |
+
$this->add_responsive_control(
|
130 |
+
'height',
|
131 |
+
[
|
132 |
+
'label' => __('Height','wts-eae'),
|
133 |
+
'type' => Controls_Manager::NUMBER,
|
134 |
+
'default' => 200,
|
135 |
+
'selectors' => [
|
136 |
+
'{{WRAPPER}} .eae-markers' => 'height:{{VALUE}}px'
|
137 |
+
]
|
138 |
+
]
|
139 |
+
);
|
140 |
+
$this->add_control(
|
141 |
+
'zoom',
|
142 |
+
[
|
143 |
+
'label' => __('Zoom','wts-eae'),
|
144 |
+
'type' => Controls_Manager::SLIDER,
|
145 |
+
'range' => [
|
146 |
+
'px' => [
|
147 |
+
'min' => 6,
|
148 |
+
'max' => 20,
|
149 |
+
]
|
150 |
+
],
|
151 |
+
'default' => [
|
152 |
+
'unit' => 'px',
|
153 |
+
'size' => 10,
|
154 |
+
],
|
155 |
+
]
|
156 |
+
);
|
157 |
+
|
158 |
+
$this->add_control(
|
159 |
+
'animate',
|
160 |
+
[
|
161 |
+
'label' => __('Animate Marker' , 'wts-eae'),
|
162 |
+
'type' => Controls_Manager::SWITCHER,
|
163 |
+
'default' => '',
|
164 |
+
'label_on' => __( 'Yes', 'wts-eae' ),
|
165 |
+
'label_off' => __( 'No', 'wts-eae' ),
|
166 |
+
'return_value' => 'yes',
|
167 |
+
]
|
168 |
+
);
|
169 |
+
|
170 |
+
|
171 |
+
|
172 |
+
$this->add_control(
|
173 |
+
'snazzy_style',
|
174 |
+
[
|
175 |
+
'label' => __( 'Snazzy Style', 'wts-eae' ),
|
176 |
+
'type' => Controls_Manager::TEXTAREA,
|
177 |
+
'description' => __('Add style from Snazzy Maps. Copy and Paste style array from here -> <a href="https://snazzymaps.com/explore" target="_blank">Snazzy Maps</a>')
|
178 |
+
]
|
179 |
+
);
|
180 |
+
|
181 |
+
$this->end_controls_section();
|
182 |
+
|
183 |
+
}
|
184 |
+
|
185 |
+
protected function render( ) {
|
186 |
+
$settings = $this->get_settings();
|
187 |
+
|
188 |
+
$markers = $settings['markers'];
|
189 |
+
|
190 |
+
$this->add_render_attribute('wrapper', 'data-zoom', $settings['zoom']['size']);
|
191 |
+
|
192 |
+
$this->add_render_attribute('wrapper', 'data-style', $settings['snazzy_style']);
|
193 |
+
|
194 |
+
$this->add_render_attribute('wrapper' , 'data-animate' , 'animate-'.$settings['animate']);
|
195 |
+
|
196 |
+
if(count($markers)){
|
197 |
+
?>
|
198 |
+
<div class="eae-markers" <?php echo $this->get_render_attribute_string('wrapper'); ?>>
|
199 |
+
<?php
|
200 |
+
foreach($markers as $marker){
|
201 |
+
?>
|
202 |
+
<div class="marker" data-lng="<?php echo $marker['long']; ?>" data-lat="<?php echo $marker['lat']; ?>" data-icon="<?php echo $marker['icon']['url']; ?>" data-icon-size="<?php echo $marker['icon_size']['size']; ?>">
|
203 |
+
<?php echo $marker['address']; ?>
|
204 |
+
</div>
|
205 |
+
<?php
|
206 |
+
}
|
207 |
+
?>
|
208 |
+
</div>
|
209 |
+
<?php
|
210 |
+
}
|
211 |
+
|
212 |
+
|
213 |
+
}
|
214 |
+
}
|
215 |
+
|
216 |
+
|
217 |
+
Plugin::instance()->widgets_manager->register_widget_type( new Widget_TextSeparator() );
|
elements/image-compare.php
CHANGED
@@ -1,459 +1,459 @@
|
|
1 |
-
<?php
|
2 |
-
namespace Elementor;
|
3 |
-
|
4 |
-
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
5 |
-
|
6 |
-
class Widget_Compare_Image extends Widget_Base {
|
7 |
-
|
8 |
-
public function get_name() {
|
9 |
-
return 'wts-ab-image';
|
10 |
-
}
|
11 |
-
|
12 |
-
public function get_title() {
|
13 |
-
return __( 'EAE - After/Before Image', '
|
14 |
-
}
|
15 |
-
|
16 |
-
public function get_icon() {
|
17 |
-
return 'eicon-divider wts-eae-pe';
|
18 |
-
}
|
19 |
-
|
20 |
-
|
21 |
-
public function get_categories() {
|
22 |
-
return [ 'wts-eae' ];
|
23 |
-
}
|
24 |
-
|
25 |
-
protected function _register_controls() {
|
26 |
-
|
27 |
-
$this->start_controls_section(
|
28 |
-
'image',
|
29 |
-
[
|
30 |
-
'label' => __( 'Image', '
|
31 |
-
]
|
32 |
-
);
|
33 |
-
|
34 |
-
$this->add_control(
|
35 |
-
'compare_style',
|
36 |
-
[
|
37 |
-
'label' => __( 'Compare Style', '
|
38 |
-
'type' => Controls_Manager::SELECT,
|
39 |
-
'options' => [
|
40 |
-
'horizontal' => __( 'Horizontal', '
|
41 |
-
'vertical' => __( 'Vertical', '
|
42 |
-
],
|
43 |
-
'default' => 'horizontal',
|
44 |
-
]
|
45 |
-
);
|
46 |
-
|
47 |
-
$this->add_control(
|
48 |
-
'slider_position',
|
49 |
-
[
|
50 |
-
'label' => __( 'Slider Position', '
|
51 |
-
'type' => Controls_Manager::SLIDER,
|
52 |
-
'default' => [
|
53 |
-
'size' => 50,
|
54 |
-
],
|
55 |
-
|
56 |
-
'range' => [
|
57 |
-
'%' => [
|
58 |
-
'min' => 0,
|
59 |
-
'max' => 90,
|
60 |
-
],
|
61 |
-
],
|
62 |
-
]
|
63 |
-
);
|
64 |
-
|
65 |
-
$this->add_control(
|
66 |
-
'slider_icon',
|
67 |
-
[
|
68 |
-
'label' => __( 'Icon', '
|
69 |
-
'type' => Controls_Manager::ICON,
|
70 |
-
'default' => 'fa fa-star',
|
71 |
-
]
|
72 |
-
);
|
73 |
-
|
74 |
-
/*$this->add_responsive_control(
|
75 |
-
'img_height',
|
76 |
-
[
|
77 |
-
'label' => __( 'Image Height', '
|
78 |
-
'type' => Controls_Manager::SLIDER,
|
79 |
-
'default' => [
|
80 |
-
'size' => 300,
|
81 |
-
],
|
82 |
-
'range' => [
|
83 |
-
'px' => [
|
84 |
-
'min' => 200,
|
85 |
-
'max' => 800,
|
86 |
-
],
|
87 |
-
],
|
88 |
-
'selectors' => [
|
89 |
-
'{{WRAPPER}} .eae-img-comp-container11' => 'height: {{SIZE}}px;',
|
90 |
-
],
|
91 |
-
]
|
92 |
-
);*/
|
93 |
-
|
94 |
-
$this->add_control('before_image',
|
95 |
-
[
|
96 |
-
'label' => __( 'Before Image', '
|
97 |
-
'type' => Controls_Manager::MEDIA,
|
98 |
-
'default' => [
|
99 |
-
'url' => Utils::get_placeholder_image_src(),
|
100 |
-
],
|
101 |
-
'show_label' => true,
|
102 |
-
]
|
103 |
-
);
|
104 |
-
|
105 |
-
$this->add_group_control(
|
106 |
-
Group_Control_Image_Size::get_type(),
|
107 |
-
[
|
108 |
-
'name' => 'before_image_size', // Actually its `image_size`
|
109 |
-
'default' => 'medium_large',
|
110 |
-
]
|
111 |
-
);
|
112 |
-
|
113 |
-
$this->add_control(
|
114 |
-
'image_head',
|
115 |
-
[
|
116 |
-
'label' => __('', '
|
117 |
-
'type' => Controls_Manager::HEADING,
|
118 |
-
'separator' => 'before',
|
119 |
-
]
|
120 |
-
);
|
121 |
-
|
122 |
-
$this->add_control('after_image',
|
123 |
-
[
|
124 |
-
'label' => __( 'After Image', '
|
125 |
-
'type' => Controls_Manager::MEDIA,
|
126 |
-
'default' => [
|
127 |
-
'url' => Utils::get_placeholder_image_src(),
|
128 |
-
],
|
129 |
-
'selectors'=> [
|
130 |
-
//'{{WRAPPER}} .eae-img-comp-overlay' => 'background-image:url({{URL}})'
|
131 |
-
],
|
132 |
-
'show_label' => true,
|
133 |
-
]
|
134 |
-
);
|
135 |
-
|
136 |
-
$this->add_group_control(
|
137 |
-
Group_Control_Image_Size::get_type(),
|
138 |
-
[
|
139 |
-
'name' => 'after_image_size', // Actually its `image_size`
|
140 |
-
'default' => 'medium_large',
|
141 |
-
]
|
142 |
-
);
|
143 |
-
|
144 |
-
$this->add_control(
|
145 |
-
'separator_text',
|
146 |
-
[
|
147 |
-
'label' => __('', '
|
148 |
-
'type' => Controls_Manager::HEADING,
|
149 |
-
'separator' => 'before',
|
150 |
-
]
|
151 |
-
);
|
152 |
-
$this->add_control(
|
153 |
-
'text_before',
|
154 |
-
[
|
155 |
-
'label' => __( 'Before Text', '
|
156 |
-
'type' => Controls_Manager::TEXT,
|
157 |
-
'placeholder' => __( 'Enter text', '
|
158 |
-
'default' => __( 'BEFORE', '
|
159 |
-
]
|
160 |
-
);
|
161 |
-
|
162 |
-
$this->add_control(
|
163 |
-
'text_after',
|
164 |
-
[
|
165 |
-
'label' => __( 'After Text', '
|
166 |
-
'type' => Controls_Manager::TEXT,
|
167 |
-
'placeholder' => __( 'Enter text', '
|
168 |
-
'default' => __( 'AFTER', '
|
169 |
-
]
|
170 |
-
);
|
171 |
-
|
172 |
-
|
173 |
-
$this->end_controls_section();
|
174 |
-
|
175 |
-
$this->start_controls_section(
|
176 |
-
'image_style',
|
177 |
-
[
|
178 |
-
'label' => __( 'General', '
|
179 |
-
'tab' => Controls_Manager::TAB_STYLE
|
180 |
-
]
|
181 |
-
);
|
182 |
-
|
183 |
-
$this->add_control(
|
184 |
-
'slider_icon_color',
|
185 |
-
[
|
186 |
-
'label' => __('Icon Color', '
|
187 |
-
'type' => Controls_Manager::COLOR,
|
188 |
-
'type' => Scheme_Color::get_type(),
|
189 |
-
'selectors' => [
|
190 |
-
'{{WRAPPER}} .eae-slider-icon' => 'color: {{VALUE}}'
|
191 |
-
]
|
192 |
-
]
|
193 |
-
);
|
194 |
-
|
195 |
-
$this->add_control(
|
196 |
-
'slider_bg_color',
|
197 |
-
[
|
198 |
-
'label' => __('Slider Color', '
|
199 |
-
'type' => Controls_Manager::COLOR,
|
200 |
-
'type' => Scheme_Color::get_type(),
|
201 |
-
'selectors' => [
|
202 |
-
'{{WRAPPER}} .eae-img-comp-slider' => 'background-color: {{VALUE}} !important'
|
203 |
-
]
|
204 |
-
]
|
205 |
-
);
|
206 |
-
|
207 |
-
|
208 |
-
$this->add_control(
|
209 |
-
'separator_alignment',
|
210 |
-
[
|
211 |
-
'label' => __( 'Separator Alignment', '
|
212 |
-
'type' => Controls_Manager::SLIDER,
|
213 |
-
'default' => [
|
214 |
-
'size' => 50,
|
215 |
-
],
|
216 |
-
|
217 |
-
'range' => [
|
218 |
-
'%' => [
|
219 |
-
'min' => 0,
|
220 |
-
'max' => 90,
|
221 |
-
],
|
222 |
-
],
|
223 |
-
'selectors' => [
|
224 |
-
'{{WRAPPER}} .mode-horizontal .eae-img-comp-slider' => 'top: {{SIZE}}% !important;',
|
225 |
-
'{{WRAPPER}} .mode-vertical .eae-img-comp-slider' => 'left: {{SIZE}}% !important;',
|
226 |
-
],
|
227 |
-
]
|
228 |
-
);
|
229 |
-
|
230 |
-
$this->add_control(
|
231 |
-
'slider_separator_width',
|
232 |
-
[
|
233 |
-
'label' => __( 'Separator Width', '
|
234 |
-
'type' => Controls_Manager::NUMBER,
|
235 |
-
'default' => 1,
|
236 |
-
'min' => 0,
|
237 |
-
'max' => 10,
|
238 |
-
'step' => 1,
|
239 |
-
'selectors' => [
|
240 |
-
'{{WRAPPER}} .mode-horizontal .eae-img-comp-overlay' => ' border-right-style:solid; border-right-width: {{SIZE}}px;',
|
241 |
-
'{{WRAPPER}} .mode-vertical .eae-img-comp-overlay' => ' border-bottom-style:solid; border-bottom-width: {{SIZE}}px;',
|
242 |
-
],
|
243 |
-
]
|
244 |
-
);
|
245 |
-
|
246 |
-
$this->end_controls_section();
|
247 |
-
|
248 |
-
$this->start_controls_section(
|
249 |
-
'label_style',
|
250 |
-
[
|
251 |
-
'label' => __('Label', '
|
252 |
-
'tab' => Controls_Manager::TAB_STYLE
|
253 |
-
]
|
254 |
-
);
|
255 |
-
|
256 |
-
$this->add_control(
|
257 |
-
'label_position_horizontal',
|
258 |
-
[
|
259 |
-
'label' => __( 'Position', '
|
260 |
-
'type' => Controls_Manager::SELECT,
|
261 |
-
'options' => [
|
262 |
-
'top' => __( 'Top', '
|
263 |
-
'bottom' => __( 'Bottom', '
|
264 |
-
],
|
265 |
-
'condition' => [
|
266 |
-
'compare_style' => 'horizontal',
|
267 |
-
],
|
268 |
-
'default' => 'top',
|
269 |
-
'prefix_class' => 'eae-label-pos-',
|
270 |
-
'selectors' => [
|
271 |
-
'{{WRAPPER}}.eae-label-pos-top .eae-text-after' => 'top: 0px;left:0px',
|
272 |
-
'{{WRAPPER}}.eae-label-pos-top .eae-text-before' => 'top: 0px;right:0px',
|
273 |
-
'{{WRAPPER}}.eae-label-pos-bottom .eae-text-after' => 'bottom: 10px;left:0px',
|
274 |
-
'{{WRAPPER}}.eae-label-pos-bottom .eae-text-before' => 'bottom: 10px;right:0px',
|
275 |
-
],
|
276 |
-
]
|
277 |
-
);
|
278 |
-
|
279 |
-
$this->add_control(
|
280 |
-
'label_position_vertical',
|
281 |
-
[
|
282 |
-
'label' => __( 'Position', '
|
283 |
-
'type' => Controls_Manager::SELECT,
|
284 |
-
'options' => [
|
285 |
-
'left' => __( 'Left', '
|
286 |
-
'right' => __( 'Right', '
|
287 |
-
],
|
288 |
-
'condition' => [
|
289 |
-
'compare_style' => 'vertical',
|
290 |
-
],
|
291 |
-
'default' => 'left',
|
292 |
-
'prefix_class' => 'eae-label-pos-',
|
293 |
-
'selectors' => [
|
294 |
-
'{{WRAPPER}}.eae-label-pos-left .eae-text-after' => 'top: 0px;left:0px;',
|
295 |
-
'{{WRAPPER}}.eae-label-pos-left .eae-text-before' => 'bottom: 0px;right:0px;',
|
296 |
-
'{{WRAPPER}}.eae-label-pos-right .eae-text-after' => 'top: 0px;right:0px;',
|
297 |
-
'{{WRAPPER}}.eae-label-pos-right .eae-text-before' => 'bottom: 0px; left:0px;',
|
298 |
-
],
|
299 |
-
]
|
300 |
-
);
|
301 |
-
|
302 |
-
$this->add_group_control(
|
303 |
-
Group_Control_Typography::get_type(),
|
304 |
-
[
|
305 |
-
'name' => 'label_text_typography',
|
306 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
307 |
-
'selector' => '{{WRAPPER}} .eae-text-after, {{WRAPPER}} .eae-text-before',
|
308 |
-
]
|
309 |
-
);
|
310 |
-
|
311 |
-
$this->add_control(
|
312 |
-
'label_color',
|
313 |
-
[
|
314 |
-
'label' => __('Color', '
|
315 |
-
'type' => Controls_Manager::COLOR,
|
316 |
-
'scheme' => [
|
317 |
-
'type' => Scheme_Color::get_type(),
|
318 |
-
'value' => Scheme_Color::COLOR_1
|
319 |
-
],
|
320 |
-
'selectors' => [
|
321 |
-
'{{WRAPPER}} .eae-text-after' => 'color: {{VALUE}}',
|
322 |
-
'{{WRAPPER}} .eae-text-before' => 'color: {{VALUE}}',
|
323 |
-
]
|
324 |
-
]
|
325 |
-
);
|
326 |
-
$this->add_control(
|
327 |
-
'label_background_color',
|
328 |
-
[
|
329 |
-
'label' => __('BackgroundColor', '
|
330 |
-
'type' => Controls_Manager::COLOR,
|
331 |
-
'type' => Scheme_Color::get_type(),
|
332 |
-
'selectors' => [
|
333 |
-
'{{WRAPPER}} .eae-text-after' => 'background-color: {{VALUE}}',
|
334 |
-
'{{WRAPPER}} .eae-text-before' => 'background-color: {{VALUE}}'
|
335 |
-
]
|
336 |
-
]
|
337 |
-
);
|
338 |
-
|
339 |
-
$this->add_group_control(
|
340 |
-
Group_Control_Border::get_type(),
|
341 |
-
[
|
342 |
-
'name' => 'label_border',
|
343 |
-
'label' => __( 'Box Border', '
|
344 |
-
'selector' =>
|
345 |
-
'{{WRAPPER}} .eae-text-after, {{WRAPPER}} .eae-text-before',
|
346 |
-
]
|
347 |
-
);
|
348 |
-
|
349 |
-
|
350 |
-
|
351 |
-
$this->add_control(
|
352 |
-
'label_border_radius',
|
353 |
-
[
|
354 |
-
'label' => __( 'Border Radius', '
|
355 |
-
'type' => Controls_Manager::DIMENSIONS,
|
356 |
-
'size_units' => [ 'px','%' ],
|
357 |
-
'selectors' => [
|
358 |
-
'{{WRAPPER}} .eae-text-after' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
359 |
-
'{{WRAPPER}} .eae-text-before' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
360 |
-
],
|
361 |
-
]
|
362 |
-
);
|
363 |
-
|
364 |
-
$this->add_control(
|
365 |
-
'label_padding',
|
366 |
-
[
|
367 |
-
'label' => __( 'Padding', '
|
368 |
-
'type' => Controls_Manager::DIMENSIONS,
|
369 |
-
'size_units' => [ 'px'],
|
370 |
-
'selectors' => [
|
371 |
-
'{{WRAPPER}} .eae-text-after' => 'padding: {{TOP}}px {{RIGHT}}px {{BOTTOM}}px {{LEFT}}px;',
|
372 |
-
'{{WRAPPER}} .eae-text-before' => 'padding: {{TOP}}px {{RIGHT}}px {{BOTTOM}}px {{LEFT}}px;',
|
373 |
-
],
|
374 |
-
]
|
375 |
-
);
|
376 |
-
$this->add_control(
|
377 |
-
'label_margin',
|
378 |
-
[
|
379 |
-
'label' => __( 'Margin', '
|
380 |
-
'type' => Controls_Manager::DIMENSIONS,
|
381 |
-
'selectors' => [
|
382 |
-
'{{WRAPPER}} .eae-text-after' => 'margin: {{TOP}}px {{RIGHT}}px {{BOTTOM}}px {{LEFT}}px;',
|
383 |
-
'{{WRAPPER}} .eae-text-before' => 'margin: {{TOP}}px {{RIGHT}}px {{BOTTOM}}px {{LEFT}}px;',
|
384 |
-
],
|
385 |
-
]
|
386 |
-
);
|
387 |
-
|
388 |
-
$this->end_controls_section();
|
389 |
-
|
390 |
-
}
|
391 |
-
|
392 |
-
|
393 |
-
protected function render() {
|
394 |
-
$settings = $this->get_settings();
|
395 |
-
//print_r($settings);
|
396 |
-
$this->add_render_attribute('wrapper', 'class', 'eae-img-comp-container');
|
397 |
-
$this->add_render_attribute('wrapper', 'class', 'mode-'.$settings['compare_style']);
|
398 |
-
$this->add_render_attribute('wrapper', 'data-ab-style', $settings['compare_style']);
|
399 |
-
$this->add_render_attribute('wrapper', 'data-slider-pos', $settings['slider_position']['size']);
|
400 |
-
|
401 |
-
$this->add_render_attribute('icon', 'class', 'icon-'.$settings['compare_style']);
|
402 |
-
$this->add_render_attribute('icon', 'class', 'eae-img-comp-slider');
|
403 |
-
?>
|
404 |
-
<figure <?php echo $this->get_render_attribute_string('wrapper'); ?> >
|
405 |
-
<?php echo wp_get_attachment_image($settings['before_image']['id'], $settings['before_image_size_size']); ?>
|
406 |
-
|
407 |
-
<?php if($settings['text_before'] !== "") { ?>
|
408 |
-
<span class="eae-text-before"><?php echo $settings['text_before']; ?></span>
|
409 |
-
<?php } ?>
|
410 |
-
|
411 |
-
<div <?php echo $this->get_render_attribute_string('icon'); ?> >
|
412 |
-
<i class="<?php echo $settings['slider_icon']; ?> eae-slider-icon" ></i>
|
413 |
-
</div>
|
414 |
-
|
415 |
-
<div class="eae-img-comp-img eae-img-comp-overlay">
|
416 |
-
<?php echo wp_get_attachment_image($settings['after_image']['id'], $settings['after_image_size_size']); ?>
|
417 |
-
|
418 |
-
<?php if($settings['text_after'] !== "") { ?>
|
419 |
-
<span class="eae-text-after"><?php echo $settings['text_after']; ?></span>
|
420 |
-
<?php } ?>
|
421 |
-
</div>
|
422 |
-
|
423 |
-
</figure>
|
424 |
-
<?php
|
425 |
-
}
|
426 |
-
|
427 |
-
protected function _content_template() {
|
428 |
-
?>
|
429 |
-
<#
|
430 |
-
view.addRenderAttribute('wrapper','class','eae-img-comp-container');
|
431 |
-
view.addRenderAttribute('wrapper','class','mode-'+settings.compare_style);
|
432 |
-
view.addRenderAttribute('wrapper','data-ab-style',settings.compare_style);
|
433 |
-
view.addRenderAttribute('wrapper','data-slider-pos', settings.slider_position.size);
|
434 |
-
|
435 |
-
view.addRenderAttribute('icon','class',settings.slider_icon);
|
436 |
-
view.addRenderAttribute('icon','class','eae-slider-icon');
|
437 |
-
#>
|
438 |
-
|
439 |
-
<div {{{ view.getRenderAttributeString( 'wrapper') }}} >
|
440 |
-
<img src="{{{ settings.before_image.url }}}" />
|
441 |
-
<# if(settings.text_before) {#>
|
442 |
-
<span class="eae-text-before">{{{settings.text_before}}}</span>
|
443 |
-
<# } #>
|
444 |
-
<div class="eae-img-comp-slider"">
|
445 |
-
<i {{{ view.getRenderAttributeString( 'icon') }}} ></i>
|
446 |
-
</div>
|
447 |
-
|
448 |
-
<div class="eae-img-comp-img eae-img-comp-overlay">
|
449 |
-
<img src="{{{ settings.after_image.url }}}" >
|
450 |
-
<# if(settings.text_after) { #>
|
451 |
-
<span class="eae-text-after">{{{settings.text_after}}}</span>
|
452 |
-
<# } #>
|
453 |
-
</div>
|
454 |
-
|
455 |
-
</div>
|
456 |
-
<?php
|
457 |
-
}
|
458 |
-
}
|
459 |
Plugin::instance()->widgets_manager->register_widget_type( new Widget_Compare_Image() );
|
1 |
+
<?php
|
2 |
+
namespace Elementor;
|
3 |
+
|
4 |
+
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
5 |
+
|
6 |
+
class Widget_Compare_Image extends Widget_Base {
|
7 |
+
|
8 |
+
public function get_name() {
|
9 |
+
return 'wts-ab-image';
|
10 |
+
}
|
11 |
+
|
12 |
+
public function get_title() {
|
13 |
+
return __( 'EAE - After/Before Image', 'wts-eae' );
|
14 |
+
}
|
15 |
+
|
16 |
+
public function get_icon() {
|
17 |
+
return 'eicon-divider wts-eae-pe';
|
18 |
+
}
|
19 |
+
|
20 |
+
|
21 |
+
public function get_categories() {
|
22 |
+
return [ 'wts-eae' ];
|
23 |
+
}
|
24 |
+
|
25 |
+
protected function _register_controls() {
|
26 |
+
|
27 |
+
$this->start_controls_section(
|
28 |
+
'image',
|
29 |
+
[
|
30 |
+
'label' => __( 'Image', 'wts-eae' )
|
31 |
+
]
|
32 |
+
);
|
33 |
+
|
34 |
+
$this->add_control(
|
35 |
+
'compare_style',
|
36 |
+
[
|
37 |
+
'label' => __( 'Compare Style', 'wts-eae' ),
|
38 |
+
'type' => Controls_Manager::SELECT,
|
39 |
+
'options' => [
|
40 |
+
'horizontal' => __( 'Horizontal', 'wts-eae' ),
|
41 |
+
'vertical' => __( 'Vertical', 'wts-eae' ),
|
42 |
+
],
|
43 |
+
'default' => 'horizontal',
|
44 |
+
]
|
45 |
+
);
|
46 |
+
|
47 |
+
$this->add_control(
|
48 |
+
'slider_position',
|
49 |
+
[
|
50 |
+
'label' => __( 'Slider Position', 'wts-eae' ),
|
51 |
+
'type' => Controls_Manager::SLIDER,
|
52 |
+
'default' => [
|
53 |
+
'size' => 50,
|
54 |
+
],
|
55 |
+
|
56 |
+
'range' => [
|
57 |
+
'%' => [
|
58 |
+
'min' => 0,
|
59 |
+
'max' => 90,
|
60 |
+
],
|
61 |
+
],
|
62 |
+
]
|
63 |
+
);
|
64 |
+
|
65 |
+
$this->add_control(
|
66 |
+
'slider_icon',
|
67 |
+
[
|
68 |
+
'label' => __( 'Icon', 'wts-eae' ),
|
69 |
+
'type' => Controls_Manager::ICON,
|
70 |
+
'default' => 'fa fa-star',
|
71 |
+
]
|
72 |
+
);
|
73 |
+
|
74 |
+
/*$this->add_responsive_control(
|
75 |
+
'img_height',
|
76 |
+
[
|
77 |
+
'label' => __( 'Image Height', 'wts-eae' ),
|
78 |
+
'type' => Controls_Manager::SLIDER,
|
79 |
+
'default' => [
|
80 |
+
'size' => 300,
|
81 |
+
],
|
82 |
+
'range' => [
|
83 |
+
'px' => [
|
84 |
+
'min' => 200,
|
85 |
+
'max' => 800,
|
86 |
+
],
|
87 |
+
],
|
88 |
+
'selectors' => [
|
89 |
+
'{{WRAPPER}} .eae-img-comp-container11' => 'height: {{SIZE}}px;',
|
90 |
+
],
|
91 |
+
]
|
92 |
+
);*/
|
93 |
+
|
94 |
+
$this->add_control('before_image',
|
95 |
+
[
|
96 |
+
'label' => __( 'Before Image', 'wts-eae' ),
|
97 |
+
'type' => Controls_Manager::MEDIA,
|
98 |
+
'default' => [
|
99 |
+
'url' => Utils::get_placeholder_image_src(),
|
100 |
+
],
|
101 |
+
'show_label' => true,
|
102 |
+
]
|
103 |
+
);
|
104 |
+
|
105 |
+
$this->add_group_control(
|
106 |
+
Group_Control_Image_Size::get_type(),
|
107 |
+
[
|
108 |
+
'name' => 'before_image_size', // Actually its `image_size`
|
109 |
+
'default' => 'medium_large',
|
110 |
+
]
|
111 |
+
);
|
112 |
+
|
113 |
+
$this->add_control(
|
114 |
+
'image_head',
|
115 |
+
[
|
116 |
+
'label' => __('', 'wts-eae'),
|
117 |
+
'type' => Controls_Manager::HEADING,
|
118 |
+
'separator' => 'before',
|
119 |
+
]
|
120 |
+
);
|
121 |
+
|
122 |
+
$this->add_control('after_image',
|
123 |
+
[
|
124 |
+
'label' => __( 'After Image', 'wts-eae' ),
|
125 |
+
'type' => Controls_Manager::MEDIA,
|
126 |
+
'default' => [
|
127 |
+
'url' => Utils::get_placeholder_image_src(),
|
128 |
+
],
|
129 |
+
'selectors'=> [
|
130 |
+
//'{{WRAPPER}} .eae-img-comp-overlay' => 'background-image:url({{URL}})'
|
131 |
+
],
|
132 |
+
'show_label' => true,
|
133 |
+
]
|
134 |
+
);
|
135 |
+
|
136 |
+
$this->add_group_control(
|
137 |
+
Group_Control_Image_Size::get_type(),
|
138 |
+
[
|
139 |
+
'name' => 'after_image_size', // Actually its `image_size`
|
140 |
+
'default' => 'medium_large',
|
141 |
+
]
|
142 |
+
);
|
143 |
+
|
144 |
+
$this->add_control(
|
145 |
+
'separator_text',
|
146 |
+
[
|
147 |
+
'label' => __('', 'wts-eae'),
|
148 |
+
'type' => Controls_Manager::HEADING,
|
149 |
+
'separator' => 'before',
|
150 |
+
]
|
151 |
+
);
|
152 |
+
$this->add_control(
|
153 |
+
'text_before',
|
154 |
+
[
|
155 |
+
'label' => __( 'Before Text', 'wts-eae' ),
|
156 |
+
'type' => Controls_Manager::TEXT,
|
157 |
+
'placeholder' => __( 'Enter text', 'wts-eae' ),
|
158 |
+
'default' => __( 'BEFORE', 'wts-eae' ),
|
159 |
+
]
|
160 |
+
);
|
161 |
+
|
162 |
+
$this->add_control(
|
163 |
+
'text_after',
|
164 |
+
[
|
165 |
+
'label' => __( 'After Text', 'wts-eae' ),
|
166 |
+
'type' => Controls_Manager::TEXT,
|
167 |
+
'placeholder' => __( 'Enter text', 'wts-eae' ),
|
168 |
+
'default' => __( 'AFTER', 'wts-eae' ),
|
169 |
+
]
|
170 |
+
);
|
171 |
+
|
172 |
+
|
173 |
+
$this->end_controls_section();
|
174 |
+
|
175 |
+
$this->start_controls_section(
|
176 |
+
'image_style',
|
177 |
+
[
|
178 |
+
'label' => __( 'General', 'wts-eae' ),
|
179 |
+
'tab' => Controls_Manager::TAB_STYLE
|
180 |
+
]
|
181 |
+
);
|
182 |
+
|
183 |
+
$this->add_control(
|
184 |
+
'slider_icon_color',
|
185 |
+
[
|
186 |
+
'label' => __('Icon Color', 'wts-eae'),
|
187 |
+
'type' => Controls_Manager::COLOR,
|
188 |
+
'type' => Scheme_Color::get_type(),
|
189 |
+
'selectors' => [
|
190 |
+
'{{WRAPPER}} .eae-slider-icon' => 'color: {{VALUE}}'
|
191 |
+
]
|
192 |
+
]
|
193 |
+
);
|
194 |
+
|
195 |
+
$this->add_control(
|
196 |
+
'slider_bg_color',
|
197 |
+
[
|
198 |
+
'label' => __('Slider Color', 'wts-eae'),
|
199 |
+
'type' => Controls_Manager::COLOR,
|
200 |
+
'type' => Scheme_Color::get_type(),
|
201 |
+
'selectors' => [
|
202 |
+
'{{WRAPPER}} .eae-img-comp-slider' => 'background-color: {{VALUE}} !important'
|
203 |
+
]
|
204 |
+
]
|
205 |
+
);
|
206 |
+
|
207 |
+
|
208 |
+
$this->add_control(
|
209 |
+
'separator_alignment',
|
210 |
+
[
|
211 |
+
'label' => __( 'Separator Alignment', 'wts-eae' ),
|
212 |
+
'type' => Controls_Manager::SLIDER,
|
213 |
+
'default' => [
|
214 |
+
'size' => 50,
|
215 |
+
],
|
216 |
+
|
217 |
+
'range' => [
|
218 |
+
'%' => [
|
219 |
+
'min' => 0,
|
220 |
+
'max' => 90,
|
221 |
+
],
|
222 |
+
],
|
223 |
+
'selectors' => [
|
224 |
+
'{{WRAPPER}} .mode-horizontal .eae-img-comp-slider' => 'top: {{SIZE}}% !important;',
|
225 |
+
'{{WRAPPER}} .mode-vertical .eae-img-comp-slider' => 'left: {{SIZE}}% !important;',
|
226 |
+
],
|
227 |
+
]
|
228 |
+
);
|
229 |
+
|
230 |
+
$this->add_control(
|
231 |
+
'slider_separator_width',
|
232 |
+
[
|
233 |
+
'label' => __( 'Separator Width', 'wts-eae' ),
|
234 |
+
'type' => Controls_Manager::NUMBER,
|
235 |
+
'default' => 1,
|
236 |
+
'min' => 0,
|
237 |
+
'max' => 10,
|
238 |
+
'step' => 1,
|
239 |
+
'selectors' => [
|
240 |
+
'{{WRAPPER}} .mode-horizontal .eae-img-comp-overlay' => ' border-right-style:solid; border-right-width: {{SIZE}}px;',
|
241 |
+
'{{WRAPPER}} .mode-vertical .eae-img-comp-overlay' => ' border-bottom-style:solid; border-bottom-width: {{SIZE}}px;',
|
242 |
+
],
|
243 |
+
]
|
244 |
+
);
|
245 |
+
|
246 |
+
$this->end_controls_section();
|
247 |
+
|
248 |
+
$this->start_controls_section(
|
249 |
+
'label_style',
|
250 |
+
[
|
251 |
+
'label' => __('Label', 'wts-eae'),
|
252 |
+
'tab' => Controls_Manager::TAB_STYLE
|
253 |
+
]
|
254 |
+
);
|
255 |
+
|
256 |
+
$this->add_control(
|
257 |
+
'label_position_horizontal',
|
258 |
+
[
|
259 |
+
'label' => __( 'Position', 'wts-eae' ),
|
260 |
+
'type' => Controls_Manager::SELECT,
|
261 |
+
'options' => [
|
262 |
+
'top' => __( 'Top', 'wts-eae' ),
|
263 |
+
'bottom' => __( 'Bottom', 'wts-eae' ),
|
264 |
+
],
|
265 |
+
'condition' => [
|
266 |
+
'compare_style' => 'horizontal',
|
267 |
+
],
|
268 |
+
'default' => 'top',
|
269 |
+
'prefix_class' => 'eae-label-pos-',
|
270 |
+
'selectors' => [
|
271 |
+
'{{WRAPPER}}.eae-label-pos-top .eae-text-after' => 'top: 0px;left:0px',
|
272 |
+
'{{WRAPPER}}.eae-label-pos-top .eae-text-before' => 'top: 0px;right:0px',
|
273 |
+
'{{WRAPPER}}.eae-label-pos-bottom .eae-text-after' => 'bottom: 10px;left:0px',
|
274 |
+
'{{WRAPPER}}.eae-label-pos-bottom .eae-text-before' => 'bottom: 10px;right:0px',
|
275 |
+
],
|
276 |
+
]
|
277 |
+
);
|
278 |
+
|
279 |
+
$this->add_control(
|
280 |
+
'label_position_vertical',
|
281 |
+
[
|
282 |
+
'label' => __( 'Position', 'wts-eae' ),
|
283 |
+
'type' => Controls_Manager::SELECT,
|
284 |
+
'options' => [
|
285 |
+
'left' => __( 'Left', 'wts-eae' ),
|
286 |
+
'right' => __( 'Right', 'wts-eae' ),
|
287 |
+
],
|
288 |
+
'condition' => [
|
289 |
+
'compare_style' => 'vertical',
|
290 |
+
],
|
291 |
+
'default' => 'left',
|
292 |
+
'prefix_class' => 'eae-label-pos-',
|
293 |
+
'selectors' => [
|
294 |
+
'{{WRAPPER}}.eae-label-pos-left .eae-text-after' => 'top: 0px;left:0px;',
|
295 |
+
'{{WRAPPER}}.eae-label-pos-left .eae-text-before' => 'bottom: 0px;right:0px;',
|
296 |
+
'{{WRAPPER}}.eae-label-pos-right .eae-text-after' => 'top: 0px;right:0px;',
|
297 |
+
'{{WRAPPER}}.eae-label-pos-right .eae-text-before' => 'bottom: 0px; left:0px;',
|
298 |
+
],
|
299 |
+
]
|
300 |
+
);
|
301 |
+
|
302 |
+
$this->add_group_control(
|
303 |
+
Group_Control_Typography::get_type(),
|
304 |
+
[
|
305 |
+
'name' => 'label_text_typography',
|
306 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
307 |
+
'selector' => '{{WRAPPER}} .eae-text-after, {{WRAPPER}} .eae-text-before',
|
308 |
+
]
|
309 |
+
);
|
310 |
+
|
311 |
+
$this->add_control(
|
312 |
+
'label_color',
|
313 |
+
[
|
314 |
+
'label' => __('Color', 'wts-eae'),
|
315 |
+
'type' => Controls_Manager::COLOR,
|
316 |
+
'scheme' => [
|
317 |
+
'type' => Scheme_Color::get_type(),
|
318 |
+
'value' => Scheme_Color::COLOR_1
|
319 |
+
],
|
320 |
+
'selectors' => [
|
321 |
+
'{{WRAPPER}} .eae-text-after' => 'color: {{VALUE}}',
|
322 |
+
'{{WRAPPER}} .eae-text-before' => 'color: {{VALUE}}',
|
323 |
+
]
|
324 |
+
]
|
325 |
+
);
|
326 |
+
$this->add_control(
|
327 |
+
'label_background_color',
|
328 |
+
[
|
329 |
+
'label' => __('BackgroundColor', 'wts-eae'),
|
330 |
+
'type' => Controls_Manager::COLOR,
|
331 |
+
'type' => Scheme_Color::get_type(),
|
332 |
+
'selectors' => [
|
333 |
+
'{{WRAPPER}} .eae-text-after' => 'background-color: {{VALUE}}',
|
334 |
+
'{{WRAPPER}} .eae-text-before' => 'background-color: {{VALUE}}'
|
335 |
+
]
|
336 |
+
]
|
337 |
+
);
|
338 |
+
|
339 |
+
$this->add_group_control(
|
340 |
+
Group_Control_Border::get_type(),
|
341 |
+
[
|
342 |
+
'name' => 'label_border',
|
343 |
+
'label' => __( 'Box Border', 'wts-eae' ),
|
344 |
+
'selector' =>
|
345 |
+
'{{WRAPPER}} .eae-text-after, {{WRAPPER}} .eae-text-before',
|
346 |
+
]
|
347 |
+
);
|
348 |
+
|
349 |
+
|
350 |
+
|
351 |
+
$this->add_control(
|
352 |
+
'label_border_radius',
|
353 |
+
[
|
354 |
+
'label' => __( 'Border Radius', 'wts-eae' ),
|
355 |
+
'type' => Controls_Manager::DIMENSIONS,
|
356 |
+
'size_units' => [ 'px','%' ],
|
357 |
+
'selectors' => [
|
358 |
+
'{{WRAPPER}} .eae-text-after' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
359 |
+
'{{WRAPPER}} .eae-text-before' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
360 |
+
],
|
361 |
+
]
|
362 |
+
);
|
363 |
+
|
364 |
+
$this->add_control(
|
365 |
+
'label_padding',
|
366 |
+
[
|
367 |
+
'label' => __( 'Padding', 'wts-eae' ),
|
368 |
+
'type' => Controls_Manager::DIMENSIONS,
|
369 |
+
'size_units' => [ 'px'],
|
370 |
+
'selectors' => [
|
371 |
+
'{{WRAPPER}} .eae-text-after' => 'padding: {{TOP}}px {{RIGHT}}px {{BOTTOM}}px {{LEFT}}px;',
|
372 |
+
'{{WRAPPER}} .eae-text-before' => 'padding: {{TOP}}px {{RIGHT}}px {{BOTTOM}}px {{LEFT}}px;',
|
373 |
+
],
|
374 |
+
]
|
375 |
+
);
|
376 |
+
$this->add_control(
|
377 |
+
'label_margin',
|
378 |
+
[
|
379 |
+
'label' => __( 'Margin', 'wts-eae' ),
|
380 |
+
'type' => Controls_Manager::DIMENSIONS,
|
381 |
+
'selectors' => [
|
382 |
+
'{{WRAPPER}} .eae-text-after' => 'margin: {{TOP}}px {{RIGHT}}px {{BOTTOM}}px {{LEFT}}px;',
|
383 |
+
'{{WRAPPER}} .eae-text-before' => 'margin: {{TOP}}px {{RIGHT}}px {{BOTTOM}}px {{LEFT}}px;',
|
384 |
+
],
|
385 |
+
]
|
386 |
+
);
|
387 |
+
|
388 |
+
$this->end_controls_section();
|
389 |
+
|
390 |
+
}
|
391 |
+
|
392 |
+
|
393 |
+
protected function render() {
|
394 |
+
$settings = $this->get_settings();
|
395 |
+
//print_r($settings);
|
396 |
+
$this->add_render_attribute('wrapper', 'class', 'eae-img-comp-container');
|
397 |
+
$this->add_render_attribute('wrapper', 'class', 'mode-'.$settings['compare_style']);
|
398 |
+
$this->add_render_attribute('wrapper', 'data-ab-style', $settings['compare_style']);
|
399 |
+
$this->add_render_attribute('wrapper', 'data-slider-pos', $settings['slider_position']['size']);
|
400 |
+
|
401 |
+
$this->add_render_attribute('icon', 'class', 'icon-'.$settings['compare_style']);
|
402 |
+
$this->add_render_attribute('icon', 'class', 'eae-img-comp-slider');
|
403 |
+
?>
|
404 |
+
<figure <?php echo $this->get_render_attribute_string('wrapper'); ?> >
|
405 |
+
<?php echo wp_get_attachment_image($settings['before_image']['id'], $settings['before_image_size_size']); ?>
|
406 |
+
|
407 |
+
<?php if($settings['text_before'] !== "") { ?>
|
408 |
+
<span class="eae-text-before"><?php echo $settings['text_before']; ?></span>
|
409 |
+
<?php } ?>
|
410 |
+
|
411 |
+
<div <?php echo $this->get_render_attribute_string('icon'); ?> >
|
412 |
+
<i class="<?php echo $settings['slider_icon']; ?> eae-slider-icon" ></i>
|
413 |
+
</div>
|
414 |
+
|
415 |
+
<div class="eae-img-comp-img eae-img-comp-overlay">
|
416 |
+
<?php echo wp_get_attachment_image($settings['after_image']['id'], $settings['after_image_size_size']); ?>
|
417 |
+
|
418 |
+
<?php if($settings['text_after'] !== "") { ?>
|
419 |
+
<span class="eae-text-after"><?php echo $settings['text_after']; ?></span>
|
420 |
+
<?php } ?>
|
421 |
+
</div>
|
422 |
+
|
423 |
+
</figure>
|
424 |
+
<?php
|
425 |
+
}
|
426 |
+
|
427 |
+
protected function _content_template() {
|
428 |
+
?>
|
429 |
+
<#
|
430 |
+
view.addRenderAttribute('wrapper','class','eae-img-comp-container');
|
431 |
+
view.addRenderAttribute('wrapper','class','mode-'+settings.compare_style);
|
432 |
+
view.addRenderAttribute('wrapper','data-ab-style',settings.compare_style);
|
433 |
+
view.addRenderAttribute('wrapper','data-slider-pos', settings.slider_position.size);
|
434 |
+
|
435 |
+
view.addRenderAttribute('icon','class',settings.slider_icon);
|
436 |
+
view.addRenderAttribute('icon','class','eae-slider-icon');
|
437 |
+
#>
|
438 |
+
|
439 |
+
<div {{{ view.getRenderAttributeString( 'wrapper') }}} >
|
440 |
+
<img src="{{{ settings.before_image.url }}}" />
|
441 |
+
<# if(settings.text_before) {#>
|
442 |
+
<span class="eae-text-before">{{{settings.text_before}}}</span>
|
443 |
+
<# } #>
|
444 |
+
<div class="eae-img-comp-slider"">
|
445 |
+
<i {{{ view.getRenderAttributeString( 'icon') }}} ></i>
|
446 |
+
</div>
|
447 |
+
|
448 |
+
<div class="eae-img-comp-img eae-img-comp-overlay">
|
449 |
+
<img src="{{{ settings.after_image.url }}}" >
|
450 |
+
<# if(settings.text_after) { #>
|
451 |
+
<span class="eae-text-after">{{{settings.text_after}}}</span>
|
452 |
+
<# } #>
|
453 |
+
</div>
|
454 |
+
|
455 |
+
</div>
|
456 |
+
<?php
|
457 |
+
}
|
458 |
+
}
|
459 |
Plugin::instance()->widgets_manager->register_widget_type( new Widget_Compare_Image() );
|
elements/modal-popup.php
ADDED
@@ -0,0 +1,860 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
<?php
|
2 |
+
namespace Elementor;
|
3 |
+
use Elementor;
|
4 |
+
|
5 |
+
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
6 |
+
|
7 |
+
class Widget_Modal_Popup extends Widget_Base {
|
8 |
+
|
9 |
+
public function get_name() {
|
10 |
+
return 'wts-modal-popup';
|
11 |
+
}
|
12 |
+
|
13 |
+
public function get_title() {
|
14 |
+
return __( 'EAE - Modal Popup', 'wts-eae' );
|
15 |
+
}
|
16 |
+
|
17 |
+
public function get_icon() {
|
18 |
+
return 'eicon-flip-box wts-eae-pe';
|
19 |
+
}
|
20 |
+
|
21 |
+
public function get_categories() {
|
22 |
+
return [ 'wts-eae' ];
|
23 |
+
}
|
24 |
+
|
25 |
+
protected function _register_controls() {
|
26 |
+
$this->start_controls_section(
|
27 |
+
'section_content',
|
28 |
+
[
|
29 |
+
'label' => __( 'Content', 'wts-eae' )
|
30 |
+
]
|
31 |
+
);
|
32 |
+
$this->add_control(
|
33 |
+
'content_type',
|
34 |
+
[
|
35 |
+
'label' => __( 'Content Type', 'wts-eae' ),
|
36 |
+
'type' => Controls_Manager::SELECT,
|
37 |
+
'options' => [
|
38 |
+
'content' => __( 'Content', 'wts-eae' ),
|
39 |
+
'savedsection' => __( 'Saved Section', 'wts-eae' ),
|
40 |
+
'savedpage' => __( 'Saved Page', 'wts-eae' ),
|
41 |
+
],
|
42 |
+
'default' => 'content',
|
43 |
+
|
44 |
+
]
|
45 |
+
);
|
46 |
+
$this->add_control(
|
47 |
+
'preview_modal',
|
48 |
+
[
|
49 |
+
'label' => __( 'Preview Modal Popup', 'wts-eae' ),
|
50 |
+
'type' => Controls_Manager::SWITCHER,
|
51 |
+
'default' => '',
|
52 |
+
'label_on' => __( 'Yes', 'wts-eae' ),
|
53 |
+
'label_off' => __( 'No', 'wts-eae' ),
|
54 |
+
'return_value' => 'yes',
|
55 |
+
]
|
56 |
+
);
|
57 |
+
$this->add_control(
|
58 |
+
'modal_title',
|
59 |
+
[
|
60 |
+
'label' => __( 'Title', 'wts-eae' ),
|
61 |
+
'type' => Controls_Manager::TEXT,
|
62 |
+
'dynamic' => [
|
63 |
+
'active' => true,
|
64 |
+
],
|
65 |
+
'placeholder' => __( 'Enter text', 'wts-eae' ),
|
66 |
+
'default' => __( 'Modal Title', 'wts-eae' ),
|
67 |
+
]
|
68 |
+
);
|
69 |
+
|
70 |
+
$this->add_control(
|
71 |
+
'modal_content',
|
72 |
+
[
|
73 |
+
'label' => __( 'Content', 'wts-eae' ),
|
74 |
+
'type' => Controls_Manager::WYSIWYG,
|
75 |
+
'placeholder' => __( 'Content', 'wts-eae' ),
|
76 |
+
'dynamic' => [
|
77 |
+
'active' => true,
|
78 |
+
],
|
79 |
+
'default' => __( 'Add some nice text here.', 'wts-eae' ),
|
80 |
+
'condition' => [
|
81 |
+
'content_type' => 'content',
|
82 |
+
],
|
83 |
+
]
|
84 |
+
);
|
85 |
+
|
86 |
+
$saved_sections[''] = __('Select Section', 'wts-eae');
|
87 |
+
$saved_sections = $saved_sections + $this->select_elementor_page('section');
|
88 |
+
$this->add_control(
|
89 |
+
'saved_sections',
|
90 |
+
[
|
91 |
+
'label' => __( 'Select Section', 'wts-eae' ),
|
92 |
+
'type' => Controls_Manager::SELECT,
|
93 |
+
'options' => $saved_sections,
|
94 |
+
'condition' => [
|
95 |
+
'content_type' => 'savedsection',
|
96 |
+
],
|
97 |
+
]
|
98 |
+
);
|
99 |
+
|
100 |
+
$saved_pages[''] = __('Select Page', 'wts-eae');
|
101 |
+
$saved_pages = $saved_pages + $this->select_elementor_page('page');
|
102 |
+
$this->add_control(
|
103 |
+
'saved_pages',
|
104 |
+
[
|
105 |
+
'label' => __( 'Select Page', 'wts-eae' ),
|
106 |
+
'type' => Controls_Manager::SELECT,
|
107 |
+
'options' => $saved_pages,
|
108 |
+
'condition' => [
|
109 |
+
'content_type' => 'savedpage',
|
110 |
+
],
|
111 |
+
]
|
112 |
+
);
|
113 |
+
|
114 |
+
$this->end_controls_section();
|
115 |
+
|
116 |
+
$this->start_controls_section(
|
117 |
+
'modal_setting',
|
118 |
+
[
|
119 |
+
'label' => __( 'Modal Setting', 'wts-eae' )
|
120 |
+
]
|
121 |
+
);
|
122 |
+
|
123 |
+
$this->add_responsive_control(
|
124 |
+
'modal_width',
|
125 |
+
[
|
126 |
+
'label' => __( 'Modal Width', 'wts-eae' ),
|
127 |
+
'type' => Controls_Manager::SLIDER,
|
128 |
+
'range' => [
|
129 |
+
'%' => [
|
130 |
+
'min' => 10,
|
131 |
+
'max' => 100,
|
132 |
+
],
|
133 |
+
],
|
134 |
+
'selectors' => [
|
135 |
+
'.eae-popup-{{ID}} .mfp-inline-holder .mfp-content' => 'width: {{SIZE}}%;',
|
136 |
+
],
|
137 |
+
]
|
138 |
+
);
|
139 |
+
|
140 |
+
$this->add_control(
|
141 |
+
'overlay_color',
|
142 |
+
[
|
143 |
+
'label' => __( 'Overlay Color', 'wts-eae' ),
|
144 |
+
'type' => Controls_Manager::COLOR,
|
145 |
+
'default' => 'rgba(0,0,0,0.75)',
|
146 |
+
'selectors' => [
|
147 |
+
'.eae-popup-{{ID}}.mfp-bg' => 'background-color: {{VALUE}};',
|
148 |
+
],
|
149 |
+
|
150 |
+
]
|
151 |
+
);
|
152 |
+
|
153 |
+
$this->end_controls_section();
|
154 |
+
|
155 |
+
$this->start_controls_section(
|
156 |
+
'display_setting',
|
157 |
+
[
|
158 |
+
'label' => __( 'Display Setting', 'wts-eae' )
|
159 |
+
]
|
160 |
+
);
|
161 |
+
|
162 |
+
$this->add_control(
|
163 |
+
'button_text',
|
164 |
+
[
|
165 |
+
'label' => __( 'Button Text', 'wts-eae' ),
|
166 |
+
'type' => Controls_Manager::TEXT,
|
167 |
+
'default' => 'Click Me'
|
168 |
+
]
|
169 |
+
);
|
170 |
+
|
171 |
+
$this->add_control(
|
172 |
+
'button_align',
|
173 |
+
[
|
174 |
+
'label' => __( 'Alignment', 'wts-eae' ),
|
175 |
+
'type' => Controls_Manager::CHOOSE,
|
176 |
+
'options' => [
|
177 |
+
'left' => [
|
178 |
+
'title' => __( 'Left', 'wts-eae' ),
|
179 |
+
'icon' => 'fa fa-align-left',
|
180 |
+
],
|
181 |
+
'center' => [
|
182 |
+
'title' => __( 'Center', 'wts-eae' ),
|
183 |
+
'icon' => 'fa fa-align-center',
|
184 |
+
],
|
185 |
+
'right' => [
|
186 |
+
'title' => __( 'Right', 'wts-eae' ),
|
187 |
+
'icon' => 'fa fa-align-right',
|
188 |
+
],
|
189 |
+
'justify' => [
|
190 |
+
'title' => __( 'Right', 'wts-eae' ),
|
191 |
+
'icon' => 'fa fa-align-justify',
|
192 |
+
],
|
193 |
+
],
|
194 |
+
'prefix_class' => 'eae-pop-btn-align-',
|
195 |
+
]
|
196 |
+
);
|
197 |
+
|
198 |
+
$this->add_control(
|
199 |
+
'button_icon',
|
200 |
+
[
|
201 |
+
'label' => __( 'Icon', 'wts-eae' ),
|
202 |
+
'type' => Controls_Manager::ICON,
|
203 |
+
'label_block' => true,
|
204 |
+
'default' => 'fa fa-star',
|
205 |
+
]
|
206 |
+
);
|
207 |
+
$this->add_control(
|
208 |
+
'icon_position',
|
209 |
+
[
|
210 |
+
'label' => __( 'Icon Position', 'wts-eae' ),
|
211 |
+
'type' => Controls_Manager::SELECT,
|
212 |
+
'options' => [
|
213 |
+
'before' => __( 'Before', 'wts-eae' ),
|
214 |
+
'after' => __( 'After', 'wts-eae' ),
|
215 |
+
],
|
216 |
+
'default' => 'before',
|
217 |
+
]
|
218 |
+
);
|
219 |
+
|
220 |
+
$this->add_control(
|
221 |
+
'icon_spacing',
|
222 |
+
[
|
223 |
+
'label' => __( 'Icon Spacing', 'wts-eae' ),
|
224 |
+
'type' => Controls_Manager::SLIDER,
|
225 |
+
'range' => [
|
226 |
+
'px' => [
|
227 |
+
'min' => 6,
|
228 |
+
'max' => 100,
|
229 |
+
],
|
230 |
+
],
|
231 |
+
'selectors' => [
|
232 |
+
'.eae-popup-{{ID}} .icon-position-before i' => 'margin-right: {{SIZE}}{{UNIT}};',
|
233 |
+
'.eae-popup-{{ID}} .icon-position-after i' => 'margin-left: {{SIZE}}{{UNIT}};',
|
234 |
+
],
|
235 |
+
]
|
236 |
+
);
|
237 |
+
$this->end_controls_section();
|
238 |
+
|
239 |
+
$this->start_controls_section(
|
240 |
+
'popup_styling',
|
241 |
+
[
|
242 |
+
'label' => __( 'Popup', 'wts-eae' ),
|
243 |
+
'tab' => Controls_Manager::TAB_STYLE,
|
244 |
+
]
|
245 |
+
);
|
246 |
+
|
247 |
+
$this->add_control(
|
248 |
+
'title_heading',
|
249 |
+
[
|
250 |
+
'label' => __( 'Title', 'wts-eae' ),
|
251 |
+
'type' => Controls_Manager::HEADING,
|
252 |
+
]
|
253 |
+
);
|
254 |
+
$this->add_control(
|
255 |
+
'title_color',
|
256 |
+
[
|
257 |
+
'label' => __( 'Color', 'wts-eae' ),
|
258 |
+
'type' => Controls_Manager::COLOR,
|
259 |
+
'scheme' => [
|
260 |
+
'type' => Scheme_Color::get_type(),
|
261 |
+
'value' => Scheme_Color::COLOR_1,
|
262 |
+
],
|
263 |
+
'selectors' => [
|
264 |
+
'.eae-popup-{{ID}} .mfp-title' => 'color: {{VALUE}};',
|
265 |
+
],
|
266 |
+
]
|
267 |
+
);
|
268 |
+
$this->add_control(
|
269 |
+
'title_bg_color',
|
270 |
+
[
|
271 |
+
'label' => __( 'Background Color', 'wts-eae' ),
|
272 |
+
'type' => Controls_Manager::COLOR,
|
273 |
+
'selectors' => [
|
274 |
+
'.eae-popup-{{ID}} .mfp-title' => 'background-color: {{VALUE}};',
|
275 |
+
],
|
276 |
+
]
|
277 |
+
);
|
278 |
+
|
279 |
+
$this->add_responsive_control(
|
280 |
+
'title_padding',
|
281 |
+
[
|
282 |
+
'label' => __( 'Padding', 'wts-eae' ),
|
283 |
+
'type' => Controls_Manager::DIMENSIONS,
|
284 |
+
'size_units' => [ 'px', 'em', '%' ],
|
285 |
+
'selectors' => [
|
286 |
+
'.eae-popup-{{ID}} .mfp-title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
287 |
+
],
|
288 |
+
]
|
289 |
+
);
|
290 |
+
|
291 |
+
$this->add_group_control(
|
292 |
+
Group_Control_Typography::get_type(),
|
293 |
+
[
|
294 |
+
'name' => 'title_typography',
|
295 |
+
'label' => __( 'Typography', 'wts-eae' ),
|
296 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
297 |
+
'selector' => '.eae-popup-{{ID}} .mfp-title',
|
298 |
+
]
|
299 |
+
);
|
300 |
+
$this->add_group_control(
|
301 |
+
Group_Control_Text_Shadow::get_type(),
|
302 |
+
[
|
303 |
+
'name' => 'item_text_shadow',
|
304 |
+
'label' => 'Text Shadow',
|
305 |
+
'selector' => '.eae-popup-{{ID}} .mfp-title',
|
306 |
+
]
|
307 |
+
);
|
308 |
+
|
309 |
+
$this->add_control(
|
310 |
+
'content_heading',
|
311 |
+
[
|
312 |
+
'label' => __( 'Content', 'wts-eae' ),
|
313 |
+
'type' => Controls_Manager::HEADING,
|
314 |
+
'separator' => 'before',
|
315 |
+
]
|
316 |
+
);
|
317 |
+
|
318 |
+
$this->add_control(
|
319 |
+
'content_color',
|
320 |
+
[
|
321 |
+
'label' => __( 'Color', 'wts-eae' ),
|
322 |
+
'type' => Controls_Manager::COLOR,
|
323 |
+
'scheme' => [
|
324 |
+
'type' => Scheme_Color::get_type(),
|
325 |
+
'value' => Scheme_Color::COLOR_3,
|
326 |
+
],
|
327 |
+
'selectors' => [
|
328 |
+
'.eae-popup-{{ID}} .eae-modal-content' => 'color: {{VALUE}};',
|
329 |
+
],
|
330 |
+
'condition' => [
|
331 |
+
'content_type' => 'content',
|
332 |
+
],
|
333 |
+
]
|
334 |
+
);
|
335 |
+
|
336 |
+
$this->add_control(
|
337 |
+
'background_color',
|
338 |
+
[
|
339 |
+
'label' => __( 'Color', 'wts-eae' ),
|
340 |
+
'type' => Controls_Manager::COLOR,
|
341 |
+
'selectors' => [
|
342 |
+
'.eae-popup-{{ID}} .mfp-inline-holder .mfp-content' => 'background-color: {{VALUE}};',
|
343 |
+
],
|
344 |
+
]
|
345 |
+
);
|
346 |
+
|
347 |
+
$this->add_group_control(
|
348 |
+
Group_Control_Typography::get_type(),
|
349 |
+
[
|
350 |
+
'name' => 'content_typography',
|
351 |
+
'label' => __( 'Typography', 'wts-eae' ),
|
352 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_3,
|
353 |
+
'selector' => '.eae-popup-{{ID}} .eae-modal-content',
|
354 |
+
'condition' => [
|
355 |
+
'content_type' => 'content',
|
356 |
+
],
|
357 |
+
]
|
358 |
+
);
|
359 |
+
$this->add_group_control(
|
360 |
+
Group_Control_Text_Shadow::get_type(),
|
361 |
+
[
|
362 |
+
'name' => 'content_text_shadow',
|
363 |
+
'label' => 'Text Shadow',
|
364 |
+
'selector' => '.eae-popup-{{ID}} .eae-modal-content',
|
365 |
+
'condition' => [
|
366 |
+
'content_type' => 'content',
|
367 |
+
],
|
368 |
+
]
|
369 |
+
);
|
370 |
+
|
371 |
+
$this->add_responsive_control(
|
372 |
+
'content_padding',
|
373 |
+
[
|
374 |
+
'label' => __( 'Padding', 'wts-eae' ),
|
375 |
+
'type' => Controls_Manager::DIMENSIONS,
|
376 |
+
'size_units' => [ 'px', 'em', '%' ],
|
377 |
+
'selectors' => [
|
378 |
+
'.eae-popup .eae-modal-content' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
379 |
+
],
|
380 |
+
]
|
381 |
+
);
|
382 |
+
|
383 |
+
$this->add_group_control(
|
384 |
+
Group_Control_Border::get_type(),
|
385 |
+
[
|
386 |
+
'name' => 'box_border',
|
387 |
+
'label' => __( 'Border', 'wts-eae' ),
|
388 |
+
'separator' => 'before',
|
389 |
+
'selector' => '.eae-popup-{{ID}} .mfp-inline-holder .mfp-content',
|
390 |
+
]
|
391 |
+
);
|
392 |
+
|
393 |
+
$this->add_control(
|
394 |
+
'box_border_radius',
|
395 |
+
[
|
396 |
+
'label' => __( 'Border Radius', 'wts-eae' ),
|
397 |
+
'type' => Controls_Manager::DIMENSIONS,
|
398 |
+
'size_units' => [ 'px', '%' ],
|
399 |
+
'selectors' => [
|
400 |
+
'.eae-popup-{{ID}} .mfp-inline-holder .mfp-content' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
401 |
+
],
|
402 |
+
]
|
403 |
+
);
|
404 |
+
|
405 |
+
$this->add_group_control(
|
406 |
+
Group_Control_Box_Shadow::get_type(),
|
407 |
+
[
|
408 |
+
'name' => 'item_box_shadow',
|
409 |
+
'label' => 'Box Shadow',
|
410 |
+
'selector' => '.eae-popup-{{ID}} .mfp-content',
|
411 |
+
]
|
412 |
+
);
|
413 |
+
$this->end_controls_section();
|
414 |
+
|
415 |
+
$this->start_controls_section(
|
416 |
+
'button_styling',
|
417 |
+
[
|
418 |
+
'label' => __( 'Button', 'wts-eae' ),
|
419 |
+
'tab' => Controls_Manager::TAB_STYLE,
|
420 |
+
]
|
421 |
+
);
|
422 |
+
|
423 |
+
|
424 |
+
$this->add_group_control(
|
425 |
+
Group_Control_Typography::get_type(),
|
426 |
+
[
|
427 |
+
'name' => 'btn_text_typography',
|
428 |
+
'label' => __( 'Typography', 'wts-eae' ),
|
429 |
+
'selector' => '.eae-popup-{{ID}} .eae-popup-link',
|
430 |
+
]
|
431 |
+
);
|
432 |
+
|
433 |
+
$this->start_controls_tabs( 'eg_items_tab' );
|
434 |
+
|
435 |
+
$this->start_controls_tab(
|
436 |
+
'btn_default',
|
437 |
+
[
|
438 |
+
'label' => __( 'Default', 'wts-eae' ),
|
439 |
+
]
|
440 |
+
);
|
441 |
+
$this->add_control(
|
442 |
+
'button_color',
|
443 |
+
[
|
444 |
+
'label' => __( 'Text Color', 'wts-eae' ),
|
445 |
+
'type' => Controls_Manager::COLOR,
|
446 |
+
'selectors' => [
|
447 |
+
'.eae-popup-{{ID}} .eae-popup-link' => 'color: {{VALUE}};',
|
448 |
+
],
|
449 |
+
]
|
450 |
+
);
|
451 |
+
|
452 |
+
$this->add_group_control(
|
453 |
+
Group_Control_Text_Shadow::get_type(),
|
454 |
+
[
|
455 |
+
'name' => 'btn_text_shadow',
|
456 |
+
'label' => 'Text Shadow',
|
457 |
+
'selector' => '.eae-popup-{{ID}} .eae-popup-link',
|
458 |
+
]
|
459 |
+
);
|
460 |
+
|
461 |
+
$this->add_control(
|
462 |
+
'btn_background_color',
|
463 |
+
[
|
464 |
+
'label' => __( 'Background Color', 'wts-eae' ),
|
465 |
+
'type' => Controls_Manager::COLOR,
|
466 |
+
'default' => '#61ce70',
|
467 |
+
'selectors' => [
|
468 |
+
'.eae-popup-{{ID}} .eae-popup-link' => 'background-color: {{VALUE}};',
|
469 |
+
],
|
470 |
+
]
|
471 |
+
);
|
472 |
+
|
473 |
+
$this->add_control(
|
474 |
+
'btn_border_radius',
|
475 |
+
[
|
476 |
+
'label' => __( 'Border Radius', 'wts-eae' ),
|
477 |
+
'type' => Controls_Manager::DIMENSIONS,
|
478 |
+
'size_units' => [ 'px', '%' ],
|
479 |
+
'selectors' => [
|
480 |
+
'.eae-popup-{{ID}} .eae-popup-link' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
481 |
+
],
|
482 |
+
]
|
483 |
+
);
|
484 |
+
$this->add_group_control(
|
485 |
+
Group_Control_Box_Shadow::get_type(),
|
486 |
+
[
|
487 |
+
'name' => 'btn_box_shadow',
|
488 |
+
'label' => 'Box Shadow',
|
489 |
+
'selector' => '.eae-popup-{{ID}} .eae-popup-link',
|
490 |
+
]
|
491 |
+
);
|
492 |
+
|
493 |
+
$this->end_controls_tab();
|
494 |
+
|
495 |
+
$this->start_controls_tab(
|
496 |
+
'btn_hover',
|
497 |
+
[
|
498 |
+
'label' => __( 'Hover', 'wts-eae' ),
|
499 |
+
]
|
500 |
+
);
|
501 |
+
$this->add_control(
|
502 |
+
'button_color_hover',
|
503 |
+
[
|
504 |
+
'label' => __( 'Text Color', 'wts-eae' ),
|
505 |
+
'type' => Controls_Manager::COLOR,
|
506 |
+
'selectors' => [
|
507 |
+
'.eae-popup-{{ID}} .eae-popup-link:hover' => 'color: {{VALUE}};',
|
508 |
+
],
|
509 |
+
]
|
510 |
+
);
|
511 |
+
|
512 |
+
$this->add_group_control(
|
513 |
+
Group_Control_Text_Shadow::get_type(),
|
514 |
+
[
|
515 |
+
'name' => 'btn_text_shadow_hover',
|
516 |
+
'label' => 'Text Shadow',
|
517 |
+
'selector' => '.eae-popup-{{ID}} .eae-popup-link:hover',
|
518 |
+
]
|
519 |
+
);
|
520 |
+
|
521 |
+
|
522 |
+
$this->add_control(
|
523 |
+
'btn_background_color_hover',
|
524 |
+
[
|
525 |
+
'label' => __( 'Background Color', 'wts-eae' ),
|
526 |
+
'type' => Controls_Manager::COLOR,
|
527 |
+
'default' => '#61ce70',
|
528 |
+
'selectors' => [
|
529 |
+
'.eae-popup-{{ID}} .eae-popup-link:hover' => 'background-color: {{VALUE}};',
|
530 |
+
],
|
531 |
+
]
|
532 |
+
);
|
533 |
+
|
534 |
+
$this->add_control(
|
535 |
+
'btn_border_color_hover',
|
536 |
+
[
|
537 |
+
'label' => __( 'Border Color', 'wts-eae' ),
|
538 |
+
'type' => Controls_Manager::COLOR,
|
539 |
+
'selectors' => [
|
540 |
+
'.eae-popup-{{ID}} .eae-popup-link:hover' => 'border-color: {{VALUE}};',
|
541 |
+
],
|
542 |
+
]
|
543 |
+
);
|
544 |
+
|
545 |
+
$this->add_control(
|
546 |
+
'btn_border_radius_hover',
|
547 |
+
[
|
548 |
+
'label' => __( 'Border Radius', 'wts-eae' ),
|
549 |
+
'type' => Controls_Manager::DIMENSIONS,
|
550 |
+
'size_units' => [ 'px', '%' ],
|
551 |
+
'selectors' => [
|
552 |
+
'.eae-popup-{{ID}} .eae-popup-link:hover' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
553 |
+
],
|
554 |
+
]
|
555 |
+
);
|
556 |
+
|
557 |
+
$this->add_group_control(
|
558 |
+
Group_Control_Box_Shadow::get_type(),
|
559 |
+
[
|
560 |
+
'name' => 'btn_box_shadow_hover',
|
561 |
+
'label' => 'Box Shadow',
|
562 |
+
'selector' => '.eae-popup-{{ID}} .eae-popup-link:hover',
|
563 |
+
]
|
564 |
+
);
|
565 |
+
$this->end_controls_tab();
|
566 |
+
|
567 |
+
$this->end_controls_tab();
|
568 |
+
|
569 |
+
$this->end_controls_tabs();
|
570 |
+
|
571 |
+
|
572 |
+
$this->add_responsive_control(
|
573 |
+
'button_padding',
|
574 |
+
[
|
575 |
+
'label' => __( 'Padding', 'wts-eae' ),
|
576 |
+
'type' => Controls_Manager::DIMENSIONS,
|
577 |
+
'size_units' => [ 'px', 'em', '%' ],
|
578 |
+
'selectors' => [
|
579 |
+
'.eae-popup-{{ID}} .eae-popup-link' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
580 |
+
],
|
581 |
+
'separator' => 'before',
|
582 |
+
]
|
583 |
+
);
|
584 |
+
|
585 |
+
$this->add_group_control(
|
586 |
+
Group_Control_Border::get_type(),
|
587 |
+
[
|
588 |
+
'name' => 'btn_border',
|
589 |
+
'label' => __( 'Border', 'wts-eae' ),
|
590 |
+
'selector' => '.eae-popup-{{ID}} .eae-popup-link',
|
591 |
+
]
|
592 |
+
);
|
593 |
+
|
594 |
+
$this->end_controls_section();
|
595 |
+
|
596 |
+
$this->start_controls_section(
|
597 |
+
'close_button_styling',
|
598 |
+
[
|
599 |
+
'label' => __( 'Close Button', 'wts-eae' ),
|
600 |
+
'tab' => Controls_Manager::TAB_STYLE,
|
601 |
+
]
|
602 |
+
);
|
603 |
+
$this->add_control(
|
604 |
+
'btn_in_out',
|
605 |
+
[
|
606 |
+
'label' => __( 'Button Inside', 'wts-eae' ),
|
607 |
+
'type' => Controls_Manager::SWITCHER,
|
608 |
+
'default' => 'yes',
|
609 |
+
]
|
610 |
+
);
|
611 |
+
$this->add_control(
|
612 |
+
'close_btn_icon',
|
613 |
+
[
|
614 |
+
'label' => __( 'Icon', 'wts-eae' ),
|
615 |
+
'type' => Controls_Manager::ICON,
|
616 |
+
'default' => 'fa fa-times',
|
617 |
+
'include' => [
|
618 |
+
'fa fa-times',
|
619 |
+
'fa fa-times-circle-o',
|
620 |
+
'fa fa-times-circle',
|
621 |
+
'fa fa-window-close',
|
622 |
+
'fa fa-window-close-o',
|
623 |
+
],
|
624 |
+
|
625 |
+
|
626 |
+
]
|
627 |
+
);
|
628 |
+
$this->add_control(
|
629 |
+
'close_btn_size',
|
630 |
+
[
|
631 |
+
'label' => __( 'Size', 'wts-eae' ),
|
632 |
+
'type' => Controls_Manager::SLIDER,
|
633 |
+
'range' => [
|
634 |
+
'px' => [
|
635 |
+
'min' => 0,
|
636 |
+
'max' => 60,
|
637 |
+
],
|
638 |
+
],
|
639 |
+
'selectors' => [
|
640 |
+
'.eae-popup-{{ID}} .eae-close' => 'font-size: {{SIZE}}px;',
|
641 |
+
],
|
642 |
+
]
|
643 |
+
);
|
644 |
+
|
645 |
+
$this->add_control(
|
646 |
+
'close_btn_color',
|
647 |
+
[
|
648 |
+
'label' => __( 'Color', 'wts-eae' ),
|
649 |
+
'type' => Controls_Manager::COLOR,
|
650 |
+
'selectors' => [
|
651 |
+
'.eae-popup-{{ID}}.eae-popup .eae-close' => 'color: {{VALUE}};',
|
652 |
+
],
|
653 |
+
]
|
654 |
+
);
|
655 |
+
$this->add_responsive_control(
|
656 |
+
'close_btn_position_top_in',
|
657 |
+
[
|
658 |
+
'label' => __( 'Position Top', 'wts-eae' ),
|
659 |
+
'type' => Controls_Manager::SLIDER,
|
660 |
+
'size_units' => [ 'px', '%' ],
|
661 |
+
'range' => [
|
662 |
+
'%' => [
|
663 |
+
'min' => 0,
|
664 |
+
'max' => 100,
|
665 |
+
],
|
666 |
+
'px' => [
|
667 |
+
'min' => 0,
|
668 |
+
'max' => 1000,
|
669 |
+
],
|
670 |
+
],
|
671 |
+
'selectors' => [
|
672 |
+
'.eae-popup-{{ID}} .eae-close' => 'top:{{SIZE}}{{UNIT}};',
|
673 |
+
],
|
674 |
+
'condition' =>[
|
675 |
+
'btn_in_out' => 'yes'
|
676 |
+
]
|
677 |
+
]
|
678 |
+
);
|
679 |
+
$this->add_responsive_control(
|
680 |
+
'close_btn_position_right_in',
|
681 |
+
[
|
682 |
+
'label' => __( 'Position Right', 'wts-eae' ),
|
683 |
+
'type' => Controls_Manager::SLIDER,
|
684 |
+
'size_units' => [ 'px', '%' ],
|
685 |
+
'range' => [
|
686 |
+
'%' => [
|
687 |
+
'min' => 0,
|
688 |
+
'max' => 100,
|
689 |
+
],
|
690 |
+
'px' => [
|
691 |
+
'min' => 0,
|
692 |
+
'max' => 1000,
|
693 |
+
],
|
694 |
+
],
|
695 |
+
'selectors' => [
|
696 |
+
'.eae-popup-{{ID}} .eae-close' => 'right:{{SIZE}}{{UNIT}};',
|
697 |
+
],
|
698 |
+
'condition' =>[
|
699 |
+
'btn_in_out' => 'yes'
|
700 |
+
]
|
701 |
+
]
|
702 |
+
);
|
703 |
+
$this->add_responsive_control(
|
704 |
+
'close_btn_position_top_out',
|
705 |
+
[
|
706 |
+
'label' => __( 'Position Top', 'wts-eae' ),
|
707 |
+
'type' => Controls_Manager::SLIDER,
|
708 |
+
'size_units' => [ 'px', '%' ],
|
709 |
+
'range' => [
|
710 |
+
'%' => [
|
711 |
+
'min' => 0,
|
712 |
+
'max' => 100,
|
713 |
+
],
|
714 |
+
'px' => [
|
715 |
+
'min' => 0,
|
716 |
+
'max' => 1000,
|
717 |
+
],
|
718 |
+
],
|
719 |
+
'selectors' => [
|
720 |
+
'.eae-popup-{{ID}} .eae-close' => 'top:{{SIZE}}{{UNIT}};',
|
721 |
+
],
|
722 |
+
'condition' =>[
|
723 |
+
'btn_in_out!' => 'yes'
|
724 |
+
]
|
725 |
+
]
|
726 |
+
);
|
727 |
+
$this->add_responsive_control(
|
728 |
+
'close_btn_position_right_out',
|
729 |
+
[
|
730 |
+
'label' => __( 'Position Right', 'wts-eae' ),
|
731 |
+
'type' => Controls_Manager::SLIDER,
|
732 |
+
'size_units' => [ 'px', '%' ],
|
733 |
+
'range' => [
|
734 |
+
'%' => [
|
735 |
+
'min' => 0,
|
736 |
+
'max' => 100,
|
737 |
+
],
|
738 |
+
'px' => [
|
739 |
+
'min' => 0,
|
740 |
+
'max' => 1000,
|
741 |
+
],
|
742 |
+
],
|
743 |
+
'selectors' => [
|
744 |
+
'.eae-popup-{{ID}} .eae-close' => 'right:{{SIZE}}{{UNIT}};',
|
745 |
+
],
|
746 |
+
'condition' =>[
|
747 |
+
'btn_in_out!' => 'yes'
|
748 |
+
]
|
749 |
+
]
|
750 |
+
);
|
751 |
+
|
752 |
+
$this->end_controls_section();
|
753 |
+
}
|
754 |
+
|
755 |
+
public function select_elementor_page($type){
|
756 |
+
$args = array(
|
757 |
+
'tax_query' => array(
|
758 |
+
array(
|
759 |
+
'taxonomy' => 'elementor_library_type',
|
760 |
+
'field' => 'slug',
|
761 |
+
'terms' => $type,
|
762 |
+
),
|
763 |
+
),
|
764 |
+
'post_type' => 'elementor_library'
|
765 |
+
);
|
766 |
+
$query = new \WP_Query( $args );
|
767 |
+
|
768 |
+
$posts = $query->posts;
|
769 |
+
//$items['0'] = ['Select '.ucfirst($type)];
|
770 |
+
|
771 |
+
|
772 |
+
foreach($posts as $post) {
|
773 |
+
$items[$post->ID] = $post->post_title;
|
774 |
+
}
|
775 |
+
|
776 |
+
if(empty($items)){
|
777 |
+
$items = [];
|
778 |
+
}
|
779 |
+
|
780 |
+
return $items;
|
781 |
+
}
|
782 |
+
protected function render() {
|
783 |
+
$settings = $this->get_settings_for_display();
|
784 |
+
$data = $this->get_data();
|
785 |
+
|
786 |
+
$close_btn = $settings['btn_in_out'] == 'yes' ? 'true' : 'false';
|
787 |
+
//print_r($settings);
|
788 |
+
?>
|
789 |
+
<div class="eae-popup-wrapper eae-popup-<?php echo $data['id'] ?>" data-preview-modal="<?php echo $settings['preview_modal']; ?>" data-close-btn="<?php echo $settings['close_btn_icon'] ?>" data-close-in-out="<?php echo $close_btn; ?>">
|
790 |
+
<a class="eae-popup-link icon-position-<?php echo $settings['icon_position'] ?>" data-id="<?php echo $data['id'] ?>" href="#<?php echo $data['id'] ?>">
|
791 |
+
<?php if($settings['button_icon'] !== "" && $settings['icon_position'] == 'before')
|
792 |
+
{
|
793 |
+
echo '<span class="eae-popup-btn-icon"><i class="'.$settings['button_icon'].'"></i></span>';
|
794 |
+
}
|
795 |
+
?>
|
796 |
+
<span class="eae-popup-btn-text">
|
797 |
+
<?php echo $settings['button_text']; ?>
|
798 |
+
</span>
|
799 |
+
<?php if($settings['button_icon'] !== "" && $settings['icon_position'] == 'after')
|
800 |
+
{
|
801 |
+
echo '<span class="eae-popup-btn-icon"><i class="'.$settings['button_icon'].'"></i></span>';
|
802 |
+
}
|
803 |
+
?>
|
804 |
+
</a>
|
805 |
+
</div>
|
806 |
+
|
807 |
+
<div id="<?php echo $data['id'] ?>" class="eae-popup-<?php echo $data['id'] ?> mfp-hide eae-popup-container">
|
808 |
+
<div class="eae-content">
|
809 |
+
<?php if($settings['content_type'] == 'content') {
|
810 |
+
|
811 |
+
if($settings['modal_title'] !== '')
|
812 |
+
{
|
813 |
+
?>
|
814 |
+
<div class="eae-modal-title mfp-title">
|
815 |
+
<?php echo $settings['modal_title']; ?>
|
816 |
+
</div>
|
817 |
+
<?php } ?>
|
818 |
+
<div class="eae-modal-content">
|
819 |
+
<?php echo $settings['modal_content']; ?>
|
820 |
+
</div>
|
821 |
+
<?php
|
822 |
+
}
|
823 |
+
else if($settings['content_type'] == 'savedsection'){
|
824 |
+
if($settings['modal_title'] !== '')
|
825 |
+
{
|
826 |
+
?>
|
827 |
+
<div class="eae-modal-title mfp-title">
|
828 |
+
<?php echo $settings['modal_title']; ?>
|
829 |
+
</div>
|
830 |
+
<?php } ?>
|
831 |
+
<div class="eae-modal-content">
|
832 |
+
<?php echo Elementor\Plugin::instance()->frontend->get_builder_content_for_display( $settings['saved_sections'] ); ?>
|
833 |
+
</div>
|
834 |
+
<?php
|
835 |
+
}
|
836 |
+
else if($settings['content_type'] == 'savedpage'){
|
837 |
+
if($settings['modal_title'] !== '')
|
838 |
+
{
|
839 |
+
?>
|
840 |
+
<div class="eae-modal-title mfp-title">
|
841 |
+
<?php echo $settings['modal_title']; ?>
|
842 |
+
</div>
|
843 |
+
<?php } ?>
|
844 |
+
<div class="eae-modal-content">
|
845 |
+
<?php echo Elementor\Plugin::instance()->frontend->get_builder_content_for_display( $settings['saved_pages'] ); ?>
|
846 |
+
</div>
|
847 |
+
<?php
|
848 |
+
}
|
849 |
+
else{
|
850 |
+
echo $settings['content_type'];
|
851 |
+
}
|
852 |
+
?>
|
853 |
+
|
854 |
+
</div>
|
855 |
+
</div>
|
856 |
+
<?php
|
857 |
+
}
|
858 |
+
}
|
859 |
+
|
860 |
+
Plugin::instance()->widgets_manager->register_widget_type( new Widget_Modal_Popup() );
|
elements/particles.php
CHANGED
@@ -1,228 +1,228 @@
|
|
1 |
-
<?php
|
2 |
-
|
3 |
-
namespace EAE;
|
4 |
-
|
5 |
-
use Elementor\Controls_Manager;
|
6 |
-
|
7 |
-
class Particles{
|
8 |
-
|
9 |
-
private static $_instance = null;
|
10 |
-
|
11 |
-
public function __construct()
|
12 |
-
{
|
13 |
-
add_action( 'elementor/element/after_section_end', [ $this, 'register_controls' ], 10, 3 );
|
14 |
-
|
15 |
-
// Add print template for editor preview
|
16 |
-
add_action( 'elementor/section/print_template', [ $this, '_print_template'],
|
17 |
-
|
18 |
-
|
19 |
-
|
20 |
-
add_action( 'elementor/frontend/section/before_render', [ $this, '_before_render'],10,1);
|
21 |
-
|
22 |
-
}
|
23 |
-
|
24 |
-
public function register_controls($element, $section_id, $args){
|
25 |
-
|
26 |
-
if ( ('section' === $element->get_name() && 'section_background' === $section_id) || ('column' === $element->get_name() && 'section_style' === $section_id)) {
|
27 |
-
|
28 |
-
$element->start_controls_section(
|
29 |
-
'eae_particles',
|
30 |
-
[
|
31 |
-
'tab' => Controls_Manager::TAB_STYLE,
|
32 |
-
'label' => __( 'Particles', 'eae' )
|
33 |
-
]
|
34 |
-
);
|
35 |
-
|
36 |
-
$element->add_control(
|
37 |
-
'eae_enable_particles',
|
38 |
-
[
|
39 |
-
'type' => Controls_Manager::SWITCHER,
|
40 |
-
'label' => __('Enable Particle Background', 'eae'),
|
41 |
-
'default' => '',
|
42 |
-
'label_on' => __( 'Yes', 'ae-pro' ),
|
43 |
-
'label_off' => __( 'No', 'ae-pro' ),
|
44 |
-
'return_value' => 'yes',
|
45 |
-
'prefix_class' => 'eae-particle-',
|
46 |
-
'render_type' => 'template',
|
47 |
-
]
|
48 |
-
);
|
49 |
-
|
50 |
-
$element->add_control(
|
51 |
-
'eae_enable_particles_alert',
|
52 |
-
[
|
53 |
-
'type' => Controls_Manager::RAW_HTML,
|
54 |
-
'content_classes' => 'eae_enable_particles_alert elementor-control-field-description',
|
55 |
-
'raw' => __( '<a href="https://vincentgarreau.com/particles.js/" target="_blank">Click here</a> to generate JSON for the below field. </br><a href="https://goo.gl/pHziXj" target="_blank">Know more</a> about using this feature.', 'ae-pro' ),
|
56 |
-
'separator' => 'none',
|
57 |
-
'condition' => [
|
58 |
-
'eae_enable_particles' => 'yes',
|
59 |
-
],
|
60 |
-
]
|
61 |
-
);
|
62 |
-
|
63 |
-
$element->add_control(
|
64 |
-
'eae_particle_json',
|
65 |
-
[
|
66 |
-
'type' => Controls_Manager::CODE,
|
67 |
-
'label' => __('Add Particle Json'),
|
68 |
-
'default' => '{
|
69 |
-
"particles": {
|
70 |
-
"number": {
|
71 |
-
"value": 80,
|
72 |
-
"density": {
|
73 |
-
"enable": true,
|
74 |
-
"value_area": 800
|
75 |
-
}
|
76 |
-
},
|
77 |
-
"color": {
|
78 |
-
"value": "#ffffff"
|
79 |
-
},
|
80 |
-
"shape": {
|
81 |
-
"type": "circle",
|
82 |
-
"stroke": {
|
83 |
-
"width": 0,
|
84 |
-
"color": "#000000"
|
85 |
-
},
|
86 |
-
"polygon": {
|
87 |
-
"nb_sides": 5
|
88 |
-
},
|
89 |
-
"image": {
|
90 |
-
"src": "img/github.svg",
|
91 |
-
"width": 100,
|
92 |
-
"height": 100
|
93 |
-
}
|
94 |
-
},
|
95 |
-
"opacity": {
|
96 |
-
"value": 0.5,
|
97 |
-
"random": false,
|
98 |
-
"anim": {
|
99 |
-
"enable": false,
|
100 |
-
"speed": 1,
|
101 |
-
"opacity_min": 0.1,
|
102 |
-
"sync": false
|
103 |
-
}
|
104 |
-
},
|
105 |
-
"size": {
|
106 |
-
"value": 3,
|
107 |
-
"random": true,
|
108 |
-
"anim": {
|
109 |
-
"enable": false,
|
110 |
-
"speed": 40,
|
111 |
-
"size_min": 0.1,
|
112 |
-
"sync": false
|
113 |
-
}
|
114 |
-
},
|
115 |
-
"line_linked": {
|
116 |
-
"enable": true,
|
117 |
-
"distance": 150,
|
118 |
-
"color": "#ffffff",
|
119 |
-
"opacity": 0.4,
|
120 |
-
"width": 1
|
121 |
-
},
|
122 |
-
"move": {
|
123 |
-
"enable": true,
|
124 |
-
"speed": 6,
|
125 |
-
"direction": "none",
|
126 |
-
"random": false,
|
127 |
-
"straight": false,
|
128 |
-
"out_mode": "out",
|
129 |
-
"bounce": false,
|
130 |
-
"attract": {
|
131 |
-
"enable": false,
|
132 |
-
"rotateX": 600,
|
133 |
-
"rotateY": 1200
|
134 |
-
}
|
135 |
-
}
|
136 |
-
},
|
137 |
-
"interactivity": {
|
138 |
-
"detect_on": "canvas",
|
139 |
-
"events": {
|
140 |
-
"onhover": {
|
141 |
-
"enable": true,
|
142 |
-
"mode": "repulse"
|
143 |
-
},
|
144 |
-
"onclick": {
|
145 |
-
"enable": true,
|
146 |
-
"mode": "push"
|
147 |
-
},
|
148 |
-
"resize": true
|
149 |
-
},
|
150 |
-
"modes": {
|
151 |
-
"grab": {
|
152 |
-
"distance": 400,
|
153 |
-
"line_linked": {
|
154 |
-
"opacity": 1
|
155 |
-
}
|
156 |
-
},
|
157 |
-
"bubble": {
|
158 |
-
"distance": 400,
|
159 |
-
"size": 40,
|
160 |
-
"duration": 2,
|
161 |
-
"opacity": 8,
|
162 |
-
"speed": 3
|
163 |
-
},
|
164 |
-
"repulse": {
|
165 |
-
"distance": 200,
|
166 |
-
"duration": 0.4
|
167 |
-
},
|
168 |
-
"push": {
|
169 |
-
"particles_nb": 4
|
170 |
-
},
|
171 |
-
"remove": {
|
172 |
-
"particles_nb": 2
|
173 |
-
}
|
174 |
-
}
|
175 |
-
},
|
176 |
-
"retina_detect": true
|
177 |
-
}',
|
178 |
-
'render_type' => 'template',
|
179 |
-
'condition' => [
|
180 |
-
'eae_enable_particles' => 'yes'
|
181 |
-
]
|
182 |
-
]
|
183 |
-
);
|
184 |
-
|
185 |
-
$element->end_controls_section();
|
186 |
-
|
187 |
-
}
|
188 |
-
}
|
189 |
-
|
190 |
-
public function _before_render($element){
|
191 |
-
|
192 |
-
if($element->get_name() != 'section' && $element->get_name() != 'column'){
|
193 |
-
return;
|
194 |
-
}
|
195 |
-
|
196 |
-
$settings = $element->get_settings();
|
197 |
-
if($settings['eae_enable_particles'] == 'yes'){
|
198 |
-
$element->add_render_attribute('_wrapper', 'data-eae-particle', $settings['eae_particle_json']);
|
199 |
-
}
|
200 |
-
|
201 |
-
}
|
202 |
-
|
203 |
-
function _print_template($template,$widget){
|
204 |
-
if($widget->get_name() != 'section' && $widget->get_name() != 'column'){
|
205 |
-
return $template;
|
206 |
-
}
|
207 |
-
|
208 |
-
$old_template = $template;
|
209 |
-
ob_start();
|
210 |
-
?>
|
211 |
-
|
212 |
-
<div class="eae-particle-wrapper" id="eae-particle-{{ view.getID() }}" data-eae-pdata=" {{ settings.eae_particle_json }}"></div>
|
213 |
-
<?php
|
214 |
-
$slider_content = ob_get_contents();
|
215 |
-
ob_end_clean();
|
216 |
-
$template = $slider_content.$old_template;
|
217 |
-
return $template;
|
218 |
-
}
|
219 |
-
|
220 |
-
public static function instance() {
|
221 |
-
if ( is_null( self::$_instance ) ) {
|
222 |
-
self::$_instance = new self();
|
223 |
-
}
|
224 |
-
return self::$_instance;
|
225 |
-
}
|
226 |
-
}
|
227 |
-
|
228 |
Particles::instance();
|
1 |
+
<?php
|
2 |
+
|
3 |
+
namespace EAE;
|
4 |
+
|
5 |
+
use Elementor\Controls_Manager;
|
6 |
+
|
7 |
+
class Particles{
|
8 |
+
|
9 |
+
private static $_instance = null;
|
10 |
+
|
11 |
+
public function __construct()
|
12 |
+
{
|
13 |
+
add_action( 'elementor/element/after_section_end', [ $this, 'register_controls' ], 10, 3 );
|
14 |
+
|
15 |
+
// Add print template for editor preview
|
16 |
+
add_action( 'elementor/section/print_template', [ $this, '_print_template'],9,2);
|
17 |
+
add_action( 'elementor/column/print_template', [ $this, '_print_template'],10,2);
|
18 |
+
|
19 |
+
add_action( 'elementor/frontend/column/before_render', [ $this, '_before_render'],10,1);
|
20 |
+
add_action( 'elementor/frontend/section/before_render', [ $this, '_before_render'],10,1);
|
21 |
+
|
22 |
+
}
|
23 |
+
|
24 |
+
public function register_controls($element, $section_id, $args){
|
25 |
+
|
26 |
+
if ( ('section' === $element->get_name() && 'section_background' === $section_id) || ('column' === $element->get_name() && 'section_style' === $section_id)) {
|
27 |
+
|
28 |
+
$element->start_controls_section(
|
29 |
+
'eae_particles',
|
30 |
+
[
|
31 |
+
'tab' => Controls_Manager::TAB_STYLE,
|
32 |
+
'label' => __( 'EAE - Particles', 'eae' )
|
33 |
+
]
|
34 |
+
);
|
35 |
+
|
36 |
+
$element->add_control(
|
37 |
+
'eae_enable_particles',
|
38 |
+
[
|
39 |
+
'type' => Controls_Manager::SWITCHER,
|
40 |
+
'label' => __('Enable Particle Background', 'eae'),
|
41 |
+
'default' => '',
|
42 |
+
'label_on' => __( 'Yes', 'ae-pro' ),
|
43 |
+
'label_off' => __( 'No', 'ae-pro' ),
|
44 |
+
'return_value' => 'yes',
|
45 |
+
'prefix_class' => 'eae-particle-',
|
46 |
+
'render_type' => 'template',
|
47 |
+
]
|
48 |
+
);
|
49 |
+
|
50 |
+
$element->add_control(
|
51 |
+
'eae_enable_particles_alert',
|
52 |
+
[
|
53 |
+
'type' => Controls_Manager::RAW_HTML,
|
54 |
+
'content_classes' => 'eae_enable_particles_alert elementor-control-field-description',
|
55 |
+
'raw' => __( '<a href="https://vincentgarreau.com/particles.js/" target="_blank">Click here</a> to generate JSON for the below field. </br><a href="https://goo.gl/pHziXj" target="_blank">Know more</a> about using this feature.', 'ae-pro' ),
|
56 |
+
'separator' => 'none',
|
57 |
+
'condition' => [
|
58 |
+
'eae_enable_particles' => 'yes',
|
59 |
+
],
|
60 |
+
]
|
61 |
+
);
|
62 |
+
|
63 |
+
$element->add_control(
|
64 |
+
'eae_particle_json',
|
65 |
+
[
|
66 |
+
'type' => Controls_Manager::CODE,
|
67 |
+
'label' => __('Add Particle Json'),
|
68 |
+
'default' => '{
|
69 |
+
"particles": {
|
70 |
+
"number": {
|
71 |
+
"value": 80,
|
72 |
+
"density": {
|
73 |
+
"enable": true,
|
74 |
+
"value_area": 800
|
75 |
+
}
|
76 |
+
},
|
77 |
+
"color": {
|
78 |
+
"value": "#ffffff"
|
79 |
+
},
|
80 |
+
"shape": {
|
81 |
+
"type": "circle",
|
82 |
+
"stroke": {
|
83 |
+
"width": 0,
|
84 |
+
"color": "#000000"
|
85 |
+
},
|
86 |
+
"polygon": {
|
87 |
+
"nb_sides": 5
|
88 |
+
},
|
89 |
+
"image": {
|
90 |
+
"src": "img/github.svg",
|
91 |
+
"width": 100,
|
92 |
+
"height": 100
|
93 |
+
}
|
94 |
+
},
|
95 |
+
"opacity": {
|
96 |
+
"value": 0.5,
|
97 |
+
"random": false,
|
98 |
+
"anim": {
|
99 |
+
"enable": false,
|
100 |
+
"speed": 1,
|
101 |
+
"opacity_min": 0.1,
|
102 |
+
"sync": false
|
103 |
+
}
|
104 |
+
},
|
105 |
+
"size": {
|
106 |
+
"value": 3,
|
107 |
+
"random": true,
|
108 |
+
"anim": {
|
109 |
+
"enable": false,
|
110 |
+
"speed": 40,
|
111 |
+
"size_min": 0.1,
|
112 |
+
"sync": false
|
113 |
+
}
|
114 |
+
},
|
115 |
+
"line_linked": {
|
116 |
+
"enable": true,
|
117 |
+
"distance": 150,
|
118 |
+
"color": "#ffffff",
|
119 |
+
"opacity": 0.4,
|
120 |
+
"width": 1
|
121 |
+
},
|
122 |
+
"move": {
|
123 |
+
"enable": true,
|
124 |
+
"speed": 6,
|
125 |
+
"direction": "none",
|
126 |
+
"random": false,
|
127 |
+
"straight": false,
|
128 |
+
"out_mode": "out",
|
129 |
+
"bounce": false,
|
130 |
+
"attract": {
|
131 |
+
"enable": false,
|
132 |
+
"rotateX": 600,
|
133 |
+
"rotateY": 1200
|
134 |
+
}
|
135 |
+
}
|
136 |
+
},
|
137 |
+
"interactivity": {
|
138 |
+
"detect_on": "canvas",
|
139 |
+
"events": {
|
140 |
+
"onhover": {
|
141 |
+
"enable": true,
|
142 |
+
"mode": "repulse"
|
143 |
+
},
|
144 |
+
"onclick": {
|
145 |
+
"enable": true,
|
146 |
+
"mode": "push"
|
147 |
+
},
|
148 |
+
"resize": true
|
149 |
+
},
|
150 |
+
"modes": {
|
151 |
+
"grab": {
|
152 |
+
"distance": 400,
|
153 |
+
"line_linked": {
|
154 |
+
"opacity": 1
|
155 |
+
}
|
156 |
+
},
|
157 |
+
"bubble": {
|
158 |
+
"distance": 400,
|
159 |
+
"size": 40,
|
160 |
+
"duration": 2,
|
161 |
+
"opacity": 8,
|
162 |
+
"speed": 3
|
163 |
+
},
|
164 |
+
"repulse": {
|
165 |
+
"distance": 200,
|
166 |
+
"duration": 0.4
|
167 |
+
},
|
168 |
+
"push": {
|
169 |
+
"particles_nb": 4
|
170 |
+
},
|
171 |
+
"remove": {
|
172 |
+
"particles_nb": 2
|
173 |
+
}
|
174 |
+
}
|
175 |
+
},
|
176 |
+
"retina_detect": true
|
177 |
+
}',
|
178 |
+
'render_type' => 'template',
|
179 |
+
'condition' => [
|
180 |
+
'eae_enable_particles' => 'yes'
|
181 |
+
]
|
182 |
+
]
|
183 |
+
);
|
184 |
+
|
185 |
+
$element->end_controls_section();
|
186 |
+
|
187 |
+
}
|
188 |
+
}
|
189 |
+
|
190 |
+
public function _before_render($element){
|
191 |
+
|
192 |
+
if($element->get_name() != 'section' && $element->get_name() != 'column'){
|
193 |
+
return;
|
194 |
+
}
|
195 |
+
|
196 |
+
$settings = $element->get_settings();
|
197 |
+
if($settings['eae_enable_particles'] == 'yes'){
|
198 |
+
$element->add_render_attribute('_wrapper', 'data-eae-particle', $settings['eae_particle_json']);
|
199 |
+
}
|
200 |
+
|
201 |
+
}
|
202 |
+
|
203 |
+
function _print_template($template,$widget){
|
204 |
+
if($widget->get_name() != 'section' && $widget->get_name() != 'column'){
|
205 |
+
return $template;
|
206 |
+
}
|
207 |
+
|
208 |
+
$old_template = $template;
|
209 |
+
ob_start();
|
210 |
+
?>
|
211 |
+
|
212 |
+
<div class="eae-particle-wrapper" id="eae-particle-{{ view.getID() }}" data-eae-pdata=" {{ settings.eae_particle_json }}"></div>
|
213 |
+
<?php
|
214 |
+
$slider_content = ob_get_contents();
|
215 |
+
ob_end_clean();
|
216 |
+
$template = $slider_content.$old_template;
|
217 |
+
return $template;
|
218 |
+
}
|
219 |
+
|
220 |
+
public static function instance() {
|
221 |
+
if ( is_null( self::$_instance ) ) {
|
222 |
+
self::$_instance = new self();
|
223 |
+
}
|
224 |
+
return self::$_instance;
|
225 |
+
}
|
226 |
+
}
|
227 |
+
|
228 |
Particles::instance();
|
elements/pinterest.php
CHANGED
@@ -1,550 +1,550 @@
|
|
1 |
-
<?php
|
2 |
-
|
3 |
-
namespace EAE;
|
4 |
-
|
5 |
-
use Elementor\Controls_Manager;
|
6 |
-
use Elementor\Widget_Base;
|
7 |
-
use Elementor\Plugin;
|
8 |
-
|
9 |
-
|
10 |
-
if ( ! defined( 'ABSPATH' ) ) {
|
11 |
-
exit;
|
12 |
-
} //Exit if accessed directly
|
13 |
-
|
14 |
-
class EAE_Pinterest extends Widget_Base {
|
15 |
-
|
16 |
-
|
17 |
-
public function get_name() {
|
18 |
-
return 'wts-pinterest';
|
19 |
-
}
|
20 |
-
|
21 |
-
public function get_title() {
|
22 |
-
return __( 'EAE - Pinterest', 'wts-eae' );
|
23 |
-
}
|
24 |
-
|
25 |
-
public function get_icon() {
|
26 |
-
return 'fa fa-pinterest';
|
27 |
-
}
|
28 |
-
|
29 |
-
public function get_categories() {
|
30 |
-
return [ ' wts-eae' ];
|
31 |
-
}
|
32 |
-
|
33 |
-
protected function _register_controls() {
|
34 |
-
$this->start_controls_section(
|
35 |
-
'section_general',
|
36 |
-
[
|
37 |
-
'label' => __( 'General', 'wts-eae' )
|
38 |
-
]
|
39 |
-
);
|
40 |
-
|
41 |
-
$this->add_control(
|
42 |
-
'embed_type',
|
43 |
-
[
|
44 |
-
'label' => __( 'Embed Type', 'wts-eae' ),
|
45 |
-
'type' => Controls_Manager::SELECT,
|
46 |
-
'default' => 'follow_button',
|
47 |
-
'options' => [
|
48 |
-
'save_button' => __( 'Save Button', 'wts-eae' ),
|
49 |
-
'follow_button' => __( 'Follow', 'wts-eae' ),
|
50 |
-
'pin' => __( 'Pin', 'wts-eae' ),
|
51 |
-
'board' => __( 'Board', 'wts-eae' ),
|
52 |
-
'profile' => __( 'Profile', 'wts-eae' )
|
53 |
-
]
|
54 |
-
]
|
55 |
-
);
|
56 |
-
|
57 |
-
$this->add_control(
|
58 |
-
'button_type',
|
59 |
-
[
|
60 |
-
'label' => __( 'Button Type', 'wts-eae' ),
|
61 |
-
'type' => Controls_Manager::SELECT,
|
62 |
-
'default' => 'one_image',
|
63 |
-
'options' => [
|
64 |
-
'one_image' => __( 'One Image', 'wts-eae' ),
|
65 |
-
'any_image' => __( 'Any Image', 'wts-eae' ),
|
66 |
-
//'hover' => __('Hover' , 'wts-eae')
|
67 |
-
],
|
68 |
-
'condition' => [
|
69 |
-
'embed_type' => 'save_button',
|
70 |
-
]
|
71 |
-
]
|
72 |
-
|
73 |
-
);
|
74 |
-
|
75 |
-
$this->add_control(
|
76 |
-
'custom_pinterest_icon',
|
77 |
-
[
|
78 |
-
'label' => __( 'Custom Pinterest Icon', 'wts-eae' ),
|
79 |
-
'type' => Controls_Manager::MEDIA,
|
80 |
-
'condition' => [
|
81 |
-
'embed_type' => 'save_button'
|
82 |
-
]
|
83 |
-
|
84 |
-
]
|
85 |
-
);
|
86 |
-
|
87 |
-
$this->add_control(
|
88 |
-
'user_url',
|
89 |
-
[
|
90 |
-
'label' => __( "User URL", 'wts-eae' ),
|
91 |
-
'type' => Controls_Manager::TEXT,
|
92 |
-
'default' => 'https://www.pinterest.com/pinterest',
|
93 |
-
'condition' => [
|
94 |
-
'embed_type' => 'follow_button'
|
95 |
-
]
|
96 |
-
|
97 |
-
]
|
98 |
-
|
99 |
-
);
|
100 |
-
|
101 |
-
$this->add_control(
|
102 |
-
'user_name',
|
103 |
-
[
|
104 |
-
'label' => __( 'User Name', 'wts-name' ),
|
105 |
-
'type' => Controls_Manager::TEXT,
|
106 |
-
'placeholder' => 'Pinterest',
|
107 |
-
'default' => 'Pinterest',
|
108 |
-
'condition' => [
|
109 |
-
'embed_type' => 'follow_button'
|
110 |
-
]
|
111 |
-
]
|
112 |
-
);
|
113 |
-
|
114 |
-
$this->add_control(
|
115 |
-
'round_button',
|
116 |
-
[
|
117 |
-
'label' => __( 'Round Button', 'wts-eae' ),
|
118 |
-
'type' => Controls_Manager::SWITCHER,
|
119 |
-
'default' => '',
|
120 |
-
'label_on' => __( 'Yes', 'wts-eae' ),
|
121 |
-
'label_off' => __( 'No', 'wts-eae' ),
|
122 |
-
'return_value' => 'yes',
|
123 |
-
'condition' => [
|
124 |
-
'embed_type' => 'save_button',
|
125 |
-
]
|
126 |
-
]
|
127 |
-
);
|
128 |
-
|
129 |
-
$this->add_control(
|
130 |
-
'large_button',
|
131 |
-
[
|
132 |
-
'label' => __( 'Large Button', 'wts-eae' ),
|
133 |
-
'type' => Controls_Manager::SWITCHER,
|
134 |
-
'default' => '',
|
135 |
-
'label_on' => __( 'Yes', 'wts-eae' ),
|
136 |
-
'label_off' => __( 'No', 'wts-eae' ),
|
137 |
-
'return_value' => 'yes',
|
138 |
-
'condition' => [
|
139 |
-
'embed_type' => [ 'save_button', 'follow_button' ]
|
140 |
-
]
|
141 |
-
]
|
142 |
-
);
|
143 |
-
|
144 |
-
$this->add_control(
|
145 |
-
'save_label',
|
146 |
-
[
|
147 |
-
'label' => __( 'Show Save Label', 'wts-eae' ),
|
148 |
-
'type' => Controls_Manager::SWITCHER,
|
149 |
-
'label_on' => __( 'Yes', 'wts-eae' ),
|
150 |
-
'label_off' => __( 'No', 'wts-eae' ),
|
151 |
-
'return_value' => 'yes',
|
152 |
-
'condition' => [
|
153 |
-
'embed_type' => 'save_button',
|
154 |
-
'round_button!' => 'yes'
|
155 |
-
]
|
156 |
-
|
157 |
-
]
|
158 |
-
);
|
159 |
-
|
160 |
-
$this->add_control(
|
161 |
-
'show_pin_count',
|
162 |
-
[
|
163 |
-
'label' => __( 'Show Pin Count', 'wts-eae' ),
|
164 |
-
'type' => Controls_Manager::SELECT,
|
165 |
-
'options' => [
|
166 |
-
'' => __( 'Not Shown', 'wts-eae' ),
|
167 |
-
'above' => __( 'Above the Button', 'wts-eae' ),
|
168 |
-
'beside' => __( 'Beside the Button', 'wts-eae' )
|
169 |
-
],
|
170 |
-
'condition' => [
|
171 |
-
'embed_type' => 'save_button',
|
172 |
-
'button_type' => 'one_image',
|
173 |
-
'round_button!' => 'yes'
|
174 |
-
]
|
175 |
-
]
|
176 |
-
);
|
177 |
-
|
178 |
-
|
179 |
-
$this->add_control(
|
180 |
-
'source_url',
|
181 |
-
[
|
182 |
-
'label' => __( 'URL', 'wts-eae' ),
|
183 |
-
'type' => Controls_Manager::TEXT,
|
184 |
-
'default' => 'https://www.flickr.com/photos/kentbrew/6851755809',
|
185 |
-
'condition' => [
|
186 |
-
'embed_type' => 'save_button',
|
187 |
-
'button_type' => 'one_image'
|
188 |
-
]
|
189 |
-
]
|
190 |
-
|
191 |
-
);
|
192 |
-
$this->add_control(
|
193 |
-
'image_url',
|
194 |
-
[
|
195 |
-
'label' => __( 'Image URL', 'wts-eae' ),
|
196 |
-
'type' => Controls_Manager::TEXT,
|
197 |
-
'default' => 'https://farm8.staticflickr.com/7027/6851755809_df5b2051c9_z.jpg',
|
198 |
-
'condition' => [
|
199 |
-
'embed_type' => 'save_button',
|
200 |
-
'button_type' => 'one_image'
|
201 |
-
]
|
202 |
-
]
|
203 |
-
|
204 |
-
);
|
205 |
-
|
206 |
-
$this->add_control(
|
207 |
-
'description',
|
208 |
-
[
|
209 |
-
'label' => __( 'Description', 'wts-eae' ),
|
210 |
-
'type' => Controls_Manager::TEXTAREA,
|
211 |
-
'condition' => [
|
212 |
-
'embed_type' => 'save_button',
|
213 |
-
'button_type' => 'one_image'
|
214 |
-
]
|
215 |
-
]
|
216 |
-
|
217 |
-
);
|
218 |
-
|
219 |
-
|
220 |
-
$this->add_control(
|
221 |
-
'pin_url',
|
222 |
-
[
|
223 |
-
'label' => __( 'Pin Url', 'wts-eae' ),
|
224 |
-
'type' => Controls_Manager::TEXT,
|
225 |
-
'default' => 'https://www.pinterest.com/pin/99360735500167749',
|
226 |
-
'condition' => [
|
227 |
-
'embed_type' => 'pin'
|
228 |
-
]
|
229 |
-
|
230 |
-
]
|
231 |
-
);
|
232 |
-
|
233 |
-
$this->add_control(
|
234 |
-
'board_url',
|
235 |
-
[
|
236 |
-
'label' => __( 'Pinterest Board URL', 'wts-eae' ),
|
237 |
-
'type' => Controls_Manager::TEXT,
|
238 |
-
'default' => 'https://www.pinterest.com/pinterest/official-news',
|
239 |
-
'condition' => [
|
240 |
-
'embed_type' => 'board'
|
241 |
-
]
|
242 |
-
]
|
243 |
-
);
|
244 |
-
|
245 |
-
$this->add_control(
|
246 |
-
'profile_url',
|
247 |
-
[
|
248 |
-
'label' => __( 'Pinterest User URL', 'wts-eae' ),
|
249 |
-
'type' => Controls_Manager::TEXT,
|
250 |
-
'default' => 'https://www.pinterest.com/pinterest/',
|
251 |
-
'condition' => [
|
252 |
-
'embed_type' => 'profile'
|
253 |
-
]
|
254 |
-
]
|
255 |
-
);
|
256 |
-
|
257 |
-
$this->add_control(
|
258 |
-
'image_width',
|
259 |
-
[
|
260 |
-
'label' => __( 'Image Width', 'wts-eae' ),
|
261 |
-
'type' => Controls_Manager::SLIDER,
|
262 |
-
'default' => [
|
263 |
-
'size' => 80
|
264 |
-
],
|
265 |
-
'range' => [
|
266 |
-
'px' => [
|
267 |
-
'min' => 50,
|
268 |
-
'max' => 500,
|
269 |
-
'step' => 5
|
270 |
-
]
|
271 |
-
],
|
272 |
-
'condition' => [
|
273 |
-
'embed_type' => [ 'board', 'profile' ]
|
274 |
-
]
|
275 |
-
]
|
276 |
-
);
|
277 |
-
|
278 |
-
|
279 |
-
$this->add_control(
|
280 |
-
'board_width',
|
281 |
-
[
|
282 |
-
'label' => __( 'Board Width', 'wts-eae' ),
|
283 |
-
'type' => Controls_Manager::SLIDER,
|
284 |
-
'default' => [
|
285 |
-
'size' => 400
|
286 |
-
],
|
287 |
-
'range' => [
|
288 |
-
'px' => [
|
289 |
-
'min' => 60,
|
290 |
-
'max' => 1300,
|
291 |
-
'step' => 10
|
292 |
-
]
|
293 |
-
],
|
294 |
-
'condition' => [
|
295 |
-
'embed_type' => [ 'board', 'profile' ]
|
296 |
-
]
|
297 |
-
]
|
298 |
-
);
|
299 |
-
|
300 |
-
$this->add_control(
|
301 |
-
'image_height',
|
302 |
-
[
|
303 |
-
'label' => __( 'Image Height', 'wts-eae' ),
|
304 |
-
'type' => Controls_Manager::SLIDER,
|
305 |
-
'default' => [
|
306 |
-
'size' => 240
|
307 |
-
],
|
308 |
-
'range' => [
|
309 |
-
'px' => [
|
310 |
-
'min' => 60,
|
311 |
-
'max' => 1300,
|
312 |
-
'step' => 10
|
313 |
-
]
|
314 |
-
],
|
315 |
-
'condition' => [
|
316 |
-
'embed_type' => [ 'board', 'profile' ]
|
317 |
-
]
|
318 |
-
]
|
319 |
-
);
|
320 |
-
|
321 |
-
|
322 |
-
$this->add_control(
|
323 |
-
'pin_size',
|
324 |
-
[
|
325 |
-
'label' => __( 'Pin Size', 'wts-eae' ),
|
326 |
-
'type' => Controls_Manager::SELECT,
|
327 |
-
'default' => 'small',
|
328 |
-
'options' => [
|
329 |
-
'small' => __( 'Small', 'wts-eae' ),
|
330 |
-
'medium' => __( 'Medium', 'wts-eae' ),
|
331 |
-
'large' => __( 'Large', 'wts-eae' ),
|
332 |
-
],
|
333 |
-
'condition' => [
|
334 |
-
'embed_type' => 'pin',
|
335 |
-
]
|
336 |
-
]
|
337 |
-
);
|
338 |
-
|
339 |
-
|
340 |
-
$this->add_control(
|
341 |
-
'hide_description',
|
342 |
-
[
|
343 |
-
'label' => __( 'Hide Description', 'wts-eae' ),
|
344 |
-
'type' => Controls_Manager::SWITCHER,
|
345 |
-
'default' => '',
|
346 |
-
'label_on' => __( 'Yes', 'wts-eae' ),
|
347 |
-
'label_off' => __( 'No', 'wts-eae' ),
|
348 |
-
'return_value' => 'yes',
|
349 |
-
'condition' => [
|
350 |
-
'embed_type' => 'pin'
|
351 |
-
]
|
352 |
-
]
|
353 |
-
);
|
354 |
-
|
355 |
-
|
356 |
-
$this->add_control(
|
357 |
-
'language',
|
358 |
-
[
|
359 |
-
'label' => __( 'Language', 'wts-eae' ),
|
360 |
-
'type' => Controls_Manager::SELECT,
|
361 |
-
'options' => $this->languages(),
|
362 |
-
'default' => '',
|
363 |
-
'condition' => [
|
364 |
-
'round_button!' => 'yes',
|
365 |
-
'embed_type' => 'save_button'
|
366 |
-
]
|
367 |
-
]
|
368 |
-
);
|
369 |
-
}
|
370 |
-
|
371 |
-
public function languages() {
|
372 |
-
$languages = [
|
373 |
-
'' => __( 'Automatic', 'wts-eae' ),
|
374 |
-
'en' => __( 'English', 'wts-eae' ),
|
375 |
-
'ar' => __( 'Arabic', 'wta-eae' ),
|
376 |
-
'bn' => __( 'Bengali', 'wts-eae' ),
|
377 |
-
'cs' => __( 'Czech', 'wts-eae' ),
|
378 |
-
'da' => __( 'Danish', 'wts-eae' ),
|
379 |
-
'de' => __( 'German', 'wts-eae' ),
|
380 |
-
'el' => __( 'Greek', 'wts-eae' ),
|
381 |
-
'es' => __( 'Spanish', 'wts-eae' ),
|
382 |
-
'fa' => __( 'Persian', 'wts-eae' ),
|
383 |
-
'fi' => __( 'Finnish', 'wts-eae' ),
|
384 |
-
'fil' => __( 'Filipino', 'wts-eae' ),
|
385 |
-
'fr' => __( 'French', 'wts-eae' ),
|
386 |
-
'he' => __( 'Hebrew', 'wts-eae' ),
|
387 |
-
'hi' => __( 'Hindi', 'wts-eae' ),
|
388 |
-
'hu' => __( 'Hungarian', 'wts-eae' ),
|
389 |
-
'id' => __( 'Indonesian', 'wts-eae' ),
|
390 |
-
'it' => __( 'Italian', 'wts-eae' ),
|
391 |
-
'ja' => __( 'Japanese', 'wts-eae' ),
|
392 |
-
'ko' => __( 'Korean', 'wts-eae' ),
|
393 |
-
'msa' => __( 'Malay', 'wts-eae' ),
|
394 |
-
'nl' => __( 'Dutch', 'wts-eae' ),
|
395 |
-
'no' => __( 'Norwegian', 'wts-eae' ),
|
396 |
-
'pl' => __( 'Polish', 'wts-eae' ),
|
397 |
-
'pt' => __( 'Portuguese', 'wts-eae' ),
|
398 |
-
'pt-br' => __( 'Portuguese (Brazil)', 'wts-eae' ),
|
399 |
-
'ro' => __( 'Romania', 'wts-eae' ),
|
400 |
-
'ru' => __( 'Rus', 'wts-eae' ),
|
401 |
-
'sv' => __( 'Swedish', 'wts-eae' ),
|
402 |
-
'th' => __( 'Thai', 'wts-eae' ),
|
403 |
-
'tr' => __( 'Turkish', 'wts-eae' ),
|
404 |
-
'uk' => __( 'Ukrainian', 'wts-eae' ),
|
405 |
-
'ur' => __( 'Urdu', 'wts-eae' ),
|
406 |
-
'vi' => __( 'Vietnamese', 'wts-eae' ),
|
407 |
-
'zh-cn' => __( 'Chinese (Simplified)', 'wts-eae' ),
|
408 |
-
'zh-tw' => __( 'Chinese (Traditional)', 'wts-eae' ),
|
409 |
-
];
|
410 |
-
|
411 |
-
return $languages;
|
412 |
-
|
413 |
-
}
|
414 |
-
|
415 |
-
public function render() {
|
416 |
-
$settings = $this->get_settings();
|
417 |
-
//echo '<pre>'; print_r($settings); echo '</pre>';
|
418 |
-
|
419 |
-
switch ( $settings['embed_type'] ) {
|
420 |
-
|
421 |
-
case "save_button" :
|
422 |
-
$this->get_save_button_html( $settings );
|
423 |
-
break;
|
424 |
-
|
425 |
-
case "follow_button" :
|
426 |
-
$this->get_follow_button_html( $settings );
|
427 |
-
break;
|
428 |
-
|
429 |
-
case "pin" :
|
430 |
-
$this->get_pin_html( $settings );
|
431 |
-
break;
|
432 |
-
|
433 |
-
case "board" :
|
434 |
-
$this->get_board_html( $settings );
|
435 |
-
break;
|
436 |
-
|
437 |
-
case "profile" :
|
438 |
-
$this->get_profile_html( $settings );
|
439 |
-
break;
|
440 |
-
|
441 |
-
}
|
442 |
-
?>
|
443 |
-
<?php
|
444 |
-
|
445 |
-
}
|
446 |
-
|
447 |
-
public function get_save_button_html( $settings ) {
|
448 |
-
if ( $settings['button_type'] == 'one_image' ) {
|
449 |
-
$this->add_render_attribute( 'save_button', 'data-pin-do', 'buttonPin' );
|
450 |
-
if ( $settings['round_button'] != 'yes' ) {
|
451 |
-
$this->add_render_attribute( 'save_button', 'data-pin-count', $settings['show_pin_count'] );
|
452 |
-
}
|
453 |
-
$this->add_render_attribute( 'save_button', 'href', 'https://in.pinterest.com/pin/create/button/?url=' . $settings['source_url'] . '&media=' . $settings['image_url'] . '&description=' . $settings['description'] );
|
454 |
-
}
|
455 |
-
if ( $settings['button_type'] == 'any_image' ) {
|
456 |
-
$this->add_render_attribute( 'save_button', 'data-pin-do', 'buttonBookmark' );
|
457 |
-
$this->add_render_attribute( 'save_button', 'href', 'https://in.pinterest.com/pin/create/button/' );
|
458 |
-
}
|
459 |
-
if ( $settings['large_button'] == 'yes' ) {
|
460 |
-
$this->add_render_attribute( 'save_button', 'data-pin-tall', 'true' );
|
461 |
-
}
|
462 |
-
if ( $settings['round_button'] == 'yes' ) {
|
463 |
-
$this->add_render_attribute( 'save_button', 'data-pin-round', 'true' );
|
464 |
-
}
|
465 |
-
if ( $settings['save_label'] == 'yes' && $settings['round_button'] != 'yes' ) {
|
466 |
-
$this->add_render_attribute( 'save_button', 'data-pin-save', 'true' );
|
467 |
-
}
|
468 |
-
if ( $settings['custom_pinterest_icon']['url'] != "" ) {
|
469 |
-
$this->add_render_attribute( 'save_button', 'data-pin-custom', 'true' );
|
470 |
-
}
|
471 |
-
|
472 |
-
$this->add_render_attribute( 'save_button', 'data-pin-lang', $settings['language'] );
|
473 |
-
|
474 |
-
?>
|
475 |
-
<a <?php echo $this->get_render_attribute_string( 'save_button' ); ?> >
|
476 |
-
<?php
|
477 |
-
if ( $settings['custom_pinterest_icon']['url'] != "" ) {
|
478 |
-
?>
|
479 |
-
<img src="<?php echo $settings['custom_pinterest_icon']['url']; ?>" height="25"/>
|
480 |
-
<?php
|
481 |
-
}
|
482 |
-
?>
|
483 |
-
</a>
|
484 |
-
<?php
|
485 |
-
|
486 |
-
}
|
487 |
-
|
488 |
-
public function get_follow_button_html( $settings ) {
|
489 |
-
if ( $settings['embed_type'] == 'follow_button' ) {
|
490 |
-
$this->add_render_attribute( 'follow-button', 'data-pin-do', 'buttonFollow' );
|
491 |
-
}
|
492 |
-
$this->add_render_attribute( 'follow-button', 'href', $settings['user_url'] );
|
493 |
-
if ( $settings['large_button'] == 'yes' ) {
|
494 |
-
$this->add_render_attribute( 'follow-button', 'data-pin-tall', 'true' );
|
495 |
-
}
|
496 |
-
|
497 |
-
?>
|
498 |
-
<a <?php echo $this->get_render_attribute_string( 'follow-button' ) ?> ><?php echo $settings['user_name'] ?> </a>
|
499 |
-
|
500 |
-
<?php
|
501 |
-
}
|
502 |
-
|
503 |
-
public function get_pin_html( $settings ) {
|
504 |
-
if ( $settings['embed_type'] == 'pin' ) {
|
505 |
-
$this->add_render_attribute( 'pin', 'data-pin-do', 'embedPin' );
|
506 |
-
}
|
507 |
-
$this->add_render_attribute( 'pin', 'href', $settings['pin_url'] );
|
508 |
-
$this->add_render_attribute( 'pin', 'data-pin-width', $settings['pin_size'] );
|
509 |
-
if ( $settings['hide_description'] == 'yes' ) {
|
510 |
-
$this->add_render_attribute( 'pin', 'data-pin-terse', 'true' );
|
511 |
-
}
|
512 |
-
?>
|
513 |
-
<a <?php echo $this->get_render_attribute_string( 'pin' ); ?> ></a>
|
514 |
-
<?php
|
515 |
-
|
516 |
-
|
517 |
-
}
|
518 |
-
|
519 |
-
public function get_board_html( $settings ) {
|
520 |
-
if ( $settings['embed_type'] == 'board' ) {
|
521 |
-
$this->add_render_attribute( 'board', 'data-pin-do', 'embedBoard' );
|
522 |
-
}
|
523 |
-
|
524 |
-
$this->add_render_attribute( 'board', 'href', $settings['board_url'] );
|
525 |
-
$this->add_render_attribute( 'board', 'data-pin-scale-width', $settings['image_width']['size'] );
|
526 |
-
$this->add_render_attribute( 'board', 'data-pin-board-width', $settings['board_width']['size'] );
|
527 |
-
$this->add_render_attribute( 'board', 'data-pin-scale-height', $settings['image_height']['size'] );
|
528 |
-
?>
|
529 |
-
<a <?php echo $this->get_render_attribute_string( 'board' ); ?> ></a>
|
530 |
-
<?php
|
531 |
-
}
|
532 |
-
|
533 |
-
public function get_profile_html( $settings ) {
|
534 |
-
if ( $settings['embed_type'] == 'profile' ) {
|
535 |
-
$this->add_render_attribute( 'profile', 'data-pin-do', 'embedUser' );
|
536 |
-
}
|
537 |
-
|
538 |
-
$this->add_render_attribute( 'profile', 'href', $settings['profile_url'] );
|
539 |
-
$this->add_render_attribute( 'profile', 'data-pin-scale-width', $settings['image_width']['size'] );
|
540 |
-
$this->add_render_attribute( 'profile', 'data-pin-board-width', $settings['board_width']['size'] );
|
541 |
-
$this->add_render_attribute( 'profile', 'data-pin-scale-height', $settings['image_height']['size'] );
|
542 |
-
?>
|
543 |
-
<a <?php echo $this->get_render_attribute_string( 'profile' ); ?> ></a>
|
544 |
-
<?php
|
545 |
-
}
|
546 |
-
|
547 |
-
|
548 |
-
}
|
549 |
-
|
550 |
Plugin::instance()->widgets_manager->register_widget_type( new EAE_Pinterest() );
|
1 |
+
<?php
|
2 |
+
|
3 |
+
namespace EAE;
|
4 |
+
|
5 |
+
use Elementor\Controls_Manager;
|
6 |
+
use Elementor\Widget_Base;
|
7 |
+
use Elementor\Plugin;
|
8 |
+
|
9 |
+
|
10 |
+
if ( ! defined( 'ABSPATH' ) ) {
|
11 |
+
exit;
|
12 |
+
} //Exit if accessed directly
|
13 |
+
|
14 |
+
class EAE_Pinterest extends Widget_Base {
|
15 |
+
|
16 |
+
|
17 |
+
public function get_name() {
|
18 |
+
return 'wts-pinterest';
|
19 |
+
}
|
20 |
+
|
21 |
+
public function get_title() {
|
22 |
+
return __( 'EAE - Pinterest', 'wts-eae' );
|
23 |
+
}
|
24 |
+
|
25 |
+
public function get_icon() {
|
26 |
+
return 'fa fa-pinterest';
|
27 |
+
}
|
28 |
+
|
29 |
+
public function get_categories() {
|
30 |
+
return [ ' wts-eae' ];
|
31 |
+
}
|
32 |
+
|
33 |
+
protected function _register_controls() {
|
34 |
+
$this->start_controls_section(
|
35 |
+
'section_general',
|
36 |
+
[
|
37 |
+
'label' => __( 'General', 'wts-eae' )
|
38 |
+
]
|
39 |
+
);
|
40 |
+
|
41 |
+
$this->add_control(
|
42 |
+
'embed_type',
|
43 |
+
[
|
44 |
+
'label' => __( 'Embed Type', 'wts-eae' ),
|
45 |
+
'type' => Controls_Manager::SELECT,
|
46 |
+
'default' => 'follow_button',
|
47 |
+
'options' => [
|
48 |
+
'save_button' => __( 'Save Button', 'wts-eae' ),
|
49 |
+
'follow_button' => __( 'Follow', 'wts-eae' ),
|
50 |
+
'pin' => __( 'Pin', 'wts-eae' ),
|
51 |
+
'board' => __( 'Board', 'wts-eae' ),
|
52 |
+
'profile' => __( 'Profile', 'wts-eae' )
|
53 |
+
]
|
54 |
+
]
|
55 |
+
);
|
56 |
+
|
57 |
+
$this->add_control(
|
58 |
+
'button_type',
|
59 |
+
[
|
60 |
+
'label' => __( 'Button Type', 'wts-eae' ),
|
61 |
+
'type' => Controls_Manager::SELECT,
|
62 |
+
'default' => 'one_image',
|
63 |
+
'options' => [
|
64 |
+
'one_image' => __( 'One Image', 'wts-eae' ),
|
65 |
+
'any_image' => __( 'Any Image', 'wts-eae' ),
|
66 |
+
//'hover' => __('Hover' , 'wts-eae')
|
67 |
+
],
|
68 |
+
'condition' => [
|
69 |
+
'embed_type' => 'save_button',
|
70 |
+
]
|
71 |
+
]
|
72 |
+
|
73 |
+
);
|
74 |
+
|
75 |
+
$this->add_control(
|
76 |
+
'custom_pinterest_icon',
|
77 |
+
[
|
78 |
+
'label' => __( 'Custom Pinterest Icon', 'wts-eae' ),
|
79 |
+
'type' => Controls_Manager::MEDIA,
|
80 |
+
'condition' => [
|
81 |
+
'embed_type' => 'save_button'
|
82 |
+
]
|
83 |
+
|
84 |
+
]
|
85 |
+
);
|
86 |
+
|
87 |
+
$this->add_control(
|
88 |
+
'user_url',
|
89 |
+
[
|
90 |
+
'label' => __( "User URL", 'wts-eae' ),
|
91 |
+
'type' => Controls_Manager::TEXT,
|
92 |
+
'default' => 'https://www.pinterest.com/pinterest',
|
93 |
+
'condition' => [
|
94 |
+
'embed_type' => 'follow_button'
|
95 |
+
]
|
96 |
+
|
97 |
+
]
|
98 |
+
|
99 |
+
);
|
100 |
+
|
101 |
+
$this->add_control(
|
102 |
+
'user_name',
|
103 |
+
[
|
104 |
+
'label' => __( 'User Name', 'wts-name' ),
|
105 |
+
'type' => Controls_Manager::TEXT,
|
106 |
+
'placeholder' => 'Pinterest',
|
107 |
+
'default' => 'Pinterest',
|
108 |
+
'condition' => [
|
109 |
+
'embed_type' => 'follow_button'
|
110 |
+
]
|
111 |
+
]
|
112 |
+
);
|
113 |
+
|
114 |
+
$this->add_control(
|
115 |
+
'round_button',
|
116 |
+
[
|
117 |
+
'label' => __( 'Round Button', 'wts-eae' ),
|
118 |
+
'type' => Controls_Manager::SWITCHER,
|
119 |
+
'default' => '',
|
120 |
+
'label_on' => __( 'Yes', 'wts-eae' ),
|
121 |
+
'label_off' => __( 'No', 'wts-eae' ),
|
122 |
+
'return_value' => 'yes',
|
123 |
+
'condition' => [
|
124 |
+
'embed_type' => 'save_button',
|
125 |
+
]
|
126 |
+
]
|
127 |
+
);
|
128 |
+
|
129 |
+
$this->add_control(
|
130 |
+
'large_button',
|
131 |
+
[
|
132 |
+
'label' => __( 'Large Button', 'wts-eae' ),
|
133 |
+
'type' => Controls_Manager::SWITCHER,
|
134 |
+
'default' => '',
|
135 |
+
'label_on' => __( 'Yes', 'wts-eae' ),
|
136 |
+
'label_off' => __( 'No', 'wts-eae' ),
|
137 |
+
'return_value' => 'yes',
|
138 |
+
'condition' => [
|
139 |
+
'embed_type' => [ 'save_button', 'follow_button' ]
|
140 |
+
]
|
141 |
+
]
|
142 |
+
);
|
143 |
+
|
144 |
+
$this->add_control(
|
145 |
+
'save_label',
|
146 |
+
[
|
147 |
+
'label' => __( 'Show Save Label', 'wts-eae' ),
|
148 |
+
'type' => Controls_Manager::SWITCHER,
|
149 |
+
'label_on' => __( 'Yes', 'wts-eae' ),
|
150 |
+
'label_off' => __( 'No', 'wts-eae' ),
|
151 |
+
'return_value' => 'yes',
|
152 |
+
'condition' => [
|
153 |
+
'embed_type' => 'save_button',
|
154 |
+
'round_button!' => 'yes'
|
155 |
+
]
|
156 |
+
|
157 |
+
]
|
158 |
+
);
|
159 |
+
|
160 |
+
$this->add_control(
|
161 |
+
'show_pin_count',
|
162 |
+
[
|
163 |
+
'label' => __( 'Show Pin Count', 'wts-eae' ),
|
164 |
+
'type' => Controls_Manager::SELECT,
|
165 |
+
'options' => [
|
166 |
+
'' => __( 'Not Shown', 'wts-eae' ),
|
167 |
+
'above' => __( 'Above the Button', 'wts-eae' ),
|
168 |
+
'beside' => __( 'Beside the Button', 'wts-eae' )
|
169 |
+
],
|
170 |
+
'condition' => [
|
171 |
+
'embed_type' => 'save_button',
|
172 |
+
'button_type' => 'one_image',
|
173 |
+
'round_button!' => 'yes'
|
174 |
+
]
|
175 |
+
]
|
176 |
+
);
|
177 |
+
|
178 |
+
|
179 |
+
$this->add_control(
|
180 |
+
'source_url',
|
181 |
+
[
|
182 |
+
'label' => __( 'URL', 'wts-eae' ),
|
183 |
+
'type' => Controls_Manager::TEXT,
|
184 |
+
'default' => 'https://www.flickr.com/photos/kentbrew/6851755809',
|
185 |
+
'condition' => [
|
186 |
+
'embed_type' => 'save_button',
|
187 |
+
'button_type' => 'one_image'
|
188 |
+
]
|
189 |
+
]
|
190 |
+
|
191 |
+
);
|
192 |
+
$this->add_control(
|
193 |
+
'image_url',
|
194 |
+
[
|
195 |
+
'label' => __( 'Image URL', 'wts-eae' ),
|
196 |
+
'type' => Controls_Manager::TEXT,
|
197 |
+
'default' => 'https://farm8.staticflickr.com/7027/6851755809_df5b2051c9_z.jpg',
|
198 |
+
'condition' => [
|
199 |
+
'embed_type' => 'save_button',
|
200 |
+
'button_type' => 'one_image'
|
201 |
+
]
|
202 |
+
]
|
203 |
+
|
204 |
+
);
|
205 |
+
|
206 |
+
$this->add_control(
|
207 |
+
'description',
|
208 |
+
[
|
209 |
+
'label' => __( 'Description', 'wts-eae' ),
|
210 |
+
'type' => Controls_Manager::TEXTAREA,
|
211 |
+
'condition' => [
|
212 |
+
'embed_type' => 'save_button',
|
213 |
+
'button_type' => 'one_image'
|
214 |
+
]
|
215 |
+
]
|
216 |
+
|
217 |
+
);
|
218 |
+
|
219 |
+
|
220 |
+
$this->add_control(
|
221 |
+
'pin_url',
|
222 |
+
[
|
223 |
+
'label' => __( 'Pin Url', 'wts-eae' ),
|
224 |
+
'type' => Controls_Manager::TEXT,
|
225 |
+
'default' => 'https://www.pinterest.com/pin/99360735500167749',
|
226 |
+
'condition' => [
|
227 |
+
'embed_type' => 'pin'
|
228 |
+
]
|
229 |
+
|
230 |
+
]
|
231 |
+
);
|
232 |
+
|
233 |
+
$this->add_control(
|
234 |
+
'board_url',
|
235 |
+
[
|
236 |
+
'label' => __( 'Pinterest Board URL', 'wts-eae' ),
|
237 |
+
'type' => Controls_Manager::TEXT,
|
238 |
+
'default' => 'https://www.pinterest.com/pinterest/official-news',
|
239 |
+
'condition' => [
|
240 |
+
'embed_type' => 'board'
|
241 |
+
]
|
242 |
+
]
|
243 |
+
);
|
244 |
+
|
245 |
+
$this->add_control(
|
246 |
+
'profile_url',
|
247 |
+
[
|
248 |
+
'label' => __( 'Pinterest User URL', 'wts-eae' ),
|
249 |
+
'type' => Controls_Manager::TEXT,
|
250 |
+
'default' => 'https://www.pinterest.com/pinterest/',
|
251 |
+
'condition' => [
|
252 |
+
'embed_type' => 'profile'
|
253 |
+
]
|
254 |
+
]
|
255 |
+
);
|
256 |
+
|
257 |
+
$this->add_control(
|
258 |
+
'image_width',
|
259 |
+
[
|
260 |
+
'label' => __( 'Image Width', 'wts-eae' ),
|
261 |
+
'type' => Controls_Manager::SLIDER,
|
262 |
+
'default' => [
|
263 |
+
'size' => 80
|
264 |
+
],
|
265 |
+
'range' => [
|
266 |
+
'px' => [
|
267 |
+
'min' => 50,
|
268 |
+
'max' => 500,
|
269 |
+
'step' => 5
|
270 |
+
]
|
271 |
+
],
|
272 |
+
'condition' => [
|
273 |
+
'embed_type' => [ 'board', 'profile' ]
|
274 |
+
]
|
275 |
+
]
|
276 |
+
);
|
277 |
+
|
278 |
+
|
279 |
+
$this->add_control(
|
280 |
+
'board_width',
|
281 |
+
[
|
282 |
+
'label' => __( 'Board Width', 'wts-eae' ),
|
283 |
+
'type' => Controls_Manager::SLIDER,
|
284 |
+
'default' => [
|
285 |
+
'size' => 400
|
286 |
+
],
|
287 |
+
'range' => [
|
288 |
+
'px' => [
|
289 |
+
'min' => 60,
|
290 |
+
'max' => 1300,
|
291 |
+
'step' => 10
|
292 |
+
]
|
293 |
+
],
|
294 |
+
'condition' => [
|
295 |
+
'embed_type' => [ 'board', 'profile' ]
|
296 |
+
]
|
297 |
+
]
|
298 |
+
);
|
299 |
+
|
300 |
+
$this->add_control(
|
301 |
+
'image_height',
|
302 |
+
[
|
303 |
+
'label' => __( 'Image Height', 'wts-eae' ),
|
304 |
+
'type' => Controls_Manager::SLIDER,
|
305 |
+
'default' => [
|
306 |
+
'size' => 240
|
307 |
+
],
|
308 |
+
'range' => [
|
309 |
+
'px' => [
|
310 |
+
'min' => 60,
|
311 |
+
'max' => 1300,
|
312 |
+
'step' => 10
|
313 |
+
]
|
314 |
+
],
|
315 |
+
'condition' => [
|
316 |
+
'embed_type' => [ 'board', 'profile' ]
|
317 |
+
]
|
318 |
+
]
|
319 |
+
);
|
320 |
+
|
321 |
+
|
322 |
+
$this->add_control(
|
323 |
+
'pin_size',
|
324 |
+
[
|
325 |
+
'label' => __( 'Pin Size', 'wts-eae' ),
|
326 |
+
'type' => Controls_Manager::SELECT,
|
327 |
+
'default' => 'small',
|
328 |
+
'options' => [
|
329 |
+
'small' => __( 'Small', 'wts-eae' ),
|
330 |
+
'medium' => __( 'Medium', 'wts-eae' ),
|
331 |
+
'large' => __( 'Large', 'wts-eae' ),
|
332 |
+
],
|
333 |
+
'condition' => [
|
334 |
+
'embed_type' => 'pin',
|
335 |
+
]
|
336 |
+
]
|
337 |
+
);
|
338 |
+
|
339 |
+
|
340 |
+
$this->add_control(
|
341 |
+
'hide_description',
|
342 |
+
[
|
343 |
+
'label' => __( 'Hide Description', 'wts-eae' ),
|
344 |
+
'type' => Controls_Manager::SWITCHER,
|
345 |
+
'default' => '',
|
346 |
+
'label_on' => __( 'Yes', 'wts-eae' ),
|
347 |
+
'label_off' => __( 'No', 'wts-eae' ),
|
348 |
+
'return_value' => 'yes',
|
349 |
+
'condition' => [
|
350 |
+
'embed_type' => 'pin'
|
351 |
+
]
|
352 |
+
]
|
353 |
+
);
|
354 |
+
|
355 |
+
|
356 |
+
$this->add_control(
|
357 |
+
'language',
|
358 |
+
[
|
359 |
+
'label' => __( 'Language', 'wts-eae' ),
|
360 |
+
'type' => Controls_Manager::SELECT,
|
361 |
+
'options' => $this->languages(),
|
362 |
+
'default' => '',
|
363 |
+
'condition' => [
|
364 |
+
'round_button!' => 'yes',
|
365 |
+
'embed_type' => 'save_button'
|
366 |
+
]
|
367 |
+
]
|
368 |
+
);
|
369 |
+
}
|
370 |
+
|
371 |
+
public function languages() {
|
372 |
+
$languages = [
|
373 |
+
'' => __( 'Automatic', 'wts-eae' ),
|
374 |
+
'en' => __( 'English', 'wts-eae' ),
|
375 |
+
'ar' => __( 'Arabic', 'wta-eae' ),
|
376 |
+
'bn' => __( 'Bengali', 'wts-eae' ),
|
377 |
+
'cs' => __( 'Czech', 'wts-eae' ),
|
378 |
+
'da' => __( 'Danish', 'wts-eae' ),
|
379 |
+
'de' => __( 'German', 'wts-eae' ),
|
380 |
+
'el' => __( 'Greek', 'wts-eae' ),
|
381 |
+
'es' => __( 'Spanish', 'wts-eae' ),
|
382 |
+
'fa' => __( 'Persian', 'wts-eae' ),
|
383 |
+
'fi' => __( 'Finnish', 'wts-eae' ),
|
384 |
+
'fil' => __( 'Filipino', 'wts-eae' ),
|
385 |
+
'fr' => __( 'French', 'wts-eae' ),
|
386 |
+
'he' => __( 'Hebrew', 'wts-eae' ),
|
387 |
+
'hi' => __( 'Hindi', 'wts-eae' ),
|
388 |
+
'hu' => __( 'Hungarian', 'wts-eae' ),
|
389 |
+
'id' => __( 'Indonesian', 'wts-eae' ),
|
390 |
+
'it' => __( 'Italian', 'wts-eae' ),
|
391 |
+
'ja' => __( 'Japanese', 'wts-eae' ),
|
392 |
+
'ko' => __( 'Korean', 'wts-eae' ),
|
393 |
+
'msa' => __( 'Malay', 'wts-eae' ),
|
394 |
+
'nl' => __( 'Dutch', 'wts-eae' ),
|
395 |
+
'no' => __( 'Norwegian', 'wts-eae' ),
|
396 |
+
'pl' => __( 'Polish', 'wts-eae' ),
|
397 |
+
'pt' => __( 'Portuguese', 'wts-eae' ),
|
398 |
+
'pt-br' => __( 'Portuguese (Brazil)', 'wts-eae' ),
|
399 |
+
'ro' => __( 'Romania', 'wts-eae' ),
|
400 |
+
'ru' => __( 'Rus', 'wts-eae' ),
|
401 |
+
'sv' => __( 'Swedish', 'wts-eae' ),
|
402 |
+
'th' => __( 'Thai', 'wts-eae' ),
|
403 |
+
'tr' => __( 'Turkish', 'wts-eae' ),
|
404 |
+
'uk' => __( 'Ukrainian', 'wts-eae' ),
|
405 |
+
'ur' => __( 'Urdu', 'wts-eae' ),
|
406 |
+
'vi' => __( 'Vietnamese', 'wts-eae' ),
|
407 |
+
'zh-cn' => __( 'Chinese (Simplified)', 'wts-eae' ),
|
408 |
+
'zh-tw' => __( 'Chinese (Traditional)', 'wts-eae' ),
|
409 |
+
];
|
410 |
+
|
411 |
+
return $languages;
|
412 |
+
|
413 |
+
}
|
414 |
+
|
415 |
+
public function render() {
|
416 |
+
$settings = $this->get_settings();
|
417 |
+
//echo '<pre>'; print_r($settings); echo '</pre>';
|
418 |
+
|
419 |
+
switch ( $settings['embed_type'] ) {
|
420 |
+
|
421 |
+
case "save_button" :
|
422 |
+
$this->get_save_button_html( $settings );
|
423 |
+
break;
|
424 |
+
|
425 |
+
case "follow_button" :
|
426 |
+
$this->get_follow_button_html( $settings );
|
427 |
+
break;
|
428 |
+
|
429 |
+
case "pin" :
|
430 |
+
$this->get_pin_html( $settings );
|
431 |
+
break;
|
432 |
+
|
433 |
+
case "board" :
|
434 |
+
$this->get_board_html( $settings );
|
435 |
+
break;
|
436 |
+
|
437 |
+
case "profile" :
|
438 |
+
$this->get_profile_html( $settings );
|
439 |
+
break;
|
440 |
+
|
441 |
+
}
|
442 |
+
?>
|
443 |
+
<?php
|
444 |
+
|
445 |
+
}
|
446 |
+
|
447 |
+
public function get_save_button_html( $settings ) {
|
448 |
+
if ( $settings['button_type'] == 'one_image' ) {
|
449 |
+
$this->add_render_attribute( 'save_button', 'data-pin-do', 'buttonPin' );
|
450 |
+
if ( $settings['round_button'] != 'yes' ) {
|
451 |
+
$this->add_render_attribute( 'save_button', 'data-pin-count', $settings['show_pin_count'] );
|
452 |
+
}
|
453 |
+
$this->add_render_attribute( 'save_button', 'href', 'https://in.pinterest.com/pin/create/button/?url=' . $settings['source_url'] . '&media=' . $settings['image_url'] . '&description=' . $settings['description'] );
|
454 |
+
}
|
455 |
+
if ( $settings['button_type'] == 'any_image' ) {
|
456 |
+
$this->add_render_attribute( 'save_button', 'data-pin-do', 'buttonBookmark' );
|
457 |
+
$this->add_render_attribute( 'save_button', 'href', 'https://in.pinterest.com/pin/create/button/' );
|
458 |
+
}
|
459 |
+
if ( $settings['large_button'] == 'yes' ) {
|
460 |
+
$this->add_render_attribute( 'save_button', 'data-pin-tall', 'true' );
|
461 |
+
}
|
462 |
+
if ( $settings['round_button'] == 'yes' ) {
|
463 |
+
$this->add_render_attribute( 'save_button', 'data-pin-round', 'true' );
|
464 |
+
}
|
465 |
+
if ( $settings['save_label'] == 'yes' && $settings['round_button'] != 'yes' ) {
|
466 |
+
$this->add_render_attribute( 'save_button', 'data-pin-save', 'true' );
|
467 |
+
}
|
468 |
+
if ( $settings['custom_pinterest_icon']['url'] != "" ) {
|
469 |
+
$this->add_render_attribute( 'save_button', 'data-pin-custom', 'true' );
|
470 |
+
}
|
471 |
+
|
472 |
+
$this->add_render_attribute( 'save_button', 'data-pin-lang', $settings['language'] );
|
473 |
+
|
474 |
+
?>
|
475 |
+
<a <?php echo $this->get_render_attribute_string( 'save_button' ); ?> >
|
476 |
+
<?php
|
477 |
+
if ( $settings['custom_pinterest_icon']['url'] != "" ) {
|
478 |
+
?>
|
479 |
+
<img src="<?php echo $settings['custom_pinterest_icon']['url']; ?>" height="25"/>
|
480 |
+
<?php
|
481 |
+
}
|
482 |
+
?>
|
483 |
+
</a>
|
484 |
+
<?php
|
485 |
+
|
486 |
+
}
|
487 |
+
|
488 |
+
public function get_follow_button_html( $settings ) {
|
489 |
+
if ( $settings['embed_type'] == 'follow_button' ) {
|
490 |
+
$this->add_render_attribute( 'follow-button', 'data-pin-do', 'buttonFollow' );
|
491 |
+
}
|
492 |
+
$this->add_render_attribute( 'follow-button', 'href', $settings['user_url'] );
|
493 |
+
if ( $settings['large_button'] == 'yes' ) {
|
494 |
+
$this->add_render_attribute( 'follow-button', 'data-pin-tall', 'true' );
|
495 |
+
}
|
496 |
+
|
497 |
+
?>
|
498 |
+
<a <?php echo $this->get_render_attribute_string( 'follow-button' ) ?> ><?php echo $settings['user_name'] ?> </a>
|
499 |
+
|
500 |
+
<?php
|
501 |
+
}
|
502 |
+
|
503 |
+
public function get_pin_html( $settings ) {
|
504 |
+
if ( $settings['embed_type'] == 'pin' ) {
|
505 |
+
$this->add_render_attribute( 'pin', 'data-pin-do', 'embedPin' );
|
506 |
+
}
|
507 |
+
$this->add_render_attribute( 'pin', 'href', $settings['pin_url'] );
|
508 |
+
$this->add_render_attribute( 'pin', 'data-pin-width', $settings['pin_size'] );
|
509 |
+
if ( $settings['hide_description'] == 'yes' ) {
|
510 |
+
$this->add_render_attribute( 'pin', 'data-pin-terse', 'true' );
|
511 |
+
}
|
512 |
+
?>
|
513 |
+
<a <?php echo $this->get_render_attribute_string( 'pin' ); ?> ></a>
|
514 |
+
<?php
|
515 |
+
|
516 |
+
|
517 |
+
}
|
518 |
+
|
519 |
+
public function get_board_html( $settings ) {
|
520 |
+
if ( $settings['embed_type'] == 'board' ) {
|
521 |
+
$this->add_render_attribute( 'board', 'data-pin-do', 'embedBoard' );
|
522 |
+
}
|
523 |
+
|
524 |
+
$this->add_render_attribute( 'board', 'href', $settings['board_url'] );
|
525 |
+
$this->add_render_attribute( 'board', 'data-pin-scale-width', $settings['image_width']['size'] );
|
526 |
+
$this->add_render_attribute( 'board', 'data-pin-board-width', $settings['board_width']['size'] );
|
527 |
+
$this->add_render_attribute( 'board', 'data-pin-scale-height', $settings['image_height']['size'] );
|
528 |
+
?>
|
529 |
+
<a <?php echo $this->get_render_attribute_string( 'board' ); ?> ></a>
|
530 |
+
<?php
|
531 |
+
}
|
532 |
+
|
533 |
+
public function get_profile_html( $settings ) {
|
534 |
+
if ( $settings['embed_type'] == 'profile' ) {
|
535 |
+
$this->add_render_attribute( 'profile', 'data-pin-do', 'embedUser' );
|
536 |
+
}
|
537 |
+
|
538 |
+
$this->add_render_attribute( 'profile', 'href', $settings['profile_url'] );
|
539 |
+
$this->add_render_attribute( 'profile', 'data-pin-scale-width', $settings['image_width']['size'] );
|
540 |
+
$this->add_render_attribute( 'profile', 'data-pin-board-width', $settings['board_width']['size'] );
|
541 |
+
$this->add_render_attribute( 'profile', 'data-pin-scale-height', $settings['image_height']['size'] );
|
542 |
+
?>
|
543 |
+
<a <?php echo $this->get_render_attribute_string( 'profile' ); ?> ></a>
|
544 |
+
<?php
|
545 |
+
}
|
546 |
+
|
547 |
+
|
548 |
+
}
|
549 |
+
|
550 |
Plugin::instance()->widgets_manager->register_widget_type( new EAE_Pinterest() );
|
elements/post-list.php
CHANGED
@@ -1,761 +1,761 @@
|
|
1 |
-
<?php
|
2 |
-
namespace Elementor;
|
3 |
-
|
4 |
-
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
5 |
-
|
6 |
-
class Widget_PostList extends Widget_Base {
|
7 |
-
|
8 |
-
public function get_name() {
|
9 |
-
return 'wts-postlist';
|
10 |
-
}
|
11 |
-
|
12 |
-
public function get_title() {
|
13 |
-
return __( 'EAE - Post List', '
|
14 |
-
}
|
15 |
-
|
16 |
-
public function get_icon() {
|
17 |
-
return 'eicon-post-list wts-eae-pe';
|
18 |
-
}
|
19 |
-
|
20 |
-
public function get_categories() {
|
21 |
-
return [ 'wts-eae' ];
|
22 |
-
}
|
23 |
-
|
24 |
-
protected function _register_controls() {
|
25 |
-
$this->start_controls_section(
|
26 |
-
'section_post_filters',
|
27 |
-
[
|
28 |
-
'label' => __( 'Post Filters', '
|
29 |
-
]
|
30 |
-
);
|
31 |
-
|
32 |
-
$this->add_control(
|
33 |
-
'refer_wp_org',
|
34 |
-
[
|
35 |
-
'raw' => __( 'For more detail about following filters please refer <a href="https://codex.wordpress.org/Template_Tags/get_posts" target="_blank">here</a>', '
|
36 |
-
'type' => Controls_Manager::RAW_HTML,
|
37 |
-
'classes' => 'elementor-descriptor',
|
38 |
-
]
|
39 |
-
);
|
40 |
-
|
41 |
-
$this->add_control(
|
42 |
-
'post_type',
|
43 |
-
[
|
44 |
-
'label' => __( 'Post Type', '
|
45 |
-
'type' => Controls_Manager::SELECT,
|
46 |
-
'options' => eae_get_post_types(),
|
47 |
-
'default' => 'post',
|
48 |
-
|
49 |
-
]
|
50 |
-
);
|
51 |
-
|
52 |
-
$this->add_control(
|
53 |
-
'category',
|
54 |
-
[
|
55 |
-
'label' => __( 'Category ID', '
|
56 |
-
'description' => __('Comma separated list of category ids','
|
57 |
-
'type' => Controls_Manager::TEXT,
|
58 |
-
'default' => '',
|
59 |
-
'condition' => [
|
60 |
-
'post_type' => 'post'
|
61 |
-
]
|
62 |
-
]
|
63 |
-
);
|
64 |
-
|
65 |
-
$this->add_control(
|
66 |
-
'num_posts',
|
67 |
-
[
|
68 |
-
'label' => __( 'Number of Posts', '
|
69 |
-
'type' => Controls_Manager::NUMBER,
|
70 |
-
'default' => '5'
|
71 |
-
]
|
72 |
-
);
|
73 |
-
|
74 |
-
$this->add_control(
|
75 |
-
'post_offset',
|
76 |
-
[
|
77 |
-
'label' => __( 'Post Offset', '
|
78 |
-
'type' => Controls_Manager::NUMBER,
|
79 |
-
'default' => '0'
|
80 |
-
]
|
81 |
-
);
|
82 |
-
|
83 |
-
$this->add_control(
|
84 |
-
'orderby',
|
85 |
-
[
|
86 |
-
'label' => __( 'Order By', '
|
87 |
-
'type' => Controls_Manager::SELECT,
|
88 |
-
'options' => eae_get_post_orderby_options(),
|
89 |
-
'default' => 'date',
|
90 |
-
|
91 |
-
]
|
92 |
-
);
|
93 |
-
|
94 |
-
$this->add_control(
|
95 |
-
'order',
|
96 |
-
[
|
97 |
-
'label' => __( 'Order', '
|
98 |
-
'type' => Controls_Manager::SELECT,
|
99 |
-
'options' => [
|
100 |
-
'asc' => 'Ascending',
|
101 |
-
'desc' => 'Descending'
|
102 |
-
],
|
103 |
-
'default' => 'desc',
|
104 |
-
|
105 |
-
]
|
106 |
-
);
|
107 |
-
|
108 |
-
$this->end_controls_section();
|
109 |
-
|
110 |
-
$this->start_controls_section(
|
111 |
-
'section_layout_settings',
|
112 |
-
[
|
113 |
-
'label' => __( 'Layout Settings', '
|
114 |
-
]
|
115 |
-
);
|
116 |
-
|
117 |
-
|
118 |
-
$this->add_control(
|
119 |
-
'show_image',
|
120 |
-
[
|
121 |
-
'label' => __( 'Show Image', '
|
122 |
-
'type' => Controls_Manager::CHOOSE,
|
123 |
-
'options' => [
|
124 |
-
'1' => [
|
125 |
-
'title' => __( 'Yes', '
|
126 |
-
'icon' => 'fa fa-check',
|
127 |
-
],
|
128 |
-
'0' => [
|
129 |
-
'title' => __( 'No', '
|
130 |
-
'icon' => 'fa fa-ban',
|
131 |
-
]
|
132 |
-
],
|
133 |
-
'default' => '1'
|
134 |
-
]
|
135 |
-
);
|
136 |
-
$this->add_group_control(
|
137 |
-
Group_Control_Image_Size::get_type(),
|
138 |
-
[
|
139 |
-
'name' => 'image',
|
140 |
-
'exclude' => [ 'custom' ],
|
141 |
-
'condition' => [
|
142 |
-
'show_image' => '1',
|
143 |
-
]
|
144 |
-
]
|
145 |
-
);
|
146 |
-
|
147 |
-
$this->add_responsive_control(
|
148 |
-
'image_align',
|
149 |
-
[
|
150 |
-
'label' => __( 'Image Alignment', '
|
151 |
-
'type' => Controls_Manager::CHOOSE,
|
152 |
-
'options' => [
|
153 |
-
'left' => [
|
154 |
-
'title' => __( 'Left', '
|
155 |
-
'icon' => 'fa fa-align-left',
|
156 |
-
],
|
157 |
-
'none' => [
|
158 |
-
'title' => __( 'Center', '
|
159 |
-
'icon' => 'fa fa-align-center',
|
160 |
-
],
|
161 |
-
'right' => [
|
162 |
-
'title' => __( 'Right', '
|
163 |
-
'icon' => 'fa fa-align-right',
|
164 |
-
]
|
165 |
-
],
|
166 |
-
'default' => 'left',
|
167 |
-
'condition' => [
|
168 |
-
'show_image' => '1',
|
169 |
-
],
|
170 |
-
'selectors' => [
|
171 |
-
'{{WRAPPER}} .eae-pl-image-wrapper' => 'float: {{VALUE}};',
|
172 |
-
],
|
173 |
-
'prefix_class' => 'eae-pl-img-align-'
|
174 |
-
]
|
175 |
-
);
|
176 |
-
|
177 |
-
$this->add_responsive_control(
|
178 |
-
'image_indent',
|
179 |
-
[
|
180 |
-
'label' => __( 'Image Indent', '
|
181 |
-
'type' => Controls_Manager::SLIDER,
|
182 |
-
'range' => [
|
183 |
-
'px' => [
|
184 |
-
'min' => 5,
|
185 |
-
'max' => 100,
|
186 |
-
],
|
187 |
-
],
|
188 |
-
'default' => [
|
189 |
-
'size' => 10,
|
190 |
-
'unit' => 'px',
|
191 |
-
],
|
192 |
-
'condition' => [
|
193 |
-
'show_image' => '1',
|
194 |
-
],
|
195 |
-
'selectors' => [
|
196 |
-
'{{WRAPPER}}.eae-pl-img-align-left .eae-pl-image-wrapper' => 'margin-right: {{SIZE}}{{UNIT}};',
|
197 |
-
'{{WRAPPER}}.eae-pl-img-align-right .eae-pl-image-wrapper' => 'margin-left: {{SIZE}}{{UNIT}};',
|
198 |
-
],
|
199 |
-
]
|
200 |
-
);
|
201 |
-
|
202 |
-
$this->add_control(
|
203 |
-
'show_title',
|
204 |
-
[
|
205 |
-
'label' => __( 'Show Title', '
|
206 |
-
'type' => Controls_Manager::CHOOSE,
|
207 |
-
'options' => [
|
208 |
-
'1' => [
|
209 |
-
'title' => __( 'Yes', '
|
210 |
-
'icon' => 'fa fa-check',
|
211 |
-
],
|
212 |
-
'0' => [
|
213 |
-
'title' => __( 'No', '
|
214 |
-
'icon' => 'fa fa-ban',
|
215 |
-
]
|
216 |
-
],
|
217 |
-
'default' => '1'
|
218 |
-
]
|
219 |
-
);
|
220 |
-
|
221 |
-
$this->add_control(
|
222 |
-
'title_on_top',
|
223 |
-
[
|
224 |
-
'label' => __( 'Title on top', '
|
225 |
-
'type' => Controls_Manager::CHOOSE,
|
226 |
-
'options' => [
|
227 |
-
'top' => [
|
228 |
-
'title' => __( 'Yes', '
|
229 |
-
'icon' => 'fa fa-check',
|
230 |
-
],
|
231 |
-
'0' => [
|
232 |
-
'title' => __( 'No', '
|
233 |
-
'icon' => 'fa fa-ban',
|
234 |
-
]
|
235 |
-
],
|
236 |
-
'default' => '0',
|
237 |
-
'condition' => [
|
238 |
-
'show_title' => '1'
|
239 |
-
]
|
240 |
-
]
|
241 |
-
);
|
242 |
-
|
243 |
-
$this->add_control(
|
244 |
-
'show_excrept',
|
245 |
-
[
|
246 |
-
'label' => __( 'Show Excrept', '
|
247 |
-
'type' => Controls_Manager::CHOOSE,
|
248 |
-
'options' => [
|
249 |
-
'1' => [
|
250 |
-
'title' => __( 'Yes', '
|
251 |
-
'icon' => 'fa fa-check',
|
252 |
-
],
|
253 |
-
'0' => [
|
254 |
-
'title' => __( 'No', '
|
255 |
-
'icon' => 'fa fa-ban',
|
256 |
-
]
|
257 |
-
],
|
258 |
-
'default' => '1'
|
259 |
-
]
|
260 |
-
);
|
261 |
-
|
262 |
-
$this->add_control(
|
263 |
-
'excrept_size',
|
264 |
-
[
|
265 |
-
'label' => __( 'Excrept Size', '
|
266 |
-
'type' => Controls_Manager::NUMBER,
|
267 |
-
'default' => '10',
|
268 |
-
'condition' => [
|
269 |
-
'show_excrept' => '1',
|
270 |
-
]
|
271 |
-
|
272 |
-
]
|
273 |
-
);
|
274 |
-
|
275 |
-
$this->add_control(
|
276 |
-
'show_read_more',
|
277 |
-
[
|
278 |
-
'label' => __( 'Show Read More', '
|
279 |
-
'type' => Controls_Manager::CHOOSE,
|
280 |
-
'options' => [
|
281 |
-
'1' => [
|
282 |
-
'title' => __( 'Yes', '
|
283 |
-
'icon' => 'fa fa-check',
|
284 |
-
],
|
285 |
-
'0' => [
|
286 |
-
'title' => __( 'No', '
|
287 |
-
'icon' => 'fa fa-ban',
|
288 |
-
]
|
289 |
-
],
|
290 |
-
'default' => '1'
|
291 |
-
]
|
292 |
-
);
|
293 |
-
|
294 |
-
$this->add_control(
|
295 |
-
'read_more_text',
|
296 |
-
[
|
297 |
-
'label' => __( 'Read More Text', '
|
298 |
-
'type' => Controls_Manager::TEXT,
|
299 |
-
'placeholder' => __( 'Read More', '
|
300 |
-
'default' => __( 'Read More', '
|
301 |
-
'condition' => [
|
302 |
-
'show_read_more' => '1',
|
303 |
-
]
|
304 |
-
]
|
305 |
-
);
|
306 |
-
|
307 |
-
|
308 |
-
$this->end_controls_section();
|
309 |
-
|
310 |
-
$this->start_controls_section(
|
311 |
-
'section-general-style',
|
312 |
-
[
|
313 |
-
'label' => __( 'General', '
|
314 |
-
'tab' => Controls_Manager::TAB_STYLE
|
315 |
-
]
|
316 |
-
);
|
317 |
-
|
318 |
-
$this->add_control(
|
319 |
-
'heading_image_border',
|
320 |
-
[
|
321 |
-
'label' => __( 'Image Border', '
|
322 |
-
'type' => Controls_Manager::HEADING,
|
323 |
-
'separator' => 'before',
|
324 |
-
]
|
325 |
-
);
|
326 |
-
|
327 |
-
$this->add_group_control(
|
328 |
-
Group_Control_Border::get_type(),
|
329 |
-
[
|
330 |
-
'name' => 'image_border',
|
331 |
-
'label' => __( 'Image Border', '
|
332 |
-
'selector' => '{{WRAPPER}} .eae-pl-image-wrapper a img',
|
333 |
-
]
|
334 |
-
);
|
335 |
-
|
336 |
-
$this->add_control(
|
337 |
-
'image_border_radius',
|
338 |
-
[
|
339 |
-
'label' => __( 'Border Radius', '
|
340 |
-
'type' => Controls_Manager::DIMENSIONS,
|
341 |
-
'size_units' => [ 'px', '%' ],
|
342 |
-
'selectors' => [
|
343 |
-
'{{WRAPPER}} .eae-pl-image-wrapper a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
344 |
-
'{{WRAPPER}} .eae-pl-image-wrapper a img' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
345 |
-
],
|
346 |
-
]
|
347 |
-
);
|
348 |
-
|
349 |
-
$this->end_controls_section();
|
350 |
-
|
351 |
-
$this->start_controls_section(
|
352 |
-
'section-item-typography',
|
353 |
-
[
|
354 |
-
'label' => __( 'Typography', '
|
355 |
-
'tab' => Controls_Manager::TAB_STYLE
|
356 |
-
]
|
357 |
-
);
|
358 |
-
|
359 |
-
$this->add_control(
|
360 |
-
'heading_title_typography',
|
361 |
-
[
|
362 |
-
'label' => __( 'Title Typography', '
|
363 |
-
'type' => Controls_Manager::HEADING,
|
364 |
-
'separator' => 'before',
|
365 |
-
]
|
366 |
-
);
|
367 |
-
|
368 |
-
$this->add_control(
|
369 |
-
'title_color',
|
370 |
-
[
|
371 |
-
'label' => __( 'Title Color', '
|
372 |
-
'type' => Controls_Manager::COLOR,
|
373 |
-
'scheme' => [
|
374 |
-
'type' => Scheme_Color::get_type(),
|
375 |
-
'value' => Scheme_Color::COLOR_1,
|
376 |
-
],
|
377 |
-
'selectors' => [
|
378 |
-
'{{WRAPPER}} .eae-pl-title a' => 'color: {{VALUE}};',
|
379 |
-
]
|
380 |
-
|
381 |
-
]
|
382 |
-
);
|
383 |
-
|
384 |
-
$this->add_responsive_control(
|
385 |
-
'title_align',
|
386 |
-
[
|
387 |
-
'label' => __( 'Title Align', '
|
388 |
-
'type' => Controls_Manager::CHOOSE,
|
389 |
-
'options' => [
|
390 |
-
'left' => [
|
391 |
-
'title' => __( 'Left', '
|
392 |
-
'icon' => 'fa fa-align-left',
|
393 |
-
],
|
394 |
-
'center' => [
|
395 |
-
'title' => __( 'Center', '
|
396 |
-
'icon' => 'fa fa-align-center',
|
397 |
-
],
|
398 |
-
'right' => [
|
399 |
-
'title' => __( 'Right', '
|
400 |
-
'icon' => 'fa fa-align-right',
|
401 |
-
]
|
402 |
-
],
|
403 |
-
'selectors' => [
|
404 |
-
'{{WRAPPER}} .eae-pl-title a' => 'text-align: {{VALUE}};',
|
405 |
-
]
|
406 |
-
]
|
407 |
-
);
|
408 |
-
|
409 |
-
$this->add_group_control(
|
410 |
-
Group_Control_Typography::get_type(),
|
411 |
-
[
|
412 |
-
'name' => 'title_typography',
|
413 |
-
'label' => __( 'Title Typography', '
|
414 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
415 |
-
'selector' => '{{WRAPPER}} .eae-pl-title a',
|
416 |
-
]
|
417 |
-
);
|
418 |
-
|
419 |
-
$this->add_control(
|
420 |
-
'heading_excrept_typography',
|
421 |
-
[
|
422 |
-
'label' => __( 'Excrept Typography', '
|
423 |
-
'type' => Controls_Manager::HEADING,
|
424 |
-
'separator' => 'before',
|
425 |
-
]
|
426 |
-
);
|
427 |
-
|
428 |
-
$this->add_control(
|
429 |
-
'excrept_color',
|
430 |
-
[
|
431 |
-
'label' => __( 'Excrept Color', '
|
432 |
-
'type' => Controls_Manager::COLOR,
|
433 |
-
'scheme' => [
|
434 |
-
'type' => Scheme_Color::get_type(),
|
435 |
-
'value' => Scheme_Color::COLOR_3,
|
436 |
-
],
|
437 |
-
'selectors' => [
|
438 |
-
'{{WRAPPER}} .eae-pl-content-box' => 'color: {{VALUE}};',
|
439 |
-
]
|
440 |
-
]
|
441 |
-
);
|
442 |
-
|
443 |
-
$this->add_responsive_control(
|
444 |
-
'excrept_align',
|
445 |
-
[
|
446 |
-
'label' => __( 'Excrept Align', '
|
447 |
-
'type' => Controls_Manager::CHOOSE,
|
448 |
-
'options' => [
|
449 |
-
'left' => [
|
450 |
-
'title' => __( 'Left', '
|
451 |
-
'icon' => 'fa fa-align-left',
|
452 |
-
],
|
453 |
-
'center' => [
|
454 |
-
'title' => __( 'Center', '
|
455 |
-
'icon' => 'fa fa-align-center',
|
456 |
-
],
|
457 |
-
'right' => [
|
458 |
-
'title' => __( 'Right', '
|
459 |
-
'icon' => 'fa fa-align-right',
|
460 |
-
],
|
461 |
-
'justify' => [
|
462 |
-
'title' => __( 'Justified', '
|
463 |
-
'icon' => 'fa fa-align-justify',
|
464 |
-
],
|
465 |
-
],
|
466 |
-
'selectors' => [
|
467 |
-
'{{WRAPPER}} .eae-pl-content-box' => 'text-align: {{VALUE}};',
|
468 |
-
],
|
469 |
-
]
|
470 |
-
);
|
471 |
-
|
472 |
-
$this->add_group_control(
|
473 |
-
Group_Control_Typography::get_type(),
|
474 |
-
[
|
475 |
-
'name' => 'excrept_typography',
|
476 |
-
'label' => __( 'Excrept Typography', '
|
477 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_3,
|
478 |
-
'selector' => '{{WRAPPER}} .eae-pl-content-box',
|
479 |
-
]
|
480 |
-
);
|
481 |
-
|
482 |
-
$this->add_control(
|
483 |
-
'heading_readmore_typography',
|
484 |
-
[
|
485 |
-
'label' => __( 'Readmore Typography', '
|
486 |
-
'type' => Controls_Manager::HEADING,
|
487 |
-
'separator' => 'before',
|
488 |
-
]
|
489 |
-
);
|
490 |
-
|
491 |
-
$this->add_control(
|
492 |
-
'readmore_color',
|
493 |
-
[
|
494 |
-
'label' => __( 'Readmore Color', '
|
495 |
-
'type' => Controls_Manager::COLOR,
|
496 |
-
'scheme' => [
|
497 |
-
'type' => Scheme_Color::get_type(),
|
498 |
-
'value' => Scheme_Color::COLOR_3,
|
499 |
-
],
|
500 |
-
'selectors' => [
|
501 |
-
'{{WRAPPER}} .eae-pl-readmore a' => 'color: {{VALUE}};',
|
502 |
-
]
|
503 |
-
]
|
504 |
-
);
|
505 |
-
|
506 |
-
$this->add_responsive_control(
|
507 |
-
'readmore_align',
|
508 |
-
[
|
509 |
-
'label' => __( 'Readmore Align', '
|
510 |
-
'type' => Controls_Manager::CHOOSE,
|
511 |
-
'options' => [
|
512 |
-
'left' => [
|
513 |
-
'title' => __( 'Left', '
|
514 |
-
'icon' => 'fa fa-align-left',
|
515 |
-
],
|
516 |
-
'center' => [
|
517 |
-
'title' => __( 'Center', '
|
518 |
-
'icon' => 'fa fa-align-center',
|
519 |
-
],
|
520 |
-
'right' => [
|
521 |
-
'title' => __( 'Right', '
|
522 |
-
'icon' => 'fa fa-align-right',
|
523 |
-
]
|
524 |
-
],
|
525 |
-
'default' => 'right',
|
526 |
-
'selectors' => [
|
527 |
-
'{{WRAPPER}} .eae-pl-readmore' => 'text-align: {{VALUE}};',
|
528 |
-
],
|
529 |
-
]
|
530 |
-
);
|
531 |
-
|
532 |
-
$this->add_group_control(
|
533 |
-
Group_Control_Typography::get_type(),
|
534 |
-
[
|
535 |
-
'name' => 'readmore_typography',
|
536 |
-
'label' => __( 'Readmore Typography', '
|
537 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_3,
|
538 |
-
'selector' => '{{WRAPPER}} .eae-pl-readmore a',
|
539 |
-
]
|
540 |
-
);
|
541 |
-
|
542 |
-
|
543 |
-
|
544 |
-
$this->end_controls_section();
|
545 |
-
|
546 |
-
$this->start_controls_section(
|
547 |
-
'section-list-item-style',
|
548 |
-
[
|
549 |
-
'label' => __( 'List Item Style', '
|
550 |
-
'tab' => Controls_Manager::TAB_STYLE
|
551 |
-
]
|
552 |
-
);
|
553 |
-
|
554 |
-
$this->add_responsive_control(
|
555 |
-
'list_item_padding',
|
556 |
-
[
|
557 |
-
'label' => __( 'List Item Padding', '
|
558 |
-
'type' => Controls_Manager::DIMENSIONS,
|
559 |
-
'size_units' => [ 'px', 'em', '%' ],
|
560 |
-
'selectors' => [
|
561 |
-
'{{WRAPPER}} .wts-eae-pl-wrapper > ul > li' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
562 |
-
],
|
563 |
-
]
|
564 |
-
);
|
565 |
-
|
566 |
-
$this->add_responsive_control(
|
567 |
-
'list_item_margin',
|
568 |
-
[
|
569 |
-
'label' => __( 'List Item Margin', '
|
570 |
-
'type' => Controls_Manager::DIMENSIONS,
|
571 |
-
'size_units' => [ 'px', 'em', '%' ],
|
572 |
-
'selectors' => [
|
573 |
-
'{{WRAPPER}} .wts-eae-pl-wrapper > ul > li' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
574 |
-
],
|
575 |
-
]
|
576 |
-
);
|
577 |
-
|
578 |
-
$this->add_group_control(
|
579 |
-
Group_Control_Border::get_type(),
|
580 |
-
[
|
581 |
-
'name' => 'list_item_border',
|
582 |
-
'label' => __( 'Image Border', '
|
583 |
-
'selector' => '{{WRAPPER}} .wts-eae-pl-wrapper > ul > li',
|
584 |
-
]
|
585 |
-
);
|
586 |
-
|
587 |
-
$this->add_control(
|
588 |
-
'list_item_border_radius',
|
589 |
-
[
|
590 |
-
'label' => __( 'Border Radius', '
|
591 |
-
'type' => Controls_Manager::DIMENSIONS,
|
592 |
-
'size_units' => [ 'px', '%' ],
|
593 |
-
'selectors' => [
|
594 |
-
'{{WRAPPER}} .wts-eae-pl-wrapper > ul > li' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
|
595 |
-
],
|
596 |
-
]
|
597 |
-
);
|
598 |
-
|
599 |
-
$this->end_controls_section();
|
600 |
-
|
601 |
-
$this->start_controls_section(
|
602 |
-
'section-readmore_button',
|
603 |
-
[
|
604 |
-
'label' => __( 'Read More Button', '
|
605 |
-
'tab' => Controls_Manager::TAB_STYLE
|
606 |
-
]
|
607 |
-
);
|
608 |
-
|
609 |
-
$this->add_control(
|
610 |
-
'readmore_bg',
|
611 |
-
[
|
612 |
-
'label' => __( 'Background Color', '
|
613 |
-
'type' => Controls_Manager::COLOR,
|
614 |
-
'scheme' => [
|
615 |
-
'type' => Scheme_Color::get_type(),
|
616 |
-
'value' => Scheme_Color::COLOR_1,
|
617 |
-
],
|
618 |
-
'selectors' => [
|
619 |
-
'{{WRAPPER}} .eae-pl-readmore a' => 'background-color: {{VALUE}};',
|
620 |
-
],
|
621 |
-
]
|
622 |
-
);
|
623 |
-
|
624 |
-
$this->add_group_control(
|
625 |
-
Group_Control_Border::get_type(),
|
626 |
-
[
|
627 |
-
'name' => 'readmore_border',
|
628 |
-
'label' => __( 'Border', '
|
629 |
-
'default' => '1px',
|
630 |
-
'selector' => '{{WRAPPER}} .eae-pl-readmore a',
|
631 |
-
]
|
632 |
-
);
|
633 |
-
|
634 |
-
$this->add_control(
|
635 |
-
'readmore_border_radius',
|
636 |
-
[
|
637 |
-
'label' => __( 'Border Radius', '
|
638 |
-
'type' => Controls_Manager::DIMENSIONS,
|
639 |
-
'size_units' => [ 'px', '%' ],
|
640 |
-
'selectors' => [
|
641 |
-
'{{WRAPPER}} .eae-pl-readmore a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
642 |
-
],
|
643 |
-
]
|
644 |
-
);
|
645 |
-
|
646 |
-
$this->add_control(
|
647 |
-
'readmore_text_padding',
|
648 |
-
[
|
649 |
-
'label' => __( 'Text Padding', '
|
650 |
-
'type' => Controls_Manager::DIMENSIONS,
|
651 |
-
'size_units' => [ 'px', 'em', '%' ],
|
652 |
-
'selectors' => [
|
653 |
-
'{{WRAPPER}} .eae-pl-readmore a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
654 |
-
],
|
655 |
-
]
|
656 |
-
);
|
657 |
-
|
658 |
-
$this->add_control(
|
659 |
-
'readmore_text_margin',
|
660 |
-
[
|
661 |
-
'label' => __( 'Read More Margin', '
|
662 |
-
'type' => Controls_Manager::DIMENSIONS,
|
663 |
-
'size_units' => [ 'px', 'em', '%' ],
|
664 |
-
'selectors' => [
|
665 |
-
'{{WRAPPER}} .eae-pl-readmore a' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
666 |
-
],
|
667 |
-
]
|
668 |
-
);
|
669 |
-
|
670 |
-
$this->end_controls_section();
|
671 |
-
}
|
672 |
-
|
673 |
-
protected function render( ) {
|
674 |
-
$settings = $this->get_settings();
|
675 |
-
//echo '<pre>'; print_r($settings); echo '</pre>';
|
676 |
-
$post_args = eae_get_post_settings($settings);
|
677 |
-
|
678 |
-
$posts = eae_get_post_data($post_args);
|
679 |
-
// $this->add_render_attribute('separator_wrapper','class','wts-eae-textseparator');
|
680 |
-
?>
|
681 |
-
<div class="wts-eae-pl-wrapper">
|
682 |
-
<?php
|
683 |
-
if(count($posts)){
|
684 |
-
global $post;
|
685 |
-
?>
|
686 |
-
<ul>
|
687 |
-
<?php
|
688 |
-
foreach($posts as $post){
|
689 |
-
setup_postdata($post);
|
690 |
-
?>
|
691 |
-
<li>
|
692 |
-
<?php if($settings['show_title'] && ($settings['title_on_top'] == 'top')){ ?>
|
693 |
-
<h3 class="eae-pl-title"><a href="<?php echo get_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></h3>
|
694 |
-
<?php } ?>
|
695 |
-
<?php if($settings['show_image'] == 1){ ?>
|
696 |
-
<div class="eae-pl-image-wrapper">
|
697 |
-
<a href="<?php echo get_permalink(); ?>" title="<?php the_title(); ?>">
|
698 |
-
<?php the_post_thumbnail($settings['image_size']); ?>
|
699 |
-
</a>
|
700 |
-
</div>
|
701 |
-
<?php } ?>
|
702 |
-
<div class="eae-pl-content-box-wrapper">
|
703 |
-
|
704 |
-
<?php if($settings['show_title'] && ($settings['title_on_top'] != 'top')){ ?>
|
705 |
-
<h3 class="eae-pl-title"><a href="<?php echo get_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></h3>
|
706 |
-
<?php } ?>
|
707 |
-
|
708 |
-
<?php if($settings['show_excrept']){ ?>
|
709 |
-
<div class="eae-pl-content-box">
|
710 |
-
<?php echo eae_get_excerpt_by_id(get_the_ID(),$settings['excrept_size']);?>
|
711 |
-
</div>
|
712 |
-
<?php } ?>
|
713 |
-
|
714 |
-
<?php if($settings['show_read_more']){ ?>
|
715 |
-
<div class="eae-pl-readmore">
|
716 |
-
<a href="<?php echo get_permalink(); ?>" title="<?php the_title(); ?>"><?php echo $settings['read_more_text']; ?></a>
|
717 |
-
</div>
|
718 |
-
<?php } ?>
|
719 |
-
</div>
|
720 |
-
</li>
|
721 |
-
<?php
|
722 |
-
}
|
723 |
-
wp_reset_postdata();
|
724 |
-
?>
|
725 |
-
</ul>
|
726 |
-
<?php
|
727 |
-
}
|
728 |
-
?>
|
729 |
-
</div>
|
730 |
-
<?php
|
731 |
-
}
|
732 |
-
|
733 |
-
protected function content_template() {
|
734 |
-
?>
|
735 |
-
<#
|
736 |
-
|
737 |
-
icon_class = settings.icon != ''? 'icon-yes':'';
|
738 |
-
title_class = settings.title != ''? 'title-yes':'';
|
739 |
-
var separator_html = '<div class="wts-eae-textseparator sep-align-' + settings.align + ' icon-' + settings.icon_position + ' ' + icon_class + ' ' + title_class +'"><div class="eae-sep-holder sep-left"><div class="eae-sep-lines"></div></div>';
|
740 |
-
|
741 |
-
if(settings.icon != '' && settings.icon_position == 'before'){
|
742 |
-
separator_html += '<div class="eae-separator-icon-wrapper"><div class="eae-separator-icon-inner"><i class="'+ settings.icon +'"></i></div></div>'
|
743 |
-
}
|
744 |
-
|
745 |
-
if(settings.title != ''){
|
746 |
-
separator_html += '<' + settings.html_tag + ' class="eae-separator-title">' + settings.title + '</' + settings.html_tag + '>';
|
747 |
-
}
|
748 |
-
|
749 |
-
|
750 |
-
if(settings.icon != '' && settings.icon_position == 'after'){
|
751 |
-
separator_html += '<div class="eae-separator-icon-wrapper"><div class="eae-separator-icon-inner"><i class="'+ settings.icon +'"></i></div></div>'
|
752 |
-
}
|
753 |
-
|
754 |
-
separator_html += '<div class="eae-sep-holder sep-right"><div class="eae-sep-lines"></div></div></div>';
|
755 |
-
|
756 |
-
print( separator_html );
|
757 |
-
#>
|
758 |
-
<?php
|
759 |
-
}
|
760 |
-
}
|
761 |
Plugin::instance()->widgets_manager->register_widget_type( new Widget_PostList() );
|
1 |
+
<?php
|
2 |
+
namespace Elementor;
|
3 |
+
|
4 |
+
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
5 |
+
|
6 |
+
class Widget_PostList extends Widget_Base {
|
7 |
+
|
8 |
+
public function get_name() {
|
9 |
+
return 'wts-postlist';
|
10 |
+
}
|
11 |
+
|
12 |
+
public function get_title() {
|
13 |
+
return __( 'EAE - Post List', 'wts-eae' );
|
14 |
+
}
|
15 |
+
|
16 |
+
public function get_icon() {
|
17 |
+
return 'eicon-post-list wts-eae-pe';
|
18 |
+
}
|
19 |
+
|
20 |
+
public function get_categories() {
|
21 |
+
return [ 'wts-eae' ];
|
22 |
+
}
|
23 |
+
|
24 |
+
protected function _register_controls() {
|
25 |
+
$this->start_controls_section(
|
26 |
+
'section_post_filters',
|
27 |
+
[
|
28 |
+
'label' => __( 'Post Filters', 'wts-eae' )
|
29 |
+
]
|
30 |
+
);
|
31 |
+
|
32 |
+
$this->add_control(
|
33 |
+
'refer_wp_org',
|
34 |
+
[
|
35 |
+
'raw' => __( 'For more detail about following filters please refer <a href="https://codex.wordpress.org/Template_Tags/get_posts" target="_blank">here</a>', 'wts-eae' ),
|
36 |
+
'type' => Controls_Manager::RAW_HTML,
|
37 |
+
'classes' => 'elementor-descriptor',
|
38 |
+
]
|
39 |
+
);
|
40 |
+
|
41 |
+
$this->add_control(
|
42 |
+
'post_type',
|
43 |
+
[
|
44 |
+
'label' => __( 'Post Type', 'wts-eae' ),
|
45 |
+
'type' => Controls_Manager::SELECT,
|
46 |
+
'options' => eae_get_post_types(),
|
47 |
+
'default' => 'post',
|
48 |
+
|
49 |
+
]
|
50 |
+
);
|
51 |
+
|
52 |
+
$this->add_control(
|
53 |
+
'category',
|
54 |
+
[
|
55 |
+
'label' => __( 'Category ID', 'wts-eae' ),
|
56 |
+
'description' => __('Comma separated list of category ids','wts-eae'),
|
57 |
+
'type' => Controls_Manager::TEXT,
|
58 |
+
'default' => '',
|
59 |
+
'condition' => [
|
60 |
+
'post_type' => 'post'
|
61 |
+
]
|
62 |
+
]
|
63 |
+
);
|
64 |
+
|
65 |
+
$this->add_control(
|
66 |
+
'num_posts',
|
67 |
+
[
|
68 |
+
'label' => __( 'Number of Posts', 'wts-eae' ),
|
69 |
+
'type' => Controls_Manager::NUMBER,
|
70 |
+
'default' => '5'
|
71 |
+
]
|
72 |
+
);
|
73 |
+
|
74 |
+
$this->add_control(
|
75 |
+
'post_offset',
|
76 |
+
[
|
77 |
+
'label' => __( 'Post Offset', 'wts-eae' ),
|
78 |
+
'type' => Controls_Manager::NUMBER,
|
79 |
+
'default' => '0'
|
80 |
+
]
|
81 |
+
);
|
82 |
+
|
83 |
+
$this->add_control(
|
84 |
+
'orderby',
|
85 |
+
[
|
86 |
+
'label' => __( 'Order By', 'wts-eae' ),
|
87 |
+
'type' => Controls_Manager::SELECT,
|
88 |
+
'options' => eae_get_post_orderby_options(),
|
89 |
+
'default' => 'date',
|
90 |
+
|
91 |
+
]
|
92 |
+
);
|
93 |
+
|
94 |
+
$this->add_control(
|
95 |
+
'order',
|
96 |
+
[
|
97 |
+
'label' => __( 'Order', 'wts-eae' ),
|
98 |
+
'type' => Controls_Manager::SELECT,
|
99 |
+
'options' => [
|
100 |
+
'asc' => 'Ascending',
|
101 |
+
'desc' => 'Descending'
|
102 |
+
],
|
103 |
+
'default' => 'desc',
|
104 |
+
|
105 |
+
]
|
106 |
+
);
|
107 |
+
|
108 |
+
$this->end_controls_section();
|
109 |
+
|
110 |
+
$this->start_controls_section(
|
111 |
+
'section_layout_settings',
|
112 |
+
[
|
113 |
+
'label' => __( 'Layout Settings', 'wts-eae' )
|
114 |
+
]
|
115 |
+
);
|
116 |
+
|
117 |
+
|
118 |
+
$this->add_control(
|
119 |
+
'show_image',
|
120 |
+
[
|
121 |
+
'label' => __( 'Show Image', 'wts-eae' ),
|
122 |
+
'type' => Controls_Manager::CHOOSE,
|
123 |
+
'options' => [
|
124 |
+
'1' => [
|
125 |
+
'title' => __( 'Yes', 'wts-eae' ),
|
126 |
+
'icon' => 'fa fa-check',
|
127 |
+
],
|
128 |
+
'0' => [
|
129 |
+
'title' => __( 'No', 'wts-eae' ),
|
130 |
+
'icon' => 'fa fa-ban',
|
131 |
+
]
|
132 |
+
],
|
133 |
+
'default' => '1'
|
134 |
+
]
|
135 |
+
);
|
136 |
+
$this->add_group_control(
|
137 |
+
Group_Control_Image_Size::get_type(),
|
138 |
+
[
|
139 |
+
'name' => 'image',
|
140 |
+
'exclude' => [ 'custom' ],
|
141 |
+
'condition' => [
|
142 |
+
'show_image' => '1',
|
143 |
+
]
|
144 |
+
]
|
145 |
+
);
|
146 |
+
|
147 |
+
$this->add_responsive_control(
|
148 |
+
'image_align',
|
149 |
+
[
|
150 |
+
'label' => __( 'Image Alignment', 'wts-eae' ),
|
151 |
+
'type' => Controls_Manager::CHOOSE,
|
152 |
+
'options' => [
|
153 |
+
'left' => [
|
154 |
+
'title' => __( 'Left', 'wts-eae' ),
|
155 |
+
'icon' => 'fa fa-align-left',
|
156 |
+
],
|
157 |
+
'none' => [
|
158 |
+
'title' => __( 'Center', 'wts-eae' ),
|
159 |
+
'icon' => 'fa fa-align-center',
|
160 |
+
],
|
161 |
+
'right' => [
|
162 |
+
'title' => __( 'Right', 'wts-eae' ),
|
163 |
+
'icon' => 'fa fa-align-right',
|
164 |
+
]
|
165 |
+
],
|
166 |
+
'default' => 'left',
|
167 |
+
'condition' => [
|
168 |
+
'show_image' => '1',
|
169 |
+
],
|
170 |
+
'selectors' => [
|
171 |
+
'{{WRAPPER}} .eae-pl-image-wrapper' => 'float: {{VALUE}};',
|
172 |
+
],
|
173 |
+
'prefix_class' => 'eae-pl-img-align-'
|
174 |
+
]
|
175 |
+
);
|
176 |
+
|
177 |
+
$this->add_responsive_control(
|
178 |
+
'image_indent',
|
179 |
+
[
|
180 |
+
'label' => __( 'Image Indent', 'wts-eae' ),
|
181 |
+
'type' => Controls_Manager::SLIDER,
|
182 |
+
'range' => [
|
183 |
+
'px' => [
|
184 |
+
'min' => 5,
|
185 |
+
'max' => 100,
|
186 |
+
],
|
187 |
+
],
|
188 |
+
'default' => [
|
189 |
+
'size' => 10,
|
190 |
+
'unit' => 'px',
|
191 |
+
],
|
192 |
+
'condition' => [
|
193 |
+
'show_image' => '1',
|
194 |
+
],
|
195 |
+
'selectors' => [
|
196 |
+
'{{WRAPPER}}.eae-pl-img-align-left .eae-pl-image-wrapper' => 'margin-right: {{SIZE}}{{UNIT}};',
|
197 |
+
'{{WRAPPER}}.eae-pl-img-align-right .eae-pl-image-wrapper' => 'margin-left: {{SIZE}}{{UNIT}};',
|
198 |
+
],
|
199 |
+
]
|
200 |
+
);
|
201 |
+
|
202 |
+
$this->add_control(
|
203 |
+
'show_title',
|
204 |
+
[
|
205 |
+
'label' => __( 'Show Title', 'wts-eae' ),
|
206 |
+
'type' => Controls_Manager::CHOOSE,
|
207 |
+
'options' => [
|
208 |
+
'1' => [
|
209 |
+
'title' => __( 'Yes', 'wts-eae' ),
|
210 |
+
'icon' => 'fa fa-check',
|
211 |
+
],
|
212 |
+
'0' => [
|
213 |
+
'title' => __( 'No', 'wts-eae' ),
|
214 |
+
'icon' => 'fa fa-ban',
|
215 |
+
]
|
216 |
+
],
|
217 |
+
'default' => '1'
|
218 |
+
]
|
219 |
+
);
|
220 |
+
|
221 |
+
$this->add_control(
|
222 |
+
'title_on_top',
|
223 |
+
[
|
224 |
+
'label' => __( 'Title on top', 'wts-eae' ),
|
225 |
+
'type' => Controls_Manager::CHOOSE,
|
226 |
+
'options' => [
|
227 |
+
'top' => [
|
228 |
+
'title' => __( 'Yes', 'wts-eae' ),
|
229 |
+
'icon' => 'fa fa-check',
|
230 |
+
],
|
231 |
+
'0' => [
|
232 |
+
'title' => __( 'No', 'wts-eae' ),
|
233 |
+
'icon' => 'fa fa-ban',
|
234 |
+
]
|
235 |
+
],
|
236 |
+
'default' => '0',
|
237 |
+
'condition' => [
|
238 |
+
'show_title' => '1'
|
239 |
+
]
|
240 |
+
]
|
241 |
+
);
|
242 |
+
|
243 |
+
$this->add_control(
|
244 |
+
'show_excrept',
|
245 |
+
[
|
246 |
+
'label' => __( 'Show Excrept', 'wts-eae' ),
|
247 |
+
'type' => Controls_Manager::CHOOSE,
|
248 |
+
'options' => [
|
249 |
+
'1' => [
|
250 |
+
'title' => __( 'Yes', 'wts-eae' ),
|
251 |
+
'icon' => 'fa fa-check',
|
252 |
+
],
|
253 |
+
'0' => [
|
254 |
+
'title' => __( 'No', 'wts-eae' ),
|
255 |
+
'icon' => 'fa fa-ban',
|
256 |
+
]
|
257 |
+
],
|
258 |
+
'default' => '1'
|
259 |
+
]
|
260 |
+
);
|
261 |
+
|
262 |
+
$this->add_control(
|
263 |
+
'excrept_size',
|
264 |
+
[
|
265 |
+
'label' => __( 'Excrept Size', 'wts-eae' ),
|
266 |
+
'type' => Controls_Manager::NUMBER,
|
267 |
+
'default' => '10',
|
268 |
+
'condition' => [
|
269 |
+
'show_excrept' => '1',
|
270 |
+
]
|
271 |
+
|
272 |
+
]
|
273 |
+
);
|
274 |
+
|
275 |
+
$this->add_control(
|
276 |
+
'show_read_more',
|
277 |
+
[
|
278 |
+
'label' => __( 'Show Read More', 'wts-eae' ),
|
279 |
+
'type' => Controls_Manager::CHOOSE,
|
280 |
+
'options' => [
|
281 |
+
'1' => [
|
282 |
+
'title' => __( 'Yes', 'wts-eae' ),
|
283 |
+
'icon' => 'fa fa-check',
|
284 |
+
],
|
285 |
+
'0' => [
|
286 |
+
'title' => __( 'No', 'wts-eae' ),
|
287 |
+
'icon' => 'fa fa-ban',
|
288 |
+
]
|
289 |
+
],
|
290 |
+
'default' => '1'
|
291 |
+
]
|
292 |
+
);
|
293 |
+
|
294 |
+
$this->add_control(
|
295 |
+
'read_more_text',
|
296 |
+
[
|
297 |
+
'label' => __( 'Read More Text', 'wts-eae' ),
|
298 |
+
'type' => Controls_Manager::TEXT,
|
299 |
+
'placeholder' => __( 'Read More', 'wts-eae' ),
|
300 |
+
'default' => __( 'Read More', 'wts-eae' ),
|
301 |
+
'condition' => [
|
302 |
+
'show_read_more' => '1',
|
303 |
+
]
|
304 |
+
]
|
305 |
+
);
|
306 |
+
|
307 |
+
|
308 |
+
$this->end_controls_section();
|
309 |
+
|
310 |
+
$this->start_controls_section(
|
311 |
+
'section-general-style',
|
312 |
+
[
|
313 |
+
'label' => __( 'General', 'wts-eae' ),
|
314 |
+
'tab' => Controls_Manager::TAB_STYLE
|
315 |
+
]
|
316 |
+
);
|
317 |
+
|
318 |
+
$this->add_control(
|
319 |
+
'heading_image_border',
|
320 |
+
[
|
321 |
+
'label' => __( 'Image Border', 'wts-eae' ),
|
322 |
+
'type' => Controls_Manager::HEADING,
|
323 |
+
'separator' => 'before',
|
324 |
+
]
|
325 |
+
);
|
326 |
+
|
327 |
+
$this->add_group_control(
|
328 |
+
Group_Control_Border::get_type(),
|
329 |
+
[
|
330 |
+
'name' => 'image_border',
|
331 |
+
'label' => __( 'Image Border', 'wts-eae' ),
|
332 |
+
'selector' => '{{WRAPPER}} .eae-pl-image-wrapper a img',
|
333 |
+
]
|
334 |
+
);
|
335 |
+
|
336 |
+
$this->add_control(
|
337 |
+
'image_border_radius',
|
338 |
+
[
|
339 |
+
'label' => __( 'Border Radius', 'wts-eae' ),
|
340 |
+
'type' => Controls_Manager::DIMENSIONS,
|
341 |
+
'size_units' => [ 'px', '%' ],
|
342 |
+
'selectors' => [
|
343 |
+
'{{WRAPPER}} .eae-pl-image-wrapper a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
344 |
+
'{{WRAPPER}} .eae-pl-image-wrapper a img' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
345 |
+
],
|
346 |
+
]
|
347 |
+
);
|
348 |
+
|
349 |
+
$this->end_controls_section();
|
350 |
+
|
351 |
+
$this->start_controls_section(
|
352 |
+
'section-item-typography',
|
353 |
+
[
|
354 |
+
'label' => __( 'Typography', 'wts-eae' ),
|
355 |
+
'tab' => Controls_Manager::TAB_STYLE
|
356 |
+
]
|
357 |
+
);
|
358 |
+
|
359 |
+
$this->add_control(
|
360 |
+
'heading_title_typography',
|
361 |
+
[
|
362 |
+
'label' => __( 'Title Typography', 'wts-eae' ),
|
363 |
+
'type' => Controls_Manager::HEADING,
|
364 |
+
'separator' => 'before',
|
365 |
+
]
|
366 |
+
);
|
367 |
+
|
368 |
+
$this->add_control(
|
369 |
+
'title_color',
|
370 |
+
[
|
371 |
+
'label' => __( 'Title Color', 'wts-eae' ),
|
372 |
+
'type' => Controls_Manager::COLOR,
|
373 |
+
'scheme' => [
|
374 |
+
'type' => Scheme_Color::get_type(),
|
375 |
+
'value' => Scheme_Color::COLOR_1,
|
376 |
+
],
|
377 |
+
'selectors' => [
|
378 |
+
'{{WRAPPER}} .eae-pl-title a' => 'color: {{VALUE}};',
|
379 |
+
]
|
380 |
+
|
381 |
+
]
|
382 |
+
);
|
383 |
+
|
384 |
+
$this->add_responsive_control(
|
385 |
+
'title_align',
|
386 |
+
[
|
387 |
+
'label' => __( 'Title Align', 'wts-eae' ),
|
388 |
+
'type' => Controls_Manager::CHOOSE,
|
389 |
+
'options' => [
|
390 |
+
'left' => [
|
391 |
+
'title' => __( 'Left', 'wts-eae' ),
|
392 |
+
'icon' => 'fa fa-align-left',
|
393 |
+
],
|
394 |
+
'center' => [
|
395 |
+
'title' => __( 'Center', 'wts-eae' ),
|
396 |
+
'icon' => 'fa fa-align-center',
|
397 |
+
],
|
398 |
+
'right' => [
|
399 |
+
'title' => __( 'Right', 'wts-eae' ),
|
400 |
+
'icon' => 'fa fa-align-right',
|
401 |
+
]
|
402 |
+
],
|
403 |
+
'selectors' => [
|
404 |
+
'{{WRAPPER}} .eae-pl-title a' => 'text-align: {{VALUE}};',
|
405 |
+
]
|
406 |
+
]
|
407 |
+
);
|
408 |
+
|
409 |
+
$this->add_group_control(
|
410 |
+
Group_Control_Typography::get_type(),
|
411 |
+
[
|
412 |
+
'name' => 'title_typography',
|
413 |
+
'label' => __( 'Title Typography', 'wts-eae' ),
|
414 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
415 |
+
'selector' => '{{WRAPPER}} .eae-pl-title a',
|
416 |
+
]
|
417 |
+
);
|
418 |
+
|
419 |
+
$this->add_control(
|
420 |
+
'heading_excrept_typography',
|
421 |
+
[
|
422 |
+
'label' => __( 'Excrept Typography', 'wts-eae' ),
|
423 |
+
'type' => Controls_Manager::HEADING,
|
424 |
+
'separator' => 'before',
|
425 |
+
]
|
426 |
+
);
|
427 |
+
|
428 |
+
$this->add_control(
|
429 |
+
'excrept_color',
|
430 |
+
[
|
431 |
+
'label' => __( 'Excrept Color', 'wts-eae' ),
|
432 |
+
'type' => Controls_Manager::COLOR,
|
433 |
+
'scheme' => [
|
434 |
+
'type' => Scheme_Color::get_type(),
|
435 |
+
'value' => Scheme_Color::COLOR_3,
|
436 |
+
],
|
437 |
+
'selectors' => [
|
438 |
+
'{{WRAPPER}} .eae-pl-content-box' => 'color: {{VALUE}};',
|
439 |
+
]
|
440 |
+
]
|
441 |
+
);
|
442 |
+
|
443 |
+
$this->add_responsive_control(
|
444 |
+
'excrept_align',
|
445 |
+
[
|
446 |
+
'label' => __( 'Excrept Align', 'wts-eae' ),
|
447 |
+
'type' => Controls_Manager::CHOOSE,
|
448 |
+
'options' => [
|
449 |
+
'left' => [
|
450 |
+
'title' => __( 'Left', 'wts-eae' ),
|
451 |
+
'icon' => 'fa fa-align-left',
|
452 |
+
],
|
453 |
+
'center' => [
|
454 |
+
'title' => __( 'Center', 'wts-eae' ),
|
455 |
+
'icon' => 'fa fa-align-center',
|
456 |
+
],
|
457 |
+
'right' => [
|
458 |
+
'title' => __( 'Right', 'wts-eae' ),
|
459 |
+
'icon' => 'fa fa-align-right',
|
460 |
+
],
|
461 |
+
'justify' => [
|
462 |
+
'title' => __( 'Justified', 'wts-eae' ),
|
463 |
+
'icon' => 'fa fa-align-justify',
|
464 |
+
],
|
465 |
+
],
|
466 |
+
'selectors' => [
|
467 |
+
'{{WRAPPER}} .eae-pl-content-box' => 'text-align: {{VALUE}};',
|
468 |
+
],
|
469 |
+
]
|
470 |
+
);
|
471 |
+
|
472 |
+
$this->add_group_control(
|
473 |
+
Group_Control_Typography::get_type(),
|
474 |
+
[
|
475 |
+
'name' => 'excrept_typography',
|
476 |
+
'label' => __( 'Excrept Typography', 'wts-eae' ),
|
477 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_3,
|
478 |
+
'selector' => '{{WRAPPER}} .eae-pl-content-box',
|
479 |
+
]
|
480 |
+
);
|
481 |
+
|
482 |
+
$this->add_control(
|
483 |
+
'heading_readmore_typography',
|
484 |
+
[
|
485 |
+
'label' => __( 'Readmore Typography', 'wts-eae' ),
|
486 |
+
'type' => Controls_Manager::HEADING,
|
487 |
+
'separator' => 'before',
|
488 |
+
]
|
489 |
+
);
|
490 |
+
|
491 |
+
$this->add_control(
|
492 |
+
'readmore_color',
|
493 |
+
[
|
494 |
+
'label' => __( 'Readmore Color', 'wts-eae' ),
|
495 |
+
'type' => Controls_Manager::COLOR,
|
496 |
+
'scheme' => [
|
497 |
+
'type' => Scheme_Color::get_type(),
|
498 |
+
'value' => Scheme_Color::COLOR_3,
|
499 |
+
],
|
500 |
+
'selectors' => [
|
501 |
+
'{{WRAPPER}} .eae-pl-readmore a' => 'color: {{VALUE}};',
|
502 |
+
]
|
503 |
+
]
|
504 |
+
);
|
505 |
+
|
506 |
+
$this->add_responsive_control(
|
507 |
+
'readmore_align',
|
508 |
+
[
|
509 |
+
'label' => __( 'Readmore Align', 'wts-eae' ),
|
510 |
+
'type' => Controls_Manager::CHOOSE,
|
511 |
+
'options' => [
|
512 |
+
'left' => [
|
513 |
+
'title' => __( 'Left', 'wts-eae' ),
|
514 |
+
'icon' => 'fa fa-align-left',
|
515 |
+
],
|
516 |
+
'center' => [
|
517 |
+
'title' => __( 'Center', 'wts-eae' ),
|
518 |
+
'icon' => 'fa fa-align-center',
|
519 |
+
],
|
520 |
+
'right' => [
|
521 |
+
'title' => __( 'Right', 'wts-eae' ),
|
522 |
+
'icon' => 'fa fa-align-right',
|
523 |
+
]
|
524 |
+
],
|
525 |
+
'default' => 'right',
|
526 |
+
'selectors' => [
|
527 |
+
'{{WRAPPER}} .eae-pl-readmore' => 'text-align: {{VALUE}};',
|
528 |
+
],
|
529 |
+
]
|
530 |
+
);
|
531 |
+
|
532 |
+
$this->add_group_control(
|
533 |
+
Group_Control_Typography::get_type(),
|
534 |
+
[
|
535 |
+
'name' => 'readmore_typography',
|
536 |
+
'label' => __( 'Readmore Typography', 'wts-eae' ),
|
537 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_3,
|
538 |
+
'selector' => '{{WRAPPER}} .eae-pl-readmore a',
|
539 |
+
]
|
540 |
+
);
|
541 |
+
|
542 |
+
|
543 |
+
|
544 |
+
$this->end_controls_section();
|
545 |
+
|
546 |
+
$this->start_controls_section(
|
547 |
+
'section-list-item-style',
|
548 |
+
[
|
549 |
+
'label' => __( 'List Item Style', 'wts-eae' ),
|
550 |
+
'tab' => Controls_Manager::TAB_STYLE
|
551 |
+
]
|
552 |
+
);
|
553 |
+
|
554 |
+
$this->add_responsive_control(
|
555 |
+
'list_item_padding',
|
556 |
+
[
|
557 |
+
'label' => __( 'List Item Padding', 'wts-eae' ),
|
558 |
+
'type' => Controls_Manager::DIMENSIONS,
|
559 |
+
'size_units' => [ 'px', 'em', '%' ],
|
560 |
+
'selectors' => [
|
561 |
+
'{{WRAPPER}} .wts-eae-pl-wrapper > ul > li' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
562 |
+
],
|
563 |
+
]
|
564 |
+
);
|
565 |
+
|
566 |
+
$this->add_responsive_control(
|
567 |
+
'list_item_margin',
|
568 |
+
[
|
569 |
+
'label' => __( 'List Item Margin', 'wts-eae' ),
|
570 |
+
'type' => Controls_Manager::DIMENSIONS,
|
571 |
+
'size_units' => [ 'px', 'em', '%' ],
|
572 |
+
'selectors' => [
|
573 |
+
'{{WRAPPER}} .wts-eae-pl-wrapper > ul > li' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
574 |
+
],
|
575 |
+
]
|
576 |
+
);
|
577 |
+
|
578 |
+
$this->add_group_control(
|
579 |
+
Group_Control_Border::get_type(),
|
580 |
+
[
|
581 |
+
'name' => 'list_item_border',
|
582 |
+
'label' => __( 'Image Border', 'wts-eae' ),
|
583 |
+
'selector' => '{{WRAPPER}} .wts-eae-pl-wrapper > ul > li',
|
584 |
+
]
|
585 |
+
);
|
586 |
+
|
587 |
+
$this->add_control(
|
588 |
+
'list_item_border_radius',
|
589 |
+
[
|
590 |
+
'label' => __( 'Border Radius', 'wts-eae' ),
|
591 |
+
'type' => Controls_Manager::DIMENSIONS,
|
592 |
+
'size_units' => [ 'px', '%' ],
|
593 |
+
'selectors' => [
|
594 |
+
'{{WRAPPER}} .wts-eae-pl-wrapper > ul > li' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
|
595 |
+
],
|
596 |
+
]
|
597 |
+
);
|
598 |
+
|
599 |
+
$this->end_controls_section();
|
600 |
+
|
601 |
+
$this->start_controls_section(
|
602 |
+
'section-readmore_button',
|
603 |
+
[
|
604 |
+
'label' => __( 'Read More Button', 'wts-eae' ),
|
605 |
+
'tab' => Controls_Manager::TAB_STYLE
|
606 |
+
]
|
607 |
+
);
|
608 |
+
|
609 |
+
$this->add_control(
|
610 |
+
'readmore_bg',
|
611 |
+
[
|
612 |
+
'label' => __( 'Background Color', 'wts-eae' ),
|
613 |
+
'type' => Controls_Manager::COLOR,
|
614 |
+
'scheme' => [
|
615 |
+
'type' => Scheme_Color::get_type(),
|
616 |
+
'value' => Scheme_Color::COLOR_1,
|
617 |
+
],
|
618 |
+
'selectors' => [
|
619 |
+
'{{WRAPPER}} .eae-pl-readmore a' => 'background-color: {{VALUE}};',
|
620 |
+
],
|
621 |
+
]
|
622 |
+
);
|
623 |
+
|
624 |
+
$this->add_group_control(
|
625 |
+
Group_Control_Border::get_type(),
|
626 |
+
[
|
627 |
+
'name' => 'readmore_border',
|
628 |
+
'label' => __( 'Border', 'wts-eae' ),
|
629 |
+
'default' => '1px',
|
630 |
+
'selector' => '{{WRAPPER}} .eae-pl-readmore a',
|
631 |
+
]
|
632 |
+
);
|
633 |
+
|
634 |
+
$this->add_control(
|
635 |
+
'readmore_border_radius',
|
636 |
+
[
|
637 |
+
'label' => __( 'Border Radius', 'wts-eae' ),
|
638 |
+
'type' => Controls_Manager::DIMENSIONS,
|
639 |
+
'size_units' => [ 'px', '%' ],
|
640 |
+
'selectors' => [
|
641 |
+
'{{WRAPPER}} .eae-pl-readmore a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
642 |
+
],
|
643 |
+
]
|
644 |
+
);
|
645 |
+
|
646 |
+
$this->add_control(
|
647 |
+
'readmore_text_padding',
|
648 |
+
[
|
649 |
+
'label' => __( 'Text Padding', 'wts-eae' ),
|
650 |
+
'type' => Controls_Manager::DIMENSIONS,
|
651 |
+
'size_units' => [ 'px', 'em', '%' ],
|
652 |
+
'selectors' => [
|
653 |
+
'{{WRAPPER}} .eae-pl-readmore a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
654 |
+
],
|
655 |
+
]
|
656 |
+
);
|
657 |
+
|
658 |
+
$this->add_control(
|
659 |
+
'readmore_text_margin',
|
660 |
+
[
|
661 |
+
'label' => __( 'Read More Margin', 'wts-eae' ),
|
662 |
+
'type' => Controls_Manager::DIMENSIONS,
|
663 |
+
'size_units' => [ 'px', 'em', '%' ],
|
664 |
+
'selectors' => [
|
665 |
+
'{{WRAPPER}} .eae-pl-readmore a' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
666 |
+
],
|
667 |
+
]
|
668 |
+
);
|
669 |
+
|
670 |
+
$this->end_controls_section();
|
671 |
+
}
|
672 |
+
|
673 |
+
protected function render( ) {
|
674 |
+
$settings = $this->get_settings();
|
675 |
+
//echo '<pre>'; print_r($settings); echo '</pre>';
|
676 |
+
$post_args = eae_get_post_settings($settings);
|
677 |
+
|
678 |
+
$posts = eae_get_post_data($post_args);
|
679 |
+
// $this->add_render_attribute('separator_wrapper','class','wts-eae-textseparator');
|
680 |
+
?>
|
681 |
+
<div class="wts-eae-pl-wrapper">
|
682 |
+
<?php
|
683 |
+
if(count($posts)){
|
684 |
+
global $post;
|
685 |
+
?>
|
686 |
+
<ul>
|
687 |
+
<?php
|
688 |
+
foreach($posts as $post){
|
689 |
+
setup_postdata($post);
|
690 |
+
?>
|
691 |
+
<li>
|
692 |
+
<?php if($settings['show_title'] && ($settings['title_on_top'] == 'top')){ ?>
|
693 |
+
<h3 class="eae-pl-title"><a href="<?php echo get_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></h3>
|
694 |
+
<?php } ?>
|
695 |
+
<?php if($settings['show_image'] == 1){ ?>
|
696 |
+
<div class="eae-pl-image-wrapper">
|
697 |
+
<a href="<?php echo get_permalink(); ?>" title="<?php the_title(); ?>">
|
698 |
+
<?php the_post_thumbnail($settings['image_size']); ?>
|
699 |
+
</a>
|
700 |
+
</div>
|
701 |
+
<?php } ?>
|
702 |
+
<div class="eae-pl-content-box-wrapper">
|
703 |
+
|
704 |
+
<?php if($settings['show_title'] && ($settings['title_on_top'] != 'top')){ ?>
|
705 |
+
<h3 class="eae-pl-title"><a href="<?php echo get_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></h3>
|
706 |
+
<?php } ?>
|
707 |
+
|
708 |
+
<?php if($settings['show_excrept']){ ?>
|
709 |
+
<div class="eae-pl-content-box">
|
710 |
+
<?php echo eae_get_excerpt_by_id(get_the_ID(),$settings['excrept_size']);?>
|
711 |
+
</div>
|
712 |
+
<?php } ?>
|
713 |
+
|
714 |
+
<?php if($settings['show_read_more']){ ?>
|
715 |
+
<div class="eae-pl-readmore">
|
716 |
+
<a href="<?php echo get_permalink(); ?>" title="<?php the_title(); ?>"><?php echo $settings['read_more_text']; ?></a>
|
717 |
+
</div>
|
718 |
+
<?php } ?>
|
719 |
+
</div>
|
720 |
+
</li>
|
721 |
+
<?php
|
722 |
+
}
|
723 |
+
wp_reset_postdata();
|
724 |
+
?>
|
725 |
+
</ul>
|
726 |
+
<?php
|
727 |
+
}
|
728 |
+
?>
|
729 |
+
</div>
|
730 |
+
<?php
|
731 |
+
}
|
732 |
+
|
733 |
+
protected function content_template() {
|
734 |
+
?>
|
735 |
+
<#
|
736 |
+
|
737 |
+
icon_class = settings.icon != ''? 'icon-yes':'';
|
738 |
+
title_class = settings.title != ''? 'title-yes':'';
|
739 |
+
var separator_html = '<div class="wts-eae-textseparator sep-align-' + settings.align + ' icon-' + settings.icon_position + ' ' + icon_class + ' ' + title_class +'"><div class="eae-sep-holder sep-left"><div class="eae-sep-lines"></div></div>';
|
740 |
+
|
741 |
+
if(settings.icon != '' && settings.icon_position == 'before'){
|
742 |
+
separator_html += '<div class="eae-separator-icon-wrapper"><div class="eae-separator-icon-inner"><i class="'+ settings.icon +'"></i></div></div>'
|
743 |
+
}
|
744 |
+
|
745 |
+
if(settings.title != ''){
|
746 |
+
separator_html += '<' + settings.html_tag + ' class="eae-separator-title">' + settings.title + '</' + settings.html_tag + '>';
|
747 |
+
}
|
748 |
+
|
749 |
+
|
750 |
+
if(settings.icon != '' && settings.icon_position == 'after'){
|
751 |
+
separator_html += '<div class="eae-separator-icon-wrapper"><div class="eae-separator-icon-inner"><i class="'+ settings.icon +'"></i></div></div>'
|
752 |
+
}
|
753 |
+
|
754 |
+
separator_html += '<div class="eae-sep-holder sep-right"><div class="eae-sep-lines"></div></div></div>';
|
755 |
+
|
756 |
+
print( separator_html );
|
757 |
+
#>
|
758 |
+
<?php
|
759 |
+
}
|
760 |
+
}
|
761 |
Plugin::instance()->widgets_manager->register_widget_type( new Widget_PostList() );
|
elements/pricetable.php
CHANGED
@@ -1,870 +1,870 @@
|
|
1 |
-
<?php
|
2 |
-
namespace Elementor;
|
3 |
-
|
4 |
-
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
5 |
-
|
6 |
-
class Widget_PriceTable extends Widget_Base {
|
7 |
-
|
8 |
-
public function get_name() {
|
9 |
-
return 'wts-pricetable';
|
10 |
-
}
|
11 |
-
|
12 |
-
public function get_title() {
|
13 |
-
return __( 'EAE - Price Table', '
|
14 |
-
}
|
15 |
-
|
16 |
-
public function get_icon() {
|
17 |
-
return 'eicon-price-table wts-eae-pe';
|
18 |
-
}
|
19 |
-
|
20 |
-
public function get_categories() {
|
21 |
-
return [ 'wts-eae' ];
|
22 |
-
}
|
23 |
-
|
24 |
-
|
25 |
-
protected function _register_controls() {
|
26 |
-
$this->start_controls_section(
|
27 |
-
'section_title',
|
28 |
-
[
|
29 |
-
'label' => __( 'Plan Heading', '
|
30 |
-
]
|
31 |
-
);
|
32 |
-
|
33 |
-
$this->add_control(
|
34 |
-
'heading',
|
35 |
-
[
|
36 |
-
'label' => __( 'Heading', '
|
37 |
-
'type' => Controls_Manager::TEXT,
|
38 |
-
'placeholder' => __( 'Enter plan name', '
|
39 |
-
'default' => __( 'Plan 1', '
|
40 |
-
]
|
41 |
-
);
|
42 |
-
|
43 |
-
$this->add_control(
|
44 |
-
'heading_tag',
|
45 |
-
[
|
46 |
-
'label' => __( 'Heading HTML Tag', '
|
47 |
-
'type' => Controls_Manager::SELECT,
|
48 |
-
'options' => [
|
49 |
-
'h1' => __( 'H1', '
|
50 |
-
'h2' => __( 'H2', '
|
51 |
-
'h3' => __( 'H3', '
|
52 |
-
'h4' => __( 'H4', '
|
53 |
-
'h5' => __( 'H5', '
|
54 |
-
'h6' => __( 'H6', '
|
55 |
-
],
|
56 |
-
'default' => 'h2',
|
57 |
-
]
|
58 |
-
);
|
59 |
-
|
60 |
-
|
61 |
-
$this->add_control(
|
62 |
-
'sub-heading',
|
63 |
-
[
|
64 |
-
'label' => __( 'Sub Heading', '
|
65 |
-
'type' => Controls_Manager::TEXT,
|
66 |
-
'placeholder' => __( 'Enter plan name', '
|
67 |
-
'default' => __( 'Plan 1', '
|
68 |
-
]
|
69 |
-
);
|
70 |
-
|
71 |
-
$this->add_control(
|
72 |
-
'sub_heading_tag',
|
73 |
-
[
|
74 |
-
'label' => __( 'Sub Heading HTML Tag', '
|
75 |
-
'type' => Controls_Manager::SELECT,
|
76 |
-
'options' => [
|
77 |
-
'h1' => __( 'H1', '
|
78 |
-
'h2' => __( 'H2', '
|
79 |
-
'h3' => __( 'H3', '
|
80 |
-
'h4' => __( 'H4', '
|
81 |
-
'h5' => __( 'H5', '
|
82 |
-
'h6' => __( 'H6', '
|
83 |
-
'p' => __( 'P', '
|
84 |
-
],
|
85 |
-
'default' => 'h3',
|
86 |
-
]
|
87 |
-
);
|
88 |
-
|
89 |
-
$this->end_controls_section();
|
90 |
-
|
91 |
-
$this->start_controls_section(
|
92 |
-
'section_price_box',
|
93 |
-
[
|
94 |
-
'label' => __( 'Price Box', '
|
95 |
-
]
|
96 |
-
);
|
97 |
-
|
98 |
-
|
99 |
-
$this->add_control(
|
100 |
-
'price-box-text',
|
101 |
-
[
|
102 |
-
'label' => __( 'Price Box Text', '
|
103 |
-
'type' => Controls_Manager::TEXT,
|
104 |
-
'placeholder' => __( '$100', '
|
105 |
-
'default' => __( '$100', '
|
106 |
-
]
|
107 |
-
);
|
108 |
-
|
109 |
-
|
110 |
-
$this->add_control(
|
111 |
-
'price-box-subtext',
|
112 |
-
[
|
113 |
-
'label' => __( 'Price Box Sub Text', '
|
114 |
-
'type' => Controls_Manager::TEXT,
|
115 |
-
'placeholder' => __( 'per month', '
|
116 |
-
'default' => __( 'per month', '
|
117 |
-
]
|
118 |
-
);
|
119 |
-
|
120 |
-
$this->add_control(
|
121 |
-
'shape',
|
122 |
-
[
|
123 |
-
'label' => __( 'Shape', '
|
124 |
-
'type' => Controls_Manager::SELECT,
|
125 |
-
'options' => [
|
126 |
-
'none' => __( 'None', '
|
127 |
-
'circle' => __( 'Circle', '
|
128 |
-
'square' => __( 'Square', '
|
129 |
-
],
|
130 |
-
'default' => 'circle',
|
131 |
-
'prefix_class' => 'eae-pt-price-box-shape-',
|
132 |
-
]
|
133 |
-
);
|
134 |
-
|
135 |
-
$this->end_controls_section();
|
136 |
-
|
137 |
-
$this->start_controls_section(
|
138 |
-
'section_features',
|
139 |
-
[
|
140 |
-
'label' => __( 'Features', '
|
141 |
-
]
|
142 |
-
);
|
143 |
-
|
144 |
-
$this->add_control(
|
145 |
-
'feature-list',
|
146 |
-
[
|
147 |
-
'label' => __( 'Plan Features', '
|
148 |
-
'type' => Controls_Manager::REPEATER,
|
149 |
-
'default' => [
|
150 |
-
[
|
151 |
-
'text' => __( 'List Item #1', '
|
152 |
-
'available' => 'yes'
|
153 |
-
],
|
154 |
-
[
|
155 |
-
'text' => __( 'List Item #2', '
|
156 |
-
'available' => 'yes'
|
157 |
-
],
|
158 |
-
[
|
159 |
-
'text' => __( 'List Item #3', '
|
160 |
-
'available' => 'yes'
|
161 |
-
],
|
162 |
-
],
|
163 |
-
'fields' => [
|
164 |
-
[
|
165 |
-
'name' => 'text',
|
166 |
-
'label' => __( 'Text', '
|
167 |
-
'type' => Controls_Manager::TEXT,
|
168 |
-
'label_block' => true,
|
169 |
-
'placeholder' => __( 'Plan Features', '
|
170 |
-
'default' => __( 'Feature 1', '
|
171 |
-
],
|
172 |
-
[
|
173 |
-
'name' => 'available',
|
174 |
-
'label' => __( 'Included', '
|
175 |
-
'type' => Controls_Manager::SWITCHER,
|
176 |
-
'label_block' => true,
|
177 |
-
'default' => 'yes'
|
178 |
-
]
|
179 |
-
],
|
180 |
-
'title_field' => '{{{ text }}}'
|
181 |
-
]
|
182 |
-
);
|
183 |
-
|
184 |
-
$this->end_controls_section();
|
185 |
-
|
186 |
-
$this->start_controls_section(
|
187 |
-
'section_action_button',
|
188 |
-
[
|
189 |
-
'label' => __( 'Action Button', '
|
190 |
-
]
|
191 |
-
);
|
192 |
-
|
193 |
-
$this->add_control(
|
194 |
-
'action_text',
|
195 |
-
[
|
196 |
-
'label' => __( 'Button Text', '
|
197 |
-
'type' => Controls_Manager::TEXT,
|
198 |
-
'placeholder' => __( 'Buy', '
|
199 |
-
'default' => __( 'Buy Now', '
|
200 |
-
]
|
201 |
-
);
|
202 |
-
|
203 |
-
$this->add_control(
|
204 |
-
'link',
|
205 |
-
[
|
206 |
-
'label' => __( 'Link to', '
|
207 |
-
'type' => Controls_Manager::URL,
|
208 |
-
'placeholder' => __( 'http://your-link.com', '
|
209 |
-
'separator' => 'before',
|
210 |
-
]
|
211 |
-
);
|
212 |
-
|
213 |
-
$this->add_control(
|
214 |
-
'icon',
|
215 |
-
[
|
216 |
-
'label' => __( 'Icon', '
|
217 |
-
'type' => Controls_Manager::ICON,
|
218 |
-
'label_block' => true,
|
219 |
-
'default' => 'fa fa-shopping-cart',
|
220 |
-
]
|
221 |
-
);
|
222 |
-
|
223 |
-
$this->add_control(
|
224 |
-
'icon_align',
|
225 |
-
[
|
226 |
-
'label' => __( 'Icon Position', '
|
227 |
-
'type' => Controls_Manager::SELECT,
|
228 |
-
'default' => 'left',
|
229 |
-
'options' => [
|
230 |
-
'left' => __( 'Before', '
|
231 |
-
'right' => __( 'After', '
|
232 |
-
],
|
233 |
-
'condition' => [
|
234 |
-
'icon!' => '',
|
235 |
-
]
|
236 |
-
]
|
237 |
-
);
|
238 |
-
|
239 |
-
$this->add_control(
|
240 |
-
'icon_indent',
|
241 |
-
[
|
242 |
-
'label' => __( 'Icon Spacing', '
|
243 |
-
'type' => Controls_Manager::SLIDER,
|
244 |
-
'range' => [
|
245 |
-
'px' => [
|
246 |
-
'max' => 50,
|
247 |
-
],
|
248 |
-
],
|
249 |
-
'condition' => [
|
250 |
-
'icon!' => '',
|
251 |
-
],
|
252 |
-
'selectors' => [
|
253 |
-
'{{WRAPPER}} .eae-pt-action-button .eae-pt-align-icon-right' => 'margin-left: {{SIZE}}{{UNIT}};',
|
254 |
-
'{{WRAPPER}} .eae-pt-action-button .eae-pt-align-icon-left' => 'margin-right: {{SIZE}}{{UNIT}};',
|
255 |
-
],
|
256 |
-
]
|
257 |
-
);
|
258 |
-
|
259 |
-
|
260 |
-
|
261 |
-
|
262 |
-
|
263 |
-
$this->end_controls_section();
|
264 |
-
|
265 |
-
|
266 |
-
$this->start_controls_section(
|
267 |
-
'section-box-style',
|
268 |
-
[
|
269 |
-
'label' => __( 'Box Style', '
|
270 |
-
'tab' => Controls_Manager::TAB_STYLE,
|
271 |
-
]
|
272 |
-
);
|
273 |
-
|
274 |
-
$this->add_control(
|
275 |
-
'box-color',
|
276 |
-
[
|
277 |
-
'label' => __( 'Box Color', '
|
278 |
-
'type' => Controls_Manager::COLOR,
|
279 |
-
'scheme' => [
|
280 |
-
'type' => Scheme_Color::get_type(),
|
281 |
-
'value' => Scheme_Color::COLOR_1,
|
282 |
-
],
|
283 |
-
'default' => '#93C64F',
|
284 |
-
'selectors' => [
|
285 |
-
'{{WRAPPER}} .wts-price-box-wrapper' => 'background-color: {{VALUE}};',
|
286 |
-
],
|
287 |
-
]
|
288 |
-
);
|
289 |
-
|
290 |
-
$this->add_group_control(
|
291 |
-
Group_Control_Border::get_type(),
|
292 |
-
[
|
293 |
-
'name' => 'box_border',
|
294 |
-
'label' => __( 'Box Border', '
|
295 |
-
'placeholder' => '1px',
|
296 |
-
'default' => '1px',
|
297 |
-
'selector' => '{{WRAPPER}} .wts-price-box-wrapper',
|
298 |
-
]
|
299 |
-
);
|
300 |
-
|
301 |
-
|
302 |
-
$this->add_control(
|
303 |
-
'box-border-radius',
|
304 |
-
[
|
305 |
-
'label' => __( 'Border Radius', '
|
306 |
-
'type' => Controls_Manager::DIMENSIONS,
|
307 |
-
'size_units' => [ 'px', '%' ],
|
308 |
-
'selectors' => [
|
309 |
-
'{{WRAPPER}} .wts-price-box-wrapper' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
310 |
-
'{{WRAPPER}} .wts-price-box-wrapper > div:first-child' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} 0 0;',
|
311 |
-
'{{WRAPPER}} .wts-price-box-wrapper > div:last-child' => 'border-radius: 0 0 {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
312 |
-
]
|
313 |
-
]
|
314 |
-
);
|
315 |
-
|
316 |
-
$this->add_group_control(
|
317 |
-
Group_Control_Box_Shadow::get_type(),
|
318 |
-
[
|
319 |
-
'name' => 'box_box_shadow',
|
320 |
-
'selector' => '{{WRAPPER}} .wts-price-box-wrapper',
|
321 |
-
]
|
322 |
-
);
|
323 |
-
|
324 |
-
|
325 |
-
|
326 |
-
$this->end_controls_section();
|
327 |
-
|
328 |
-
$this->start_controls_section(
|
329 |
-
'section-plan-heading-style',
|
330 |
-
[
|
331 |
-
'label' => __( 'Plan Heading', '
|
332 |
-
'tab' => Controls_Manager::TAB_STYLE,
|
333 |
-
]
|
334 |
-
);
|
335 |
-
|
336 |
-
$this->add_control(
|
337 |
-
'plan_heading_color',
|
338 |
-
[
|
339 |
-
'label' => __( 'Heading Color', '
|
340 |
-
'type' => Controls_Manager::COLOR,
|
341 |
-
'scheme' => [
|
342 |
-
'type' => Scheme_Color::get_type(),
|
343 |
-
'value' => Scheme_Color::COLOR_1,
|
344 |
-
],
|
345 |
-
'default' => '#FFF',
|
346 |
-
'selectors' => [
|
347 |
-
'{{WRAPPER}} .eae-pt-heading' => 'color: {{VALUE}};',
|
348 |
-
],
|
349 |
-
]
|
350 |
-
);
|
351 |
-
|
352 |
-
$this->add_group_control(
|
353 |
-
Group_Control_Typography::get_type(),
|
354 |
-
[
|
355 |
-
'name' => 'plan_heading_typography',
|
356 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
357 |
-
'selector' => '{{WRAPPER}} .eae-pt-heading',
|
358 |
-
]
|
359 |
-
);
|
360 |
-
|
361 |
-
$this->add_control(
|
362 |
-
'plan_sub_heading_color',
|
363 |
-
[
|
364 |
-
'label' => __( 'Sub Heading Color', '
|
365 |
-
'type' => Controls_Manager::COLOR,
|
366 |
-
'scheme' => [
|
367 |
-
'type' => Scheme_Color::get_type(),
|
368 |
-
'value' => Scheme_Color::COLOR_1,
|
369 |
-
],
|
370 |
-
'default' => '#FFF',
|
371 |
-
'selectors' => [
|
372 |
-
'{{WRAPPER}} .eae-pt-sub-heading' => 'color: {{VALUE}};',
|
373 |
-
],
|
374 |
-
]
|
375 |
-
);
|
376 |
-
|
377 |
-
$this->add_group_control(
|
378 |
-
Group_Control_Typography::get_type(),
|
379 |
-
[
|
380 |
-
'name' => 'plan_sub_heading_typography',
|
381 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
382 |
-
'selector' => '{{WRAPPER}} .eae-pt-sub-heading',
|
383 |
-
]
|
384 |
-
);
|
385 |
-
|
386 |
-
|
387 |
-
$this->add_group_control(
|
388 |
-
Group_Control_Background::get_type(),
|
389 |
-
[
|
390 |
-
'name' => 'heading_section_bg',
|
391 |
-
'label' => __( 'Section Background', '
|
392 |
-
'types' => [ 'classic','gradient' ],
|
393 |
-
'selector' => '{{WRAPPER}} .heading-wrapper',
|
394 |
-
]
|
395 |
-
);
|
396 |
-
|
397 |
-
$this->end_controls_section();
|
398 |
-
|
399 |
-
$this->start_controls_section(
|
400 |
-
'section-price-box',
|
401 |
-
[
|
402 |
-
'label' => __( 'Price Box', '
|
403 |
-
'tab' => Controls_Manager::TAB_STYLE,
|
404 |
-
]
|
405 |
-
);
|
406 |
-
|
407 |
-
$this->add_control(
|
408 |
-
'pb_content_settings',
|
409 |
-
[
|
410 |
-
'label' => __( 'Content Settings', '
|
411 |
-
'type' => Controls_Manager::HEADING,
|
412 |
-
'separator' => 'before',
|
413 |
-
]
|
414 |
-
);
|
415 |
-
|
416 |
-
$this->add_control(
|
417 |
-
'price_text_color',
|
418 |
-
[
|
419 |
-
'label' => __( 'Price Text Color', '
|
420 |
-
'type' => Controls_Manager::COLOR,
|
421 |
-
'scheme' => [
|
422 |
-
'type' => Scheme_Color::get_type(),
|
423 |
-
'value' => Scheme_Color::COLOR_1,
|
424 |
-
],
|
425 |
-
'default' => '#FFF',
|
426 |
-
'selectors' => [
|
427 |
-
'{{WRAPPER}} .plan-price-shape-inner .price-text' => 'color: {{VALUE}};',
|
428 |
-
],
|
429 |
-
]
|
430 |
-
);
|
431 |
-
|
432 |
-
$this->add_group_control(
|
433 |
-
Group_Control_Typography::get_type(),
|
434 |
-
[
|
435 |
-
'name' => 'price_text_typography',
|
436 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
437 |
-
'selector' => '{{WRAPPER}} .plan-price-shape-inner .price-text',
|
438 |
-
]
|
439 |
-
);
|
440 |
-
|
441 |
-
|
442 |
-
$this->add_control(
|
443 |
-
'price_sub_text_color',
|
444 |
-
[
|
445 |
-
'label' => __( 'Sub Text Color', '
|
446 |
-
'type' => Controls_Manager::COLOR,
|
447 |
-
'scheme' => [
|
448 |
-
'type' => Scheme_Color::get_type(),
|
449 |
-
'value' => Scheme_Color::COLOR_1,
|
450 |
-
],
|
451 |
-
'default' => '#FFF',
|
452 |
-
'selectors' => [
|
453 |
-
'{{WRAPPER}} .plan-price-shape-inner .price-subtext' => 'color: {{VALUE}};',
|
454 |
-
],
|
455 |
-
]
|
456 |
-
);
|
457 |
-
|
458 |
-
$this->add_group_control(
|
459 |
-
Group_Control_Typography::get_type(),
|
460 |
-
[
|
461 |
-
'name' => 'price_sub_text_typography',
|
462 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
463 |
-
'selector' => '{{WRAPPER}} .plan-price-shape-inner .price-subtext',
|
464 |
-
]
|
465 |
-
);
|
466 |
-
|
467 |
-
$this->add_control(
|
468 |
-
'pb_box_settings',
|
469 |
-
[
|
470 |
-
'label' => __( 'Box Settings', '
|
471 |
-
'type' => Controls_Manager::HEADING,
|
472 |
-
'separator' => 'before',
|
473 |
-
]
|
474 |
-
);
|
475 |
-
|
476 |
-
$this->add_group_control(
|
477 |
-
Group_Control_Border::get_type(),
|
478 |
-
[
|
479 |
-
'name' => 'price_box_border',
|
480 |
-
'label' => __( 'Price Box Border', '
|
481 |
-
'selector' => '{{WRAPPER}} .plan-price-shape',
|
482 |
-
]
|
483 |
-
);
|
484 |
-
|
485 |
-
$this->add_control(
|
486 |
-
'price_box_border_radius',
|
487 |
-
[
|
488 |
-
'label' => __( 'Border Radius', '
|
489 |
-
'type' => Controls_Manager::DIMENSIONS,
|
490 |
-
'size_units' => [ 'px', '%' ],
|
491 |
-
'selectors' => [
|
492 |
-
'{{WRAPPER}} .plan-price-shape' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
|
493 |
-
],
|
494 |
-
]
|
495 |
-
);
|
496 |
-
|
497 |
-
$this->add_responsive_control(
|
498 |
-
'price_box_padding',
|
499 |
-
[
|
500 |
-
'label' => __( 'Price Box Padding', '
|
501 |
-
'type' => Controls_Manager::DIMENSIONS,
|
502 |
-
'size_units' => [ 'px', 'em', '%' ],
|
503 |
-
'selectors' => [
|
504 |
-
'{{WRAPPER}} .plan-price-shape-inner' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
505 |
-
],
|
506 |
-
]
|
507 |
-
);
|
508 |
-
|
509 |
-
|
510 |
-
$this->add_group_control(
|
511 |
-
Group_Control_Background::get_type(),
|
512 |
-
[
|
513 |
-
'name' => 'price_box_section_bg',
|
514 |
-
'label' => __( 'Section Background', '
|
515 |
-
'types' => [ 'classic' ,'gradient'],
|
516 |
-
'selector' => '{{WRAPPER}} .plan-price-block',
|
517 |
-
]
|
518 |
-
);
|
519 |
-
|
520 |
-
|
521 |
-
$this->end_controls_section();
|
522 |
-
|
523 |
-
$this->start_controls_section(
|
524 |
-
'section-features-style',
|
525 |
-
[
|
526 |
-
'label' => __( 'Feature List', '
|
527 |
-
'tab' => Controls_Manager::TAB_STYLE,
|
528 |
-
]
|
529 |
-
);
|
530 |
-
|
531 |
-
$this->add_control(
|
532 |
-
'features_text_color',
|
533 |
-
[
|
534 |
-
'label' => __( 'Features Color', '
|
535 |
-
'type' => Controls_Manager::COLOR,
|
536 |
-
'scheme' => [
|
537 |
-
'type' => Scheme_Color::get_type(),
|
538 |
-
'value' => Scheme_Color::COLOR_1,
|
539 |
-
],
|
540 |
-
'default' => '#FFF',
|
541 |
-
'selectors' => [
|
542 |
-
'{{WRAPPER}} .eae-pt-feature-list li' => 'color: {{VALUE}};',
|
543 |
-
],
|
544 |
-
]
|
545 |
-
);
|
546 |
-
|
547 |
-
$this->add_group_control(
|
548 |
-
Group_Control_Typography::get_type(),
|
549 |
-
[
|
550 |
-
'name' => 'features_typography',
|
551 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
552 |
-
'selector' => '{{WRAPPER}} .eae-pt-feature-list li',
|
553 |
-
]
|
554 |
-
);
|
555 |
-
|
556 |
-
|
557 |
-
$this->add_group_control(
|
558 |
-
Group_Control_Background::get_type(),
|
559 |
-
[
|
560 |
-
'name' => 'feature_section_bg',
|
561 |
-
'label' => __( 'Section Background', '
|
562 |
-
'types' => [ 'classic','gradient' ],
|
563 |
-
'selector' => '{{WRAPPER}} .plan-features-wrapper',
|
564 |
-
]
|
565 |
-
);
|
566 |
-
|
567 |
-
$this->add_responsive_control(
|
568 |
-
'feature_align',
|
569 |
-
[
|
570 |
-
'label' => __( 'Alignment', '
|
571 |
-
'type' => Controls_Manager::CHOOSE,
|
572 |
-
'options' => [
|
573 |
-
'left' => [
|
574 |
-
'title' => __( 'Left', '
|
575 |
-
'icon' => 'fa fa-align-left',
|
576 |
-
],
|
577 |
-
'center' => [
|
578 |
-
'title' => __( 'Center', '
|
579 |
-
'icon' => 'fa fa-align-center',
|
580 |
-
],
|
581 |
-
'right' => [
|
582 |
-
'title' => __( 'Right', '
|
583 |
-
'icon' => 'fa fa-align-right',
|
584 |
-
]
|
585 |
-
],
|
586 |
-
'default' => 'center',
|
587 |
-
'selectors' => [
|
588 |
-
'{{WRAPPER}} .plan-features-wrapper .eae-pt-feature-list' => 'text-align: {{VALUE}};',
|
589 |
-
]
|
590 |
-
]
|
591 |
-
);
|
592 |
-
|
593 |
-
$this->end_controls_section();
|
594 |
-
|
595 |
-
$this->start_controls_section(
|
596 |
-
'section-action-button',
|
597 |
-
[
|
598 |
-
'label' => __( 'Action Button', '
|
599 |
-
'tab' => Controls_Manager::TAB_STYLE,
|
600 |
-
]
|
601 |
-
);
|
602 |
-
|
603 |
-
$this->add_control(
|
604 |
-
'button-section-bg',
|
605 |
-
[
|
606 |
-
'label' => __( 'Section Background', '
|
607 |
-
'type' => Controls_Manager::COLOR,
|
608 |
-
'scheme' => [
|
609 |
-
'type' => Scheme_Color::get_type(),
|
610 |
-
'value' => Scheme_Color::COLOR_1,
|
611 |
-
],
|
612 |
-
'default' => '#333333',
|
613 |
-
'selectors' => [
|
614 |
-
'{{WRAPPER}} .eae-pt-button-wrapper' => 'background-color: {{VALUE}};',
|
615 |
-
],
|
616 |
-
]
|
617 |
-
);
|
618 |
-
|
619 |
-
$this->add_control(
|
620 |
-
'button_text_color',
|
621 |
-
[
|
622 |
-
'label' => __( 'Text Color', '
|
623 |
-
'type' => Controls_Manager::COLOR,
|
624 |
-
'default' => '#fff',
|
625 |
-
'selectors' => [
|
626 |
-
'{{WRAPPER}} .eae-pt-action-button' => 'color: {{VALUE}};',
|
627 |
-
],
|
628 |
-
]
|
629 |
-
);
|
630 |
-
|
631 |
-
$this->add_group_control(
|
632 |
-
Group_Control_Typography::get_type(),
|
633 |
-
[
|
634 |
-
'name' => 'typography',
|
635 |
-
'label' => __( 'Typography', '
|
636 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
637 |
-
'selector' => '{{WRAPPER}} .eae-pt-action-button',
|
638 |
-
]
|
639 |
-
);
|
640 |
-
|
641 |
-
$this->add_control(
|
642 |
-
'background_color',
|
643 |
-
[
|
644 |
-
'label' => __( 'Background Color', '
|
645 |
-
'type' => Controls_Manager::COLOR,
|
646 |
-
'scheme' => [
|
647 |
-
'type' => Scheme_Color::get_type(),
|
648 |
-
'value' => Scheme_Color::COLOR_4,
|
649 |
-
],
|
650 |
-
'default' => '#93C64F',
|
651 |
-
'selectors' => [
|
652 |
-
'{{WRAPPER}} .eae-pt-action-button' => 'background-color: {{VALUE}};',
|
653 |
-
],
|
654 |
-
]
|
655 |
-
);
|
656 |
-
|
657 |
-
$this->add_group_control(
|
658 |
-
Group_Control_Background::get_type(),
|
659 |
-
[
|
660 |
-
'name' => 'action_section_bg',
|
661 |
-
'label' => __( 'Section Background', '
|
662 |
-
'types' => [ 'classic','gradient' ],
|
663 |
-
'selector' => '{{WRAPPER}} .eae-pt-button-wrapper',
|
664 |
-
'default' => [
|
665 |
-
'background' => 'classic',
|
666 |
-
'color' => '#555'
|
667 |
-
]
|
668 |
-
]
|
669 |
-
);
|
670 |
-
|
671 |
-
$this->add_group_control(
|
672 |
-
Group_Control_Border::get_type(),
|
673 |
-
[
|
674 |
-
'name' => 'border',
|
675 |
-
'label' => __( 'Border', '
|
676 |
-
'placeholder' => '1px',
|
677 |
-
'default' => '1px',
|
678 |
-
'selector' => '{{WRAPPER}} .eae-pt-action-button',
|
679 |
-
]
|
680 |
-
);
|
681 |
-
|
682 |
-
$this->add_control(
|
683 |
-
'border_radius',
|
684 |
-
[
|
685 |
-
'label' => __( 'Border Radius', '
|
686 |
-
'type' => Controls_Manager::DIMENSIONS,
|
687 |
-
'size_units' => [ 'px', '%' ],
|
688 |
-
'selectors' => [
|
689 |
-
'{{WRAPPER}} .eae-pt-action-button' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
690 |
-
],
|
691 |
-
]
|
692 |
-
);
|
693 |
-
|
694 |
-
$this->add_control(
|
695 |
-
'text_padding',
|
696 |
-
[
|
697 |
-
'label' => __( 'Text Padding', '
|
698 |
-
'type' => Controls_Manager::DIMENSIONS,
|
699 |
-
'size_units' => [ 'px', 'em', '%' ],
|
700 |
-
'selectors' => [
|
701 |
-
'{{WRAPPER}} .eae-pt-action-button' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
702 |
-
],
|
703 |
-
]
|
704 |
-
);
|
705 |
-
|
706 |
-
$this->end_controls_section();
|
707 |
-
|
708 |
-
$this->start_controls_section(
|
709 |
-
'section_hover',
|
710 |
-
[
|
711 |
-
'label' => __( 'Button Hover', '
|
712 |
-
'type' => Controls_Manager::SECTION,
|
713 |
-
'tab' => Controls_Manager::TAB_STYLE,
|
714 |
-
]
|
715 |
-
);
|
716 |
-
|
717 |
-
$this->add_control(
|
718 |
-
'hover_color',
|
719 |
-
[
|
720 |
-
'label' => __( 'Text Color', '
|
721 |
-
'type' => Controls_Manager::COLOR,
|
722 |
-
'selectors' => [
|
723 |
-
'{{WRAPPER}} .eae-pt-action-button:hover' => 'color: {{VALUE}};',
|
724 |
-
],
|
725 |
-
]
|
726 |
-
);
|
727 |
-
|
728 |
-
$this->add_control(
|
729 |
-
'button_background_hover_color',
|
730 |
-
[
|
731 |
-
'label' => __( 'Background Color', '
|
732 |
-
'type' => Controls_Manager::COLOR,
|
733 |
-
'selectors' => [
|
734 |
-
'{{WRAPPER}} .eae-pt-action-button:hover' => 'background-color: {{VALUE}};',
|
735 |
-
],
|
736 |
-
]
|
737 |
-
);
|
738 |
-
|
739 |
-
$this->add_control(
|
740 |
-
'button_hover_border_color',
|
741 |
-
[
|
742 |
-
'label' => __( 'Border Color', '
|
743 |
-
'type' => Controls_Manager::COLOR,
|
744 |
-
'condition' => [
|
745 |
-
'border_border!' => '',
|
746 |
-
],
|
747 |
-
'selectors' => [
|
748 |
-
'{{WRAPPER}} .eae-pt-action-button:hover' => 'border-color: {{VALUE}};',
|
749 |
-
],
|
750 |
-
]
|
751 |
-
);
|
752 |
-
|
753 |
-
$this->end_controls_section();
|
754 |
-
|
755 |
-
|
756 |
-
|
757 |
-
|
758 |
-
|
759 |
-
}
|
760 |
-
|
761 |
-
protected function render( ) {
|
762 |
-
$settings = $this->get_settings();
|
763 |
-
|
764 |
-
$this->add_render_attribute('heading','class','eae-pt-heading');
|
765 |
-
$this->add_render_attribute('sub_heading','class','eae-pt-sub-heading');
|
766 |
-
$this->add_render_attribute('button','class','eae-pt-action-button');
|
767 |
-
$this->add_render_attribute( 'icon-align', 'class', 'eae-pt-align-icon-' . $settings['icon_align'] );
|
768 |
-
|
769 |
-
if ( ! empty( $settings['link']['url'] ) ) {
|
770 |
-
$this->add_render_attribute( 'button', 'href', $settings['link']['url'] );
|
771 |
-
|
772 |
-
if ( ! empty( $settings['link']['is_external'] ) ) {
|
773 |
-
$this->add_render_attribute( 'button', 'target', '_blank' );
|
774 |
-
}
|
775 |
-
}
|
776 |
-
|
777 |
-
|
778 |
-
?>
|
779 |
-
<div class="wts-price-box-wrapper">
|
780 |
-
<?php
|
781 |
-
if(!empty($settings['heading']) || !empty($settings['heading'])) {
|
782 |
-
?>
|
783 |
-
<div class="heading-wrapper">
|
784 |
-
<?php if(!empty($settings['heading'])){
|
785 |
-
?>
|
786 |
-
<<?php echo $settings['heading_tag']; ?> <?php echo $this->get_render_attribute_string('heading'); ?>>
|
787 |
-
<?php echo $settings['heading']; ?>
|
788 |
-
</<?php echo $settings['heading_tag'] ?>>
|
789 |
-
<?php
|
790 |
-
} ?>
|
791 |
-
|
792 |
-
<?php if(!empty($settings['sub-heading'])){
|
793 |
-
?>
|
794 |
-
<<?php echo $settings['sub_heading_tag']; ?> <?php echo $this->get_render_attribute_string('sub_heading'); ?>>
|
795 |
-
<?php echo $settings['sub-heading']; ?>
|
796 |
-
</<?php echo $settings['sub_heading_tag'] ?>>
|
797 |
-
<?php
|
798 |
-
} ?>
|
799 |
-
</div>
|
800 |
-
<?php
|
801 |
-
}
|
802 |
-
|
803 |
-
if(!empty($settings['price-box-text']) || !empty($settings['price-box-subtext'])){
|
804 |
-
?>
|
805 |
-
<div class="plan-price-block">
|
806 |
-
<div class="plan-price-shape">
|
807 |
-
<div class="plan-price-shape-inner">
|
808 |
-
<?php if(!empty($settings['price-box-text'])){ ?>
|
809 |
-
<span class="price-text"><?php echo $settings['price-box-text']; ?></span>
|
810 |
-
<?php } ?>
|
811 |
-
|
812 |
-
<?php if(!empty($settings['price-box-subtext'])){ ?>
|
813 |
-
<span class="price-subtext"><?php echo $settings['price-box-subtext']; ?></span>
|
814 |
-
<?php } ?>
|
815 |
-
</div>
|
816 |
-
</div>
|
817 |
-
</div>
|
818 |
-
|
819 |
-
<?php
|
820 |
-
}
|
821 |
-
|
822 |
-
if(count($settings['feature-list'])){
|
823 |
-
?>
|
824 |
-
<div class="plan-features-wrapper">
|
825 |
-
<ul class="eae-pt-feature-list">
|
826 |
-
<?php
|
827 |
-
foreach($settings['feature-list'] as $feature){
|
828 |
-
?>
|
829 |
-
<li class="<?php echo ($feature['available'] == 'yes')? '':'strike-feature'; ?>"><?php echo $feature['text']; ?></li>
|
830 |
-
<?php
|
831 |
-
}
|
832 |
-
?>
|
833 |
-
</ul>
|
834 |
-
</div>
|
835 |
-
<?php
|
836 |
-
}
|
837 |
-
|
838 |
-
if(!empty($settings['action_text'])){
|
839 |
-
?>
|
840 |
-
<div class="eae-pt-button-wrapper">
|
841 |
-
<a <?php echo $this->get_render_attribute_string( 'button' ); ?>>
|
842 |
-
<span <?php echo $this->get_render_attribute_string( 'content-wrapper' ); ?>>
|
843 |
-
<?php if ( ! empty( $settings['icon'] ) ) : ?>
|
844 |
-
<span <?php echo $this->get_render_attribute_string( 'icon-align' ); ?>>
|
845 |
-
<i class="<?php echo esc_attr( $settings['icon'] ); ?>"></i>
|
846 |
-
</span>
|
847 |
-
<?php endif; ?>
|
848 |
-
<span class="elementor-button-text"><?php echo $settings['action_text']; ?></span>
|
849 |
-
</span>
|
850 |
-
</a>
|
851 |
-
</div>
|
852 |
-
<?php
|
853 |
-
}
|
854 |
-
?>
|
855 |
-
</div> <!-- close .wts-price-box-wrapper -->
|
856 |
-
<?php
|
857 |
-
}
|
858 |
-
|
859 |
-
protected function content_template() {
|
860 |
-
?>
|
861 |
-
<#
|
862 |
-
|
863 |
-
box_html = '';
|
864 |
-
|
865 |
-
print( separator_html );
|
866 |
-
#>
|
867 |
-
<?php
|
868 |
-
}
|
869 |
-
}
|
870 |
Plugin::instance()->widgets_manager->register_widget_type( new Widget_PriceTable() );
|
1 |
+
<?php
|
2 |
+
namespace Elementor;
|
3 |
+
|
4 |
+
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
5 |
+
|
6 |
+
class Widget_PriceTable extends Widget_Base {
|
7 |
+
|
8 |
+
public function get_name() {
|
9 |
+
return 'wts-pricetable';
|
10 |
+
}
|
11 |
+
|
12 |
+
public function get_title() {
|
13 |
+
return __( 'EAE - Price Table', 'wts-eae' );
|
14 |
+
}
|
15 |
+
|
16 |
+
public function get_icon() {
|
17 |
+
return 'eicon-price-table wts-eae-pe';
|
18 |
+
}
|
19 |
+
|
20 |
+
public function get_categories() {
|
21 |
+
return [ 'wts-eae' ];
|
22 |
+
}
|
23 |
+
|
24 |
+
|
25 |
+
protected function _register_controls() {
|
26 |
+
$this->start_controls_section(
|
27 |
+
'section_title',
|
28 |
+
[
|
29 |
+
'label' => __( 'Plan Heading', 'wts-eae' )
|
30 |
+
]
|
31 |
+
);
|
32 |
+
|
33 |
+
$this->add_control(
|
34 |
+
'heading',
|
35 |
+
[
|
36 |
+
'label' => __( 'Heading', 'wts-eae' ),
|
37 |
+
'type' => Controls_Manager::TEXT,
|
38 |
+
'placeholder' => __( 'Enter plan name', 'wts-eae' ),
|
39 |
+
'default' => __( 'Plan 1', 'wts-eae' ),
|
40 |
+
]
|
41 |
+
);
|
42 |
+
|
43 |
+
$this->add_control(
|
44 |
+
'heading_tag',
|
45 |
+
[
|
46 |
+
'label' => __( 'Heading HTML Tag', 'wts-eae' ),
|
47 |
+
'type' => Controls_Manager::SELECT,
|
48 |
+
'options' => [
|
49 |
+
'h1' => __( 'H1', 'wts-eae' ),
|
50 |
+
'h2' => __( 'H2', 'wts-eae' ),
|
51 |
+
'h3' => __( 'H3', 'wts-eae' ),
|
52 |
+
'h4' => __( 'H4', 'wts-eae' ),
|
53 |
+
'h5' => __( 'H5', 'wts-eae' ),
|
54 |
+
'h6' => __( 'H6', 'wts-eae' )
|
55 |
+
],
|
56 |
+
'default' => 'h2',
|
57 |
+
]
|
58 |
+
);
|
59 |
+
|
60 |
+
|
61 |
+
$this->add_control(
|
62 |
+
'sub-heading',
|
63 |
+
[
|
64 |
+
'label' => __( 'Sub Heading', 'wts-eae' ),
|
65 |
+
'type' => Controls_Manager::TEXT,
|
66 |
+
'placeholder' => __( 'Enter plan name', 'wts-eae' ),
|
67 |
+
'default' => __( 'Plan 1', 'wts-eae' ),
|
68 |
+
]
|
69 |
+
);
|
70 |
+
|
71 |
+
$this->add_control(
|
72 |
+
'sub_heading_tag',
|
73 |
+
[
|
74 |
+
'label' => __( 'Sub Heading HTML Tag', 'wts-eae' ),
|
75 |
+
'type' => Controls_Manager::SELECT,
|
76 |
+
'options' => [
|
77 |
+
'h1' => __( 'H1', 'wts-eae' ),
|
78 |
+
'h2' => __( 'H2', 'wts-eae' ),
|
79 |
+
'h3' => __( 'H3', 'wts-eae' ),
|
80 |
+
'h4' => __( 'H4', 'wts-eae' ),
|
81 |
+
'h5' => __( 'H5', 'wts-eae' ),
|
82 |
+
'h6' => __( 'H6', 'wts-eae' ),
|
83 |
+
'p' => __( 'P', 'wts-eae' )
|
84 |
+
],
|
85 |
+
'default' => 'h3',
|
86 |
+
]
|
87 |
+
);
|
88 |
+
|
89 |
+
$this->end_controls_section();
|
90 |
+
|
91 |
+
$this->start_controls_section(
|
92 |
+
'section_price_box',
|
93 |
+
[
|
94 |
+
'label' => __( 'Price Box', 'wts-eae' )
|
95 |
+
]
|
96 |
+
);
|
97 |
+
|
98 |
+
|
99 |
+
$this->add_control(
|
100 |
+
'price-box-text',
|
101 |
+
[
|
102 |
+
'label' => __( 'Price Box Text', 'wts-eae' ),
|
103 |
+
'type' => Controls_Manager::TEXT,
|
104 |
+
'placeholder' => __( '$100', 'wts-eae' ),
|
105 |
+
'default' => __( '$100', 'wts-eae' ),
|
106 |
+
]
|
107 |
+
);
|
108 |
+
|
109 |
+
|
110 |
+
$this->add_control(
|
111 |
+
'price-box-subtext',
|
112 |
+
[
|
113 |
+
'label' => __( 'Price Box Sub Text', 'wts-eae' ),
|
114 |
+
'type' => Controls_Manager::TEXT,
|
115 |
+
'placeholder' => __( 'per month', 'wts-eae' ),
|
116 |
+
'default' => __( 'per month', 'wts-eae' ),
|
117 |
+
]
|
118 |
+
);
|
119 |
+
|
120 |
+
$this->add_control(
|
121 |
+
'shape',
|
122 |
+
[
|
123 |
+
'label' => __( 'Shape', 'wts-eae' ),
|
124 |
+
'type' => Controls_Manager::SELECT,
|
125 |
+
'options' => [
|
126 |
+
'none' => __( 'None', 'wts-eae' ),
|
127 |
+
'circle' => __( 'Circle', 'wts-eae' ),
|
128 |
+
'square' => __( 'Square', 'wts-eae' ),
|
129 |
+
],
|
130 |
+
'default' => 'circle',
|
131 |
+
'prefix_class' => 'eae-pt-price-box-shape-',
|
132 |
+
]
|
133 |
+
);
|
134 |
+
|
135 |
+
$this->end_controls_section();
|
136 |
+
|
137 |
+
$this->start_controls_section(
|
138 |
+
'section_features',
|
139 |
+
[
|
140 |
+
'label' => __( 'Features', 'wts-eae' )
|
141 |
+
]
|
142 |
+
);
|
143 |
+
|
144 |
+
$this->add_control(
|
145 |
+
'feature-list',
|
146 |
+
[
|
147 |
+
'label' => __( 'Plan Features', 'wts-eae' ),
|
148 |
+
'type' => Controls_Manager::REPEATER,
|
149 |
+
'default' => [
|
150 |
+
[
|
151 |
+
'text' => __( 'List Item #1', 'wts-eae' ),
|
152 |
+
'available' => 'yes'
|
153 |
+
],
|
154 |
+
[
|
155 |
+
'text' => __( 'List Item #2', 'wts-eae' ),
|
156 |
+
'available' => 'yes'
|
157 |
+
],
|
158 |
+
[
|
159 |
+
'text' => __( 'List Item #3', 'wts-eae' ),
|
160 |
+
'available' => 'yes'
|
161 |
+
],
|
162 |
+
],
|
163 |
+
'fields' => [
|
164 |
+
[
|
165 |
+
'name' => 'text',
|
166 |
+
'label' => __( 'Text', 'wts-eae' ),
|
167 |
+
'type' => Controls_Manager::TEXT,
|
168 |
+
'label_block' => true,
|
169 |
+
'placeholder' => __( 'Plan Features', 'wts-eae' ),
|
170 |
+
'default' => __( 'Feature 1', 'wts-eae' ),
|
171 |
+
],
|
172 |
+
[
|
173 |
+
'name' => 'available',
|
174 |
+
'label' => __( 'Included', 'wts-eae' ),
|
175 |
+
'type' => Controls_Manager::SWITCHER,
|
176 |
+
'label_block' => true,
|
177 |
+
'default' => 'yes'
|
178 |
+
]
|
179 |
+
],
|
180 |
+
'title_field' => '{{{ text }}}'
|
181 |
+
]
|
182 |
+
);
|
183 |
+
|
184 |
+
$this->end_controls_section();
|
185 |
+
|
186 |
+
$this->start_controls_section(
|
187 |
+
'section_action_button',
|
188 |
+
[
|
189 |
+
'label' => __( 'Action Button', 'wts-eae' )
|
190 |
+
]
|
191 |
+
);
|
192 |
+
|
193 |
+
$this->add_control(
|
194 |
+
'action_text',
|
195 |
+
[
|
196 |
+
'label' => __( 'Button Text', 'wts-eae' ),
|
197 |
+
'type' => Controls_Manager::TEXT,
|
198 |
+
'placeholder' => __( 'Buy', 'wts-eae' ),
|
199 |
+
'default' => __( 'Buy Now', 'wts-eae' ),
|
200 |
+
]
|
201 |
+
);
|
202 |
+
|
203 |
+
$this->add_control(
|
204 |
+
'link',
|
205 |
+
[
|
206 |
+
'label' => __( 'Link to', 'wts-eae' ),
|
207 |
+
'type' => Controls_Manager::URL,
|
208 |
+
'placeholder' => __( 'http://your-link.com', 'wts-eae' ),
|
209 |
+
'separator' => 'before',
|
210 |
+
]
|
211 |
+
);
|
212 |
+
|
213 |
+
$this->add_control(
|
214 |
+
'icon',
|
215 |
+
[
|
216 |
+
'label' => __( 'Icon', 'wts-eae' ),
|
217 |
+
'type' => Controls_Manager::ICON,
|
218 |
+
'label_block' => true,
|
219 |
+
'default' => 'fa fa-shopping-cart',
|
220 |
+
]
|
221 |
+
);
|
222 |
+
|
223 |
+
$this->add_control(
|
224 |
+
'icon_align',
|
225 |
+
[
|
226 |
+
'label' => __( 'Icon Position', 'wts-eae' ),
|
227 |
+
'type' => Controls_Manager::SELECT,
|
228 |
+
'default' => 'left',
|
229 |
+
'options' => [
|
230 |
+
'left' => __( 'Before', 'wts-eae' ),
|
231 |
+
'right' => __( 'After', 'wts-eae' ),
|
232 |
+
],
|
233 |
+
'condition' => [
|
234 |
+
'icon!' => '',
|
235 |
+
]
|
236 |
+
]
|
237 |
+
);
|
238 |
+
|
239 |
+
$this->add_control(
|
240 |
+
'icon_indent',
|
241 |
+
[
|
242 |
+
'label' => __( 'Icon Spacing', 'wts-eae' ),
|
243 |
+
'type' => Controls_Manager::SLIDER,
|
244 |
+
'range' => [
|
245 |
+
'px' => [
|
246 |
+
'max' => 50,
|
247 |
+
],
|
248 |
+
],
|
249 |
+
'condition' => [
|
250 |
+
'icon!' => '',
|
251 |
+
],
|
252 |
+
'selectors' => [
|
253 |
+
'{{WRAPPER}} .eae-pt-action-button .eae-pt-align-icon-right' => 'margin-left: {{SIZE}}{{UNIT}};',
|
254 |
+
'{{WRAPPER}} .eae-pt-action-button .eae-pt-align-icon-left' => 'margin-right: {{SIZE}}{{UNIT}};',
|
255 |
+
],
|
256 |
+
]
|
257 |
+
);
|
258 |
+
|
259 |
+
|
260 |
+
|
261 |
+
|
262 |
+
|
263 |
+
$this->end_controls_section();
|
264 |
+
|
265 |
+
|
266 |
+
$this->start_controls_section(
|
267 |
+
'section-box-style',
|
268 |
+
[
|
269 |
+
'label' => __( 'Box Style', 'wts-eae' ),
|
270 |
+
'tab' => Controls_Manager::TAB_STYLE,
|
271 |
+
]
|
272 |
+
);
|
273 |
+
|
274 |
+
$this->add_control(
|
275 |
+
'box-color',
|
276 |
+
[
|
277 |
+
'label' => __( 'Box Color', 'wts-eae' ),
|
278 |
+
'type' => Controls_Manager::COLOR,
|
279 |
+
'scheme' => [
|
280 |
+
'type' => Scheme_Color::get_type(),
|
281 |
+
'value' => Scheme_Color::COLOR_1,
|
282 |
+
],
|
283 |
+
'default' => '#93C64F',
|
284 |
+
'selectors' => [
|
285 |
+
'{{WRAPPER}} .wts-price-box-wrapper' => 'background-color: {{VALUE}};',
|
286 |
+
],
|
287 |
+
]
|
288 |
+
);
|
289 |
+
|
290 |
+
$this->add_group_control(
|
291 |
+
Group_Control_Border::get_type(),
|
292 |
+
[
|
293 |
+
'name' => 'box_border',
|
294 |
+
'label' => __( 'Box Border', 'wts-eae' ),
|
295 |
+
'placeholder' => '1px',
|
296 |
+
'default' => '1px',
|
297 |
+
'selector' => '{{WRAPPER}} .wts-price-box-wrapper',
|
298 |
+
]
|
299 |
+
);
|
300 |
+
|
301 |
+
|
302 |
+
$this->add_control(
|
303 |
+
'box-border-radius',
|
304 |
+
[
|
305 |
+
'label' => __( 'Border Radius', 'wts-eae' ),
|
306 |
+
'type' => Controls_Manager::DIMENSIONS,
|
307 |
+
'size_units' => [ 'px', '%' ],
|
308 |
+
'selectors' => [
|
309 |
+
'{{WRAPPER}} .wts-price-box-wrapper' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
310 |
+
'{{WRAPPER}} .wts-price-box-wrapper > div:first-child' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} 0 0;',
|
311 |
+
'{{WRAPPER}} .wts-price-box-wrapper > div:last-child' => 'border-radius: 0 0 {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
312 |
+
]
|
313 |
+
]
|
314 |
+
);
|
315 |
+
|
316 |
+
$this->add_group_control(
|
317 |
+
Group_Control_Box_Shadow::get_type(),
|
318 |
+
[
|
319 |
+
'name' => 'box_box_shadow',
|
320 |
+
'selector' => '{{WRAPPER}} .wts-price-box-wrapper',
|
321 |
+
]
|
322 |
+
);
|
323 |
+
|
324 |
+
|
325 |
+
|
326 |
+
$this->end_controls_section();
|
327 |
+
|
328 |
+
$this->start_controls_section(
|
329 |
+
'section-plan-heading-style',
|
330 |
+
[
|
331 |
+
'label' => __( 'Plan Heading', 'wts-eae' ),
|
332 |
+
'tab' => Controls_Manager::TAB_STYLE,
|
333 |
+
]
|
334 |
+
);
|
335 |
+
|
336 |
+
$this->add_control(
|
337 |
+
'plan_heading_color',
|
338 |
+
[
|
339 |
+
'label' => __( 'Heading Color', 'wts-eae' ),
|
340 |
+
'type' => Controls_Manager::COLOR,
|
341 |
+
'scheme' => [
|
342 |
+
'type' => Scheme_Color::get_type(),
|
343 |
+
'value' => Scheme_Color::COLOR_1,
|
344 |
+
],
|
345 |
+
'default' => '#FFF',
|
346 |
+
'selectors' => [
|
347 |
+
'{{WRAPPER}} .eae-pt-heading' => 'color: {{VALUE}};',
|
348 |
+
],
|
349 |
+
]
|
350 |
+
);
|
351 |
+
|
352 |
+
$this->add_group_control(
|
353 |
+
Group_Control_Typography::get_type(),
|
354 |
+
[
|
355 |
+
'name' => 'plan_heading_typography',
|
356 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
357 |
+
'selector' => '{{WRAPPER}} .eae-pt-heading',
|
358 |
+
]
|
359 |
+
);
|
360 |
+
|
361 |
+
$this->add_control(
|
362 |
+
'plan_sub_heading_color',
|
363 |
+
[
|
364 |
+
'label' => __( 'Sub Heading Color', 'wts-eae' ),
|
365 |
+
'type' => Controls_Manager::COLOR,
|
366 |
+
'scheme' => [
|
367 |
+
'type' => Scheme_Color::get_type(),
|
368 |
+
'value' => Scheme_Color::COLOR_1,
|
369 |
+
],
|
370 |
+
'default' => '#FFF',
|
371 |
+
'selectors' => [
|
372 |
+
'{{WRAPPER}} .eae-pt-sub-heading' => 'color: {{VALUE}};',
|
373 |
+
],
|
374 |
+
]
|
375 |
+
);
|
376 |
+
|
377 |
+
$this->add_group_control(
|
378 |
+
Group_Control_Typography::get_type(),
|
379 |
+
[
|
380 |
+
'name' => 'plan_sub_heading_typography',
|
381 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
382 |
+
'selector' => '{{WRAPPER}} .eae-pt-sub-heading',
|
383 |
+
]
|
384 |
+
);
|
385 |
+
|
386 |
+
|
387 |
+
$this->add_group_control(
|
388 |
+
Group_Control_Background::get_type(),
|
389 |
+
[
|
390 |
+
'name' => 'heading_section_bg',
|
391 |
+
'label' => __( 'Section Background', 'wts-eae' ),
|
392 |
+
'types' => [ 'classic','gradient' ],
|
393 |
+
'selector' => '{{WRAPPER}} .heading-wrapper',
|
394 |
+
]
|
395 |
+
);
|
396 |
+
|
397 |
+
$this->end_controls_section();
|
398 |
+
|
399 |
+
$this->start_controls_section(
|
400 |
+
'section-price-box',
|
401 |
+
[
|
402 |
+
'label' => __( 'Price Box', 'wts-eae' ),
|
403 |
+
'tab' => Controls_Manager::TAB_STYLE,
|
404 |
+
]
|
405 |
+
);
|
406 |
+
|
407 |
+
$this->add_control(
|
408 |
+
'pb_content_settings',
|
409 |
+
[
|
410 |
+
'label' => __( 'Content Settings', 'wts-eae' ),
|
411 |
+
'type' => Controls_Manager::HEADING,
|
412 |
+
'separator' => 'before',
|
413 |
+
]
|
414 |
+
);
|
415 |
+
|
416 |
+
$this->add_control(
|
417 |
+
'price_text_color',
|
418 |
+
[
|
419 |
+
'label' => __( 'Price Text Color', 'wts-eae' ),
|
420 |
+
'type' => Controls_Manager::COLOR,
|
421 |
+
'scheme' => [
|
422 |
+
'type' => Scheme_Color::get_type(),
|
423 |
+
'value' => Scheme_Color::COLOR_1,
|
424 |
+
],
|
425 |
+
'default' => '#FFF',
|
426 |
+
'selectors' => [
|
427 |
+
'{{WRAPPER}} .plan-price-shape-inner .price-text' => 'color: {{VALUE}};',
|
428 |
+
],
|
429 |
+
]
|
430 |
+
);
|
431 |
+
|
432 |
+
$this->add_group_control(
|
433 |
+
Group_Control_Typography::get_type(),
|
434 |
+
[
|
435 |
+
'name' => 'price_text_typography',
|
436 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
437 |
+
'selector' => '{{WRAPPER}} .plan-price-shape-inner .price-text',
|
438 |
+
]
|
439 |
+
);
|
440 |
+
|
441 |
+
|
442 |
+
$this->add_control(
|
443 |
+
'price_sub_text_color',
|
444 |
+
[
|
445 |
+
'label' => __( 'Sub Text Color', 'wts-eae' ),
|
446 |
+
'type' => Controls_Manager::COLOR,
|
447 |
+
'scheme' => [
|
448 |
+
'type' => Scheme_Color::get_type(),
|
449 |
+
'value' => Scheme_Color::COLOR_1,
|
450 |
+
],
|
451 |
+
'default' => '#FFF',
|
452 |
+
'selectors' => [
|
453 |
+
'{{WRAPPER}} .plan-price-shape-inner .price-subtext' => 'color: {{VALUE}};',
|
454 |
+
],
|
455 |
+
]
|
456 |
+
);
|
457 |
+
|
458 |
+
$this->add_group_control(
|
459 |
+
Group_Control_Typography::get_type(),
|
460 |
+
[
|
461 |
+
'name' => 'price_sub_text_typography',
|
462 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
463 |
+
'selector' => '{{WRAPPER}} .plan-price-shape-inner .price-subtext',
|
464 |
+
]
|
465 |
+
);
|
466 |
+
|
467 |
+
$this->add_control(
|
468 |
+
'pb_box_settings',
|
469 |
+
[
|
470 |
+
'label' => __( 'Box Settings', 'wts-eae' ),
|
471 |
+
'type' => Controls_Manager::HEADING,
|
472 |
+
'separator' => 'before',
|
473 |
+
]
|
474 |
+
);
|
475 |
+
|
476 |
+
$this->add_group_control(
|
477 |
+
Group_Control_Border::get_type(),
|
478 |
+
[
|
479 |
+
'name' => 'price_box_border',
|
480 |
+
'label' => __( 'Price Box Border', 'wts-eae' ),
|
481 |
+
'selector' => '{{WRAPPER}} .plan-price-shape',
|
482 |
+
]
|
483 |
+
);
|
484 |
+
|
485 |
+
$this->add_control(
|
486 |
+
'price_box_border_radius',
|
487 |
+
[
|
488 |
+
'label' => __( 'Border Radius', 'wts-eae' ),
|
489 |
+
'type' => Controls_Manager::DIMENSIONS,
|
490 |
+
'size_units' => [ 'px', '%' ],
|
491 |
+
'selectors' => [
|
492 |
+
'{{WRAPPER}} .plan-price-shape' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
|
493 |
+
],
|
494 |
+
]
|
495 |
+
);
|
496 |
+
|
497 |
+
$this->add_responsive_control(
|
498 |
+
'price_box_padding',
|
499 |
+
[
|
500 |
+
'label' => __( 'Price Box Padding', 'wts-eae' ),
|
501 |
+
'type' => Controls_Manager::DIMENSIONS,
|
502 |
+
'size_units' => [ 'px', 'em', '%' ],
|
503 |
+
'selectors' => [
|
504 |
+
'{{WRAPPER}} .plan-price-shape-inner' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
505 |
+
],
|
506 |
+
]
|
507 |
+
);
|
508 |
+
|
509 |
+
|
510 |
+
$this->add_group_control(
|
511 |
+
Group_Control_Background::get_type(),
|
512 |
+
[
|
513 |
+
'name' => 'price_box_section_bg',
|
514 |
+
'label' => __( 'Section Background', 'wts-eae' ),
|
515 |
+
'types' => [ 'classic' ,'gradient'],
|
516 |
+
'selector' => '{{WRAPPER}} .plan-price-block',
|
517 |
+
]
|
518 |
+
);
|
519 |
+
|
520 |
+
|
521 |
+
$this->end_controls_section();
|
522 |
+
|
523 |
+
$this->start_controls_section(
|
524 |
+
'section-features-style',
|
525 |
+
[
|
526 |
+
'label' => __( 'Feature List', 'wts-eae' ),
|
527 |
+
'tab' => Controls_Manager::TAB_STYLE,
|
528 |
+
]
|
529 |
+
);
|
530 |
+
|
531 |
+
$this->add_control(
|
532 |
+
'features_text_color',
|
533 |
+
[
|
534 |
+
'label' => __( 'Features Color', 'wts-eae' ),
|
535 |
+
'type' => Controls_Manager::COLOR,
|
536 |
+
'scheme' => [
|
537 |
+
'type' => Scheme_Color::get_type(),
|
538 |
+
'value' => Scheme_Color::COLOR_1,
|
539 |
+
],
|
540 |
+
'default' => '#FFF',
|
541 |
+
'selectors' => [
|
542 |
+
'{{WRAPPER}} .eae-pt-feature-list li' => 'color: {{VALUE}};',
|
543 |
+
],
|
544 |
+
]
|
545 |
+
);
|
546 |
+
|
547 |
+
$this->add_group_control(
|
548 |
+
Group_Control_Typography::get_type(),
|
549 |
+
[
|
550 |
+
'name' => 'features_typography',
|
551 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
552 |
+
'selector' => '{{WRAPPER}} .eae-pt-feature-list li',
|
553 |
+
]
|
554 |
+
);
|
555 |
+
|
556 |
+
|
557 |
+
$this->add_group_control(
|
558 |
+
Group_Control_Background::get_type(),
|
559 |
+
[
|
560 |
+
'name' => 'feature_section_bg',
|
561 |
+
'label' => __( 'Section Background', 'wts-eae' ),
|
562 |
+
'types' => [ 'classic','gradient' ],
|
563 |
+
'selector' => '{{WRAPPER}} .plan-features-wrapper',
|
564 |
+
]
|
565 |
+
);
|
566 |
+
|
567 |
+
$this->add_responsive_control(
|
568 |
+
'feature_align',
|
569 |
+
[
|
570 |
+
'label' => __( 'Alignment', 'wts-eae' ),
|
571 |
+
'type' => Controls_Manager::CHOOSE,
|
572 |
+
'options' => [
|
573 |
+
'left' => [
|
574 |
+
'title' => __( 'Left', 'wts-eae' ),
|
575 |
+
'icon' => 'fa fa-align-left',
|
576 |
+
],
|
577 |
+
'center' => [
|
578 |
+
'title' => __( 'Center', 'wts-eae' ),
|
579 |
+
'icon' => 'fa fa-align-center',
|
580 |
+
],
|
581 |
+
'right' => [
|
582 |
+
'title' => __( 'Right', 'wts-eae' ),
|
583 |
+
'icon' => 'fa fa-align-right',
|
584 |
+
]
|
585 |
+
],
|
586 |
+
'default' => 'center',
|
587 |
+
'selectors' => [
|
588 |
+
'{{WRAPPER}} .plan-features-wrapper .eae-pt-feature-list' => 'text-align: {{VALUE}};',
|
589 |
+
]
|
590 |
+
]
|
591 |
+
);
|
592 |
+
|
593 |
+
$this->end_controls_section();
|
594 |
+
|
595 |
+
$this->start_controls_section(
|
596 |
+
'section-action-button',
|
597 |
+
[
|
598 |
+
'label' => __( 'Action Button', 'wts-eae' ),
|
599 |
+
'tab' => Controls_Manager::TAB_STYLE,
|
600 |
+
]
|
601 |
+
);
|
602 |
+
|
603 |
+
$this->add_control(
|
604 |
+
'button-section-bg',
|
605 |
+
[
|
606 |
+
'label' => __( 'Section Background', 'wts-eae' ),
|
607 |
+
'type' => Controls_Manager::COLOR,
|
608 |
+
'scheme' => [
|
609 |
+
'type' => Scheme_Color::get_type(),
|
610 |
+
'value' => Scheme_Color::COLOR_1,
|
611 |
+
],
|
612 |
+
'default' => '#333333',
|
613 |
+
'selectors' => [
|
614 |
+
'{{WRAPPER}} .eae-pt-button-wrapper' => 'background-color: {{VALUE}};',
|
615 |
+
],
|
616 |
+
]
|
617 |
+
);
|
618 |
+
|
619 |
+
$this->add_control(
|
620 |
+
'button_text_color',
|
621 |
+
[
|
622 |
+
'label' => __( 'Text Color', 'wts-eae' ),
|
623 |
+
'type' => Controls_Manager::COLOR,
|
624 |
+
'default' => '#fff',
|
625 |
+
'selectors' => [
|
626 |
+
'{{WRAPPER}} .eae-pt-action-button' => 'color: {{VALUE}};',
|
627 |
+
],
|
628 |
+
]
|
629 |
+
);
|
630 |
+
|
631 |
+
$this->add_group_control(
|
632 |
+
Group_Control_Typography::get_type(),
|
633 |
+
[
|
634 |
+
'name' => 'typography',
|
635 |
+
'label' => __( 'Typography', 'wts-eae' ),
|
636 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_4,
|
637 |
+
'selector' => '{{WRAPPER}} .eae-pt-action-button',
|
638 |
+
]
|
639 |
+
);
|
640 |
+
|
641 |
+
$this->add_control(
|
642 |
+
'background_color',
|
643 |
+
[
|
644 |
+
'label' => __( 'Background Color', 'wts-eae' ),
|
645 |
+
'type' => Controls_Manager::COLOR,
|
646 |
+
'scheme' => [
|
647 |
+
'type' => Scheme_Color::get_type(),
|
648 |
+
'value' => Scheme_Color::COLOR_4,
|
649 |
+
],
|
650 |
+
'default' => '#93C64F',
|
651 |
+
'selectors' => [
|
652 |
+
'{{WRAPPER}} .eae-pt-action-button' => 'background-color: {{VALUE}};',
|
653 |
+
],
|
654 |
+
]
|
655 |
+
);
|
656 |
+
|
657 |
+
$this->add_group_control(
|
658 |
+
Group_Control_Background::get_type(),
|
659 |
+
[
|
660 |
+
'name' => 'action_section_bg',
|
661 |
+
'label' => __( 'Section Background', 'wts-eae' ),
|
662 |
+
'types' => [ 'classic','gradient' ],
|
663 |
+
'selector' => '{{WRAPPER}} .eae-pt-button-wrapper',
|
664 |
+
'default' => [
|
665 |
+
'background' => 'classic',
|
666 |
+
'color' => '#555'
|
667 |
+
]
|
668 |
+
]
|
669 |
+
);
|
670 |
+
|
671 |
+
$this->add_group_control(
|
672 |
+
Group_Control_Border::get_type(),
|
673 |
+
[
|
674 |
+
'name' => 'border',
|
675 |
+
'label' => __( 'Border', 'wts-eae' ),
|
676 |
+
'placeholder' => '1px',
|
677 |
+
'default' => '1px',
|
678 |
+
'selector' => '{{WRAPPER}} .eae-pt-action-button',
|
679 |
+
]
|
680 |
+
);
|
681 |
+
|
682 |
+
$this->add_control(
|
683 |
+
'border_radius',
|
684 |
+
[
|
685 |
+
'label' => __( 'Border Radius', 'wts-eae' ),
|
686 |
+
'type' => Controls_Manager::DIMENSIONS,
|
687 |
+
'size_units' => [ 'px', '%' ],
|
688 |
+
'selectors' => [
|
689 |
+
'{{WRAPPER}} .eae-pt-action-button' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
690 |
+
],
|
691 |
+
]
|
692 |
+
);
|
693 |
+
|
694 |
+
$this->add_control(
|
695 |
+
'text_padding',
|
696 |
+
[
|
697 |
+
'label' => __( 'Text Padding', 'wts-eae' ),
|
698 |
+
'type' => Controls_Manager::DIMENSIONS,
|
699 |
+
'size_units' => [ 'px', 'em', '%' ],
|
700 |
+
'selectors' => [
|
701 |
+
'{{WRAPPER}} .eae-pt-action-button' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
702 |
+
],
|
703 |
+
]
|
704 |
+
);
|
705 |
+
|
706 |
+
$this->end_controls_section();
|
707 |
+
|
708 |
+
$this->start_controls_section(
|
709 |
+
'section_hover',
|
710 |
+
[
|
711 |
+
'label' => __( 'Button Hover', 'wts-eae' ),
|
712 |
+
'type' => Controls_Manager::SECTION,
|
713 |
+
'tab' => Controls_Manager::TAB_STYLE,
|
714 |
+
]
|
715 |
+
);
|
716 |
+
|
717 |
+
$this->add_control(
|
718 |
+
'hover_color',
|
719 |
+
[
|
720 |
+
'label' => __( 'Text Color', 'wts-eae' ),
|
721 |
+
'type' => Controls_Manager::COLOR,
|
722 |
+
'selectors' => [
|
723 |
+
'{{WRAPPER}} .eae-pt-action-button:hover' => 'color: {{VALUE}};',
|
724 |
+
],
|
725 |
+
]
|
726 |
+
);
|
727 |
+
|
728 |
+
$this->add_control(
|
729 |
+
'button_background_hover_color',
|
730 |
+
[
|
731 |
+
'label' => __( 'Background Color', 'wts-eae' ),
|
732 |
+
'type' => Controls_Manager::COLOR,
|
733 |
+
'selectors' => [
|
734 |
+
'{{WRAPPER}} .eae-pt-action-button:hover' => 'background-color: {{VALUE}};',
|
735 |
+
],
|
736 |
+
]
|
737 |
+
);
|
738 |
+
|
739 |
+
$this->add_control(
|
740 |
+
'button_hover_border_color',
|
741 |
+
[
|
742 |
+
'label' => __( 'Border Color', 'wts-eae' ),
|
743 |
+
'type' => Controls_Manager::COLOR,
|
744 |
+
'condition' => [
|
745 |
+
'border_border!' => '',
|
746 |
+
],
|
747 |
+
'selectors' => [
|
748 |
+
'{{WRAPPER}} .eae-pt-action-button:hover' => 'border-color: {{VALUE}};',
|
749 |
+
],
|
750 |
+
]
|
751 |
+
);
|
752 |
+
|
753 |
+
$this->end_controls_section();
|
754 |
+
|
755 |
+
|
756 |
+
|
757 |
+
|
758 |
+
|
759 |
+
}
|
760 |
+
|
761 |
+
protected function render( ) {
|
762 |
+
$settings = $this->get_settings();
|
763 |
+
|
764 |
+
$this->add_render_attribute('heading','class','eae-pt-heading');
|
765 |
+
$this->add_render_attribute('sub_heading','class','eae-pt-sub-heading');
|
766 |
+
$this->add_render_attribute('button','class','eae-pt-action-button');
|
767 |
+
$this->add_render_attribute( 'icon-align', 'class', 'eae-pt-align-icon-' . $settings['icon_align'] );
|
768 |
+
|
769 |
+
if ( ! empty( $settings['link']['url'] ) ) {
|
770 |
+
$this->add_render_attribute( 'button', 'href', $settings['link']['url'] );
|
771 |
+
|
772 |
+
if ( ! empty( $settings['link']['is_external'] ) ) {
|
773 |
+
$this->add_render_attribute( 'button', 'target', '_blank' );
|
774 |
+
}
|
775 |
+
}
|
776 |
+
|
777 |
+
|
778 |
+
?>
|
779 |
+
<div class="wts-price-box-wrapper">
|
780 |
+
<?php
|
781 |
+
if(!empty($settings['heading']) || !empty($settings['heading'])) {
|
782 |
+
?>
|
783 |
+
<div class="heading-wrapper">
|
784 |
+
<?php if(!empty($settings['heading'])){
|
785 |
+
?>
|
786 |
+
<<?php echo $settings['heading_tag']; ?> <?php echo $this->get_render_attribute_string('heading'); ?>>
|
787 |
+
<?php echo $settings['heading']; ?>
|
788 |
+
</<?php echo $settings['heading_tag'] ?>>
|
789 |
+
<?php
|
790 |
+
} ?>
|
791 |
+
|
792 |
+
<?php if(!empty($settings['sub-heading'])){
|
793 |
+
?>
|
794 |
+
<<?php echo $settings['sub_heading_tag']; ?> <?php echo $this->get_render_attribute_string('sub_heading'); ?>>
|
795 |
+
<?php echo $settings['sub-heading']; ?>
|
796 |
+
</<?php echo $settings['sub_heading_tag'] ?>>
|
797 |
+
<?php
|
798 |
+
} ?>
|
799 |
+
</div>
|
800 |
+
<?php
|
801 |
+
}
|
802 |
+
|
803 |
+
if(!empty($settings['price-box-text']) || !empty($settings['price-box-subtext'])){
|
804 |
+
?>
|
805 |
+
<div class="plan-price-block">
|
806 |
+
<div class="plan-price-shape">
|
807 |
+
<div class="plan-price-shape-inner">
|
808 |
+
<?php if(!empty($settings['price-box-text'])){ ?>
|
809 |
+
<span class="price-text"><?php echo $settings['price-box-text']; ?></span>
|
810 |
+
<?php } ?>
|
811 |
+
|
812 |
+
<?php if(!empty($settings['price-box-subtext'])){ ?>
|
813 |
+
<span class="price-subtext"><?php echo $settings['price-box-subtext']; ?></span>
|
814 |
+
<?php } ?>
|
815 |
+
</div>
|
816 |
+
</div>
|
817 |
+
</div>
|
818 |
+
|
819 |
+
<?php
|
820 |
+
}
|
821 |
+
|
822 |
+
if(count($settings['feature-list'])){
|
823 |
+
?>
|
824 |
+
<div class="plan-features-wrapper">
|
825 |
+
<ul class="eae-pt-feature-list">
|
826 |
+
<?php
|
827 |
+
foreach($settings['feature-list'] as $feature){
|
828 |
+
?>
|
829 |
+
<li class="<?php echo ($feature['available'] == 'yes')? '':'strike-feature'; ?>"><?php echo $feature['text']; ?></li>
|
830 |
+
<?php
|
831 |
+
}
|
832 |
+
?>
|
833 |
+
</ul>
|
834 |
+
</div>
|
835 |
+
<?php
|
836 |
+
}
|
837 |
+
|
838 |
+
if(!empty($settings['action_text'])){
|
839 |
+
?>
|
840 |
+
<div class="eae-pt-button-wrapper">
|
841 |
+
<a <?php echo $this->get_render_attribute_string( 'button' ); ?>>
|
842 |
+
<span <?php echo $this->get_render_attribute_string( 'content-wrapper' ); ?>>
|
843 |
+
<?php if ( ! empty( $settings['icon'] ) ) : ?>
|
844 |
+
<span <?php echo $this->get_render_attribute_string( 'icon-align' ); ?>>
|
845 |
+
<i class="<?php echo esc_attr( $settings['icon'] ); ?>"></i>
|
846 |
+
</span>
|
847 |
+
<?php endif; ?>
|
848 |
+
<span class="elementor-button-text"><?php echo $settings['action_text']; ?></span>
|
849 |
+
</span>
|
850 |
+
</a>
|
851 |
+
</div>
|
852 |
+
<?php
|
853 |
+
}
|
854 |
+
?>
|
855 |
+
</div> <!-- close .wts-price-box-wrapper -->
|
856 |
+
<?php
|
857 |
+
}
|
858 |
+
|
859 |
+
protected function content_template() {
|
860 |
+
?>
|
861 |
+
<#
|
862 |
+
|
863 |
+
box_html = '';
|
864 |
+
|
865 |
+
print( separator_html );
|
866 |
+
#>
|
867 |
+
<?php
|
868 |
+
}
|
869 |
+
}
|
870 |
Plugin::instance()->widgets_manager->register_widget_type( new Widget_PriceTable() );
|
elements/screenshot-1.png
ADDED
Binary file
|
elements/shape-separator.php
CHANGED
@@ -1,84 +1,84 @@
|
|
1 |
-
<?php
|
2 |
-
namespace Elementor;
|
3 |
-
|
4 |
-
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
5 |
-
|
6 |
-
class Widget_ShapeSeparator extends Widget_Base {
|
7 |
-
|
8 |
-
public function get_name() {
|
9 |
-
return 'wts-shape-separator';
|
10 |
-
}
|
11 |
-
|
12 |
-
public function get_title() {
|
13 |
-
return __( 'EAE - Shape Separator', '
|
14 |
-
}
|
15 |
-
|
16 |
-
public function get_icon() {
|
17 |
-
return 'eicon-divider-shape wts-eae-pe';
|
18 |
-
}
|
19 |
-
|
20 |
-
public function get_categories() {
|
21 |
-
return [ 'wts-eae' ];
|
22 |
-
}
|
23 |
-
|
24 |
-
protected function _register_controls() {
|
25 |
-
|
26 |
-
$this->start_controls_section(
|
27 |
-
'section_shape',
|
28 |
-
[
|
29 |
-
'label' => __( 'Shape', '
|
30 |
-
]
|
31 |
-
);
|
32 |
-
|
33 |
-
$this->add_control(
|
34 |
-
'separator_shape',
|
35 |
-
[
|
36 |
-
'label' => __( 'Shape', '
|
37 |
-
'type' => Controls_Manager::SELECT,
|
38 |
-
'options' => [
|
39 |
-
'triangle-upper-left' => __( 'Triangle Upper Left', '
|
40 |
-
'triangle-upper-right' => __( 'Triangle Upper Right', '
|
41 |
-
'triangle-bottom-left' => __( 'Triangle Bottom Left', '
|
42 |
-
'triangle-bottom-right' => __( 'Triangle Bottom Right', '
|
43 |
-
],
|
44 |
-
'default' => 'triangle-upper-right',
|
45 |
-
|
46 |
-
]
|
47 |
-
);
|
48 |
-
|
49 |
-
$this->add_control(
|
50 |
-
'shape_color',
|
51 |
-
[
|
52 |
-
'label' => __( 'Shape Color', '
|
53 |
-
'type' => Controls_Manager::COLOR,
|
54 |
-
'scheme' => [
|
55 |
-
'type' => Scheme_Color::get_type(),
|
56 |
-
'value' => Scheme_Color::COLOR_1,
|
57 |
-
],
|
58 |
-
'selectors' => [
|
59 |
-
'{{WRAPPER}} svg' => 'fill:{{VALUE}}',
|
60 |
-
],
|
61 |
-
]
|
62 |
-
);
|
63 |
-
|
64 |
-
$this->add_control(
|
65 |
-
'shape_height',
|
66 |
-
[
|
67 |
-
'type' => Controls_Manager::NUMBER,
|
68 |
-
'label' => __( 'Shape Height (in px)', '
|
69 |
-
'placeholder' => __( '75', '
|
70 |
-
'default' => __( '75', '
|
71 |
-
]
|
72 |
-
);
|
73 |
-
|
74 |
-
$this->end_controls_section();
|
75 |
-
}
|
76 |
-
|
77 |
-
protected function render( ) {
|
78 |
-
$settings = $this->get_settings();
|
79 |
-
include ELEMENTOR_ADDON_PATH.'elements/shape-separator/'.$settings['separator_shape'].'.php';
|
80 |
-
}
|
81 |
-
|
82 |
-
|
83 |
-
}
|
84 |
Plugin::instance()->widgets_manager->register_widget_type( new Widget_ShapeSeparator() );
|
1 |
+
<?php
|
2 |
+
namespace Elementor;
|
3 |
+
|
4 |
+
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
5 |
+
|
6 |
+
class Widget_ShapeSeparator extends Widget_Base {
|
7 |
+
|
8 |
+
public function get_name() {
|
9 |
+
return 'wts-shape-separator';
|
10 |
+
}
|
11 |
+
|
12 |
+
public function get_title() {
|
13 |
+
return __( 'EAE - Shape Separator', 'wts-eae' );
|
14 |
+
}
|
15 |
+
|
16 |
+
public function get_icon() {
|
17 |
+
return 'eicon-divider-shape wts-eae-pe';
|
18 |
+
}
|
19 |
+
|
20 |
+
public function get_categories() {
|
21 |
+
return [ 'wts-eae' ];
|
22 |
+
}
|
23 |
+
|
24 |
+
protected function _register_controls() {
|
25 |
+
|
26 |
+
$this->start_controls_section(
|
27 |
+
'section_shape',
|
28 |
+
[
|
29 |
+
'label' => __( 'Shape', 'wts-eae' )
|
30 |
+
]
|
31 |
+
);
|
32 |
+
|
33 |
+
$this->add_control(
|
34 |
+
'separator_shape',
|
35 |
+
[
|
36 |
+
'label' => __( 'Shape', 'wts-eae' ),
|
37 |
+
'type' => Controls_Manager::SELECT,
|
38 |
+
'options' => [
|
39 |
+
'triangle-upper-left' => __( 'Triangle Upper Left', 'wts-eae' ),
|
40 |
+
'triangle-upper-right' => __( 'Triangle Upper Right', 'wts-eae' ),
|
41 |
+
'triangle-bottom-left' => __( 'Triangle Bottom Left', 'wts-eae' ),
|
42 |
+
'triangle-bottom-right' => __( 'Triangle Bottom Right', 'wts-eae' ),
|
43 |
+
],
|
44 |
+
'default' => 'triangle-upper-right',
|
45 |
+
|
46 |
+
]
|
47 |
+
);
|
48 |
+
|
49 |
+
$this->add_control(
|
50 |
+
'shape_color',
|
51 |
+
[
|
52 |
+
'label' => __( 'Shape Color', 'wts-eae' ),
|
53 |
+
'type' => Controls_Manager::COLOR,
|
54 |
+
'scheme' => [
|
55 |
+
'type' => Scheme_Color::get_type(),
|
56 |
+
'value' => Scheme_Color::COLOR_1,
|
57 |
+
],
|
58 |
+
'selectors' => [
|
59 |
+
'{{WRAPPER}} svg' => 'fill:{{VALUE}}',
|
60 |
+
],
|
61 |
+
]
|
62 |
+
);
|
63 |
+
|
64 |
+
$this->add_control(
|
65 |
+
'shape_height',
|
66 |
+
[
|
67 |
+
'type' => Controls_Manager::NUMBER,
|
68 |
+
'label' => __( 'Shape Height (in px)', 'wts-eae' ),
|
69 |
+
'placeholder' => __( '75', 'wts-eae' ),
|
70 |
+
'default' => __( '75', 'wts-eae' ),
|
71 |
+
]
|
72 |
+
);
|
73 |
+
|
74 |
+
$this->end_controls_section();
|
75 |
+
}
|
76 |
+
|
77 |
+
protected function render( ) {
|
78 |
+
$settings = $this->get_settings();
|
79 |
+
include ELEMENTOR_ADDON_PATH.'elements/shape-separator/'.$settings['separator_shape'].'.php';
|
80 |
+
}
|
81 |
+
|
82 |
+
|
83 |
+
}
|
84 |
Plugin::instance()->widgets_manager->register_widget_type( new Widget_ShapeSeparator() );
|
elements/shape-separator/triangle-bottom-left.php
CHANGED
@@ -1,3 +1,3 @@
|
|
1 |
-
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" fill="<?php echo $settings['shape_color']; ?>" width="100%" height="90" viewBox="0 0 50 50" stroke="<?php echo $settings['shape_color']; ?>" stroke-width="1" preserveAspectRatio="none" style="height: <?php echo $settings['shape_height']; ?>px;">
|
2 |
-
<polygon points="0,0 0,50 50,50"></polygon>
|
3 |
</svg>
|
1 |
+
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" fill="<?php echo $settings['shape_color']; ?>" width="100%" height="90" viewBox="0 0 50 50" stroke="<?php echo $settings['shape_color']; ?>" stroke-width="1" preserveAspectRatio="none" style="height: <?php echo $settings['shape_height']; ?>px;">
|
2 |
+
<polygon points="0,0 0,50 50,50"></polygon>
|
3 |
</svg>
|
elements/shape-separator/triangle-bottom-right.php
CHANGED
@@ -1,3 +1,3 @@
|
|
1 |
-
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" fill="<?php echo $settings['shape_color']; ?>" width="100%" height="90" viewBox="0 0 50 50" preserveAspectRatio="none" style="height: <?php echo $settings['shape_height']; ?>px;">
|
2 |
-
<polygon class="fil0" points="0,50 50,50 50,0"></polygon>
|
3 |
</svg>
|
1 |
+
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" fill="<?php echo $settings['shape_color']; ?>" width="100%" height="90" viewBox="0 0 50 50" preserveAspectRatio="none" style="height: <?php echo $settings['shape_height']; ?>px;">
|
2 |
+
<polygon class="fil0" points="0,50 50,50 50,0"></polygon>
|
3 |
</svg>
|
elements/shape-separator/triangle-upper-left.php
CHANGED
@@ -1,3 +1,3 @@
|
|
1 |
-
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" fill="<?php echo $settings['shape_color']; ?>" width="100%" height="90" viewBox="0 0 50 50" preserveAspectRatio="none" style="height: <?php echo $settings['shape_height']; ?>px;">
|
2 |
-
<polygon class="fil0" points="0,0 50,0 0,50"></polygon>
|
3 |
</svg>
|
1 |
+
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" fill="<?php echo $settings['shape_color']; ?>" width="100%" height="90" viewBox="0 0 50 50" preserveAspectRatio="none" style="height: <?php echo $settings['shape_height']; ?>px;">
|
2 |
+
<polygon class="fil0" points="0,0 50,0 0,50"></polygon>
|
3 |
</svg>
|
elements/shape-separator/triangle-upper-right.php
CHANGED
@@ -1,3 +1,3 @@
|
|
1 |
-
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" fill="<?php echo $settings['shape_color']; ?>" width="100%" height="90" viewBox="0 0 50 50" preserveAspectRatio="none" style="height: <?php echo $settings['shape_height']; ?>px;">
|
2 |
-
<polygon class="fil0" points="0,0 50,0 50,50"></polygon>
|
3 |
</svg>
|
1 |
+
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" fill="<?php echo $settings['shape_color']; ?>" width="100%" height="90" viewBox="0 0 50 50" preserveAspectRatio="none" style="height: <?php echo $settings['shape_height']; ?>px;">
|
2 |
+
<polygon class="fil0" points="0,0 50,0 50,50"></polygon>
|
3 |
</svg>
|
elements/splittext.php
CHANGED
@@ -1,339 +1,339 @@
|
|
1 |
-
<?php
|
2 |
-
namespace Elementor;
|
3 |
-
|
4 |
-
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
5 |
-
|
6 |
-
class Widget_SplitText extends Widget_Base {
|
7 |
-
public function get_name() {
|
8 |
-
return 'wts-splittext';
|
9 |
-
}
|
10 |
-
|
11 |
-
public function get_title() {
|
12 |
-
return __( 'EAE - Split Text', '
|
13 |
-
}
|
14 |
-
|
15 |
-
public function get_icon() {
|
16 |
-
return 'eicon-dual-button wts-eae-pe';
|
17 |
-
}
|
18 |
-
|
19 |
-
public function get_categories() {
|
20 |
-
return [ 'wts-eae' ];
|
21 |
-
}
|
22 |
-
|
23 |
-
protected function _register_controls() {
|
24 |
-
$this->start_controls_section(
|
25 |
-
'section_general',
|
26 |
-
[
|
27 |
-
'label' => __( 'General', '
|
28 |
-
]
|
29 |
-
);
|
30 |
-
|
31 |
-
|
32 |
-
$this->add_responsive_control(
|
33 |
-
'text-align',
|
34 |
-
[
|
35 |
-
'label' => __( 'Alignment', '
|
36 |
-
'type' => Controls_Manager::CHOOSE,
|
37 |
-
'options' => [
|
38 |
-
'left' => [
|
39 |
-
'title' => __( 'Left', '
|
40 |
-
'icon' => 'fa fa-align-left',
|
41 |
-
],
|
42 |
-
'center' => [
|
43 |
-
'title' => __( 'Center', '
|
44 |
-
'icon' => 'fa fa-align-center',
|
45 |
-
],
|
46 |
-
'right' => [
|
47 |
-
'title' => __( 'Right', '
|
48 |
-
'icon' => 'fa fa-align-right',
|
49 |
-
]
|
50 |
-
],
|
51 |
-
'default' => '',
|
52 |
-
'selectors' => [
|
53 |
-
'{{WRAPPER}} .eae-st-transform-text' => 'text-align: {{VALUE}};',
|
54 |
-
]
|
55 |
-
]
|
56 |
-
);
|
57 |
-
|
58 |
-
$this->add_control(
|
59 |
-
'split_mode',
|
60 |
-
[
|
61 |
-
'label' => __( 'Split Mode', '
|
62 |
-
'type' => Controls_Manager::SELECT,
|
63 |
-
'options' => [
|
64 |
-
'text' => __( 'Letter', '
|
65 |
-
'word' => __( 'Word', '
|
66 |
-
],
|
67 |
-
'default' => 'word',
|
68 |
-
]
|
69 |
-
);
|
70 |
-
|
71 |
-
$this->add_control(
|
72 |
-
'split_count',
|
73 |
-
[
|
74 |
-
'label' => __( 'Split Count', '
|
75 |
-
'type' => Controls_Manager::TEXT,
|
76 |
-
'default' => '2',
|
77 |
-
'placeholder' => __( 'Count', '
|
78 |
-
]
|
79 |
-
);
|
80 |
-
|
81 |
-
$this->add_control(
|
82 |
-
'title_size',
|
83 |
-
[
|
84 |
-
'label' => __( 'HTML Tag', '
|
85 |
-
'type' => Controls_Manager::SELECT,
|
86 |
-
'options' => [
|
87 |
-
'h1' => __( 'H1', '
|
88 |
-
'h2' => __( 'H2', '
|
89 |
-
'h3' => __( 'H3', '
|
90 |
-
'h4' => __( 'H4', '
|
91 |
-
'h5' => __( 'H5', '
|
92 |
-
'h6' => __( 'H6', '
|
93 |
-
'div' => __( 'div', '
|
94 |
-
'span' => __( 'span', '
|
95 |
-
'p' => __( 'p', '
|
96 |
-
],
|
97 |
-
'default' => 'h3',
|
98 |
-
]
|
99 |
-
);
|
100 |
-
|
101 |
-
$this->add_control(
|
102 |
-
'text',
|
103 |
-
[
|
104 |
-
'label' => __( 'Text', '
|
105 |
-
'type' => Controls_Manager::TEXTAREA,
|
106 |
-
'placeholder' => __( 'Enter text', '
|
107 |
-
'default' => __( 'I Love Elementor', '
|
108 |
-
]
|
109 |
-
);
|
110 |
-
|
111 |
-
|
112 |
-
|
113 |
-
|
114 |
-
$this->end_controls_section();
|
115 |
-
|
116 |
-
$this->start_controls_section(
|
117 |
-
'section_split_text_style',
|
118 |
-
[
|
119 |
-
'label' => __( 'Part 1', '
|
120 |
-
'tab' => Controls_Manager::TAB_STYLE,
|
121 |
-
]
|
122 |
-
);
|
123 |
-
|
124 |
-
|
125 |
-
$this->add_control(
|
126 |
-
'split_text_color',
|
127 |
-
[
|
128 |
-
'label' => __( 'Text Color', '
|
129 |
-
'type' => Controls_Manager::COLOR,
|
130 |
-
'scheme' => [
|
131 |
-
'type' => Scheme_Color::get_type(),
|
132 |
-
'value' => Scheme_Color::COLOR_1,
|
133 |
-
],
|
134 |
-
'selectors' => [
|
135 |
-
'{{WRAPPER}} .eae-st-split-text' => 'color: {{VALUE}};',
|
136 |
-
],
|
137 |
-
]
|
138 |
-
);
|
139 |
-
|
140 |
-
|
141 |
-
$this->add_group_control(
|
142 |
-
Group_Control_Typography::get_type(),
|
143 |
-
[
|
144 |
-
'name' => 'split_text_typography',
|
145 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
146 |
-
'selector' => '{{WRAPPER}} .eae-st-split-text',
|
147 |
-
]
|
148 |
-
);
|
149 |
-
|
150 |
-
$this->add_group_control(
|
151 |
-
Group_Control_Border::get_type(),
|
152 |
-
[
|
153 |
-
'name' => 'split_text_border',
|
154 |
-
'label' => __( 'Box Border', '
|
155 |
-
'selector' => '{{WRAPPER}} .eae-st-split-text',
|
156 |
-
]
|
157 |
-
);
|
158 |
-
|
159 |
-
|
160 |
-
|
161 |
-
$this->add_control(
|
162 |
-
'split_text_box_border_radius',
|
163 |
-
[
|
164 |
-
'label' => __( 'Border Radius', '
|
165 |
-
'type' => Controls_Manager::DIMENSIONS,
|
166 |
-
'size_units' => [ 'px', '%' ],
|
167 |
-
'selectors' => [
|
168 |
-
'{{WRAPPER}} .eae-st-split-text' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
169 |
-
],
|
170 |
-
]
|
171 |
-
);
|
172 |
-
|
173 |
-
$this->add_control(
|
174 |
-
'split_text_box_padding',
|
175 |
-
[
|
176 |
-
'label' => __( 'Padding', '
|
177 |
-
'type' => Controls_Manager::DIMENSIONS,
|
178 |
-
'size_units' => [ 'px', '%' ],
|
179 |
-
'selectors' => [
|
180 |
-
'{{WRAPPER}} .eae-st-split-text' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
181 |
-
],
|
182 |
-
]
|
183 |
-
);
|
184 |
-
$this->add_control(
|
185 |
-
'split_text_box_margin',
|
186 |
-
[
|
187 |
-
'label' => __( 'Margin', '
|
188 |
-
'type' => Controls_Manager::DIMENSIONS,
|
189 |
-
'size_units' => [ 'px', '%' ],
|
190 |
-
'selectors' => [
|
191 |
-
'{{WRAPPER}} .eae-st-split-text' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
192 |
-
],
|
193 |
-
]
|
194 |
-
);
|
195 |
-
|
196 |
-
$this->add_group_control(
|
197 |
-
Group_Control_Background::get_type(),
|
198 |
-
[
|
199 |
-
'name' => 'split_text_section_bg',
|
200 |
-
'label' => __( 'Text Background', '
|
201 |
-
'types' => [ 'none','classic','gradient' ],
|
202 |
-
'selector' => '{{WRAPPER}} .eae-st-split-text',
|
203 |
-
]
|
204 |
-
);
|
205 |
-
|
206 |
-
|
207 |
-
$this->end_controls_section();
|
208 |
-
|
209 |
-
$this->start_controls_section(
|
210 |
-
'section_rest_text_style',
|
211 |
-
[
|
212 |
-
'label' => __( 'Part 2', '
|
213 |
-
'tab' => Controls_Manager::TAB_STYLE,
|
214 |
-
]
|
215 |
-
);
|
216 |
-
|
217 |
-
$this->add_control(
|
218 |
-
'rest_text_color',
|
219 |
-
[
|
220 |
-
'label' => __( 'Text Color', '
|
221 |
-
'type' => Controls_Manager::COLOR,
|
222 |
-
'scheme' => [
|
223 |
-
'type' => Scheme_Color::get_type(),
|
224 |
-
'value' => Scheme_Color::COLOR_2,
|
225 |
-
],
|
226 |
-
'selectors' => [
|
227 |
-
'{{WRAPPER}} .eae-st-rest-text' => 'color: {{VALUE}};',
|
228 |
-
],
|
229 |
-
]
|
230 |
-
);
|
231 |
-
|
232 |
-
$this->add_group_control(
|
233 |
-
Group_Control_Typography::get_type(),
|
234 |
-
[
|
235 |
-
'name' => 'rest_text_typography',
|
236 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
237 |
-
'selector' => '{{WRAPPER}} .eae-st-rest-text',
|
238 |
-
]
|
239 |
-
);
|
240 |
-
$this->add_group_control(
|
241 |
-
Group_Control_Border::get_type(),
|
242 |
-
[
|
243 |
-
'name' => 'rest_text_border',
|
244 |
-
'label' => __( 'Box Border', '
|
245 |
-
'selector' => '{{WRAPPER}} .eae-st-rest-text',
|
246 |
-
]
|
247 |
-
);
|
248 |
-
|
249 |
-
|
250 |
-
|
251 |
-
$this->add_control(
|
252 |
-
'rest_text_box_border_radius',
|
253 |
-
[
|
254 |
-
'label' => __( 'Border Radius', '
|
255 |
-
'type' => Controls_Manager::DIMENSIONS,
|
256 |
-
'size_units' => [ 'px', '%' ],
|
257 |
-
'selectors' => [
|
258 |
-
'{{WRAPPER}} .eae-st-rest-text' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
259 |
-
],
|
260 |
-
]
|
261 |
-
);
|
262 |
-
|
263 |
-
$this->add_control(
|
264 |
-
'rest_text_box_padding',
|
265 |
-
[
|
266 |
-
'label' => __( 'Padding', '
|
267 |
-
'type' => Controls_Manager::DIMENSIONS,
|
268 |
-
'size_units' => [ 'px', '%' ],
|
269 |
-
'selectors' => [
|
270 |
-
'{{WRAPPER}} .eae-st-rest-text' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
271 |
-
],
|
272 |
-
]
|
273 |
-
);
|
274 |
-
$this->add_control(
|
275 |
-
'rest_text_box_margin',
|
276 |
-
[
|
277 |
-
'label' => __( 'Margin', '
|
278 |
-
'type' => Controls_Manager::DIMENSIONS,
|
279 |
-
'size_units' => [ 'px', '%' ],
|
280 |
-
'selectors' => [
|
281 |
-
'{{WRAPPER}} .eae-st-rest-text' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
282 |
-
],
|
283 |
-
]
|
284 |
-
);
|
285 |
-
|
286 |
-
$this->add_group_control(
|
287 |
-
Group_Control_Background::get_type(),
|
288 |
-
[
|
289 |
-
'name' => 'rest_text_section_bg',
|
290 |
-
'label' => __( 'Text Background', '
|
291 |
-
'types' => [ 'none','classic','gradient' ],
|
292 |
-
'selector' => '{{WRAPPER}} .eae-st-rest-text',
|
293 |
-
]
|
294 |
-
);
|
295 |
-
|
296 |
-
$this->end_controls_section();
|
297 |
-
|
298 |
-
}
|
299 |
-
protected function render(){
|
300 |
-
$settings = $this->get_settings();
|
301 |
-
|
302 |
-
$this->add_render_attribute('eae-st-transform-text-wrapper','class','eae-st-transform-text-wrapper');
|
303 |
-
|
304 |
-
$this->add_render_attribute('eae-st-transform-text-wrapper','class','waiting');
|
305 |
-
|
306 |
-
$this->add_render_attribute('eae-st-transform-text','class','eae-st-transform-text');
|
307 |
-
|
308 |
-
$this->add_render_attribute('eae-st-split-text','class','eae-st-split-text');
|
309 |
-
|
310 |
-
$this->add_render_attribute('eae-st-split-full-text','class','eae-st-split-text eae-st-full-text');
|
311 |
-
|
312 |
-
$this->add_render_attribute('eae-st-rest-text','class','eae-st-rest-text');
|
313 |
-
|
314 |
-
?>
|
315 |
-
<div id="eae-at-<?php echo $this->get_id(); ?>" class="eae-st-transform-text-wrapper">
|
316 |
-
<div <?php echo $this->get_render_attribute_string( 'eae-st-transform-text' ); ?>>
|
317 |
-
<?php if($settings['split_mode'] == 'text'){ ?>
|
318 |
-
<?php echo sprintf('<%1$s class="eae-st-transform-text-title">%2$s</%1$s>', $settings['title_size'], "<div ".$this->get_render_attribute_string( 'eae-st-split-text' ).">".substr($settings['text'], 0, $settings['split_count'])."</div><div ".$this->get_render_attribute_string( 'eae-st-rest-text' ).">".substr($settings['text'], $settings['split_count'], strlen($settings['text']) - $settings['split_count'])."</div>"); ?>
|
319 |
-
<?php } else { ?>
|
320 |
-
<?php
|
321 |
-
$arr = explode(" ", $settings['text']);
|
322 |
-
if(count($arr) <= $settings['split_count']){
|
323 |
-
$split_text = "<div " . $this->get_render_attribute_string( 'eae-st-split-full-text' ) . ">".$settings['text']."</div>";
|
324 |
-
echo sprintf('<%1$s class="eae-st-transform-text-title">%2$s</%1$s>', $settings['title_size'], $split_text) ;
|
325 |
-
}else{
|
326 |
-
$split_text = "<div " . $this->get_render_attribute_string( 'eae-st-split-text' ) . ">" . implode(" ", array_slice($arr, 0, $settings['split_count'])) . " </div>";
|
327 |
-
$rest_text = "<div " . $this->get_render_attribute_string( 'eae-st-rest-text' ) . ">" . implode(" ", array_slice($arr, $settings['split_count'], count($arr))) . "</div>";
|
328 |
-
echo sprintf('<%1$s class="eae-st-transform-text-title">%2$s</%1$s>', $settings['title_size'], $split_text.$rest_text);
|
329 |
-
}
|
330 |
-
?>
|
331 |
-
<?php } ?>
|
332 |
-
</div>
|
333 |
-
</div>
|
334 |
-
<?php
|
335 |
-
}
|
336 |
-
|
337 |
-
}
|
338 |
-
Plugin::instance()->widgets_manager->register_widget_type( new Widget_SplitText() );
|
339 |
?>
|
1 |
+
<?php
|
2 |
+
namespace Elementor;
|
3 |
+
|
4 |
+
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
5 |
+
|
6 |
+
class Widget_SplitText extends Widget_Base {
|
7 |
+
public function get_name() {
|
8 |
+
return 'wts-splittext';
|
9 |
+
}
|
10 |
+
|
11 |
+
public function get_title() {
|
12 |
+
return __( 'EAE - Split Text', 'wts-eae' );
|
13 |
+
}
|
14 |
+
|
15 |
+
public function get_icon() {
|
16 |
+
return 'eicon-dual-button wts-eae-pe';
|
17 |
+
}
|
18 |
+
|
19 |
+
public function get_categories() {
|
20 |
+
return [ 'wts-eae' ];
|
21 |
+
}
|
22 |
+
|
23 |
+
protected function _register_controls() {
|
24 |
+
$this->start_controls_section(
|
25 |
+
'section_general',
|
26 |
+
[
|
27 |
+
'label' => __( 'General', 'wts-eae' )
|
28 |
+
]
|
29 |
+
);
|
30 |
+
|
31 |
+
|
32 |
+
$this->add_responsive_control(
|
33 |
+
'text-align',
|
34 |
+
[
|
35 |
+
'label' => __( 'Alignment', 'wts-eae' ),
|
36 |
+
'type' => Controls_Manager::CHOOSE,
|
37 |
+
'options' => [
|
38 |
+
'left' => [
|
39 |
+
'title' => __( 'Left', 'wts-eae' ),
|
40 |
+
'icon' => 'fa fa-align-left',
|
41 |
+
],
|
42 |
+
'center' => [
|
43 |
+
'title' => __( 'Center', 'wts-eae' ),
|
44 |
+
'icon' => 'fa fa-align-center',
|
45 |
+
],
|
46 |
+
'right' => [
|
47 |
+
'title' => __( 'Right', 'wts-eae' ),
|
48 |
+
'icon' => 'fa fa-align-right',
|
49 |
+
]
|
50 |
+
],
|
51 |
+
'default' => '',
|
52 |
+
'selectors' => [
|
53 |
+
'{{WRAPPER}} .eae-st-transform-text' => 'text-align: {{VALUE}};',
|
54 |
+
]
|
55 |
+
]
|
56 |
+
);
|
57 |
+
|
58 |
+
$this->add_control(
|
59 |
+
'split_mode',
|
60 |
+
[
|
61 |
+
'label' => __( 'Split Mode', 'wts-eae' ),
|
62 |
+
'type' => Controls_Manager::SELECT,
|
63 |
+
'options' => [
|
64 |
+
'text' => __( 'Letter', 'wts-eae' ),
|
65 |
+
'word' => __( 'Word', 'wts-eae' )
|
66 |
+
],
|
67 |
+
'default' => 'word',
|
68 |
+
]
|
69 |
+
);
|
70 |
+
|
71 |
+
$this->add_control(
|
72 |
+
'split_count',
|
73 |
+
[
|
74 |
+
'label' => __( 'Split Count', 'wts-eae' ),
|
75 |
+
'type' => Controls_Manager::TEXT,
|
76 |
+
'default' => '2',
|
77 |
+
'placeholder' => __( 'Count', 'wts-eae' ),
|
78 |
+
]
|
79 |
+
);
|
80 |
+
|
81 |
+
$this->add_control(
|
82 |
+
'title_size',
|
83 |
+
[
|
84 |
+
'label' => __( 'HTML Tag', 'wts-eae' ),
|
85 |
+
'type' => Controls_Manager::SELECT,
|
86 |
+
'options' => [
|
87 |
+
'h1' => __( 'H1', 'wts-eae' ),
|
88 |
+
'h2' => __( 'H2', 'wts-eae' ),
|
89 |
+
'h3' => __( 'H3', 'wts-eae' ),
|
90 |
+
'h4' => __( 'H4', 'wts-eae' ),
|
91 |
+
'h5' => __( 'H5', 'wts-eae' ),
|
92 |
+
'h6' => __( 'H6', 'wts-eae' ),
|
93 |
+
'div' => __( 'div', 'wts-eae' ),
|
94 |
+
'span' => __( 'span', 'wts-eae' ),
|
95 |
+
'p' => __( 'p', 'wts-eae' ),
|
96 |
+
],
|
97 |
+
'default' => 'h3',
|
98 |
+
]
|
99 |
+
);
|
100 |
+
|
101 |
+
$this->add_control(
|
102 |
+
'text',
|
103 |
+
[
|
104 |
+
'label' => __( 'Text', 'wts-eae' ),
|
105 |
+
'type' => Controls_Manager::TEXTAREA,
|
106 |
+
'placeholder' => __( 'Enter text', 'wts-eae' ),
|
107 |
+
'default' => __( 'I Love Elementor', 'wts-eae' ),
|
108 |
+
]
|
109 |
+
);
|
110 |
+
|
111 |
+
|
112 |
+
|
113 |
+
|
114 |
+
$this->end_controls_section();
|
115 |
+
|
116 |
+
$this->start_controls_section(
|
117 |
+
'section_split_text_style',
|
118 |
+
[
|
119 |
+
'label' => __( 'Part 1', 'wts-eae' ),
|
120 |
+
'tab' => Controls_Manager::TAB_STYLE,
|
121 |
+
]
|
122 |
+
);
|
123 |
+
|
124 |
+
|
125 |
+
$this->add_control(
|
126 |
+
'split_text_color',
|
127 |
+
[
|
128 |
+
'label' => __( 'Text Color', 'wts-eae' ),
|
129 |
+
'type' => Controls_Manager::COLOR,
|
130 |
+
'scheme' => [
|
131 |
+
'type' => Scheme_Color::get_type(),
|
132 |
+
'value' => Scheme_Color::COLOR_1,
|
133 |
+
],
|
134 |
+
'selectors' => [
|
135 |
+
'{{WRAPPER}} .eae-st-split-text' => 'color: {{VALUE}};',
|
136 |
+
],
|
137 |
+
]
|
138 |
+
);
|
139 |
+
|
140 |
+
|
141 |
+
$this->add_group_control(
|
142 |
+
Group_Control_Typography::get_type(),
|
143 |
+
[
|
144 |
+
'name' => 'split_text_typography',
|
145 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
146 |
+
'selector' => '{{WRAPPER}} .eae-st-split-text',
|
147 |
+
]
|
148 |
+
);
|
149 |
+
|
150 |
+
$this->add_group_control(
|
151 |
+
Group_Control_Border::get_type(),
|
152 |
+
[
|
153 |
+
'name' => 'split_text_border',
|
154 |
+
'label' => __( 'Box Border', 'wts-eae' ),
|
155 |
+
'selector' => '{{WRAPPER}} .eae-st-split-text',
|
156 |
+
]
|
157 |
+
);
|
158 |
+
|
159 |
+
|
160 |
+
|
161 |
+
$this->add_control(
|
162 |
+
'split_text_box_border_radius',
|
163 |
+
[
|
164 |
+
'label' => __( 'Border Radius', 'wts-eae' ),
|
165 |
+
'type' => Controls_Manager::DIMENSIONS,
|
166 |
+
'size_units' => [ 'px', '%' ],
|
167 |
+
'selectors' => [
|
168 |
+
'{{WRAPPER}} .eae-st-split-text' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
169 |
+
],
|
170 |
+
]
|
171 |
+
);
|
172 |
+
|
173 |
+
$this->add_control(
|
174 |
+
'split_text_box_padding',
|
175 |
+
[
|
176 |
+
'label' => __( 'Padding', 'wts-eae' ),
|
177 |
+
'type' => Controls_Manager::DIMENSIONS,
|
178 |
+
'size_units' => [ 'px', '%' ],
|
179 |
+
'selectors' => [
|
180 |
+
'{{WRAPPER}} .eae-st-split-text' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
181 |
+
],
|
182 |
+
]
|
183 |
+
);
|
184 |
+
$this->add_control(
|
185 |
+
'split_text_box_margin',
|
186 |
+
[
|
187 |
+
'label' => __( 'Margin', 'wts-eae' ),
|
188 |
+
'type' => Controls_Manager::DIMENSIONS,
|
189 |
+
'size_units' => [ 'px', '%' ],
|
190 |
+
'selectors' => [
|
191 |
+
'{{WRAPPER}} .eae-st-split-text' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
192 |
+
],
|
193 |
+
]
|
194 |
+
);
|
195 |
+
|
196 |
+
$this->add_group_control(
|
197 |
+
Group_Control_Background::get_type(),
|
198 |
+
[
|
199 |
+
'name' => 'split_text_section_bg',
|
200 |
+
'label' => __( 'Text Background', 'wts-eae' ),
|
201 |
+
'types' => [ 'none','classic','gradient' ],
|
202 |
+
'selector' => '{{WRAPPER}} .eae-st-split-text',
|
203 |
+
]
|
204 |
+
);
|
205 |
+
|
206 |
+
|
207 |
+
$this->end_controls_section();
|
208 |
+
|
209 |
+
$this->start_controls_section(
|
210 |
+
'section_rest_text_style',
|
211 |
+
[
|
212 |
+
'label' => __( 'Part 2', 'wts-eae' ),
|
213 |
+
'tab' => Controls_Manager::TAB_STYLE,
|
214 |
+
]
|
215 |
+
);
|
216 |
+
|
217 |
+
$this->add_control(
|
218 |
+
'rest_text_color',
|
219 |
+
[
|
220 |
+
'label' => __( 'Text Color', 'wts-eae' ),
|
221 |
+
'type' => Controls_Manager::COLOR,
|
222 |
+
'scheme' => [
|
223 |
+
'type' => Scheme_Color::get_type(),
|
224 |
+
'value' => Scheme_Color::COLOR_2,
|
225 |
+
],
|
226 |
+
'selectors' => [
|
227 |
+
'{{WRAPPER}} .eae-st-rest-text' => 'color: {{VALUE}};',
|
228 |
+
],
|
229 |
+
]
|
230 |
+
);
|
231 |
+
|
232 |
+
$this->add_group_control(
|
233 |
+
Group_Control_Typography::get_type(),
|
234 |
+
[
|
235 |
+
'name' => 'rest_text_typography',
|
236 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
237 |
+
'selector' => '{{WRAPPER}} .eae-st-rest-text',
|
238 |
+
]
|
239 |
+
);
|
240 |
+
$this->add_group_control(
|
241 |
+
Group_Control_Border::get_type(),
|
242 |
+
[
|
243 |
+
'name' => 'rest_text_border',
|
244 |
+
'label' => __( 'Box Border', 'wts-eae' ),
|
245 |
+
'selector' => '{{WRAPPER}} .eae-st-rest-text',
|
246 |
+
]
|
247 |
+
);
|
248 |
+
|
249 |
+
|
250 |
+
|
251 |
+
$this->add_control(
|
252 |
+
'rest_text_box_border_radius',
|
253 |
+
[
|
254 |
+
'label' => __( 'Border Radius', 'wts-eae' ),
|
255 |
+
'type' => Controls_Manager::DIMENSIONS,
|
256 |
+
'size_units' => [ 'px', '%' ],
|
257 |
+
'selectors' => [
|
258 |
+
'{{WRAPPER}} .eae-st-rest-text' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
259 |
+
],
|
260 |
+
]
|
261 |
+
);
|
262 |
+
|
263 |
+
$this->add_control(
|
264 |
+
'rest_text_box_padding',
|
265 |
+
[
|
266 |
+
'label' => __( 'Padding', 'wts-eae' ),
|
267 |
+
'type' => Controls_Manager::DIMENSIONS,
|
268 |
+
'size_units' => [ 'px', '%' ],
|
269 |
+
'selectors' => [
|
270 |
+
'{{WRAPPER}} .eae-st-rest-text' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
271 |
+
],
|
272 |
+
]
|
273 |
+
);
|
274 |
+
$this->add_control(
|
275 |
+
'rest_text_box_margin',
|
276 |
+
[
|
277 |
+
'label' => __( 'Margin', 'wts-eae' ),
|
278 |
+
'type' => Controls_Manager::DIMENSIONS,
|
279 |
+
'size_units' => [ 'px', '%' ],
|
280 |
+
'selectors' => [
|
281 |
+
'{{WRAPPER}} .eae-st-rest-text' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
282 |
+
],
|
283 |
+
]
|
284 |
+
);
|
285 |
+
|
286 |
+
$this->add_group_control(
|
287 |
+
Group_Control_Background::get_type(),
|
288 |
+
[
|
289 |
+
'name' => 'rest_text_section_bg',
|
290 |
+
'label' => __( 'Text Background', 'wts-eae' ),
|
291 |
+
'types' => [ 'none','classic','gradient' ],
|
292 |
+
'selector' => '{{WRAPPER}} .eae-st-rest-text',
|
293 |
+
]
|
294 |
+
);
|
295 |
+
|
296 |
+
$this->end_controls_section();
|
297 |
+
|
298 |
+
}
|
299 |
+
protected function render(){
|
300 |
+
$settings = $this->get_settings();
|
301 |
+
|
302 |
+
$this->add_render_attribute('eae-st-transform-text-wrapper','class','eae-st-transform-text-wrapper');
|
303 |
+
|
304 |
+
$this->add_render_attribute('eae-st-transform-text-wrapper','class','waiting');
|
305 |
+
|
306 |
+
$this->add_render_attribute('eae-st-transform-text','class','eae-st-transform-text');
|
307 |
+
|
308 |
+
$this->add_render_attribute('eae-st-split-text','class','eae-st-split-text');
|
309 |
+
|
310 |
+
$this->add_render_attribute('eae-st-split-full-text','class','eae-st-split-text eae-st-full-text');
|
311 |
+
|
312 |
+
$this->add_render_attribute('eae-st-rest-text','class','eae-st-rest-text');
|
313 |
+
|
314 |
+
?>
|
315 |
+
<div id="eae-at-<?php echo $this->get_id(); ?>" class="eae-st-transform-text-wrapper">
|
316 |
+
<div <?php echo $this->get_render_attribute_string( 'eae-st-transform-text' ); ?>>
|
317 |
+
<?php if($settings['split_mode'] == 'text'){ ?>
|
318 |
+
<?php echo sprintf('<%1$s class="eae-st-transform-text-title">%2$s</%1$s>', $settings['title_size'], "<div ".$this->get_render_attribute_string( 'eae-st-split-text' ).">".substr($settings['text'], 0, $settings['split_count'])."</div><div ".$this->get_render_attribute_string( 'eae-st-rest-text' ).">".substr($settings['text'], $settings['split_count'], strlen($settings['text']) - $settings['split_count'])."</div>"); ?>
|
319 |
+
<?php } else { ?>
|
320 |
+
<?php
|
321 |
+
$arr = explode(" ", $settings['text']);
|
322 |
+
if(count($arr) <= $settings['split_count']){
|
323 |
+
$split_text = "<div " . $this->get_render_attribute_string( 'eae-st-split-full-text' ) . ">".$settings['text']."</div>";
|
324 |
+
echo sprintf('<%1$s class="eae-st-transform-text-title">%2$s</%1$s>', $settings['title_size'], $split_text) ;
|
325 |
+
}else{
|
326 |
+
$split_text = "<div " . $this->get_render_attribute_string( 'eae-st-split-text' ) . ">" . implode(" ", array_slice($arr, 0, $settings['split_count'])) . " </div>";
|
327 |
+
$rest_text = "<div " . $this->get_render_attribute_string( 'eae-st-rest-text' ) . ">" . implode(" ", array_slice($arr, $settings['split_count'], count($arr))) . "</div>";
|
328 |
+
echo sprintf('<%1$s class="eae-st-transform-text-title">%2$s</%1$s>', $settings['title_size'], $split_text.$rest_text);
|
329 |
+
}
|
330 |
+
?>
|
331 |
+
<?php } ?>
|
332 |
+
</div>
|
333 |
+
</div>
|
334 |
+
<?php
|
335 |
+
}
|
336 |
+
|
337 |
+
}
|
338 |
+
Plugin::instance()->widgets_manager->register_widget_type( new Widget_SplitText() );
|
339 |
?>
|
elements/textseparator.php
CHANGED
@@ -1,531 +1,531 @@
|
|
1 |
-
<?php
|
2 |
-
namespace Elementor;
|
3 |
-
|
4 |
-
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
5 |
-
|
6 |
-
class Widget_TextSeparator extends Widget_Base {
|
7 |
-
|
8 |
-
public function get_name() {
|
9 |
-
return 'wts-textseparator';
|
10 |
-
}
|
11 |
-
|
12 |
-
public function get_title() {
|
13 |
-
return __( 'EAE - Text Separator', '
|
14 |
-
}
|
15 |
-
|
16 |
-
public function get_icon() {
|
17 |
-
return 'eicon-divider wts-eae-pe';
|
18 |
-
}
|
19 |
-
|
20 |
-
|
21 |
-
public function get_categories() {
|
22 |
-
return [ 'wts-eae' ];
|
23 |
-
}
|
24 |
-
|
25 |
-
|
26 |
-
|
27 |
-
|
28 |
-
protected function _register_controls() {
|
29 |
-
$this->start_controls_section(
|
30 |
-
'section_title',
|
31 |
-
[
|
32 |
-
'label' => __( 'Title', '
|
33 |
-
]
|
34 |
-
);
|
35 |
-
|
36 |
-
$this->add_control(
|
37 |
-
'title',
|
38 |
-
[
|
39 |
-
'label' => __( 'Title', '
|
40 |
-
'type' => Controls_Manager::TEXTAREA,
|
41 |
-
'dynamic' => [
|
42 |
-
'active' => true,
|
43 |
-
],
|
44 |
-
'label_block' => true,
|
45 |
-
'placeholder' => __( 'Enter text', '
|
46 |
-
'default' => __( 'This is text separator', '
|
47 |
-
]
|
48 |
-
);
|
49 |
-
|
50 |
-
$this->add_control(
|
51 |
-
'html_tag',
|
52 |
-
[
|
53 |
-
'label' => __( 'HTML Tag', '
|
54 |
-
'type' => Controls_Manager::SELECT,
|
55 |
-
'options' => [
|
56 |
-
'h1' => __( 'H1', '
|
57 |
-
'h2' => __( 'H2', '
|
58 |
-
'h3' => __( 'H3', '
|
59 |
-
'h4' => __( 'H4', '
|
60 |
-
'h5' => __( 'H5', '
|
61 |
-
'h6' => __( 'H6', '
|
62 |
-
'div' => __( 'div', '
|
63 |
-
'span' => __( 'span', '
|
64 |
-
'p' => __( 'p', '
|
65 |
-
],
|
66 |
-
'default' => 'h2',
|
67 |
-
]
|
68 |
-
);
|
69 |
-
|
70 |
-
$this->add_responsive_control(
|
71 |
-
'align',
|
72 |
-
[
|
73 |
-
'label' => __( 'Alignment', '
|
74 |
-
'type' => Controls_Manager::CHOOSE,
|
75 |
-
'options' => [
|
76 |
-
'left' => [
|
77 |
-
'title' => __( 'Left', '
|
78 |
-
'icon' => 'fa fa-align-left',
|
79 |
-
],
|
80 |
-
'center' => [
|
81 |
-
'title' => __( 'Center', '
|
82 |
-
'icon' => 'fa fa-align-center',
|
83 |
-
],
|
84 |
-
'right' => [
|
85 |
-
'title' => __( 'Right', '
|
86 |
-
'icon' => 'fa fa-align-right',
|
87 |
-
]
|
88 |
-
],
|
89 |
-
'default' => 'center'
|
90 |
-
]
|
91 |
-
);
|
92 |
-
|
93 |
-
$this->end_controls_section();
|
94 |
-
|
95 |
-
$this->start_controls_section(
|
96 |
-
'section_icon',
|
97 |
-
[
|
98 |
-
'label' => __( 'Icon', '
|
99 |
-
'type' => Controls_Manager::SECTION,
|
100 |
-
]
|
101 |
-
);
|
102 |
-
|
103 |
-
|
104 |
-
$this->add_control(
|
105 |
-
'icon',
|
106 |
-
[
|
107 |
-
'label' => __( 'Icon', '
|
108 |
-
'type' => Controls_Manager::ICON,
|
109 |
-
'label_block' => true,
|
110 |
-
'default' => 'fa fa-star'
|
111 |
-
]
|
112 |
-
);
|
113 |
-
|
114 |
-
$this->add_control(
|
115 |
-
'view',
|
116 |
-
[
|
117 |
-
'label' => __( 'View', '
|
118 |
-
'type' => Controls_Manager::SELECT,
|
119 |
-
'options' => [
|
120 |
-
'default' => __( 'Default', '
|
121 |
-
'stacked' => __( 'Stacked', '
|
122 |
-
'framed' => __( 'Framed', '
|
123 |
-
],
|
124 |
-
'default' => 'default',
|
125 |
-
'prefix_class' => 'eae-icon-view-',
|
126 |
-
]
|
127 |
-
);
|
128 |
-
|
129 |
-
$this->add_control(
|
130 |
-
'shape',
|
131 |
-
[
|
132 |
-
'label' => __( 'Shape', '
|
133 |
-
'type' => Controls_Manager::SELECT,
|
134 |
-
'options' => [
|
135 |
-
'circle' => __( 'Circle', '
|
136 |
-
'square' => __( 'Square', '
|
137 |
-
],
|
138 |
-
'default' => 'circle',
|
139 |
-
'condition' => [
|
140 |
-
'view!' => 'default',
|
141 |
-
],
|
142 |
-
'prefix_class' => 'eae-icon-shape-',
|
143 |
-
]
|
144 |
-
);
|
145 |
-
|
146 |
-
$this->add_control(
|
147 |
-
'icon_position',
|
148 |
-
[
|
149 |
-
'label' => __('Icon Position','wts_eae'),
|
150 |
-
'type' => Controls_Manager::SELECT,
|
151 |
-
'options' => [
|
152 |
-
'before' => __( 'Before Text', '
|
153 |
-
'after' => __( 'After Text', '
|
154 |
-
],
|
155 |
-
'default' => 'before',
|
156 |
-
]
|
157 |
-
);
|
158 |
-
|
159 |
-
$this->end_controls_section();
|
160 |
-
|
161 |
-
$this->start_controls_section(
|
162 |
-
'section_divider',
|
163 |
-
[
|
164 |
-
'label' => __( 'Divider', '
|
165 |
-
'type' => Controls_Manager::SECTION,
|
166 |
-
]
|
167 |
-
);
|
168 |
-
|
169 |
-
$this->add_control(
|
170 |
-
'style',
|
171 |
-
[
|
172 |
-
'label' => __( 'Style', '
|
173 |
-
'type' => Controls_Manager::SELECT,
|
174 |
-
'options' => [
|
175 |
-
'solid' => __( 'Solid', '
|
176 |
-
'double' => __( 'Double', '
|
177 |
-
'dotted' => __( 'Dotted', '
|
178 |
-
'dashed' => __( 'Dashed', '
|
179 |
-
],
|
180 |
-
'default' => 'solid',
|
181 |
-
'selectors' => [
|
182 |
-
'{{WRAPPER}} .wts-eae-textseparator .eae-sep-holder .eae-sep-lines' => 'border-top-style: {{VALUE}};',
|
183 |
-
],
|
184 |
-
]
|
185 |
-
);
|
186 |
-
|
187 |
-
$this->add_control(
|
188 |
-
'weight',
|
189 |
-
[
|
190 |
-
'label' => __( 'Weight', '
|
191 |
-
'type' => Controls_Manager::SLIDER,
|
192 |
-
'default' => [
|
193 |
-
'size' => 1,
|
194 |
-
],
|
195 |
-
'range' => [
|
196 |
-
'px' => [
|
197 |
-
'min' => 1,
|
198 |
-
'max' => 10,
|
199 |
-
],
|
200 |
-
],
|
201 |
-
'selectors' => [
|
202 |
-
'{{WRAPPER}} .wts-eae-textseparator .eae-sep-holder .eae-sep-lines' => 'border-top-width: {{SIZE}}{{UNIT}};',
|
203 |
-
],
|
204 |
-
]
|
205 |
-
);
|
206 |
-
|
207 |
-
|
208 |
-
|
209 |
-
|
210 |
-
$this->end_controls_section();
|
211 |
-
|
212 |
-
$this->start_controls_section(
|
213 |
-
'section_title_style',
|
214 |
-
[
|
215 |
-
'label' => __( 'Title', '
|
216 |
-
'tab' => Controls_Manager::TAB_STYLE
|
217 |
-
]
|
218 |
-
);
|
219 |
-
|
220 |
-
$this->add_control(
|
221 |
-
'title_color',
|
222 |
-
[
|
223 |
-
'label' => __( 'Text Color', '
|
224 |
-
'type' => Controls_Manager::COLOR,
|
225 |
-
'scheme' => [
|
226 |
-
'type' => Scheme_Color::get_type(),
|
227 |
-
'value' => Scheme_Color::COLOR_1,
|
228 |
-
],
|
229 |
-
'selectors' => [
|
230 |
-
'{{WRAPPER}} .eae-separator-title' => 'color: {{VALUE}};',
|
231 |
-
],
|
232 |
-
]
|
233 |
-
);
|
234 |
-
|
235 |
-
$this->add_group_control(
|
236 |
-
Group_Control_Typography::get_type(),
|
237 |
-
[
|
238 |
-
'name' => 'typography',
|
239 |
-
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
240 |
-
'selector' => '{{WRAPPER}} .eae-separator-title',
|
241 |
-
]
|
242 |
-
);
|
243 |
-
|
244 |
-
$this->end_controls_section();
|
245 |
-
$this->start_controls_section(
|
246 |
-
'section_divider_style',
|
247 |
-
[
|
248 |
-
'label' => __( 'Divider', '
|
249 |
-
'tab' => Controls_Manager::TAB_STYLE,
|
250 |
-
]
|
251 |
-
);
|
252 |
-
|
253 |
-
$this->add_control(
|
254 |
-
'divider_color',
|
255 |
-
[
|
256 |
-
'label' => __( 'Divider Color', '
|
257 |
-
'type' => Controls_Manager::COLOR,
|
258 |
-
'scheme' => [
|
259 |
-
'type' => Scheme_Color::get_type(),
|
260 |
-
'value' => Scheme_Color::COLOR_1,
|
261 |
-
],
|
262 |
-
'selectors' => [
|
263 |
-
'{{WRAPPER}} .eae-sep-lines' => 'border-top-color: {{VALUE}};',
|
264 |
-
],
|
265 |
-
]
|
266 |
-
);
|
267 |
-
|
268 |
-
$this->add_responsive_control(
|
269 |
-
'divider_width',
|
270 |
-
[
|
271 |
-
'label' => __( 'Width', '
|
272 |
-
'type' => Controls_Manager::SLIDER,
|
273 |
-
'size_units' => [ '%' ],
|
274 |
-
'default' => [
|
275 |
-
'size' => 100,
|
276 |
-
'unit' => '%',
|
277 |
-
],
|
278 |
-
'range' => [
|
279 |
-
'%' => [
|
280 |
-
'min' => 1,
|
281 |
-
'max' => 100,
|
282 |
-
],
|
283 |
-
],
|
284 |
-
'selectors' => [
|
285 |
-
'{{WRAPPER}} .wts-eae-textseparator' => 'width: {{SIZE}}{{UNIT}};',
|
286 |
-
],
|
287 |
-
]
|
288 |
-
);
|
289 |
-
|
290 |
-
$this->add_responsive_control(
|
291 |
-
'divider_align',
|
292 |
-
[
|
293 |
-
'label' => __( 'Alignment', '
|
294 |
-
'type' => Controls_Manager::CHOOSE,
|
295 |
-
'options' => [
|
296 |
-
'left' => [
|
297 |
-
'title' => __( 'Left', '
|
298 |
-
'icon' => 'fa fa-align-left',
|
299 |
-
],
|
300 |
-
'' => [
|
301 |
-
'title' => __( 'Center', '
|
302 |
-
'icon' => 'fa fa-align-center',
|
303 |
-
],
|
304 |
-
'right' => [
|
305 |
-
'title' => __( 'Right', '
|
306 |
-
'icon' => 'fa fa-align-right',
|
307 |
-
]
|
308 |
-
],
|
309 |
-
'default' => '',
|
310 |
-
'selectors' => [
|
311 |
-
'{{WRAPPER}} .wts-eae-textseparator' => 'float: {{VALUE}};',
|
312 |
-
]
|
313 |
-
]
|
314 |
-
);
|
315 |
-
|
316 |
-
$this->end_controls_section();
|
317 |
-
$this->start_controls_section(
|
318 |
-
'section_icon_style',
|
319 |
-
[
|
320 |
-
'label' => __( 'Icon', '
|
321 |
-
'tab' => Controls_Manager::TAB_STYLE,
|
322 |
-
]
|
323 |
-
);
|
324 |
-
|
325 |
-
$this->add_control(
|
326 |
-
'icon_primary_color',
|
327 |
-
[
|
328 |
-
'label' => __( 'Primary Color', '
|
329 |
-
'type' => Controls_Manager::COLOR,
|
330 |
-
'scheme' => [
|
331 |
-
'type' => Scheme_Color::get_type(),
|
332 |
-
'value' => Scheme_Color::COLOR_1,
|
333 |
-
],
|
334 |
-
'selectors' => [
|
335 |
-
'{{WRAPPER}} .eae-separator-icon-inner i' => 'color: {{VALUE}};',
|
336 |
-
],
|
337 |
-
]
|
338 |
-
);
|
339 |
-
|
340 |
-
$this->add_control(
|
341 |
-
'icon_secondary_color',
|
342 |
-
[
|
343 |
-
'label' => __( 'Secondary Color', '
|
344 |
-
'type' => Controls_Manager::COLOR,
|
345 |
-
'scheme' => [
|
346 |
-
'type' => Scheme_Color::get_type(),
|
347 |
-
'value' => Scheme_Color::COLOR_1,
|
348 |
-
],
|
349 |
-
'selectors' => [
|
350 |
-
'{{WRAPPER}}.eae-icon-view-stacked .eae-separator-icon-inner' => 'background-color: {{VALUE}};',
|
351 |
-
'{{WRAPPER}}.eae-icon-view-framed .eae-separator-icon-inner, {{WRAPPER}}.eae-icon-view-default .eae-separator-icon-inner' => 'color: {{VALUE}}; border-color: {{VALUE}};',
|
352 |
-
],
|
353 |
-
]
|
354 |
-
);
|
355 |
-
|
356 |
-
|
357 |
-
$this->add_control(
|
358 |
-
'size',
|
359 |
-
[
|
360 |
-
'label' => __( 'Icon Size', '
|
361 |
-
'type' => Controls_Manager::SLIDER,
|
362 |
-
'range' => [
|
363 |
-
'px' => [
|
364 |
-
'min' => 6,
|
365 |
-
'max' => 300,
|
366 |
-
],
|
367 |
-
],
|
368 |
-
'selectors' => [
|
369 |
-
'{{WRAPPER}} .eae-separator-icon-inner i' => 'font-size: {{SIZE}}{{UNIT}};',
|
370 |
-
],
|
371 |
-
]
|
372 |
-
);
|
373 |
-
|
374 |
-
$this->add_control(
|
375 |
-
'icon_padding',
|
376 |
-
[
|
377 |
-
'label' => __( 'Icon Padding', '
|
378 |
-
'type' => Controls_Manager::SLIDER,
|
379 |
-
|
380 |
-
'selectors' => [
|
381 |
-
'{{WRAPPER}} .eae-separator-icon-inner' => 'padding: {{SIZE}}{{UNIT}};',
|
382 |
-
],
|
383 |
-
'default' => [
|
384 |
-
'size' => 1.5,
|
385 |
-
'unit' => 'em',
|
386 |
-
],
|
387 |
-
'range' => [
|
388 |
-
'em' => [
|
389 |
-
'min' => 0,
|
390 |
-
],
|
391 |
-
],
|
392 |
-
'condition' => [
|
393 |
-
'view!' => 'default',
|
394 |
-
],
|
395 |
-
]
|
396 |
-
);
|
397 |
-
|
398 |
-
$this->add_control(
|
399 |
-
'rotate',
|
400 |
-
[
|
401 |
-
'label' => __( 'Icon Rotate', '
|
402 |
-
'type' => Controls_Manager::SLIDER,
|
403 |
-
'default' => [
|
404 |
-
'size' => 0,
|
405 |
-
'unit' => 'deg',
|
406 |
-
],
|
407 |
-
|
408 |
-
'selectors' => [
|
409 |
-
'{{WRAPPER}} .eae-separator-icon-inner i' => 'transform: rotate({{SIZE}}{{UNIT}});',
|
410 |
-
],
|
411 |
-
]
|
412 |
-
);
|
413 |
-
|
414 |
-
$this->add_control(
|
415 |
-
'border_width',
|
416 |
-
[
|
417 |
-
'label' => __( 'Border Width', '
|
418 |
-
'type' => Controls_Manager::DIMENSIONS,
|
419 |
-
'selectors' => [
|
420 |
-
'{{WRAPPER}} .eae-separator-icon-inner' => 'border-width: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
421 |
-
],
|
422 |
-
'condition' => [
|
423 |
-
'view' => 'framed',
|
424 |
-
],
|
425 |
-
]
|
426 |
-
);
|
427 |
-
|
428 |
-
$this->add_control(
|
429 |
-
'border_radius',
|
430 |
-
[
|
431 |
-
'label' => __( 'Border Radius', '
|
432 |
-
'type' => Controls_Manager::DIMENSIONS,
|
433 |
-
'size_units' => [ 'px', '%' ],
|
434 |
-
'selectors' => [
|
435 |
-
'{{WRAPPER}} .eae-separator-icon-inner' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
436 |
-
],
|
437 |
-
'condition' => [
|
438 |
-
'view!' => 'default',
|
439 |
-
],
|
440 |
-
]
|
441 |
-
);
|
442 |
-
}
|
443 |
-
|
444 |
-
protected function render( ) {
|
445 |
-
$settings = $this->get_settings_for_display();
|
446 |
-
|
447 |
-
$this->add_render_attribute('separator_wrapper','class','wts-eae-textseparator');
|
448 |
-
$this->add_render_attribute('separator_wrapper','class','sep-align-'.$settings['align']);
|
449 |
-
if(!empty($settings['icon'])){
|
450 |
-
$this->add_render_attribute('separator_wrapper','class','icon-yes');
|
451 |
-
$this->add_render_attribute('separator_wrapper','class','icon-'.$settings['icon_position']);
|
452 |
-
}
|
453 |
-
|
454 |
-
if(!empty($settings['title'])){
|
455 |
-
$this->add_render_attribute('separator_wrapper','class','title-yes');
|
456 |
-
}
|
457 |
-
|
458 |
-
$this->add_render_attribute( 'title', 'class', 'eae-separator-title' );
|
459 |
-
|
460 |
-
$this->add_inline_editing_attributes( 'title' );
|
461 |
-
|
462 |
-
$separator_html = '<div '.$this->get_render_attribute_string('separator_wrapper').'>
|
463 |
-
|
464 |
-
<div class="eae-sep-holder sep-left">
|
465 |
-
<div class="eae-sep-lines"></div>
|
466 |
-
</div>';
|
467 |
-
|
468 |
-
|
469 |
-
|
470 |
-
|
471 |
-
if(!empty($settings['icon']) && $settings['icon_position'] == 'before'){
|
472 |
-
$separator_html .= '<div class="eae-separator-icon-wrapper"><div class="eae-separator-icon-inner">
|
473 |
-
<i class="'.$settings['icon'].'"></i>
|
474 |
-
</div></div>';
|
475 |
-
}
|
476 |
-
|
477 |
-
if($settings['title'] != ''){
|
478 |
-
$separator_html .= sprintf( '<%1$s %2$s>%3$s</%1$s>', $settings['html_tag'], $this->get_render_attribute_string( 'title' ), $settings['title'] );
|
479 |
-
}
|
480 |
-
|
481 |
-
if(!empty($settings['icon']) && $settings['icon_position'] == 'after'){
|
482 |
-
$separator_html .= '<div class="eae-separator-icon-wrapper"><div class="eae-separator-icon-inner">
|
483 |
-
<i class="'.$settings['icon'].'"></i>
|
484 |
-
</div></div>';
|
485 |
-
}
|
486 |
-
|
487 |
-
|
488 |
-
$separator_html .= '<div class="eae-sep-holder sep-right">
|
489 |
-
<div class="eae-sep-lines"></div>
|
490 |
-
</div>
|
491 |
-
</div>';
|
492 |
-
|
493 |
-
|
494 |
-
|
495 |
-
|
496 |
-
|
497 |
-
|
498 |
-
echo $separator_html;
|
499 |
-
}
|
500 |
-
|
501 |
-
protected function _content_template() {
|
502 |
-
?>
|
503 |
-
<#
|
504 |
-
|
505 |
-
icon_class = settings.icon != ''? 'icon-yes':'';
|
506 |
-
title_class = settings.title != ''? 'title-yes':'';
|
507 |
-
var separator_html = '<div class="wts-eae-textseparator sep-align-' + settings.align + ' icon-' + settings.icon_position + ' ' + icon_class + ' ' + title_class +'"><div class="eae-sep-holder sep-left"><div class="eae-sep-lines"></div></div>';
|
508 |
-
|
509 |
-
if(settings.icon != '' && settings.icon_position == 'before'){
|
510 |
-
separator_html += '<div class="eae-separator-icon-wrapper"><div class="eae-separator-icon-inner"><i class="'+ settings.icon +'"></i></div></div>'
|
511 |
-
}
|
512 |
-
|
513 |
-
if(settings.title != ''){
|
514 |
-
separator_html += '<' + settings.html_tag + ' class="eae-separator-title elementor-inline-editing" data-elementor-setting-key="title">' + settings.title + '</' + settings.html_tag + '>';
|
515 |
-
}
|
516 |
-
|
517 |
-
|
518 |
-
if(settings.icon != '' && settings.icon_position == 'after'){
|
519 |
-
separator_html += '<div class="eae-separator-icon-wrapper"><div class="eae-separator-icon-inner"><i class="'+ settings.icon +'"></i></div></div>'
|
520 |
-
}
|
521 |
-
|
522 |
-
separator_html += '<div class="eae-sep-holder sep-right"><div class="eae-sep-lines"></div></div></div>';
|
523 |
-
|
524 |
-
print( separator_html );
|
525 |
-
#>
|
526 |
-
<?php
|
527 |
-
}
|
528 |
-
}
|
529 |
-
|
530 |
-
|
531 |
-
Plugin::instance()->widgets_manager->register_widget_type( new Widget_TextSeparator() );
|
1 |
+
<?php
|
2 |
+
namespace Elementor;
|
3 |
+
|
4 |
+
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
|
5 |
+
|
6 |
+
class Widget_TextSeparator extends Widget_Base {
|
7 |
+
|
8 |
+
public function get_name() {
|
9 |
+
return 'wts-textseparator';
|
10 |
+
}
|
11 |
+
|
12 |
+
public function get_title() {
|
13 |
+
return __( 'EAE - Text Separator', 'wts-eae' );
|
14 |
+
}
|
15 |
+
|
16 |
+
public function get_icon() {
|
17 |
+
return 'eicon-divider wts-eae-pe';
|
18 |
+
}
|
19 |
+
|
20 |
+
|
21 |
+
public function get_categories() {
|
22 |
+
return [ 'wts-eae' ];
|
23 |
+
}
|
24 |
+
|
25 |
+
|
26 |
+
|
27 |
+
|
28 |
+
protected function _register_controls() {
|
29 |
+
$this->start_controls_section(
|
30 |
+
'section_title',
|
31 |
+
[
|
32 |
+
'label' => __( 'Title', 'wts-eae' )
|
33 |
+
]
|
34 |
+
);
|
35 |
+
|
36 |
+
$this->add_control(
|
37 |
+
'title',
|
38 |
+
[
|
39 |
+
'label' => __( 'Title', 'wts-eae' ),
|
40 |
+
'type' => Controls_Manager::TEXTAREA,
|
41 |
+
'dynamic' => [
|
42 |
+
'active' => true,
|
43 |
+
],
|
44 |
+
'label_block' => true,
|
45 |
+
'placeholder' => __( 'Enter text', 'wts-eae' ),
|
46 |
+
'default' => __( 'This is text separator', 'wts-eae' )
|
47 |
+
]
|
48 |
+
);
|
49 |
+
|
50 |
+
$this->add_control(
|
51 |
+
'html_tag',
|
52 |
+
[
|
53 |
+
'label' => __( 'HTML Tag', 'wts-eae' ),
|
54 |
+
'type' => Controls_Manager::SELECT,
|
55 |
+
'options' => [
|
56 |
+
'h1' => __( 'H1', 'wts-eae' ),
|
57 |
+
'h2' => __( 'H2', 'wts-eae' ),
|
58 |
+
'h3' => __( 'H3', 'wts-eae' ),
|
59 |
+
'h4' => __( 'H4', 'wts-eae' ),
|
60 |
+
'h5' => __( 'H5', 'wts-eae' ),
|
61 |
+
'h6' => __( 'H6', 'wts-eae' ),
|
62 |
+
'div' => __( 'div', 'wts-eae' ),
|
63 |
+
'span' => __( 'span', 'wts-eae' ),
|
64 |
+
'p' => __( 'p', 'wts-eae' ),
|
65 |
+
],
|
66 |
+
'default' => 'h2',
|
67 |
+
]
|
68 |
+
);
|
69 |
+
|
70 |
+
$this->add_responsive_control(
|
71 |
+
'align',
|
72 |
+
[
|
73 |
+
'label' => __( 'Alignment', 'wts-eae' ),
|
74 |
+
'type' => Controls_Manager::CHOOSE,
|
75 |
+
'options' => [
|
76 |
+
'left' => [
|
77 |
+
'title' => __( 'Left', 'wts-eae' ),
|
78 |
+
'icon' => 'fa fa-align-left',
|
79 |
+
],
|
80 |
+
'center' => [
|
81 |
+
'title' => __( 'Center', 'wts-eae' ),
|
82 |
+
'icon' => 'fa fa-align-center',
|
83 |
+
],
|
84 |
+
'right' => [
|
85 |
+
'title' => __( 'Right', 'wts-eae' ),
|
86 |
+
'icon' => 'fa fa-align-right',
|
87 |
+
]
|
88 |
+
],
|
89 |
+
'default' => 'center'
|
90 |
+
]
|
91 |
+
);
|
92 |
+
|
93 |
+
$this->end_controls_section();
|
94 |
+
|
95 |
+
$this->start_controls_section(
|
96 |
+
'section_icon',
|
97 |
+
[
|
98 |
+
'label' => __( 'Icon', 'wts-eae' ),
|
99 |
+
'type' => Controls_Manager::SECTION,
|
100 |
+
]
|
101 |
+
);
|
102 |
+
|
103 |
+
|
104 |
+
$this->add_control(
|
105 |
+
'icon',
|
106 |
+
[
|
107 |
+
'label' => __( 'Icon', 'wts-eae' ),
|
108 |
+
'type' => Controls_Manager::ICON,
|
109 |
+
'label_block' => true,
|
110 |
+
'default' => 'fa fa-star'
|
111 |
+
]
|
112 |
+
);
|
113 |
+
|
114 |
+
$this->add_control(
|
115 |
+
'view',
|
116 |
+
[
|
117 |
+
'label' => __( 'View', 'wts-eae' ),
|
118 |
+
'type' => Controls_Manager::SELECT,
|
119 |
+
'options' => [
|
120 |
+
'default' => __( 'Default', 'wts-eae' ),
|
121 |
+
'stacked' => __( 'Stacked', 'wts-eae' ),
|
122 |
+
'framed' => __( 'Framed', 'wts-eae' ),
|
123 |
+
],
|
124 |
+
'default' => 'default',
|
125 |
+
'prefix_class' => 'eae-icon-view-',
|
126 |
+
]
|
127 |
+
);
|
128 |
+
|
129 |
+
$this->add_control(
|
130 |
+
'shape',
|
131 |
+
[
|
132 |
+
'label' => __( 'Shape', 'wts-eae' ),
|
133 |
+
'type' => Controls_Manager::SELECT,
|
134 |
+
'options' => [
|
135 |
+
'circle' => __( 'Circle', 'wts-eae' ),
|
136 |
+
'square' => __( 'Square', 'wts-eae' ),
|
137 |
+
],
|
138 |
+
'default' => 'circle',
|
139 |
+
'condition' => [
|
140 |
+
'view!' => 'default',
|
141 |
+
],
|
142 |
+
'prefix_class' => 'eae-icon-shape-',
|
143 |
+
]
|
144 |
+
);
|
145 |
+
|
146 |
+
$this->add_control(
|
147 |
+
'icon_position',
|
148 |
+
[
|
149 |
+
'label' => __('Icon Position','wts_eae'),
|
150 |
+
'type' => Controls_Manager::SELECT,
|
151 |
+
'options' => [
|
152 |
+
'before' => __( 'Before Text', 'wts-eae' ),
|
153 |
+
'after' => __( 'After Text', 'wts-eae' )
|
154 |
+
],
|
155 |
+
'default' => 'before',
|
156 |
+
]
|
157 |
+
);
|
158 |
+
|
159 |
+
$this->end_controls_section();
|
160 |
+
|
161 |
+
$this->start_controls_section(
|
162 |
+
'section_divider',
|
163 |
+
[
|
164 |
+
'label' => __( 'Divider', 'wts-eae' ),
|
165 |
+
'type' => Controls_Manager::SECTION,
|
166 |
+
]
|
167 |
+
);
|
168 |
+
|
169 |
+
$this->add_control(
|
170 |
+
'style',
|
171 |
+
[
|
172 |
+
'label' => __( 'Style', 'wts-eae' ),
|
173 |
+
'type' => Controls_Manager::SELECT,
|
174 |
+
'options' => [
|
175 |
+
'solid' => __( 'Solid', 'wts-eae' ),
|
176 |
+
'double' => __( 'Double', 'wts-eae' ),
|
177 |
+
'dotted' => __( 'Dotted', 'wts-eae' ),
|
178 |
+
'dashed' => __( 'Dashed', 'wts-eae' ),
|
179 |
+
],
|
180 |
+
'default' => 'solid',
|
181 |
+
'selectors' => [
|
182 |
+
'{{WRAPPER}} .wts-eae-textseparator .eae-sep-holder .eae-sep-lines' => 'border-top-style: {{VALUE}};',
|
183 |
+
],
|
184 |
+
]
|
185 |
+
);
|
186 |
+
|
187 |
+
$this->add_control(
|
188 |
+
'weight',
|
189 |
+
[
|
190 |
+
'label' => __( 'Weight', 'wts-eae' ),
|
191 |
+
'type' => Controls_Manager::SLIDER,
|
192 |
+
'default' => [
|
193 |
+
'size' => 1,
|
194 |
+
],
|
195 |
+
'range' => [
|
196 |
+
'px' => [
|
197 |
+
'min' => 1,
|
198 |
+
'max' => 10,
|
199 |
+
],
|
200 |
+
],
|
201 |
+
'selectors' => [
|
202 |
+
'{{WRAPPER}} .wts-eae-textseparator .eae-sep-holder .eae-sep-lines' => 'border-top-width: {{SIZE}}{{UNIT}};',
|
203 |
+
],
|
204 |
+
]
|
205 |
+
);
|
206 |
+
|
207 |
+
|
208 |
+
|
209 |
+
|
210 |
+
$this->end_controls_section();
|
211 |
+
|
212 |
+
$this->start_controls_section(
|
213 |
+
'section_title_style',
|
214 |
+
[
|
215 |
+
'label' => __( 'Title', 'wts-eae' ),
|
216 |
+
'tab' => Controls_Manager::TAB_STYLE
|
217 |
+
]
|
218 |
+
);
|
219 |
+
|
220 |
+
$this->add_control(
|
221 |
+
'title_color',
|
222 |
+
[
|
223 |
+
'label' => __( 'Text Color', 'wts-eae' ),
|
224 |
+
'type' => Controls_Manager::COLOR,
|
225 |
+
'scheme' => [
|
226 |
+
'type' => Scheme_Color::get_type(),
|
227 |
+
'value' => Scheme_Color::COLOR_1,
|
228 |
+
],
|
229 |
+
'selectors' => [
|
230 |
+
'{{WRAPPER}} .eae-separator-title' => 'color: {{VALUE}};',
|
231 |
+
],
|
232 |
+
]
|
233 |
+
);
|
234 |
+
|
235 |
+
$this->add_group_control(
|
236 |
+
Group_Control_Typography::get_type(),
|
237 |
+
[
|
238 |
+
'name' => 'typography',
|
239 |
+
'scheme' => Scheme_Typography::TYPOGRAPHY_1,
|
240 |
+
'selector' => '{{WRAPPER}} .eae-separator-title',
|
241 |
+
]
|
242 |
+
);
|
243 |
+
|
244 |
+
$this->end_controls_section();
|
245 |
+
$this->start_controls_section(
|
246 |
+
'section_divider_style',
|
247 |
+
[
|
248 |
+
'label' => __( 'Divider', 'wts-eae' ),
|
249 |
+
'tab' => Controls_Manager::TAB_STYLE,
|
250 |
+
]
|
251 |
+
);
|
252 |
+
|
253 |
+
$this->add_control(
|
254 |
+
'divider_color',
|
255 |
+
[
|
256 |
+
'label' => __( 'Divider Color', 'wts-eae' ),
|
257 |
+
'type' => Controls_Manager::COLOR,
|
258 |
+
'scheme' => [
|
259 |
+
'type' => Scheme_Color::get_type(),
|
260 |
+
'value' => Scheme_Color::COLOR_1,
|
261 |
+
],
|
262 |
+
'selectors' => [
|
263 |
+
'{{WRAPPER}} .eae-sep-lines' => 'border-top-color: {{VALUE}};',
|
264 |
+
],
|
265 |
+
]
|
266 |
+
);
|
267 |
+
|
268 |
+
$this->add_responsive_control(
|
269 |
+
'divider_width',
|
270 |
+
[
|
271 |
+
'label' => __( 'Width', 'wts-eae' ),
|
272 |
+
'type' => Controls_Manager::SLIDER,
|
273 |
+
'size_units' => [ '%' ],
|
274 |
+
'default' => [
|
275 |
+
'size' => 100,
|
276 |
+
'unit' => '%',
|
277 |
+
],
|
278 |
+
'range' => [
|
279 |
+
'%' => [
|
280 |
+
'min' => 1,
|
281 |
+
'max' => 100,
|
282 |
+
],
|
283 |
+
],
|
284 |
+
'selectors' => [
|
285 |
+
'{{WRAPPER}} .wts-eae-textseparator' => 'width: {{SIZE}}{{UNIT}};',
|
286 |
+
],
|
287 |
+
]
|
288 |
+
);
|
289 |
+
|
290 |
+
$this->add_responsive_control(
|
291 |
+
'divider_align',
|
292 |
+
[
|
293 |
+
'label' => __( 'Alignment', 'wts-eae' ),
|
294 |
+
'type' => Controls_Manager::CHOOSE,
|
295 |
+
'options' => [
|
296 |
+
'left' => [
|
297 |
+
'title' => __( 'Left', 'wts-eae' ),
|
298 |
+
'icon' => 'fa fa-align-left',
|
299 |
+
],
|
300 |
+
'' => [
|
301 |
+
'title' => __( 'Center', 'wts-eae' ),
|
302 |
+
'icon' => 'fa fa-align-center',
|
303 |
+
],
|
304 |
+
'right' => [
|
305 |
+
'title' => __( 'Right', 'wts-eae' ),
|
306 |
+
'icon' => 'fa fa-align-right',
|
307 |
+
]
|
308 |
+
],
|
309 |
+
'default' => '',
|
310 |
+
'selectors' => [
|
311 |
+
'{{WRAPPER}} .wts-eae-textseparator' => 'float: {{VALUE}};',
|
312 |
+
]
|
313 |
+
]
|
314 |
+
);
|
315 |
+
|
316 |
+
$this->end_controls_section();
|
317 |
+
$this->start_controls_section(
|
318 |
+
'section_icon_style',
|
319 |
+
[
|
320 |
+
'label' => __( 'Icon', 'wts-eae' ),
|
321 |
+
'tab' => Controls_Manager::TAB_STYLE,
|
322 |
+
]
|
323 |
+
);
|
324 |
+
|
325 |
+
$this->add_control(
|
326 |
+
'icon_primary_color',
|
327 |
+
[
|
328 |
+
'label' => __( 'Primary Color', 'wts-eae' ),
|
329 |
+
'type' => Controls_Manager::COLOR,
|
330 |
+
'scheme' => [
|
331 |
+
'type' => Scheme_Color::get_type(),
|
332 |
+
'value' => Scheme_Color::COLOR_1,
|
333 |
+
],
|
334 |
+
'selectors' => [
|
335 |
+
'{{WRAPPER}} .eae-separator-icon-inner i' => 'color: {{VALUE}};',
|
336 |
+
],
|
337 |
+
]
|
338 |
+
);
|
339 |
+
|
340 |
+
$this->add_control(
|
341 |
+
'icon_secondary_color',
|
342 |
+
[
|
343 |
+
'label' => __( 'Secondary Color', 'wts-eae' ),
|
344 |
+
'type' => Controls_Manager::COLOR,
|
345 |
+
'scheme' => [
|
346 |
+
'type' => Scheme_Color::get_type(),
|
347 |
+
'value' => Scheme_Color::COLOR_1,
|
348 |
+
],
|
349 |
+
'selectors' => [
|
350 |
+
'{{WRAPPER}}.eae-icon-view-stacked .eae-separator-icon-inner' => 'background-color: {{VALUE}};',
|
351 |
+
'{{WRAPPER}}.eae-icon-view-framed .eae-separator-icon-inner, {{WRAPPER}}.eae-icon-view-default .eae-separator-icon-inner' => 'color: {{VALUE}}; border-color: {{VALUE}};',
|
352 |
+
],
|
353 |
+
]
|
354 |
+
);
|
355 |
+
|
356 |
+
|
357 |
+
$this->add_control(
|
358 |
+
'size',
|
359 |
+
[
|
360 |
+
'label' => __( 'Icon Size', 'wts-eae' ),
|
361 |
+
'type' => Controls_Manager::SLIDER,
|
362 |
+
'range' => [
|
363 |
+
'px' => [
|
364 |
+
'min' => 6,
|
365 |
+
'max' => 300,
|
366 |
+
],
|
367 |
+
],
|
368 |
+
'selectors' => [
|
369 |
+
'{{WRAPPER}} .eae-separator-icon-inner i' => 'font-size: {{SIZE}}{{UNIT}};',
|
370 |
+
],
|
371 |
+
]
|
372 |
+
);
|
373 |
+
|
374 |
+
$this->add_control(
|
375 |
+
'icon_padding',
|
376 |
+
[
|
377 |
+
'label' => __( 'Icon Padding', 'wts-eae' ),
|
378 |
+
'type' => Controls_Manager::SLIDER,
|
379 |
+
|
380 |
+
'selectors' => [
|
381 |
+
'{{WRAPPER}} .eae-separator-icon-inner' => 'padding: {{SIZE}}{{UNIT}};',
|
382 |
+
],
|
383 |
+
'default' => [
|
384 |
+
'size' => 1.5,
|
385 |
+
'unit' => 'em',
|
386 |
+
],
|
387 |
+
'range' => [
|
388 |
+
'em' => [
|
389 |
+
'min' => 0,
|
390 |
+
],
|
391 |
+
],
|
392 |
+
'condition' => [
|
393 |
+
'view!' => 'default',
|
394 |
+
],
|
395 |
+
]
|
396 |
+
);
|
397 |
+
|
398 |
+
$this->add_control(
|
399 |
+
'rotate',
|
400 |
+
[
|
401 |
+
'label' => __( 'Icon Rotate', 'wts-eae' ),
|
402 |
+
'type' => Controls_Manager::SLIDER,
|
403 |
+
'default' => [
|
404 |
+
'size' => 0,
|
405 |
+
'unit' => 'deg',
|
406 |
+
],
|
407 |
+
|
408 |
+
'selectors' => [
|
409 |
+
'{{WRAPPER}} .eae-separator-icon-inner i' => 'transform: rotate({{SIZE}}{{UNIT}});',
|
410 |
+
],
|
411 |
+
]
|
412 |
+
);
|
413 |
+
|
414 |
+
$this->add_control(
|
415 |
+
'border_width',
|
416 |
+
[
|
417 |
+
'label' => __( 'Border Width', 'wts-eae' ),
|
418 |
+
'type' => Controls_Manager::DIMENSIONS,
|
419 |
+
'selectors' => [
|
420 |
+
'{{WRAPPER}} .eae-separator-icon-inner' => 'border-width: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
421 |
+
],
|
422 |
+
'condition' => [
|
423 |
+
'view' => 'framed',
|
424 |
+
],
|
425 |
+
]
|
426 |
+
);
|
427 |
+
|
428 |
+
$this->add_control(
|
429 |
+
'border_radius',
|
430 |
+
[
|
431 |
+
'label' => __( 'Border Radius', 'wts-eae' ),
|
432 |
+
'type' => Controls_Manager::DIMENSIONS,
|
433 |
+
'size_units' => [ 'px', '%' ],
|
434 |
+
'selectors' => [
|
435 |
+
'{{WRAPPER}} .eae-separator-icon-inner' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
436 |
+
],
|
437 |
+
'condition' => [
|
438 |
+
'view!' => 'default',
|
439 |
+
],
|
440 |
+
]
|
441 |
+
);
|
442 |
+
}
|
443 |
+
|
444 |
+
protected function render( ) {
|
445 |
+
$settings = $this->get_settings_for_display();
|
446 |
+
|
447 |
+
$this->add_render_attribute('separator_wrapper','class','wts-eae-textseparator');
|
448 |
+
$this->add_render_attribute('separator_wrapper','class','sep-align-'.$settings['align']);
|
449 |
+
if(!empty($settings['icon'])){
|
450 |
+
$this->add_render_attribute('separator_wrapper','class','icon-yes');
|
451 |
+
$this->add_render_attribute('separator_wrapper','class','icon-'.$settings['icon_position']);
|
452 |
+
}
|
453 |
+
|
454 |
+
if(!empty($settings['title'])){
|
455 |
+
$this->add_render_attribute('separator_wrapper','class','title-yes');
|
456 |
+
}
|
457 |
+
|
458 |
+
$this->add_render_attribute( 'title', 'class', 'eae-separator-title' );
|
459 |
+
|
460 |
+
$this->add_inline_editing_attributes( 'title' );
|
461 |
+
|
462 |
+
$separator_html = '<div '.$this->get_render_attribute_string('separator_wrapper').'>
|
463 |
+
|
464 |
+
<div class="eae-sep-holder sep-left">
|
465 |
+
<div class="eae-sep-lines"></div>
|
466 |
+
</div>';
|
467 |
+
|
468 |
+
|
469 |
+
|
470 |
+
|
471 |
+
if(!empty($settings['icon']) && $settings['icon_position'] == 'before'){
|
472 |
+
$separator_html .= '<div class="eae-separator-icon-wrapper"><div class="eae-separator-icon-inner">
|
473 |
+
<i class="'.$settings['icon'].'"></i>
|
474 |
+
</div></div>';
|
475 |
+
}
|
476 |
+
|
477 |
+
if($settings['title'] != ''){
|
478 |
+
$separator_html .= sprintf( '<%1$s %2$s>%3$s</%1$s>', $settings['html_tag'], $this->get_render_attribute_string( 'title' ), $settings['title'] );
|
479 |
+
}
|
480 |
+
|
481 |
+
if(!empty($settings['icon']) && $settings['icon_position'] == 'after'){
|
482 |
+
$separator_html .= '<div class="eae-separator-icon-wrapper"><div class="eae-separator-icon-inner">
|
483 |
+
<i class="'.$settings['icon'].'"></i>
|
484 |
+
</div></div>';
|
485 |
+
}
|
486 |
+
|
487 |
+
|
488 |
+
$separator_html .= '<div class="eae-sep-holder sep-right">
|
489 |
+
<div class="eae-sep-lines"></div>
|
490 |
+
</div>
|
491 |
+
</div>';
|
492 |
+
|
493 |
+
|
494 |
+
|
495 |
+
|
496 |
+
|
497 |
+
|
498 |
+
echo $separator_html;
|
499 |
+
}
|
500 |
+
|
501 |
+
protected function _content_template() {
|
502 |
+
?>
|
503 |
+
<#
|
504 |
+
|
505 |
+
icon_class = settings.icon != ''? 'icon-yes':'';
|
506 |
+
title_class = settings.title != ''? 'title-yes':'';
|
507 |
+
var separator_html = '<div class="wts-eae-textseparator sep-align-' + settings.align + ' icon-' + settings.icon_position + ' ' + icon_class + ' ' + title_class +'"><div class="eae-sep-holder sep-left"><div class="eae-sep-lines"></div></div>';
|
508 |
+
|
509 |
+
if(settings.icon != '' && settings.icon_position == 'before'){
|
510 |
+
separator_html += '<div class="eae-separator-icon-wrapper"><div class="eae-separator-icon-inner"><i class="'+ settings.icon +'"></i></div></div>'
|
511 |
+
}
|
512 |
+
|
513 |
+
if(settings.title != ''){
|
514 |
+
separator_html += '<' + settings.html_tag + ' class="eae-separator-title elementor-inline-editing" data-elementor-setting-key="title">' + settings.title + '</' + settings.html_tag + '>';
|
515 |
+
}
|
516 |
+
|
517 |
+
|
518 |
+
if(settings.icon != '' && settings.icon_position == 'after'){
|
519 |
+
separator_html += '<div class="eae-separator-icon-wrapper"><div class="eae-separator-icon-inner"><i class="'+ settings.icon +'"></i></div></div>'
|
520 |
+
}
|
521 |
+
|
522 |
+
separator_html += '<div class="eae-sep-holder sep-right"><div class="eae-sep-lines"></div></div></div>';
|
523 |
+
|
524 |
+
print( separator_html );
|
525 |
+
#>
|
526 |
+
<?php
|
527 |
+
}
|
528 |
+
}
|
529 |
+
|
530 |
+
|
531 |
+
Plugin::instance()->widgets_manager->register_widget_type( new Widget_TextSeparator() );
|
elements/twitter.php
CHANGED
@@ -1,964 +1,964 @@
|
|
1 |
-
<?php
|
2 |
-
|
3 |
-
namespace EAE;
|
4 |
-
|
5 |
-
use Elementor\Controls_Manager;
|
6 |
-
use Elementor\Widget_Base;
|
7 |
-
use Elementor\Plugin;
|
8 |
-
use Elementor\Scheme_Color;
|
9 |
-
|
10 |
-
if ( ! defined( 'ABSPATH' ) ) {
|
11 |
-
exit;
|
12 |
-
} //Exit if accessed directly
|
13 |
-
|
14 |
-
class EAE_Twitter extends Widget_Base {
|
15 |
-
|
16 |
-
public function get_name() {
|
17 |
-
return 'wts-twitter';
|
18 |
-
}
|
19 |
-
|
20 |
-
public function get_title() {
|
21 |
-
return __( 'EAE - Twitter', 'wts-eae' );
|
22 |
-
}
|
23 |
-
|
24 |
-
public function get_icon() {
|
25 |
-
return 'fa fa-twitter';
|
26 |
-
}
|
27 |
-
|
28 |
-
public function get_categories() {
|
29 |
-
return [ 'wts-eae' ];
|
30 |
-
}
|
31 |
-
protected function _register_controls() {
|
32 |
-
|
33 |
-
$this->start_controls_section(
|
34 |
-
'section_general',
|
35 |
-
[
|
36 |
-
'label' => __( 'General', 'wts-eae' )
|
37 |
-
]
|
38 |
-
);
|
39 |
-
|
40 |
-
$this->add_control(
|
41 |
-
'embed_type',
|
42 |
-
[
|
43 |
-
'label' => __( 'Type', 'wts-eae' ),
|
44 |
-
'type' => Controls_Manager::SELECT,
|
45 |
-
'default' => 'handle',
|
46 |
-
'options' => [
|
47 |
-
//'collection' => 'Collection',
|
48 |
-
//'tweet' => 'Tweet',
|
49 |
-
//'profile' => 'Profile',
|
50 |
-
//'list' => 'List',
|
51 |
-
//'moments' => 'Moments',
|
52 |
-
//'likes' => 'Likes ',
|
53 |
-
'handle' => __( 'Handle', 'wts-eae' ),
|
54 |
-
'hashtag' => __( 'Hashtag', 'wts-eae' ),
|
55 |
-
]
|
56 |
-
]
|
57 |
-
);
|
58 |
-
|
59 |
-
$this->add_control(
|
60 |
-
'url_collection',
|
61 |
-
[
|
62 |
-
'label' => __( 'Enter URL', 'wts-eae' ),
|
63 |
-
'type' => Controls_Manager::TEXT,
|
64 |
-
'placeholder' => __( 'https://twitter.com/webtechhardik', 'wts-eae' ),
|
65 |
-
'default' => 'https://twitter.com/TwitterDev/timelines/539487832448843776',
|
66 |
-
'condition' => [
|
67 |
-
'embed_type' => 'collection'
|
68 |
-
]
|
69 |
-
|
70 |
-
]
|
71 |
-
);
|
72 |
-
|
73 |
-
$this->add_control(
|
74 |
-
'url_profile',
|
75 |
-
[
|
76 |
-
'label' => __( 'Enter URL', 'wts-eae' ),
|
77 |
-
'type' => Controls_Manager::TEXT,
|
78 |
-
'placeholder' => __( 'https://twitter.com/TwitterDev', 'wts-eae' ),
|
79 |
-
'default' => 'https://twitter.com/TwitterDev',
|
80 |
-
'condition' => [
|
81 |
-
'embed_type' => 'profile'
|
82 |
-
]
|
83 |
-
|
84 |
-
]
|
85 |
-
);
|
86 |
-
|
87 |
-
$this->add_control(
|
88 |
-
'url_list',
|
89 |
-
[
|
90 |
-
'label' => __( 'Enter URL', 'wts-eae' ),
|
91 |
-
'type' => Controls_Manager::TEXT,
|
92 |
-
'placeholder' => __( 'https://twitter.com/webtechhardik', 'wts-eae' ),
|
93 |
-
'default' => 'https://twitter.com/TwitterDev/lists/national-parks',
|
94 |
-
'condition' => [
|
95 |
-
'embed_type' => 'list'
|
96 |
-
]
|
97 |
-
|
98 |
-
]
|
99 |
-
);
|
100 |
-
|
101 |
-
$this->add_control(
|
102 |
-
'url_moments',
|
103 |
-
[
|
104 |
-
'label' => __( 'Enter URL', 'wts-eae' ),
|
105 |
-
'type' => Controls_Manager::TEXT,
|
106 |
-
'placeholder' => __( 'https://twitter.com/webtechhardik', 'wts-eae' ),
|
107 |
-
'default' => 'https://twitter.com/i/moments/625792726546558977',
|
108 |
-
'condition' => [
|
109 |
-
'embed_type' => 'moments'
|
110 |
-
]
|
111 |
-
|
112 |
-
]
|
113 |
-
);
|
114 |
-
|
115 |
-
$this->add_control(
|
116 |
-
'url_likes',
|
117 |
-
[
|
118 |
-
'label' => __( 'Enter URL', 'wts-eae' ),
|
119 |
-
'type' => Controls_Manager::TEXT,
|
120 |
-
'placeholder' => __( 'https://twitter.com/webtechhardik', 'wts-eae' ),
|
121 |
-
'default' => 'https://twitter.com/TwitterDev/likes',
|
122 |
-
'condition' => [
|
123 |
-
'embed_type' => 'likes'
|
124 |
-
]
|
125 |
-
|
126 |
-
]
|
127 |
-
);
|
128 |
-
|
129 |
-
$this->add_control(
|
130 |
-
'username',
|
131 |
-
[
|
132 |
-
'label' => __( 'Enter UserName', 'wts-eae' ),
|
133 |
-
'type' => Controls_Manager::TEXT,
|
134 |
-
'placeholder' => __( '@username', 'wts-eae' ),
|
135 |
-
'default' => '@TwitterDev',
|
136 |
-
'condition' => [
|
137 |
-
'embed_type' => 'handle',
|
138 |
-
]
|
139 |
-
]
|
140 |
-
|
141 |
-
);
|
142 |
-
|
143 |
-
|
144 |
-
$this->add_control(
|
145 |
-
'hashtag',
|
146 |
-
[
|
147 |
-
'label' => __( 'Enter Hashtag', 'wts-eae' ),
|
148 |
-
'type' => Controls_Manager::TEXT,
|
149 |
-
'placeholder' => __( '#hashtag', 'wts-eae' ),
|
150 |
-
'condition' => [
|
151 |
-
'embed_type' => 'hashtag',
|
152 |
-
]
|
153 |
-
]
|
154 |
-
|
155 |
-
);
|
156 |
-
|
157 |
-
$this->add_control(
|
158 |
-
'display_mode_collection',
|
159 |
-
[
|
160 |
-
'label' => __( 'Display Mode', 'wts-eae' ),
|
161 |
-
'type' => Controls_Manager::SELECT,
|
162 |
-
'default' => 'timeline',
|
163 |
-
'options' => [
|
164 |
-
'timeline' => __( 'Timeline', 'wts-eae' ),
|
165 |
-
'grid' => __( 'Grid', 'wts-eae' ),
|
166 |
-
],
|
167 |
-
'condition' => [
|
168 |
-
'embed_type' => 'collection'
|
169 |
-
]
|
170 |
-
|
171 |
-
]
|
172 |
-
);
|
173 |
-
|
174 |
-
$this->add_control(
|
175 |
-
'no_of_tweets',
|
176 |
-
[
|
177 |
-
'label' => __( 'Display No of Tweets', 'wts-eae' ),
|
178 |
-
'type' => Controls_Manager::NUMBER,
|
179 |
-
'default' => 20,
|
180 |
-
'min' => '2',
|
181 |
-
'max' => '50',
|
182 |
-
'step' => '1',
|
183 |
-
'condition' => [
|
184 |
-
|
185 |
-
'display_mode_collection' => 'grid',
|
186 |
-
'embed_type' => 'collection',
|
187 |
-
]
|
188 |
-
]
|
189 |
-
);
|
190 |
-
|
191 |
-
/* $this->add_control(
|
192 |
-
'height',
|
193 |
-
[
|
194 |
-
'label' =>__('Height' , 'wts-eae'),
|
195 |
-
'type' =>Controls_Manager::SLIDER,
|
196 |
-
'default' =>[
|
197 |
-
'size' => 500,
|
198 |
-
|
199 |
-
],
|
200 |
-
'range'=>[
|
201 |
-
'px' =>[
|
202 |
-
'min' =>250,
|
203 |
-
'max' =>1300,
|
204 |
-
'step' =>10
|
205 |
-
]
|
206 |
-
],
|
207 |
-
'condition' =>[
|
208 |
-
'embed_type!'=>'moments',
|
209 |
-
'display_mode_collection' => 'timeline',
|
210 |
-
'display_mode_profile' =>'timeline'
|
211 |
-
]
|
212 |
-
]
|
213 |
-
);
|
214 |
-
|
215 |
-
|
216 |
-
|
217 |
-
$this->add_control(
|
218 |
-
'theme',
|
219 |
-
[
|
220 |
-
'label' =>__('Theme' , 'wts-eae'),
|
221 |
-
'type' =>Controls_Manager::SELECT,
|
222 |
-
'default' => 'light',
|
223 |
-
'options' => [
|
224 |
-
'light' => 'Light',
|
225 |
-
'dark' => 'Dark'
|
226 |
-
],
|
227 |
-
'conditions' => [
|
228 |
-
'relation' => 'or',
|
229 |
-
'terms' => [
|
230 |
-
[
|
231 |
-
'name' => 'display_mode_collection',
|
232 |
-
'operator' => 'in',
|
233 |
-
'value' => 'timeline'
|
234 |
-
],
|
235 |
-
[
|
236 |
-
'name' => 'display_mode_profile',
|
237 |
-
'operator' => 'in',
|
238 |
-
'value' => 'timeline'
|
239 |
-
]
|
240 |
-
]
|
241 |
-
]
|
242 |
-
]
|
243 |
-
);
|
244 |
-
|
245 |
-
$this->add_control(
|
246 |
-
'link_color',
|
247 |
-
[
|
248 |
-
'label' =>__('Display Link Color' , 'wts-eae'),
|
249 |
-
'type' =>Controls_Manager::COLOR,
|
250 |
-
'scheme' => [
|
251 |
-
'type' => Scheme_Color::get_type(),
|
252 |
-
'value' => Scheme_Color::COLOR_1,
|
253 |
-
],
|
254 |
-
'conditions' => [
|
255 |
-
'terms' => [
|
256 |
-
[
|
257 |
-
'terms' => [
|
258 |
-
|
259 |
-
[
|
260 |
-
'name' => 'embed_type',
|
261 |
-
'operator' => '==',
|
262 |
-
'value' => 'collection'
|
263 |
-
],
|
264 |
-
[
|
265 |
-
'name' => 'display_mode_collection',
|
266 |
-
'operator' => '==',
|
267 |
-
'value' => 'timeline'
|
268 |
-
]
|
269 |
-
]
|
270 |
-
],
|
271 |
-
[
|
272 |
-
'terms' => [
|
273 |
-
[
|
274 |
-
'name' => 'embed_type',
|
275 |
-
'operator' => '==',
|
276 |
-
'value' => 'profile'
|
277 |
-
],
|
278 |
-
[
|
279 |
-
'name' => 'display_mode_profile',
|
280 |
-
'operator' => '==',
|
281 |
-
'value' => 'timeline'
|
282 |
-
]
|
283 |
-
]
|
284 |
-
]
|
285 |
-
]
|
286 |
-
]
|
287 |
-
]
|
288 |
-
);
|
289 |
-
*/
|
290 |
-
$this->add_control(
|
291 |
-
'height_collection_timeline',
|
292 |
-
[
|
293 |
-
'label' => __( 'Height', 'wts-eae' ),
|
294 |
-
'type' => Controls_Manager::SLIDER,
|
295 |
-
'default' => [
|
296 |
-
'size' => 500,
|
297 |
-
|
298 |
-
],
|
299 |
-
'range' => [
|
300 |
-
'px' => [
|
301 |
-
'min' => 250,
|
302 |
-
'max' => 1300,
|
303 |
-
'step' => 10
|
304 |
-
]
|
305 |
-
],
|
306 |
-
'condition' => [
|
307 |
-
|
308 |
-
'display_mode_collection' => 'timeline',
|
309 |
-
'embed_type' => 'collection',
|
310 |
-
// 'display_mode_profile' =>'timeline'
|
311 |
-
]
|
312 |
-
]
|
313 |
-
);
|
314 |
-
|
315 |
-
$this->add_control(
|
316 |
-
'theme_collection_timeline',
|
317 |
-
[
|
318 |
-
'label' => __( 'Theme', 'wts-eae' ),
|
319 |
-
'type' => Controls_Manager::SELECT,
|
320 |
-
'default' => 'light',
|
321 |
-
'options' => [
|
322 |
-
'light' => __( 'Light', 'wts-eae' ),
|
323 |
-
'dark' => __( 'Dark', 'wts-eae' ),
|
324 |
-
],
|
325 |
-
'condition' => [
|
326 |
-
'display_mode_collection' => 'timeline',
|
327 |
-
'embed_type' => 'collection',
|
328 |
-
//'display_mode_profile' =>'timeline'
|
329 |
-
]
|
330 |
-
]
|
331 |
-
);
|
332 |
-
|
333 |
-
$this->add_control(
|
334 |
-
'link_color_collection',
|
335 |
-
[
|
336 |
-
'label' => __( 'Display Link Color', 'wts-eae' ),
|
337 |
-
'type' => Controls_Manager::COLOR,
|
338 |
-
'scheme' => [
|
339 |
-
'type' => Scheme_Color::get_type(),
|
340 |
-
'value' => Scheme_Color::COLOR_1,
|
341 |
-
],
|
342 |
-
'condition' => [
|
343 |
-
|
344 |
-
'display_mode_collection' => 'timeline',
|
345 |
-
'embed_type' => 'collection',
|
346 |
-
//'display_mode_profile' =>'timeline'
|
347 |
-
|
348 |
-
]
|
349 |
-
]
|
350 |
-
);
|
351 |
-
|
352 |
-
$this->add_control(
|
353 |
-
'display_mode_profile',
|
354 |
-
[
|
355 |
-
'label' => __( 'Display Mode', 'wts-eae' ),
|
356 |
-
'type' => Controls_Manager::SELECT,
|
357 |
-
'default' => 'timeline',
|
358 |
-
'options' => [
|
359 |
-
'timeline' => __( 'Timeline', 'wts-eae' ),
|
360 |
-
'button' => __( 'Button', 'wts-eae' ),
|
361 |
-
],
|
362 |
-
'condition' => [
|
363 |
-
'embed_type' => [ 'profile', 'handle' ]
|
364 |
-
]
|
365 |
-
|
366 |
-
]
|
367 |
-
);
|
368 |
-
|
369 |
-
$this->add_control(
|
370 |
-
'height_profile_timeline',
|
371 |
-
[
|
372 |
-
'label' => __( 'Height', 'wts-eae' ),
|
373 |
-
'type' => Controls_Manager::SLIDER,
|
374 |
-
'default' => [
|
375 |
-
'size' => 500,
|
376 |
-
|
377 |
-
],
|
378 |
-
'range' => [
|
379 |
-
'px' => [
|
380 |
-
'min' => 250,
|
381 |
-
'max' => 1300,
|
382 |
-
'step' => 10
|
383 |
-
]
|
384 |
-
],
|
385 |
-
'condition' => [
|
386 |
-
|
387 |
-
'display_mode_profile' => 'timeline',
|
388 |
-
'embed_type' => [ 'profile', 'handle' ]
|
389 |
-
//'display_mode_collection' => 'timeline',
|
390 |
-
|
391 |
-
]
|
392 |
-
]
|
393 |
-
);
|
394 |
-
|
395 |
-
$this->add_control(
|
396 |
-
'theme_profile_timeline',
|
397 |
-
[
|
398 |
-
'label' => __( 'Theme', 'wts-eae' ),
|
399 |
-
'type' => Controls_Manager::SELECT,
|
400 |
-
'default' => 'light',
|
401 |
-
'options' => [
|
402 |
-
'light' => __( 'Light', 'wts-eae' ),
|
403 |
-
'dark' => __( 'Dark', 'wts-eae' ),
|
404 |
-
],
|
405 |
-
'condition' => [
|
406 |
-
'display_mode_profile' => 'timeline',
|
407 |
-
'embed_type' => [ 'profile', 'handle' ]
|
408 |
-
//'display_mode_profile' =>'timeline'
|
409 |
-
]
|
410 |
-
]
|
411 |
-
);
|
412 |
-
|
413 |
-
$this->add_control(
|
414 |
-
'link_color_profile',
|
415 |
-
[
|
416 |
-
'label' => __( 'Display Link Color', 'wts-eae' ),
|
417 |
-
'type' => Controls_Manager::COLOR,
|
418 |
-
'scheme' => [
|
419 |
-
'type' => Scheme_Color::get_type(),
|
420 |
-
'value' => Scheme_Color::COLOR_1,
|
421 |
-
],
|
422 |
-
'condition' => [
|
423 |
-
|
424 |
-
'display_mode_profile' => 'timeline',
|
425 |
-
'embed_type' => [ 'profile', 'handle' ]
|
426 |
-
//'display_mode_collection' => 'timeline',
|
427 |
-
|
428 |
-
|
429 |
-
]
|
430 |
-
]
|
431 |
-
);
|
432 |
-
|
433 |
-
|
434 |
-
$this->add_control(
|
435 |
-
'button_type',
|
436 |
-
[
|
437 |
-
'label' => __( 'Button Type', 'wts-eae' ),
|
438 |
-
'type' => Controls_Manager::SELECT,
|
439 |
-
'default' => 'follow-button',
|
440 |
-
'options' => [
|
441 |
-
'follow-button' => __( 'Follow', 'wts-aea' ),
|
442 |
-
'mention-button' => __( 'Mention', 'wts-eae' ),
|
443 |
-
],
|
444 |
-
'condition' => [
|
445 |
-
'display_mode_profile' => 'button',
|
446 |
-
'embed_type' => [ 'profile', 'handle' ]
|
447 |
-
]
|
448 |
-
]
|
449 |
-
);
|
450 |
-
|
451 |
-
$this->add_control(
|
452 |
-
'hide_name',
|
453 |
-
[
|
454 |
-
'label' => __( 'Hide Name', 'wts-eae' ),
|
455 |
-
'type' => Controls_Manager::SWITCHER,
|
456 |
-
'default' => '',
|
457 |
-
'label_on' => __( 'Show', 'wts-eae' ),
|
458 |
-
'label_off' => __( 'Hide', 'wts-eae' ),
|
459 |
-
'return_value' => 'yes',
|
460 |
-
'condition' => [
|
461 |
-
|
462 |
-
'display_mode_profile' => 'button',
|
463 |
-
'button_type' => 'follow-button',
|
464 |
-
'embed_type' => [ 'profile', 'handle' ]
|
465 |
-
|
466 |
-
]
|
467 |
-
]
|
468 |
-
|
469 |
-
);
|
470 |
-
|
471 |
-
$this->add_control(
|
472 |
-
'show_count',
|
473 |
-
[
|
474 |
-
'label' => __( 'Show Count', 'wts-eae' ),
|
475 |
-
'type' => Controls_Manager::SWITCHER,
|
476 |
-
'default' => 'yes',
|
477 |
-
'label_on' => __( 'Show', 'wts-eae' ),
|
478 |
-
'label_off' => __( 'Hide', 'wts-eae' ),
|
479 |
-
'return_value' => 'yes',
|
480 |
-
'condition' => [
|
481 |
-
'embed_type' => [ 'profile', 'handle' ],
|
482 |
-
'display_mode_profile' => 'button',
|
483 |
-
'button_type' => 'follow-button'
|
484 |
-
|
485 |
-
]
|
486 |
-
]
|
487 |
-
|
488 |
-
);
|
489 |
-
|
490 |
-
$this->add_control(
|
491 |
-
'prefill_text',
|
492 |
-
[
|
493 |
-
'label' => __( 'Tweet Text', 'wts-eae' ),
|
494 |
-
'type' => Controls_Manager::TEXTAREA,
|
495 |
-
'default' => '',
|
496 |
-
'description' => __( 'Do you want to prefill the Tweet text?', 'wts-eae' ),
|
497 |
-
'condition' => [
|
498 |
-
'embed_type' => [ 'profile', 'handle' ],
|
499 |
-
'display_mode_profile' => 'button',
|
500 |
-
'button_type' => 'mention-button',
|
501 |
-
],
|
502 |
-
|
503 |
-
]
|
504 |
-
);
|
505 |
-
|
506 |
-
$this->add_control(
|
507 |
-
'screen_name',
|
508 |
-
[
|
509 |
-
'label' => __( 'Screen Name', 'wts-eae' ),
|
510 |
-
'type' => Controls_Manager::TEXT,
|
511 |
-
'condition' => [
|
512 |
-
'embed_type' => [ 'profile', 'handle' ],
|
513 |
-
'display_mode_profile' => 'button',
|
514 |
-
'button_type' => 'mention-button'
|
515 |
-
]
|
516 |
-
]
|
517 |
-
);
|
518 |
-
|
519 |
-
$this->add_control(
|
520 |
-
'large_button',
|
521 |
-
[
|
522 |
-
'label' => __( 'Large Button', 'wts-eae' ),
|
523 |
-
'type' => Controls_Manager::SWITCHER,
|
524 |
-
'default' => '',
|
525 |
-
'label_on' => __( 'Yes', 'wts-eae' ),
|
526 |
-
'label_off' => __( 'No', 'wts-eae' ),
|
527 |
-
'return_value' => 'yes',
|
528 |
-
'condition' => [
|
529 |
-
'embed_type' => [ 'profile', 'handle' ],
|
530 |
-
'display_mode_profile' => 'button'
|
531 |
-
|
532 |
-
|
533 |
-
]
|
534 |
-
]
|
535 |
-
|
536 |
-
);
|
537 |
-
$this->add_control(
|
538 |
-
'height_list',
|
539 |
-
[
|
540 |
-
'label' => __( 'Height', 'wts-eae' ),
|
541 |
-
'type' => Controls_Manager::SLIDER,
|
542 |
-
'default' => [
|
543 |
-
'size' => 500,
|
544 |
-
|
545 |
-
],
|
546 |
-
'range' => [
|
547 |
-
'px' => [
|
548 |
-
'min' => 250,
|
549 |
-
'max' => 1300,
|
550 |
-
'step' => 10
|
551 |
-
]
|
552 |
-
],
|
553 |
-
'condition' => [
|
554 |
-
|
555 |
-
//'display_mode_profile' =>'timeline',
|
556 |
-
'embed_type' => [ 'list', 'likes' ],
|
557 |
-
//'display_mode_collection' => 'timeline',
|
558 |
-
|
559 |
-
]
|
560 |
-
]
|
561 |
-
);
|
562 |
-
|
563 |
-
$this->add_control(
|
564 |
-
'theme_list',
|
565 |
-
[
|
566 |
-
'label' => __( 'Theme', 'wts-eae' ),
|
567 |
-
'type' => Controls_Manager::SELECT,
|
568 |
-
'default' => 'light',
|
569 |
-
'options' => [
|
570 |
-
'light' => __( 'Light', 'wts-eae' ),
|
571 |
-
'dark' => __( 'Dark', 'wts-eae' ),
|
572 |
-
],
|
573 |
-
'condition' => [
|
574 |
-
//'display_mode_profile' => 'timeline',
|
575 |
-
'embed_type' => [ 'list', 'likes' ]
|
576 |
-
//'display_mode_profile' =>'timeline'
|
577 |
-
]
|
578 |
-
]
|
579 |
-
);
|
580 |
-
|
581 |
-
$this->add_control(
|
582 |
-
'link_color_list',
|
583 |
-
[
|
584 |
-
'label' => __( 'Display Link Color', 'wts-eae' ),
|
585 |
-
'type' => Controls_Manager::COLOR,
|
586 |
-
'scheme' => [
|
587 |
-
'type' => Scheme_Color::get_type(),
|
588 |
-
'value' => Scheme_Color::COLOR_1,
|
589 |
-
],
|
590 |
-
'condition' => [
|
591 |
-
|
592 |
-
//'display_mode_profile' =>'timeline',
|
593 |
-
'embed_type' => [ 'list', 'likes' ]
|
594 |
-
//'display_mode_collection' => 'timeline',
|
595 |
-
|
596 |
-
|
597 |
-
]
|
598 |
-
]
|
599 |
-
);
|
600 |
-
|
601 |
-
$prefill_options = [];
|
602 |
-
if ( is_single() ) {
|
603 |
-
$prefill_options = [
|
604 |
-
'post_title' => __( 'Post Title', 'wts-eae' ),
|
605 |
-
'excerpt' => __( 'Post Excerpt', 'wts-eae' ),
|
606 |
-
];
|
607 |
-
}
|
608 |
-
|
609 |
-
$prefill_options['custom'] = 'Custom';
|
610 |
-
$this->add_control(
|
611 |
-
'prefill_text_hashtag',
|
612 |
-
[
|
613 |
-
'label' => __( 'Pre Fill Text', 'wts-eae' ),
|
614 |
-
'type' => Controls_Manager::SELECT,
|
615 |
-
'default' => 'post_title',
|
616 |
-
'options' => $prefill_options,
|
617 |
-
'condition' => [
|
618 |
-
'embed_type' => 'hashtag',
|
619 |
-
],
|
620 |
-
'description' => __( 'Do you want to prefill the Tweet text?', 'wts-eae' ),
|
621 |
-
]
|
622 |
-
);
|
623 |
-
$this->add_control(
|
624 |
-
'prefill_custom',
|
625 |
-
[
|
626 |
-
'label' => __( 'Custom Prefill Text', 'wts-eae' ),
|
627 |
-
'type' => Controls_Manager::TEXTAREA,
|
628 |
-
'condition' => [
|
629 |
-
'prefill_text_hashtag' => 'custom',
|
630 |
-
'embed_type' => 'hashtag'
|
631 |
-
]
|
632 |
-
|
633 |
-
]
|
634 |
-
);
|
635 |
-
|
636 |
-
$this->add_control(
|
637 |
-
'hashtag_url',
|
638 |
-
[
|
639 |
-
'label' => __( 'Fix Url in Tweet' ),
|
640 |
-
'type' => Controls_Manager::TEXT,
|
641 |
-
'default' => '',
|
642 |
-
'description' => __( 'Do you want to set a specific URL in the Tweet?', 'wts-eae' ),
|
643 |
-
'condition' => [
|
644 |
-
'embed_type' => 'hashtag'
|
645 |
-
]
|
646 |
-
]
|
647 |
-
);
|
648 |
-
|
649 |
-
|
650 |
-
$this->add_control(
|
651 |
-
'language',
|
652 |
-
[
|
653 |
-
'label' => __( 'Language', 'wts-eae' ),
|
654 |
-
'type' => Controls_Manager::SELECT,
|
655 |
-
'options' => $this->languages(),
|
656 |
-
'default' => ''
|
657 |
-
]
|
658 |
-
);
|
659 |
-
|
660 |
-
$this->add_control(
|
661 |
-
'hashtag_large_button',
|
662 |
-
[
|
663 |
-
'label' => __( 'Large Button', 'wts-eae' ),
|
664 |
-
'type' => Controls_Manager::SWITCHER,
|
665 |
-
'default' => '',
|
666 |
-
'label_on' => __( 'Yes', 'wts-eae' ),
|
667 |
-
'label_off' => __( 'No', 'wts-eae' ),
|
668 |
-
'return_value' => 'yes',
|
669 |
-
'condition' => [
|
670 |
-
'embed_type' => 'hashtag',
|
671 |
-
]
|
672 |
-
]
|
673 |
-
|
674 |
-
);
|
675 |
-
|
676 |
-
|
677 |
-
}
|
678 |
-
|
679 |
-
public function languages() {
|
680 |
-
$languages = [
|
681 |
-
'' => __( 'Automatic', 'wts-eae' ),
|
682 |
-
'en' => __( 'English', 'wts-eae' ),
|
683 |
-
'ar' => __( 'Arabic', 'wta-eae' ),
|
684 |
-
'bn' => __( 'Bengali', 'wts-eae' ),
|
685 |
-
'cs' => __( 'Czech', 'wts-eae' ),
|
686 |
-
'da' => __( 'Danish', 'wts-eae' ),
|
687 |
-
'de' => __( 'German', 'wts-eae' ),
|
688 |
-
'el' => __( 'Greek', 'wts-eae' ),
|
689 |
-
'es' => __( 'Spanish', 'wts-eae' ),
|
690 |
-
'fa' => __( 'Persian', 'wts-eae' ),
|
691 |
-
'fi' => __( 'Finnish', 'wts-eae' ),
|
692 |
-
'fil' => __( 'Filipino', 'wts-eae' ),
|
693 |
-
'fr' => __( 'French', 'wts-eae' ),
|
694 |
-
'he' => __( 'Hebrew', 'wts-eae' ),
|
695 |
-
'hi' => __( 'Hindi', 'wts-eae' ),
|
696 |
-
'hu' => __( 'Hungarian', 'wts-eae' ),
|
697 |
-
'id' => __( 'Indonesian', 'wts-eae' ),
|
698 |
-
'it' => __( 'Italian', 'wts-eae' ),
|
699 |
-
'ja' => __( 'Japanese', 'wts-eae' ),
|
700 |
-
'ko' => __( 'Korean', 'wts-eae' ),
|
701 |
-
'msa' => __( 'Malay', 'wts-eae' ),
|
702 |
-
'nl' => __( 'Dutch', 'wts-eae' ),
|
703 |
-
'no' => __( 'Norwegian', 'wts-eae' ),
|
704 |
-
'pl' => __( 'Polish', 'wts-eae' ),
|
705 |
-
'pt' => __( 'Portuguese', 'wts-eae' ),
|
706 |
-
'ro' => __( 'Romania', 'wts-eae' ),
|
707 |
-
'ru' => __( 'Rus', 'wts-eae' ),
|
708 |
-
'sv' => __( 'Swedish', 'wts-eae' ),
|
709 |
-
'th' => __( 'Thai', 'wts-eae' ),
|
710 |
-
'tr' => __( 'Turkish', 'wts-eae' ),
|
711 |
-
'uk' => __( 'Ukrainian', 'wts-eae' ),
|
712 |
-
'ur' => __( 'Urdu', 'wts-eae' ),
|
713 |
-
'vi' => __( 'Vietnamese', 'wts-eae' ),
|
714 |
-
'zh-cn' => __( 'Chinese (Simplified)', 'wts-eae' ),
|
715 |
-
'zh-tw' => __( 'Chinese (Traditional)', 'wts-eae' ),
|
716 |
-
];
|
717 |
-
|
718 |
-
return $languages;
|
719 |
-
|
720 |
-
}
|
721 |
-
|
722 |
-
public function render() {
|
723 |
-
// TODO: Implement render() method.
|
724 |
-
$settings = $this->get_settings();
|
725 |
-
//echo'<pre>'; print_r($settings);
|
726 |
-
|
727 |
-
switch ( $settings['embed_type'] ) {
|
728 |
-
|
729 |
-
case "collection":
|
730 |
-
$this->get_collection_html( $settings );
|
731 |
-
break;
|
732 |
-
|
733 |
-
case "profile":
|
734 |
-
$this->get_profile_html( $settings );
|
735 |
-
break;
|
736 |
-
|
737 |
-
case "list":
|
738 |
-
$this->get_list_html( $settings );
|
739 |
-
break;
|
740 |
-
|
741 |
-
case "moments":
|
742 |
-
$this->get_moments_html( $settings );
|
743 |
-
break;
|
744 |
-
|
745 |
-
case "likes" :
|
746 |
-
$this->get_likes_html( $settings );
|
747 |
-
break;
|
748 |
-
|
749 |
-
case "handle" :
|
750 |
-
$this->get_handle_html( $settings );
|
751 |
-
break;
|
752 |
-
case "hashtag":
|
753 |
-
$this->get_hashtag_html( $settings );
|
754 |
-
break;
|
755 |
-
|
756 |
-
}
|
757 |
-
?>
|
758 |
-
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
|
759 |
-
<?php
|
760 |
-
|
761 |
-
}
|
762 |
-
|
763 |
-
public function get_collection_html( $settings ) {
|
764 |
-
$this->add_render_attribute( 'collection', 'class', 'twitter-' . $settings['display_mode_collection'] );
|
765 |
-
$this->add_render_attribute( 'collection', 'data-lang', $settings['language'] );
|
766 |
-
$this->add_render_attribute( 'collection', 'data-partner', 'twitter-deck' );
|
767 |
-
$this->add_render_attribute( 'collection', 'href', $settings['url_collection'] );
|
768 |
-
|
769 |
-
if ( $settings['display_mode_collection'] == 'grid' ) {
|
770 |
-
$this->add_render_attribute( 'collection', 'data-limit', $settings['no_of_tweets'] );
|
771 |
-
}
|
772 |
-
if ( $settings['display_mode_collection'] == 'timeline' ) {
|
773 |
-
$this->add_render_attribute( 'collection', 'data-height', $settings['height_collection_timeline']['size'] );
|
774 |
-
//$this->add_render_attribute('collection','data-width',$settings['width']['size']);
|
775 |
-
$this->add_render_attribute( 'collection', 'data-theme', $settings['theme_collection_timeline'] );
|
776 |
-
$this->add_render_attribute( 'collection', 'data-link-color', $settings['link_color_collection'] );
|
777 |
-
|
778 |
-
}
|
779 |
-
|
780 |
-
?>
|
781 |
-
<a <?php echo $this->get_render_attribute_string( 'collection' ); ?>></a>
|
782 |
-
<?php
|
783 |
-
}
|
784 |
-
|
785 |
-
public function get_profile_html( $settings ) {
|
786 |
-
$this->add_render_attribute( 'profile', 'href', $settings['url_profile'] );
|
787 |
-
$this->add_render_attribute( 'profile', 'data-lang', $settings['language'] );
|
788 |
-
if ( $settings['large_button'] == 'yes' ) {
|
789 |
-
$this->add_render_attribute( 'profile', 'data-size', 'large' );
|
790 |
-
}
|
791 |
-
|
792 |
-
|
793 |
-
if ( $settings['display_mode_profile'] == 'timeline' ) {
|
794 |
-
$this->add_render_attribute( 'profile', 'class', 'twitter-' . $settings['display_mode_profile'] );
|
795 |
-
$this->add_render_attribute( 'profile', 'data-partner', 'twitter-deck' );
|
796 |
-
$this->add_render_attribute( 'profile', 'data-height', $settings['height_profile_timeline']['size'] );
|
797 |
-
$this->add_render_attribute( 'profile', 'data-theme', $settings['theme_profile_timeline'] );
|
798 |
-
$this->add_render_attribute( 'profile', 'data-link-color', $settings['link_color_profile'] );
|
799 |
-
|
800 |
-
}
|
801 |
-
|
802 |
-
if ( $settings['display_mode_profile'] == 'button' && $settings['button_type'] == 'follow-button' ) {
|
803 |
-
$this->add_render_attribute( 'profile', 'class', 'twitter-' . $settings['button_type'] );
|
804 |
-
if ( $settings['hide_name'] == 'yes' ) {
|
805 |
-
$this->add_render_attribute( 'profile', 'data-show-screen-name', 'false' );
|
806 |
-
}
|
807 |
-
if ( $settings['show_count'] == '' ) {
|
808 |
-
$this->add_render_attribute( 'profile', 'data-show-count', 'false' );
|
809 |
-
}
|
810 |
-
}
|
811 |
-
|
812 |
-
if ( $settings['display_mode_profile'] == 'button' && $settings['button_type'] == 'mention-button' ) {
|
813 |
-
$this->add_render_attribute( 'profile', 'class', 'twitter-' . $settings['button_type'] );
|
814 |
-
$this->add_render_attribute( 'profile', 'data-text', $settings['prefill_text'] );
|
815 |
-
$this->add_render_attribute( 'profile', 'href', $settings['url_profile'] . '?screen_name=' . $settings['screen_name'] );
|
816 |
-
|
817 |
-
}
|
818 |
-
|
819 |
-
?>
|
820 |
-
<a <?php echo $this->get_render_attribute_string( 'profile' ); ?> ></a><?php
|
821 |
-
}
|
822 |
-
|
823 |
-
public function get_list_html( $settings ) {
|
824 |
-
if ( $settings['embed_type'] == 'list' ) {
|
825 |
-
$this->add_render_attribute( 'list', 'class', 'twitter-timeline' );
|
826 |
-
}
|
827 |
-
$this->add_render_attribute( 'list', 'href', $settings['url_list'] );
|
828 |
-
$this->add_render_attribute( 'list', 'data-height', $settings['height_list']['size'] );
|
829 |
-
//$this->add_render_attribute('collection','data-width',$settings['width']['size']);
|
830 |
-
$this->add_render_attribute( 'list', 'data-theme', $settings['theme_list'] );
|
831 |
-
$this->add_render_attribute( 'list', 'data-link-color', $settings['link_color_list'] );
|
832 |
-
$this->add_render_attribute( 'list', 'data-lang', $settings['language'] );
|
833 |
-
$this->add_render_attribute( 'list', 'data-partner', 'twitter-deck' );
|
834 |
-
?>
|
835 |
-
<a <?php echo $this->get_render_attribute_string( 'list' ); ?>> </a><?php
|
836 |
-
|
837 |
-
}
|
838 |
-
|
839 |
-
public function get_moments_html( $settings ) {
|
840 |
-
if ( $settings['embed_type'] == 'moments' ) {
|
841 |
-
$this->add_render_attribute( 'moments', 'class', 'twitter-moment' );
|
842 |
-
}
|
843 |
-
$this->add_render_attribute( 'moments', 'href', $settings['url_moments'] );
|
844 |
-
$this->add_render_attribute( 'moments', 'data-lang', $settings['language'] );
|
845 |
-
$this->add_render_attribute( 'moments', 'data-partner', 'twitter-deck' );
|
846 |
-
?>
|
847 |
-
<a <?php echo $this->get_render_attribute_string( 'moments' ); ?> > </a>
|
848 |
-
<?php
|
849 |
-
|
850 |
-
}
|
851 |
-
|
852 |
-
public function get_likes_html( $settings ) {
|
853 |
-
if ( $settings['embed_type'] == 'likes' ) {
|
854 |
-
$this->add_render_attribute( 'likes', 'class', 'twitter-timeline' );
|
855 |
-
}
|
856 |
-
$this->add_render_attribute( 'likes', 'href', $settings['url_likes'] );
|
857 |
-
$this->add_render_attribute( 'likes', 'data-height', $settings['height_list']['size'] );
|
858 |
-
$this->add_render_attribute( 'likes', 'data-theme', $settings['theme_list'] );
|
859 |
-
$this->add_render_attribute( 'likes', 'data-link-color', $settings['link_color_list'] );
|
860 |
-
$this->add_render_attribute( 'likes', 'data-lang', $settings['language'] );
|
861 |
-
$this->add_render_attribute( 'likes', 'data-partner', 'twitter-deck' );
|
862 |
-
?>
|
863 |
-
<a <?php echo $this->get_render_attribute_string( 'likes' ) ?> >Likes</php> </a>
|
864 |
-
<?php
|
865 |
-
}
|
866 |
-
|
867 |
-
public function get_handle_html( $settings ) {
|
868 |
-
|
869 |
-
$this->add_render_attribute( 'handle', 'data-lang', $settings['language'] );
|
870 |
-
if ( $settings['large_button'] == 'yes' ) {
|
871 |
-
$this->add_render_attribute( 'handle', 'data-size', 'large' );
|
872 |
-
}
|
873 |
-
|
874 |
-
|
875 |
-
if ( $settings['display_mode_profile'] == 'timeline' ) {
|
876 |
-
$this->add_render_attribute( 'handle', 'href', 'https://www.twitter.com/' . $settings['username'] );
|
877 |
-
$this->add_render_attribute( 'handle', 'class', 'twitter-' . $settings['display_mode_profile'] );
|
878 |
-
$this->add_render_attribute( 'handle', 'data-partner', 'twitter-deck' );
|
879 |
-
$this->add_render_attribute( 'handle', 'data-height', $settings['height_profile_timeline']['size'] );
|
880 |
-
$this->add_render_attribute( 'handle', 'data-theme', $settings['theme_profile_timeline'] );
|
881 |
-
$this->add_render_attribute( 'handle', 'data-link-color', $settings['link_color_profile'] );
|
882 |
-
|
883 |
-
}
|
884 |
-
|
885 |
-
if ( $settings['display_mode_profile'] == 'button' && $settings['button_type'] == 'follow-button' ) {
|
886 |
-
$this->add_render_attribute( 'handle', 'class', 'twitter-' . $settings['button_type'] );
|
887 |
-
$this->add_render_attribute( 'handle', 'href', 'https://www.twitter.com/' . $settings['username'] );
|
888 |
-
if ( $settings['hide_name'] == 'yes' ) {
|
889 |
-
$this->add_render_attribute( 'handle', 'data-show-screen-name', 'false' );
|
890 |
-
}
|
891 |
-
if ( $settings['show_count'] == '' ) {
|
892 |
-
$this->add_render_attribute( 'handle', 'data-show-count', 'false' );
|
893 |
-
}
|
894 |
-
}
|
895 |
-
|
896 |
-
if ( $settings['display_mode_profile'] == 'button' && $settings['button_type'] == 'mention-button' ) {
|
897 |
-
$this->add_render_attribute( 'handle', 'class', 'twitter-' . $settings['button_type'] );
|
898 |
-
$this->add_render_attribute( 'handle', 'data-text', $settings['prefill_text'] );
|
899 |
-
$this->add_render_attribute( 'handle', 'href','https://www.twitter.com/intent/tweet' . '?screen_name=' . $settings['screen_name'] );
|
900 |
-
|
901 |
-
|
902 |
-
}
|
903 |
-
|
904 |
-
?>
|
905 |
-
<a <?php echo $this->get_render_attribute_string( 'handle' ); ?> > Handle <?php echo $settings['username']; ?></a><?php
|
906 |
-
}
|
907 |
-
|
908 |
-
public function get_hashtag_html( $settings ) {
|
909 |
-
|
910 |
-
$this->add_render_attribute( 'hashtag', 'class', 'twitter-hashtag-button' );
|
911 |
-
$this->add_render_attribute( 'hashtag', 'href', 'https://twitter.com/intent/tweet?button_hashtag=' . $settings['hashtag'] );
|
912 |
-
$this->add_render_attribute( 'hashtag', 'data-lang', $settings['language'] );
|
913 |
-
|
914 |
-
if ( $settings['prefill_text_hashtag'] == 'post_title' ) {
|
915 |
-
|
916 |
-
$this->add_render_attribute( 'hashtag', 'data-text', $this->current_post_title() );
|
917 |
-
}
|
918 |
-
if ( $settings['prefill_text_hashtag'] == 'excerpt' ) {
|
919 |
-
|
920 |
-
$this->add_render_attribute( 'hashtag', 'data-text', $this->current_post_excerpt() );
|
921 |
-
}
|
922 |
-
if ( $settings['prefill_text_hashtag'] == 'custom' ) {
|
923 |
-
$this->add_render_attribute( 'hashtag', 'data-text', $settings['prefill_custom'] );
|
924 |
-
}
|
925 |
-
if ( $settings['hashtag_large_button'] == 'yes' ) {
|
926 |
-
$this->add_render_attribute( 'hashtag', 'data-size', 'large' );
|
927 |
-
}
|
928 |
-
$this->add_render_attribute( 'hashtag', 'data-url', $settings['hashtag_url'] );
|
929 |
-
|
930 |
-
?>
|
931 |
-
<a <?php echo $this->get_render_attribute_string( 'hashtag' ); ?> >Tweet<?php echo $settings['hashtag']; ?> </a>
|
932 |
-
<?php
|
933 |
-
|
934 |
-
|
935 |
-
}
|
936 |
-
|
937 |
-
public function current_post_title() {
|
938 |
-
|
939 |
-
global $post;
|
940 |
-
//echo'<pre>'; print_r($post); echo'<pre>';
|
941 |
-
$title = $post->post_title;
|
942 |
-
|
943 |
-
//echo $title;
|
944 |
-
return $title;
|
945 |
-
|
946 |
-
}
|
947 |
-
|
948 |
-
public function current_post_excerpt() {
|
949 |
-
global $post;
|
950 |
-
|
951 |
-
|
952 |
-
if ( has_excerpt( $post->ID ) ) {
|
953 |
-
return get_the_excerpt( $post->ID );
|
954 |
-
} else {
|
955 |
-
|
956 |
-
}
|
957 |
-
}
|
958 |
-
|
959 |
-
|
960 |
-
|
961 |
-
|
962 |
-
}
|
963 |
-
|
964 |
Plugin::instance()->widgets_manager->register_widget_type( new EAE_Twitter() );
|
1 |
+
<?php
|
2 |
+
|
3 |
+
namespace EAE;
|
4 |
+
|
5 |
+
use Elementor\Controls_Manager;
|
6 |
+
use Elementor\Widget_Base;
|
7 |
+
use Elementor\Plugin;
|
8 |
+
use Elementor\Scheme_Color;
|
9 |
+
|
10 |
+
if ( ! defined( 'ABSPATH' ) ) {
|
11 |
+
exit;
|
12 |
+
} //Exit if accessed directly
|
13 |
+
|
14 |
+
class EAE_Twitter extends Widget_Base {
|
15 |
+
|
16 |
+
public function get_name() {
|
17 |
+
return 'wts-twitter';
|
18 |
+
}
|
19 |
+
|
20 |
+
public function get_title() {
|
21 |
+
return __( 'EAE - Twitter', 'wts-eae' );
|
22 |
+
}
|
23 |
+
|
24 |
+
public function get_icon() {
|
25 |
+
return 'fa fa-twitter';
|
26 |
+
}
|
27 |
+
|
28 |
+
public function get_categories() {
|
29 |
+
return [ 'wts-eae' ];
|
30 |
+
}
|
31 |
+
protected function _register_controls() {
|
32 |
+
|
33 |
+
$this->start_controls_section(
|
34 |
+
'section_general',
|
35 |
+
[
|
36 |
+
'label' => __( 'General', 'wts-eae' )
|
37 |
+
]
|
38 |
+
);
|
39 |
+
|
40 |
+
$this->add_control(
|
41 |
+
'embed_type',
|
42 |
+
[
|
43 |
+
'label' => __( 'Type', 'wts-eae' ),
|
44 |
+
'type' => Controls_Manager::SELECT,
|
45 |
+
'default' => 'handle',
|
46 |
+
'options' => [
|
47 |
+
//'collection' => 'Collection',
|
48 |
+
//'tweet' => 'Tweet',
|
49 |
+
//'profile' => 'Profile',
|
50 |
+
//'list' => 'List',
|
51 |
+
//'moments' => 'Moments',
|
52 |
+
//'likes' => 'Likes ',
|
53 |
+
'handle' => __( 'Handle', 'wts-eae' ),
|
54 |
+
'hashtag' => __( 'Hashtag', 'wts-eae' ),
|
55 |
+
]
|
56 |
+
]
|
57 |
+
);
|
58 |
+
|
59 |
+
$this->add_control(
|
60 |
+
'url_collection',
|
61 |
+
[
|
62 |
+
'label' => __( 'Enter URL', 'wts-eae' ),
|
63 |
+
'type' => Controls_Manager::TEXT,
|
64 |
+
'placeholder' => __( 'https://twitter.com/webtechhardik', 'wts-eae' ),
|
65 |
+
'default' => 'https://twitter.com/TwitterDev/timelines/539487832448843776',
|
66 |
+
'condition' => [
|
67 |
+
'embed_type' => 'collection'
|
68 |
+
]
|
69 |
+
|
70 |
+
]
|
71 |
+
);
|
72 |
+
|
73 |
+
$this->add_control(
|
74 |
+
'url_profile',
|
75 |
+
[
|
76 |
+
'label' => __( 'Enter URL', 'wts-eae' ),
|
77 |
+
'type' => Controls_Manager::TEXT,
|
78 |
+
'placeholder' => __( 'https://twitter.com/TwitterDev', 'wts-eae' ),
|
79 |
+
'default' => 'https://twitter.com/TwitterDev',
|
80 |
+
'condition' => [
|
81 |
+
'embed_type' => 'profile'
|
82 |
+
]
|
83 |
+
|
84 |
+
]
|
85 |
+
);
|
86 |
+
|
87 |
+
$this->add_control(
|
88 |
+
'url_list',
|
89 |
+
[
|
90 |
+
'label' => __( 'Enter URL', 'wts-eae' ),
|
91 |
+
'type' => Controls_Manager::TEXT,
|
92 |
+
'placeholder' => __( 'https://twitter.com/webtechhardik', 'wts-eae' ),
|
93 |
+
'default' => 'https://twitter.com/TwitterDev/lists/national-parks',
|
94 |
+
'condition' => [
|
95 |
+
'embed_type' => 'list'
|
96 |
+
]
|
97 |
+
|
98 |
+
]
|
99 |
+
);
|
100 |
+
|
101 |
+
$this->add_control(
|
102 |
+
'url_moments',
|
103 |
+
[
|
104 |
+
'label' => __( 'Enter URL', 'wts-eae' ),
|
105 |
+
'type' => Controls_Manager::TEXT,
|
106 |
+
'placeholder' => __( 'https://twitter.com/webtechhardik', 'wts-eae' ),
|
107 |
+
'default' => 'https://twitter.com/i/moments/625792726546558977',
|
108 |
+
'condition' => [
|
109 |
+
'embed_type' => 'moments'
|
110 |
+
]
|
111 |
+
|
112 |
+
]
|
113 |
+
);
|
114 |
+
|
115 |
+
$this->add_control(
|
116 |
+
'url_likes',
|
117 |
+
[
|
118 |
+
'label' => __( 'Enter URL', 'wts-eae' ),
|
119 |
+
'type' => Controls_Manager::TEXT,
|
120 |
+
'placeholder' => __( 'https://twitter.com/webtechhardik', 'wts-eae' ),
|
121 |
+
'default' => 'https://twitter.com/TwitterDev/likes',
|
122 |
+
'condition' => [
|
123 |
+
'embed_type' => 'likes'
|
124 |
+
]
|
125 |
+
|
126 |
+
]
|
127 |
+
);
|
128 |
+
|
129 |
+
$this->add_control(
|
130 |
+
'username',
|
131 |
+
[
|
132 |
+
'label' => __( 'Enter UserName', 'wts-eae' ),
|
133 |
+
'type' => Controls_Manager::TEXT,
|
134 |
+
'placeholder' => __( '@username', 'wts-eae' ),
|
135 |
+
'default' => '@TwitterDev',
|
136 |
+
'condition' => [
|
137 |
+
'embed_type' => 'handle',
|
138 |
+
]
|
139 |
+
]
|
140 |
+
|
141 |
+
);
|
142 |
+
|
143 |
+
|
144 |
+
$this->add_control(
|
145 |
+
'hashtag',
|
146 |
+
[
|
147 |
+
'label' => __( 'Enter Hashtag', 'wts-eae' ),
|
148 |
+
'type' => Controls_Manager::TEXT,
|
149 |
+
'placeholder' => __( '#hashtag', 'wts-eae' ),
|
150 |
+
'condition' => [
|
151 |
+
'embed_type' => 'hashtag',
|
152 |
+
]
|
153 |
+
]
|
154 |
+
|
155 |
+
);
|
156 |
+
|
157 |
+
$this->add_control(
|
158 |
+
'display_mode_collection',
|
159 |
+
[
|
160 |
+
'label' => __( 'Display Mode', 'wts-eae' ),
|
161 |
+
'type' => Controls_Manager::SELECT,
|
162 |
+
'default' => 'timeline',
|
163 |
+
'options' => [
|
164 |
+
'timeline' => __( 'Timeline', 'wts-eae' ),
|
165 |
+
'grid' => __( 'Grid', 'wts-eae' ),
|
166 |
+
],
|
167 |
+
'condition' => [
|
168 |
+
'embed_type' => 'collection'
|
169 |
+
]
|
170 |
+
|
171 |
+
]
|
172 |
+
);
|
173 |
+
|
174 |
+
$this->add_control(
|
175 |
+
'no_of_tweets',
|
176 |
+
[
|
177 |
+
'label' => __( 'Display No of Tweets', 'wts-eae' ),
|
178 |
+
'type' => Controls_Manager::NUMBER,
|
179 |
+
'default' => 20,
|
180 |
+
'min' => '2',
|
181 |
+
'max' => '50',
|
182 |
+
'step' => '1',
|
183 |
+
'condition' => [
|
184 |
+
|
185 |
+
'display_mode_collection' => 'grid',
|
186 |
+
'embed_type' => 'collection',
|
187 |
+
]
|
188 |
+
]
|
189 |
+
);
|
190 |
+
|
191 |
+
/* $this->add_control(
|
192 |
+
'height',
|
193 |
+
[
|
194 |
+
'label' =>__('Height' , 'wts-eae'),
|
195 |
+
'type' =>Controls_Manager::SLIDER,
|
196 |
+
'default' =>[
|
197 |
+
'size' => 500,
|
198 |
+
|
199 |
+
],
|
200 |
+
'range'=>[
|
201 |
+
'px' =>[
|
202 |
+
'min' =>250,
|
203 |
+
'max' =>1300,
|
204 |
+
'step' =>10
|
205 |
+
]
|
206 |
+
],
|
207 |
+
'condition' =>[
|
208 |
+
'embed_type!'=>'moments',
|
209 |
+
'display_mode_collection' => 'timeline',
|
210 |
+
'display_mode_profile' =>'timeline'
|
211 |
+
]
|
212 |
+
]
|
213 |
+
);
|
214 |
+
|
215 |
+
|
216 |
+
|
217 |
+
$this->add_control(
|
218 |
+
'theme',
|
219 |
+
[
|
220 |
+
'label' =>__('Theme' , 'wts-eae'),
|
221 |
+
'type' =>Controls_Manager::SELECT,
|
222 |
+
'default' => 'light',
|
223 |
+
'options' => [
|
224 |
+
'light' => 'Light',
|
225 |
+
'dark' => 'Dark'
|
226 |
+
],
|
227 |
+
'conditions' => [
|
228 |
+
'relation' => 'or',
|
229 |
+
'terms' => [
|
230 |
+
[
|
231 |
+
'name' => 'display_mode_collection',
|
232 |
+
'operator' => 'in',
|
233 |
+
'value' => 'timeline'
|
234 |
+
],
|
235 |
+
[
|
236 |
+
'name' => 'display_mode_profile',
|
237 |
+
'operator' => 'in',
|
238 |
+
'value' => 'timeline'
|
239 |
+
]
|
240 |
+
]
|
241 |
+
]
|
242 |
+
]
|
243 |
+
);
|
244 |
+
|
245 |
+
$this->add_control(
|
246 |
+
'link_color',
|
247 |
+
[
|
248 |
+
'label' =>__('Display Link Color' , 'wts-eae'),
|
249 |
+
'type' =>Controls_Manager::COLOR,
|
250 |
+
'scheme' => [
|
251 |
+
'type' => Scheme_Color::get_type(),
|
252 |
+
'value' => Scheme_Color::COLOR_1,
|
253 |
+
],
|
254 |
+
'conditions' => [
|
255 |
+
'terms' => [
|
256 |
+
[
|
257 |
+
'terms' => [
|
258 |
+
|
259 |
+
[
|
260 |
+
'name' => 'embed_type',
|
261 |
+
'operator' => '==',
|
262 |
+
'value' => 'collection'
|
263 |
+
],
|
264 |
+
[
|
265 |
+
'name' => 'display_mode_collection',
|
266 |
+
'operator' => '==',
|
267 |
+
'value' => 'timeline'
|
268 |
+
]
|
269 |
+
]
|
270 |
+
],
|
271 |
+
[
|
272 |
+
'terms' => [
|
273 |
+
[
|
274 |
+
'name' => 'embed_type',
|
275 |
+
'operator' => '==',
|
276 |
+
'value' => 'profile'
|
277 |
+
],
|
278 |
+
[
|
279 |
+
'name' => 'display_mode_profile',
|
280 |
+
'operator' => '==',
|
281 |
+
'value' => 'timeline'
|
282 |
+
]
|
283 |
+
]
|
284 |
+
]
|
285 |
+
]
|
286 |
+
]
|
287 |
+
]
|
288 |
+
);
|
289 |
+
*/
|
290 |
+
$this->add_control(
|
291 |
+
'height_collection_timeline',
|
292 |
+
[
|
293 |
+
'label' => __( 'Height', 'wts-eae' ),
|
294 |
+
'type' => Controls_Manager::SLIDER,
|
295 |
+
'default' => [
|
296 |
+
'size' => 500,
|
297 |
+
|
298 |
+
],
|
299 |
+
'range' => [
|
300 |
+
'px' => [
|
301 |
+
'min' => 250,
|
302 |
+
'max' => 1300,
|
303 |
+
'step' => 10
|
304 |
+
]
|
305 |
+
],
|
306 |
+
'condition' => [
|
307 |
+
|
308 |
+
'display_mode_collection' => 'timeline',
|
309 |
+
'embed_type' => 'collection',
|
310 |
+
// 'display_mode_profile' =>'timeline'
|
311 |
+
]
|
312 |
+
]
|
313 |
+
);
|
314 |
+
|
315 |
+
$this->add_control(
|
316 |
+
'theme_collection_timeline',
|
317 |
+
[
|
318 |
+
'label' => __( 'Theme', 'wts-eae' ),
|
319 |
+
'type' => Controls_Manager::SELECT,
|
320 |
+
'default' => 'light',
|
321 |
+
'options' => [
|
322 |
+
'light' => __( 'Light', 'wts-eae' ),
|
323 |
+
'dark' => __( 'Dark', 'wts-eae' ),
|
324 |
+
],
|
325 |
+
'condition' => [
|
326 |
+
'display_mode_collection' => 'timeline',
|
327 |
+
'embed_type' => 'collection',
|
328 |
+
//'display_mode_profile' =>'timeline'
|
329 |
+
]
|
330 |
+
]
|
331 |
+
);
|
332 |
+
|
333 |
+
$this->add_control(
|
334 |
+
'link_color_collection',
|
335 |
+
[
|
336 |
+
'label' => __( 'Display Link Color', 'wts-eae' ),
|
337 |
+
'type' => Controls_Manager::COLOR,
|
338 |
+
'scheme' => [
|
339 |
+
'type' => Scheme_Color::get_type(),
|
340 |
+
'value' => Scheme_Color::COLOR_1,
|
341 |
+
],
|
342 |
+
'condition' => [
|
343 |
+
|
344 |
+
'display_mode_collection' => 'timeline',
|
345 |
+
'embed_type' => 'collection',
|
346 |
+
//'display_mode_profile' =>'timeline'
|
347 |
+
|
348 |
+
]
|
349 |
+
]
|
350 |
+
);
|
351 |
+
|
352 |
+
$this->add_control(
|
353 |
+
'display_mode_profile',
|
354 |
+
[
|
355 |
+
'label' => __( 'Display Mode', 'wts-eae' ),
|
356 |
+
'type' => Controls_Manager::SELECT,
|
357 |
+
'default' => 'timeline',
|
358 |
+
'options' => [
|
359 |
+
'timeline' => __( 'Timeline', 'wts-eae' ),
|
360 |
+
'button' => __( 'Button', 'wts-eae' ),
|
361 |
+
],
|
362 |
+
'condition' => [
|
363 |
+
'embed_type' => [ 'profile', 'handle' ]
|
364 |
+
]
|
365 |
+
|
366 |
+
]
|
367 |
+
);
|
368 |
+
|
369 |
+
$this->add_control(
|
370 |
+
'height_profile_timeline',
|
371 |
+
[
|
372 |
+
'label' => __( 'Height', 'wts-eae' ),
|
373 |
+
'type' => Controls_Manager::SLIDER,
|
374 |
+
'default' => [
|
375 |
+
'size' => 500,
|
376 |
+
|
377 |
+
],
|
378 |
+
'range' => [
|
379 |
+
'px' => [
|
380 |
+
'min' => 250,
|
381 |
+
'max' => 1300,
|
382 |
+
'step' => 10
|
383 |
+
]
|
384 |
+
],
|
385 |
+
'condition' => [
|
386 |
+
|
387 |
+
'display_mode_profile' => 'timeline',
|
388 |
+
'embed_type' => [ 'profile', 'handle' ]
|
389 |
+
//'display_mode_collection' => 'timeline',
|
390 |
+
|
391 |
+
]
|
392 |
+
]
|
393 |
+
);
|
394 |
+
|
395 |
+
$this->add_control(
|
396 |
+
'theme_profile_timeline',
|
397 |
+
[
|
398 |
+
'label' => __( 'Theme', 'wts-eae' ),
|
399 |
+
'type' => Controls_Manager::SELECT,
|
400 |
+
'default' => 'light',
|
401 |
+
'options' => [
|
402 |
+
'light' => __( 'Light', 'wts-eae' ),
|
403 |
+
'dark' => __( 'Dark', 'wts-eae' ),
|
404 |
+
],
|
405 |
+
'condition' => [
|
406 |
+
'display_mode_profile' => 'timeline',
|
407 |
+
'embed_type' => [ 'profile', 'handle' ]
|
408 |
+
//'display_mode_profile' =>'timeline'
|
409 |
+
]
|
410 |
+
]
|
411 |
+
);
|
412 |
+
|
413 |
+
$this->add_control(
|
414 |
+
'link_color_profile',
|
415 |
+
[
|
416 |
+
'label' => __( 'Display Link Color', 'wts-eae' ),
|
417 |
+
'type' => Controls_Manager::COLOR,
|
418 |
+
'scheme' => [
|
419 |
+
'type' => Scheme_Color::get_type(),
|
420 |
+
'value' => Scheme_Color::COLOR_1,
|
421 |
+
],
|
422 |
+
'condition' => [
|
423 |
+
|
424 |
+
'display_mode_profile' => 'timeline',
|
425 |
+
'embed_type' => [ 'profile', 'handle' ]
|
426 |
+
//'display_mode_collection' => 'timeline',
|
427 |
+
|
428 |
+
|
429 |
+
]
|
430 |
+
]
|
431 |
+
);
|
432 |
+
|
433 |
+
|
434 |
+
$this->add_control(
|
435 |
+
'button_type',
|
436 |
+
[
|
437 |
+
'label' => __( 'Button Type', 'wts-eae' ),
|
438 |
+
'type' => Controls_Manager::SELECT,
|
439 |
+
'default' => 'follow-button',
|
440 |
+
'options' => [
|
441 |
+
'follow-button' => __( 'Follow', 'wts-aea' ),
|
442 |
+
'mention-button' => __( 'Mention', 'wts-eae' ),
|
443 |
+
],
|
444 |
+
'condition' => [
|
445 |
+
'display_mode_profile' => 'button',
|
446 |
+
'embed_type' => [ 'profile', 'handle' ]
|
447 |
+
]
|
448 |
+
]
|
449 |
+
);
|
450 |
+
|
451 |
+
$this->add_control(
|
452 |
+
'hide_name',
|
453 |
+
[
|
454 |
+
'label' => __( 'Hide Name', 'wts-eae' ),
|
455 |
+
'type' => Controls_Manager::SWITCHER,
|
456 |
+
'default' => '',
|
457 |
+
'label_on' => __( 'Show', 'wts-eae' ),
|
458 |
+
'label_off' => __( 'Hide', 'wts-eae' ),
|
459 |
+
'return_value' => 'yes',
|
460 |
+
'condition' => [
|
461 |
+
|
462 |
+
'display_mode_profile' => 'button',
|
463 |
+
'button_type' => 'follow-button',
|
464 |
+
'embed_type' => [ 'profile', 'handle' ]
|
465 |
+
|
466 |
+
]
|
467 |
+
]
|
468 |
+
|
469 |
+
);
|
470 |
+
|
471 |
+
$this->add_control(
|
472 |
+
'show_count',
|
473 |
+
[
|
474 |
+
'label' => __( 'Show Count', 'wts-eae' ),
|
475 |
+
'type' => Controls_Manager::SWITCHER,
|
476 |
+
'default' => 'yes',
|
477 |
+
'label_on' => __( 'Show', 'wts-eae' ),
|
478 |
+
'label_off' => __( 'Hide', 'wts-eae' ),
|
479 |
+
'return_value' => 'yes',
|
480 |
+
'condition' => [
|
481 |
+
'embed_type' => [ 'profile', 'handle' ],
|
482 |
+
'display_mode_profile' => 'button',
|
483 |
+
'button_type' => 'follow-button'
|
484 |
+
|
485 |
+
]
|
486 |
+
]
|
487 |
+
|
488 |
+
);
|
489 |
+
|
490 |
+
$this->add_control(
|
491 |
+
'prefill_text',
|
492 |
+
[
|
493 |
+
'label' => __( 'Tweet Text', 'wts-eae' ),
|
494 |
+
'type' => Controls_Manager::TEXTAREA,
|
495 |
+
'default' => '',
|
496 |
+
'description' => __( 'Do you want to prefill the Tweet text?', 'wts-eae' ),
|
497 |
+
'condition' => [
|
498 |
+
'embed_type' => [ 'profile', 'handle' ],
|
499 |
+
'display_mode_profile' => 'button',
|
500 |
+
'button_type' => 'mention-button',
|
501 |
+
],
|
502 |
+
|
503 |
+
]
|
504 |
+
);
|
505 |
+
|
506 |
+
$this->add_control(
|
507 |
+
'screen_name',
|
508 |
+
[
|
509 |
+
'label' => __( 'Screen Name', 'wts-eae' ),
|
510 |
+
'type' => Controls_Manager::TEXT,
|
511 |
+
'condition' => [
|
512 |
+
'embed_type' => [ 'profile', 'handle' ],
|
513 |
+
'display_mode_profile' => 'button',
|
514 |
+
'button_type' => 'mention-button'
|
515 |
+
]
|
516 |
+
]
|
517 |
+
);
|
518 |
+
|
519 |
+
$this->add_control(
|
520 |
+
'large_button',
|
521 |
+
[
|
522 |
+
'label' => __( 'Large Button', 'wts-eae' ),
|
523 |
+
'type' => Controls_Manager::SWITCHER,
|
524 |
+
'default' => '',
|
525 |
+
'label_on' => __( 'Yes', 'wts-eae' ),
|
526 |
+
'label_off' => __( 'No', 'wts-eae' ),
|
527 |
+
'return_value' => 'yes',
|
528 |
+
'condition' => [
|
529 |
+
'embed_type' => [ 'profile', 'handle' ],
|
530 |
+
'display_mode_profile' => 'button'
|
531 |
+
|
532 |
+
|
533 |
+
]
|
534 |
+
]
|
535 |
+
|
536 |
+
);
|
537 |
+
$this->add_control(
|
538 |
+
'height_list',
|
539 |
+
[
|
540 |
+
'label' => __( 'Height', 'wts-eae' ),
|
541 |
+
'type' => Controls_Manager::SLIDER,
|
542 |
+
'default' => [
|
543 |
+
'size' => 500,
|
544 |
+
|
545 |
+
],
|
546 |
+
'range' => [
|
547 |
+
'px' => [
|
548 |
+
'min' => 250,
|
549 |
+
'max' => 1300,
|
550 |
+
'step' => 10
|
551 |
+
]
|
552 |
+
],
|
553 |
+
'condition' => [
|
554 |
+
|
555 |
+
//'display_mode_profile' =>'timeline',
|
556 |
+
'embed_type' => [ 'list', 'likes' ],
|
557 |
+
//'display_mode_collection' => 'timeline',
|
558 |
+
|
559 |
+
]
|
560 |
+
]
|
561 |
+
);
|
562 |
+
|
563 |
+
$this->add_control(
|
564 |
+
'theme_list',
|
565 |
+
[
|
566 |
+
'label' => __( 'Theme', 'wts-eae' ),
|
567 |
+
'type' => Controls_Manager::SELECT,
|
568 |
+
'default' => 'light',
|
569 |
+
'options' => [
|
570 |
+
'light' => __( 'Light', 'wts-eae' ),
|
571 |
+
'dark' => __( 'Dark', 'wts-eae' ),
|
572 |
+
],
|
573 |
+
'condition' => [
|
574 |
+
//'display_mode_profile' => 'timeline',
|
575 |
+
'embed_type' => [ 'list', 'likes' ]
|
576 |
+
//'display_mode_profile' =>'timeline'
|
577 |
+
]
|
578 |
+
]
|
579 |
+
);
|
580 |
+
|
581 |
+
$this->add_control(
|
582 |
+
'link_color_list',
|
583 |
+
[
|
584 |
+
'label' => __( 'Display Link Color', 'wts-eae' ),
|
585 |
+
'type' => Controls_Manager::COLOR,
|
586 |
+
'scheme' => [
|
587 |
+
'type' => Scheme_Color::get_type(),
|
588 |
+
'value' => Scheme_Color::COLOR_1,
|
589 |
+
],
|
590 |
+
'condition' => [
|
591 |
+
|
592 |
+
//'display_mode_profile' =>'timeline',
|
593 |
+
'embed_type' => [ 'list', 'likes' ]
|
594 |
+
//'display_mode_collection' => 'timeline',
|
595 |
+
|
596 |
+
|
597 |
+
]
|
598 |
+
]
|
599 |
+
);
|
600 |
+
|
601 |
+
$prefill_options = [];
|
602 |
+
if ( is_single() ) {
|
603 |
+
$prefill_options = [
|
604 |
+
'post_title' => __( 'Post Title', 'wts-eae' ),
|
605 |
+
'excerpt' => __( 'Post Excerpt', 'wts-eae' ),
|
606 |
+
];
|
607 |
+
}
|
608 |
+
|
609 |
+
$prefill_options['custom'] = 'Custom';
|
610 |
+
$this->add_control(
|
611 |
+
'prefill_text_hashtag',
|
612 |
+
[
|
613 |
+
'label' => __( 'Pre Fill Text', 'wts-eae' ),
|
614 |
+
'type' => Controls_Manager::SELECT,
|
615 |
+
'default' => 'post_title',
|
616 |
+
'options' => $prefill_options,
|
617 |
+
'condition' => [
|
618 |
+
'embed_type' => 'hashtag',
|
619 |
+
],
|
620 |
+
'description' => __( 'Do you want to prefill the Tweet text?', 'wts-eae' ),
|
621 |
+
]
|
622 |
+
);
|
623 |
+
$this->add_control(
|
624 |
+
'prefill_custom',
|
625 |
+
[
|
626 |
+
'label' => __( 'Custom Prefill Text', 'wts-eae' ),
|
627 |
+
'type' => Controls_Manager::TEXTAREA,
|
628 |
+
'condition' => [
|
629 |
+
'prefill_text_hashtag' => 'custom',
|
630 |
+
'embed_type' => 'hashtag'
|
631 |
+
]
|
632 |
+
|
633 |
+
]
|
634 |
+
);
|
635 |
+
|
636 |
+
$this->add_control(
|
637 |
+
'hashtag_url',
|
638 |
+
[
|
639 |
+
'label' => __( 'Fix Url in Tweet' ),
|
640 |
+
'type' => Controls_Manager::TEXT,
|
641 |
+
'default' => '',
|
642 |
+
'description' => __( 'Do you want to set a specific URL in the Tweet?', 'wts-eae' ),
|
643 |
+
'condition' => [
|
644 |
+
'embed_type' => 'hashtag'
|
645 |
+
]
|
646 |
+
]
|
647 |
+
);
|
648 |
+
|
649 |
+
|
650 |
+
$this->add_control(
|
651 |
+
'language',
|
652 |
+
[
|
653 |
+
'label' => __( 'Language', 'wts-eae' ),
|
654 |
+
'type' => Controls_Manager::SELECT,
|
655 |
+
'options' => $this->languages(),
|
656 |
+
'default' => ''
|
657 |
+
]
|
658 |
+
);
|
659 |
+
|
660 |
+
$this->add_control(
|
661 |
+
'hashtag_large_button',
|
662 |
+
[
|
663 |
+
'label' => __( 'Large Button', 'wts-eae' ),
|
664 |
+
'type' => Controls_Manager::SWITCHER,
|
665 |
+
'default' => '',
|
666 |
+
'label_on' => __( 'Yes', 'wts-eae' ),
|
667 |
+
'label_off' => __( 'No', 'wts-eae' ),
|
668 |
+
'return_value' => 'yes',
|
669 |
+
'condition' => [
|
670 |
+
'embed_type' => 'hashtag',
|
671 |
+
]
|
672 |
+
]
|
673 |
+
|
674 |
+
);
|
675 |
+
|
676 |
+
|
677 |
+
}
|
678 |
+
|
679 |
+
public function languages() {
|
680 |
+
$languages = [
|
681 |
+
'' => __( 'Automatic', 'wts-eae' ),
|
682 |
+
'en' => __( 'English', 'wts-eae' ),
|
683 |
+
'ar' => __( 'Arabic', 'wta-eae' ),
|
684 |
+
'bn' => __( 'Bengali', 'wts-eae' ),
|
685 |
+
'cs' => __( 'Czech', 'wts-eae' ),
|
686 |
+
'da' => __( 'Danish', 'wts-eae' ),
|
687 |
+
'de' => __( 'German', 'wts-eae' ),
|
688 |
+
'el' => __( 'Greek', 'wts-eae' ),
|
689 |
+
'es' => __( 'Spanish', 'wts-eae' ),
|
690 |
+
'fa' => __( 'Persian', 'wts-eae' ),
|
691 |
+
'fi' => __( 'Finnish', 'wts-eae' ),
|
692 |
+
'fil' => __( 'Filipino', 'wts-eae' ),
|
693 |
+
'fr' => __( 'French', 'wts-eae' ),
|
694 |
+
'he' => __( 'Hebrew', 'wts-eae' ),
|
695 |
+
'hi' => __( 'Hindi', 'wts-eae' ),
|
696 |
+
'hu' => __( 'Hungarian', 'wts-eae' ),
|
697 |
+
'id' => __( 'Indonesian', 'wts-eae' ),
|
698 |
+
'it' => __( 'Italian', 'wts-eae' ),
|
699 |
+
'ja' => __( 'Japanese', 'wts-eae' ),
|
700 |
+
'ko' => __( 'Korean', 'wts-eae' ),
|
701 |
+
'msa' => __( 'Malay', 'wts-eae' ),
|
702 |
+
'nl' => __( 'Dutch', 'wts-eae' ),
|
703 |
+
'no' => __( 'Norwegian', 'wts-eae' ),
|
704 |
+
'pl' => __( 'Polish', 'wts-eae' ),
|
705 |
+
'pt' => __( 'Portuguese', 'wts-eae' ),
|
706 |
+
'ro' => __( 'Romania', 'wts-eae' ),
|
707 |
+
'ru' => __( 'Rus', 'wts-eae' ),
|
708 |
+
'sv' => __( 'Swedish', 'wts-eae' ),
|
709 |
+
'th' => __( 'Thai', 'wts-eae' ),
|
710 |
+
'tr' => __( 'Turkish', 'wts-eae' ),
|
711 |
+
'uk' => __( 'Ukrainian', 'wts-eae' ),
|
712 |
+
'ur' => __( 'Urdu', 'wts-eae' ),
|
713 |
+
'vi' => __( 'Vietnamese', 'wts-eae' ),
|
714 |
+
'zh-cn' => __( 'Chinese (Simplified)', 'wts-eae' ),
|
715 |
+
'zh-tw' => __( 'Chinese (Traditional)', 'wts-eae' ),
|
716 |
+
];
|
717 |
+
|
718 |
+
return $languages;
|
719 |
+
|
720 |
+
}
|
721 |
+
|
722 |
+
public function render() {
|
723 |
+
// TODO: Implement render() method.
|
724 |
+
$settings = $this->get_settings();
|
725 |
+
//echo'<pre>'; print_r($settings);
|
726 |
+
|
727 |
+
switch ( $settings['embed_type'] ) {
|
728 |
+
|
729 |
+
case "collection":
|
730 |
+
$this->get_collection_html( $settings );
|
731 |
+
break;
|
732 |
+
|
733 |
+
case "profile":
|
734 |
+
$this->get_profile_html( $settings );
|
735 |
+
break;
|
736 |
+
|
737 |
+
case "list":
|
738 |
+
$this->get_list_html( $settings );
|
739 |
+
break;
|
740 |
+
|
741 |
+
case "moments":
|
742 |
+
$this->get_moments_html( $settings );
|
743 |
+
break;
|
744 |
+
|
745 |
+
case "likes" :
|
746 |
+
$this->get_likes_html( $settings );
|
747 |
+
break;
|
748 |
+
|
749 |
+
case "handle" :
|
750 |
+
$this->get_handle_html( $settings );
|
751 |
+
break;
|
752 |
+
case "hashtag":
|
753 |
+
$this->get_hashtag_html( $settings );
|
754 |
+
break;
|
755 |
+
|
756 |
+
}
|
757 |
+
?>
|
758 |
+
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
|
759 |
+
<?php
|
760 |
+
|
761 |
+
}
|
762 |
+
|
763 |
+
public function get_collection_html( $settings ) {
|
764 |
+
$this->add_render_attribute( 'collection', 'class', 'twitter-' . $settings['display_mode_collection'] );
|
765 |
+
$this->add_render_attribute( 'collection', 'data-lang', $settings['language'] );
|
766 |
+
$this->add_render_attribute( 'collection', 'data-partner', 'twitter-deck' );
|
767 |
+
$this->add_render_attribute( 'collection', 'href', $settings['url_collection'] );
|
768 |
+
|
769 |
+
if ( $settings['display_mode_collection'] == 'grid' ) {
|
770 |
+
$this->add_render_attribute( 'collection', 'data-limit', $settings['no_of_tweets'] );
|
771 |
+
}
|
772 |
+
if ( $settings['display_mode_collection'] == 'timeline' ) {
|
773 |
+
$this->add_render_attribute( 'collection', 'data-height', $settings['height_collection_timeline']['size'] );
|
774 |
+
//$this->add_render_attribute('collection','data-width',$settings['width']['size']);
|
775 |
+
$this->add_render_attribute( 'collection', 'data-theme', $settings['theme_collection_timeline'] );
|
776 |
+
$this->add_render_attribute( 'collection', 'data-link-color', $settings['link_color_collection'] );
|
777 |
+
|
778 |
+
}
|
779 |
+
|
780 |
+
?>
|
781 |
+
<a <?php echo $this->get_render_attribute_string( 'collection' ); ?>></a>
|
782 |
+
<?php
|
783 |
+
}
|
784 |
+
|
785 |
+
public function get_profile_html( $settings ) {
|
786 |
+
$this->add_render_attribute( 'profile', 'href', $settings['url_profile'] );
|
787 |
+
$this->add_render_attribute( 'profile', 'data-lang', $settings['language'] );
|
788 |
+
if ( $settings['large_button'] == 'yes' ) {
|
789 |
+
$this->add_render_attribute( 'profile', 'data-size', 'large' );
|
790 |
+
}
|
791 |
+
|
792 |
+
|
793 |
+
if ( $settings['display_mode_profile'] == 'timeline' ) {
|
794 |
+
$this->add_render_attribute( 'profile', 'class', 'twitter-' . $settings['display_mode_profile'] );
|
795 |
+
$this->add_render_attribute( 'profile', 'data-partner', 'twitter-deck' );
|
796 |
+
$this->add_render_attribute( 'profile', 'data-height', $settings['height_profile_timeline']['size'] );
|
797 |
+
$this->add_render_attribute( 'profile', 'data-theme', $settings['theme_profile_timeline'] );
|
798 |
+
$this->add_render_attribute( 'profile', 'data-link-color', $settings['link_color_profile'] );
|
799 |
+
|
800 |
+
}
|
801 |
+
|
802 |
+
if ( $settings['display_mode_profile'] == 'button' && $settings['button_type'] == 'follow-button' ) {
|
803 |
+
$this->add_render_attribute( 'profile', 'class', 'twitter-' . $settings['button_type'] );
|
804 |
+
if ( $settings['hide_name'] == 'yes' ) {
|
805 |
+
$this->add_render_attribute( 'profile', 'data-show-screen-name', 'false' );
|
806 |
+
}
|
807 |
+
if ( $settings['show_count'] == '' ) {
|
808 |
+
$this->add_render_attribute( 'profile', 'data-show-count', 'false' );
|
809 |
+
}
|
810 |
+
}
|
811 |
+
|
812 |
+
if ( $settings['display_mode_profile'] == 'button' && $settings['button_type'] == 'mention-button' ) {
|
813 |
+
$this->add_render_attribute( 'profile', 'class', 'twitter-' . $settings['button_type'] );
|
814 |
+
$this->add_render_attribute( 'profile', 'data-text', $settings['prefill_text'] );
|
815 |
+
$this->add_render_attribute( 'profile', 'href', $settings['url_profile'] . '?screen_name=' . $settings['screen_name'] );
|
816 |
+
|
817 |
+
}
|
818 |
+
|
819 |
+
?>
|
820 |
+
<a <?php echo $this->get_render_attribute_string( 'profile' ); ?> ></a><?php
|
821 |
+
}
|
822 |
+
|
823 |
+
public function get_list_html( $settings ) {
|
824 |
+
if ( $settings['embed_type'] == 'list' ) {
|
825 |
+
$this->add_render_attribute( 'list', 'class', 'twitter-timeline' );
|
826 |
+
}
|
827 |
+
$this->add_render_attribute( 'list', 'href', $settings['url_list'] );
|
828 |
+
$this->add_render_attribute( 'list', 'data-height', $settings['height_list']['size'] );
|
829 |
+
//$this->add_render_attribute('collection','data-width',$settings['width']['size']);
|
830 |
+
$this->add_render_attribute( 'list', 'data-theme', $settings['theme_list'] );
|
831 |
+
$this->add_render_attribute( 'list', 'data-link-color', $settings['link_color_list'] );
|
832 |
+
$this->add_render_attribute( 'list', 'data-lang', $settings['language'] );
|
833 |
+
$this->add_render_attribute( 'list', 'data-partner', 'twitter-deck' );
|
834 |
+
?>
|
835 |
+
<a <?php echo $this->get_render_attribute_string( 'list' ); ?>> </a><?php
|
836 |
+
|
837 |
+
}
|
838 |
+
|
839 |
+
public function get_moments_html( $settings ) {
|
840 |
+
if ( $settings['embed_type'] == 'moments' ) {
|
841 |
+
$this->add_render_attribute( 'moments', 'class', 'twitter-moment' );
|
842 |
+
}
|
843 |
+
$this->add_render_attribute( 'moments', 'href', $settings['url_moments'] );
|
844 |
+
$this->add_render_attribute( 'moments', 'data-lang', $settings['language'] );
|
845 |
+
$this->add_render_attribute( 'moments', 'data-partner', 'twitter-deck' );
|
846 |
+
?>
|
847 |
+
<a <?php echo $this->get_render_attribute_string( 'moments' ); ?> > </a>
|
848 |
+
<?php
|
849 |
+
|
850 |
+
}
|
851 |
+
|
852 |
+
public function get_likes_html( $settings ) {
|
853 |
+
if ( $settings['embed_type'] == 'likes' ) {
|
854 |
+
$this->add_render_attribute( 'likes', 'class', 'twitter-timeline' );
|
855 |
+
}
|
856 |
+
$this->add_render_attribute( 'likes', 'href', $settings['url_likes'] );
|
857 |
+
$this->add_render_attribute( 'likes', 'data-height', $settings['height_list']['size'] );
|
858 |
+
$this->add_render_attribute( 'likes', 'data-theme', $settings['theme_list'] );
|
859 |
+
$this->add_render_attribute( 'likes', 'data-link-color', $settings['link_color_list'] );
|
860 |
+
$this->add_render_attribute( 'likes', 'data-lang', $settings['language'] );
|
861 |
+
$this->add_render_attribute( 'likes', 'data-partner', 'twitter-deck' );
|
862 |
+
?>
|
863 |
+
<a <?php echo $this->get_render_attribute_string( 'likes' ) ?> >Likes</php> </a>
|
864 |
+
<?php
|
865 |
+
}
|
866 |
+
|
867 |
+
public function get_handle_html( $settings ) {
|
868 |
+
|
869 |
+
$this->add_render_attribute( 'handle', 'data-lang', $settings['language'] );
|
870 |
+
if ( $settings['large_button'] == 'yes' ) {
|
871 |
+
$this->add_render_attribute( 'handle', 'data-size', 'large' );
|
872 |
+
}
|
873 |
+
|
874 |
+
|
875 |
+
if ( $settings['display_mode_profile'] == 'timeline' ) {
|
876 |
+
$this->add_render_attribute( 'handle', 'href', 'https://www.twitter.com/' . $settings['username'] );
|
877 |
+
$this->add_render_attribute( 'handle', 'class', 'twitter-' . $settings['display_mode_profile'] );
|
878 |
+
$this->add_render_attribute( 'handle', 'data-partner', 'twitter-deck' );
|
879 |
+
$this->add_render_attribute( 'handle', 'data-height', $settings['height_profile_timeline']['size'] );
|
880 |
+
$this->add_render_attribute( 'handle', 'data-theme', $settings['theme_profile_timeline'] );
|
881 |
+
$this->add_render_attribute( 'handle', 'data-link-color', $settings['link_color_profile'] );
|
882 |
+
|
883 |
+
}
|
884 |
+
|
885 |
+
if ( $settings['display_mode_profile'] == 'button' && $settings['button_type'] == 'follow-button' ) {
|
886 |
+
$this->add_render_attribute( 'handle', 'class', 'twitter-' . $settings['button_type'] );
|
887 |
+
$this->add_render_attribute( 'handle', 'href', 'https://www.twitter.com/' . $settings['username'] );
|
888 |
+
if ( $settings['hide_name'] == 'yes' ) {
|
889 |
+
$this->add_render_attribute( 'handle', 'data-show-screen-name', 'false' );
|
890 |
+
}
|
891 |
+
if ( $settings['show_count'] == '' ) {
|
892 |
+
$this->add_render_attribute( 'handle', 'data-show-count', 'false' );
|
893 |
+
}
|
894 |
+
}
|
895 |
+
|
896 |
+
if ( $settings['display_mode_profile'] == 'button' && $settings['button_type'] == 'mention-button' ) {
|
897 |
+
$this->add_render_attribute( 'handle', 'class', 'twitter-' . $settings['button_type'] );
|
898 |
+
$this->add_render_attribute( 'handle', 'data-text', $settings['prefill_text'] );
|
899 |
+
$this->add_render_attribute( 'handle', 'href','https://www.twitter.com/intent/tweet' . '?screen_name=' . $settings['screen_name'] );
|
900 |
+
|
901 |
+
|
902 |
+
}
|
903 |
+
|
904 |
+
?>
|
905 |
+
<a <?php echo $this->get_render_attribute_string( 'handle' ); ?> > Handle <?php echo $settings['username']; ?></a><?php
|
906 |
+
}
|
907 |
+
|
908 |
+
public function get_hashtag_html( $settings ) {
|
909 |
+
|
910 |
+
$this->add_render_attribute( 'hashtag', 'class', 'twitter-hashtag-button' );
|
911 |
+
$this->add_render_attribute( 'hashtag', 'href', 'https://twitter.com/intent/tweet?button_hashtag=' . $settings['hashtag'] );
|
912 |
+
$this->add_render_attribute( 'hashtag', 'data-lang', $settings['language'] );
|
913 |
+
|
914 |
+
if ( $settings['prefill_text_hashtag'] == 'post_title' ) {
|
915 |
+
|
916 |
+
$this->add_render_attribute( 'hashtag', 'data-text', $this->current_post_title() );
|
917 |
+
}
|
918 |
+
if ( $settings['prefill_text_hashtag'] == 'excerpt' ) {
|
919 |
+
|
920 |
+
$this->add_render_attribute( 'hashtag', 'data-text', $this->current_post_excerpt() );
|
921 |
+
}
|
922 |
+
if ( $settings['prefill_text_hashtag'] == 'custom' ) {
|
923 |
+
$this->add_render_attribute( 'hashtag', 'data-text', $settings['prefill_custom'] );
|
924 |
+
}
|
925 |
+
if ( $settings['hashtag_large_button'] == 'yes' ) {
|
926 |
+
$this->add_render_attribute( 'hashtag', 'data-size', 'large' );
|
927 |
+
}
|
928 |
+
$this->add_render_attribute( 'hashtag', 'data-url', $settings['hashtag_url'] );
|
929 |
+
|
930 |
+
?>
|
931 |
+
<a <?php echo $this->get_render_attribute_string( 'hashtag' ); ?> >Tweet<?php echo $settings['hashtag']; ?> </a>
|
932 |
+
<?php
|
933 |
+
|
934 |
+
|
935 |
+
}
|
936 |
+
|
937 |
+
public function current_post_title() {
|
938 |
+
|
939 |
+
global $post;
|
940 |
+
//echo'<pre>'; print_r($post); echo'<pre>';
|
941 |
+
$title = $post->post_title;
|
942 |
+
|
943 |
+
//echo $title;
|
944 |
+
return $title;
|
945 |
+
|
946 |
+
}
|
947 |
+
|
948 |
+
public function current_post_excerpt() {
|
949 |
+
global $post;
|
950 |
+
|
951 |
+
|
952 |
+
if ( has_excerpt( $post->ID ) ) {
|
953 |
+
return get_the_excerpt( $post->ID );
|
954 |
+
} else {
|
955 |
+
|
956 |
+
}
|
957 |
+
}
|
958 |
+
|
959 |
+
|
960 |
+
|
961 |
+
|
962 |
+
}
|
963 |
+
|
964 |
Plugin::instance()->widgets_manager->register_widget_type( new EAE_Twitter() );
|
inc/admin/Settings.php
CHANGED
@@ -1,116 +1,116 @@
|
|
1 |
-
<?php
|
2 |
-
/**
|
3 |
-
* Created by PhpStorm.
|
4 |
-
* User: anand
|
5 |
-
* Date: 10/01/18
|
6 |
-
* Time: 12:18 PM
|
7 |
-
*/
|
8 |
-
|
9 |
-
namespace EAE;
|
10 |
-
|
11 |
-
|
12 |
-
class Settings extends Settings_Page {
|
13 |
-
|
14 |
-
const PAGE_ID = 'eae';
|
15 |
-
|
16 |
-
public function __construct() {
|
17 |
-
parent::__construct();
|
18 |
-
|
19 |
-
add_action( 'admin_menu', [ $this, 'register_admin_menu' ], 20 );
|
20 |
-
}
|
21 |
-
|
22 |
-
public function register_admin_menu() {
|
23 |
-
add_menu_page(
|
24 |
-
__( 'Elementor Addon Elements', 'eae' ),
|
25 |
-
__( 'Elementor Addon Elements', 'eae' ),
|
26 |
-
'manage_options',
|
27 |
-
self::PAGE_ID,
|
28 |
-
[ $this, 'display_settings_page' ],
|
29 |
-
'',
|
30 |
-
99
|
31 |
-
);
|
32 |
-
}
|
33 |
-
|
34 |
-
protected function get_page_title() {
|
35 |
-
return __( 'Elementor Addons Elements', 'EAE' );
|
36 |
-
}
|
37 |
-
|
38 |
-
public function create_tabs() {
|
39 |
-
|
40 |
-
return [
|
41 |
-
'general' => [
|
42 |
-
'label' => __( 'General', 'elementor' ),
|
43 |
-
'sections' => [
|
44 |
-
'general' => [
|
45 |
-
'fields' => [
|
46 |
-
'gmap_key' => [
|
47 |
-
'label' => __( 'Google Map Key', 'wts-eae' ),
|
48 |
-
'field_args' => [
|
49 |
-
'type' => 'text',
|
50 |
-
'desc' => '<a href="https://developers.google.com/maps/documentation/javascript/get-api-key" target="_blank">'
|
51 |
-
. __('Click Here', 'eae') .
|
52 |
-
'</a> to generate API KEY'
|
53 |
-
],
|
54 |
-
]
|
55 |
-
]
|
56 |
-
]
|
57 |
-
]
|
58 |
-
],
|
59 |
-
'other_products' => [
|
60 |
-
'label' => __('Other Products', 'eae'),
|
61 |
-
'sections' => [
|
62 |
-
'other_products' => [
|
63 |
-
'fields' => [
|
64 |
-
'aepro' => [
|
65 |
-
'field_args' => [
|
66 |
-
'type' => 'raw_html',
|
67 |
-
'html' => $this->get_aepro_promo()
|
68 |
-
]
|
69 |
-
]
|
70 |
-
]
|
71 |
-
]
|
72 |
-
]
|
73 |
-
]
|
74 |
-
];
|
75 |
-
}
|
76 |
-
|
77 |
-
function get_aepro_promo(){
|
78 |
-
|
79 |
-
$promo_html = '<h2>AnyWhere Elementor Pro</h2>';
|
80 |
-
|
81 |
-
$promo_html .= '<style type="text/css">
|
82 |
-
.elementor_aepro th{ display:none; }
|
83 |
-
.desc-box{ width:50%; float:left; }
|
84 |
-
.logo-box{ width:50%; float:left; text-align: center; }
|
85 |
-
.logo-box img{ width:200px; }
|
86 |
-
.elementor_aepro h2{ font-size:30px; }
|
87 |
-
.eae-ae-actions a{ display:inline-block; margin-right:10px; text-decoration: none; padding: 10px 15px; background:#5cc4b6; color:#FFF; border-radius:3px; }
|
88 |
-
.eae-ae-actions a.demo{ background:#667eea; }
|
89 |
-
</style>
|
90 |
-
<div class="eae-ae-actions">
|
91 |
-
<a href="https://shop.webtechstreet.com/downloads/anywhere-elementor-pro/?ref=eae" target="_blank" class="learmore">Learn More</a>
|
92 |
-
<a href="https://aedemo.elementoraddons.com/?ref=eae" target="_blank" class="demo">See Demo</a>
|
93 |
-
</div>
|
94 |
-
<div class="desc-box">
|
95 |
-
<p>Supercharge your Elementor with the ability to design global layouts
|
96 |
-
|
97 |
-
<ul>
|
98 |
-
<li>Design global single post layouts</li>
|
99 |
-
<li>Design layout for Blog Page</li>
|
100 |
-
<li>Design layouts for Post Type Archives, Category/Custom Taxonomy Archives</li>
|
101 |
-
<li>Get the ability to design layouts for Author Archives, Search Page and 404 Pages</li>
|
102 |
-
<li>Use data from custom fields in your Elementor Layouts</li>
|
103 |
-
<li>Support many field types of ACF & Pods</li>
|
104 |
-
<li>Design WooCommerce Product, Shop and Category page layouts.</li>
|
105 |
-
</ul>
|
106 |
-
</p></div>
|
107 |
-
|
108 |
-
<div class="logo-box">
|
109 |
-
<img src="'.ELEMENTOR_ADDON_URL.'assets/aep.png" title="AnyWhere Elementor Pro" />
|
110 |
-
</div> ';
|
111 |
-
|
112 |
-
return $promo_html;
|
113 |
-
}
|
114 |
-
}
|
115 |
-
|
116 |
new Settings();
|
1 |
+
<?php
|
2 |
+
/**
|
3 |
+
* Created by PhpStorm.
|
4 |
+
* User: anand
|
5 |
+
* Date: 10/01/18
|
6 |
+
* Time: 12:18 PM
|
7 |
+
*/
|
8 |
+
|
9 |
+
namespace EAE;
|
10 |
+
|
11 |
+
|
12 |
+
class Settings extends Settings_Page {
|
13 |
+
|
14 |
+
const PAGE_ID = 'eae';
|
15 |
+
|
16 |
+
public function __construct() {
|
17 |
+
parent::__construct();
|
18 |
+
|
19 |
+
add_action( 'admin_menu', [ $this, 'register_admin_menu' ], 20 );
|
20 |
+
}
|
21 |
+
|
22 |
+
public function register_admin_menu() {
|
23 |
+
add_menu_page(
|
24 |
+
__( 'Elementor Addon Elements', 'eae' ),
|
25 |
+
__( 'Elementor Addon Elements', 'eae' ),
|
26 |
+
'manage_options',
|
27 |
+
self::PAGE_ID,
|
28 |
+
[ $this, 'display_settings_page' ],
|
29 |
+
'',
|
30 |
+
99
|
31 |
+
);
|
32 |
+
}
|
33 |
+
|
34 |
+
protected function get_page_title() {
|
35 |
+
return __( 'Elementor Addons Elements', 'EAE' );
|
36 |
+
}
|
37 |
+
|
38 |
+
public function create_tabs() {
|
39 |
+
|
40 |
+
return [
|
41 |
+
'general' => [
|
42 |
+
'label' => __( 'General', 'elementor' ),
|
43 |
+
'sections' => [
|
44 |
+
'general' => [
|
45 |
+
'fields' => [
|
46 |
+
'gmap_key' => [
|
47 |
+
'label' => __( 'Google Map Key', 'wts-eae' ),
|
48 |
+
'field_args' => [
|
49 |
+
'type' => 'text',
|
50 |
+
'desc' => '<a href="https://developers.google.com/maps/documentation/javascript/get-api-key" target="_blank">'
|
51 |
+
. __('Click Here', 'eae') .
|
52 |
+
'</a> to generate API KEY'
|
53 |
+
],
|
54 |
+
]
|
55 |
+
]
|
56 |
+
]
|
57 |
+
]
|
58 |
+
],
|
59 |
+
'other_products' => [
|
60 |
+
'label' => __('Other Products', 'eae'),
|
61 |
+
'sections' => [
|
62 |
+
'other_products' => [
|
63 |
+
'fields' => [
|
64 |
+
'aepro' => [
|
65 |
+
'field_args' => [
|
66 |
+
'type' => 'raw_html',
|
67 |
+
'html' => $this->get_aepro_promo()
|
68 |
+
]
|
69 |
+
]
|
70 |
+
]
|
71 |
+
]
|
72 |
+
]
|
73 |
+
]
|
74 |
+
];
|
75 |
+
}
|
76 |
+
|
77 |
+
function get_aepro_promo(){
|
78 |
+
|
79 |
+
$promo_html = '<h2>AnyWhere Elementor Pro</h2>';
|
80 |
+
|
81 |
+
$promo_html .= '<style type="text/css">
|
82 |
+
.elementor_aepro th{ display:none; }
|
83 |
+
.desc-box{ width:50%; float:left; }
|
84 |
+
.logo-box{ width:50%; float:left; text-align: center; }
|
85 |
+
.logo-box img{ width:200px; }
|
86 |
+
.elementor_aepro h2{ font-size:30px; }
|
87 |
+
.eae-ae-actions a{ display:inline-block; margin-right:10px; text-decoration: none; padding: 10px 15px; background:#5cc4b6; color:#FFF; border-radius:3px; }
|
88 |
+
.eae-ae-actions a.demo{ background:#667eea; }
|
89 |
+
</style>
|
90 |
+
<div class="eae-ae-actions">
|
91 |
+
<a href="https://shop.webtechstreet.com/downloads/anywhere-elementor-pro/?ref=eae" target="_blank" class="learmore">Learn More</a>
|
92 |
+
<a href="https://aedemo.elementoraddons.com/?ref=eae" target="_blank" class="demo">See Demo</a>
|
93 |
+
</div>
|
94 |
+
<div class="desc-box">
|
95 |
+
<p>Supercharge your Elementor with the ability to design global layouts
|
96 |
+
|
97 |
+
<ul>
|
98 |
+
<li>Design global single post layouts</li>
|
99 |
+
<li>Design layout for Blog Page</li>
|
100 |
+
<li>Design layouts for Post Type Archives, Category/Custom Taxonomy Archives</li>
|
101 |
+
<li>Get the ability to design layouts for Author Archives, Search Page and 404 Pages</li>
|
102 |
+
<li>Use data from custom fields in your Elementor Layouts</li>
|
103 |
+
<li>Support many field types of ACF & Pods</li>
|
104 |
+
<li>Design WooCommerce Product, Shop and Category page layouts.</li>
|
105 |
+
</ul>
|
106 |
+
</p></div>
|
107 |
+
|
108 |
+
<div class="logo-box">
|
109 |
+
<img src="'.ELEMENTOR_ADDON_URL.'assets/aep.png" title="AnyWhere Elementor Pro" />
|
110 |
+
</div> ';
|
111 |
+
|
112 |
+
return $promo_html;
|
113 |
+
}
|
114 |
+
}
|
115 |
+
|
116 |
new Settings();
|
inc/admin/controls.php
CHANGED
@@ -1,205 +1,205 @@
|
|
1 |
-
<?php
|
2 |
-
namespace EAE;
|
3 |
-
|
4 |
-
if ( ! defined( 'ABSPATH' ) ) {
|
5 |
-
exit; // Exit if accessed directly.
|
6 |
-
}
|
7 |
-
|
8 |
-
class Settings_Controls {
|
9 |
-
|
10 |
-
/**
|
11 |
-
* @static
|
12 |
-
* @since 1.0.0
|
13 |
-
* @access public
|
14 |
-
*/
|
15 |
-
public static function render( $field = [] ) {
|
16 |
-
if ( empty( $field ) || empty( $field['id'] ) ) {
|
17 |
-
return;
|
18 |
-
}
|
19 |
-
|
20 |
-
$defaults = [
|
21 |
-
'type' => '',
|
22 |
-
'placeholder' => '',
|
23 |
-
'classes' => [],
|
24 |
-
'std' => '',
|
25 |
-
'desc' => '',
|
26 |
-
];
|
27 |
-
|
28 |
-
$field = array_merge( $defaults, $field );
|
29 |
-
|
30 |
-
$method_name = '_' . $field['type'];
|
31 |
-
|
32 |
-
if ( ! method_exists( __CLASS__, $method_name ) ) {
|
33 |
-
$method_name = '_text';
|
34 |
-
}
|
35 |
-
|
36 |
-
self::$method_name( $field );
|
37 |
-
}
|
38 |
-
|
39 |
-
/**
|
40 |
-
* @static
|
41 |
-
* @since 1.0.0
|
42 |
-
* @access private
|
43 |
-
*/
|
44 |
-
private static function _text( array $field ) {
|
45 |
-
if ( empty( $field['classes'] ) ) {
|
46 |
-
$field['classes'] = [ 'regular-text' ];
|
47 |
-
}
|
48 |
-
?>
|
49 |
-
<input type="<?php echo esc_attr( $field['type'] ); ?>" class="<?php echo esc_attr( implode( ' ', $field['classes'] ) ); ?>" id="<?php echo esc_attr( $field['id'] ); ?>" name="<?php echo esc_attr( $field['id'] ); ?>" value="<?php echo esc_attr( get_option( $field['id'], $field['std'] ) ); ?>"<?php echo ! empty( $field['placeholder'] ) ? ' placeholder="' . $field['placeholder'] . '"' : ''; ?> />
|
50 |
-
<?php
|
51 |
-
if ( ! empty( $field['sub_desc'] ) ) :
|
52 |
-
echo $field['sub_desc'];
|
53 |
-
endif;
|
54 |
-
?>
|
55 |
-
<?php if ( ! empty( $field['desc'] ) ) : ?>
|
56 |
-
<p class="description"><?php echo $field['desc']; ?></p>
|
57 |
-
<?php
|
58 |
-
endif;
|
59 |
-
}
|
60 |
-
|
61 |
-
/**
|
62 |
-
* @static
|
63 |
-
* @since 1.0.0
|
64 |
-
* @access private
|
65 |
-
*/
|
66 |
-
private static function _checkbox( array $field ) {
|
67 |
-
?>
|
68 |
-
<label>
|
69 |
-
<input type="<?php echo esc_attr( $field['type'] ); ?>" id="<?php echo esc_attr( $field['id'] ); ?>" name="<?php echo esc_attr( $field['id'] ); ?>" value="<?php echo $field['value']; ?>"<?php checked( $field['value'], get_option( $field['id'], $field['std'] ) ); ?> />
|
70 |
-
<?php
|
71 |
-
if ( ! empty( $field['sub_desc'] ) ) :
|
72 |
-
echo $field['sub_desc'];
|
73 |
-
endif;
|
74 |
-
?>
|
75 |
-
</label>
|
76 |
-
<?php if ( ! empty( $field['desc'] ) ) : ?>
|
77 |
-
<p class="description"><?php echo $field['desc']; ?></p>
|
78 |
-
<?php
|
79 |
-
endif;
|
80 |
-
}
|
81 |
-
|
82 |
-
/**
|
83 |
-
* @static
|
84 |
-
* @since 1.0.0
|
85 |
-
* @access private
|
86 |
-
*/
|
87 |
-
private static function _checkbox_list( array $field ) {
|
88 |
-
$old_value = get_option( $field['id'], $field['std'] );
|
89 |
-
if ( ! is_array( $old_value ) ) {
|
90 |
-
$old_value = [];
|
91 |
-
}
|
92 |
-
|
93 |
-
foreach ( $field['options'] as $option_key => $option_value ) :
|
94 |
-
?>
|
95 |
-
<label>
|
96 |
-
<input type="checkbox" name="<?php echo $field['id']; ?>[]" value="<?php echo $option_key; ?>"<?php checked( in_array( $option_key, $old_value ), true ); ?> />
|
97 |
-
<?php echo $option_value; ?>
|
98 |
-
</label><br />
|
99 |
-
<?php endforeach; ?>
|
100 |
-
<?php if ( ! empty( $field['desc'] ) ) : ?>
|
101 |
-
<p class="description"><?php echo $field['desc']; ?></p>
|
102 |
-
<?php
|
103 |
-
endif;
|
104 |
-
}
|
105 |
-
|
106 |
-
/**
|
107 |
-
* @static
|
108 |
-
* @since 1.4.0
|
109 |
-
* @access private
|
110 |
-
*/
|
111 |
-
private static function _select( array $field ) {
|
112 |
-
$old_value = get_option( $field['id'], $field['std'] );
|
113 |
-
?>
|
114 |
-
<select name="<?php echo esc_attr( $field['id'] ); ?>">
|
115 |
-
<?php if ( ! empty( $field['show_select'] ) ) : ?>
|
116 |
-
<option value="">— <?php _e( 'Select', 'elementor' ); ?> —</option>
|
117 |
-
<?php endif; ?>
|
118 |
-
|
119 |
-
<?php foreach ( $field['options'] as $value => $label ) : ?>
|
120 |
-
<option value="<?php echo esc_attr( $value ); ?>"<?php selected( $value, $old_value ); ?>><?php echo $label; ?></option>
|
121 |
-
<?php endforeach; ?>
|
122 |
-
</select>
|
123 |
-
|
124 |
-
<?php if ( ! empty( $field['desc'] ) ) : ?>
|
125 |
-
<p class="description"><?php echo $field['desc']; ?></p>
|
126 |
-
<?php
|
127 |
-
endif;
|
128 |
-
}
|
129 |
-
|
130 |
-
/**
|
131 |
-
* @static
|
132 |
-
* @since 1.0.0
|
133 |
-
* @access private
|
134 |
-
*/
|
135 |
-
private static function _checkbox_list_cpt( array $field ) {
|
136 |
-
$defaults = [
|
137 |
-
'exclude' => [],
|
138 |
-
];
|
139 |
-
$field = array_merge( $defaults, $field );
|
140 |
-
|
141 |
-
$post_types_objects = get_post_types(
|
142 |
-
[
|
143 |
-
'public' => true,
|
144 |
-
], 'objects'
|
145 |
-
);
|
146 |
-
$field['options'] = [];
|
147 |
-
foreach ( $post_types_objects as $cpt_slug => $post_type ) {
|
148 |
-
if ( in_array( $cpt_slug, $field['exclude'] ) ) {
|
149 |
-
continue;
|
150 |
-
}
|
151 |
-
|
152 |
-
$field['options'][ $cpt_slug ] = $post_type->labels->name;
|
153 |
-
}
|
154 |
-
|
155 |
-
self::_checkbox_list( $field );
|
156 |
-
}
|
157 |
-
|
158 |
-
/**
|
159 |
-
* @static
|
160 |
-
* @since 1.0.0
|
161 |
-
* @access private
|
162 |
-
*/
|
163 |
-
private static function _checkbox_list_roles( array $field ) {
|
164 |
-
$defaults = [
|
165 |
-
'exclude' => [],
|
166 |
-
];
|
167 |
-
$field = array_merge( $defaults, $field );
|
168 |
-
|
169 |
-
$field['options'] = [];
|
170 |
-
foreach ( get_editable_roles() as $role_slug => $role_data ) {
|
171 |
-
if ( in_array( $role_slug, $field['exclude'] ) ) {
|
172 |
-
continue;
|
173 |
-
}
|
174 |
-
|
175 |
-
$field['options'][ $role_slug ] = $role_data['name'];
|
176 |
-
}
|
177 |
-
|
178 |
-
self::_checkbox_list( $field );
|
179 |
-
}
|
180 |
-
|
181 |
-
/**
|
182 |
-
* @static
|
183 |
-
* @since 1.0.0
|
184 |
-
* @access private
|
185 |
-
*/
|
186 |
-
private static function _raw_html( array $field ) {
|
187 |
-
if ( empty( $field['html'] ) ) {
|
188 |
-
return;
|
189 |
-
}
|
190 |
-
?>
|
191 |
-
<div id="<?php echo $field['id']; ?>">
|
192 |
-
|
193 |
-
<div><?php echo $field['html']; ?></div>
|
194 |
-
<?php
|
195 |
-
if ( ! empty( $field['sub_desc'] ) ) :
|
196 |
-
echo $field['sub_desc'];
|
197 |
-
endif;
|
198 |
-
?>
|
199 |
-
<?php if ( ! empty( $field['desc'] ) ) : ?>
|
200 |
-
<p class="description"><?php echo $field['desc']; ?></p>
|
201 |
-
<?php endif; ?>
|
202 |
-
</div>
|
203 |
-
<?php
|
204 |
-
}
|
205 |
-
}
|
1 |
+
<?php
|
2 |
+
namespace EAE;
|
3 |
+
|
4 |
+
if ( ! defined( 'ABSPATH' ) ) {
|
5 |
+
exit; // Exit if accessed directly.
|
6 |
+
}
|
7 |
+
|
8 |
+
class Settings_Controls {
|
9 |
+
|
10 |
+
/**
|
11 |
+
* @static
|
12 |
+
* @since 1.0.0
|
13 |
+
* @access public
|
14 |
+
*/
|
15 |
+
public static function render( $field = [] ) {
|
16 |
+
if ( empty( $field ) || empty( $field['id'] ) ) {
|
17 |
+
return;
|
18 |
+
}
|
19 |
+
|
20 |
+
$defaults = [
|
21 |
+
'type' => '',
|
22 |
+
'placeholder' => '',
|
23 |
+
'classes' => [],
|
24 |
+
'std' => '',
|
25 |
+
'desc' => '',
|
26 |
+
];
|
27 |
+
|
28 |
+
$field = array_merge( $defaults, $field );
|
29 |
+
|
30 |
+
$method_name = '_' . $field['type'];
|
31 |
+
|
32 |
+
if ( ! method_exists( __CLASS__, $method_name ) ) {
|
33 |
+
$method_name = '_text';
|
34 |
+
}
|
35 |
+
|
36 |
+
self::$method_name( $field );
|
37 |
+
}
|
38 |
+
|
39 |
+
/**
|
40 |
+
* @static
|
41 |
+
* @since 1.0.0
|
42 |
+
* @access private
|
43 |
+
*/
|
44 |
+
private static function _text( array $field ) {
|
45 |
+
if ( empty( $field['classes'] ) ) {
|
46 |
+
$field['classes'] = [ 'regular-text' ];
|
47 |
+
}
|
48 |
+
?>
|
49 |
+
<input type="<?php echo esc_attr( $field['type'] ); ?>" class="<?php echo esc_attr( implode( ' ', $field['classes'] ) ); ?>" id="<?php echo esc_attr( $field['id'] ); ?>" name="<?php echo esc_attr( $field['id'] ); ?>" value="<?php echo esc_attr( get_option( $field['id'], $field['std'] ) ); ?>"<?php echo ! empty( $field['placeholder'] ) ? ' placeholder="' . $field['placeholder'] . '"' : ''; ?> />
|
50 |
+
<?php
|
51 |
+
if ( ! empty( $field['sub_desc'] ) ) :
|
52 |
+
echo $field['sub_desc'];
|
53 |
+
endif;
|
54 |
+
?>
|
55 |
+
<?php if ( ! empty( $field['desc'] ) ) : ?>
|
56 |
+
<p class="description"><?php echo $field['desc']; ?></p>
|
57 |
+
<?php
|
58 |
+
endif;
|
59 |
+
}
|
60 |
+
|
61 |
+
/**
|
62 |
+
* @static
|
63 |
+
* @since 1.0.0
|
64 |
+
* @access private
|
65 |
+
*/
|
66 |
+
private static function _checkbox( array $field ) {
|
67 |
+
?>
|
68 |
+
<label>
|
69 |
+
<input type="<?php echo esc_attr( $field['type'] ); ?>" id="<?php echo esc_attr( $field['id'] ); ?>" name="<?php echo esc_attr( $field['id'] ); ?>" value="<?php echo $field['value']; ?>"<?php checked( $field['value'], get_option( $field['id'], $field['std'] ) ); ?> />
|
70 |
+
<?php
|
71 |
+
if ( ! empty( $field['sub_desc'] ) ) :
|
72 |
+
echo $field['sub_desc'];
|
73 |
+
endif;
|
74 |
+
?>
|
75 |
+
</label>
|
76 |
+
<?php if ( ! empty( $field['desc'] ) ) : ?>
|
77 |
+
<p class="description"><?php echo $field['desc']; ?></p>
|
78 |
+
<?php
|
79 |
+
endif;
|
80 |
+
}
|
81 |
+
|
82 |
+
/**
|
83 |
+
* @static
|
84 |
+
* @since 1.0.0
|
85 |
+
* @access private
|
86 |
+
*/
|
87 |
+
private static function _checkbox_list( array $field ) {
|
88 |
+
$old_value = get_option( $field['id'], $field['std'] );
|
89 |
+
if ( ! is_array( $old_value ) ) {
|
90 |
+
$old_value = [];
|
91 |
+
}
|
92 |
+
|
93 |
+
foreach ( $field['options'] as $option_key => $option_value ) :
|
94 |
+
?>
|
95 |
+
<label>
|
96 |
+
<input type="checkbox" name="<?php echo $field['id']; ?>[]" value="<?php echo $option_key; ?>"<?php checked( in_array( $option_key, $old_value ), true ); ?> />
|
97 |
+
<?php echo $option_value; ?>
|
98 |
+
</label><br />
|
99 |
+
<?php endforeach; ?>
|
100 |
+
<?php if ( ! empty( $field['desc'] ) ) : ?>
|
101 |
+
<p class="description"><?php echo $field['desc']; ?></p>
|
102 |
+
<?php
|
103 |
+
endif;
|
104 |
+
}
|
105 |
+
|
106 |
+
/**
|
107 |
+
* @static
|
108 |
+
* @since 1.4.0
|
109 |
+
* @access private
|
110 |
+
*/
|
111 |
+
private static function _select( array $field ) {
|
112 |
+
$old_value = get_option( $field['id'], $field['std'] );
|
113 |
+
?>
|
114 |
+
<select name="<?php echo esc_attr( $field['id'] ); ?>">
|
115 |
+
<?php if ( ! empty( $field['show_select'] ) ) : ?>
|
116 |
+
<option value="">— <?php _e( 'Select', 'elementor' ); ?> —</option>
|
117 |
+
<?php endif; ?>
|
118 |
+
|
119 |
+
<?php foreach ( $field['options'] as $value => $label ) : ?>
|
120 |
+
<option value="<?php echo esc_attr( $value ); ?>"<?php selected( $value, $old_value ); ?>><?php echo $label; ?></option>
|
121 |
+
<?php endforeach; ?>
|
122 |
+
</select>
|
123 |
+
|
124 |
+
<?php if ( ! empty( $field['desc'] ) ) : ?>
|
125 |
+
<p class="description"><?php echo $field['desc']; ?></p>
|
126 |
+
<?php
|
127 |
+
endif;
|
128 |
+
}
|
129 |
+
|
130 |
+
/**
|
131 |
+
* @static
|
132 |
+
* @since 1.0.0
|
133 |
+
* @access private
|
134 |
+
*/
|
135 |
+
private static function _checkbox_list_cpt( array $field ) {
|
136 |
+
$defaults = [
|
137 |
+
'exclude' => [],
|
138 |
+
];
|
139 |
+
$field = array_merge( $defaults, $field );
|
140 |
+
|
141 |
+
$post_types_objects = get_post_types(
|
142 |
+
[
|
143 |
+
'public' => true,
|
144 |
+
], 'objects'
|
145 |
+
);
|
146 |
+
$field['options'] = [];
|
147 |
+
foreach ( $post_types_objects as $cpt_slug => $post_type ) {
|
148 |
+
if ( in_array( $cpt_slug, $field['exclude'] ) ) {
|
149 |
+
continue;
|
150 |
+
}
|
151 |
+
|
152 |
+
$field['options'][ $cpt_slug ] = $post_type->labels->name;
|
153 |
+
}
|
154 |
+
|
155 |
+
self::_checkbox_list( $field );
|
156 |
+
}
|
157 |
+
|
158 |
+
/**
|
159 |
+
* @static
|
160 |
+
* @since 1.0.0
|
161 |
+
* @access private
|
162 |
+
*/
|
163 |
+
private static function _checkbox_list_roles( array $field ) {
|
164 |
+
$defaults = [
|
165 |
+
'exclude' => [],
|
166 |
+
];
|
167 |
+
$field = array_merge( $defaults, $field );
|
168 |
+
|
169 |
+
$field['options'] = [];
|
170 |
+
foreach ( get_editable_roles() as $role_slug => $role_data ) {
|
171 |
+
if ( in_array( $role_slug, $field['exclude'] ) ) {
|
172 |
+
continue;
|
173 |
+
}
|
174 |
+
|
175 |
+
$field['options'][ $role_slug ] = $role_data['name'];
|
176 |
+
}
|
177 |
+
|
178 |
+
self::_checkbox_list( $field );
|
179 |
+
}
|
180 |
+
|
181 |
+
/**
|
182 |
+
* @static
|
183 |
+
* @since 1.0.0
|
184 |
+
* @access private
|
185 |
+
*/
|
186 |
+
private static function _raw_html( array $field ) {
|
187 |
+
if ( empty( $field['html'] ) ) {
|
188 |
+
return;
|
189 |
+
}
|
190 |
+
?>
|
191 |
+
<div id="<?php echo $field['id']; ?>">
|
192 |
+
|
193 |
+
<div><?php echo $field['html']; ?></div>
|
194 |
+
<?php
|
195 |
+
if ( ! empty( $field['sub_desc'] ) ) :
|
196 |
+
echo $field['sub_desc'];
|
197 |
+
endif;
|
198 |
+
?>
|
199 |
+
<?php if ( ! empty( $field['desc'] ) ) : ?>
|
200 |
+
<p class="description"><?php echo $field['desc']; ?></p>
|
201 |
+
<?php endif; ?>
|
202 |
+
</div>
|
203 |
+
<?php
|
204 |
+
}
|
205 |
+
}
|
inc/admin/settings-page.php
CHANGED
@@ -1,268 +1,268 @@
|
|
1 |
-
<?php
|
2 |
-
namespace EAE;
|
3 |
-
|
4 |
-
if ( ! defined( 'ABSPATH' ) ) {
|
5 |
-
exit; // Exit if accessed directly.
|
6 |
-
}
|
7 |
-
|
8 |
-
abstract class Settings_Page {
|
9 |
-
private $tabs;
|
10 |
-
|
11 |
-
const PAGE_ID = '';
|
12 |
-
|
13 |
-
/**
|
14 |
-
* @abstract
|
15 |
-
* @since 1.5.0
|
16 |
-
* @access protected
|
17 |
-
*/
|
18 |
-
abstract protected function create_tabs();
|
19 |
-
|
20 |
-
/**
|
21 |
-
* @abstract
|
22 |
-
* @since 1.5.0
|
23 |
-
* @access protected
|
24 |
-
*/
|
25 |
-
abstract protected function get_page_title();
|
26 |
-
|
27 |
-
/**
|
28 |
-
* @static
|
29 |
-
* @since 1.5.0
|
30 |
-
* @access public
|
31 |
-
*/
|
32 |
-
public final static function get_url() {
|
33 |
-
return admin_url( 'admin.php?page=' . static::PAGE_ID );
|
34 |
-
}
|
35 |
-
|
36 |
-
/**
|
37 |
-
* @since 1.5.0
|
38 |
-
* @access public
|
39 |
-
*/
|
40 |
-
public function __construct() {
|
41 |
-
add_action( 'admin_init', [ $this, 'register_settings_fields' ] );
|
42 |
-
}
|
43 |
-
|
44 |
-
/**
|
45 |
-
* @since 1.5.0
|
46 |
-
* @access public
|
47 |
-
*/
|
48 |
-
public final function get_tabs() {
|
49 |
-
$this->ensure_tabs();
|
50 |
-
|
51 |
-
return $this->tabs;
|
52 |
-
}
|
53 |
-
|
54 |
-
/**
|
55 |
-
* @since 1.5.0
|
56 |
-
* @access public
|
57 |
-
*/
|
58 |
-
public final function add_tab( $tab_id, array $tab_args = [] ) {
|
59 |
-
$this->ensure_tabs();
|
60 |
-
|
61 |
-
if ( isset( $this->tabs[ $tab_id ] ) ) {
|
62 |
-
// Don't override an existing tab
|
63 |
-
return;
|
64 |
-
}
|
65 |
-
|
66 |
-
if ( ! isset( $tab_args['sections'] ) ) {
|
67 |
-
$tab_args['sections'] = [];
|
68 |
-
}
|
69 |
-
|
70 |
-
$this->tabs[ $tab_id ] = $tab_args;
|
71 |
-
}
|
72 |
-
|
73 |
-
/**
|
74 |
-
* @since 1.5.0
|
75 |
-
* @access public
|
76 |
-
*/
|
77 |
-
public final function add_section( $tab_id, $section_id, array $section_args = [] ) {
|
78 |
-
$this->ensure_tabs();
|
79 |
-
|
80 |
-
if ( ! isset( $this->tabs[ $tab_id ] ) ) {
|
81 |
-
// If the requested tab doesn't exists, use the first tab
|
82 |
-
$tab_id = key( $this->tabs );
|
83 |
-
}
|
84 |
-
|
85 |
-
if ( isset( $this->tabs[ $tab_id ]['sections'][ $section_id ] ) ) {
|
86 |
-
// Don't override an existing section
|
87 |
-
return;
|
88 |
-
}
|
89 |
-
|
90 |
-
if ( ! isset( $section_args['fields'] ) ) {
|
91 |
-
$section_args['fields'] = [];
|
92 |
-
}
|
93 |
-
|
94 |
-
$this->tabs[ $tab_id ]['sections'][ $section_id ] = $section_args;
|
95 |
-
}
|
96 |
-
|
97 |
-
/**
|
98 |
-
* @since 1.5.0
|
99 |
-
* @access public
|
100 |
-
*/
|
101 |
-
public final function add_field( $tab_id, $section_id, $field_id, array $field_args ) {
|
102 |
-
$this->ensure_tabs();
|
103 |
-
|
104 |
-
if ( ! isset( $this->tabs[ $tab_id ] ) ) {
|
105 |
-
// If the requested tab doesn't exists, use the first tab
|
106 |
-
$tab_id = key( $this->tabs );
|
107 |
-
}
|
108 |
-
|
109 |
-
if ( ! isset( $this->tabs[ $tab_id ]['sections'][ $section_id ] ) ) {
|
110 |
-
// If the requested section doesn't exists, use the first section
|
111 |
-
$section_id = key( $this->tabs[ $tab_id ]['sections'] );
|
112 |
-
}
|
113 |
-
|
114 |
-
if ( isset( $this->tabs[ $tab_id ]['sections'][ $section_id ]['fields'][ $field_id ] ) ) {
|
115 |
-
// Don't override an existing field
|
116 |
-
return;
|
117 |
-
}
|
118 |
-
|
119 |
-
$this->tabs[ $tab_id ]['sections'][ $section_id ]['fields'][ $field_id ] = $field_args;
|
120 |
-
}
|
121 |
-
|
122 |
-
/**
|
123 |
-
* @since 1.5.0
|
124 |
-
* @access public
|
125 |
-
*/
|
126 |
-
public final function add_fields( $tab_id, $section_id, array $fields ) {
|
127 |
-
foreach ( $fields as $field_id => $field ) {
|
128 |
-
$this->add_field( $tab_id, $section_id, $field_id, $field );
|
129 |
-
}
|
130 |
-
}
|
131 |
-
|
132 |
-
/**
|
133 |
-
* @since 1.5.0
|
134 |
-
* @access public
|
135 |
-
*/
|
136 |
-
public final function register_settings_fields() {
|
137 |
-
$controls_class_name = __NAMESPACE__ . '\Settings_Controls';
|
138 |
-
|
139 |
-
$tabs = $this->get_tabs();
|
140 |
-
|
141 |
-
foreach ( $tabs as $tab_id => $tab ) {
|
142 |
-
|
143 |
-
foreach ( $tab['sections'] as $section_id => $section ) {
|
144 |
-
$full_section_id = 'elementor_' . $section_id . '_section';
|
145 |
-
|
146 |
-
$label = isset( $section['label'] ) ? $section['label'] : '';
|
147 |
-
|
148 |
-
$section_callback = isset( $section['callback'] ) ? $section['callback'] : '__return_empty_string';
|
149 |
-
|
150 |
-
add_settings_section( $full_section_id, $label, $section_callback, static::PAGE_ID );
|
151 |
-
|
152 |
-
foreach ( $section['fields'] as $field_id => $field ) {
|
153 |
-
$full_field_id = ! empty( $field['full_field_id'] ) ? $field['full_field_id'] : 'wts_eae_' . $field_id;
|
154 |
-
|
155 |
-
$field['field_args']['id'] = $full_field_id;
|
156 |
-
|
157 |
-
$field_classes = [ $full_field_id ];
|
158 |
-
|
159 |
-
if ( ! empty( $field['class'] ) ) {
|
160 |
-
$field_classes[] = $field['field_args']['class'];
|
161 |
-
}
|
162 |
-
|
163 |
-
$field['field_args']['class'] = implode( ' ', $field_classes );
|
164 |
-
|
165 |
-
add_settings_field(
|
166 |
-
$full_field_id,
|
167 |
-
isset( $field['label'] ) ? $field['label'] : '',
|
168 |
-
[ $controls_class_name, 'render' ],
|
169 |
-
static::PAGE_ID,
|
170 |
-
$full_section_id,
|
171 |
-
$field['field_args']
|
172 |
-
);
|
173 |
-
|
174 |
-
$setting_args = [];
|
175 |
-
|
176 |
-
if ( ! empty( $field['setting_args'] ) ) {
|
177 |
-
$setting_args = $field['setting_args'];
|
178 |
-
}
|
179 |
-
|
180 |
-
register_setting( static::PAGE_ID, $full_field_id, $setting_args );
|
181 |
-
}
|
182 |
-
}
|
183 |
-
}
|
184 |
-
}
|
185 |
-
|
186 |
-
/**
|
187 |
-
* @since 1.5.0
|
188 |
-
* @access public
|
189 |
-
*/
|
190 |
-
public function display_settings_page() {
|
191 |
-
$tabs = $this->get_tabs();
|
192 |
-
?>
|
193 |
-
<div class="wrap">
|
194 |
-
<h1><?php echo $this->get_page_title(); ?></h1>
|
195 |
-
<div id="elementor-settings-tabs-wrapper" class="nav-tab-wrapper">
|
196 |
-
<?php
|
197 |
-
foreach ( $tabs as $tab_id => $tab ) {
|
198 |
-
if ( empty( $tab['sections'] ) ) {
|
199 |
-
continue;
|
200 |
-
}
|
201 |
-
|
202 |
-
$active_class = '';
|
203 |
-
|
204 |
-
if ( 'general' === $tab_id ) {
|
205 |
-
$active_class = ' nav-tab-active';
|
206 |
-
}
|
207 |
-
|
208 |
-
echo "<a id='elementor-settings-tab-$tab_id' class='nav-tab$active_class' href='#tab-$tab_id'>$tab[label]</a>";
|
209 |
-
}
|
210 |
-
?>
|
211 |
-
</div>
|
212 |
-
<form id="elementor-settings-form" method="post" action="options.php">
|
213 |
-
<?php
|
214 |
-
settings_fields( static::PAGE_ID );
|
215 |
-
|
216 |
-
foreach ( $tabs as $tab_id => $tab ) {
|
217 |
-
if ( empty( $tab['sections'] ) ) {
|
218 |
-
continue;
|
219 |
-
}
|
220 |
-
|
221 |
-
$active_class = '';
|
222 |
-
|
223 |
-
if ( 'general' === $tab_id ) {
|
224 |
-
$active_class = ' elementor-active';
|
225 |
-
}
|
226 |
-
|
227 |
-
echo "<div id='tab-$tab_id' class='elementor-settings-form-page$active_class'>";
|
228 |
-
|
229 |
-
foreach ( $tab['sections'] as $section_id => $section ) {
|
230 |
-
$full_section_id = 'elementor_' . $section_id . '_section';
|
231 |
-
|
232 |
-
if ( ! empty( $section['label'] ) ) {
|
233 |
-
echo "<h2>$section[label]</h2>";
|
234 |
-
}
|
235 |
-
|
236 |
-
if ( ! empty( $section['callback'] ) ) {
|
237 |
-
$section['callback']();
|
238 |
-
}
|
239 |
-
|
240 |
-
echo '<table class="form-table">';
|
241 |
-
|
242 |
-
do_settings_fields( static::PAGE_ID, $full_section_id );
|
243 |
-
|
244 |
-
echo '</table>';
|
245 |
-
}
|
246 |
-
|
247 |
-
echo '</div>';
|
248 |
-
}
|
249 |
-
|
250 |
-
submit_button();
|
251 |
-
?>
|
252 |
-
</form>
|
253 |
-
</div><!-- /.wrap -->
|
254 |
-
<?php
|
255 |
-
}
|
256 |
-
|
257 |
-
/**
|
258 |
-
* @since 1.5.0
|
259 |
-
* @access private
|
260 |
-
*/
|
261 |
-
private function ensure_tabs() {
|
262 |
-
if ( null === $this->tabs ) {
|
263 |
-
$this->tabs = $this->create_tabs();
|
264 |
-
|
265 |
-
do_action( 'elementor/admin/after_create_settings/' . static::PAGE_ID, $this );
|
266 |
-
}
|
267 |
-
}
|
268 |
-
}
|
1 |
+
<?php
|
2 |
+
namespace EAE;
|
3 |
+
|
4 |
+
if ( ! defined( 'ABSPATH' ) ) {
|
5 |
+
exit; // Exit if accessed directly.
|
6 |
+
}
|
7 |
+
|
8 |
+
abstract class Settings_Page {
|
9 |
+
private $tabs;
|
10 |
+
|
11 |
+
const PAGE_ID = '';
|
12 |
+
|
13 |
+
/**
|
14 |
+
* @abstract
|
15 |
+
* @since 1.5.0
|
16 |
+
* @access protected
|
17 |
+
*/
|
18 |
+
abstract protected function create_tabs();
|
19 |
+
|
20 |
+
/**
|
21 |
+
* @abstract
|
22 |
+
* @since 1.5.0
|
23 |
+
* @access protected
|
24 |
+
*/
|
25 |
+
abstract protected function get_page_title();
|
26 |
+
|
27 |
+
/**
|
28 |
+
* @static
|
29 |
+
* @since 1.5.0
|
30 |
+
* @access public
|
31 |
+
*/
|
32 |
+
public final static function get_url() {
|
33 |
+
return admin_url( 'admin.php?page=' . static::PAGE_ID );
|
34 |
+
}
|
35 |
+
|
36 |
+
/**
|
37 |
+
* @since 1.5.0
|
38 |
+
* @access public
|
39 |
+
*/
|
40 |
+
public function __construct() {
|
41 |
+
add_action( 'admin_init', [ $this, 'register_settings_fields' ] );
|
42 |
+
}
|
43 |
+
|
44 |
+
/**
|
45 |
+
* @since 1.5.0
|
46 |
+
* @access public
|
47 |
+
*/
|
48 |
+
public final function get_tabs() {
|
49 |
+
$this->ensure_tabs();
|
50 |
+
|
51 |
+
return $this->tabs;
|
52 |
+
}
|
53 |
+
|
54 |
+
/**
|
55 |
+
* @since 1.5.0
|
56 |
+
* @access public
|
57 |
+
*/
|
58 |
+
public final function add_tab( $tab_id, array $tab_args = [] ) {
|
59 |
+
$this->ensure_tabs();
|
60 |
+
|
61 |
+
if ( isset( $this->tabs[ $tab_id ] ) ) {
|
62 |
+
// Don't override an existing tab
|
63 |
+
return;
|
64 |
+
}
|
65 |
+
|
66 |
+
if ( ! isset( $tab_args['sections'] ) ) {
|
67 |
+
$tab_args['sections'] = [];
|
68 |
+
}
|
69 |
+
|
70 |
+
$this->tabs[ $tab_id ] = $tab_args;
|
71 |
+
}
|
72 |
+
|
73 |
+
/**
|
74 |
+
* @since 1.5.0
|
75 |
+
* @access public
|
76 |
+
*/
|
77 |
+
public final function add_section( $tab_id, $section_id, array $section_args = [] ) {
|
78 |
+
$this->ensure_tabs();
|
79 |
+
|
80 |
+
if ( ! isset( $this->tabs[ $tab_id ] ) ) {
|
81 |
+
// If the requested tab doesn't exists, use the first tab
|
82 |
+
$tab_id = key( $this->tabs );
|
83 |
+
}
|
84 |
+
|
85 |
+
if ( isset( $this->tabs[ $tab_id ]['sections'][ $section_id ] ) ) {
|
86 |
+
// Don't override an existing section
|
87 |
+
return;
|
88 |
+
}
|
89 |
+
|
90 |
+
if ( ! isset( $section_args['fields'] ) ) {
|
91 |
+
$section_args['fields'] = [];
|
92 |
+
}
|
93 |
+
|
94 |
+
$this->tabs[ $tab_id ]['sections'][ $section_id ] = $section_args;
|
95 |
+
}
|
96 |
+
|
97 |
+
/**
|
98 |
+
* @since 1.5.0
|
99 |
+
* @access public
|
100 |
+
*/
|
101 |
+
public final function add_field( $tab_id, $section_id, $field_id, array $field_args ) {
|
102 |
+
$this->ensure_tabs();
|
103 |
+
|
104 |
+
if ( ! isset( $this->tabs[ $tab_id ] ) ) {
|
105 |
+
// If the requested tab doesn't exists, use the first tab
|
106 |
+
$tab_id = key( $this->tabs );
|
107 |
+
}
|
108 |
+
|
109 |
+
if ( ! isset( $this->tabs[ $tab_id ]['sections'][ $section_id ] ) ) {
|
110 |
+
// If the requested section doesn't exists, use the first section
|
111 |
+
$section_id = key( $this->tabs[ $tab_id ]['sections'] );
|
112 |
+
}
|
113 |
+
|
114 |
+
if ( isset( $this->tabs[ $tab_id ]['sections'][ $section_id ]['fields'][ $field_id ] ) ) {
|
115 |
+
// Don't override an existing field
|
116 |
+
return;
|
117 |
+
}
|
118 |
+
|
119 |
+
$this->tabs[ $tab_id ]['sections'][ $section_id ]['fields'][ $field_id ] = $field_args;
|
120 |
+
}
|
121 |
+
|
122 |
+
/**
|
123 |
+
* @since 1.5.0
|
124 |
+
* @access public
|
125 |
+
*/
|
126 |
+
public final function add_fields( $tab_id, $section_id, array $fields ) {
|
127 |
+
foreach ( $fields as $field_id => $field ) {
|
128 |
+
$this->add_field( $tab_id, $section_id, $field_id, $field );
|
129 |
+
}
|
130 |
+
}
|
131 |
+
|
132 |
+
/**
|
133 |
+
* @since 1.5.0
|
134 |
+
* @access public
|
135 |
+
*/
|
136 |
+
public final function register_settings_fields() {
|
137 |
+
$controls_class_name = __NAMESPACE__ . '\Settings_Controls';
|
138 |
+
|
139 |
+
$tabs = $this->get_tabs();
|
140 |
+
|
141 |
+
foreach ( $tabs as $tab_id => $tab ) {
|
142 |
+
|
143 |
+
foreach ( $tab['sections'] as $section_id => $section ) {
|
144 |
+
$full_section_id = 'elementor_' . $section_id . '_section';
|
145 |
+
|
146 |
+
$label = isset( $section['label'] ) ? $section['label'] : '';
|
147 |
+
|
148 |
+
$section_callback = isset( $section['callback'] ) ? $section['callback'] : '__return_empty_string';
|
149 |
+
|
150 |
+
add_settings_section( $full_section_id, $label, $section_callback, static::PAGE_ID );
|
151 |
+
|
152 |
+
foreach ( $section['fields'] as $field_id => $field ) {
|
153 |
+
$full_field_id = ! empty( $field['full_field_id'] ) ? $field['full_field_id'] : 'wts_eae_' . $field_id;
|
154 |
+
|
155 |
+
$field['field_args']['id'] = $full_field_id;
|
156 |
+
|
157 |
+
$field_classes = [ $full_field_id ];
|
158 |
+
|
159 |
+
if ( ! empty( $field['class'] ) ) {
|
160 |
+
$field_classes[] = $field['field_args']['class'];
|
161 |
+
}
|
162 |
+
|
163 |
+
$field['field_args']['class'] = implode( ' ', $field_classes );
|
164 |
+
|
165 |
+
add_settings_field(
|
166 |
+
$full_field_id,
|
167 |
+
isset( $field['label'] ) ? $field['label'] : '',
|
168 |
+
[ $controls_class_name, 'render' ],
|
169 |
+
static::PAGE_ID,
|
170 |
+
$full_section_id,
|
171 |
+
$field['field_args']
|
172 |
+
);
|
173 |
+
|
174 |
+
$setting_args = [];
|
175 |
+
|
176 |
+
if ( ! empty( $field['setting_args'] ) ) {
|
177 |
+
$setting_args = $field['setting_args'];
|
178 |
+
}
|
179 |
+
|
180 |
+
register_setting( static::PAGE_ID, $full_field_id, $setting_args );
|
181 |
+
}
|
182 |
+
}
|
183 |
+
}
|
184 |
+
}
|
185 |
+
|
186 |
+
/**
|
187 |
+
* @since 1.5.0
|
188 |
+
* @access public
|
189 |
+
*/
|
190 |
+
public function display_settings_page() {
|
191 |
+
$tabs = $this->get_tabs();
|
192 |
+
?>
|
193 |
+
<div class="wrap">
|
194 |
+
<h1><?php echo $this->get_page_title(); ?></h1>
|
195 |
+
<div id="elementor-settings-tabs-wrapper" class="nav-tab-wrapper">
|
196 |
+
<?php
|
197 |
+
foreach ( $tabs as $tab_id => $tab ) {
|
198 |
+
if ( empty( $tab['sections'] ) ) {
|
199 |
+
continue;
|
200 |
+
}
|
201 |
+
|
202 |
+
$active_class = '';
|
203 |
+
|
204 |
+
if ( 'general' === $tab_id ) {
|
205 |
+
$active_class = ' nav-tab-active';
|
206 |
+
}
|
207 |
+
|
208 |
+
echo "<a id='elementor-settings-tab-$tab_id' class='nav-tab$active_class' href='#tab-$tab_id'>$tab[label]</a>";
|
209 |
+
}
|
210 |
+
?>
|
211 |
+
</div>
|
212 |
+
<form id="elementor-settings-form" method="post" action="options.php">
|
213 |
+
<?php
|
214 |
+
settings_fields( static::PAGE_ID );
|
215 |
+
|
216 |
+
foreach ( $tabs as $tab_id => $tab ) {
|
217 |
+
if ( empty( $tab['sections'] ) ) {
|
218 |
+
continue;
|
219 |
+
}
|
220 |
+
|
221 |
+
$active_class = '';
|
222 |
+
|
223 |
+
if ( 'general' === $tab_id ) {
|
224 |
+
$active_class = ' elementor-active';
|
225 |
+
}
|
226 |
+
|
227 |
+
echo "<div id='tab-$tab_id' class='elementor-settings-form-page$active_class'>";
|
228 |
+
|
229 |
+
foreach ( $tab['sections'] as $section_id => $section ) {
|
230 |
+
$full_section_id = 'elementor_' . $section_id . '_section';
|
231 |
+
|
232 |
+
if ( ! empty( $section['label'] ) ) {
|
233 |
+
echo "<h2>$section[label]</h2>";
|
234 |
+
}
|
235 |
+
|
236 |
+
if ( ! empty( $section['callback'] ) ) {
|
237 |
+
$section['callback']();
|
238 |
+
}
|
239 |
+
|
240 |
+
echo '<table class="form-table">';
|
241 |
+
|
242 |
+
do_settings_fields( static::PAGE_ID, $full_section_id );
|
243 |
+
|
244 |
+
echo '</table>';
|
245 |
+
}
|
246 |
+
|
247 |
+
echo '</div>';
|
248 |
+
}
|
249 |
+
|
250 |
+
submit_button();
|
251 |
+
?>
|
252 |
+
</form>
|
253 |
+
</div><!-- /.wrap -->
|
254 |
+
<?php
|
255 |
+
}
|
256 |
+
|
257 |
+
/**
|
258 |
+
* @since 1.5.0
|
259 |
+
* @access private
|
260 |
+
*/
|
261 |
+
private function ensure_tabs() {
|
262 |
+
if ( null === $this->tabs ) {
|
263 |
+
$this->tabs = $this->create_tabs();
|
264 |
+
|
265 |
+
do_action( 'elementor/admin/after_create_settings/' . static::PAGE_ID, $this );
|
266 |
+
}
|
267 |
+
}
|
268 |
+
}
|
inc/elementor-helper.php
CHANGED
@@ -1,19 +1,21 @@
|
|
1 |
-
<?php
|
2 |
-
namespace Elementor;
|
3 |
-
|
4 |
-
function eae_elementor_init(){
|
5 |
-
Plugin::instance()->elements_manager->add_category(
|
6 |
-
'wts-eae',
|
7 |
-
[
|
8 |
-
'title' => 'Elementor Addon Elements',
|
9 |
-
'icon' => 'font'
|
10 |
-
],
|
11 |
-
1
|
12 |
-
);
|
13 |
-
|
14 |
-
|
15 |
-
|
16 |
-
|
17 |
-
|
18 |
-
|
19 |
-
|
|
|
|
1 |
+
<?php
|
2 |
+
namespace Elementor;
|
3 |
+
|
4 |
+
function eae_elementor_init(){
|
5 |
+
Plugin::instance()->elements_manager->add_category(
|
6 |
+
'wts-eae',
|
7 |
+
[
|
8 |
+
'title' => 'Elementor Addon Elements',
|
9 |
+
'icon' => 'font'
|
10 |
+
],
|
11 |
+
1
|
12 |
+
);
|
13 |
+
|
14 |
+
require_once ELEMENTOR_ADDON_PATH.'elements/bg-slider.php';
|
15 |
+
require_once ELEMENTOR_ADDON_PATH.'elements/particles.php';
|
16 |
+
|
17 |
+
}
|
18 |
+
add_action('elementor/init','Elementor\eae_elementor_init');
|
19 |
+
|
20 |
+
|
21 |
+
|
inc/helper.php
CHANGED
@@ -1,105 +1,105 @@
|
|
1 |
-
<?php
|
2 |
-
|
3 |
-
|
4 |
-
function eae_get_post_data($args){
|
5 |
-
$defaults = array(
|
6 |
-
'posts_per_page' => 5,
|
7 |
-
'offset' => 0,
|
8 |
-
'category' => '',
|
9 |
-
'category_name' => '',
|
10 |
-
'orderby' => 'date',
|
11 |
-
'order' => 'DESC',
|
12 |
-
'include' => '',
|
13 |
-
'exclude' => '',
|
14 |
-
'meta_key' => '',
|
15 |
-
'meta_value' => '',
|
16 |
-
'post_type' => 'post',
|
17 |
-
'post_mime_type' => '',
|
18 |
-
'post_parent' => '',
|
19 |
-
'author' => '',
|
20 |
-
'author_name' => '',
|
21 |
-
'post_status' => 'publish',
|
22 |
-
'suppress_filters' => true
|
23 |
-
);
|
24 |
-
|
25 |
-
$atts = wp_parse_args($args,$defaults);
|
26 |
-
|
27 |
-
$posts = get_posts($atts);
|
28 |
-
|
29 |
-
return $posts;
|
30 |
-
}
|
31 |
-
|
32 |
-
function eae_get_post_types(){
|
33 |
-
$args = array(
|
34 |
-
'public' => true
|
35 |
-
);
|
36 |
-
|
37 |
-
$skip_post_types = ['attachment'];
|
38 |
-
|
39 |
-
$post_types = get_post_types($args);
|
40 |
-
return $post_types;
|
41 |
-
}
|
42 |
-
|
43 |
-
function eae_get_post_settings($settings){
|
44 |
-
$post_args['post_type'] = $settings['post_type'];
|
45 |
-
|
46 |
-
if($settings['post_type'] == 'post'){
|
47 |
-
$post_args['category'] = $settings['category'];
|
48 |
-
}
|
49 |
-
|
50 |
-
$post_args['posts_per_page'] = $settings['num_posts'];
|
51 |
-
$post_args['offset'] = $settings['post_offset'];
|
52 |
-
$post_args['orderby'] = $settings['orderby'];
|
53 |
-
$post_args['order'] = $settings['order'];
|
54 |
-
|
55 |
-
return $post_args;
|
56 |
-
}
|
57 |
-
|
58 |
-
function eae_get_excerpt_by_id($post_id,$excerpt_length){
|
59 |
-
$the_post = get_post($post_id); //Gets post ID
|
60 |
-
|
61 |
-
$the_excerpt = null;
|
62 |
-
if ($the_post)
|
63 |
-
{
|
64 |
-
$the_excerpt = $the_post->post_excerpt ? $the_post->post_excerpt : $the_post->post_content;
|
65 |
-
}
|
66 |
-
|
67 |
-
// $the_excerpt = ($the_post ? $the_post->post_content : null);//Gets post_content to be used as a basis for the excerpt
|
68 |
-
//echo $the_excerpt;
|
69 |
-
$the_excerpt = strip_tags(strip_shortcodes($the_excerpt)); //Strips tags and images
|
70 |
-
$words = explode(' ', $the_excerpt, $excerpt_length + 1);
|
71 |
-
|
72 |
-
if(count($words) > $excerpt_length) :
|
73 |
-
array_pop($words);
|
74 |
-
//array_push($words, '…');
|
75 |
-
$the_excerpt = implode(' ', $words);
|
76 |
-
$the_excerpt .= '...'; // Don't put a space before
|
77 |
-
endif;
|
78 |
-
|
79 |
-
return $the_excerpt;
|
80 |
-
}
|
81 |
-
|
82 |
-
function eae_get_thumbnail_sizes(){
|
83 |
-
$sizes = get_intermediate_image_sizes();
|
84 |
-
foreach($sizes as $s){
|
85 |
-
$ret[$s] = $s;
|
86 |
-
}
|
87 |
-
|
88 |
-
return $ret;
|
89 |
-
}
|
90 |
-
|
91 |
-
function eae_get_post_orderby_options(){
|
92 |
-
$orderby = array(
|
93 |
-
'ID' => 'Post Id',
|
94 |
-
'author' => 'Post Author',
|
95 |
-
'title' => 'Title',
|
96 |
-
'date' => 'Date',
|
97 |
-
'modified' => 'Last Modified Date',
|
98 |
-
'parent' => 'Parent Id',
|
99 |
-
'rand' => 'Random',
|
100 |
-
'comment_count' => 'Comment Count',
|
101 |
-
'menu_order' => 'Menu Order',
|
102 |
-
);
|
103 |
-
|
104 |
-
return $orderby;
|
105 |
}
|
1 |
+
<?php
|
2 |
+
|
3 |
+
|
4 |
+
function eae_get_post_data($args){
|
5 |
+
$defaults = array(
|
6 |
+
'posts_per_page' => 5,
|
7 |
+
'offset' => 0,
|
8 |
+
'category' => '',
|
9 |
+
'category_name' => '',
|
10 |
+
'orderby' => 'date',
|
11 |
+
'order' => 'DESC',
|
12 |
+
'include' => '',
|
13 |
+
'exclude' => '',
|
14 |
+
'meta_key' => '',
|
15 |
+
'meta_value' => '',
|
16 |
+
'post_type' => 'post',
|
17 |
+
'post_mime_type' => '',
|
18 |
+
'post_parent' => '',
|
19 |
+
'author' => '',
|
20 |
+
'author_name' => '',
|
21 |
+
'post_status' => 'publish',
|
22 |
+
'suppress_filters' => true
|
23 |
+
);
|
24 |
+
|
25 |
+
$atts = wp_parse_args($args,$defaults);
|
26 |
+
|
27 |
+
$posts = get_posts($atts);
|
28 |
+
|
29 |
+
return $posts;
|
30 |
+
}
|
31 |
+
|
32 |
+
function eae_get_post_types(){
|
33 |
+
$args = array(
|
34 |
+
'public' => true
|
35 |
+
);
|
36 |
+
|
37 |
+
$skip_post_types = ['attachment'];
|
38 |
+
|
39 |
+
$post_types = get_post_types($args);
|
40 |
+
return $post_types;
|
41 |
+
}
|
42 |
+
|
43 |
+
function eae_get_post_settings($settings){
|
44 |
+
$post_args['post_type'] = $settings['post_type'];
|
45 |
+
|
46 |
+
if($settings['post_type'] == 'post'){
|
47 |
+
$post_args['category'] = $settings['category'];
|
48 |
+
}
|
49 |
+
|
50 |
+
$post_args['posts_per_page'] = $settings['num_posts'];
|
51 |
+
$post_args['offset'] = $settings['post_offset'];
|
52 |
+
$post_args['orderby'] = $settings['orderby'];
|
53 |
+
$post_args['order'] = $settings['order'];
|
54 |
+
|
55 |
+
return $post_args;
|
56 |
+
}
|
57 |
+
|
58 |
+
function eae_get_excerpt_by_id($post_id,$excerpt_length){
|
59 |
+
$the_post = get_post($post_id); //Gets post ID
|
60 |
+
|
61 |
+
$the_excerpt = null;
|
62 |
+
if ($the_post)
|
63 |
+
{
|
64 |
+
$the_excerpt = $the_post->post_excerpt ? $the_post->post_excerpt : $the_post->post_content;
|
65 |
+
}
|
66 |
+
|
67 |
+
// $the_excerpt = ($the_post ? $the_post->post_content : null);//Gets post_content to be used as a basis for the excerpt
|
68 |
+
//echo $the_excerpt;
|
69 |
+
$the_excerpt = strip_tags(strip_shortcodes($the_excerpt)); //Strips tags and images
|
70 |
+
$words = explode(' ', $the_excerpt, $excerpt_length + 1);
|
71 |
+
|
72 |
+
if(count($words) > $excerpt_length) :
|
73 |
+
array_pop($words);
|
74 |
+
//array_push($words, '…');
|
75 |
+
$the_excerpt = implode(' ', $words);
|
76 |
+
$the_excerpt .= '...'; // Don't put a space before
|
77 |
+
endif;
|
78 |
+
|
79 |
+
return $the_excerpt;
|
80 |
+
}
|
81 |
+
|
82 |
+
function eae_get_thumbnail_sizes(){
|
83 |
+
$sizes = get_intermediate_image_sizes();
|
84 |
+
foreach($sizes as $s){
|
85 |
+
$ret[$s] = $s;
|
86 |
+
}
|
87 |
+
|
88 |
+
return $ret;
|
89 |
+
}
|
90 |
+
|
91 |
+
function eae_get_post_orderby_options(){
|
92 |
+
$orderby = array(
|
93 |
+
'ID' => 'Post Id',
|
94 |
+
'author' => 'Post Author',
|
95 |
+
'title' => 'Title',
|
96 |
+
'date' => 'Date',
|
97 |
+
'modified' => 'Last Modified Date',
|
98 |
+
'parent' => 'Parent Id',
|
99 |
+
'rand' => 'Random',
|
100 |
+
'comment_count' => 'Comment Count',
|
101 |
+
'menu_order' => 'Menu Order',
|
102 |
+
);
|
103 |
+
|
104 |
+
return $orderby;
|
105 |
}
|
readme.txt
CHANGED
@@ -1,122 +1,128 @@
|
|
1 |
-
=== Elementor Addon Elements ===
|
2 |
-
Contributors: webtechstreet, hardiksharma
|
3 |
-
Tags: page-builder, elementor
|
4 |
-
Requires at least: 4.4
|
5 |
-
Tested up to:
|
6 |
-
Stable tag:
|
7 |
-
License: GPLv2 or later
|
8 |
-
License URI: http://www.gnu.org/licenses/gpl-2.0.html
|
9 |
-
|
10 |
-
Add new elements to Elementor page builder.
|
11 |
-
|
12 |
-
== Description ==
|
13 |
-
|
14 |
-
This plugin adds new elements/widgets to Elementor Page Builder.
|
15 |
-
|
16 |
-
For more details and demo check our official site http://www.elementoraddons.com/
|
17 |
-
|
18 |
-
Current Addon Elements:
|
19 |
-
|
20 |
-
* Flip Box
|
21 |
-
* Text Separator
|
22 |
-
* Price Table
|
23 |
-
* Post List
|
24 |
-
* Animated Text
|
25 |
-
* After/Before Image Compare
|
26 |
-
* Split Text
|
27 |
-
*
|
28 |
-
*
|
29 |
-
*
|
30 |
-
|
31 |
-
|
32 |
-
|
33 |
-
|
34 |
-
|
35 |
-
|
36 |
-
|
37 |
-
|
38 |
-
|
39 |
-
|
40 |
-
|
41 |
-
|
42 |
-
|
43 |
-
|
44 |
-
|
45 |
-
|
46 |
-
|
47 |
-
|
48 |
-
|
49 |
-
|
50 |
-
|
51 |
-
|
52 |
-
|
53 |
-
|
54 |
-
|
55 |
-
|
56 |
-
|
57 |
-
|
58 |
-
|
59 |
-
|
60 |
-
|
61 |
-
|
62 |
-
3. /assets/screenshot-
|
63 |
-
|
64 |
-
|
65 |
-
|
66 |
-
|
67 |
-
|
68 |
-
* New
|
69 |
-
*
|
70 |
-
* Enhancement:
|
71 |
-
|
72 |
-
|
73 |
-
= 1.
|
74 |
-
* New Widget:
|
75 |
-
* New
|
76 |
-
* Enhancement: Added
|
77 |
-
*
|
78 |
-
|
79 |
-
|
80 |
-
|
81 |
-
*
|
82 |
-
|
83 |
-
|
84 |
-
*
|
85 |
-
|
86 |
-
|
87 |
-
|
88 |
-
|
89 |
-
|
90 |
-
*
|
91 |
-
|
92 |
-
|
93 |
-
= 0.
|
94 |
-
*
|
95 |
-
* Fixed
|
96 |
-
|
97 |
-
|
98 |
-
|
99 |
-
|
100 |
-
*
|
101 |
-
|
102 |
-
|
103 |
-
|
104 |
-
= 0.2.
|
105 |
-
*
|
106 |
-
|
107 |
-
|
108 |
-
|
109 |
-
|
110 |
-
|
111 |
-
*
|
112 |
-
|
113 |
-
= 0.
|
114 |
-
* Fixed
|
115 |
-
*
|
116 |
-
|
117 |
-
|
118 |
-
|
119 |
-
|
120 |
-
|
121 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
122 |
* Initial Launch with Text Separator element and Price Table
|
1 |
+
=== Elementor Addon Elements ===
|
2 |
+
Contributors: webtechstreet, hardiksharma
|
3 |
+
Tags: page-builder, elementor
|
4 |
+
Requires at least: 4.4
|
5 |
+
Tested up to: 5.0
|
6 |
+
Stable tag: 5.0
|
7 |
+
License: GPLv2 or later
|
8 |
+
License URI: http://www.gnu.org/licenses/gpl-2.0.html
|
9 |
+
|
10 |
+
Add new elements to Elementor page builder.
|
11 |
+
|
12 |
+
== Description ==
|
13 |
+
|
14 |
+
This plugin adds new elements/widgets to Elementor Page Builder.
|
15 |
+
|
16 |
+
For more details and demo check our official site http://www.elementoraddons.com/
|
17 |
+
|
18 |
+
Current Addon Elements:
|
19 |
+
|
20 |
+
* Flip Box
|
21 |
+
* Text Separator
|
22 |
+
* Price Table
|
23 |
+
* Post List
|
24 |
+
* Animated Text
|
25 |
+
* After/Before Image Compare
|
26 |
+
* Split Text
|
27 |
+
* Google Map (with ability to add styles from Snazzy Maps)
|
28 |
+
* Twitter (Show profile timeline, hashtag feed, tweet, follow and hashtag button)
|
29 |
+
* Shape Separator (Deprecated.. use shape separator available with Elementor)
|
30 |
+
|
31 |
+
Many more elements coming soon...
|
32 |
+
|
33 |
+
Also try our premium plugin "AnyWhere Elementor Pro" to create Global Post Layouts with Elementor
|
34 |
+
http://www.elementoraddons.com/anywhere-elementor-pro/
|
35 |
+
|
36 |
+
Note: This plugin is an addon of Elementor Page Builder (https://wordpress.org/plugins/elementor/) and will only work with Elementor Page Builder installed.
|
37 |
+
|
38 |
+
== Installation ==
|
39 |
+
|
40 |
+
1. Upload the plugin files to the `/wp-content/plugins/plugin-name` directory, or install the plugin through the WordPress plugins screen directly.
|
41 |
+
2. Activate the plugin through the 'Plugins' screen in WordPress
|
42 |
+
|
43 |
+
|
44 |
+
== Frequently Asked Questions ==
|
45 |
+
|
46 |
+
= Where can i find the new element added =
|
47 |
+
|
48 |
+
New elements are added at the end of default elementor elements.
|
49 |
+
|
50 |
+
= How to set shape separator as full width. =
|
51 |
+
Setting up separator can be little tricky for you initially.
|
52 |
+
Under section settings set
|
53 |
+
Stretch Section => yes
|
54 |
+
Content width => full width
|
55 |
+
Column gap => No gap
|
56 |
+
|
57 |
+
== Screenshots ==
|
58 |
+
|
59 |
+
1. /assets/screenshot-1.png
|
60 |
+
2. /assets/screenshot-2.png
|
61 |
+
3. /assets/screenshot-3.png
|
62 |
+
3. /assets/screenshot-4.png
|
63 |
+
|
64 |
+
== Changelog ==
|
65 |
+
|
66 |
+
= 1.2 =
|
67 |
+
* New Widget: Pop Up
|
68 |
+
* New Feature: Background slider
|
69 |
+
* Enhancement: Animation option added in Gmap marker icon
|
70 |
+
* Enhancement: More effects added in flipbox
|
71 |
+
|
72 |
+
|
73 |
+
= 1.1 =
|
74 |
+
* New Widget: After/Before Image Compare
|
75 |
+
* New Feature: Particles Background on Sections
|
76 |
+
* Enhancement: Added dynamic content support for Text Separator & FlipBox
|
77 |
+
* Bug Fix: Issue with flipbox on iPhones.
|
78 |
+
|
79 |
+
= 1.0 =
|
80 |
+
* New Widget: Google Map (With support for Snazzy Maps)
|
81 |
+
* New Widget: Twitter (Add timeline, tweet button, hashtag etc)
|
82 |
+
* Enhancement: Added Fade effect in FlipBox widget.
|
83 |
+
* Enhancement: Inline editing in Text Separator widget. Coming soon for other widgets.
|
84 |
+
* Bug Fix: Typography issue in Animated Text widget.
|
85 |
+
|
86 |
+
= 0.5 =
|
87 |
+
* Added new widget "Split Text"
|
88 |
+
|
89 |
+
= 0.4 =
|
90 |
+
* Added gradient background option in Flipbox, Pricetable & Animated Text
|
91 |
+
* Fix: css issue in Post List on mobile view.
|
92 |
+
|
93 |
+
= 0.3 =
|
94 |
+
* New Element - Animated Text
|
95 |
+
* Fixed issue: icons missing after elementor 1.0 release.
|
96 |
+
* Fixed issue: now uses except in post list element if available.
|
97 |
+
|
98 |
+
|
99 |
+
= 0.2.3 =
|
100 |
+
* Added more controls for price box section of Price Table
|
101 |
+
* Fixed IE11 animation issue in flipbox.
|
102 |
+
|
103 |
+
|
104 |
+
= 0.2.2 =
|
105 |
+
* Added responsive controls to Post List
|
106 |
+
* Corrected typo in Post List controls
|
107 |
+
|
108 |
+
|
109 |
+
|
110 |
+
= 0.2.1 =
|
111 |
+
* Fixed bug found in previous release. It broke text separator.
|
112 |
+
|
113 |
+
= 0.2.0 =
|
114 |
+
* Fixed issue with icon css in various elements.
|
115 |
+
* Fixed issue - text separator overlapping content below when aligned left or right.
|
116 |
+
* Added new element Post List
|
117 |
+
* Added new element Shape Separator
|
118 |
+
|
119 |
+
= 0.1.1 =
|
120 |
+
* Fixed php notices issue while using with WP_DEBUG true.
|
121 |
+
* Added width and align parameters to Text Separator. Now control the width and alignment of Text Separator.
|
122 |
+
|
123 |
+
= 0.1 =
|
124 |
+
* Introducing new element - FLIP BOX
|
125 |
+
* Fixed issue with price table border radius and background.
|
126 |
+
|
127 |
+
= 0.0.1 =
|
128 |
* Initial Launch with Text Separator element and Price Table
|