Variation Swatches for WooCommerce - Version 2.0.0

Version Description

MAJOR UPDATE * We have a brand new Settings page. * Allow converting Dropdowns to Label or Image Swatches automatically. * Allow enabling/disabling the built-in styles. * Ability to control the Swatch (shape, position, alignment, limit, custom state colors). * Ability to control the Tooltip (show/hide, custom styles) * Added the Dual-colour feature for the Swatches color. * Allow changing the Out of Stock behaviour. * Allow designing the Swatch styles in Product and Archive/Shop pages. * Allow showing/hiding the Swatches in the Archive/Shop pages. * Allow showing/hiding the Clear link in Archive/Shop pages.

Download this release

Release Info

Developer themealien
Plugin Icon 128x128 Variation Swatches for WooCommerce
Version 2.0.0
Comparing to
See all releases

Code changes from version 1.0.11 to 2.0.0

Files changed (38) hide show
  1. assets/css/admin-addons-page.css +586 -0
  2. assets/css/admin.css +1147 -35
  3. assets/css/frontend-list-products.css +24 -0
  4. assets/css/frontend.css +197 -111
  5. assets/images/support.png +0 -0
  6. assets/images/video-1.jpg +0 -0
  7. assets/images/video-2.jpg +0 -0
  8. assets/images/video-3.jpg +0 -0
  9. assets/images/video-4.jpg +0 -0
  10. assets/images/wc-plugins.png +0 -0
  11. assets/images/wslogo-dash.png +0 -0
  12. assets/images/wslogo.png +0 -0
  13. assets/js/admin.js +284 -141
  14. assets/js/admin.min.js +1 -0
  15. assets/js/frontend.js +36 -0
  16. assets/js/frontend.min.js +1 -0
  17. includes/class-addon-page.php +39 -0
  18. includes/class-admin.php +132 -47
  19. includes/class-frontend.php +276 -62
  20. includes/class-menu-page.php +128 -0
  21. includes/class-setting-fields-manager.php +1078 -0
  22. includes/class-setting-fields-renderer.php +551 -0
  23. includes/class-upgrader.php +164 -0
  24. includes/class-variation-swatches.php +111 -9
  25. readme.txt +59 -14
  26. templates/admin/addons-pages.php +53 -0
  27. templates/admin/partials/dashboard-header.php +11 -0
  28. templates/admin/partials/dashboard-menu.php +25 -0
  29. templates/admin/partials/modules-grid.php +46 -0
  30. templates/admin/partials/panel-footer.php +52 -0
  31. templates/admin/partials/panel-header.php +42 -0
  32. templates/admin/partials/panel-sidebar.php +37 -0
  33. templates/admin/partials/panel-video-tutorials.php +39 -0
  34. templates/admin/partials/support-card.php +17 -0
  35. templates/admin/pro-feature-popup.php +26 -0
  36. templates/admin/setting-panel.php +69 -0
  37. templates/admin/welcome-popup-version-2_0_0.php +18 -0
  38. variation-swatches-for-woocommerce.php +34 -14
assets/css/admin-addons-page.css ADDED
@@ -0,0 +1,586 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ /* Modules Page */
2
+ .woosuite-core-modules {
3
+ display: flex;
4
+ grid-gap: 20px;
5
+ flex-wrap: wrap;
6
+ }
7
+
8
+ .woosuite-core-modules .module-card {
9
+ display: flex;
10
+ flex: 0 0 270px;
11
+ background: #fff;
12
+ overflow: hidden;
13
+ position: relative;
14
+ flex-direction: column;
15
+ border-radius: 5px;
16
+ transition: box-shadow 0.3s ease-in 0s;
17
+ border: 1px solid rgba(0, 0, 0, 0.08);
18
+ box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.08);
19
+ }
20
+
21
+ .woosuite-core-modules .module-card:hover {
22
+ box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.08);
23
+ }
24
+
25
+ .woosuite-core-modules .module-card .header {
26
+ padding: 30px 20px;
27
+ }
28
+
29
+ .woosuite-core-modules .module-card .header img {
30
+ max-width: 200px;
31
+ display: block;
32
+ margin: 0 auto;
33
+ }
34
+
35
+ .woosuite-core-modules .module-card .main {
36
+ padding: 15px 20px;
37
+ flex-grow: 1;
38
+ }
39
+
40
+ .woosuite-core-modules .module-card .main .title {
41
+ font-size: 14px;
42
+ font-weight: 600;
43
+ margin-bottom: 10px;
44
+ }
45
+
46
+ .woosuite-core-modules .module-card .main .desc {
47
+ font-size: 12px;
48
+ }
49
+
50
+ .woosuite-core-modules .module-card .main .column-compatibility {
51
+ font-size: 11px;
52
+ margin-top: 20px;
53
+ }
54
+
55
+ .woosuite-core-modules .module-card .last-updated {
56
+ font-size: 11px;
57
+ margin: 10px 20px;
58
+ }
59
+
60
+ .essb-wrap-extensions .essb-column-compatibility {
61
+ width: 100% !important;
62
+ float: none !important;
63
+ text-align: left !important;
64
+ font-size: 12px;
65
+ margin-bottom: 5px;
66
+ }
67
+
68
+ .woosuite-core-modules .module-card .footer {
69
+ display: flex;
70
+ padding: 10px 15px;
71
+ align-items: center;
72
+ background: #f5f9fa;
73
+ justify-content: space-between;
74
+ flex-direction: row-reverse;
75
+ }
76
+
77
+ .woosuite-core-modules .module-card .footer .price {
78
+ font-size: 18px;
79
+ font-weight: 700;
80
+ text-transform: uppercase;
81
+ width: 25%;
82
+ letter-spacing: -0.2px;
83
+ }
84
+
85
+ .woosuite-core-modules .module-card .footer .action-btn {
86
+ border: none;
87
+ cursor: pointer;
88
+ background: #008060;
89
+ color: #fff;
90
+ font-size: 14px;
91
+ padding: 8px 20px;
92
+ border-radius: 3px;
93
+ text-decoration: none;
94
+ }
95
+
96
+ .woosuite-core-modules .module-card .footer .action-btn.loading {
97
+ opacity: 0.5;
98
+ cursor: not-allowed;
99
+ }
100
+
101
+ .woosuite-core-modules .module-card .footer .support-btn {
102
+ background-color: #e67e22;
103
+ }
104
+
105
+ .woosuite-core-modules .action-btn.learn-btn:hover {
106
+ opacity: 0.8;
107
+ }
108
+
109
+ .opt-desh-header {
110
+ margin-right: 20px;
111
+ }
112
+
113
+ .opt-desh-headr-inner {
114
+ margin: 0 -20px;
115
+ padding: 20px;
116
+ background: #22292D;
117
+ display: flex;
118
+ justify-content: space-between;
119
+ align-items: center;
120
+ position: relative;
121
+ }
122
+
123
+ .theme-version {
124
+ padding: 10px 20px;
125
+ border-radius: 30px;
126
+ background: #168471;
127
+ color: #fff;
128
+ font-size: 13px;
129
+ font-weight: 600;
130
+ }
131
+
132
+ .opt-desh-body-wrap {
133
+ margin-right: 20px;
134
+ background: #f4f9fd;
135
+ margin-top: -20px;
136
+ }
137
+
138
+ .opt-desh-body {
139
+ padding: 0 20px;
140
+ margin: 0 -20px;
141
+ background: #F4F9FD;
142
+ padding-bottom: 40px;
143
+ }
144
+
145
+ @media (min-width: 1450px) {
146
+ .opt-desh-container {
147
+ width: 1170px;
148
+ margin: 0 auto;
149
+ }
150
+ }
151
+ ul.opt-desh-menu {
152
+ padding-top: 25px;
153
+ display: flex;
154
+ flex-wrap: wrap;
155
+ }
156
+
157
+ ul.opt-desh-menu li a {
158
+ display: block;
159
+ padding: 15px 0;
160
+ border-bottom: 3px solid transparent;
161
+ margin-right: 50px;
162
+ text-decoration: none;
163
+ font-size: 20px;
164
+ font-weight: 600;
165
+ color: #2D2620;
166
+ transition: 0.3s ease;
167
+ }
168
+
169
+ ul.opt-desh-menu li a:focus {
170
+ box-shadow: none;
171
+ }
172
+
173
+ ul.opt-desh-menu li a:hover,
174
+ ul.opt-desh-menu li a.active-desh-menu,
175
+ ul.opt-desh-menu li.active a {
176
+ border-bottom: 3px solid #20B4C4;
177
+ color: #3E9FAD;
178
+ }
179
+
180
+ h3.opt-banner-title {
181
+ font-size: 56px;
182
+ margin: 0 0 50px;
183
+ line-height: 1;
184
+ font-weight: 500;
185
+ }
186
+
187
+ .opt-main-content-banner p {
188
+ font-size: 28px;
189
+ color: #151A28;
190
+ }
191
+
192
+ .opt-desh-main-content-wrap {
193
+ display: flex;
194
+ flex-wrap: wrap;
195
+ margin-top: 75px;
196
+ }
197
+
198
+ .swat-video-frame iframe {
199
+ width: 100%;
200
+ }
201
+
202
+ @media (min-width: 960px) {
203
+ .opt-desh-main-content {
204
+ flex: 1 0 calc(100% - 296px);
205
+ max-width: calc(100% - 296px);
206
+ width: 100%;
207
+ margin-right: 20px;
208
+ }
209
+
210
+ .opt-desh-sidebar {
211
+ flex: 1 0 276px;
212
+ max-width: 276px;
213
+ width: 100%;
214
+ margin-top: 0;
215
+ }
216
+ }
217
+ .opt-feature-plugins-wrap {
218
+ margin-top: 130px;
219
+ background: #fff;
220
+ }
221
+
222
+ h2.opt-pf-title {
223
+ margin: 0;
224
+ border-bottom: 4px solid #023228;
225
+ display: inline-block;
226
+ padding-bottom: 20px;
227
+ color: #241C15;
228
+ font-weight: 6000;
229
+ font-size: 20px;
230
+ }
231
+
232
+ .opt-feature-plugins-head {
233
+ padding: 40px 25px 0;
234
+ border-bottom: 1px solid #F0F0F0;
235
+ }
236
+
237
+ .opt-features-plugins-grid {
238
+ padding: 40px 20px 20px;
239
+ display: flex;
240
+ flex-wrap: wrap;
241
+ }
242
+
243
+ .opt-feature-plugin {
244
+ width: calc(50% - 53px);
245
+ border: 1px solid #F0F0F0;
246
+ margin-bottom: 20px;
247
+ padding: 20px 20px 30px;
248
+ }
249
+
250
+ .opt-feature-plugin:nth-child(even) {
251
+ margin-left: 10px;
252
+ }
253
+
254
+ .opt-feature-plugin:nth-child(odd) {
255
+ margin-right: 10px;
256
+ }
257
+
258
+ .opt-ft-inner-grid {
259
+ display: flex;
260
+ }
261
+
262
+ .opt-plugin-thumb {
263
+ margin-right: 10px;
264
+ }
265
+
266
+ .opt-plugin-content-head {
267
+ display: flex;
268
+ align-items: center;
269
+ }
270
+
271
+ h3.opt-plugin-title {
272
+ font-size: 16px;
273
+ color: #A5A5A5;
274
+ margin-right: 15px;
275
+ margin-bottom: 0;
276
+ margin-top: 10px;
277
+ }
278
+
279
+ span.plugin-status {
280
+ padding: 5px 10px;
281
+ background: #007CBA;
282
+ color: #fff;
283
+ border-radius: 30px;
284
+ text-transform: uppercase;
285
+ margin-bottom: -6px;
286
+ }
287
+
288
+ .opt-plugin-text-content p {
289
+ margin-top: 10px;
290
+ font-size: 14px;
291
+ color: #3C434A;
292
+ }
293
+
294
+ .opt-plugin-links {
295
+ margin-top: 40px;
296
+ }
297
+
298
+ a.opt-plugin-link {
299
+ text-decoration: none;
300
+ color: #2271B8;
301
+ }
302
+
303
+ .opt-plugin-links.opt-active-plugin-link .opt-plugin-link {
304
+ pointer-events: visible;
305
+ opacity: 1;
306
+ margin-right: 62px;
307
+ }
308
+
309
+ span.plugin-status.active-status {
310
+ background: #DEF3ED;
311
+ color: #3FB28F;
312
+ }
313
+
314
+ .opt-feature-plugin.active-plugin {
315
+ background: #F8F9FD;
316
+ }
317
+
318
+ .opt-feature-plugin.active-plugin h3.opt-plugin-title {
319
+ color: #3C434A;
320
+ }
321
+
322
+ .opt-features-plugins-grid {
323
+ border-bottom: 1px solid #EEEEF0;
324
+ }
325
+
326
+ .oop-feature-plugin-space {
327
+ height: 275px;
328
+ }
329
+
330
+ .swatch-var-widget {
331
+ padding: 10px;
332
+ background: #F1F5FB;
333
+ border-radius: 10px;
334
+ box-shadow: 0 4px 26px rgba(0, 0, 0, 0.08);
335
+ margin-bottom: 20px;
336
+ }
337
+
338
+ h3.swatch-video-title {
339
+ margin-bottom: 10px;
340
+ }
341
+
342
+ h2.opt-score-title {
343
+ font-size: 20px;
344
+ font-weight: 700;
345
+ }
346
+
347
+ .opt-scro-bar {
348
+ width: 65px;
349
+ height: 5px;
350
+ background: #C4CBCD;
351
+ border-radius: 30px;
352
+ position: relative;
353
+ overflow: hidden;
354
+ margin-left: 20px;
355
+ }
356
+
357
+ .opt-score-barfill {
358
+ height: 100%;
359
+ background: #168471;
360
+ }
361
+
362
+ .opt-crore-content {
363
+ display: flex;
364
+ align-items: center;
365
+ }
366
+
367
+ span.opt-score-number {
368
+ font-size: 16px;
369
+ font-weight: 700;
370
+ color: #110F10;
371
+ }
372
+
373
+ ul.opt-score-list {
374
+ margin-top: 20px;
375
+ }
376
+
377
+ ul.opt-score-list li {
378
+ display: flex;
379
+ justify-content: space-between;
380
+ align-items: center;
381
+ padding: 12px 18px;
382
+ background: #F4F6F7;
383
+ border-bottom: 2px solid #EBEFF1;
384
+ margin: 0;
385
+ }
386
+
387
+ h3.opt-list-label {
388
+ margin: 0;
389
+ font-size: 14px;
390
+ }
391
+
392
+ ul.opt-score-list li.opt-current-step {
393
+ background: #FDFDFD;
394
+ border: 0 none;
395
+ }
396
+
397
+ a.opt-scroe-next {
398
+ text-decoration: none;
399
+ background: #168471;
400
+ color: #fff;
401
+ padding: 2px 10px;
402
+ }
403
+
404
+ .setscore-widget {
405
+ padding-bottom: 30px;
406
+ }
407
+
408
+ h3.opt-new-blog {
409
+ color: #2285CB;
410
+ font-weight: 600;
411
+ font-size: 19px;
412
+ margin-bottom: 25px;
413
+ }
414
+
415
+ .opt-new-blog-content {
416
+ padding: 20px 10px;
417
+ border: 1px solid #EAEAEA;
418
+ border-top: 0 none;
419
+ }
420
+
421
+ .swatch-var-widget.opt-new-blog-widget {
422
+ padding: 15px;
423
+ }
424
+
425
+ ul.opt-new-blog-list li a {
426
+ text-decoration: none;
427
+ color: #414141;
428
+ font-size: 10px;
429
+ margin-bottom: 12px;
430
+ display: block;
431
+ }
432
+
433
+ .opt-latest-blog-widget {
434
+ background: #F8F9FD;
435
+ margin-top: 30px;
436
+ }
437
+
438
+ .opt-latest-blog-head {
439
+ padding: 20px;
440
+ border-bottom: 1px solid #F0F0F0;
441
+ }
442
+
443
+ .opt-latest-blog-head h2 {
444
+ font-size: 18px;
445
+ font-weight: 500;
446
+ margin: 0;
447
+ }
448
+
449
+ ul.opt-latest-blog {
450
+ padding: 25px 20px;
451
+ }
452
+
453
+ ul.opt-latest-blog li a {
454
+ display: block;
455
+ text-decoration: none;
456
+ color: #007CBA;
457
+ font-size: 14px;
458
+ margin-bottom: 15px;
459
+ }
460
+
461
+ .opt-module-banner-grid {
462
+ display: flex;
463
+ align-items: center;
464
+ flex-wrap: wrap;
465
+ }
466
+
467
+ .opt-module-banner .opt-main-content-banner {
468
+ margin-top: 0;
469
+ width: 60%;
470
+ margin-right: 10%;
471
+ }
472
+
473
+ .opt-module-banner-img {
474
+ width: 30%;
475
+ }
476
+
477
+ .img-100 {
478
+ max-width: 100%;
479
+ }
480
+
481
+ .opt-module-banner h3.opt-banner-title {
482
+ font-size: 48px;
483
+ }
484
+
485
+ .opt-module-banner .opt-main-content-banner p {
486
+ margin: 0;
487
+ font-size: 24px;
488
+ }
489
+
490
+ .opt-module-banner {
491
+ margin-top: 60px;
492
+ }
493
+
494
+ @media (max-width: 991px) {
495
+ .opt-module-banner h3.opt-banner-title {
496
+ font-size: 38px;
497
+ margin-bottom: 30px;
498
+ }
499
+ }
500
+ @media (max-width: 767px) {
501
+ .opt-module-banner-grid {
502
+ flex-wrap: wrap-reverse;
503
+ }
504
+
505
+ .opt-module-banner .opt-main-content-banner {
506
+ width: 100%;
507
+ margin: 30px 0 0;
508
+ }
509
+
510
+ .opt-module-banner-img {
511
+ width: 100%;
512
+ }
513
+ }
514
+ .opt-modules-wrap .icon {
515
+ display: inline-block;
516
+ width: 0.8em;
517
+ height: 1em;
518
+ background-size: contain;
519
+ background-position: center center;
520
+ background-repeat: no-repeat;
521
+ }
522
+
523
+ .opt-plugin-img {
524
+ width: 77px;
525
+ height: 77px;
526
+ }
527
+
528
+ .opt-module-filter {
529
+ width: 217px;
530
+ margin: 40px 0 20px;
531
+ }
532
+
533
+ @media (max-width: 486px) {
534
+ .opt-desh-body-wrap {
535
+ margin-right: 10px;
536
+ }
537
+
538
+ .opt-desh-body {
539
+ margin: 0 -10px;
540
+ padding: 0 10px;
541
+ }
542
+ }
543
+ @media (max-width: 1300px) {
544
+ h3.opt-banner-title {
545
+ font-size: 46px;
546
+ }
547
+ }
548
+ @media (max-width: 959px) {
549
+ .opt-desh-sidebar {
550
+ width: 100%;
551
+ display: block;
552
+ }
553
+ }
554
+ @media (min-width: 960px) and (max-width: 1220px) {
555
+ .opt-feature-plugin {
556
+ width: 100%;
557
+ margin-right: 0;
558
+ margin-left: 0;
559
+ }
560
+ }
561
+ @media (max-width: 767px) {
562
+ .opt-feature-plugin {
563
+ width: 100%;
564
+ }
565
+
566
+ h3.opt-banner-title {
567
+ font-size: 36px;
568
+ }
569
+
570
+ .opt-main-content-banner p {
571
+ font-size: 22px;
572
+ }
573
+ }
574
+ @media (max-width: 486px) {
575
+ .opt-ft-inner-grid {
576
+ display: block;
577
+ }
578
+
579
+ span.plugin-status {
580
+ font-size: 8px;
581
+ }
582
+
583
+ .theme-version {
584
+ font-size: 10px;
585
+ }
586
+ }
assets/css/admin.css CHANGED
@@ -1,62 +1,1174 @@
 
 
 
 
 
1
  .swatch-preview {
2
- width: 44px;
3
- height: 44px;
4
- line-height: 44px;
5
- text-align: center;
6
- font-weight: 700;
7
- border: 1px solid #ccc;
8
  }
9
 
10
  .tawcvs-modal-container {
11
- position: relative;
12
- display: none;
13
  }
14
 
15
  .tawcvs-modal {
16
- transform: translate(-50%, -50%);
17
- position: fixed;
18
- top: 50%;
19
- left: 50%;
20
- width: 360px;
21
- max-width: 90%;
22
- z-index: 159990;
23
- background-color: #fcfcfc;
24
  }
25
-
26
  .tawcvs-modal input.error {
27
- border-color: #dc3232;
28
  }
29
 
30
- .tawcvs-modal-header,
31
- .tawcvs-modal-content,
32
- .tawcvs-modal-footer {
33
- padding: 20px;
34
  }
35
 
36
  .tawcvs-modal-header {
37
- padding-top: 0;
38
- padding-bottom: 0;
39
  }
40
 
41
  .tawcvs-modal-content {
42
- border-top: 1px solid #ddd;
43
- border-bottom: 1px solid #ddd;
44
- background-color: #fff;
45
  }
46
 
47
  .tawcvs-modal-footer {
48
- text-align: right;
 
 
 
 
 
 
 
 
 
49
  }
50
 
51
- .tawcvs-modal-footer .message,
52
- .tawcvs-modal-footer .spinner {
53
- float: left;
54
  }
55
 
56
- .tawcvs-modal-footer .message.error {
57
- color: #dc3232;
 
 
 
 
 
 
 
 
58
  }
59
 
60
- .tawcvs-modal-footer .message.success {
61
- color: #46b450;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
62
  }
 
 
 
 
 
 
 
 
1
+ @charset "UTF-8";
2
+ #tawcvs-settings-wrap .notice {
3
+ width: 100%;
4
+ }
5
+
6
  .swatch-preview {
7
+ width: 44px;
8
+ height: 44px;
9
+ line-height: 44px;
10
+ text-align: center;
11
+ font-weight: 700;
12
+ border: 1px solid #ccc;
13
  }
14
 
15
  .tawcvs-modal-container {
16
+ position: relative;
17
+ display: none;
18
  }
19
 
20
  .tawcvs-modal {
21
+ transform: translate(-50%, -50%);
22
+ position: fixed;
23
+ top: 50%;
24
+ left: 50%;
25
+ width: 360px;
26
+ max-width: 90%;
27
+ z-index: 159990;
28
+ background-color: #fcfcfc;
29
  }
 
30
  .tawcvs-modal input.error {
31
+ border-color: #dc3232;
32
  }
33
 
34
+ .tawcvs-modal-header, .tawcvs-modal-content, .tawcvs-modal-footer {
35
+ padding: 20px;
 
 
36
  }
37
 
38
  .tawcvs-modal-header {
39
+ padding-top: 0;
40
+ padding-bottom: 0;
41
  }
42
 
43
  .tawcvs-modal-content {
44
+ border-top: 1px solid #ddd;
45
+ border-bottom: 1px solid #ddd;
46
+ background-color: #fff;
47
  }
48
 
49
  .tawcvs-modal-footer {
50
+ text-align: right;
51
+ }
52
+ .tawcvs-modal-footer .message, .tawcvs-modal-footer .spinner {
53
+ float: left;
54
+ }
55
+ .tawcvs-modal-footer .message.error {
56
+ color: #dc3232;
57
+ }
58
+ .tawcvs-modal-footer .message.success {
59
+ color: #46b450;
60
  }
61
 
62
+ /* variation switcher css */
63
+ button {
64
+ cursor: pointer;
65
  }
66
 
67
+ .variation-head {
68
+ background: #22292D;
69
+ margin: 0 -20px;
70
+ padding: 15px 25px;
71
+ display: -webkit-box;
72
+ display: -ms-flexbox;
73
+ display: flex;
74
+ -webkit-box-align: center;
75
+ -ms-flex-align: center;
76
+ align-items: center;
77
  }
78
 
79
+ .varitaion-logo {
80
+ max-width: 200px;
81
+ margin-right: 50px;
82
+ }
83
+ .varitaion-logo h2 {
84
+ font-size: 26px;
85
+ color: #fff;
86
+ margin: 0;
87
+ }
88
+
89
+ .variaion-munu-wrap {
90
+ display: -webkit-box;
91
+ display: -ms-flexbox;
92
+ display: flex;
93
+ /* padding-right: 20px; */
94
+ -webkit-box-pack: justify;
95
+ -ms-flex-pack: justify;
96
+ justify-content: space-between;
97
+ align-items: center;
98
+ }
99
+ .variaion-munu-wrap ul {
100
+ list-style: none;
101
+ display: -webkit-box;
102
+ display: -ms-flexbox;
103
+ display: flex;
104
+ margin: 0;
105
+ padding: 0;
106
+ }
107
+ .variaion-munu-wrap ul li {
108
+ margin-bottom: 0;
109
+ }
110
+ .variaion-munu-wrap ul li a {
111
+ font-size: 16px;
112
+ color: #fff;
113
+ text-decoration: none;
114
+ font-weight: 500;
115
+ margin-right: 20px;
116
+ }
117
+
118
+ @media (min-width: 1580px) {
119
+ .variation-menu-outer {
120
+ margin: 0 auto;
121
+ width: 1032px;
122
+ }
123
+
124
+ .variaion-munu-wrap {
125
+ -webkit-box-pack: justify;
126
+ -ms-flex-pack: justify;
127
+ justify-content: space-between;
128
+ }
129
+
130
+ .varitaion-logo {
131
+ max-width: 100%;
132
+ margin-right: 50px;
133
+ margin-bottom: -37px;
134
+ }
135
+
136
+ .variation-head {
137
+ display: block;
138
+ }
139
+ }
140
+ @media (max-width: 1579px) {
141
+ .variation-menu-outer {
142
+ width: 88%;
143
+ }
144
+ }
145
+ @media (max-width: 795px) {
146
+ .variation-menu-outer {
147
+ width: 100%;
148
+ }
149
+ }
150
+ .variation-head-btns button {
151
+ line-height: 1;
152
+ border: 0 none;
153
+ margin: 0;
154
+ padding: 10px 15px;
155
+ background: #008060;
156
+ color: #fff;
157
+ font-weight: 500;
158
+ font-size: 16px;
159
+ border-radius: 5px;
160
+ }
161
+
162
+ button.vh-btn.vh-discard-btn {
163
+ margin-right: 15px;
164
+ background: #202123;
165
+ border: 1px solid #5D6367;
166
+ }
167
+
168
+ p.vmch-text {
169
+ margin: 0;
170
+ display: block;
171
+ margin-top: 3px;
172
+ font-size: 15px;
173
+ color: #13171E;
174
+ font-weight: 500;
175
+ }
176
+
177
+ .variation-main-content-head span {
178
+ padding: 4px;
179
+ background: #F4F9FD;
180
+ border: 1px solid #BDC2C6;
181
+ margin-right: 8px;
182
+ margin-top: -3px;
183
+ }
184
+
185
+ .variation-item-head {
186
+ display: flex;
187
+ justify-content: space-between;
188
+ align-items: center;
189
+ cursor: pointer;
190
+ padding: 10px 25px;
191
+ }
192
+
193
+ /* .var-gen-head{
194
+ border-bottom: 1px solid #E2E4E6;
195
+ } */
196
+ .variation-accordion-outer {
197
+ flex: 1 0 100%;
198
+ max-width: 100%;
199
+ width: 100%;
200
+ }
201
+
202
+ .variation-wrap .thd-wrap.thd-theme-dashboard {
203
+ background: #F4F9FD;
204
+ margin: 0 -20px;
205
+ padding: 0 20px;
206
+ }
207
+ .variation-wrap .thd-theme-dashboard .thd-main {
208
+ margin-top: 0;
209
+ padding-top: 20px;
210
+ }
211
+ .variation-wrap .wrap {
212
+ margin: 0 20px 0 2px;
213
+ }
214
+
215
+ .thd-theme-dashboard .thd-main {
216
+ display: flex;
217
+ flex-wrap: wrap;
218
+ }
219
+ .thd-theme-dashboard .thd-main-content {
220
+ display: flex;
221
+ flex-wrap: wrap;
222
+ flex: 1 0 100%;
223
+ max-width: 100%;
224
+ width: 100%;
225
+ }
226
+ .thd-theme-dashboard .thd-main-sidebar {
227
+ flex: 1 0 100%;
228
+ max-width: 100%;
229
+ width: 100%;
230
+ margin-top: 20px;
231
+ }
232
+ .thd-theme-dashboard .thd-panel-support {
233
+ flex: 1 0 100%;
234
+ max-width: 100%;
235
+ width: 100%;
236
+ }
237
+ .thd-theme-dashboard .thd-panel {
238
+ display: flex;
239
+ flex-direction: column;
240
+ background: #FFFFFF;
241
+ border-radius: 0px 0px 2px 2px;
242
+ border-radius: 2px;
243
+ }
244
+ .thd-theme-dashboard .thd-panel .thd-panel-head {
245
+ padding: 16px 24px;
246
+ border-bottom: 1px solid #f0f0f0;
247
+ }
248
+ .thd-theme-dashboard .thd-panel-support .thd-panel-head {
249
+ display: flex;
250
+ align-items: center;
251
+ justify-content: space-between;
252
+ }
253
+ .thd-theme-dashboard .thd-panel .thd-panel-content {
254
+ height: 100%;
255
+ padding: 24px;
256
+ }
257
+ .thd-theme-dashboard .thd-panel-support .thd-panel-content {
258
+ display: grid;
259
+ grid-template-columns: 1fr;
260
+ grid-gap: 30px;
261
+ padding: 0;
262
+ }
263
+ .thd-theme-dashboard .thd-panel-support .thd-conttent-primary, .thd-theme-dashboard .thd-panel-support .thd-conttent-secondary {
264
+ display: flex;
265
+ flex-direction: column;
266
+ align-items: flex-start;
267
+ padding: 24px;
268
+ }
269
+
270
+ @media (min-width: 960px) {
271
+ .thd-theme-dashboard .thd-main-content {
272
+ flex: 1 0 calc(100% - 296px);
273
+ max-width: calc(100% - 296px);
274
+ width: 100%;
275
+ margin-right: 20px;
276
+ }
277
+ }
278
+ @media (min-width: 960px) {
279
+ .thd-theme-dashboard .thd-main-sidebar {
280
+ flex: 1 0 276px;
281
+ max-width: 276px;
282
+ width: 100%;
283
+ margin-top: 0;
284
+ }
285
+ .thd-theme-dashboard .thd-panel-support {
286
+ flex: 1 0 calc(50% - 10px);
287
+ max-width: calc(50% - 10px);
288
+ width: 100%;
289
+ margin-right: 10px;
290
+ }
291
+ .thd-theme-dashboard .thd-panel-support .thd-panel-content {
292
+ grid-template-columns: repeat(auto-fit, minmax(50px, 1fr));
293
+ }
294
+ }
295
+ .variation-accordion-wrap {
296
+ background: #fff;
297
+ border-radius: 10px;
298
+ margin-top: 20px;
299
+ box-shadow: 0 4px 28px rgba(0, 0, 0, 0.12);
300
+ }
301
+
302
+ h3.variation-accrodion-title {
303
+ font-size: 16px;
304
+ font-weight: 400;
305
+ color: #252728;
306
+ }
307
+
308
+ .variation-accordion-item {
309
+ border-bottom: 1px solid #F1F1F1;
310
+ }
311
+
312
+ .var-ge-accor {
313
+ border-top: 1px solid #F1F1F1;
314
+ }
315
+
316
+ .variation-accordion-content {
317
+ padding: 0 50px;
318
+ display: none;
319
+ }
320
+
321
+ .variation-accordion-item.first-item .variation-accordion-content {
322
+ display: block;
323
+ }
324
+ .variation-accordion-item:last-child .variation-accordion-content {
325
+ padding-bottom: 50px;
326
+ }
327
+
328
+ .swatch-border-input {
329
+ display: flex;
330
+ align-items: center;
331
+ width: 100px;
332
+ border: 1px solid #94979B;
333
+ border-radius: 5px;
334
+ margin-right: 15px;
335
+ }
336
+
337
+ input.swatch-border-type {
338
+ width: 60px;
339
+ height: 28px;
340
+ border-color: transparent;
341
+ text-align: center;
342
+ }
343
+
344
+ span.sw-input-type-text {
345
+ display: block;
346
+ background: #F0F0F1;
347
+ height: 28px;
348
+ padding: 0 7px;
349
+ position: absolute;
350
+ line-height: 28px;
351
+ right: 2px;
352
+ top: 1px;
353
+ border-top-right-radius: 5px;
354
+ border-bottom-right-radius: 5px;
355
+ }
356
+
357
+ input.font-size-input {
358
+ width: 70px;
359
+ margin-right: 10px;
360
+ text-align: center;
361
+ }
362
+
363
+ .variation-item-head span.dashicons-arrow-down-alt2 {
364
+ transition: 0.3s;
365
+ }
366
+ .variation-item-head.active-accordion span.dashicons-arrow-down-alt2 {
367
+ transform: rotate(180deg);
368
+ }
369
+
370
+ .variation-switcher-item {
371
+ display: -webkit-box;
372
+ display: -ms-flexbox;
373
+ display: flex;
374
+ -webkit-box-pack: justify;
375
+ -ms-flex-pack: justify;
376
+ justify-content: space-between;
377
+ -webkit-box-align: center;
378
+ -ms-flex-align: center;
379
+ align-items: center;
380
+ padding-bottom: 20px;
381
+ border-bottom: 1px solid #F3F3F3;
382
+ margin-bottom: 20px;
383
+ }
384
+ .variation-switcher-item.hidden {
385
+ display: none;
386
+ }
387
+ .variation-switcher-item:last-child {
388
+ padding-bottom: 0;
389
+ margin-bottom: 0;
390
+ border: 0 none;
391
+ }
392
+ .variation-switcher-item.wcvs-pro-item {
393
+ position: relative;
394
+ cursor: pointer;
395
+ }
396
+ .variation-switcher-item.wcvs-pro-item input,
397
+ .variation-switcher-item.wcvs-pro-item select {
398
+ cursor: pointer;
399
+ }
400
+ .variation-switcher-item.wcvs-pro-item .vs-label-title,
401
+ .variation-switcher-item.wcvs-pro-item p {
402
+ color: #BCB3B3;
403
+ }
404
+ .variation-switcher-item.wcvs-pro-item .vs-label-title {
405
+ width: auto;
406
+ position: relative;
407
+ max-width: max-content;
408
+ }
409
+ .variation-switcher-item.wcvs-pro-item .vs-label-title:after {
410
+ content: "Pro";
411
+ position: absolute;
412
+ padding: 3px 7px;
413
+ background-color: #239B6B;
414
+ right: -49px;
415
+ color: #fff;
416
+ top: -10px;
417
+ font-size: 14px;
418
+ font-weight: 400;
419
+ border: 1px solid #239B6B;
420
+ border-radius: 3px;
421
+ }
422
+ .variation-switcher-item.indent {
423
+ padding-left: 30px;
424
+ padding-right: 30px;
425
+ }
426
+ .variation-switcher-item.indent h3.vs-label-title {
427
+ font-size: 14px;
428
+ }
429
+ .variation-switcher-item.indent .sub {
430
+ font-size: 12px;
431
+ }
432
+
433
+ .variation-switcher-wrap {
434
+ padding: 20px 0;
435
+ }
436
+
437
+ h3.vs-label-title {
438
+ color: #454547;
439
+ font-size: 16px;
440
+ margin: 0;
441
+ }
442
+
443
+ .variation-switcher-label p {
444
+ color: #454547;
445
+ margin: 10px 0 0;
446
+ }
447
+
448
+ /* The switch - the box around the slider */
449
+ .variation-switch {
450
+ position: relative;
451
+ display: inline-block;
452
+ width: 40px;
453
+ height: 21px;
454
+ }
455
+ .variation-switch input {
456
+ opacity: 0;
457
+ width: 0;
458
+ height: 0;
459
+ }
460
+ .variation-switch .slider {
461
+ position: absolute;
462
+ cursor: pointer;
463
+ top: 0;
464
+ left: 0;
465
+ right: 0;
466
+ bottom: 0;
467
+ background-color: #BBBBBB;
468
+ -webkit-transition: 0.4s;
469
+ transition: 0.4s;
470
+ }
471
+ .variation-switch .slider:before {
472
+ position: absolute;
473
+ content: "";
474
+ height: 15px;
475
+ width: 15px;
476
+ left: 3px;
477
+ bottom: 3px;
478
+ background-color: white;
479
+ -webkit-transition: 0.4s;
480
+ transition: 0.4s;
481
+ }
482
+ .variation-switch input:checked + .slider {
483
+ background-color: #008060;
484
+ }
485
+ .variation-switch input:focus + .slider {
486
+ box-shadow: 0 0 1px #008060;
487
+ }
488
+ .variation-switch input:checked + .slider:before {
489
+ -webkit-transform: translateX(18px);
490
+ -ms-transform: translateX(18px);
491
+ transform: translateX(18px);
492
+ }
493
+ .variation-switch .slider.round {
494
+ border-radius: 34px;
495
+ }
496
+ .variation-switch .slider.round:before {
497
+ border-radius: 50%;
498
+ }
499
+
500
+ /* Hide default HTML checkbox */
501
+ /* The slider */
502
+ /* Rounded sliders */
503
+ .wcvs-accor-tab-btns {
504
+ display: flex;
505
+ flex-wrap: wrap;
506
+ padding-top: 5px;
507
+ }
508
+
509
+ button.accor-tab-btn {
510
+ background: transparent;
511
+ border: 0 none;
512
+ padding: 8px 0;
513
+ margin-right: 35px;
514
+ font-weight: 500;
515
+ font-size: 15px;
516
+ color: #B0B3B5;
517
+ text-transform: uppercase;
518
+ }
519
+ button.accor-tab-btn.active-at-btn {
520
+ border-bottom: 3px solid #008060;
521
+ color: #110800;
522
+ }
523
+
524
+ .wcvs-accor-tab-content {
525
+ display: none;
526
+ }
527
+ .wcvs-accor-tab-content:first-child {
528
+ display: block;
529
+ }
530
+
531
+ .variation-switch-field {
532
+ display: flex;
533
+ }
534
+ .variation-switch-field .field-with-html-after {
535
+ position: relative;
536
+ }
537
+ .variation-switch-field .wp-picker-container .wp-color-result.button {
538
+ margin-left: 0;
539
+ }
540
+ .variation-switch-field > div {
541
+ margin-left: 10px;
542
+ }
543
+
544
+ .variation-switch-field.variation-switch-multi-field input {
545
+ width: 70px;
546
+ text-align: center;
547
+ }
548
+
549
+ .variation-switcher-item.vs-quote-item {
550
+ background: #F7F7F7;
551
+ margin-top: -20px;
552
+ padding: 20px;
553
+ }
554
+ .variation-switcher-item.vs-quote-item .variation-switcher-label p {
555
+ margin-top: 5px;
556
+ }
557
+
558
+ .variation-html-wrapper {
559
+ display: flex;
560
+ }
561
+
562
+ .variation-checkbox-container {
563
+ display: block;
564
+ position: relative;
565
+ padding-left: 30px;
566
+ margin-bottom: 12px;
567
+ margin-left: 30px;
568
+ cursor: pointer;
569
+ -webkit-user-select: none;
570
+ -moz-user-select: none;
571
+ -ms-user-select: none;
572
+ user-select: none;
573
+ }
574
+ .variation-checkbox-container input[type=checkbox] {
575
+ position: absolute;
576
+ opacity: 0;
577
+ cursor: pointer;
578
+ height: 0;
579
+ width: 0;
580
+ }
581
+ .variation-checkbox-container input[type=checkbox]:checked ~ .checkmark {
582
+ background-color: #008060 !important;
583
+ }
584
+ .variation-checkbox-container input[type=checkbox]:checked ~ .checkmark:after {
585
+ display: block;
586
+ }
587
+ .variation-checkbox-container .checkmark {
588
+ position: absolute;
589
+ top: 0;
590
+ left: 0;
591
+ height: 20px;
592
+ width: 20px;
593
+ background-color: #eee;
594
+ }
595
+ .variation-checkbox-container .checkmark:after {
596
+ content: "";
597
+ position: absolute;
598
+ display: none;
599
+ left: 8px;
600
+ top: 3px;
601
+ width: 6px;
602
+ height: 11px;
603
+ border: solid white;
604
+ border-width: 0 3px 3px 0;
605
+ -webkit-transform: rotate(45deg);
606
+ -ms-transform: rotate(45deg);
607
+ transform: rotate(45deg);
608
+ }
609
+ .variation-checkbox-container:hover input[type=checkbox] ~ .checkmark {
610
+ background-color: #ccc;
611
+ }
612
+
613
+ .swatcher-style-fields {
614
+ padding: 0 40px 30px;
615
+ }
616
+ .swatcher-style-fields .variation-switcher-item {
617
+ margin-bottom: 10px;
618
+ padding-bottom: 10px;
619
+ }
620
+ .swatcher-style-fields h3.vs-label-title {
621
+ font-size: 14px;
622
+ }
623
+
624
+ .wcvs-text-only {
625
+ border-bottom: none;
626
+ background: #F7F7F7;
627
+ margin-top: -20px;
628
+ padding: 20px;
629
+ }
630
+
631
+ .variation-radio-wrapper {
632
+ display: flex;
633
+ }
634
+
635
+ .swatch-shape-radio {
636
+ margin-left: 10px;
637
+ }
638
+ .swatch-shape-radio input {
639
+ width: 0;
640
+ height: 0;
641
+ position: absolute;
642
+ opacity: 0;
643
+ cursor: pointer;
644
+ }
645
+ .swatch-shape-radio.radio-edge .variation-radio-text, .swatch-shape-radio.radio-rounded .variation-radio-text, .swatch-shape-radio.radio-circle .variation-radio-text {
646
+ border: 1px solid #E0E0E0;
647
+ font-size: 16px;
648
+ display: block;
649
+ width: 30px;
650
+ height: 30px;
651
+ text-align: center;
652
+ line-height: 30px;
653
+ font-weight: 600;
654
+ color: #222222;
655
+ position: relative;
656
+ margin: 25px auto 0;
657
+ }
658
+ .swatch-shape-radio.radio-edge input:checked + .variation-radio-text, .swatch-shape-radio.radio-rounded input:checked + .variation-radio-text, .swatch-shape-radio.radio-circle input:checked + .variation-radio-text {
659
+ border: 2px solid #008060;
660
+ }
661
+ .swatch-shape-radio.radio-rounded .variation-radio-text {
662
+ border-radius: 5px;
663
+ }
664
+ .swatch-shape-radio.radio-circle .variation-radio-text {
665
+ border-radius: 50%;
666
+ }
667
+
668
+ .variation-switch-field-grid {
669
+ display: flex;
670
+ align-items: center;
671
+ flex-wrap: wrap;
672
+ }
673
+
674
+ .wp-picker-container .wp-color-result.button {
675
+ margin: 0 0 0 15px;
676
+ }
677
+
678
+ @media (min-width: 960px) {
679
+ .swatch-variation-footer {
680
+ display: flex;
681
+ }
682
+ }
683
+ .swatch-variation-footer .thd-panel.thd-panel-support {
684
+ margin-top: 20px;
685
+ }
686
+ .swatch-variation-footer .thd-panel-support .thd-conttent-secondary {
687
+ background: #023328;
688
+ }
689
+
690
+ .swatch-var-widget {
691
+ padding: 10px;
692
+ background: #F1F5FB;
693
+ border-radius: 10px;
694
+ box-shadow: 0 4px 26px rgba(0, 0, 0, 0.08);
695
+ margin-bottom: 20px;
696
+ }
697
+
698
+ h3.swatch-video-title {
699
+ margin-bottom: 10px;
700
+ }
701
+
702
+ h2.swatch-video-title {
703
+ margin: 0;
704
+ text-align: center;
705
+ font-size: 20px;
706
+ color: #222;
707
+ }
708
+
709
+ .swatch-var-addon {
710
+ padding: 10px;
711
+ border: 1px solid #EBECED;
712
+ border-top: 0 none;
713
+ text-align: center;
714
+ margin-bottom: 15px;
715
+ }
716
+
717
+ a.swatch-addon-link {
718
+ color: #2271B1;
719
+ }
720
+ a.swatch-addon-link h2 {
721
+ color: #2271B1;
722
+ line-height: 1.5;
723
+ }
724
+ a.swatch-submit-link {
725
+ display: block;
726
+ padding: 15px 5px;
727
+ background: #008060;
728
+ color: #fff;
729
+ text-decoration: none;
730
+ margin-top: 25px;
731
+ border-radius: 5px;
732
+ }
733
+
734
+ @media (max-width: 960px) {
735
+ .variation-head {
736
+ display: block;
737
+ }
738
+ }
739
+ @media (max-width: 767px) {
740
+ .variaion-munu-wrap {
741
+ margin-top: 40px;
742
+ display: block;
743
+ }
744
+
745
+ .variation-head-btns {
746
+ margin-top: 21px;
747
+ }
748
+ }
749
+ @media (max-width: 486px) {
750
+ .variaion-munu-wrap ul {
751
+ flex-wrap: wrap;
752
+ }
753
+ .variaion-munu-wrap ul li a {
754
+ margin-bottom: 10px;
755
+ display: block;
756
+ }
757
+
758
+ .variation-switcher-item {
759
+ display: block;
760
+ }
761
+
762
+ .variation-switcher-label {
763
+ margin-bottom: 20px;
764
+ }
765
+
766
+ .variation-switch-field.variation-switch-multi-field input {
767
+ margin-bottom: 15px;
768
+ }
769
+ }
770
+ .variation-header-wrap, .thd-theme-dashboard-wrap {
771
+ margin-right: 20px;
772
+ }
773
+
774
+ h3.variation-accrodion-title.var-title-wi {
775
+ font-size: 18px;
776
+ font-weight: 500;
777
+ }
778
+ h3.variation-accrodion-title span {
779
+ margin-right: 4px;
780
+ }
781
+
782
+ @media (min-width: 1217px) {
783
+ .variation-wrap .wrap {
784
+ margin: 0 auto;
785
+ width: 1032px;
786
+ }
787
+ }
788
+ .swatcher-style-fields {
789
+ display: none;
790
+ }
791
+
792
+ .wcvs-accor-tab-content-wrap {
793
+ margin-top: 25px;
794
+ }
795
+
796
+ input.swatch-limit-field {
797
+ width: 110px;
798
+ }
799
+
800
+ .wp-picker-container .iris-picker {
801
+ border-radius: 0;
802
+ border-color: #dcdcde;
803
+ margin-top: 6px;
804
+ position: absolute;
805
+ z-index: 9999;
806
+ }
807
+
808
+ /* new css */
809
+ .swatch-variation-footer .thd-panel .thd-panel-title {
810
+ font-size: 0.8125rem;
811
+ margin: 0;
812
+ }
813
+ .swatch-variation-footer .thd-title {
814
+ font-weight: 600;
815
+ font-size: 0.8125rem;
816
+ color: #1E1E1E;
817
+ }
818
+ .swatch-variation-footer .thd-description {
819
+ font-size: 0.8125rem;
820
+ color: #697B96;
821
+ }
822
+ .swatch-variation-footer .thd-description:not(:first-child) {
823
+ margin-top: 1rem;
824
+ }
825
+ .swatch-variation-footer .thd-panel-support .thd-button-wrap {
826
+ margin-top: auto;
827
+ padding-top: 1rem;
828
+ }
829
+ .swatch-variation-footer .thd-panel.thd-panel-community {
830
+ margin-top: 20px;
831
+ }
832
+ .swatch-variation-footer .thd-panel-community .thd-button-wrap {
833
+ margin-top: auto;
834
+ padding-top: 1rem;
835
+ }
836
+ .swatch-variation-footer .button {
837
+ transition: 0.25s;
838
+ box-shadow: none !important;
839
+ outline: none !important;
840
+ }
841
+ .swatch-variation-footer .thd-button {
842
+ padding: 6px 22px;
843
+ }
844
+ .swatch-variation-footer .thd-button:not(:hover) {
845
+ background: transparent;
846
+ }
847
+ .swatch-variation-footer .thd-panel-support .thd-conttent-secondary .thd-title {
848
+ width: 100%;
849
+ display: flex;
850
+ align-items: center;
851
+ justify-content: space-between;
852
+ color: #FFFFFF;
853
+ }
854
+ .swatch-variation-footer .thd-panel-support .thd-conttent-secondary .thd-description {
855
+ color: #FFFFFF;
856
+ }
857
+ .swatch-variation-footer .thd-panel-support .thd-conttent-secondary .thd-button {
858
+ border-color: #3FB28F;
859
+ background: #3FB28F;
860
+ color: #FFFFFF;
861
+ }
862
+ .swatch-variation-footer .thd-panel-community .thd-panel-content {
863
+ display: flex;
864
+ flex-direction: column;
865
+ align-items: flex-start;
866
+ }
867
+ .swatch-variation-footer .thd-panel-support .thd-conttent-primary, .swatch-variation-footer .thd-panel-support .thd-conttent-secondary {
868
+ display: flex;
869
+ flex-direction: column;
870
+ align-items: flex-start;
871
+ }
872
+
873
+ @media (min-width: 960px) {
874
+ .swatch-variation-footer .thd-panel-community {
875
+ flex: 1 0 calc(50% - 10px);
876
+ max-width: calc(50% - 10px);
877
+ width: 100%;
878
+ margin-left: 10px;
879
+ }
880
+ .swatch-variation-footer .thd-panel-support {
881
+ flex: 1 0 calc(50% - 10px);
882
+ max-width: calc(50% - 10px);
883
+ width: 100%;
884
+ margin-right: 10px;
885
+ }
886
+ }
887
+ .swatch-variation-tutorial .theplus-panel-row {
888
+ margin-top: 12px;
889
+ }
890
+ .swatch-variation-tutorial .theplus-p-20 {
891
+ padding: 30px;
892
+ }
893
+ .swatch-variation-tutorial .theplus-panel-sec {
894
+ position: relative;
895
+ display: block;
896
+ width: 100%;
897
+ background: #fff;
898
+ box-shadow: 0px 5px 10px rgba(186, 186, 186, 0.1);
899
+ border-radius: 4px;
900
+ }
901
+ .swatch-variation-tutorial .theplus-sec-title {
902
+ font-size: 20px;
903
+ line-height: 30px;
904
+ color: #313131;
905
+ white-space: nowrap;
906
+ margin-bottom: 10px;
907
+ font-weight: 500;
908
+ transition: all 0.3s linear;
909
+ }
910
+ .swatch-variation-tutorial .theplus-sec-subtitle, .swatch-variation-tutorial .theplus-sec-desc {
911
+ color: #888;
912
+ font-size: 15px;
913
+ line-height: 26px;
914
+ font-weight: 400;
915
+ }
916
+ .swatch-variation-tutorial .theplus-sec-border {
917
+ background: #313131;
918
+ width: 55px;
919
+ height: 5px;
920
+ margin: 20px 0;
921
+ }
922
+ .swatch-variation-tutorial .theplus-panel-row {
923
+ display: -webkit-box;
924
+ display: -webkit-flex;
925
+ display: -ms-flexbox;
926
+ display: flex;
927
+ margin-left: -8px;
928
+ margin-right: -8px;
929
+ }
930
+ .swatch-variation-tutorial .theplus-panel-relative {
931
+ position: relative;
932
+ }
933
+ .swatch-variation-tutorial .theplus-more-video {
934
+ position: absolute;
935
+ right: 12px;
936
+ top: -30px;
937
+ text-decoration: blink;
938
+ color: #8072FC;
939
+ font-size: 15px;
940
+ line-height: 1.2;
941
+ font-weight: 500;
942
+ letter-spacing: 0.2px;
943
+ }
944
+ .swatch-variation-tutorial .theplus-panel-col {
945
+ position: relative;
946
+ min-height: 1px;
947
+ display: -webkit-box;
948
+ display: -webkit-flex;
949
+ display: -ms-flexbox;
950
+ display: flex;
951
+ padding: 8px;
952
+ flex-wrap: wrap;
953
+ }
954
+ .swatch-variation-tutorial .theplus-panel-video-list {
955
+ width: 100%;
956
+ position: relative;
957
+ display: flex;
958
+ box-shadow: 0 5px 10px rgba(158, 158, 158, 0.25);
959
+ border-radius: 4px;
960
+ }
961
+ .swatch-variation-tutorial .theplus-panel-video-list img {
962
+ width: 100%;
963
+ border-radius: 4px;
964
+ }
965
+ .swatch-variation-tutorial .theplus-panel-row {
966
+ margin-top: 12px;
967
+ }
968
+
969
+ .swat-video-frame iframe {
970
+ width: 100%;
971
+ }
972
+
973
+ p.vmch-text a {
974
+ text-decoration: none;
975
+ color: #13171E;
976
+ }
977
+ p.vmch-text a:focus {
978
+ outline: 0 none;
979
+ box-shadow: none;
980
+ }
981
+
982
+ .wcvs-popup-blur {
983
+ display: none;
984
+ width: 100%;
985
+ height: 100vh;
986
+ position: fixed;
987
+ opacity: 0.6;
988
+ background: #222;
989
+ z-index: 99998;
990
+ top: 0;
991
+ left: 0;
992
+ overflow: hidden;
993
+ animation-name: fadeIn_proFeaturesBlur;
994
+ animation-duration: 0.5s;
995
+ }
996
+
997
+ .wcvs-popup {
998
+ display: none;
999
+ top: 0;
1000
+ min-width: 250px;
1001
+ width: 100%;
1002
+ position: fixed;
1003
+ z-index: 99999;
1004
+ background: #fff;
1005
+ border-radius: 10px;
1006
+ box-shadow: 0 0 10px #000;
1007
+ margin: 30px auto 0 10%;
1008
+ animation-name: fadeIn_proFeaturesPopup;
1009
+ animation-duration: 0.8s;
1010
+ padding: 20px 30px;
1011
+ }
1012
+ .wcvs-popup .popup-close {
1013
+ float: right;
1014
+ cursor: pointer;
1015
+ padding: 5px;
1016
+ margin-top: -20px;
1017
+ margin-right: -20px;
1018
+ }
1019
+ .wcvs-popup .popup-close:after {
1020
+ content: "×";
1021
+ color: #aaa;
1022
+ font-size: 22px;
1023
+ font-weight: 300;
1024
+ }
1025
+ .wcvs-popup .popup-close:hover:after {
1026
+ color: #008060;
1027
+ }
1028
+
1029
+ .wcvs-welcome-popup {
1030
+ max-width: 650px;
1031
+ margin-top: calc(50vh - 250px);
1032
+ }
1033
+ .wcvs-welcome-popup .popup-logo {
1034
+ text-align: center;
1035
+ }
1036
+ .wcvs-welcome-popup .popup-logo img {
1037
+ max-width: 250px;
1038
+ }
1039
+ .wcvs-welcome-popup .popup-iframe {
1040
+ position: relative;
1041
+ padding-bottom: 56.25%;
1042
+ height: 0;
1043
+ overflow: hidden;
1044
+ }
1045
+ .wcvs-welcome-popup .popup-iframe iframe {
1046
+ position: absolute;
1047
+ top: 0;
1048
+ left: 0;
1049
+ width: 100%;
1050
+ height: 100%;
1051
+ }
1052
+ @media screen and (min-width: 961px) {
1053
+ .wcvs-welcome-popup {
1054
+ margin-left: calc(50vw - 500px);
1055
+ }
1056
+ }
1057
+ @media screen and (max-width: 960px) {
1058
+ .wcvs-welcome-popup {
1059
+ margin-left: calc(50vw - 420px);
1060
+ }
1061
+ }
1062
+ @media screen and (max-width: 782px) {
1063
+ .wcvs-welcome-popup {
1064
+ margin-left: calc(50vw - 315px);
1065
+ max-width: 550px;
1066
+ }
1067
+ }
1068
+ @media screen and (max-width: 599px) {
1069
+ .wcvs-welcome-popup {
1070
+ max-width: 80%;
1071
+ margin: 50vh auto 0 auto;
1072
+ }
1073
+ }
1074
+
1075
+ .wcvs-pro-feature-popup .popup-logo img {
1076
+ max-width: 200px;
1077
+ }
1078
+ .wcvs-pro-feature-popup .popup-title {
1079
+ font-size: 20px;
1080
+ }
1081
+ .wcvs-pro-feature-popup .popup-cta {
1082
+ display: inline-flex;
1083
+ justify-content: center;
1084
+ align-items: center;
1085
+ }
1086
+ .wcvs-pro-feature-popup .popup-txt {
1087
+ font-size: 1rem;
1088
+ font-weight: 300;
1089
+ }
1090
+ .wcvs-pro-feature-popup .popup-rating {
1091
+ margin-left: 10px;
1092
+ }
1093
+ .wcvs-pro-feature-popup .popup-star {
1094
+ color: #FAA71A;
1095
+ }
1096
+ .wcvs-pro-feature-popup .popup-btn {
1097
+ font-weight: 700;
1098
+ font-size: 16px;
1099
+ padding: 5px 15px;
1100
+ }
1101
+ .wcvs-pro-feature-popup .popup-bonus a {
1102
+ font-weight: 700;
1103
+ color: #008060;
1104
+ }
1105
+ .wcvs-pro-feature-popup .popup-bonus .popup-txt {
1106
+ font-size: 1em;
1107
+ }
1108
+ @media screen and (min-width: 600px) {
1109
+ .wcvs-pro-feature-popup {
1110
+ width: 450px;
1111
+ margin-left: calc(50vw - 350px);
1112
+ margin-top: calc(50vh - 150px);
1113
+ }
1114
+ }
1115
+ @media screen and (max-width: 599px) {
1116
+ .wcvs-pro-feature-popup {
1117
+ width: 80%;
1118
+ margin: 50vh auto 0 auto;
1119
+ }
1120
+ }
1121
+
1122
+ .variation-head-btns .button, .variation-head-btns button {
1123
+ line-height: 1;
1124
+ border: 0 none;
1125
+ margin: 0;
1126
+ padding: 10px 15px;
1127
+ background: #008060;
1128
+ color: #fff;
1129
+ font-weight: 500;
1130
+ font-size: 16px;
1131
+ border-radius: 5px;
1132
+ }
1133
+
1134
+ .button.vh-btn.vh-discard-btn {
1135
+ margin-right: 15px;
1136
+ background: #202123;
1137
+ border: 1px solid #5d6367;
1138
+ }
1139
+
1140
+ @media (max-width: 486px) {
1141
+ .variation-header-wrap, .thd-theme-dashboard-wrap {
1142
+ margin-right: 10px;
1143
+ }
1144
+
1145
+ .variation-head {
1146
+ margin: 0 -10px;
1147
+ padding: 15px 10px;
1148
+ }
1149
+
1150
+ .variation-wrap .thd-wrap.thd-theme-dashboard {
1151
+ margin: 0 -10px;
1152
+ padding: 0 10px;
1153
+ }
1154
+ .variation-wrap .wrap {
1155
+ margin: 0;
1156
+ }
1157
+ }
1158
+ /****ANIMATIONS****/
1159
+ @keyframes fadeIn_proFeaturesPopup {
1160
+ from {
1161
+ opacity: 0;
1162
+ }
1163
+ to {
1164
+ opacity: 1;
1165
+ }
1166
  }
1167
+ @keyframes fadeIn_proFeaturesBlur {
1168
+ from {
1169
+ opacity: 0;
1170
+ }
1171
+ to {
1172
+ opacity: 0.6;
1173
+ }
1174
+ }
assets/css/frontend-list-products.css ADDED
@@ -0,0 +1,24 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ .woocommerce-variation-price,
2
+ .woocommerce-variation-availability,
3
+ .woocommerce-variation-add-to-cart .quantity {
4
+ display: none !important;
5
+ visibility: hidden !important;
6
+ }
7
+
8
+ .variations_form .variations td.label {
9
+ display: none;
10
+ }
11
+ .variations_form .variations td.value {
12
+ padding: 0;
13
+ }
14
+
15
+ .tawcvs-swatches .swatch,
16
+ .tawcvs-swatches .swatch-show-more {
17
+ width: 35px;
18
+ height: 35px;
19
+ border: 1px solid #3a3a3a91;
20
+ }
21
+ .tawcvs-swatches .swatch.swatch-image img,
22
+ .tawcvs-swatches .swatch-show-more.swatch-image img {
23
+ margin: 0;
24
+ }
assets/css/frontend.css CHANGED
@@ -1,134 +1,220 @@
1
  .hidden {
2
- display: none !important;
3
- visibility: hidden !important;
4
  }
5
 
6
  .tawcvs-swatches {
7
- padding: 5px;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
8
  }
9
-
10
- .tawcvs-swatches .swatch {
11
- -webkit-transition: all 0.3s;
12
- -moz-transition: all 0.3s;
13
- -ms-transition: all 0.3s;
14
- -o-transition: all 0.3s;
15
- transition: all 0.3s;
16
- -webkit-border-radius: 50%;
17
- -moz-border-radius: 50%;
18
- border-radius: 50%;
19
- display: inline-block;
20
- width: 30px;
21
- height: 30px;
22
- line-height: 28px;
23
- text-align: center;
24
- margin-right: 15px;
25
- margin-bottom: 15px;
26
- cursor: pointer;
27
- border: 2px solid transparent;
28
- position: relative;
29
- white-space: nowrap;
30
- }
31
-
32
- .tawcvs-swatches .swatch.selected {
33
- border-color: #999;
34
- }
35
-
36
- .tawcvs-swatches .swatch.disabled {
37
- cursor: default;
38
- opacity: 0.1 !important;
39
- }
40
-
41
- .tawcvs-swatches .swatch.disabled .swatch__tooltip {
42
- display: none;
43
- }
44
-
45
  .tawcvs-swatches .swatch-color {
46
- text-indent: -9999em;
47
- border: 2px solid #ccc;
48
  }
49
-
50
  .tawcvs-swatches .swatch-color.selected {
51
- border-color: #333;
52
  }
53
-
54
  .tawcvs-swatches .swatch-color.selected:before {
55
- -webkit-transform: translate(-50%, -50%) rotate(45deg);
56
- -moz-transform: translate(-50%, -50%) rotate(45deg);
57
- transform: translate(-50%, -50%) rotate(45deg);
58
- content: "";
59
- width: 6px;
60
- height: 10px;
61
- display: block;
62
- border: solid #eee;
63
- border-width: 0 2px 2px 0;
64
- position: absolute;
65
- top: 50%;
66
- left: 50%;
67
- margin: -2px -2px 0 0;
68
  }
69
-
70
  .tawcvs-swatches .swatch-label {
71
- font-size: 14px;
72
- background-color: #f1f1f1;
73
  }
74
-
75
  .tawcvs-swatches .swatch-image {
76
- font-size: 0;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
77
  }
78
 
79
- .tawcvs-swatches .swatch-image img {
80
- -webkit-border-radius: 50%;
81
- -moz-border-radius: 50%;
82
- border-radius: 50%;
 
83
  }
84
 
85
- .tawcvs-swatches .swatch-image .swatch__tooltip {
86
- font-size: 14px;
 
 
 
87
  }
88
 
89
- .tawcvs-swatches .swatch__tooltip {
90
- -webkit-transform: translate(-50%, -100%);
91
- -moz-transform: translate(-50%, -100%);
92
- transform: translate(-50%, -100%);
93
- -webkit-transition: all 0.3s;
94
- -moz-transition: all 0.3s;
95
- -ms-transition: all 0.3s;
96
- -o-transition: all 0.3s;
97
- transition: all 0.3s;
98
- -webkit-border-radius: 3px;
99
- -moz-border-radius: 3px;
100
- border-radius: 3px;
101
- position: absolute;
102
- left: 50%;
103
- top: 0;
104
- background: #333;
105
- z-index: 2;
106
- color: #fff;
107
- margin: -15px 0 0 0;
108
- padding: 5px 10px;
109
- text-indent: initial;
110
- font-size: 14px;
111
- font-weight: 500;
112
- opacity: 0;
113
- visibility: hidden;
114
- user-select: none;
115
  }
116
 
117
- .tawcvs-swatches .swatch__tooltip:after {
118
- -webkit-transform: rotate(45deg);
119
- -moz-transform: rotate(45deg);
120
- transform: rotate(45deg);
121
- content: "";
122
- position: absolute;
123
- width: 12px;
124
- height: 12px;
125
- background: #333;
126
- bottom: -4px;
127
- left: 50%;
128
- margin-left: -6px;
129
- }
130
- .tawcvs-swatches .swatch:hover .swatch__tooltip {
131
- opacity: 1;
132
- visibility: visible;
133
- user-select: auto;
134
  }
 
 
 
 
1
  .hidden {
2
+ display: none !important;
3
+ visibility: hidden !important;
4
  }
5
 
6
  .tawcvs-swatches {
7
+ padding: 5px;
8
+ display: inline-flex;
9
+ }
10
+ .tawcvs-swatches .swatch,
11
+ .tawcvs-swatches .swatch-show-more {
12
+ -webkit-transition: all 0.3s;
13
+ -moz-transition: all 0.3s;
14
+ -o-transition: all 0.3s;
15
+ transition: all 0.3s;
16
+ width: 30px;
17
+ height: 30px;
18
+ line-height: 28px;
19
+ text-align: center;
20
+ cursor: pointer;
21
+ border: 2px solid transparent;
22
+ position: relative;
23
+ white-space: nowrap;
24
+ margin: 0 10px;
25
+ padding: 2px 5px;
26
+ display: inline-flex;
27
+ align-items: center;
28
+ justify-content: center;
29
+ overflow: hidden;
30
+ }
31
+ .tawcvs-swatches .swatch.swatch-label,
32
+ .tawcvs-swatches .swatch-show-more.swatch-label {
33
+ min-width: max-content;
34
+ min-height: 100%;
35
+ }
36
+ .tawcvs-swatches .swatch.swatch-shape-circle,
37
+ .tawcvs-swatches .swatch-show-more.swatch-shape-circle {
38
+ -webkit-border-radius: 50%;
39
+ -moz-border-radius: 50%;
40
+ border-radius: 50%;
41
+ }
42
+ .tawcvs-swatches .swatch.swatch-shape-circle img,
43
+ .tawcvs-swatches .swatch-show-more.swatch-shape-circle img {
44
+ -webkit-border-radius: 50%;
45
+ -moz-border-radius: 50%;
46
+ border-radius: 50%;
47
+ }
48
+ .tawcvs-swatches .swatch.swatch-shape-rounded,
49
+ .tawcvs-swatches .swatch-show-more.swatch-shape-rounded {
50
+ -webkit-border-radius: 8px;
51
+ -moz-border-radius: 8px;
52
+ border-radius: 8px;
53
+ }
54
+ .tawcvs-swatches .swatch.swatch-shape-rounded img,
55
+ .tawcvs-swatches .swatch-show-more.swatch-shape-rounded img {
56
+ -webkit-border-radius: 8px;
57
+ -moz-border-radius: 8px;
58
+ border-radius: 8px;
59
+ }
60
+ .tawcvs-swatches .swatch.swatch-shape-edge,
61
+ .tawcvs-swatches .swatch-show-more.swatch-shape-edge {
62
+ -webkit-border-radius: 0;
63
+ -moz-border-radius: 0;
64
+ border-radius: 0;
65
+ }
66
+ .tawcvs-swatches .swatch.swatch-shape-edge img,
67
+ .tawcvs-swatches .swatch-show-more.swatch-shape-edge img {
68
+ -webkit-border-radius: 0;
69
+ -moz-border-radius: 0;
70
+ border-radius: 0;
71
+ }
72
+ .tawcvs-swatches .swatch.disabled,
73
+ .tawcvs-swatches .swatch-show-more.disabled {
74
+ cursor: default;
75
+ opacity: 0.4 !important;
76
+ }
77
+ .tawcvs-swatches .swatch.disabled .swatch__tooltip,
78
+ .tawcvs-swatches .swatch-show-more.disabled .swatch__tooltip {
79
+ display: none;
80
+ }
81
+ .tawcvs-swatches .swatch.selected,
82
+ .tawcvs-swatches .swatch-show-more.selected {
83
+ border: 2px solid #674399 !important;
84
+ }
85
+ .tawcvs-swatches .swatch:first-child,
86
+ .tawcvs-swatches .swatch-show-more:first-child {
87
+ margin-left: 0;
88
+ }
89
+ .tawcvs-swatches .swatch:last-child,
90
+ .tawcvs-swatches .swatch-show-more:last-child {
91
+ margin-right: 0;
92
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
93
  .tawcvs-swatches .swatch-color {
94
+ text-indent: -9999em;
95
+ border: 2px solid #ccc;
96
  }
 
97
  .tawcvs-swatches .swatch-color.selected {
98
+ border-color: #333;
99
  }
 
100
  .tawcvs-swatches .swatch-color.selected:before {
101
+ -webkit-transform: translate(-50%, -50%) rotate(45deg);
102
+ -moz-transform: translate(-50%, -50%) rotate(45deg);
103
+ transform: translate(-50%, -50%) rotate(45deg);
104
+ content: "";
105
+ width: 6px;
106
+ height: 10px;
107
+ display: block;
108
+ border: solid #eee;
109
+ border-width: 0 2px 2px 0;
110
+ position: absolute;
111
+ top: 50%;
112
+ left: 50%;
113
+ margin: -2px -2px 0 0;
114
  }
 
115
  .tawcvs-swatches .swatch-label {
116
+ font-size: 14px;
117
+ background-color: #f1f1f1;
118
  }
 
119
  .tawcvs-swatches .swatch-image {
120
+ font-size: 0;
121
+ }
122
+ .tawcvs-swatches .swatch-image .swatch__tooltip {
123
+ font-size: 14px;
124
+ }
125
+ .tawcvs-swatches .swatch__tooltip {
126
+ -webkit-transform: translate(-50%, -100%);
127
+ -moz-transform: translate(-50%, -100%);
128
+ transform: translate(-50%, -100%);
129
+ -webkit-transition: all 0.3s;
130
+ -moz-transition: all 0.3s;
131
+ -o-transition: all 0.3s;
132
+ transition: all 0.3s;
133
+ -webkit-border-radius: 3px;
134
+ -moz-border-radius: 3px;
135
+ border-radius: 3px;
136
+ position: absolute;
137
+ left: 50%;
138
+ top: 0;
139
+ background: #333;
140
+ z-index: 2;
141
+ color: #fff;
142
+ margin: -15px 0 0 0;
143
+ padding: 5px 10px;
144
+ text-indent: initial;
145
+ font-size: 14px;
146
+ font-weight: 500;
147
+ opacity: 0;
148
+ visibility: hidden;
149
+ user-select: none;
150
+ display: inline-block;
151
+ word-break: break-all;
152
+ white-space: normal;
153
+ min-width: max-content;
154
+ }
155
+ .tawcvs-swatches .swatch__tooltip:after {
156
+ -webkit-transform: rotate(45deg);
157
+ -moz-transform: rotate(45deg);
158
+ transform: rotate(45deg);
159
+ content: "";
160
+ position: absolute;
161
+ width: 12px;
162
+ height: 12px;
163
+ background: #333;
164
+ bottom: -4px;
165
+ left: 50%;
166
+ margin-left: -6px;
167
+ }
168
+ .tawcvs-swatches .swatch-item-wrapper {
169
+ position: relative;
170
+ }
171
+ .tawcvs-swatches .swatch:hover + .swatch__tooltip {
172
+ opacity: 1;
173
+ visibility: visible;
174
+ user-select: auto;
175
+ }
176
+ .tawcvs-swatches.oss-blur-with-cross .swatch.disabled {
177
+ position: relative;
178
+ background: #33333357;
179
+ }
180
+ .tawcvs-swatches.oss-blur-with-cross .swatch.disabled img {
181
+ opacity: 0.5;
182
+ }
183
+ .tawcvs-swatches.oss-blur-with-cross .swatch.disabled:after {
184
+ content: "";
185
+ position: absolute;
186
+ top: 0;
187
+ right: 0;
188
+ bottom: 0;
189
+ left: 0;
190
+ background: linear-gradient(to top left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) calc(50% - 0.8px), black 50%, rgba(0, 0, 0, 0) calc(50% + 0.8px), rgba(0, 0, 0, 0) 100%), linear-gradient(to top right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) calc(50% - 0.8px), black 50%, rgba(0, 0, 0, 0) calc(50% + 0.8px), rgba(0, 0, 0, 0) 100%);
191
+ }
192
+ .tawcvs-swatches.oss-hide .swatch.disabled {
193
+ display: none;
194
  }
195
 
196
+ .swatch-align-left .variations td {
197
+ text-align: left;
198
+ }
199
+ .swatch-align-left .variations td img, .swatch-align-left .variations td select {
200
+ text-align: left;
201
  }
202
 
203
+ .swatch-align-center .variations td {
204
+ text-align: center;
205
+ }
206
+ .swatch-align-center .variations td img, .swatch-align-center .variations td select {
207
+ text-align: center;
208
  }
209
 
210
+ .related.products .swatch-align-center .variations td.label {
211
+ display: none;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
212
  }
213
 
214
+ .swatch-align-right .variations td, .swatch-align-right .variations img, .swatch-align-right .variations td select {
215
+ text-align: right;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
216
  }
217
+
218
+ .variations .reset_variations {
219
+ display: none;
220
+ }
assets/images/support.png ADDED
Binary file
assets/images/video-1.jpg ADDED
Binary file
assets/images/video-2.jpg ADDED
Binary file
assets/images/video-3.jpg ADDED
Binary file
assets/images/video-4.jpg ADDED
Binary file
assets/images/wc-plugins.png ADDED
Binary file
assets/images/wslogo-dash.png ADDED
Binary file
assets/images/wslogo.png ADDED
Binary file
assets/js/admin.js CHANGED
@@ -1,143 +1,286 @@
1
  var frame,
2
- tawcvs = tawcvs || {};
3
-
4
- jQuery( document ).ready( function ( $ ) {
5
- 'use strict';
6
- var wp = window.wp,
7
- $body = $( 'body' );
8
-
9
- $( '#term-color' ).wpColorPicker();
10
-
11
- // Update attribute image
12
- $body.on( 'click', '.tawcvs-upload-image-button', function ( event ) {
13
- event.preventDefault();
14
-
15
- var $button = $( this );
16
-
17
- // If the media frame already exists, reopen it.
18
- if ( frame ) {
19
- frame.open();
20
- return;
21
- }
22
-
23
- // Create the media frame.
24
- frame = wp.media.frames.downloadable_file = wp.media( {
25
- title : tawcvs.i18n.mediaTitle,
26
- button : {
27
- text: tawcvs.i18n.mediaButton
28
- },
29
- multiple: false
30
- } );
31
-
32
- // When an image is selected, run a callback.
33
- frame.on( 'select', function () {
34
- var attachment = frame.state().get( 'selection' ).first().toJSON();
35
-
36
- $button.siblings( 'input.tawcvs-term-image' ).val( attachment.id );
37
- $button.siblings( '.tawcvs-remove-image-button' ).show();
38
- $button.parent().prev( '.tawcvs-term-image-thumbnail' ).find( 'img' ).attr( 'src', attachment.sizes.thumbnail.url );
39
- } );
40
-
41
- // Finally, open the modal.
42
- frame.open();
43
-
44
- } ).on( 'click', '.tawcvs-remove-image-button', function () {
45
- var $button = $( this );
46
-
47
- $button.siblings( 'input.tawcvs-term-image' ).val( '' );
48
- $button.siblings( '.tawcvs-remove-image-button' ).show();
49
- $button.parent().prev( '.tawcvs-term-image-thumbnail' ).find( 'img' ).attr( 'src', tawcvs.placeholder );
50
-
51
- return false;
52
- } );
53
-
54
- // Toggle add new attribute term modal
55
- var $modal = $( '#tawcvs-modal-container' ),
56
- $spinner = $modal.find( '.spinner' ),
57
- $msg = $modal.find( '.message' ),
58
- $metabox = null;
59
-
60
- $body.on( 'click', '.tawcvs_add_new_attribute', function ( e ) {
61
- e.preventDefault();
62
- var $button = $( this ),
63
- taxInputTemplate = wp.template( 'tawcvs-input-tax' ),
64
- data = {
65
- type: $button.data( 'type' ),
66
- tax : $button.closest( '.woocommerce_attribute' ).data( 'taxonomy' )
67
- };
68
-
69
- // Insert input
70
- $modal.find( '.tawcvs-term-swatch' ).html( $( '#tmpl-tawcvs-input-' + data.type ).html() );
71
- $modal.find( '.tawcvs-term-tax' ).html( taxInputTemplate( data ) );
72
-
73
- if ( 'color' == data.type ) {
74
- $modal.find( 'input.tawcvs-input-color' ).wpColorPicker();
75
- }
76
-
77
- $metabox = $button.closest( '.woocommerce_attribute.wc-metabox' );
78
- $modal.show();
79
- } ).on( 'click', '.tawcvs-modal-close, .tawcvs-modal-backdrop', function ( e ) {
80
- e.preventDefault();
81
-
82
- closeModal();
83
- } );
84
-
85
- // Send ajax request to add new attribute term
86
- $body.on( 'click', '.tawcvs-new-attribute-submit', function ( e ) {
87
- e.preventDefault();
88
-
89
- var $button = $( this ),
90
- type = $button.data( 'type' ),
91
- error = false,
92
- data = {};
93
-
94
- // Validate
95
- $modal.find( '.tawcvs-input' ).each( function () {
96
- var $this = $( this );
97
-
98
- if ( $this.attr( 'name' ) != 'slug' && !$this.val() ) {
99
- $this.addClass( 'error' );
100
- error = true;
101
- } else {
102
- $this.removeClass( 'error' );
103
- }
104
-
105
- data[$this.attr( 'name' )] = $this.val();
106
- } );
107
-
108
- if ( error ) {
109
- return;
110
- }
111
-
112
- // Send ajax request
113
- $spinner.addClass( 'is-active' );
114
- $msg.hide();
115
- wp.ajax.send( 'tawcvs_add_new_attribute', {
116
- data : data,
117
- error : function ( res ) {
118
- $spinner.removeClass( 'is-active' );
119
- $msg.addClass( 'error' ).text( res ).show();
120
- },
121
- success: function ( res ) {
122
- $spinner.removeClass( 'is-active' );
123
- $msg.addClass( 'success' ).text( res.msg ).show();
124
-
125
- $metabox.find( 'select.attribute_values' ).append( '<option value="' + res.id + '" selected="selected">' + res.name + '</option>' );
126
- $metabox.find( 'select.attribute_values' ).change();
127
-
128
- closeModal();
129
- }
130
- } );
131
- } );
132
-
133
- /**
134
- * Close modal
135
- */
136
- function closeModal() {
137
- $modal.find( '.tawcvs-term-name input, .tawcvs-term-slug input' ).val( '' );
138
- $spinner.removeClass( 'is-active' );
139
- $msg.removeClass( 'error success' ).hide();
140
- $modal.hide();
141
- }
142
- } );
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
143
 
1
  var frame,
2
+ tawcvs = tawcvs || {};
3
+
4
+ jQuery(document).ready(function ($) {
5
+ 'use strict';
6
+ var wp = window.wp,
7
+ $body = $('body');
8
+
9
+ $('#term-color,#term-secondary-color').wpColorPicker();
10
+
11
+ // Update attribute image
12
+ $body.on('click', '.tawcvs-upload-image-button', function (event) {
13
+ event.preventDefault();
14
+
15
+ var $button = $(this);
16
+
17
+ // If the media frame already exists, reopen it.
18
+ if (frame) {
19
+ frame.open();
20
+ return;
21
+ }
22
+
23
+ // Create the media frame.
24
+ frame = wp.media.frames.downloadable_file = wp.media({
25
+ title: tawcvs.i18n.mediaTitle,
26
+ button: {
27
+ text: tawcvs.i18n.mediaButton
28
+ },
29
+ multiple: false
30
+ });
31
+
32
+ // When an image is selected, run a callback.
33
+ frame.on('select', function () {
34
+ var attachment = frame.state().get('selection').first().toJSON();
35
+
36
+ $button.siblings('input.tawcvs-term-image').val(attachment.id);
37
+ $button.siblings('.tawcvs-remove-image-button').show();
38
+ $button.parent().prev('.tawcvs-term-image-thumbnail').find('img').attr('src', attachment.sizes.thumbnail.url);
39
+ });
40
+
41
+ // Finally, open the modal.
42
+ frame.open();
43
+
44
+ }).on('click', '.tawcvs-remove-image-button', function () {
45
+ var $button = $(this);
46
+
47
+ $button.siblings('input.tawcvs-term-image').val('');
48
+ $button.siblings('.tawcvs-remove-image-button').show();
49
+ $button.parent().prev('.tawcvs-term-image-thumbnail').find('img').attr('src', tawcvs.placeholder);
50
+
51
+ return false;
52
+ });
53
+
54
+ // Toggle add new attribute term modal
55
+ var $modal = $('#tawcvs-modal-container'),
56
+ $spinner = $modal.find('.spinner'),
57
+ $msg = $modal.find('.message'),
58
+ $metabox = null;
59
+
60
+ $body.on('click', '.tawcvs_add_new_attribute', function (e) {
61
+ e.preventDefault();
62
+ var $button = $(this),
63
+ taxInputTemplate = wp.template('tawcvs-input-tax'),
64
+ data = {
65
+ type: $button.data('type'),
66
+ tax: $button.closest('.woocommerce_attribute').data('taxonomy')
67
+ };
68
+
69
+ // Insert input
70
+ $modal.find('.tawcvs-term-swatch').html($('#tmpl-tawcvs-input-' + data.type).html());
71
+ $modal.find('.tawcvs-term-tax').html(taxInputTemplate(data));
72
+
73
+ if ('color' === data.type) {
74
+ $modal.find('input.tawcvs-input-color').wpColorPicker();
75
+ }
76
+
77
+ $metabox = $button.closest('.woocommerce_attribute.wc-metabox');
78
+ $modal.show();
79
+ }).on('click', '.tawcvs-modal-close, .tawcvs-modal-backdrop', function (e) {
80
+ e.preventDefault();
81
+
82
+ closeModal();
83
+ });
84
+
85
+ // Send ajax request to add new attribute term
86
+ $body.on('click', '.tawcvs-new-attribute-submit', function (e) {
87
+ e.preventDefault();
88
+
89
+ var $button = $(this),
90
+ type = $button.data('type'),
91
+ error = false,
92
+ data = {};
93
+
94
+ // Validate
95
+ $modal.find('.tawcvs-input').each(function () {
96
+ var $this = $(this);
97
+
98
+ if ($this.attr('name') !== 'slug' && !$this.val()) {
99
+ $this.addClass('error');
100
+ error = true;
101
+ } else {
102
+ $this.removeClass('error');
103
+ }
104
+
105
+ data[$this.attr('name')] = $this.val();
106
+ });
107
+
108
+ if (error) {
109
+ return;
110
+ }
111
+
112
+ // Send ajax request
113
+ $spinner.addClass('is-active');
114
+ $msg.hide();
115
+ wp.ajax.send('tawcvs_add_new_attribute', {
116
+ data: data,
117
+ error: function (res) {
118
+ $spinner.removeClass('is-active');
119
+ $msg.addClass('error').text(res).show();
120
+ },
121
+ success: function (res) {
122
+ $spinner.removeClass('is-active');
123
+ $msg.addClass('success').text(res.msg).show();
124
+
125
+ $metabox.find('select.attribute_values').append('<option value="' + res.id + '" selected="selected">' + res.name + '</option>');
126
+ $metabox.find('select.attribute_values').change();
127
+
128
+ closeModal();
129
+ }
130
+ });
131
+
132
+
133
+ });
134
+
135
+ /**
136
+ * Close modal
137
+ */
138
+ function closeModal() {
139
+ $modal.find('.tawcvs-term-name input, .tawcvs-term-slug input').val('');
140
+ $spinner.removeClass('is-active');
141
+ $msg.removeClass('error success').hide();
142
+ $modal.hide();
143
+ }
144
+
145
+ // accordion js code
146
+
147
+
148
+ //track changed settings
149
+ $('#tawcvs-settings-wrap :input').each(function (key) {
150
+ $(this).change(function () {
151
+ $(this).addClass('dirty');
152
+ });
153
+ });
154
+
155
+ //Ajax save settings
156
+ $body.on('click', '#tawcvs_save_settings', function (e) {
157
+ e.preventDefault();
158
+
159
+ const data = JSON.parse(getAllValues());
160
+ let savingNoticeEle = $('.wcvs-saving-notice');
161
+
162
+ $('.wcvs-notice').hide();
163
+ savingNoticeEle.fadeIn();
164
+
165
+ wp.ajax.send('tawcvs_save_settings', {
166
+ data: data,
167
+ error: function (res) {
168
+ savingNoticeEle.hide();
169
+ $('.wcvs-failed-notice').fadeIn().delay(5000).fadeOut();
170
+ },
171
+ success: function (res) {
172
+ savingNoticeEle.hide();
173
+ $('.wcvs-saved-notice').fadeIn().delay(5000).fadeOut();
174
+ }
175
+ });
176
+ });
177
+
178
+ function getAllValues() {
179
+ var inputValues = '{';
180
+ $('#tawcvs-settings-wrap :input').map(function () {
181
+ var type = $(this).prop("type");
182
+
183
+ // checked radios/checkboxes
184
+ if (type === "checkbox") {
185
+ if (this.checked) {
186
+ inputValues = inputValues.concat('"' + $(this).attr('name') + '":' + '"1",');
187
+ } else {
188
+ inputValues = inputValues.concat('"' + $(this).attr('name') + '":' + '"0",');
189
+ }
190
+ } else if (type === "radio") {
191
+ if (this.checked) {
192
+ inputValues = inputValues.concat('"' + $(this).attr('name') + '":' + '"' + $(this).val() + '",');
193
+ }
194
+ }
195
+ // all other fields, except buttons
196
+ else if (type !== "button" && type !== "submit" && type !== "hidden") {
197
+ inputValues = inputValues.concat('"' + $(this).attr('name') + '":' + '"' + $(this).val() + '",');
198
+ }
199
+ })
200
+ return inputValues.slice(0, -1).concat('}');
201
+
202
+ }
203
+
204
+
205
+ });
206
+
207
+
208
+ jQuery(document).ready(function ($) {
209
+ // accordion js
210
+ $('.variation-item-head').on('click', function () {
211
+ var $clickedHead = $(this);
212
+ $('.variation-item-head').each(function () {
213
+ if ($(this).is($clickedHead)) {
214
+ // Do nothing
215
+ } else {
216
+ $(this).removeClass('active-accordion');
217
+ $(this).next().slideUp();
218
+ }
219
+ });
220
+ $clickedHead.next().slideToggle();
221
+ $clickedHead.toggleClass('active-accordion');
222
+
223
+ });
224
+
225
+ // accordion tab
226
+
227
+ $('.accor-tab-btn').on('click', function (e) {
228
+ e.preventDefault();
229
+ var index = $(this).index();
230
+ $('.accor-tab-btn').removeClass('active-at-btn');
231
+ $(this).addClass('active-at-btn');
232
+ $('.wcvs-accor-tab-content').hide().eq(index).show();
233
+ });
234
+
235
+ //Dynamically Call the accordion target
236
+ $(".wcvs-accordion-switch").change(function () {
237
+ var wcvs_accordion_target = $(this).attr('data-target');
238
+ if (this.checked) {
239
+ $(wcvs_accordion_target).slideDown();
240
+ } else {
241
+ $(wcvs_accordion_target).slideUp();
242
+ }
243
+ });
244
+
245
+ // Add Color Picker to all inputs that have 'color-field' class
246
+ $(function () {
247
+ $('.vs-color-picker').wpColorPicker();
248
+ });
249
+
250
+ //Toggle show/hide a field when checking its conditional field
251
+ $(".variation-switcher-item[data-conditional]").each(function () {
252
+
253
+ const currentEle = $(this);
254
+
255
+ const conditionalFieldID = currentEle.data("conditional");
256
+
257
+ const conditionalFieldEle = $("#" + conditionalFieldID);
258
+
259
+ if (conditionalFieldEle.length) {
260
+
261
+ conditionalFieldEle.on("change", function () {
262
+ const currentConditionalField = $(this);
263
+
264
+ if (currentConditionalField.is(':checked')) {
265
+ currentEle.slideDown('fast');
266
+ } else {
267
+ currentEle.slideUp('fast');
268
+ }
269
+ })
270
+
271
+ //Trigger for the first time on page load
272
+ conditionalFieldEle.trigger("change");
273
+ }
274
+ })
275
+ //Show the Pro features popup
276
+ $('#tawcvs-settings-wrap').on('click', '.wcvs-pro-item, .wcvs-pro-item *', function (e) {
277
+ e.preventDefault();
278
+ $('.wcvs-pro-feature-popup,.wcvs-popup-blur').show();
279
+ })
280
+ //Hide the Pro features popup when clicking on close button or outside the popup
281
+ $('.popup-close,.wcvs-popup-blur').on('click', function () {
282
+ $('.wcvs-popup,.wcvs-popup-blur').hide();
283
+ })
284
+ });
285
+
286
 
assets/js/admin.min.js ADDED
@@ -0,0 +1 @@
 
1
+ var frame,tawcvs=tawcvs||{};jQuery(document).ready(function($){"use strict";var wp=window.wp,$body=$("body");$("#term-color,#term-secondary-color").wpColorPicker();$body.on("click",".tawcvs-upload-image-button",function(event){event.preventDefault();var $button=$(this);if(frame){frame.open();return}frame=wp.media.frames.downloadable_file=wp.media({title:tawcvs.i18n.mediaTitle,button:{text:tawcvs.i18n.mediaButton},multiple:false});frame.on("select",function(){var attachment=frame.state().get("selection").first().toJSON();$button.siblings("input.tawcvs-term-image").val(attachment.id);$button.siblings(".tawcvs-remove-image-button").show();$button.parent().prev(".tawcvs-term-image-thumbnail").find("img").attr("src",attachment.sizes.thumbnail.url)});frame.open()}).on("click",".tawcvs-remove-image-button",function(){var $button=$(this);$button.siblings("input.tawcvs-term-image").val("");$button.siblings(".tawcvs-remove-image-button").show();$button.parent().prev(".tawcvs-term-image-thumbnail").find("img").attr("src",tawcvs.placeholder);return false});var $modal=$("#tawcvs-modal-container"),$spinner=$modal.find(".spinner"),$msg=$modal.find(".message"),$metabox=null;$body.on("click",".tawcvs_add_new_attribute",function(e){e.preventDefault();var $button=$(this),taxInputTemplate=wp.template("tawcvs-input-tax"),data={type:$button.data("type"),tax:$button.closest(".woocommerce_attribute").data("taxonomy")};$modal.find(".tawcvs-term-swatch").html($("#tmpl-tawcvs-input-"+data.type).html());$modal.find(".tawcvs-term-tax").html(taxInputTemplate(data));if("color"===data.type){$modal.find("input.tawcvs-input-color").wpColorPicker()}$metabox=$button.closest(".woocommerce_attribute.wc-metabox");$modal.show()}).on("click",".tawcvs-modal-close, .tawcvs-modal-backdrop",function(e){e.preventDefault();closeModal()});$body.on("click",".tawcvs-new-attribute-submit",function(e){e.preventDefault();var $button=$(this),type=$button.data("type"),error=false,data={};$modal.find(".tawcvs-input").each(function(){var $this=$(this);if($this.attr("name")!=="slug"&&!$this.val()){$this.addClass("error");error=true}else{$this.removeClass("error")}data[$this.attr("name")]=$this.val()});if(error){return}$spinner.addClass("is-active");$msg.hide();wp.ajax.send("tawcvs_add_new_attribute",{data:data,error:function(res){$spinner.removeClass("is-active");$msg.addClass("error").text(res).show()},success:function(res){$spinner.removeClass("is-active");$msg.addClass("success").text(res.msg).show();$metabox.find("select.attribute_values").append('<option value="'+res.id+'" selected="selected">'+res.name+"</option>");$metabox.find("select.attribute_values").change();closeModal()}})});function closeModal(){$modal.find(".tawcvs-term-name input, .tawcvs-term-slug input").val("");$spinner.removeClass("is-active");$msg.removeClass("error success").hide();$modal.hide()}$("#tawcvs-settings-wrap :input").each(function(key){$(this).change(function(){$(this).addClass("dirty")})});$body.on("click","#tawcvs_save_settings",function(e){e.preventDefault();const data=JSON.parse(getAllValues());let savingNoticeEle=$(".wcvs-saving-notice");$(".wcvs-notice").hide();savingNoticeEle.fadeIn();wp.ajax.send("tawcvs_save_settings",{data:data,error:function(res){savingNoticeEle.hide();$(".wcvs-failed-notice").fadeIn().delay(5e3).fadeOut()},success:function(res){savingNoticeEle.hide();$(".wcvs-saved-notice").fadeIn().delay(5e3).fadeOut()}})});function getAllValues(){var inputValues="{";$("#tawcvs-settings-wrap :input").map(function(){var type=$(this).prop("type");if(type==="checkbox"){if(this.checked){inputValues=inputValues.concat('"'+$(this).attr("name")+'":'+'"1",')}else{inputValues=inputValues.concat('"'+$(this).attr("name")+'":'+'"0",')}}else if(type==="radio"){if(this.checked){inputValues=inputValues.concat('"'+$(this).attr("name")+'":'+'"'+$(this).val()+'",')}}else if(type!=="button"&&type!=="submit"){inputValues=inputValues.concat('"'+$(this).attr("name")+'":'+'"'+$(this).val()+'",')}});return inputValues.slice(0,-1).concat("}")}});jQuery(document).ready(function($){$(".variation-item-head").on("click",function(){var $clickedHead=$(this);$(".variation-item-head").each(function(){if($(this).is($clickedHead)){}else{$(this).removeClass("active-accordion");$(this).next().slideUp()}});$clickedHead.next().slideToggle();$clickedHead.toggleClass("active-accordion")});$(".accor-tab-btn").on("click",function(){var index=$(this).index();$(".accor-tab-btn").removeClass("active-at-btn");$(this).addClass("active-at-btn");$(".wcvs-accor-tab-content").hide().eq(index).show()});$(".wcvs-accordion-switch").change(function(){var wcvs_accordion_target=$(this).attr("data-target");if(this.checked){$(wcvs_accordion_target).slideDown()}else{$(wcvs_accordion_target).slideUp()}});$(function(){$(".vs-color-picker").wpColorPicker()});const isDualColorEle=$("#term-is-dual-color");const secondaryColorEle=$(".tawcvs-dual-color-select");if(isDualColorEle.length){isDualColorEle.on("change",function(){const currentConditionalField=$(this);if(currentConditionalField.is(":checked")){secondaryColorEle.removeClass("hidden")}else if(!currentConditionalField.hasClass("hidden")){secondaryColorEle.addClass("hidden")}});isDualColorEle.trigger("change")}$(".wcvs-pro-item").on("click",function(){$(".pro-feature-popup,.pro-features-blur").show()});$(".popup-close,.pro-features-blur").on("click",function(){$(".pro-feature-popup,.pro-features-blur").hide()})});
assets/js/frontend.js CHANGED
@@ -21,6 +21,12 @@
21
  return;
22
  }
23
 
 
 
 
 
 
 
24
  // For old WC
25
  $select.trigger( 'focusin' );
26
 
@@ -83,8 +89,38 @@
83
  } );
84
  };
85
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
86
  $( function () {
87
  $( '.variations_form' ).tawcvs_variation_swatches_form();
88
  $( document.body ).trigger( 'tawcvs_initialized' );
 
89
  } );
90
  })( jQuery );
21
  return;
22
  }
23
 
24
+ //Disabling other swatches, then resetting the select value to empty
25
+ $el.parents('.tawcvs-swatches').find(".swatch.selected").each(function(){
26
+ $(this).not($el).removeClass("selected");
27
+ $select.val( '' );
28
+ })
29
+
30
  // For old WC
31
  $select.trigger( 'focusin' );
32
 
89
  } );
90
  };
91
 
92
+ //Tracking the reset_variations button on change visibility -> change the corresponding display state
93
+ function toggle_hidden_variation_btn() {
94
+ const resetVariationNodes = document.getElementsByClassName('reset_variations');
95
+
96
+ if (resetVariationNodes.length) {
97
+
98
+ Array.prototype.forEach.call(resetVariationNodes, function (resetVariationEle) {
99
+
100
+ let observer = new MutationObserver(function () {
101
+
102
+ if (resetVariationEle.style.visibility !== 'hidden') {
103
+
104
+ resetVariationEle.style.display = 'block';
105
+
106
+ } else {
107
+
108
+ resetVariationEle.style.display = 'none';
109
+
110
+ }
111
+
112
+ });
113
+
114
+ observer.observe(resetVariationEle, {attributes: true, childList: true});
115
+
116
+ })
117
+
118
+ }
119
+ }
120
+
121
  $( function () {
122
  $( '.variations_form' ).tawcvs_variation_swatches_form();
123
  $( document.body ).trigger( 'tawcvs_initialized' );
124
+ toggle_hidden_variation_btn();
125
  } );
126
  })( jQuery );
assets/js/frontend.min.js ADDED
@@ -0,0 +1 @@
 
1
+ (function($){"use strict";$.fn.tawcvs_variation_swatches_form=function(){return this.each(function(){var $form=$(this);$form.addClass("swatches-support").on("click",".swatch",function(e){e.preventDefault();var $el=$(this),$select=$el.closest(".value").find("select"),value=$el.attr("data-value");if($el.hasClass("disabled")){return}$select.trigger("focusin");if(!$select.find('option[value="'+value+'"]').length){$el.siblings(".swatch").removeClass("selected");$select.val("").change();$form.trigger("tawcvs_no_matching_variations",[$el]);return}if($el.hasClass("selected")){$select.val("");$el.removeClass("selected")}else{$el.addClass("selected").siblings(".selected").removeClass("selected");$select.val(value)}$select.change()}).on("click",".reset_variations",function(){$form.find(".swatch.selected").removeClass("selected");$form.find(".swatch.disabled").removeClass("disabled")}).on("woocommerce_update_variation_values",function(){setTimeout(function(){$form.find("tbody tr").each(function(){var $variationRow=$(this),$options=$variationRow.find("select").find("option"),$selected=$options.filter(":selected"),values=[];$options.each(function(index,option){if(option.value!==""){values.push(option.value)}});$variationRow.find(".swatch").each(function(){var $swatch=$(this),value=$swatch.attr("data-value");if(values.indexOf(value)>-1){$swatch.removeClass("disabled")}else{$swatch.addClass("disabled");if($selected.length&&value===$selected.val()){$swatch.removeClass("selected")}}})})},100)}).on("tawcvs_no_matching_variations",function(){window.alert(wc_add_to_cart_variation_params.i18n_no_matching_variations_text)})})};function toggle_hidden_variation_btn(){const resetVariationNodes=document.getElementsByClassName("reset_variations");if(resetVariationNodes.length){Array.prototype.forEach.call(resetVariationNodes,function(resetVariationEle){let observer=new MutationObserver(function(){if(resetVariationEle.style.visibility!=="hidden"){resetVariationEle.style.display="block"}else{resetVariationEle.style.display="none"}});observer.observe(resetVariationEle,{attributes:true,childList:true})})}}$(function(){$(".variations_form").tawcvs_variation_swatches_form();$(document.body).trigger("tawcvs_initialized");toggle_hidden_variation_btn()})})(jQuery);
includes/class-addon-page.php ADDED
@@ -0,0 +1,39 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <?php
2
+ if ( ! class_exists( 'VSWC_Addons_Page' ) ) {
3
+ class VSWC_Addons_Page {
4
+
5
+ /**
6
+ * Get all available modules.
7
+ *
8
+ * @return array Array of available modules.
9
+ */
10
+ public function woosuite_core_get_modules() {
11
+ $request = wp_remote_request( $this->woosuite_core_get_api_url( '/plugins/' ) );
12
+
13
+ if ( is_wp_error( $request ) ) {
14
+ return array();
15
+ }
16
+
17
+ $body = json_decode( wp_remote_retrieve_body( $request ) );
18
+
19
+ if ( ! empty( $body->data ) && ! empty( $body->data->status ) && 200 !== $body->data->status ) {
20
+ return array();
21
+ }
22
+
23
+ // Exclude core plugin to be displayed here.
24
+ if ( ! is_wp_error( $body ) ) {
25
+ $body = wp_list_filter( $body, array( 'slug' => 'woosuite-core' ), 'NOT' );
26
+ }
27
+
28
+ return $body;
29
+ }
30
+
31
+ private function woosuite_core_get_api_url( $path = '' ) {
32
+ return apply_filters( 'woosuite_core_api_url', $this->woosuite_core_get_api_site_url() . 'wp-json/woosuite-server/v1' ) . $path;
33
+ }
34
+
35
+ private function woosuite_core_get_api_site_url() {
36
+ return apply_filters( 'woosuite_core_get_api_site_url', 'https://dw.woosuite.com/' );
37
+ }
38
+ }
39
+ }
includes/class-admin.php CHANGED
@@ -11,6 +11,8 @@ class TA_WC_Variation_Swatches_Admin {
11
  */
12
  protected static $instance = null;
13
 
 
 
14
  /**
15
  * Main instance
16
  *
@@ -37,7 +39,35 @@ class TA_WC_Variation_Swatches_Admin {
37
  add_action( 'admin_init', array( $this, 'restore_attribute_types' ) );
38
 
39
  // Display attribute fields
40
- add_action( 'tawcvs_product_attribute_field', array( $this, 'attribute_fields' ), 10, 3 );
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
41
  }
42
 
43
  /**
@@ -45,6 +75,10 @@ class TA_WC_Variation_Swatches_Admin {
45
  */
46
  public function includes() {
47
  include_once( dirname( __FILE__ ) . '/class-admin-product.php' );
 
 
 
 
48
  }
49
 
50
  /**
@@ -61,10 +95,19 @@ class TA_WC_Variation_Swatches_Admin {
61
 
62
  foreach ( $attribute_taxonomies as $tax ) {
63
  add_action( 'pa_' . $tax->attribute_name . '_add_form_fields', array( $this, 'add_attribute_fields' ) );
64
- add_action( 'pa_' . $tax->attribute_name . '_edit_form_fields', array( $this, 'edit_attribute_fields' ), 10, 2 );
65
-
66
- add_filter( 'manage_edit-pa_' . $tax->attribute_name . '_columns', array( $this, 'add_attribute_columns' ) );
67
- add_filter( 'manage_pa_' . $tax->attribute_name . '_custom_column', array( $this, 'add_attribute_column_content' ), 10, 3 );
 
 
 
 
 
 
 
 
 
68
  }
69
 
70
  add_action( 'created_term', array( $this, 'save_term_meta' ), 10, 2 );
@@ -75,15 +118,33 @@ class TA_WC_Variation_Swatches_Admin {
75
  * Load stylesheet and scripts in edit product attribute screen
76
  */
77
  public function enqueue_scripts() {
78
- $screen = get_current_screen();
 
 
 
 
 
 
79
  if ( strpos( $screen->id, 'edit-pa_' ) === false && strpos( $screen->id, 'product' ) === false ) {
80
  return;
81
  }
82
 
 
 
 
 
 
83
  wp_enqueue_media();
84
 
85
- wp_enqueue_style( 'tawcvs-admin', plugins_url( '/assets/css/admin.css', dirname( __FILE__ ) ), array( 'wp-color-picker' ), '20160615' );
86
- wp_enqueue_script( 'tawcvs-admin', plugins_url( '/assets/js/admin.js', dirname( __FILE__ ) ), array( 'jquery', 'wp-color-picker', 'wp-util' ), '20170113', true );
 
 
 
 
 
 
 
87
 
88
  wp_localize_script(
89
  'tawcvs-admin',
@@ -96,6 +157,7 @@ class TA_WC_Variation_Swatches_Admin {
96
  'placeholder' => WC()->plugin_url() . '/assets/images/placeholder.png'
97
  )
98
  );
 
99
  }
100
 
101
  /**
@@ -104,29 +166,35 @@ class TA_WC_Variation_Swatches_Admin {
104
  public function restore_attributes_notice() {
105
  if ( get_transient( 'tawcvs_attribute_taxonomies' ) && ! get_option( 'tawcvs_restore_attributes_time' ) ) {
106
  ?>
107
- <div class="notice-warning notice is-dismissible">
108
- <p>
109
  <?php
110
  esc_html_e( 'Found a backup of product attributes types. This backup was generated at', 'wcvs' );
111
  echo ' ' . date( get_option( 'date_format' ) . ' ' . get_option( 'time_format' ), get_option( 'tawcvs_backup_attributes_time' ) ) . '.';
112
  ?>
113
- </p>
114
- <p>
115
- <a href="<?php echo esc_url( add_query_arg( array( 'tawcvs_action' => 'restore_attributes_types', 'tawcvs_nonce' => wp_create_nonce( 'restore_attributes_types' ) ) ) ); ?>">
116
- <strong><?php esc_html_e( 'Restore product attributes types', 'wcvs' ); ?></strong>
117
- </a>
118
- |
119
- <a href="<?php echo esc_url( add_query_arg( array( 'tawcvs_action' => 'dismiss_restore_notice', 'tawcvs_nonce' => wp_create_nonce( 'dismiss_restore_notice' ) ) ) ); ?>">
120
- <strong><?php esc_html_e( 'Dismiss this notice', 'wcvs' ); ?></strong>
121
- </a>
122
- </p>
123
- </div>
 
 
 
 
 
 
124
  <?php
125
  } elseif ( isset( $_GET['tawcvs_message'] ) && 'restored' == $_GET['tawcvs_message'] ) {
126
  ?>
127
- <div class="notice-warning settings-error notice is-dismissible">
128
- <p><?php esc_html_e( 'All attributes types have been restored.', 'wcvs' ) ?></p>
129
- </div>
130
  <?php
131
  }
132
  }
@@ -182,8 +250,7 @@ class TA_WC_Variation_Swatches_Admin {
182
  */
183
  public function add_attribute_fields( $taxonomy ) {
184
  $attr = TA_WCVS()->get_tax_attribute( $taxonomy );
185
-
186
- do_action( 'tawcvs_product_attribute_field', $attr->attribute_type, '', 'add' );
187
  }
188
 
189
  /**
@@ -193,24 +260,29 @@ class TA_WC_Variation_Swatches_Admin {
193
  * @param string $taxonomy
194
  */
195
  public function edit_attribute_fields( $term, $taxonomy ) {
196
- $attr = TA_WCVS()->get_tax_attribute( $taxonomy );
197
- $value = get_term_meta( $term->term_id, $attr->attribute_type, true );
198
-
199
- do_action( 'tawcvs_product_attribute_field', $attr->attribute_type, $value, 'edit' );
200
  }
201
 
202
  /**
203
  * Print HTML of custom fields on attribute term screens
204
  *
205
  * @param $type
206
- * @param $value
 
207
  * @param $form
208
  */
209
- public function attribute_fields( $type, $value, $form ) {
210
  // Return if this is a default attribute type
211
  if ( in_array( $type, array( 'select', 'text' ) ) ) {
212
  return;
213
  }
 
 
 
 
 
 
214
 
215
  // Print the open tag of field container
216
  printf(
@@ -218,7 +290,7 @@ class TA_WC_Variation_Swatches_Admin {
218
  'edit' == $form ? 'tr' : 'div',
219
  'edit' == $form ? '<th>' : '',
220
  esc_attr( $type ),
221
- TA_WCVS()->types[$type],
222
  'edit' == $form ? '</th><td>' : ''
223
  );
224
 
@@ -227,24 +299,27 @@ class TA_WC_Variation_Swatches_Admin {
227
  $image = $value ? wp_get_attachment_image_src( $value ) : '';
228
  $image = $image ? $image[0] : WC()->plugin_url() . '/assets/images/placeholder.png';
229
  ?>
230
- <div class="tawcvs-term-image-thumbnail" style="float:left;margin-right:10px;">
231
- <img src="<?php echo esc_url( $image ) ?>" width="60px" height="60px" />
232
- </div>
233
- <div style="line-height:60px;">
234
- <input type="hidden" class="tawcvs-term-image" name="image" value="<?php echo esc_attr( $value ) ?>" />
235
- <button type="button" class="tawcvs-upload-image-button button"><?php esc_html_e( 'Upload/Add image', 'wcvs' ); ?></button>
236
- <button type="button" class="tawcvs-remove-image-button button <?php echo $value ? '' : 'hidden' ?>"><?php esc_html_e( 'Remove image', 'wcvs' ); ?></button>
237
- </div>
 
 
 
238
  <?php
239
  break;
240
 
241
  default:
242
  ?>
243
- <input type="text" id="term-<?php echo esc_attr( $type ) ?>" name="<?php echo esc_attr( $type ) ?>" value="<?php echo esc_attr( $value ) ?>" />
 
244
  <?php
245
  break;
246
  }
247
-
248
  // Print the close tag of field container
249
  echo 'edit' == $form ? '</td></tr>' : '</div>';
250
  }
@@ -257,8 +332,15 @@ class TA_WC_Variation_Swatches_Admin {
257
  */
258
  public function save_term_meta( $term_id, $tt_id ) {
259
  foreach ( TA_WCVS()->types as $type => $label ) {
260
- if ( isset( $_POST[$type] ) ) {
261
- update_term_meta( $term_id, $type, sanitize_text_field( $_POST[$type] ) );
 
 
 
 
 
 
 
262
  }
263
  }
264
  }
@@ -270,7 +352,7 @@ class TA_WC_Variation_Swatches_Admin {
270
  *
271
  * @return array
272
  */
273
- public function add_attribute_columns( $columns ) {
274
  $new_columns = array();
275
  $new_columns['cb'] = $columns['cb'];
276
  $new_columns['thumb'] = '';
@@ -285,6 +367,8 @@ class TA_WC_Variation_Swatches_Admin {
285
  * @param $columns
286
  * @param $column
287
  * @param $term_id
 
 
288
  */
289
  public function add_attribute_column_content( $columns, $column, $term_id ) {
290
  if ( 'thumb' !== $column ) {
@@ -296,7 +380,8 @@ class TA_WC_Variation_Swatches_Admin {
296
 
297
  switch ( $attr->attribute_type ) {
298
  case 'color':
299
- printf( '<div class="swatch-preview swatch-color" style="background-color:%s;"></div>', esc_attr( $value ) );
 
300
  break;
301
 
302
  case 'image':
11
  */
12
  protected static $instance = null;
13
 
14
+ private $generalSettings;
15
+
16
  /**
17
  * Main instance
18
  *
39
  add_action( 'admin_init', array( $this, 'restore_attribute_types' ) );
40
 
41
  // Display attribute fields
42
+ add_action( 'tawcvs_product_attribute_field', array( $this, 'attribute_fields' ), 10, 4 );
43
+
44
+ add_filter( 'woosuite_core_module_settings_url', array(
45
+ $this,
46
+ 'render_the_setting_url_in_core_plugin'
47
+ ), 10, 2 );
48
+
49
+ include_once( dirname( __FILE__ ) . '/class-menu-page.php' );
50
+ new VSWC_Settings_Page();
51
+
52
+ $latest_option = get_option( 'woosuite_variation_swatches_option', array() );
53
+
54
+ $this->generalSettings = isset( $latest_option['general'] ) ? $latest_option['general'] : array();
55
+ }
56
+
57
+ /**
58
+ * Rendering the setting url for this plugin in the dashboard page of Woosuite Core
59
+ *
60
+ * @param $url
61
+ * @param $module
62
+ *
63
+ * @return mixed|string|void
64
+ */
65
+ function render_the_setting_url_in_core_plugin( $url, $module ) {
66
+ if ( $module === WCVS_PLUGIN_NAME ) {
67
+ $url = admin_url( 'admin.php?page=variation-swatches-settings' );
68
+ }
69
+
70
+ return $url;
71
  }
72
 
73
  /**
75
  */
76
  public function includes() {
77
  include_once( dirname( __FILE__ ) . '/class-admin-product.php' );
78
+ include_once( dirname( __FILE__ ) . '/class-menu-page.php' );
79
+ include_once( dirname( __FILE__ ) . '/class-setting-fields-manager.php' );
80
+ include_once( dirname( __FILE__ ) . '/class-setting-fields-renderer.php' );
81
+ new VSWC_Setting_Fields_Renderer();
82
  }
83
 
84
  /**
95
 
96
  foreach ( $attribute_taxonomies as $tax ) {
97
  add_action( 'pa_' . $tax->attribute_name . '_add_form_fields', array( $this, 'add_attribute_fields' ) );
98
+ add_action( 'pa_' . $tax->attribute_name . '_edit_form_fields', array(
99
+ $this,
100
+ 'edit_attribute_fields'
101
+ ), 10, 2 );
102
+
103
+ add_filter( 'manage_edit-pa_' . $tax->attribute_name . '_columns', array(
104
+ $this,
105
+ 'add_attribute_columns'
106
+ ) );
107
+ add_filter( 'manage_pa_' . $tax->attribute_name . '_custom_column', array(
108
+ $this,
109
+ 'add_attribute_column_content'
110
+ ), 10, 3 );
111
  }
112
 
113
  add_action( 'created_term', array( $this, 'save_term_meta' ), 10, 2 );
118
  * Load stylesheet and scripts in edit product attribute screen
119
  */
120
  public function enqueue_scripts() {
121
+ $screen = get_current_screen();
122
+ $dir_name = dirname( __FILE__ );
123
+
124
+ if ( strpos( $screen->id, 'variation-swatches-addons' ) !== false ) {
125
+ wp_enqueue_style( 'tawcvs-admin-addons', plugins_url( '/assets/css/admin-addons-page.css', $dir_name ), array() );
126
+ }
127
+
128
  if ( strpos( $screen->id, 'edit-pa_' ) === false && strpos( $screen->id, 'product' ) === false ) {
129
  return;
130
  }
131
 
132
+ // Don't let the below styles and css affect other woosuite plugin pages
133
+ if ( strpos( $screen->id, 'woosuite_page_' ) !== false ) {
134
+ return;
135
+ }
136
+
137
  wp_enqueue_media();
138
 
139
+ wp_enqueue_style( 'wp-color-picker' );
140
+ wp_enqueue_script( 'wp-color-picker' );
141
+
142
+ wp_enqueue_style( 'tawcvs-admin', plugins_url( '/assets/css/admin.css', $dir_name ), array( 'wp-color-picker' ), WCVS_PLUGIN_VERSION );
143
+ wp_enqueue_script( 'tawcvs-admin', plugins_url( '/assets/js/admin.js', $dir_name ), array(
144
+ 'jquery',
145
+ 'wp-color-picker',
146
+ 'wp-util'
147
+ ), WCVS_PLUGIN_VERSION, true );
148
 
149
  wp_localize_script(
150
  'tawcvs-admin',
157
  'placeholder' => WC()->plugin_url() . '/assets/images/placeholder.png'
158
  )
159
  );
160
+
161
  }
162
 
163
  /**
166
  public function restore_attributes_notice() {
167
  if ( get_transient( 'tawcvs_attribute_taxonomies' ) && ! get_option( 'tawcvs_restore_attributes_time' ) ) {
168
  ?>
169
+ <div class="notice-warning notice is-dismissible">
170
+ <p>
171
  <?php
172
  esc_html_e( 'Found a backup of product attributes types. This backup was generated at', 'wcvs' );
173
  echo ' ' . date( get_option( 'date_format' ) . ' ' . get_option( 'time_format' ), get_option( 'tawcvs_backup_attributes_time' ) ) . '.';
174
  ?>
175
+ </p>
176
+ <p>
177
+ <a href="<?php echo esc_url( add_query_arg( array(
178
+ 'tawcvs_action' => 'restore_attributes_types',
179
+ 'tawcvs_nonce' => wp_create_nonce( 'restore_attributes_types' )
180
+ ) ) ); ?>">
181
+ <strong><?php esc_html_e( 'Restore product attributes types', 'wcvs' ); ?></strong>
182
+ </a>
183
+ |
184
+ <a href="<?php echo esc_url( add_query_arg( array(
185
+ 'tawcvs_action' => 'dismiss_restore_notice',
186
+ 'tawcvs_nonce' => wp_create_nonce( 'dismiss_restore_notice' )
187
+ ) ) ); ?>">
188
+ <strong><?php esc_html_e( 'Dismiss this notice', 'wcvs' ); ?></strong>
189
+ </a>
190
+ </p>
191
+ </div>
192
  <?php
193
  } elseif ( isset( $_GET['tawcvs_message'] ) && 'restored' == $_GET['tawcvs_message'] ) {
194
  ?>
195
+ <div class="notice-warning settings-error notice is-dismissible">
196
+ <p><?php esc_html_e( 'All attributes types have been restored.', 'wcvs' ) ?></p>
197
+ </div>
198
  <?php
199
  }
200
  }
250
  */
251
  public function add_attribute_fields( $taxonomy ) {
252
  $attr = TA_WCVS()->get_tax_attribute( $taxonomy );
253
+ do_action( 'tawcvs_product_attribute_field', $attr->attribute_type, false, $taxonomy, 'add' );
 
254
  }
255
 
256
  /**
260
  * @param string $taxonomy
261
  */
262
  public function edit_attribute_fields( $term, $taxonomy ) {
263
+ $attr = TA_WCVS()->get_tax_attribute( $taxonomy );
264
+ do_action( 'tawcvs_product_attribute_field', $attr->attribute_type, $term, $taxonomy, 'edit' );
 
 
265
  }
266
 
267
  /**
268
  * Print HTML of custom fields on attribute term screens
269
  *
270
  * @param $type
271
+ * @param $term
272
+ * @param $taxonomy
273
  * @param $form
274
  */
275
+ public function attribute_fields( $type, $term, $taxonomy, $form ) {
276
  // Return if this is a default attribute type
277
  if ( in_array( $type, array( 'select', 'text' ) ) ) {
278
  return;
279
  }
280
+ if ( $term instanceof WP_Term ) {
281
+ $term_id = $term->term_id;
282
+ } else {
283
+ $term_id = false;
284
+ }
285
+ $value = get_term_meta( $term_id, $type, true );
286
 
287
  // Print the open tag of field container
288
  printf(
290
  'edit' == $form ? 'tr' : 'div',
291
  'edit' == $form ? '<th>' : '',
292
  esc_attr( $type ),
293
+ TA_WCVS()->types[ $type ],
294
  'edit' == $form ? '</th><td>' : ''
295
  );
296
 
299
  $image = $value ? wp_get_attachment_image_src( $value ) : '';
300
  $image = $image ? $image[0] : WC()->plugin_url() . '/assets/images/placeholder.png';
301
  ?>
302
+ <div class="tawcvs-term-image-thumbnail" style="float:left;margin-right:10px;">
303
+ <img src="<?php echo esc_url( $image ) ?>" width="60px" height="60px"/>
304
+ </div>
305
+ <div style="line-height:60px;">
306
+ <input type="hidden" class="tawcvs-term-image" name="image"
307
+ value="<?php echo esc_attr( $value ) ?>"/>
308
+ <button type="button"
309
+ class="tawcvs-upload-image-button button"><?php esc_html_e( 'Upload/Add image', 'wcvs' ); ?></button>
310
+ <button type="button"
311
+ class="tawcvs-remove-image-button button <?php echo $value ? '' : 'hidden' ?>"><?php esc_html_e( 'Remove image', 'wcvs' ); ?></button>
312
+ </div>
313
  <?php
314
  break;
315
 
316
  default:
317
  ?>
318
+ <input type="text" id="term-<?php echo esc_attr( $type ) ?>" name="<?php echo esc_attr( $type ) ?>"
319
+ value="<?php echo esc_attr( $value ) ?>"/>
320
  <?php
321
  break;
322
  }
 
323
  // Print the close tag of field container
324
  echo 'edit' == $form ? '</td></tr>' : '</div>';
325
  }
332
  */
333
  public function save_term_meta( $term_id, $tt_id ) {
334
  foreach ( TA_WCVS()->types as $type => $label ) {
335
+ if ( isset( $_POST[ $type ] ) ) {
336
+ update_term_meta( $term_id, $type, sanitize_text_field( $_POST[ $type ] ) );
337
+
338
+ //Additional data for color
339
+ if ( 'color' === $type && '1' === $this->generalSettings['enable-dual-color'] ) {
340
+ array_map( function ( $meta_key ) use ( $term_id ) {
341
+ update_term_meta( $term_id, $meta_key, sanitize_text_field( isset( $_POST[ $meta_key ] ) ? $_POST[ $meta_key ] : '' ) );
342
+ }, array( 'is-dual-color', 'secondary-color' ) );
343
+ }
344
  }
345
  }
346
  }
352
  *
353
  * @return array
354
  */
355
+ public function add_attribute_columns( array $columns ) {
356
  $new_columns = array();
357
  $new_columns['cb'] = $columns['cb'];
358
  $new_columns['thumb'] = '';
367
  * @param $columns
368
  * @param $column
369
  * @param $term_id
370
+ *
371
+ * @return mixed|void
372
  */
373
  public function add_attribute_column_content( $columns, $column, $term_id ) {
374
  if ( 'thumb' !== $column ) {
380
 
381
  switch ( $attr->attribute_type ) {
382
  case 'color':
383
+ $formatted_color_style = TA_WC_Variation_Swatches::generate_color_style( $term_id, $value );
384
+ printf( '<div class="swatch-preview swatch-color" style="background:%s;"></div>', esc_attr( $formatted_color_style ) );
385
  break;
386
 
387
  case 'image':
includes/class-frontend.php CHANGED
@@ -11,6 +11,8 @@ class TA_WC_Variation_Swatches_Frontend {
11
  */
12
  protected static $instance = null;
13
 
 
 
14
  /**
15
  * Main instance
16
  *
@@ -30,16 +32,47 @@ class TA_WC_Variation_Swatches_Frontend {
30
  public function __construct() {
31
  add_action( 'wp_enqueue_scripts', array( $this, 'enqueue_scripts' ) );
32
 
33
- add_filter( 'woocommerce_dropdown_variation_attribute_options_html', array( $this, 'get_swatch_html' ), 100, 2 );
 
 
 
34
  add_filter( 'tawcvs_swatch_html', array( $this, 'swatch_html' ), 5, 4 );
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
35
  }
36
 
37
  /**
38
  * Enqueue scripts and stylesheets
39
  */
40
  public function enqueue_scripts() {
41
- wp_enqueue_style( 'tawcvs-frontend', plugins_url( 'assets/css/frontend.css', TAWC_VS_PLUGIN_FILE ), array(), '20200222' );
42
- wp_enqueue_script( 'tawcvs-frontend', plugins_url( 'assets/js/frontend.js', TAWC_VS_PLUGIN_FILE ), array( 'jquery' ), '20200317', true );
 
 
 
 
 
43
  }
44
 
45
  /**
@@ -51,119 +84,300 @@ class TA_WC_Variation_Swatches_Frontend {
51
  * @return string
52
  */
53
  public function get_swatch_html( $html, $args ) {
54
- $swatch_types = TA_WCVS()->types;
55
- $attr = TA_WCVS()->get_tax_attribute( $args['attribute'] );
 
 
56
 
57
  // Return if this is normal attribute
58
- if ( empty( $attr ) ) {
59
  return $html;
60
  }
61
 
62
- if ( ! array_key_exists( $attr->attribute_type, $swatch_types ) ) {
63
- return $html;
 
 
 
 
 
 
 
 
 
 
 
64
  }
65
 
66
- $options = $args['options'];
67
- $product = $args['product'];
68
- $attribute = $args['attribute'];
69
- $class = "variation-selector variation-select-{$attr->attribute_type}";
70
- $swatches = '';
71
 
72
- // Add new option for tooltip to $args variable.
73
- $args['tooltip'] = wc_string_to_bool( get_option( 'tawcvs_enable_tooltip', 'yes' ) );
 
74
 
75
- if ( empty( $options ) && ! empty( $product ) && ! empty( $attribute ) ) {
76
- $attributes = $product->get_variation_attributes();
77
- $options = $attributes[$attribute];
 
 
 
 
 
 
 
 
 
 
 
 
 
78
  }
79
 
80
- if ( array_key_exists( $attr->attribute_type, $swatch_types ) ) {
81
- if ( ! empty( $options ) && $product && taxonomy_exists( $attribute ) ) {
82
- // Get terms if this is a taxonomy - ordered. We need the names too.
83
- $terms = wc_get_product_terms( $product->get_id(), $attribute, array( 'fields' => 'all' ) );
 
84
 
85
- foreach ( $terms as $term ) {
86
- if ( in_array( $term->slug, $options ) ) {
87
- $swatches .= apply_filters( 'tawcvs_swatch_html', '', $term, $attr->attribute_type, $args );
88
- }
 
 
 
 
89
  }
 
90
  }
91
-
92
- if ( ! empty( $swatches ) ) {
93
- $class .= ' hidden';
94
- $swatches = '<div class="tawcvs-swatches" data-attribute_name="attribute_' . esc_attr( $attribute ) . '">' . $swatches . '</div>';
95
- $html = '<div class="' . esc_attr( $class ) . '">' . $html . '</div>' . $swatches;
 
96
  }
97
  }
98
 
 
 
 
 
 
 
99
  return $html;
100
  }
101
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
102
  /**
103
  * Print HTML of a single swatch
104
  *
105
  * @param $html
106
- * @param $term
107
  * @param $type
108
  * @param $args
109
  *
110
  * @return string
111
  */
112
- public function swatch_html( $html, $term, $type, $args ) {
113
- $selected = sanitize_title( $args['selected'] ) == $term->slug ? 'selected' : '';
114
- $name = esc_html( apply_filters( 'woocommerce_variation_option_name', $term->name ) );
115
- $tooltip = '';
 
 
 
 
 
 
116
 
117
- if ( ! empty( $args['tooltip'] ) ) {
118
- $tooltip = '<span class="swatch__tooltip">' . ( $term->description ? $term->description : $name ) . '</span>';
119
- }
120
 
121
  switch ( $type ) {
122
  case 'color':
123
- $color = get_term_meta( $term->term_id, 'color', true );
124
- list( $r, $g, $b ) = sscanf( $color, "#%02x%02x%02x" );
 
125
  $html = sprintf(
126
- '<span class="swatch swatch-color swatch-%s %s" style="background-color:%s;color:%s;" data-value="%s">%s%s</span>',
127
- esc_attr( $term->slug ),
128
  $selected,
129
- esc_attr( $color ),
130
  "rgba($r,$g,$b,0.5)",
131
- esc_attr( $term->slug ),
132
- $name,
133
  $tooltip
134
  );
135
  break;
136
 
137
  case 'image':
138
- $image = get_term_meta( $term->term_id, 'image', true );
139
- $image = $image ? wp_get_attachment_image_src( $image ) : '';
140
- $image = $image ? $image[0] : WC()->plugin_url() . '/assets/images/placeholder.png';
141
- $html = sprintf(
142
- '<span class="swatch swatch-image swatch-%s %s" data-value="%s"><img src="%s" alt="%s">%s%s</span>',
143
- esc_attr( $term->slug ),
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
144
  $selected,
145
- esc_attr( $term->slug ),
146
- esc_url( $image ),
147
  esc_attr( $name ),
148
- $name,
149
  $tooltip
150
  );
151
  break;
152
-
153
  case 'label':
154
- $label = get_term_meta( $term->term_id, 'label', true );
155
- $label = $label ? $label : $name;
156
  $html = sprintf(
157
- '<span class="swatch swatch-label swatch-%s %s" data-value="%s">%s%s</span>',
158
- esc_attr( $term->slug ),
159
  $selected,
160
- esc_attr( $term->slug ),
161
  esc_html( $label ),
162
  $tooltip
163
  );
164
  break;
165
  }
166
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
167
  return $html;
168
  }
169
- }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
11
  */
12
  protected static $instance = null;
13
 
14
+ private $generalSettings, $archiveSettings, $productDesign, $shopDesign, $toolTipDesign;
15
+
16
  /**
17
  * Main instance
18
  *
32
  public function __construct() {
33
  add_action( 'wp_enqueue_scripts', array( $this, 'enqueue_scripts' ) );
34
 
35
+ add_filter( 'woocommerce_dropdown_variation_attribute_options_html', array(
36
+ $this,
37
+ 'get_swatch_html'
38
+ ), 100, 2 );
39
  add_filter( 'tawcvs_swatch_html', array( $this, 'swatch_html' ), 5, 4 );
40
+
41
+ $latest_option = get_option( 'woosuite_variation_swatches_option' );
42
+
43
+ $this->generalSettings = isset( $latest_option['general'] ) ? $latest_option['general'] : array();
44
+ $this->archiveSettings = isset( $latest_option['archive'] ) ? $latest_option['archive'] : array();
45
+ $this->productDesign = isset( $latest_option['design']['productDesign'] ) ? $latest_option['design']['productDesign'] : array();
46
+ $this->shopDesign = isset( $latest_option['design']['shopDesign'] ) ? $latest_option['design']['shopDesign'] : array();
47
+ $this->toolTipDesign = isset( $latest_option['design']['toolTipDesign'] ) ? $latest_option['design']['toolTipDesign'] : array();
48
+
49
+ if ( ! $this->archiveSettings['show-clear-link'] ) {
50
+ add_filter( 'woocommerce_reset_variations_link', array(
51
+ $this,
52
+ 'tawcvs_show_clear_link_on_variations_on_shop_page'
53
+ ) );
54
+ }
55
+
56
+ if ( $this->archiveSettings['show-swatch'] && ! defined( 'WOOSUITE_VARIATION_SWATCHES_PRO_VERSION' ) ) {
57
+ add_filter( 'woocommerce_loop_add_to_cart_link', array(
58
+ $this,
59
+ 'display_variations_on_shop_page_before_add_to_cart_btn'
60
+ ), 10, 3 );
61
+ }
62
+ add_action( 'wp_head', array( $this, 'apply_custom_design_styles' ) );
63
  }
64
 
65
  /**
66
  * Enqueue scripts and stylesheets
67
  */
68
  public function enqueue_scripts() {
69
+ if ( ! $this->generalSettings['disable-plugin-stylesheet'] ) {
70
+ wp_enqueue_style( 'tawcvs-frontend', plugins_url( 'assets/css/frontend.css', TAWC_VS_PLUGIN_FILE ), array(), WCVS_PLUGIN_VERSION );
71
+ }
72
+ if ( is_shop() || is_product_category() || is_product_tag() ) {
73
+ wp_enqueue_style( 'tawcvs-frontend-for-listing-pages', plugins_url( 'assets/css/frontend-list-products.css', TAWC_VS_PLUGIN_FILE ) );
74
+ }
75
+ wp_enqueue_script( 'tawcvs-frontend', plugins_url( 'assets/js/frontend.js', TAWC_VS_PLUGIN_FILE ), array( 'jquery' ), WCVS_PLUGIN_VERSION, true );
76
  }
77
 
78
  /**
84
  * @return string
85
  */
86
  public function get_swatch_html( $html, $args ) {
87
+ global $woocommerce_loop;
88
+
89
+ $supported_swatch_types = TA_WCVS()->types;
90
+ $attr = TA_WCVS()->get_tax_attribute( $args['attribute'] );
91
 
92
  // Return if this is normal attribute
93
+ if ( empty( $attr ) || ! $args['product'] instanceof WC_Product_Variable ) {
94
  return $html;
95
  }
96
 
97
+ $options = $args['options'];
98
+ $product = $args['product'];
99
+ $attribute_tax_name = $args['attribute'];
100
+ $class = "variation-selector variation-select-{$attr->attribute_type}";
101
+ $swatches = '';
102
+ $is_product_page = is_product();
103
+ $defined_limit = apply_filters( 'tawcvs_swatch_limit_number', 0 );
104
+ $out_of_stock_state = apply_filters( 'tawcvs_out_of_stock_state', '' );
105
+
106
+
107
+ if ( empty( $options ) && ! empty( $product ) && ! empty( $attribute_tax_name ) ) {
108
+ $attributes = $product->get_variation_attributes();
109
+ $options = $attributes[ $attribute_tax_name ];
110
  }
111
 
112
+ $dropdown_to_label_setting = isset( $this->generalSettings['dropdown-to-label'] ) ? $this->generalSettings['dropdown-to-label'] : false;
 
 
 
 
113
 
114
+ // If the type isn't supported, and we turned on the setting to convert dropdown to label/image
115
+ // then we forced that type to the corresponding type
116
+ if ( ! array_key_exists( $attr->attribute_type, $supported_swatch_types ) ) {
117
 
118
+ if ( $dropdown_to_label_setting
119
+ && $this->generalSettings[ 'dropdown-to-label-attribute-' . $attr->attribute_name ] ) {
120
+
121
+ $attr->attribute_type = 'label';
122
+
123
+ } else {
124
+
125
+ $attr->attribute_type = '';
126
+
127
+ }
128
+
129
+ }
130
+ $attr->attribute_type = apply_filters( 'tawcvs_attribute_type', $attr->attribute_type, $attr, $supported_swatch_types );
131
+
132
+ if ( empty( $attr->attribute_type ) ) {
133
+ return $html;
134
  }
135
 
136
+ // Add new option for tooltip to $args variable.
137
+ $args['tooltip'] = apply_filters( 'tawcvs_tooltip_enabled', $this->is_tooltip_enabled() );
138
+ //Get the product variation detail for each attribute
139
+ //If there are more than one attributes, the first one will be applied
140
+ $collected_variations = TA_WC_Variation_Swatches::get_detailed_product_variations( $product, $attribute_tax_name );
141
 
142
+ if ( ! empty( $options ) && taxonomy_exists( $attribute_tax_name ) ) {
143
+ // Get terms if this is a taxonomy - ordered. We need the names too.
144
+ $terms = $this->get_product_variation_term( $product, $defined_limit, $attribute_tax_name, $options );
145
+ foreach ( $terms as $term ) {
146
+ $variation_attribute = array( 'attribute_item_obj' => $term );
147
+ //Check if we have the product variable for this attribute
148
+ if ( isset( $collected_variations[ $term->slug ] ) ) {
149
+ $variation_attribute['variation_product'] = $collected_variations[ $term->slug ];
150
  }
151
+ $swatches .= apply_filters( 'tawcvs_swatch_html', '', $variation_attribute, $attr->attribute_type, $args );
152
  }
153
+ //If we are on shop/archived page (not product page), we will check the defined limit number of variations
154
+ //the product still have more variations -> show the view more icon
155
+ if ( ( ! $is_product_page || $woocommerce_loop['name'] == 'related' )
156
+ && 0 < $defined_limit
157
+ && count( $options ) > $defined_limit ) {
158
+ $swatches .= apply_filters( 'tawcvs_swatch_show_more_html', '', $product );
159
  }
160
  }
161
 
162
+ if ( ! empty( $swatches ) ) {
163
+ $class .= ' hidden';
164
+ $swatches = '<div class="tawcvs-swatches oss-' . $out_of_stock_state . '" data-attribute_name="attribute_' . esc_attr( $attribute_tax_name ) . '">' . $swatches . '</div>';
165
+ $html = '<div class="' . esc_attr( $class ) . '">' . $html . '</div>' . $swatches;
166
+ }
167
+
168
  return $html;
169
  }
170
 
171
+ /**
172
+ * @param $product
173
+ * @param $defined_limit
174
+ * @param $attribute_tax_name
175
+ * @param $options
176
+ *
177
+ * @return array
178
+ */
179
+ public function get_product_variation_term( $product, $defined_limit, $attribute_tax_name, $options ) {
180
+ global $woocommerce_loop;
181
+
182
+ $terms = wc_get_product_terms( $product->get_id(), $attribute_tax_name, array( 'fields' => 'all', ) );
183
+ $terms = array_filter( $terms, function ( $term ) use ( $options ) {
184
+ return in_array( $term->slug, $options, true );
185
+ } );
186
+ if ( $defined_limit > 0 && ( ! is_product() || $woocommerce_loop['name'] == 'related' ) ) {
187
+ $terms = array_slice( $terms, 0, $defined_limit );
188
+ }
189
+
190
+ return $terms;
191
+ }
192
+
193
  /**
194
  * Print HTML of a single swatch
195
  *
196
  * @param $html
197
+ * @param $variation_attribute
198
  * @param $type
199
  * @param $args
200
  *
201
  * @return string
202
  */
203
+ public function swatch_html( $html, $variation_attribute, $type, $args ) {
204
+ $attribute_item_obj = $variation_attribute['attribute_item_obj'];
205
+
206
+ $selected = sanitize_title( $args['selected'] ) == $attribute_item_obj->slug ? 'selected' : '';
207
+ $name = esc_html( apply_filters( 'woocommerce_variation_option_name', $attribute_item_obj->name ) );
208
+
209
+ $tooltip = $this->get_tooltip_html( '', $attribute_item_obj, $name, $args );
210
+ $tooltip = apply_filters( 'tawcvs_tooltip_html', $tooltip, $attribute_item_obj, $name, $args );
211
+
212
+ $swatchShape = isset( $this->generalSettings['swatch-shape'] ) ? $this->generalSettings['swatch-shape'] : 'rounded';
213
 
 
 
 
214
 
215
  switch ( $type ) {
216
  case 'color':
217
+ $main_color = get_term_meta( $attribute_item_obj->term_id, 'color', true );
218
+ $formatted_color_style = TA_WC_Variation_Swatches::generate_color_style( $attribute_item_obj->term_id, $main_color );
219
+ list( $r, $g, $b ) = sscanf( $main_color, "#%02x%02x%02x" );
220
  $html = sprintf(
221
+ '<div class="swatch-item-wrapper"><div class="swatch swatch-shape-' . $swatchShape . ' swatch-color swatch-%s %s" style="background:%s;color:%s;" data-value="%s"></div>%s</div>',
222
+ esc_attr( $attribute_item_obj->slug ),
223
  $selected,
224
+ esc_attr( $formatted_color_style ),
225
  "rgba($r,$g,$b,0.5)",
226
+ esc_attr( $attribute_item_obj->slug ),
 
227
  $tooltip
228
  );
229
  break;
230
 
231
  case 'image':
232
+ $thumb_id = 0;
233
+ //First, we check the variation product already had its thumbnail or not
234
+ if ( isset( $variation_attribute['variation_product'] ) ) {
235
+ $variation_product_id = $variation_attribute['variation_product']['variation_id'];
236
+ $thumb_id = get_post_meta( $variation_product_id, '_thumbnail_id', true );
237
+ }
238
+
239
+ if ( ! empty( $thumb_id ) ) {
240
+ $image_url = wp_get_attachment_image_url( $thumb_id );
241
+ } else {
242
+ //unless we will get the default thumbnail of attribute variation
243
+ $attach_id = get_term_meta( $attribute_item_obj->term_id, 'image', true );
244
+ $image_url = wp_get_attachment_image_url( $attach_id );
245
+ }
246
+
247
+ //If we also do not have default thumbnail, we will use the placeholder image of WC
248
+ $image_url = $image_url ?: WC()->plugin_url() . '/assets/images/placeholder.png';
249
+
250
+ $html = sprintf(
251
+ '<div class="swatch-item-wrapper"><div class="swatch swatch-shape-' . $swatchShape . ' swatch-image swatch-%s %s" data-value="%s"><img src="%s" alt="%s"></div>%s</div>',
252
+ esc_attr( $attribute_item_obj->slug ),
253
  $selected,
254
+ esc_attr( $attribute_item_obj->slug ),
255
+ esc_url( $image_url ),
256
  esc_attr( $name ),
 
257
  $tooltip
258
  );
259
  break;
 
260
  case 'label':
261
+ $label = get_term_meta( $attribute_item_obj->term_id, 'label', true );
262
+ $label = $label ?: $name;
263
  $html = sprintf(
264
+ '<div class="swatch-item-wrapper"><div class="swatch swatch-shape-' . $swatchShape . ' swatch-label swatch-%s %s" data-value="%s"><span class="text">%s</span></div>%s</div>',
265
+ esc_attr( $attribute_item_obj->slug ),
266
  $selected,
267
+ esc_attr( $attribute_item_obj->slug ),
268
  esc_html( $label ),
269
  $tooltip
270
  );
271
  break;
272
  }
273
 
274
+ return apply_filters( 'tawcvs_swatch_item_html', $html, $attribute_item_obj, $type, $selected, $name, $tooltip, $swatchShape );
275
+ }
276
+
277
+
278
+ public function tawcvs_show_clear_link_on_variations_on_shop_page( $content ) {
279
+ if ( ! is_product() ) {
280
+ return;
281
+ }
282
+
283
+ return $content;
284
+ }
285
+
286
+ /**
287
+ * Showing the variation section before the Add to cart button
288
+ *
289
+ * @param $html
290
+ * @param $product
291
+ * @param $args
292
+ *
293
+ * @return mixed|void
294
+ */
295
+ public function display_variations_on_shop_page_before_add_to_cart_btn( $html, $product, $args ) {
296
+ global $product;
297
+
298
+ if ( $product instanceof WC_Product_Variable ) {
299
+
300
+ //Removing the Show option button
301
+ remove_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart' );
302
+
303
+ //Rendering
304
+ $alignment = isset( $this->archiveSettings['swatch-alignment'] ) ? $this->archiveSettings['swatch-alignment'] : 'left';
305
+ echo '<div class="swatch-align-' . $alignment . '">';
306
+ do_action( 'woocommerce_variable_add_to_cart' );
307
+ echo '</div>';
308
+ } else {
309
+ return $html;
310
+ }
311
+
312
+ }
313
+
314
+ /**
315
+ * Return the boolean to check if tooltip is enabled in Archive/Shop/Product pages
316
+ *
317
+ * @return bool
318
+ */
319
+ public function is_tooltip_enabled() {
320
+ if ( ! is_product() ) {
321
+ return false;
322
+ }
323
+
324
+ return wc_string_to_bool( isset( $this->generalSettings['enable-tooltip'] ) ? $this->generalSettings['enable-tooltip'] : 0 );
325
+ }
326
+
327
+ /**
328
+ * Render the tooltip html if it is enabled
329
+ *
330
+ * @param $html
331
+ * @param $attribute_item_obj
332
+ * @param $name
333
+ * @param $args
334
+ *
335
+ * @return mixed|string
336
+ */
337
+ public function get_tooltip_html( $html, $attribute_item_obj, $name, $args ) {
338
+ if ( ! empty( $args['tooltip'] ) ) {
339
+ $html = '<span class="swatch__tooltip">' . ( $attribute_item_obj->description ?: $name ) . '</span>';
340
+ }
341
+
342
  return $html;
343
  }
344
+
345
+
346
+ public function apply_custom_design_styles() {
347
+ $page = is_product() ? 'productDesign' : 'shopDesign';
348
+ ?>
349
+ <style>
350
+ .tawcvs-swatches {
351
+ margin-top: <?php echo isset($this->{$page}['wrm-top']) ? $this->{$page}['wrm-top'] : '0'; echo isset($this->{$page}['wrm-type']) ? $this->{$page}['wrm-type'] : 'px' ?>;
352
+ margin-right: <?php echo isset($this->{$page}['wrm-right']) ? $this->{$page}['wrm-right'] : '15'; echo isset($this->{$page}['wrm-type']) ? $this->{$page}['wrm-type'] : 'px' ?>;
353
+ margin-bottom: <?php echo isset($this->{$page}['wrm-bottom']) ? $this->{$page}['wrm-bottom'] : '15'; echo isset($this->{$page}['wrm-type']) ? $this->{$page}['wrm-type'] : 'px' ?>;
354
+ margin-left: <?php echo isset($this->{$page}['wrm-left']) ? $this->{$page}['wrm-left'] : '0'; echo isset($this->{$page}['wrm-type']) ? $this->{$page}['wrm-type'] : 'px' ?>;
355
+ padding-top: <?php echo isset($this->{$page}['wrp-top']) ? $this->{$page}['wrp-top'] : '0'; echo isset($this->{$page}['wrp-type']) ? $this->{$page}['wrp-type'] : 'px' ?>;
356
+ padding-right: <?php echo isset($this->{$page}['wrp-right']) ? $this->{$page}['wrp-right'] : '15'; echo isset($this->{$page}['wrp-type']) ? $this->{$page}['wrp-type'] : 'px' ?>;
357
+ padding-bottom: <?php echo isset($this->{$page}['wrp-bottom']) ? $this->{$page}['wrp-bottom'] : '15'; echo isset($this->{$page}['wrp-type']) ? $this->{$page}['wrp-type'] : 'px' ?>;
358
+ padding-left: <?php echo isset($this->{$page}['wrp-left']) ? $this->{$page}['wrp-left'] : '0'; echo isset($this->{$page}['wrp-type']) ? $this->{$page}['wrp-type'] : 'px' ?>;
359
+ }
360
+
361
+ .tawcvs-swatches .swatch {
362
+ <?php if($this->{$page}['item-font']):?> font-size: <?php echo isset($this->{$page}['text-font-size']) ? $this->{$page}['text-font-size'] : '12'; echo isset($this->{$page}['item-font-size-type']) ? $this->{$page}['item-font-size-type'] : 'px'; ?>;
363
+ <?php endif;?> margin-top: <?php echo isset($this->{$page}['mar-top']) ? $this->{$page}['mar-top'] : '0'; echo isset($this->{$page}['mar-type']) ? $this->{$page}['mar-type'] : 'px' ?> !important;
364
+ margin-right: <?php echo isset($this->{$page}['mar-right']) ? $this->{$page}['mar-right'] : '15'; echo isset($this->{$page}['mar-type']) ? $this->{$page}['mar-type'] : 'px' ?> !important;
365
+ margin-bottom: <?php echo isset($this->{$page}['mar-bottom']) ? $this->{$page}['mar-bottom'] : '15'; echo isset($this->{$page}['mar-type']) ? $this->{$page}['mar-type'] : 'px' ?> !important;
366
+ margin-left: <?php echo isset($this->{$page}['mar-left']) ? $this->{$page}['mar-left'] : '0'; echo isset($this->{$page}['mar-type']) ? $this->{$page}['mar-type'] : 'px' ?> !important;
367
+ padding-top: <?php echo isset($this->{$page}['pad-top']) ? $this->{$page}['pad-top'] : '0'; echo isset($this->{$page}['pad-type']) ? $this->{$page}['pad-type'] : 'px' ?> !important;
368
+ padding-right: <?php echo isset($this->{$page}['pad-right']) ? $this->{$page}['pad-right'] : '15'; echo isset($this->{$page}['pad-type']) ? $this->{$page}['pad-type'] : 'px' ?> !important;
369
+ padding-bottom: <?php echo isset($this->{$page}['pad-bottom']) ? $this->{$page}['pad-bottom'] : '15'; echo isset($this->{$page}['pad-type']) ? $this->{$page}['pad-type'] : 'px' ?> !important;
370
+ padding-left: <?php echo isset($this->{$page}['pad-left']) ? $this->{$page}['pad-left'] : '0'; echo isset($this->{$page}['pad-type']) ? $this->{$page}['pad-type'] : 'px' ?> !important;
371
+ }
372
+
373
+ /*tooltip*/
374
+ .tawcvs-swatches .swatch .swatch__tooltip {
375
+ <?php if($this->toolTipDesign['item-font']):?> font-size: <?php echo isset($this->toolTipDesign['text-font-size']) ? $this->toolTipDesign['text-font-size'] : '14'; echo isset($this->toolTipDesign['item-font-size-type']) ? $this->toolTipDesign['item-font-size-type'] : 'px'; ?>;
376
+ <?php endif;?> width: <?php echo $this->toolTipDesign['width'] ? $this->toolTipDesign['width'] . 'px' : 'auto' ?>;
377
+ max-width: <?php echo $this->toolTipDesign['max-width'] ? $this->toolTipDesign['max-width'] .'px' : '100%' ?>;
378
+ line-height: <?php echo $this->toolTipDesign['line-height'] ?: 'unset'; ?>;
379
+ }
380
+ </style>
381
+ <?php
382
+ }
383
+ }
includes/class-menu-page.php ADDED
@@ -0,0 +1,128 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <?php
2
+
3
+
4
+ class VSWC_Settings_Page {
5
+ private $option_name = 'woosuite_variation_swatches_option';
6
+ /**
7
+ * @var VSWC_Upgrader
8
+ */
9
+ private $upgrader_obj;
10
+
11
+ public function __construct() {
12
+ $this->upgrader_obj = new VSWC_Upgrader();
13
+
14
+ add_action( 'admin_menu', array( $this, 'handle_save_actions' ),5);
15
+ add_action( 'admin_menu', array( $this, 'admin_menu' ) );
16
+
17
+ add_action( 'admin_enqueue_scripts', array( $this, 'admin_scripts' ) );
18
+ add_action( 'wp_ajax_tawcvs_save_settings', array( $this, 'tawcvs_save_settings' ) );
19
+ }
20
+
21
+ public function admin_scripts() {
22
+ if ( TA_WC_Variation_Swatches::is_in_plugin_settings_page() ) {
23
+
24
+ do_action( 'woosuite_core_admin_page_scripts' );
25
+
26
+ wp_enqueue_style( 'wp-color-picker' );
27
+ wp_enqueue_script( 'wp-color-picker' );
28
+
29
+ wp_enqueue_script( 'tawcvs-admin', plugins_url( '/assets/js/admin.js', dirname( __FILE__ ) ), array( 'jquery' ), WCVS_PLUGIN_VERSION, true );
30
+ wp_enqueue_style( 'tawcvs-admin', plugins_url( '/assets/css/admin.css', dirname( __FILE__ ) ), array( 'wp-color-picker' ), WCVS_PLUGIN_VERSION );
31
+ }
32
+ }
33
+
34
+ public function admin_menu() {
35
+ if ( TA_WC_Variation_Swatches::is_woo_core_active() ) {
36
+ add_submenu_page(
37
+ 'woosuite-core',
38
+ __( 'Variation Swatches', 'wcvs' ),
39
+ __( 'Variation Swatches', 'wcvs' ),
40
+ 'manage_options',
41
+ 'variation-swatches-settings',
42
+ array( $this, 'render' )
43
+ );
44
+ } else {
45
+ add_menu_page(
46
+ __( 'Variation Swatches', 'wcvs' ),
47
+ __( 'Variation Swatches', 'wcvs' ),
48
+ 'manage_options',
49
+ 'variation-swatches-settings',
50
+ array( $this, 'render' ),
51
+ 'dashicons-ellipsis',
52
+ 12 );
53
+
54
+ add_submenu_page(
55
+ 'variation-swatches-settings',
56
+ __( 'Settings', 'wcvs' ),
57
+ __( 'Settings', 'wcvs' ),
58
+ 'manage_options',
59
+ 'variation-swatches-settings',
60
+ array( $this, 'render' )
61
+ );
62
+ add_submenu_page(
63
+ 'variation-swatches-settings',
64
+ __( 'Woosuite Addons', 'wcvs' ),
65
+ __( 'Addons', 'wcvs' ),
66
+ 'manage_options',
67
+ 'variation-swatches-addons',
68
+ array( $this, 'render_addons' )
69
+ );
70
+ }
71
+
72
+ }
73
+
74
+ public function render() {
75
+ TA_WC_Variation_Swatches::get_template( 'admin/setting-panel.php' );
76
+ TA_WC_Variation_Swatches::get_template( 'admin/pro-feature-popup.php' );
77
+ if ( $this->upgrader_obj->is_welcome_popup_should_be_shown() ) {
78
+ TA_WC_Variation_Swatches::get_template( 'admin/welcome-popup-version-2_0_0.php' );
79
+ }
80
+ }
81
+
82
+ public function render_addons() {
83
+ TA_WC_Variation_Swatches::get_template( 'admin/addons-pages.php' );
84
+ }
85
+
86
+ public function tawcvs_save_settings() {
87
+ unset( $_POST['action'] );
88
+ $this->save_post_data_to_db();
89
+ wp_send_json_success( [ 'msg' => 'saved' ], 200 );
90
+ }
91
+
92
+ /**
93
+ * Save form in case the core plugin is activated
94
+ *
95
+ * @return void
96
+ */
97
+ public function handle_save_actions() {
98
+ if ( isset( $_POST['woosuite_saving_variation_settings'] ) ) {
99
+ unset( $_POST['woosuite_saving_variation_settings'] );
100
+ $this->save_post_data_to_db();
101
+ $_POST['woosuite_saved_variation_settings'] = true;
102
+ }
103
+ }
104
+
105
+ /**
106
+ * Helper function to save _POST data to db
107
+ */
108
+ private function save_post_data_to_db() {
109
+ update_option( $this->option_name, $this->sanitize_post_data( $_POST ) );
110
+ }
111
+
112
+ private function sanitize_post_data( $post_data ) {
113
+ foreach ( $post_data as $section_id => $items ) {
114
+ foreach ( $items as $field_name => $field_value ) {
115
+ if ( is_array( $field_value ) ) {
116
+ $post_data[ $section_id ] = $this->sanitize_post_data( $items );
117
+ } else {
118
+ $post_data[ $section_id ][ $field_name ] = sanitize_text_field( $field_value );
119
+ }
120
+ }
121
+ }
122
+
123
+ return $post_data;
124
+ }
125
+ }
126
+
127
+
128
+ ?>
includes/class-setting-fields-manager.php ADDED
@@ -0,0 +1,1078 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <?php
2
+ if ( ! class_exists( 'VSWC_Setting_Fields_Manager' ) ) {
3
+ class VSWC_Setting_Fields_Manager {
4
+
5
+
6
+ /**
7
+ * Get the array of settings sections
8
+ *
9
+ * @return mixed|void
10
+ */
11
+ public static function get_settings_sections() {
12
+ $sections = array(
13
+ array(
14
+ 'id' => 'general',
15
+ 'title' => __( 'General Settings', 'wcvs' ),
16
+ 'icon' => 'dashicons-admin-settings'
17
+ ),
18
+ array(
19
+ 'id' => 'design',
20
+ 'title' => __( 'Design', 'wcvs' ),
21
+ 'icon' => 'dashicons-art',
22
+ 'has_tab' => true
23
+ ),
24
+ array(
25
+ 'id' => 'archive',
26
+ 'title' => __( 'Archive / Shop', 'wcvs' ),
27
+ 'icon' => 'dashicons-store'
28
+ )
29
+ );
30
+
31
+ return apply_filters( 'wcvs_settings_sections', $sections );
32
+ }
33
+
34
+ /**
35
+ * Get the array of settings sections
36
+ *
37
+ * @return mixed|void
38
+ */
39
+ public static function get_settings_tabs() {
40
+
41
+ $tabs = array(
42
+ 'design' => array(
43
+ array(
44
+ 'id' => 'productDesign',
45
+ 'title' => __( 'Product page', 'wcvs' )
46
+ ),
47
+ array(
48
+ 'id' => 'shopDesign',
49
+ 'title' => __( 'Shop Archive', 'wcvs' )
50
+ ),
51
+ array(
52
+ 'id' => 'toolTipDesign',
53
+ 'title' => __( 'Tooltip', 'wcvs' )
54
+ ),
55
+ )
56
+ );
57
+
58
+ return apply_filters( 'wcvs_settings_tabs', $tabs );
59
+ }
60
+
61
+ /**
62
+ * Get the array of settings fields
63
+ *
64
+ * @return mixed|void
65
+ */
66
+ public static function get_settings_fields() {
67
+
68
+ $settings_fields = array(
69
+ 'general' => array(
70
+ array(
71
+ 'title' => __( 'Auto Convert Dropdowns To Label', 'wcvs' ),
72
+ 'fields' => array(
73
+ array(
74
+ 'id' => 'wcvs-dropdown-to-label',
75
+ 'type' => 'checkbox',
76
+ 'name' => 'dropdown-to-label',
77
+ )
78
+ ),
79
+ 'desc' => __( 'Automatically covert dropdowns to &#34;Label Swatch&#34; by default', 'wcvs' ),
80
+ 'priority' => 1
81
+ ),
82
+ array(
83
+ 'title' => __( 'Select Attributes', 'wcvs' ),
84
+ 'fields' => array(
85
+ array(
86
+ 'id' => 'wcvs-selectbox-to-label',
87
+ 'type' => 'html',
88
+ 'html' => TA_WC_Variation_Swatches::get_product_attributes_as_checkbox( 'general', '','dropdown-to-label-attribute' )
89
+ )
90
+ ),
91
+ 'class' => 'indent',
92
+ 'field_to_check' => 'wcvs-dropdown-to-label',
93
+ 'show_if_checked' => true,
94
+ 'priority' => 2
95
+ ),
96
+ array(
97
+ 'title' => __( 'Auto Convert Dropdowns To Image', 'wcvs' ),
98
+ 'fields' => array(
99
+ array(
100
+ 'id' => 'wcvs-dropdown-to-image',
101
+ 'type' => 'checkbox',
102
+ 'name' => 'dropdown-to-image',
103
+ )
104
+ ),
105
+ 'is_pro_feature' => true,
106
+ 'desc' => __( 'Automatically covert dropdowns to &#34;Image Swatch&#34; if variation has an image.', 'wcvs' ),
107
+ 'priority' => 3
108
+ ),
109
+ array(
110
+ 'title' => __( 'Choose your swatch shape', 'wcvs' ),
111
+ 'fields' => array(
112
+ array(
113
+ 'type' => 'radio',
114
+ 'name' => 'swatch-shape',
115
+ 'options_group' => array(
116
+ array(
117
+ 'value' => 'edge',
118
+ 'label' => __( 'S', 'wcvs' ),
119
+ ),
120
+ array(
121
+ 'value' => 'rounded',
122
+ 'label' => __( 'S', 'wcvs' ),
123
+ ),
124
+ array(
125
+ 'value' => 'circle',
126
+ 'label' => __( 'S', 'wcvs' ),
127
+ )
128
+ ),
129
+ 'default_value' => 'edge',
130
+ 'custom_item_class' => 'swatch-shape-radio',
131
+ )
132
+ ),
133
+ 'class' => 'swatch-shape-wrapper',
134
+ 'desc' => __( 'Select option below', 'wcvs' ),
135
+ 'priority' => 5
136
+ ),
137
+ array(
138
+ 'title' => __( 'Disable Default Plugin Stylesheet', 'wcvs' ),
139
+ 'fields' => array(
140
+ array(
141
+ 'id' => 'wcvs-disable-plugin-stylesheet',
142
+ 'type' => 'checkbox',
143
+ 'name' => 'disable-plugin-stylesheet',
144
+ )
145
+ ),
146
+ 'desc' => __( 'Option to enable/disable default plugin stylesheet for theme developer', 'wcvs' ),
147
+ 'priority' => 6
148
+ ),
149
+ array(
150
+ 'title' => __( 'Tooltip', 'wcvs' ),
151
+ 'fields' => array(
152
+ array(
153
+ 'id' => 'wcvs-enable-tooltip',
154
+ 'type' => 'checkbox',
155
+ 'name' => 'enable-tooltip',
156
+ )
157
+ ),
158
+ 'desc' => __( 'Enable or disable tooltip', 'wcvs' ),
159
+ 'priority' => 7
160
+ ),
161
+ array(
162
+ 'title' => __( 'Enable Dual Color', 'wcvs' ),
163
+ 'fields' => array(
164
+ array(
165
+ 'id' => 'wcvs-enable-dual-color',
166
+ 'type' => 'checkbox',
167
+ 'name' => 'enable-dual-color',
168
+ )
169
+ ),
170
+ 'is_pro_feature' => true,
171
+ 'desc' => __( 'Enable or disable when the attribute type is set to color', 'wcvs' ),
172
+ 'priority' => 8
173
+ ),
174
+ array(
175
+ 'title' => __( 'Out of Stock Behaviour', 'wcvs' ),
176
+ 'fields' => array(
177
+ array(
178
+ 'id' => 'wcvs-enable-dual-color',
179
+ 'type' => 'select',
180
+ 'options_group' => array(
181
+ array(
182
+ 'value' => 'blur-with-cross',
183
+ 'label' => __( 'Blur With Cross', 'wcvs' ),
184
+ )
185
+ ),
186
+ 'class' => 'br-type',
187
+ 'name' => 'oos',
188
+ )
189
+ ),
190
+ 'is_pro_feature' => true,
191
+ 'desc' => __( 'Select option', 'wcvs' ),
192
+ 'priority' => 8
193
+ ),
194
+ ),
195
+ 'design' => array(
196
+ 'productDesign' => array(
197
+ array(
198
+ 'title' => __( 'Item styling', 'wcvs' ),
199
+ 'fields' => array(
200
+ array(
201
+ 'id' => 'wcvs-product-item-styling',
202
+ 'type' => 'checkbox',
203
+ 'name' => 'item-styling',
204
+ )
205
+ ),
206
+ 'is_pro_feature' => true,
207
+ 'desc' => __( 'Edit the default state of your swatches', 'wcvs' ),
208
+ 'priority' => 1
209
+ ),
210
+ array(
211
+ 'title' => __( 'Item hover styling', 'wcvs' ),
212
+ 'fields' => array(
213
+ array(
214
+ 'id' => 'wcvs-product-item-hover',
215
+ 'type' => 'checkbox',
216
+ 'name' => 'item-hover',
217
+ )
218
+ ),
219
+ 'is_pro_feature' => true,
220
+ 'desc' => __( 'Edit the hover state of your swatches', 'wcvs' ),
221
+ 'priority' => 5
222
+ ),
223
+ array(
224
+ 'title' => __( 'Item Selected Styling', 'wcvs' ),
225
+ 'fields' => array(
226
+ array(
227
+ 'id' => 'wcvs-product-item-selected',
228
+ 'type' => 'checkbox',
229
+ 'name' => 'item-selected',
230
+ )
231
+ ),
232
+ 'is_pro_feature' => true,
233
+ 'desc' => __( 'Edit the selected state of your swatches', 'wcvs' ),
234
+ 'priority' => 9
235
+ ),
236
+ array(
237
+ 'title' => __( 'Swatch Text font size', 'wcvs' ),
238
+ 'fields' => array(
239
+ array(
240
+ 'id' => 'wcvs-product-item-font',
241
+ 'type' => 'checkbox',
242
+ 'name' => 'item-font',
243
+ )
244
+ ),
245
+ 'desc' => __( 'The default font size that will be used for your swatches text', 'wcvs' ),
246
+ 'priority' => 13
247
+ ),
248
+ array(
249
+ 'title' => __( 'Text font size', 'wcvs' ),
250
+ 'fields' => array(
251
+ array(
252
+ 'id' => 'wcvs-text-font-size',
253
+ 'type' => 'number',
254
+ 'name' => 'text-font-size',
255
+ 'default_value' => '12'
256
+ ),
257
+ array(
258
+ 'id' => 'wcvs-product-item-font-size-type',
259
+ 'type' => 'select',
260
+ 'options_group' => array(
261
+ array(
262
+ 'value' => 'px',
263
+ 'label' => __( 'px', 'wcvs' ),
264
+ ),
265
+ array(
266
+ 'value' => 'rem',
267
+ 'label' => __( 'rem', 'wcvs' ),
268
+ ),
269
+ array(
270
+ 'value' => 'pt',
271
+ 'label' => __( 'pt', 'wcvs' ),
272
+ )
273
+ ),
274
+ 'name' => 'item-font-size-type',
275
+ 'default_value' => 'px'
276
+ )
277
+ ),
278
+ 'class' => 'indent',
279
+ 'field_to_check' => 'wcvs-product-item-font',
280
+ 'show_if_checked' => true,
281
+ 'priority' => 14
282
+ ),
283
+ array(
284
+ 'title' => __( 'Margin and Padding', 'wcvs' ),
285
+ 'type' => 'text',
286
+ 'html' => __( 'Swatch Item -> represents each individual swatch item.<br>Swatches Wrapper -> represents the container for the group of swatches.', 'wcvs' ),
287
+ 'priority' => 15
288
+ ),
289
+ array(
290
+ 'title' => __( 'Swatch Item Margin', 'wcvs' ),
291
+ 'fields' => array(
292
+ array(
293
+ 'id' => 'wcvs-mar-top',
294
+ 'type' => 'number',
295
+ 'name' => 'mar-top',
296
+ 'default_value' => '0'
297
+ ),
298
+ array(
299
+ 'id' => 'wcvs-mar-right',
300
+ 'type' => 'number',
301
+ 'name' => 'mar-right',
302
+ 'default_value' => '0'
303
+ ),
304
+ array(
305
+ 'id' => 'wcvs-mar-bottom',
306
+ 'type' => 'number',
307
+ 'name' => 'mar-bottom',
308
+ 'default_value' => '0'
309
+ ),
310
+ array(
311
+ 'id' => 'wcvs-mar-left',
312
+ 'type' => 'number',
313
+ 'name' => 'mar-left',
314
+ 'default_value' => '0'
315
+ ),
316
+ array(
317
+ 'id' => 'wcvs-mar-type',
318
+ 'type' => 'select',
319
+ 'options_group' => array(
320
+ array(
321
+ 'value' => 'px',
322
+ 'label' => __( 'px', 'wcvs' ),
323
+ ),
324
+ array(
325
+ 'value' => 'rem',
326
+ 'label' => __( 'rem', 'wcvs' ),
327
+ ),
328
+ array(
329
+ 'value' => 'pt',
330
+ 'label' => __( 'pt', 'wcvs' ),
331
+ ),
332
+ array(
333
+ 'value' => 'em',
334
+ 'label' => __( 'em', 'wcvs' ),
335
+ )
336
+ ),
337
+ 'name' => 'mar-type',
338
+ 'default_value' => 'px'
339
+ )
340
+ ),
341
+ 'priority' => 16
342
+ ),
343
+ array(
344
+ 'title' => __( 'Swatch Item Padding', 'wcvs' ),
345
+ 'fields' => array(
346
+ array(
347
+ 'id' => 'wcvs-pad-top',
348
+ 'type' => 'number',
349
+ 'name' => 'pad-top',
350
+ 'default_value' => '0'
351
+ ),
352
+ array(
353
+ 'id' => 'wcvs-pad-right',
354
+ 'type' => 'number',
355
+ 'name' => 'pad-right',
356
+ 'default_value' => '0'
357
+ ),
358
+ array(
359
+ 'id' => 'wcvs-pad-bottom',
360
+ 'type' => 'number',
361
+ 'name' => 'pad-bottom',
362
+ 'default_value' => '0'
363
+ ),
364
+ array(
365
+ 'id' => 'wcvs-pad-left',
366
+ 'type' => 'number',
367
+ 'name' => 'pad-left',
368
+ 'default_value' => '0'
369
+ ),
370
+ array(
371
+ 'id' => 'wcvs-pad-type',
372
+ 'type' => 'select',
373
+ 'options_group' => array(
374
+ array(
375
+ 'value' => 'px',
376
+ 'label' => __( 'px', 'wcvs' ),
377
+ ),
378
+ array(
379
+ 'value' => 'rem',
380
+ 'label' => __( 'rem', 'wcvs' ),
381
+ ),
382
+ array(
383
+ 'value' => 'pt',
384
+ 'label' => __( 'pt', 'wcvs' ),
385
+ ),
386
+ array(
387
+ 'value' => 'em',
388
+ 'label' => __( 'em', 'wcvs' ),
389
+ )
390
+ ),
391
+ 'name' => 'pad-type',
392
+ 'default_value' => 'px'
393
+ )
394
+ ),
395
+ 'priority' => 17
396
+ ),
397
+ array(
398
+ 'title' => __( 'Swatch Wrapper Margin', 'wcvs' ),
399
+ 'fields' => array(
400
+ array(
401
+ 'id' => 'wcvs-wrm-top',
402
+ 'type' => 'number',
403
+ 'name' => 'wrm-top',
404
+ 'default_value' => '0'
405
+ ),
406
+ array(
407
+ 'id' => 'wcvs-wrm-right',
408
+ 'type' => 'number',
409
+ 'name' => 'wrm-right',
410
+ 'default_value' => '0'
411
+ ),
412
+ array(
413
+ 'id' => 'wcvs-wrm-bottom',
414
+ 'type' => 'number',
415
+ 'name' => 'wrm-bottom',
416
+ 'default_value' => '0'
417
+ ),
418
+ array(
419
+ 'id' => 'wcvs-wrm-left',
420
+ 'type' => 'number',
421
+ 'name' => 'wrm-left',
422
+ 'default_value' => '0'
423
+ ),
424
+ array(
425
+ 'id' => 'wcvs-wrm-type',
426
+ 'type' => 'select',
427
+ 'options_group' => array(
428
+ array(
429
+ 'value' => 'px',
430
+ 'label' => __( 'px', 'wcvs' ),
431
+ ),
432
+ array(
433
+ 'value' => 'rem',
434
+ 'label' => __( 'rem', 'wcvs' ),
435
+ ),
436
+ array(
437
+ 'value' => 'pt',
438
+ 'label' => __( 'pt', 'wcvs' ),
439
+ ),
440
+ array(
441
+ 'value' => 'em',
442
+ 'label' => __( 'em', 'wcvs' ),
443
+ )
444
+ ),
445
+ 'name' => 'wrm-type',
446
+ 'default_value' => 'px'
447
+ )
448
+ ),
449
+ 'priority' => 18
450
+ ),
451
+ array(
452
+ 'title' => __( 'Swatch Wrapper Padding', 'wcvs' ),
453
+ 'fields' => array(
454
+ array(
455
+ 'id' => 'wcvs-wrp-top',
456
+ 'type' => 'number',
457
+ 'name' => 'wrp-top',
458
+ 'default_value' => '0'
459
+ ),
460
+ array(
461
+ 'id' => 'wcvs-wrp-right',
462
+ 'type' => 'number',
463
+ 'name' => 'wrp-right',
464
+ 'default_value' => '0'
465
+ ),
466
+ array(
467
+ 'id' => 'wcvs-wrp-bottom',
468
+ 'type' => 'number',
469
+ 'name' => 'wrp-bottom',
470
+ 'default_value' => '0'
471
+ ),
472
+ array(
473
+ 'id' => 'wcvs-wrp-left',
474
+ 'type' => 'number',
475
+ 'name' => 'wrp-left',
476
+ 'default_value' => '0'
477
+ ),
478
+ array(
479
+ 'id' => 'wcvs-wrp-type',
480
+ 'type' => 'select',
481
+ 'options_group' => array(
482
+ array(
483
+ 'value' => 'px',
484
+ 'label' => __( 'px', 'wcvs' ),
485
+ ),
486
+ array(
487
+ 'value' => 'rem',
488
+ 'label' => __( 'rem', 'wcvs' ),
489
+ ),
490
+ array(
491
+ 'value' => 'pt',
492
+ 'label' => __( 'pt', 'wcvs' ),
493
+ ),
494
+ array(
495
+ 'value' => 'em',
496
+ 'label' => __( 'em', 'wcvs' ),
497
+ )
498
+ ),
499
+ 'name' => 'wrp-type',
500
+ 'default_value' => 'px'
501
+ )
502
+ ),
503
+ 'priority' => 19
504
+ ),
505
+ array(
506
+ 'title' => __( 'Swatch Width', 'wcvs' ),
507
+ 'fields' => array(
508
+ array(
509
+ 'id' => 'wcvs-swatch-width',
510
+ 'type' => 'number',
511
+ 'name' => 'swatch-width',
512
+ 'default_value' => '',
513
+ 'placeholder' => 'auto',
514
+ 'html_after' => '<span class="sw-input-type-text">' . __( 'px', 'wcvs' ) . '</span>'
515
+ ),
516
+ ),
517
+ 'is_pro_feature' => true,
518
+ 'priority' => 20
519
+ ),
520
+ array(
521
+ 'title' => __( 'Swatch Height', 'wcvs' ),
522
+ 'fields' => array(
523
+ array(
524
+ 'id' => 'wcvs-swatch-height',
525
+ 'type' => 'number',
526
+ 'name' => 'swatch-height',
527
+ 'default_value' => '',
528
+ 'placeholder' => 'auto',
529
+ 'html_after' => '<span class="sw-input-type-text">' . __( 'px', 'wcvs' ) . '</span>'
530
+ ),
531
+ ),
532
+ 'is_pro_feature' => true,
533
+ 'priority' => 21
534
+ ),
535
+ ),
536
+ 'shopDesign' => array(
537
+ array(
538
+ 'title' => __( 'Item styling', 'wcvs' ),
539
+ 'fields' => array(
540
+ array(
541
+ 'id' => 'wcvs-shop-item-styling',
542
+ 'type' => 'checkbox',
543
+ 'name' => 'item-styling',
544
+ )
545
+ ),
546
+ 'is_pro_feature' => true,
547
+ 'desc' => __( 'Edit the default state of your swatches', 'wcvs' ),
548
+ 'priority' => 1
549
+ ),
550
+ array(
551
+ 'title' => __( 'Item hover styling', 'wcvs' ),
552
+ 'fields' => array(
553
+ array(
554
+ 'id' => 'wcvs-shop-item-hover',
555
+ 'type' => 'checkbox',
556
+ 'name' => 'item-hover',
557
+ )
558
+ ),
559
+ 'is_pro_feature' => true,
560
+ 'desc' => __( 'Edit the hover state of your swatches', 'wcvs' ),
561
+ 'priority' => 5
562
+ ),
563
+ array(
564
+ 'title' => __( 'Item Selected Styling', 'wcvs' ),
565
+ 'fields' => array(
566
+ array(
567
+ 'id' => 'wcvs-shop-item-selected',
568
+ 'type' => 'checkbox',
569
+ 'name' => 'item-selected',
570
+ )
571
+ ),
572
+ 'is_pro_feature' => true,
573
+ 'desc' => __( 'Edit the selected state of your swatches', 'wcvs' ),
574
+ 'priority' => 9
575
+ ),
576
+ array(
577
+ 'title' => __( 'Swatch Text font size', 'wcvs' ),
578
+ 'fields' => array(
579
+ array(
580
+ 'id' => 'wcvs-shop-item-font',
581
+ 'type' => 'checkbox',
582
+ 'name' => 'item-font',
583
+ )
584
+ ),
585
+ 'desc' => __( 'The default font size that will be used for your swatches text', 'wcvs' ),
586
+ 'priority' => 13
587
+ ),
588
+ array(
589
+ 'title' => __( 'Text font size', 'wcvs' ),
590
+ 'fields' => array(
591
+ array(
592
+ 'id' => 'wcvs-text-font-size',
593
+ 'type' => 'number',
594
+ 'name' => 'text-font-size',
595
+ 'default_value' => '12'
596
+ ),
597
+ array(
598
+ 'id' => 'wcvs-shop-item-font-size-type',
599
+ 'type' => 'select',
600
+ 'options_group' => array(
601
+ array(
602
+ 'value' => 'px',
603
+ 'label' => __( 'px', 'wcvs' ),
604
+ ),
605
+ array(
606
+ 'value' => 'rem',
607
+ 'label' => __( 'rem', 'wcvs' ),
608
+ ),
609
+ array(
610
+ 'value' => 'pt',
611
+ 'label' => __( 'pt', 'wcvs' ),
612
+ )
613
+ ),
614
+ 'name' => 'item-font-size-type',
615
+ 'default_value' => 'px'
616
+ )
617
+ ),
618
+ 'class' => 'indent',
619
+ 'field_to_check' => 'wcvs-shop-item-font',
620
+ 'show_if_checked' => true,
621
+ 'priority' => 14
622
+ ),
623
+ array(
624
+ 'title' => __( 'Margin and Padding', 'wcvs' ),
625
+ 'type' => 'text',
626
+ 'html' => __( 'Swatch Item -> represents each individual swatch item.<br>Swatches Wrapper -> represents the container for the group of swatches.', 'wcvs' ),
627
+ 'priority' => 15
628
+ ),
629
+ array(
630
+ 'title' => __( 'Swatch Item Margin', 'wcvs' ),
631
+ 'fields' => array(
632
+ array(
633
+ 'id' => 'wcvs-mar-top',
634
+ 'type' => 'number',
635
+ 'name' => 'mar-top',
636
+ 'default_value' => '0'
637
+ ),
638
+ array(
639
+ 'id' => 'wcvs-mar-right',
640
+ 'type' => 'number',
641
+ 'name' => 'mar-right',
642
+ 'default_value' => '0'
643
+ ),
644
+ array(
645
+ 'id' => 'wcvs-mar-bottom',
646
+ 'type' => 'number',
647
+ 'name' => 'mar-bottom',
648
+ 'default_value' => '0'
649
+ ),
650
+ array(
651
+ 'id' => 'wcvs-mar-left',
652
+ 'type' => 'number',
653
+ 'name' => 'mar-left',
654
+ 'default_value' => '0'
655
+ ),
656
+ array(
657
+ 'id' => 'wcvs-mar-type',
658
+ 'type' => 'select',
659
+ 'options_group' => array(
660
+ array(
661
+ 'value' => 'px',
662
+ 'label' => __( 'px', 'wcvs' ),
663
+ ),
664
+ array(
665
+ 'value' => 'rem',
666
+ 'label' => __( 'rem', 'wcvs' ),
667
+ ),
668
+ array(
669
+ 'value' => 'pt',
670
+ 'label' => __( 'pt', 'wcvs' ),
671
+ ),
672
+ array(
673
+ 'value' => 'em',
674
+ 'label' => __( 'em', 'wcvs' ),
675
+ )
676
+ ),
677
+ 'name' => 'mar-type',
678
+ 'default_value' => 'px'
679
+ )
680
+ ),
681
+ 'priority' => 16
682
+ ),
683
+ array(
684
+ 'title' => __( 'Swatch Item Padding', 'wcvs' ),
685
+ 'fields' => array(
686
+ array(
687
+ 'id' => 'wcvs-pad-top',
688
+ 'type' => 'number',
689
+ 'name' => 'pad-top',
690
+ 'default_value' => '0'
691
+ ),
692
+ array(
693
+ 'id' => 'wcvs-pad-right',
694
+ 'type' => 'number',
695
+ 'name' => 'pad-right',
696
+ 'default_value' => '0'
697
+ ),
698
+ array(
699
+ 'id' => 'wcvs-pad-bottom',
700
+ 'type' => 'number',
701
+ 'name' => 'pad-bottom',
702
+ 'default_value' => '0'
703
+ ),
704
+ array(
705
+ 'id' => 'wcvs-pad-left',
706
+ 'type' => 'number',
707
+ 'name' => 'pad-left',
708
+ 'default_value' => '0'
709
+ ),
710
+ array(
711
+ 'id' => 'wcvs-pad-type',
712
+ 'type' => 'select',
713
+ 'options_group' => array(
714
+ array(
715
+ 'value' => 'px',
716
+ 'label' => __( 'px', 'wcvs' ),
717
+ ),
718
+ array(
719
+ 'value' => 'rem',
720
+ 'label' => __( 'rem', 'wcvs' ),
721
+ ),
722
+ array(
723
+ 'value' => 'pt',
724
+ 'label' => __( 'pt', 'wcvs' ),
725
+ ),
726
+ array(
727
+ 'value' => 'em',
728
+ 'label' => __( 'em', 'wcvs' ),
729
+ )
730
+ ),
731
+ 'name' => 'pad-type',
732
+ 'default_value' => 'px'
733
+ )
734
+ ),
735
+ 'priority' => 17
736
+ ),
737
+ array(
738
+ 'title' => __( 'Swatch Wrapper Margin', 'wcvs' ),
739
+ 'fields' => array(
740
+ array(
741
+ 'id' => 'wcvs-wrm-top',
742
+ 'type' => 'number',
743
+ 'name' => 'wrm-top',
744
+ 'default_value' => '0'
745
+ ),
746
+ array(
747
+ 'id' => 'wcvs-wrm-right',
748
+ 'type' => 'number',
749
+ 'name' => 'wrm-right',
750
+ 'default_value' => '0'
751
+ ),
752
+ array(
753
+ 'id' => 'wcvs-wrm-bottom',
754
+ 'type' => 'number',
755
+ 'name' => 'wrm-bottom',
756
+ 'default_value' => '0'
757
+ ),
758
+ array(
759
+ 'id' => 'wcvs-wrm-left',
760
+ 'type' => 'number',
761
+ 'name' => 'wrm-left',
762
+ 'default_value' => '0'
763
+ ),
764
+ array(
765
+ 'id' => 'wcvs-wrm-type',
766
+ 'type' => 'select',
767
+ 'options_group' => array(
768
+ array(
769
+ 'value' => 'px',
770
+ 'label' => __( 'px', 'wcvs' ),
771
+ ),
772
+ array(
773
+ 'value' => 'rem',
774
+ 'label' => __( 'rem', 'wcvs' ),
775
+ ),
776
+ array(
777
+ 'value' => 'pt',
778
+ 'label' => __( 'pt', 'wcvs' ),
779
+ ),
780
+ array(
781
+ 'value' => 'em',
782
+ 'label' => __( 'em', 'wcvs' ),
783
+ )
784
+ ),
785
+ 'name' => 'wrm-type',
786
+ 'default_value' => 'px'
787
+ )
788
+ ),
789
+ 'priority' => 18
790
+ ),
791
+ array(
792
+ 'title' => __( 'Swatch Wrapper Padding', 'wcvs' ),
793
+ 'fields' => array(
794
+ array(
795
+ 'id' => 'wcvs-wrp-top',
796
+ 'type' => 'number',
797
+ 'name' => 'wrp-top',
798
+ 'default_value' => '0'
799
+ ),
800
+ array(
801
+ 'id' => 'wcvs-wrp-right',
802
+ 'type' => 'number',
803
+ 'name' => 'wrp-right',
804
+ 'default_value' => '0'
805
+ ),
806
+ array(
807
+ 'id' => 'wcvs-wrp-bottom',
808
+ 'type' => 'number',
809
+ 'name' => 'wrp-bottom',
810
+ 'default_value' => '0'
811
+ ),
812
+ array(
813
+ 'id' => 'wcvs-wrp-left',
814
+ 'type' => 'number',
815
+ 'name' => 'wrp-left',
816
+ 'default_value' => '0'
817
+ ),
818
+ array(
819
+ 'id' => 'wcvs-wrp-type',
820
+ 'type' => 'select',
821
+ 'options_group' => array(
822
+ array(
823
+ 'value' => 'px',
824
+ 'label' => __( 'px', 'wcvs' ),
825
+ ),
826
+ array(
827
+ 'value' => 'rem',
828
+ 'label' => __( 'rem', 'wcvs' ),
829
+ ),
830
+ array(
831
+ 'value' => 'pt',
832
+ 'label' => __( 'pt', 'wcvs' ),
833
+ ),
834
+ array(
835
+ 'value' => 'em',
836
+ 'label' => __( 'em', 'wcvs' ),
837
+ )
838
+ ),
839
+ 'name' => 'wrp-type',
840
+ 'default_value' => 'px'
841
+ )
842
+ ),
843
+ 'priority' => 19
844
+ ),
845
+ ),
846
+ 'toolTipDesign' => array(
847
+ array(
848
+ 'title' => __( 'Tooltip styling', 'wcvs' ),
849
+ 'fields' => array(
850
+ array(
851
+ 'id' => 'wcvs-item-tooltip',
852
+ 'type' => 'checkbox',
853
+ 'name' => 'item-tooltip',
854
+ )
855
+ ),
856
+ 'is_pro_feature'=>true,
857
+ 'priority' => 1
858
+ ),
859
+ array(
860
+ 'title' => __( 'Tooltip Text font size', 'wcvs' ),
861
+ 'fields' => array(
862
+ array(
863
+ 'id' => 'wcvs-tooltip-item-font',
864
+ 'type' => 'checkbox',
865
+ 'name' => 'item-font',
866
+ )
867
+ ),
868
+ 'desc' => __( 'The default font size that will be used for your swatches text', 'wcvs' ),
869
+ 'priority' => 5
870
+ ),
871
+ array(
872
+ 'title' => __( 'Text font size', 'wcvs' ),
873
+ 'fields' => array(
874
+ array(
875
+ 'id' => 'wcvs-tooltip-text-font-size',
876
+ 'type' => 'number',
877
+ 'name' => 'text-font-size',
878
+ 'default_value' => '12'
879
+ ),
880
+ array(
881
+ 'id' => 'wcvs-tooltip-item-font-size-type',
882
+ 'type' => 'select',
883
+ 'options_group' => array(
884
+ array(
885
+ 'value' => 'px',
886
+ 'label' => __( 'px', 'wcvs' ),
887
+ ),
888
+ array(
889
+ 'value' => 'rem',
890
+ 'label' => __( 'rem', 'wcvs' ),
891
+ ),
892
+ array(
893
+ 'value' => 'pt',
894
+ 'label' => __( 'pt', 'wcvs' ),
895
+ )
896
+ ),
897
+ 'name' => 'item-font-size-type',
898
+ 'default_value' => 'px'
899
+ )
900
+ ),
901
+ 'class' => 'indent',
902
+ 'field_to_check' => 'wcvs-tooltip-item-font',
903
+ 'show_if_checked' => true,
904
+ 'priority' => 6
905
+ ),
906
+
907
+ array(
908
+ 'title' => __( 'Tooltip Width', 'wcvs' ),
909
+ 'fields' => array(
910
+ array(
911
+ 'id' => 'wcvs-tooltip-width',
912
+ 'type' => 'number',
913
+ 'name' => 'width',
914
+ 'default_value' => '',
915
+ 'placeholder' => 'auto',
916
+ 'html_after' => '<span class="sw-input-type-text">' . __( 'px', 'wcvs' ) . '</span>'
917
+ ),
918
+ ),
919
+ 'priority' => 7
920
+ ),
921
+ array(
922
+ 'title' => __( 'Tooltip Maximum Width', 'wcvs' ),
923
+ 'fields' => array(
924
+ array(
925
+ 'id' => 'wcvs-tooltip-max-width',
926
+ 'type' => 'number',
927
+ 'name' => 'max-width',
928
+ 'default_value' => '',
929
+ 'placeholder' => 'auto',
930
+ 'html_after' => '<span class="sw-input-type-text">' . __( 'px', 'wcvs' ) . '</span>'
931
+ ),
932
+ ),
933
+ 'priority' => 8
934
+ ),
935
+ array(
936
+ 'title' => __( 'Tooltip Line Height', 'wcvs' ),
937
+ 'fields' => array(
938
+ array(
939
+ 'id' => 'wcvs-tooltip-line-height',
940
+ 'type' => 'number',
941
+ 'name' => 'line-height',
942
+ 'default_value' => '',
943
+ 'placeholder' => 'auto',
944
+ 'html_after' => '<span class="sw-input-type-text">' . __( 'px', 'wcvs' ) . '</span>'
945
+ ),
946
+ ),
947
+ 'priority' => 9
948
+ ),
949
+ )
950
+ ),
951
+ 'archive' => array(
952
+ array(
953
+ 'title' => __( 'Show Swatches Label', 'wcvs' ),
954
+ 'fields' => array(
955
+ array(
956
+ 'id' => 'wcvs-show-swatch',
957
+ 'type' => 'checkbox',
958
+ 'name' => 'show-swatch',
959
+ )
960
+ ),
961
+ 'desc' => __( 'This will show your swatches when users are browsing your main store page', 'wcvs' ),
962
+ 'priority' => 1
963
+ ),
964
+ array(
965
+ 'title' => __( 'Show clear link', 'wcvs' ),
966
+ 'fields' => array(
967
+ array(
968
+ 'id' => 'wcvs-show-clear-link',
969
+ 'type' => 'checkbox',
970
+ 'name' => 'show-clear-link',
971
+ )
972
+ ),
973
+ 'desc' => __( 'This allows users to clean section', 'wcvs' ),
974
+ 'priority' => 2
975
+ ),
976
+ array(
977
+ 'title' => __( 'Swatch alignment', 'wcvs' ),
978
+ 'fields' => array(
979
+ array(
980
+ 'id' => 'wcvs-swatch-alignment',
981
+ 'type' => 'select',
982
+ 'options_group' => array(
983
+ array(
984
+ 'value' => 'left',
985
+ 'label' => __( 'Left', 'wcvs' ),
986
+ ),
987
+ array(
988
+ 'value' => 'center',
989
+ 'label' => __( 'Center', 'wcvs' ),
990
+ ),
991
+ array(
992
+ 'value' => 'right',
993
+ 'label' => __( 'Right', 'wcvs' ),
994
+ ),
995
+ ),
996
+ 'name' => 'swatch-alignment',
997
+ )
998
+ ),
999
+ 'desc' => __( 'Chose how to swatches are displayed', 'wcvs' ),
1000
+ 'priority' => 3
1001
+ ),
1002
+ array(
1003
+ 'title' => __( 'Swatch position', 'wcvs' ),
1004
+ 'fields' => array(
1005
+ array(
1006
+ 'id' => 'wcvs-swatch-position',
1007
+ 'type' => 'select',
1008
+ 'options_group' => array(
1009
+ array(
1010
+ 'value' => 'before-title',
1011
+ 'label' => __( 'Before Title', 'wcvs' ),
1012
+ ),
1013
+ array(
1014
+ 'value' => 'after-title',
1015
+ 'label' => __( 'After Title', 'wcvs' ),
1016
+ ),
1017
+ array(
1018
+ 'value' => 'before-add-to-cart',
1019
+ 'label' => __( 'Before Add to Cart', 'wcvs' ),
1020
+ ),
1021
+ array(
1022
+ 'value' => 'after-add-to-cart',
1023
+ 'label' => __( 'After Add to Cart', 'wcvs' ),
1024
+ ),
1025
+ ),
1026
+ 'name' => 'swatch-position',
1027
+ )
1028
+ ),
1029
+ 'is_pro_feature' => true,
1030
+ 'desc' => __( 'Choose where to insert swatches', 'wcvs' ),
1031
+ 'priority' => 4
1032
+ ),
1033
+ array(
1034
+ 'title' => __( 'Enable Tooltip', 'wcvs' ),
1035
+ 'fields' => array(
1036
+ array(
1037
+ 'id' => 'wcvs-tooltip-enable',
1038
+ 'type' => 'checkbox',
1039
+ 'name' => 'tooltip-enable',
1040
+ )
1041
+ ),
1042
+ 'is_pro_feature' => true,
1043
+ 'desc' => __( 'Enhance the shopping experience for your users', 'wcvs' ),
1044
+ 'priority' => 5
1045
+ ),
1046
+ array(
1047
+ 'title' => __( 'Swatch limit', 'wcvs' ),
1048
+ 'fields' => array(
1049
+ array(
1050
+ 'id' => 'wcvs-swatch-limit',
1051
+ 'type' => 'number',
1052
+ 'name' => 'swatch-limit',
1053
+ 'default_value' => '0'
1054
+ )
1055
+ ),
1056
+ 'is_pro_feature' => true,
1057
+ 'desc' => __( 'Set a max amount of swatches to show.<br>0 means show all swatches', 'wcvs' ),
1058
+ 'priority' => 6
1059
+ ),
1060
+ ),
1061
+ );
1062
+
1063
+ $settings_fields = apply_filters( 'wcvs_settings_fields', $settings_fields );
1064
+
1065
+ foreach ( $settings_fields as $section_id => $items ) {
1066
+ foreach ( $items as $field_name => $field_value ) {
1067
+ if ( ! isset( $field_value['priority'] ) ) {
1068
+ $settings_fields[ $section_id ][ $field_name ] = wp_list_sort( $field_value, 'priority', 'ASC', true );
1069
+ } else {
1070
+ $settings_fields[ $section_id ] = wp_list_sort( $items, 'priority', 'ASC', true );
1071
+ }
1072
+ }
1073
+ }
1074
+
1075
+ return $settings_fields;
1076
+ }
1077
+ }
1078
+ }
includes/class-setting-fields-renderer.php ADDED
@@ -0,0 +1,551 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <?php
2
+ if ( ! class_exists( 'VSWC_Setting_Fields_Renderer' ) ) {
3
+ class VSWC_Setting_Fields_Renderer {
4
+ private $current_options;
5
+ private $option_name = 'woosuite_variation_swatches_option';
6
+ private $settings_sections;
7
+ private $settings_tabs;
8
+ private $settings_fields;
9
+ private $field_html_placeholder = '%%WCVS_FIELD%%';
10
+
11
+
12
+ public function __construct() {
13
+ add_action( 'woosuite_variation_swatches_settings_fields_html', array( $this, 'render_settings_page' ) );
14
+
15
+ //Hook for the template parts
16
+ add_action( 'woosuite_child_plugin_header', array( $this, 'render_settings_page_header' ) );
17
+ add_action( 'woosuite_child_plugin_sidebar', array( $this, 'render_settings_page_sidebar' ) );
18
+ add_action( 'woosuite_child_plugin_footer', array( $this, 'render_settings_page_footer' ) );
19
+ add_action( 'woosuite_child_plugin_video_tutorials', array(
20
+ $this,
21
+ 'render_settings_page_video_tutorials'
22
+ ) );
23
+
24
+
25
+ $this->settings_sections = VSWC_Setting_Fields_Manager::get_settings_sections();
26
+ $this->settings_tabs = VSWC_Setting_Fields_Manager::get_settings_tabs();
27
+ $this->settings_fields = VSWC_Setting_Fields_Manager::get_settings_fields();
28
+ }
29
+
30
+ /**
31
+ * Main function to render the settings page
32
+ */
33
+ public function render_settings_page() {
34
+ //Get the latest values
35
+ $this->current_options = get_option( $this->option_name ) ?: array();
36
+
37
+ $loop_count = 0;
38
+
39
+ foreach ( $this->settings_sections as $section ) {
40
+ $index_class = $loop_count === 0 ? 'first-item' : '';
41
+ $section['icon'] = isset( $section['icon'] ) ? $section['icon'] : 'dashicons-admin-settings';
42
+ ?>
43
+ <div class="variation-accordion-item <?php echo $index_class; ?>"
44
+ id="<?php echo 'wcvs_section_' . $section['id']; ?>">
45
+ <div class="variation-item-head var-gen-head <?php echo $loop_count === 0 ? 'active-accordion' : ''; ?>">
46
+ <h3 class="variation-accrodion-title">
47
+ <span class="dashicons <?php echo $section['icon']; ?>"></span>
48
+ <?php echo $section['title']; ?>
49
+ </h3>
50
+ <span class="dashicons dashicons-arrow-down-alt2"></span>
51
+ </div>
52
+ <div class="variation-accordion-content">
53
+ <div class="variation-switcher-wrap">
54
+ <div class="woocommerce_options_panel">
55
+ <?php
56
+ $this->render_settings_fields( $section ); ?>
57
+ </div>
58
+ </div>
59
+ </div>
60
+ </div>
61
+ <?php
62
+ $loop_count ++;
63
+ }
64
+ }
65
+
66
+ /**
67
+ * Rendering the fields belong to specified section
68
+ *
69
+ * @param $section
70
+ * @param array $custom_fields
71
+ */
72
+ public function render_settings_fields( $section, array $custom_fields = array() ) {
73
+
74
+ //Rendering the fields belong to the tab if existed
75
+ if ( isset( $section['has_tab'] ) && $section['has_tab'] === true ) {
76
+ $this->render_settings_tabs( $section['id'] );
77
+
78
+ return;
79
+ }
80
+
81
+ //Using custom fields if it is set
82
+ if ( empty( $custom_fields ) && isset( $this->settings_fields[ $section['id'] ] ) ) {
83
+ $custom_fields = $this->settings_fields[ $section['id'] ];
84
+ }
85
+
86
+ foreach ( $custom_fields as $main_field_settings ) {
87
+ $fields_html = '';
88
+
89
+ //If pro add-on is activated, so don't render the pro features badge
90
+ if ( isset( $main_field_settings['is_pro_feature'] ) && true === $main_field_settings['is_pro_feature'] && defined( 'WOOSUITE_VARIATION_SWATCHES_PRO_VERSION' ) ) {
91
+ continue;
92
+ }
93
+
94
+ if ( isset( $main_field_settings['fields'] ) && ! empty( $main_field_settings['fields'] ) ) {
95
+ foreach ( $main_field_settings['fields'] as $single_field ) {
96
+ $item_field_setting = $this->get_parsed_field_setting( $section['id'], $main_field_settings, $single_field );
97
+ $fields_html .= call_user_func( $this->get_field_callback( $item_field_setting ), $item_field_setting );
98
+ }
99
+ echo str_replace( $this->field_html_placeholder, $fields_html, $this->render_field_wrapper( $main_field_settings ) );
100
+ } else {
101
+ $this->callback_text( $main_field_settings );
102
+ }
103
+ }
104
+
105
+ }
106
+
107
+ /**
108
+ * Get the callback function for each field element
109
+ *
110
+ * @param $field_settings
111
+ *
112
+ * @return array|mixed
113
+ */
114
+ private function get_field_callback( $field_settings ) {
115
+ if ( isset( $field_settings['callback'] ) && ! empty( $field_settings['callback'] ) ) {
116
+ return $field_settings['callback'];
117
+ } else {
118
+ return array( $this, 'callback_' . $field_settings['type'] );
119
+ }
120
+ }
121
+
122
+ /**
123
+ * Combine the general field settings with the settings of each element
124
+ *
125
+ * @param $section_id
126
+ * @param $main_settings
127
+ * @param $item_settings
128
+ *
129
+ * @return array|object
130
+ */
131
+ private function get_parsed_field_setting( $section_id, $main_settings, $item_settings ) {
132
+ $default_field_setting = array(
133
+ 'title' => '',
134
+ 'section_id' => $section_id,
135
+ 'tab_id' => '',
136
+ 'id' => '',
137
+ 'type' => 'text',
138
+ 'name' => '',
139
+ 'default_value' => '',
140
+ 'class' => '',
141
+ 'custom_item_class' => '',
142
+ 'field_to_check' => '',
143
+ 'placeholder' => '',
144
+ 'html_after' => '',
145
+ 'html' => '',
146
+ 'min' => 0,
147
+ 'max' => 99999,
148
+ 'step' => 1,
149
+ 'callback' => '',
150
+ 'options_group' => array(),
151
+ 'show_if_checked' => false,
152
+ );
153
+
154
+ $parsed_field = array_merge( $main_settings, $item_settings );
155
+ unset( $parsed_field['fields'] );
156
+
157
+ return wp_parse_args( $parsed_field, $default_field_setting );
158
+
159
+ }
160
+
161
+ /**
162
+ * Rendering the tabs belong to the section
163
+ *
164
+ * @param $section_id
165
+ */
166
+ public function render_settings_tabs( $section_id ) {
167
+ if ( ! isset( $this->settings_tabs[ $section_id ] ) || empty( $this->settings_tabs[ $section_id ] ) ) {
168
+ return;
169
+ }
170
+ ?>
171
+ <div class="wcvs-accor-tab-wrap">
172
+ <div class="wcvs-accor-tab-btns">
173
+ <?php
174
+ $tab_loop = 0;
175
+ foreach ( $this->settings_tabs[ $section_id ] as $tab_item ) {
176
+ $tab_class = esc_attr( $section_id . '-' . $tab_item['id'] );
177
+ ?>
178
+ <button class="accor-tab-btn <?php echo ( $tab_loop === 0 ? 'active-at-btn ' : ' ' ) . $tab_class; ?>">
179
+ <?php echo $tab_item['title']; ?>
180
+ </button>
181
+ <?php
182
+ $tab_loop ++;
183
+ } ?>
184
+ </div>
185
+ </div>
186
+ <div class="wcvs-accor-tab-content-wrap">
187
+ <?php
188
+ foreach ( $this->settings_tabs[ $section_id ] as $tab_item ) {
189
+ $tab_class = esc_attr( $section_id . '-' . $tab_item['id'] );
190
+ ?>
191
+ <div class="wcvs-accor-tab-content <?php echo $tab_class; ?>">
192
+ <?php
193
+ if ( isset( $this->settings_fields[ $section_id ][ $tab_item['id'] ] ) ) {
194
+ $fields = array_map( function ( $field ) use ( $section_id, $tab_item ) {
195
+ $field['section_id'] = $section_id;
196
+ $field['tab_id'] = $tab_item['id'];
197
+
198
+ return $field;
199
+ }, $this->settings_fields[ $section_id ][ $tab_item['id'] ] );
200
+ $this->render_settings_fields( $tab_item, $fields );
201
+ }
202
+ ?>
203
+ </div>
204
+ <?php } ?>
205
+ </div>
206
+ <?php
207
+ }
208
+
209
+ /**
210
+ * Displays a text field for a settings field
211
+ *
212
+ * @param array $args settings field args
213
+ */
214
+ function callback_text( $args ) {
215
+ ?>
216
+ <div class="variation-switcher-item wcvs-text-only">
217
+ <div class="variation-switcher-label">
218
+ <?php
219
+ echo '<h3 class="vs-label-title">' . esc_html( $args['title'] ) . '</h3>';
220
+ echo $this->callback_html( $args ); ?>
221
+ </div>
222
+ </div>
223
+ <?php
224
+ }
225
+
226
+ /**
227
+ * Displays the html for a settings field
228
+ *
229
+ * @param array $args settings field args
230
+ */
231
+ public function callback_html( $args ) {
232
+ ob_start();
233
+ ?>
234
+ <div class="variation-html-wrapper">
235
+ <?php echo $args['html']; ?>
236
+ </div>
237
+ <?php
238
+ return ob_get_clean();
239
+ }
240
+
241
+ /**
242
+ * Displays a radio for a settings field
243
+ *
244
+ * @param array $args settings field args
245
+ */
246
+ public function callback_radio( array $args ) {
247
+ $field_value = $this->get_field_value( $args );
248
+ $field_name = $this->get_field_name( $args );
249
+ ob_start();
250
+ ?>
251
+ <div class="variation-radio-wrapper">
252
+ <?php foreach ( $args['options_group'] as $option ) { ?>
253
+ <label class="radio-<?php echo $option['value'] . ' ' . esc_attr( $args['custom_item_class'] ); ?>">
254
+ <input type="radio" name="<?php echo $field_name; ?>"
255
+ class="variation-radio-input"
256
+ value="<?php echo $option['value']; ?>"
257
+ <?php checked( $option['value'], $field_value ); ?>>
258
+ <span class="variation-radio-text">
259
+ <?php echo $option['label']; ?>
260
+ </span>
261
+ </label>
262
+ <?php } ?>
263
+ </div>
264
+ <?php
265
+ return ob_get_clean();
266
+ }
267
+
268
+ /**
269
+ * Displays a selectbox for a settings field
270
+ *
271
+ * @param array $args settings field args
272
+ */
273
+ public function callback_select( array $args ) {
274
+ $field_value = $this->get_field_value( $args );
275
+ $field_name = $this->get_field_name( $args );
276
+ ob_start();
277
+ ?>
278
+ <div class="variation-switch-field-grid">
279
+ <select class="<?php echo esc_attr( $args['custom_item_class'] ); ?>"
280
+ id="<?php echo esc_attr( $args['id'] ); ?>" name="<?php echo $field_name; ?>">
281
+ <?php foreach ( $args['options_group'] as $option ) { ?>
282
+ <option class="selectbox-<?php echo $option['value']; ?>"
283
+ value="<?php echo $option['value']; ?>"
284
+ <?php selected( $option['value'], $field_value ); ?>>
285
+ <?php echo $option['label']; ?>
286
+ </option>
287
+ <?php } ?>
288
+ </select>
289
+ </div>
290
+ <?php
291
+ return ob_get_clean();
292
+ }
293
+
294
+ /**
295
+ * Displays a checkbox for a settings field
296
+ *
297
+ * @param array $args settings field args
298
+ */
299
+ public function callback_checkbox( array $args ) {
300
+ $field_value = $this->get_field_value( $args );
301
+ $field_name = $this->get_field_name( $args );
302
+ ob_start();
303
+ ?>
304
+ <label class="variation-switch">
305
+ <input type="hidden" name="<?php echo $field_name; ?>" value="0">
306
+ <input type="checkbox" name="<?php echo $field_name; ?>" id="<?php echo esc_attr( $args['id'] ); ?>"
307
+ class="wcvs-accordion-switch" value="1" <?php checked( '1' === $field_value ); ?>/>
308
+ <span class="slider round"></span>
309
+ </label>
310
+ <?php
311
+ return ob_get_clean();
312
+ }
313
+
314
+ /**
315
+ * Displays a color picker field for a settings field
316
+ *
317
+ * @param array $args settings field args
318
+ */
319
+ function callback_color( $args ) {
320
+ $field_value = $this->get_field_value( $args );
321
+ $field_name = $this->get_field_name( $args );
322
+ ob_start();
323
+ ?>
324
+ <input type="text"
325
+ name="<?php echo $field_name; ?>"
326
+ class="vs-color-picker"
327
+ id="<?php echo esc_attr( $args['id'] ); ?>"
328
+ value="<?php echo $field_value; ?>">
329
+ <?php
330
+ return ob_get_clean();
331
+ }
332
+
333
+ /**
334
+ * Display a number field
335
+ *
336
+ * @param $args
337
+ *
338
+ * @return false|string
339
+ */
340
+ function callback_number( $args ) {
341
+ $field_value = $this->get_field_value( $args );
342
+ $field_name = $this->get_field_name( $args );
343
+ ob_start();
344
+ echo empty( $args['html_after'] ) ? '' : '<div class="field-with-html-after">';
345
+ ?>
346
+ <input type="number"
347
+ name="<?php echo $field_name; ?>"
348
+ class="<?php echo esc_attr( $args['custom_item_class'] ); ?>"
349
+ id="<?php echo esc_attr( $args['id'] ); ?>"
350
+ min="<?php echo esc_attr( $args['min'] ); ?>"
351
+ max="<?php echo esc_attr( $args['max'] ); ?>"
352
+ step="<?php echo esc_attr( $args['step'] ); ?>"
353
+ placeholder="<?php echo esc_attr( $args['placeholder'] ); ?>"
354
+ value="<?php echo $field_value; ?>">
355
+ <?php
356
+ echo empty( $args['html_after'] ) ? '' : $args['html_after'] . '</div>';
357
+
358
+ return ob_get_clean();
359
+ }
360
+
361
+ /**
362
+ * Rendering the heading of each field element (heading, desc, tip text)
363
+ *
364
+ * @param $field_args
365
+ *
366
+ * @return false|string
367
+ */
368
+ private function render_field_heading( $field_args ) {
369
+ ob_start();
370
+ ?>
371
+ <h3 class="vs-label-title"><?php echo esc_html( $field_args['title'] ); ?></h3>
372
+ <?php
373
+ $this->render_field_tip( $field_args );
374
+ $this->render_field_desc( $field_args );
375
+
376
+ return ob_get_clean();
377
+ }
378
+
379
+ /**
380
+ * Rendering the layout of each element (wrapper, heading, placeholder to replace with the real field input)
381
+ *
382
+ * @param $field_args
383
+ *
384
+ * @return false|string
385
+ */
386
+ private function render_field_wrapper( $field_args ) {
387
+ $field_args['class'] = isset( $field_args['class'] ) ? $field_args['class'] : '';
388
+ $conditional_attr = $this->get_field_conditional_id( $field_args );
389
+
390
+ if ( isset( $field_args['is_pro_feature'] ) && $field_args['is_pro_feature'] === true ) {
391
+ $field_args['class'] .= ' wcvs-pro-item';
392
+ }
393
+ $style_attr = empty( $conditional_attr ) ? '' : 'style="display: none;"';
394
+ ob_start();
395
+ ?>
396
+ <div class="variation-switcher-item <?php echo esc_attr( $field_args['class'] ); ?>" <?php echo $conditional_attr . $style_attr; ?>>
397
+ <div class="variation-switcher-label">
398
+ <?php echo $this->render_field_heading( $field_args ); ?>
399
+ </div>
400
+ <div class="variation-switch-field">
401
+ %%WCVS_FIELD%%
402
+ </div>
403
+ </div>
404
+ <?php
405
+ return ob_get_clean();
406
+ }
407
+
408
+ /**
409
+ * Rendering the Woocommerce help tip
410
+ *
411
+ * @param $field_args
412
+ */
413
+ private function render_field_tip( $field_args ) {
414
+ if ( ! empty( $field_args['desc_tip'] ) ) {
415
+ echo '<br><span class="woocommerce-help-tip" data-tip="' . esc_html( $field_args['desc_tip'] ) . '"></span>';
416
+ }
417
+ }
418
+
419
+ /**
420
+ * Rendering the description of field
421
+ *
422
+ * @param $field_args
423
+ */
424
+ private function render_field_desc( $field_args ) {
425
+ if ( ! empty( $field_args['desc'] ) ) {
426
+ echo '<br><span class="sub">' . esc_html( $field_args['desc'] ) . '</span>';
427
+ }
428
+ }
429
+
430
+ /**
431
+ * Getting the name="" attribute for the field element
432
+ *
433
+ * @param $field_args
434
+ *
435
+ * @return string|void
436
+ */
437
+ private function get_field_name( $field_args ) {
438
+ if ( isset( $field_args['is_pro_feature'] ) && $field_args['is_pro_feature'] === true ) {
439
+ return '';
440
+ }
441
+
442
+ if ( ! empty( $field_args['tab_id'] ) ) {
443
+ $field_name = $field_args['section_id'] . '[' . $field_args['tab_id'] . ']' . '[' . $field_args['name'] . ']';
444
+ } else {
445
+ $field_name = $field_args['section_id'] . '[' . $field_args['name'] . ']';
446
+ }
447
+
448
+ return esc_attr( $field_name );
449
+ }
450
+
451
+ /**
452
+ * Get the saved value of field in database
453
+ *
454
+ * @param $field_args
455
+ *
456
+ * @return false|mixed
457
+ */
458
+ private function get_field_value( $field_args ) {
459
+ if ( isset( $field_args['is_pro_feature'] ) && true === $field_args['is_pro_feature'] ) {
460
+ return false;
461
+ }
462
+
463
+ if ( empty( $this->current_options ) ) {
464
+ return $field_args['default_value'];
465
+ }
466
+ if ( ! empty( $field_args['tab_id'] ) ) {
467
+ $field_value = isset( $this->current_options[ $field_args['section_id'] ][ $field_args['tab_id'] ][ $field_args['name'] ] ) ? $this->current_options[ $field_args['section_id'] ][ $field_args['tab_id'] ][ $field_args['name'] ] : $field_args['default_value'];
468
+ } else {
469
+ $field_value = isset( $this->current_options[ $field_args['section_id'] ][ $field_args['name'] ] ) ? $this->current_options[ $field_args['section_id'] ][ $field_args['name'] ] : $field_args['default_value'];
470
+ }
471
+
472
+ return $field_value;
473
+ }
474
+
475
+ /**
476
+ * Get the field conditional ID
477
+ *
478
+ * @param $field_args
479
+ *
480
+ * @return string
481
+ */
482
+ public function get_field_conditional_id( $field_args ) {
483
+ $conditional_id = '';
484
+ if ( isset( $field_args['show_if_checked'] )
485
+ && true === $field_args['show_if_checked']
486
+ && ! empty( $field_args['field_to_check'] ) ) {
487
+ $conditional_id = 'data-conditional="' . $field_args['field_to_check'] . '"';
488
+ }
489
+
490
+ return $conditional_id;
491
+ }
492
+
493
+ /**
494
+ * Get field description for display
495
+ *
496
+ * @param array $args settings field args
497
+ */
498
+ public function get_field_description( $args ) {
499
+ if ( ! empty( $args['desc'] ) ) {
500
+ $desc = sprintf( '<p class="description">%s</p>', $args['desc'] );
501
+ } else {
502
+ $desc = '';
503
+ }
504
+
505
+ return $desc;
506
+ }
507
+
508
+ /**
509
+ * Rendering the header of the settings page
510
+ *
511
+ * @param $plugin_slug
512
+ */
513
+ public function render_settings_page_header( $plugin_slug ) {
514
+ $this->render_settings_page_if_woo_core_deactivated( 'admin/partials/panel-header.php' );
515
+ }
516
+
517
+ /**
518
+ * Rendering the sidebar of the settings page
519
+ *
520
+ * @param $plugin_slug
521
+ */
522
+ public function render_settings_page_sidebar( $plugin_slug ) {
523
+ $this->render_settings_page_if_woo_core_deactivated( 'admin/partials/panel-sidebar.php' );
524
+ }
525
+
526
+ /**
527
+ * Rendering the footer of the settings page
528
+ *
529
+ * @param $plugin_slug
530
+ */
531
+ public function render_settings_page_footer( $plugin_slug ) {
532
+ $this->render_settings_page_if_woo_core_deactivated( 'admin/partials/panel-footer.php' );
533
+ }
534
+
535
+ /**
536
+ * Rendering the video tutorial of the settings page
537
+ *
538
+ * @param $plugin_slug
539
+ */
540
+ public function render_settings_page_video_tutorials( $plugin_slug ) {
541
+ $this->render_settings_page_if_woo_core_deactivated( 'admin/partials/panel-video-tutorial.php' );
542
+ }
543
+
544
+ private function render_settings_page_if_woo_core_deactivated( $template_path ) {
545
+ if ( ! TA_WC_Variation_Swatches::is_woo_core_active() ) {
546
+ TA_WC_Variation_Swatches::get_template( $template_path );
547
+ }
548
+ }
549
+
550
+ }
551
+ }
includes/class-upgrader.php ADDED
@@ -0,0 +1,164 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <?php
2
+ if ( ! class_exists( 'VSWC_Upgrader' ) ) {
3
+ class VSWC_Upgrader {
4
+ /**
5
+ * The single instance of the class
6
+ *
7
+ * @var VSWC_Upgrader
8
+ */
9
+ protected static $instance = null;
10
+
11
+ private $previous_version_need_to_compare = '1.0.11';
12
+ private $saved_plugin_version;
13
+
14
+ /**
15
+ * Main instance
16
+ *
17
+ * @return VSWC_Upgrader
18
+ */
19
+ public static function instance() {
20
+ if ( null == self::$instance ) {
21
+ self::$instance = new self();
22
+ }
23
+
24
+ return self::$instance;
25
+ }
26
+
27
+ public function __construct() {
28
+ add_action( 'admin_notices', array( $this, 'show_warning_message_after_upgrading' ) );
29
+ add_action( 'admin_init', array( $this, 'set_current_plugin_version' ) );
30
+ }
31
+
32
+ function set_current_plugin_version() {
33
+ if ( ! get_option( 'wcvs_current_version', false ) ) {
34
+ update_option( 'wcvs_current_version', WCVS_PLUGIN_VERSION, true );
35
+ }
36
+ }
37
+
38
+ /**
39
+ * Showing the warning message after upgrading plugin
40
+ */
41
+ public function show_warning_message_after_upgrading() {
42
+
43
+ if ( $this->is_admin_notice_should_be_shown()
44
+ && ! TA_WC_Variation_Swatches::is_in_plugin_settings_page() ) {
45
+ $url = admin_url( 'admin.php?page=variation-swatches-settings' );
46
+ ?>
47
+ <div class="notice-warning notice is-dismissible">
48
+ <p><?php printf( __( 'You need to update new settings for the Variation Swatches plugin <a href="%s">here</a>.', 'wcvs' ), $url ); ?></p>
49
+ </div>
50
+ <?php
51
+ }
52
+ }
53
+
54
+ /**
55
+ * Check if the welcome popup should be shown in the settings page
56
+ *
57
+ * @return bool
58
+ */
59
+ public function is_welcome_popup_should_be_shown(): bool {
60
+ $this->saved_plugin_version = $this->get_current_plugin_version();
61
+
62
+ if ( ! $this->is_welcome_page_is_already_show() ) {
63
+ $this->mark_welcome_page_shown_for_new_version();
64
+
65
+ return $this->is_notice_allowed_to_show();
66
+ }
67
+
68
+ return false;
69
+ }
70
+
71
+ /**
72
+ * Check if the admin notice should be show
73
+ *
74
+ * @return bool
75
+ */
76
+ public function is_admin_notice_should_be_shown(): bool {
77
+ $this->saved_plugin_version = $this->get_current_plugin_version();
78
+
79
+ return $this->is_notice_allowed_to_show() && ! $this->is_met_admin_notice_requirements();
80
+ }
81
+
82
+ /**
83
+ * @return bool
84
+ */
85
+ private function is_notice_allowed_to_show(): bool {
86
+ if ( WCVS_NEED_TO_SHOW_NOTICE_AFTER_UPGRADED ) {
87
+ return ! empty( $this->saved_plugin_version ) && $this->is_current_version_newer_than_compared_version();
88
+ }
89
+
90
+ return false;
91
+ }
92
+
93
+ /**
94
+ * @return bool|int
95
+ */
96
+ private function is_current_version_newer_than_compared_version() {
97
+ return $this->compare_plugin_version( $this->saved_plugin_version, $this->previous_version_need_to_compare, '>' );
98
+ }
99
+
100
+ /**
101
+ * @return false|mixed|void
102
+ */
103
+ private function get_current_plugin_version() {
104
+ return get_option( 'wcvs_current_version', false );
105
+ }
106
+
107
+ /**
108
+ * Mark the welcome page is already shown to hide it next time
109
+ */
110
+ private function mark_welcome_page_shown_for_new_version() {
111
+ update_option( 'wcvs_welcome_page_shown_v_' . $this->get_slugify_string_of_current_version(), 1 );
112
+ }
113
+
114
+ /**
115
+ * @return false|mixed|void
116
+ */
117
+ private function is_welcome_page_is_already_show() {
118
+ return get_option( 'wcvs_welcome_page_shown_v_' . $this->get_slugify_string_of_current_version(), false );
119
+ }
120
+
121
+ /**
122
+ * Checking if the new settings has been update after upgrading
123
+ *
124
+ * @return bool
125
+ */
126
+ private function is_met_admin_notice_requirements() {
127
+ $new_settings_value = get_option( 'woosuite_variation_swatches_option', false );
128
+ if ( empty( $new_settings_value ) || ! isset( $new_settings_value['general'] ) ) {
129
+ return false;
130
+ }
131
+
132
+ return true;
133
+ }
134
+
135
+ /**
136
+ * Change the version number to slug.
137
+ * For example: 2.0.1 -> 2_0_1
138
+ *
139
+ * @return array|string|string[]
140
+ */
141
+ private function get_slugify_string_of_current_version() {
142
+ return str_replace( array( '.', '-' ), '_', WCVS_PLUGIN_VERSION );
143
+ }
144
+
145
+ /**
146
+ *
147
+ * @param $old_version
148
+ * @param $new_version
149
+ * @param $operator
150
+ *
151
+ * @return bool|int
152
+ */
153
+ private function compare_plugin_version( $old_version, $new_version, $operator ) {
154
+ $p = '#(\.0+)+($|-)#';
155
+ $ver1 = preg_replace( $p, '', $old_version );
156
+ $ver2 = preg_replace( $p, '', $new_version );
157
+
158
+ return isset( $operator ) ?
159
+ version_compare( $ver1, $ver2, $operator ) :
160
+ version_compare( $ver1, $ver2 );
161
+ }
162
+
163
+ }
164
+ }
includes/class-variation-swatches.php CHANGED
@@ -44,15 +44,19 @@ final class TA_WC_Variation_Swatches {
44
  $this->includes();
45
  $this->init_hooks();
46
  }
47
-
48
  /**
49
  * Include required core files used in admin and on the frontend.
50
  */
51
  public function includes() {
52
- require_once dirname( __FILE__ ) . '/class-frontend.php';
 
 
53
 
54
  if ( is_admin() ) {
55
- require_once dirname( __FILE__ ) . '/class-admin.php';
 
 
 
56
  }
57
  }
58
 
@@ -88,10 +92,8 @@ final class TA_WC_Variation_Swatches {
88
  *
89
  * @return array
90
  */
91
- public function add_attribute_types( $types ) {
92
- $types = array_merge( $types, $this->types );
93
-
94
- return $types;
95
  }
96
 
97
  /**
@@ -105,9 +107,8 @@ final class TA_WC_Variation_Swatches {
105
  global $wpdb;
106
 
107
  $attr = substr( $taxonomy, 3 );
108
- $attr = $wpdb->get_row( $wpdb->prepare( "SELECT * FROM " . $wpdb->prefix . "woocommerce_attribute_taxonomies WHERE attribute_name = %s", $attr ) );
109
 
110
- return $attr;
111
  }
112
 
113
  /**
@@ -127,6 +128,107 @@ final class TA_WC_Variation_Swatches {
127
  public function frontend() {
128
  return TA_WC_Variation_Swatches_Frontend::instance();
129
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
130
  }
131
 
132
  if ( ! function_exists( 'TA_WCVS' ) ) {
44
  $this->includes();
45
  $this->init_hooks();
46
  }
 
47
  /**
48
  * Include required core files used in admin and on the frontend.
49
  */
50
  public function includes() {
51
+ $current_dir = dirname( __FILE__ );
52
+ require_once $current_dir . '/class-upgrader.php';
53
+ require_once $current_dir . '/class-frontend.php';
54
 
55
  if ( is_admin() ) {
56
+ require_once $current_dir . '/class-admin.php';
57
+ if ( ! self::is_woo_core_active() ) {
58
+ require_once $current_dir . '/class-addon-page.php';
59
+ }
60
  }
61
  }
62
 
92
  *
93
  * @return array
94
  */
95
+ public function add_attribute_types( array $types ) {
96
+ return array_merge( $types, $this->types );
 
 
97
  }
98
 
99
  /**
107
  global $wpdb;
108
 
109
  $attr = substr( $taxonomy, 3 );
 
110
 
111
+ return $wpdb->get_row( $wpdb->prepare( "SELECT * FROM " . $wpdb->prefix . "woocommerce_attribute_taxonomies WHERE attribute_name = %s", $attr ) );
112
  }
113
 
114
  /**
128
  public function frontend() {
129
  return TA_WC_Variation_Swatches_Frontend::instance();
130
  }
131
+
132
+ /**
133
+ * Function to generate the formatted style for the dual color feature
134
+ *
135
+ * @param int $term_id
136
+ * @param string $main_color
137
+ *
138
+ * @return string
139
+ */
140
+ public static function generate_color_style( $term_id, $main_color ) {
141
+
142
+ $color_style = apply_filters( 'tawcvs_color_style', $main_color, $term_id, $main_color );
143
+
144
+ return esc_attr( $color_style );
145
+ }
146
+
147
+ /**
148
+ * Include a specified template file
149
+ *
150
+ * @param $file_path
151
+ */
152
+ public static function get_template( $file_path ) {
153
+ $template = WCVS_PLUGIN_DIR . 'templates/' . $file_path;
154
+ if ( file_exists( $template ) ) {
155
+ include $template;
156
+ }
157
+ }
158
+
159
+ public static function get_product_attributes_as_checkbox( $section_id, $tab_id, $field_name ) {
160
+ ob_start();
161
+ $current_options = get_option( 'woosuite_variation_swatches_option' ) ?: array();
162
+ if ( ! empty( $tab_id ) ) {
163
+ $field_name_prefix = $section_id . '[' . $tab_id . ']';
164
+ } else {
165
+ $field_name_prefix = $section_id;
166
+ }
167
+ foreach ( wc_get_attribute_taxonomies() as $att ) {
168
+ if ( ! empty( $tab_id ) ) {
169
+ $field_value = isset( $current_options[ $section_id ][ $tab_id ][ $field_name . '-' . $att->attribute_name ] ) ? $current_options[ $section_id ][ $tab_id ][ $field_name . '-' . $att->attribute_name ] : '';
170
+ } else {
171
+ $field_value = isset( $current_options[ $section_id ][ $field_name . '-' . $att->attribute_name ] ) ? $current_options[ $section_id ][ $field_name . '-' . $att->attribute_name ] : '';
172
+ }
173
+ $field_id = $field_name . '-' . $att->attribute_name;
174
+ $field_name_modified = $field_name_prefix . '[' . $field_name . '-' . $att->attribute_name . ']';
175
+ ?>
176
+ <label class="variation-checkbox-container" for="<?php echo $field_id; ?>">
177
+ <?php echo $att->attribute_label; ?>
178
+ <input type="hidden" name="<?php echo $field_name_modified; ?>" value="0">
179
+ <input id="<?php echo $field_id; ?>"
180
+ type="checkbox"
181
+ name="<?php echo $field_name_modified; ?>"
182
+ value="1"
183
+ <?php checked( '1', $field_value ); ?>/>
184
+ <span class="checkmark"></span>
185
+ </label>
186
+ <?php
187
+ }
188
+
189
+ return ob_get_clean();
190
+ }
191
+
192
+ public static function get_detailed_product_variations( $product, $attribute_tax_name ) {
193
+ if ( ! $product instanceof WC_Product_Variable ) {
194
+ return array();
195
+ }
196
+ $collected_variations = array();
197
+ $variations = $product->get_available_variations();
198
+ if ( ! empty( $variations ) ) {
199
+ foreach ( $variations as $variation ) {
200
+ $attribute_item_obj_slug = $variation['attributes'][ 'attribute_' . $attribute_tax_name ];
201
+
202
+ if ( ! isset( $collected_variations[ $attribute_item_obj_slug ] ) ) {
203
+ $collected_variations[ $attribute_item_obj_slug ] = $variation;
204
+ }
205
+ }
206
+ }
207
+
208
+ return $collected_variations;
209
+ }
210
+
211
+ /**
212
+ * Detect if we have the Woosuite Core plugin activated
213
+ *
214
+ * @return bool
215
+ */
216
+ public static function is_woo_core_active() {
217
+ return class_exists( 'Woosuite_Core' );
218
+ }
219
+
220
+ /**
221
+ * Detect if we have the Woosuite Core plugin activated
222
+ *
223
+ * @return bool
224
+ */
225
+ public static function is_pro_addon_active() {
226
+ return class_exists( 'Woosuite_Variation_Swatches_Pro' );
227
+ }
228
+
229
+ public static function is_in_plugin_settings_page() {
230
+ return is_admin() && isset( $_GET['page'] ) && $_GET['page'] === 'variation-swatches-settings';
231
+ }
232
  }
233
 
234
  if ( ! function_exists( 'TA_WCVS' ) ) {
readme.txt CHANGED
@@ -1,15 +1,15 @@
1
  === Variation Swatches for WooCommerce ===
2
- Contributors: themealien, mehbubrashid
3
- Tags: woocommerce, product attribute, product color, product size, variation swatches, variable products
4
  Requires at least: 4.5
5
- Tested up to: 5.7
6
- Stable tag: 1.0.11
7
  WC requires at least: 3.2.0
8
- WC tested up to: 5.4.1
9
  License: GPLv2 or later
10
  License URI: https://www.gnu.org/licenses/gpl-2.0.html
11
 
12
- An extension of WooCommerce that make variable products be more beauty and friendly to customers.
13
 
14
  == Description ==
15
 
@@ -18,8 +18,16 @@ This plugin only adds more options to show product variations with swatches. It
18
 
19
  With a friendly and easy-to-use interface, you can add default color, image or label to each attribute in the attributes management page. It can also helps you pick the right style for quick-add attribute right inside the editing product page.
20
 
21
- **Features provided with this plugin:**
22
 
 
 
 
 
 
 
 
 
23
  * Completely integrate with WooCommerce plugin
24
  * Work on variable product only
25
  * Create attribute color swatches
@@ -29,6 +37,25 @@ With a friendly and easy-to-use interface, you can add default color, image or l
29
  * Create new attribute swatch in product editing page
30
 
31
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
32
  == Installation ==
33
 
34
  = Automatic installation =
@@ -68,15 +95,28 @@ Yes, it will work with any theme, but may require some styling to make it match
68
  == Screenshots ==
69
 
70
  1. Variations on frontend
71
- 1. Add new attribute
72
- 1. Edit Attribute
73
- 1. Attribute color
74
- 1. Attribute label
75
- 1. Attribute image
76
- 1. Add new attribute color when edit a product
77
 
78
  == Changelog ==
79
 
 
 
 
 
 
 
 
 
 
 
 
 
 
80
  = 1.0.11 =
81
  * Compatible with latest wordpress.
82
 
@@ -118,4 +158,9 @@ Yes, it will work with any theme, but may require some styling to make it match
118
  * Add "swatches-support" class to the variations form
119
 
120
  = 1.0.0 =
121
- * Initial release.
 
 
 
 
 
1
  === Variation Swatches for WooCommerce ===
2
+ Contributors: variationswatches, themealien, zgani,minhnguyen25, mehbubrashid
3
+ Tags: variation swatches, woocommerce, product attribute, product color, product size, variable products
4
  Requires at least: 4.5
5
+ Tested up to: 5.8
6
+ Stable tag: 2.0.0
7
  WC requires at least: 3.2.0
8
+ WC tested up to: 5.6.0
9
  License: GPLv2 or later
10
  License URI: https://www.gnu.org/licenses/gpl-2.0.html
11
 
12
+ Creates variation swatches for WooCommerce, converts your variation dropdown into color, label, or photo swatches with ease, The original Variation Swatches for WooCommerce.
13
 
14
  == Description ==
15
 
18
 
19
  With a friendly and easy-to-use interface, you can add default color, image or label to each attribute in the attributes management page. It can also helps you pick the right style for quick-add attribute right inside the editing product page.
20
 
21
+ https://www.youtube.com/watch?v=1qGusf9IfFY&t
22
 
23
+ **Woosuite Variation Swatches for WooCommerce Features :**
24
+
25
+ * <a href="https://woosuite.com/plugins/woocommerce-variation-swatches/#button" rel="friend">Auto Convert All Variation Dropdowns To Button Swatch</a> - With a click of a button you can convert your dropdowns into button/label.
26
+ * <a href="https://woosuite.com/plugins/woocommerce-variation-swatches/#autoimage" rel="friend">Auto Convert Into Image Swatches*</a> - By toggling this option you can set dual color for those products that can not be described with one color.
27
+ * <a href="https://woosuite.com/plugins/woocommerce-variation-swatches/#dualcolor" rel="friend">Dual Color Variation Swatches*</a> - Automatically covert dropdowns to "Image Swatch" if variation has an image.
28
+ * <a href="https://woosuite.com/plugins/woocommerce-variation-swatches/#archive" rel="friend">Show swatches on archive / shop</a> - Let users find what they really want by showing your swatches on the shop archive.
29
+ * <a href="https://woosuite.com/plugins/woocommerce-variation-swatches/#shapes" rel="friend">Attribute Variation Swatches Shapes</a> - We have included three presets for you to choose from as well as advanced styling options to further customize your swatches.
30
+ * <a href="https://woosuite.com/plugins/woocommerce-variation-swatches/#outofstock" rel="friend">Out of Stock Variation Swatches Control</a> - With our recent update, we have included the option for you to manage how to handle your out-of-stock variation.
31
  * Completely integrate with WooCommerce plugin
32
  * Work on variable product only
33
  * Create attribute color swatches
37
  * Create new attribute swatch in product editing page
38
 
39
 
40
+ = What's Next =
41
+
42
+ If you like this WordPress popup plugin, then consider checking out our other projects:
43
+
44
+ * <a href="https://woosuite.com/plugins/woocommerce-additional-variation-images/" rel="friend" title="Additional variation images for WooCommerce">Additional variation images for WooCommerce</a> - Show additional variation images and videos to showcase your product key highlights.
45
+ * <a href="https://woosuite.com/plugins/woocommerce-show-variations-on-shop-page/">Show Variations on Shop Page</a> - Show your variation products on your shop page separately to increase your catalog size and the user experience.
46
+ * <a href="https://woosuite.com/plugins/dynamic-pricing-discount-rules/" rel="friend" title="Dynamic Pricing & Discount Rules for WooCommerce">Dynamic Pricing & Discount Rules for WooCommerce</a> - Create Buy one get one free offers, schedule promotions, tiered pricing, role base pricing, and much more.
47
+ * <a href="https://woosuite.com/plugins/min-max-quantities/" rel="friend" title="Minimum/Maximum Quantity for WooCommerce">Minimum/Maximum Quantity for WooCommerce</a> - Create quantity increments, spending rules, and as the name suggests minimum and maximum quantity for woocommerce.
48
+ * <a href="https://woosuite.com/plugins/woocommerce-product-bundles/">Product Bundles for WooCommerce</a> - Improve your average order value by creating irresistible product bundles.
49
+ * <a href="https://woosuite.com/plugins/wholesale/">Wholesale Suite for Woocommerce</a> - Maximize your store revenue by catering to wholesale customers, you can sell to B2B + B2C.
50
+ * <a href="https://woosuite.com/plugins/product-table/">Quick Order Form for WooCommerce</a> - Create a streamlined bulk order form to reduce friction in users checking out.
51
+ * <a href="https://woosuite.com/plugins/woocommerce-quick-view/">Product Quick View for WooCommerce</a> - Allows users to get a quick look at products without opening the product page.
52
+ * <a href="https://woosuite.com/plugins/restriction-rules/">Restriction Rules for WooCommerce</a> - Set your store to private mode, password protection, menu item restriction, hide products, and more.
53
+ * <a href="https://woosuite.com/plugins/sales-agent-reps/">Sales Agents for WooCommerce</a> - Grow your business by adding sale agents to your WooCommerce store.
54
+
55
+
56
+ Visit <a href="https://woosuite.com/blog/" rel="friend" title="WPBeginner">the Woosuite blog</a> to learn from our <a href="https://woosuite.com/woocommerce/" rel="friend" title="WooCommerce Tutorials">WordPress Tutorials</a> and find out about other <a href="https://woosuite.com/plugins/" rel="friend" title="Best WordPress Plugins">WooCommerce plugins</a>.
57
+
58
+
59
  == Installation ==
60
 
61
  = Automatic installation =
95
  == Screenshots ==
96
 
97
  1. Variations on frontend
98
+ 2. Add new attribute
99
+ 3. Edit Attribute
100
+ 4. Attribute color
101
+ 5. Attribute label
102
+ 6. Attribute image
103
+ 7. Add new attribute color when edit a product
104
 
105
  == Changelog ==
106
 
107
+ = 2.0.0 =
108
+ **MAJOR UPDATE**
109
+ * We have a brand new Settings page.
110
+ * Allow converting Dropdowns to Label or Image Swatches automatically.
111
+ * Allow enabling/disabling the built-in styles.
112
+ * Ability to control the Swatch (shape, position, alignment, limit, custom state colors).
113
+ * Ability to control the Tooltip (show/hide, custom styles)
114
+ * Added the Dual-colour feature for the Swatches color.
115
+ * Allow changing the Out of Stock behaviour.
116
+ * Allow designing the Swatch styles in Product and Archive/Shop pages.
117
+ * Allow showing/hiding the Swatches in the Archive/Shop pages.
118
+ * Allow showing/hiding the Clear link in Archive/Shop pages.
119
+
120
  = 1.0.11 =
121
  * Compatible with latest wordpress.
122
 
158
  * Add "swatches-support" class to the variations form
159
 
160
  = 1.0.0 =
161
+ * Initial release.
162
+
163
+ == Upgrade Notice ==
164
+
165
+ = 2.0.0 =
166
+ This is the major update. You might need to check the new Settings page after upgrading to make sure your plugin works as expected.
templates/admin/addons-pages.php ADDED
@@ -0,0 +1,53 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <div class="opt-desh-wrap">
2
+ <?php TA_WC_Variation_Swatches::get_template('admin/partials/dashboard-header.php'); ?>
3
+
4
+ <div class="opt-desh-body-wrap">
5
+ <div class="opt-desh-body">
6
+ <div class="opt-desh-container">
7
+
8
+ <?php TA_WC_Variation_Swatches::get_template('admin/partials/dashboard-menu.php'); ?>
9
+
10
+ <!-- module banner -->
11
+ <div class="opt-module-banner">
12
+ <div class="opt-module-banner-grid">
13
+ <div class="opt-main-content-banner">
14
+ <h3 class="opt-banner-title"><?php _e('All Woosuite Plugins','wcvs');?></h3>
15
+ <p><?php _e('You can view and check more details on our plugins below', 'wcvs');?></p>
16
+ </div>
17
+ <div class="opt-module-banner-img">
18
+ <img src="<?php echo WCVS_PLUGIN_URL;?>assets/images/wc-plugins.png" class="img-100" alt="">
19
+ </div>
20
+ </div>
21
+ </div>
22
+ <!-- module banner -->
23
+ <!-- module wrap -->
24
+ <div class="opt-modules-wrap">
25
+ <div class="opt-moules-head">
26
+ <div class="opt-module-filter" style="display: none;">
27
+ <label class="marketing-input-wrapper">
28
+ <span class="marketing-label marketing-label--in-field"><?php _e('Filter by', 'wcvs')?></span>
29
+ <div class="marketing-select-wrapper">
30
+ <svg class="icon marketing-select-wrapper__icon" aria-hidden="true" focusable="false"> <use xlink:href="#modules-caret-down"></use> </svg>
31
+
32
+ <select aria-describedby="MessageId_7e3d" aria-label="Reload content and sort by" id="SortByFilter_input" class="marketing-select marketing-select--in-field" name="sort_by_options[sort_by]">
33
+ <option value="wholesale"><?php _e('wholesale', 'wcvs')?></option>
34
+ <option value="wholesale2"><?php _e('wholesale 2', 'wcvs')?></option>
35
+ <option value="wholesale3"><?php _e('wholesale 3', 'wcvs')?></option>
36
+ </select>
37
+ </div>
38
+ </label>
39
+ </div>
40
+ </div>
41
+ <div class="opt-module-content-wrap">
42
+ <?php
43
+ TA_WC_Variation_Swatches::get_template('admin/partials/modules-grid.php');
44
+ ?>
45
+ </div>
46
+ </div>
47
+ <!-- module wrap -->
48
+ </div>
49
+ </div>
50
+ </div>
51
+
52
+
53
+ </div>
templates/admin/partials/dashboard-header.php ADDED
@@ -0,0 +1,11 @@
 
 
 
 
 
 
 
 
 
 
 
1
+ <!-- dashboard header -->
2
+ <div class="opt-desh-header">
3
+ <div class="opt-desh-headr-inner">
4
+ <div></div>
5
+ <div class="opt-desh-logo"><img src="<?php echo WCVS_PLUGIN_URL; ?>assets/images/wslogo-dash.png" alt="opt-img"></div>
6
+ <div class="theme-version">
7
+ <span class="version-text"><?php echo esc_html(__('Version ', 'wcvs') . WCVS_PLUGIN_VERSION); ?></span>
8
+ </div>
9
+ </div>
10
+ </div>
11
+ <!-- dashboard header -->
templates/admin/partials/dashboard-menu.php ADDED
@@ -0,0 +1,25 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <div class="opt-desh-menu-wrap">
2
+ <ul class="opt-desh-menu">
3
+ <li class="active">
4
+ <a href="<?php echo esc_url( admin_url( 'admin.php?page=variation-swatches-addons' ) ); ?>"
5
+ class="<?php echo isset( $_GET['page'] ) && $_GET['page'] == 'woosuite-core-addons' ? 'active-desh-menu' : ''; ?>">
6
+ <?php _e( 'Addons', 'wcvs' ); ?>
7
+ </a>
8
+ </li>
9
+ <li>
10
+ <a target="_blank" href="https://woosuite.com/docs?utm_source=user-dashboard&utm_medium=header" target="_blank">
11
+ <?php _e( 'Docs', 'wcvs' ); ?>
12
+ </a>
13
+ </li>
14
+ <li>
15
+ <a target="_blank" href="https://woosuite.com/support?utm_source=user-dashboard&utm_medium=header" target="_blank">
16
+ <?php _e( 'Support', 'wcvs' ); ?>
17
+ </a>
18
+ </li>
19
+ <li>
20
+ <a target="_blank" href="https://woosuite.com/my-account?utm_source=user-dashboard&utm_medium=header" target="_blank">
21
+ <?php _e( 'My Account ', 'wcvs' ); ?>
22
+ </a>
23
+ </li>
24
+ </ul>
25
+ </div>
templates/admin/partials/modules-grid.php ADDED
@@ -0,0 +1,46 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <?php
2
+ $addons_page = new VSWC_Addons_Page();
3
+ $modules = $addons_page->woosuite_core_get_modules();
4
+ if ( empty( $modules ) ) {
5
+ echo '<div class="settings-error error"><p>' . __( 'Unable to load modules from our server. Please try later or contact support.' ) . '</p></div>';
6
+ }
7
+
8
+ ?>
9
+ <div class="woosuite-core-modules">
10
+ <?php foreach ( $modules as $module ) : ?>
11
+ <div class="module-card">
12
+ <div class="header">
13
+ <img src="<?php echo $module->icons->{'1x'}; ?>" class="module-icon"/>
14
+ </div>
15
+ <div class="main">
16
+ <div class="title"><?php echo $module->name; ?></div>
17
+ <div class="desc">
18
+ <?php echo $module->short_description; ?>
19
+ </div>
20
+ </div>
21
+ <?php if ( ! empty( $module->last_updated ) ) : ?>
22
+ <div class="last-updated">
23
+ <strong><?php _e( 'Last Updated:', 'wcvs' ); ?></strong>
24
+ <?php
25
+ /* translators: %s: Human-readable time difference. */
26
+ printf( __( '%s ago' ), human_time_diff( strtotime( $module->last_updated ) ) );
27
+ ?>
28
+ </div>
29
+ <?php endif; ?>
30
+ <div class="footer">
31
+ <?php
32
+ if ( $module->homepage ) {
33
+ printf(
34
+ '<a class="action-btn learn-btn" href="%s" target="_blank">%s</a>',
35
+ $module->homepage,
36
+ __( 'Learn more', 'wcvs' )
37
+ );
38
+ }
39
+ ?>
40
+ </div>
41
+ </div>
42
+ <?php endforeach; ?>
43
+
44
+ <?php TA_WC_Variation_Swatches::get_template('admin/partials/support-card.php');?>
45
+
46
+ </div>
templates/admin/partials/panel-footer.php ADDED
@@ -0,0 +1,52 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!-- variation footer -->
2
+ <div class="swatch-variation-footer">
3
+ <div class="thd-panel thd-panel-support">
4
+ <div class="thd-panel-head">
5
+ <h3 class="thd-panel-title"> <?php _e( 'Support', 'wcvs' ); ?></h3>
6
+ </div>
7
+ <div class="thd-panel-content">
8
+ <div class="thd-conttent-primary">
9
+ <div class="thd-title">
10
+ <?php _e( 'Need help? Were here for you!', 'wcvs' ); ?> </div>
11
+
12
+ <div class="thd-description"><?php _e( 'Have a question? Hit a bug? Get the help you need, when you need it from our friendly support staff.', 'wcvs' ); ?></div>
13
+
14
+ <div class="thd-button-wrap">
15
+ <a href="https://woosuite.com/support/?ref=free" class="thd-button button"
16
+ target="_blank"><?php _e( 'Get Support ', 'wcvs' ); ?></a>
17
+ </div>
18
+ </div>
19
+
20
+ <div class="thd-conttent-secondary">
21
+ <div class="thd-title">
22
+ <?php _e( 'Priority Support', 'wcvs' ); ?>
23
+ <div class="thd-badge"><?php _e( 'pro', 'wcvs' ); ?></div>
24
+ </div>
25
+
26
+ <div class="thd-description"><?php _e( 'Want your questions answered faster? Go Pro to be first in the queue!', 'wcvs' ); ?></div>
27
+
28
+ <div class="thd-button-wrap">
29
+ <a href="https://woosuite.com/support/?ref=pro"
30
+ class="thd-button button" target="_blank"><?php _e( 'Go PRO', 'wcvs' ); ?></a>
31
+ </div>
32
+ </div>
33
+ </div>
34
+ </div>
35
+ <div class="thd-panel thd-panel-community">
36
+ <div class="thd-panel-head">
37
+ <h3 class="thd-panel-title"><?php _e( 'Custom development', 'wcvs' ); ?></h3>
38
+ </div>
39
+ <div class="thd-panel-content">
40
+ <div class="thd-title">
41
+ <?php _e( 'Do you need a custom plugin or edit to your site?', 'wcvs' ); ?></div>
42
+
43
+ <div class="thd-description"><?php _e( 'We have created top-class plugins for WooCommerce powering over 80,000 online stores, we can customize our plugins or create you something custom.', 'wcvs' ); ?></div>
44
+
45
+ <div class="thd-button-wrap">
46
+ <a href="https://woosuite.com/services?utm_source=user-dashboard&utm_medium=link" class="thd-button button"
47
+ target="_blank"><?php _e( 'Start a Project' ); ?></a>
48
+ </div>
49
+ </div>
50
+ </div>
51
+ </div>
52
+ <!-- variation footer -->
templates/admin/partials/panel-header.php ADDED
@@ -0,0 +1,42 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!-- variation head -->
2
+ <div class="variation-header-sticky">
3
+ <div class="variation-header-wrap">
4
+ <div class="variation-head">
5
+ <div class="varitaion-logo">
6
+ <img src="<?php echo WCVS_PLUGIN_URL . 'assets/images/wslogo-dash.png'; ?>" alt="">
7
+ </div>
8
+ <div class="variation-menu-outer">
9
+ <div class="variaion-munu-wrap">
10
+ <ul>
11
+ <li>
12
+ <a href="<?php echo esc_url( admin_url( 'admin.php?page=variation-swatches-addons' ) ); ?>"">
13
+ <?php _e( 'Addons', 'wcvs' ); ?>
14
+ </a>
15
+ </li>
16
+ <li>
17
+ <a href="https://woosuite.com/plugins/woocommerce-variation-swatches/free-vs-pro/?utm_source=user-dashboard&utm_medium=header" target="_blank">
18
+ <?php _e( 'Free vs Pro', 'wcvs' ); ?>
19
+ </a>
20
+ </li>
21
+ <li>
22
+ <a href="https://woosuite.com/support?utm_source=user-dashboard&utm_medium=header" target="_blank">
23
+ <?php _e( 'Support', 'wcvs' ); ?>
24
+ </a>
25
+ </li>
26
+ <li>
27
+ <a href="https://woosuite.com/docs?utm_source=user-dashboard&utm_medium=header" target="_blank">
28
+ <?php _e( 'Docs', 'wcvs' ); ?>
29
+ </a>
30
+ </li>
31
+ </ul>
32
+ <div class="variation-head-btns">
33
+ <button class="vh-btn vh-discard-btn"><?php _e( 'Discard', 'wcvs' ); ?></button>
34
+ <button class="vh-btn" id="tawcvs_save_settings"><?php _e( 'Save', 'wcvs' ); ?></button>
35
+ </div>
36
+ </div>
37
+ </div>
38
+
39
+ </div>
40
+ </div>
41
+ </div>
42
+ <!-- variation head -->
templates/admin/partials/panel-sidebar.php ADDED
@@ -0,0 +1,37 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!-- variation sidebar -->
2
+ <div class="thd-main-sidebar">
3
+ <div class="swatch-var-widget-wrap">
4
+ <!-- widget -->
5
+
6
+ <div class="swatch-var-widget">
7
+ <h3 class="swatch-video-title"> <?php _e( 'Getting Started', 'wcvs' ) ?></h3>
8
+ <div class="swat-video-frame">
9
+ <iframe src="https://www.youtube.com/embed/1qGusf9IfFY" title="YouTube video player" frameborder="0"
10
+ allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
11
+ allowfullscreen></iframe>
12
+ </div>
13
+ </div>
14
+ <!-- widget -->
15
+
16
+ <!-- widget -->
17
+ <div class="swatch-var-widget">
18
+ <h2 class="swatch-video-title"> <?php _e( 'Works well with..', 'wcvs' ) ?></h2>
19
+ <div class="swatch-var-addon-wrap">
20
+ <div class="swatch-var-addon">
21
+ <a href="https://woosuite.com/plugins/woocommerce-additional-variation-images/?utm_source=user-dashboard&utm_medium=works-well-with" class="swatch-addon-link" target="_blank">
22
+ <h2><?php _e( 'WooCommerce Variations Gallery', 'wcvs' ) ?></h2></a>
23
+ <p><?php _e( 'Add any number of images and videos to your variable product variations.', 'wcvs' ) ?></p>
24
+ <a href="https://woosuite.com/plugins/woocommerce-additional-variation-images/?utm_source=user-dashboard&utm_medium=works-well-with" class="swatch-submit-link" target="_blank"><?php _e( 'Get It now', 'wcvs' ) ?></a>
25
+ </div>
26
+ <div class="swatch-var-addon">
27
+ <a href="https://woosuite.com/plugins/woocommerce-show-variations-on-shop-page/?utm_source=user-dashboard&utm_medium=works-well-with" class="swatch-addon-link" target="_blank">
28
+ <h2><?php _e( 'WooCommerce Show single variation', 'wcvs' ) ?></h2></a>
29
+ <p><?php _e( 'Improve the user experience by showing your variation products on your shop page. Increase your catalog size in minutes.', 'wcvs' ) ?></p>
30
+ <a href="https://woosuite.com/plugins/woocommerce-show-variations-on-shop-page/?utm_source=user-dashboard&utm_medium=works-well-with" class="swatch-submit-link" target="_blank"><?php _e( 'Get It now', 'wcvs' ) ?></a>
31
+ </div>
32
+ </div>
33
+ </div>
34
+ <!-- widget -->
35
+ </div>
36
+ </div>
37
+ <!-- variation sidebar -->
templates/admin/partials/panel-video-tutorials.php ADDED
@@ -0,0 +1,39 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!--video tutorial -->
2
+ <div class="swatch-variation-tutorial">
3
+ <div class="theplus-panel-row theplus-mt-50">
4
+ <div class="theplus-panel-col theplus-panel-col-100">
5
+ <div class="theplus-panel-sec theplus-p-20 theplus-welcome-video">
6
+ <div class="theplus-sec-title">Video Tutorials</div>
7
+ <div class="theplus-sec-subtitle">Checkout Few of our latest video tutorials</div>
8
+ <div class="theplus-sec-border"></div>
9
+ <div class="theplus-panel-row theplus-panel-relative">
10
+ <a href="https://www.youtube.com/playlist?list=PLFRO-irWzXaLK9H5opSt88xueTnRhqvO5 "
11
+ class="theplus-more-video" target="_blank">
12
+ Our Full Playlist
13
+ </a>
14
+ <div class="theplus-panel-col theplus-panel-col-25">
15
+ <a href="https://youtu.be/HY5KlYuWP5k" class="theplus-panel-video-list" target="_blank">
16
+ <img src="<?php echo WCVS_PLUGIN_URL . 'assets/images/video-1.jpg'; ?>">
17
+ </a>
18
+ </div>
19
+ <div class="theplus-panel-col theplus-panel-col-25">
20
+ <a href="https://youtu.be/9-8Ftlb79tI" class="theplus-panel-video-list" target="_blank">
21
+ <img src="<?php echo WCVS_PLUGIN_URL . 'assets/images/video-2.jpg'; ?>">
22
+ </a>
23
+ </div>
24
+ <div class="theplus-panel-col theplus-panel-col-25">
25
+ <a href="https://youtu.be/Bwp3GBOlkaw" class="theplus-panel-video-list" target="_blank">
26
+ <img src="<?php echo WCVS_PLUGIN_URL . 'assets/images/video-3.jpg'; ?>">
27
+ </a>
28
+ </div>
29
+ <div class="theplus-panel-col theplus-panel-col-25">
30
+ <a href="https://youtu.be/kl2xSnl2YqM" class="theplus-panel-video-list" target="_blank">
31
+ <img src="<?php echo WCVS_PLUGIN_URL . 'assets/images/video-4.jpg'; ?>">
32
+ </a>
33
+ </div>
34
+ </div>
35
+ </div>
36
+ </div>
37
+ </div>
38
+ </div>
39
+ <!--video tutorial -->
templates/admin/partials/support-card.php ADDED
@@ -0,0 +1,17 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <div class="module-card">
2
+ <div class="header">
3
+ <img src="<?php echo WCVS_PLUGIN_URL . 'assets/images/support.png'; ?>" class="module-icon" />
4
+ </div>
5
+ <div class="main">
6
+ <div class="title"><?php _e( 'Support' ); ?></div>
7
+ <div class="desc">
8
+ <?php _e( 'Our support team are available 10am to 5pm GMT Monday – Friday.
9
+ Our typical reply time is within 48 working hours.' ); ?>
10
+ </div>
11
+ </div>
12
+ <div class="footer">
13
+ <a class="action-btn support-btn" target="_blank" href="https://woosuite.com/support/">
14
+ <?php _e( 'Get Support' ); ?>
15
+ </a>
16
+ </div>
17
+ </div>
templates/admin/pro-feature-popup.php ADDED
@@ -0,0 +1,26 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <div class="wcvs-popup wcvs-pro-feature-popup">
2
+ <div class="popup-close"></div>
3
+ <div class="content">
4
+ <div class="popup-logo">
5
+ <img src="<?php echo WCVS_PLUGIN_URL.'assets/images/wslogo.png'; ?>">
6
+ </div>
7
+ <div class="popup-content">
8
+ <h2 class="popup-title"><?php _e( 'Upgrade For Additional Features', 'wcvs' ); ?></h2>
9
+ <p class="popup-txt"><?php _e( 'Get access to more features access to paid support and much more. Click below for all the details.', 'wcvs' ); ?></p>
10
+ <div class="popup-cta">
11
+ <a href="https://woosuite.com/lp/variations-swatches-upgrade/" target="_blank" class="button button-primary popup-btn"><?php _e( 'See Features & Pricing', 'wcvs' ); ?></a>
12
+ <div class="popup-rating">
13
+ <span class="dashicons dashicons-star-filled popup-star"></span>
14
+ <span class="dashicons dashicons-star-filled popup-star"></span>
15
+ <span class="dashicons dashicons-star-filled popup-star"></span>
16
+ <span class="dashicons dashicons-star-filled popup-star"></span>
17
+ <span class="dashicons dashicons-star-half popup-star"></span>
18
+ </div>
19
+ </div>
20
+ <div class="popup-bonus">
21
+ <p class="popup-txt"><?php echo sprintf( __( '<strong>Bonus: </strong> Variation swatches lite users get <a href="%s" %s>35%% off regular price</a>, automatically applied at checkout.', 'wcvs' ), 'https://woosuite.com/lp/variations-swatches-upgrade/', 'target="_blank"' ); ?></p>
22
+ </div>
23
+ </div>
24
+ </div>
25
+ </div>
26
+ <div class="wcvs-popup-blur"></div>
templates/admin/setting-panel.php ADDED
@@ -0,0 +1,69 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!-- render webpage -->
2
+
3
+ <div class="variation-wrap">
4
+
5
+ <?php do_action( 'woosuite_child_plugin_header', WCVS_PLUGIN_NAME ); ?>
6
+
7
+ <div class="thd-theme-dashboard-wrap">
8
+ <!-- variation body -->
9
+ <div class="thd-wrap thd-theme-dashboard">
10
+ <div class="wrap" id="tawcvs-settings-wrap">
11
+ <div class="thd-main">
12
+ <h2 style="margin: 0;padding:0;"></h2>
13
+ <!-- variation main content -->
14
+ <div class="thd-main-content">
15
+ <?php
16
+ if ( isset( $_POST['woosuite_saved_variation_settings'] ) ) {
17
+ $show_success_message = 'is-dismissible';
18
+ } else {
19
+ $show_success_message = 'hidden';
20
+ }
21
+ ?>
22
+ <div class="wcvs-notice wcvs-saving-notice notice notice-info hidden">
23
+ <p><?php _e( 'Saving...', 'wcvs' ); ?></p>
24
+ </div>
25
+ <div class="wcvs-notice wcvs-saved-notice notice notice-success <?php echo $show_success_message; ?>">
26
+ <p><?php _e( 'Settings saved successfully.', 'wcvs' ); ?></p>
27
+ </div>
28
+ <div class="wcvs-notice wcvs-failed-notice notice notice-error hidden">
29
+ <p><?php _e( 'Settings saved un-successfully.', 'wcvs' ); ?></p>
30
+ </div>
31
+ <div class="variation-accordion-outer">
32
+ <div class="clear"></div>
33
+ <div class="variation-main-content-head">
34
+ <p class="vmch-text">
35
+ <?php if ( TA_WC_Variation_Swatches::is_woo_core_active() ): ?>
36
+ <a href="<?php echo esc_url( admin_url( 'admin.php?page=woosuite-core' ) ); ?>">
37
+ <span class="dashicons dashicons-arrow-left-alt"></span>
38
+ </a>
39
+ <?php else: ?>
40
+ <span class="dashicons dashicons-admin-tools"></span>
41
+ <?php endif; ?>
42
+ <?php _e( 'Variations Swatches for woocommerce by Woosuite', 'wcvs' ); ?>
43
+ </p>
44
+ </div>
45
+ <!-- variation accordio -->
46
+ <div class="variation-accordion-wrap woosuite-master-form">
47
+ <form method="POST" action="" enctype="multipart/form-data">
48
+ <input type="hidden" name="woosuite_saving_variation_settings" value="ok">
49
+ <?php do_action( 'woosuite_variation_swatches_settings_fields_html' ); ?>
50
+ </form>
51
+ </div>
52
+ <!-- variation accordio -->
53
+ </div>
54
+ <div class="clear"></div>
55
+
56
+ </div>
57
+ <!-- variation main content -->
58
+ <?php do_action( 'woosuite_child_plugin_sidebar', WCVS_PLUGIN_NAME ); ?>
59
+ </div>
60
+ <div class="clear"></div>
61
+ <?php
62
+ do_action( 'woosuite_child_plugin_footer', WCVS_PLUGIN_NAME );
63
+ do_action( 'woosuite_child_plugin_video_tutorials', WCVS_PLUGIN_NAME );
64
+ ?>
65
+ </div>
66
+ </div>
67
+ <!-- variation body -->
68
+ </div>
69
+ </div>
templates/admin/welcome-popup-version-2_0_0.php ADDED
@@ -0,0 +1,18 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <div class="wcvs-popup wcvs-welcome-popup" style="display: block">
2
+ <div class="popup-close"></div>
3
+ <div class="content">
4
+ <div class="popup-logo">
5
+ <img src="<?php echo WCVS_PLUGIN_URL . 'assets/images/wslogo.png'; ?>">
6
+ </div>
7
+ <div class="popup-content">
8
+ <h2 class="popup-title"><?php _e( 'What\'s new in the Variation Swatches 2.0:', 'wcvs' ); ?></h2>
9
+ <div class="popup-iframe">
10
+ <iframe width="560" height="315" src="https://www.youtube.com/embed/I3poqB-EigI"
11
+ title="YouTube video player" frameborder="0"
12
+ allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
13
+ allowfullscreen></iframe>
14
+ </div>
15
+ </div>
16
+ </div>
17
+ </div>
18
+ <div class="wcvs-popup-blur" style="display: block"></div>
variation-swatches-for-woocommerce.php CHANGED
@@ -1,17 +1,17 @@
1
  <?php
2
  /**
3
- * Plugin Name: Variation Swatcher for WooCommerce
4
- * Plugin URI: http://themealien.com/wordpress-plugin/woocommerce-variation-swatches
5
- * Description: An extension of WooCommerce to make variable products be more beauty and friendly to users.
6
- * Version: 1.0.11
7
- * Author: ThemeAlien
8
- * Author URI: http://themealien.com/
9
  * Requires at least: 4.5
10
- * Tested up to: 5.7
11
  * Text Domain: wcvs
12
  * Domain Path: /languages
13
  * WC requires at least: 3.0.0
14
- * WC tested up to: 5.4.1
15
  *
16
  * License: GPLv2 or later
17
  * License URI: https://www.gnu.org/licenses/gpl-2.0.html
@@ -26,6 +26,26 @@ if ( ! defined( 'TAWC_VS_PLUGIN_FILE' ) ) {
26
  define( 'TAWC_VS_PLUGIN_FILE', __FILE__ );
27
  }
28
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
29
  if ( ! function_exists( 'ta_wc_variation_swatches_wc_notice' ) ) {
30
  /**
31
  * Display notice in case of WooCommerce plugin is not activated
@@ -33,9 +53,9 @@ if ( ! function_exists( 'ta_wc_variation_swatches_wc_notice' ) ) {
33
  function ta_wc_variation_swatches_wc_notice() {
34
  ?>
35
 
36
- <div class="error">
37
- <p><?php esc_html_e( 'Variation Swatcher for WooCommerce is enabled but not effective. It requires WooCommerce in order to work.', 'wcvs' ); ?></p>
38
- </div>
39
 
40
  <?php
41
  }
@@ -48,9 +68,9 @@ if ( ! function_exists( 'ta_wc_variation_swatches_pro_notice' ) ) {
48
  function ta_wc_variation_swatches_pro_notice() {
49
  ?>
50
 
51
- <div class="error">
52
- <p><?php esc_html_e( 'No need to activate the free version of Variation Swatcher for WooCommerce plugin while the pro version is activated.', 'wcvs' ); ?></p>
53
- </div>
54
 
55
  <?php
56
  }
1
  <?php
2
  /**
3
+ * Plugin Name: Variation Swatches for WooCommerce
4
+ * Plugin URI: https://woosuite.com/plugins/woocommerce-variation-swatches/
5
+ * Description: Creates variation swatches for WooCommerce, converts your variation dropdown into color, label, or photo swatches with ease, The original Variation Swatches for WooCommerce.
6
+ * Version: 2.0.0
7
+ * Author: Woosuite
8
+ * Author URI: https://woosuite.com/
9
  * Requires at least: 4.5
10
+ * Tested up to: 5.8.1
11
  * Text Domain: wcvs
12
  * Domain Path: /languages
13
  * WC requires at least: 3.0.0
14
+ * WC tested up to: 5.6.0
15
  *
16
  * License: GPLv2 or later
17
  * License URI: https://www.gnu.org/licenses/gpl-2.0.html
26
  define( 'TAWC_VS_PLUGIN_FILE', __FILE__ );
27
  }
28
 
29
+ if ( ! defined( 'WCVS_PLUGIN_VERSION' ) ) {
30
+ define( 'WCVS_PLUGIN_VERSION', '2.0.0' );
31
+ }
32
+
33
+ if ( ! defined( 'WCVS_PLUGIN_URL' ) ) {
34
+ define( 'WCVS_PLUGIN_URL', plugin_dir_url( TAWC_VS_PLUGIN_FILE ) );
35
+ }
36
+
37
+ if ( ! defined( 'WCVS_PLUGIN_DIR' ) ) {
38
+ define( 'WCVS_PLUGIN_DIR', plugin_dir_path( TAWC_VS_PLUGIN_FILE ) );
39
+ }
40
+
41
+ if ( ! defined( 'WCVS_PLUGIN_NAME' ) ) {
42
+ define( 'WCVS_PLUGIN_NAME', 'variation-swatches-for-woocommerce' );
43
+ }
44
+
45
+ if ( ! defined( 'WCVS_NEED_TO_SHOW_NOTICE_AFTER_UPGRADED' ) ) {
46
+ define( 'WCVS_NEED_TO_SHOW_NOTICE_AFTER_UPGRADED', true );
47
+ }
48
+
49
  if ( ! function_exists( 'ta_wc_variation_swatches_wc_notice' ) ) {
50
  /**
51
  * Display notice in case of WooCommerce plugin is not activated
53
  function ta_wc_variation_swatches_wc_notice() {
54
  ?>
55
 
56
+ <div class="error">
57
+ <p><?php esc_html_e( 'Variation Swatcher for WooCommerce is enabled but not effective. It requires WooCommerce in order to work.', 'wcvs' ); ?></p>
58
+ </div>
59
 
60
  <?php
61
  }
68
  function ta_wc_variation_swatches_pro_notice() {
69
  ?>
70
 
71
+ <div class="error">
72
+ <p><?php esc_html_e( 'No need to activate the free version of Variation Swatcher for WooCommerce plugin while the pro version is activated.', 'wcvs' ); ?></p>
73
+ </div>
74
 
75
  <?php
76
  }