@websy/websy-designs 1.1.0 → 1.1.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/websy-designs-es6.debug.js +21 -11
- package/dist/websy-designs-es6.js +19 -8
- package/dist/websy-designs-es6.min.js +1 -1
- package/dist/websy-designs.debug.js +205 -11
- package/dist/websy-designs.js +391 -193
- package/dist/websy-designs.min.css +1 -1
- package/dist/websy-designs.min.js +1 -1
- package/index.js +8 -8
- package/package.json +2 -2
package/dist/websy-designs.js
CHANGED
|
@@ -46,6 +46,7 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
|
|
|
46
46
|
APIService
|
|
47
47
|
ButtonGroup
|
|
48
48
|
WebsyUtils
|
|
49
|
+
WebsyCarousel
|
|
49
50
|
Pager
|
|
50
51
|
*/
|
|
51
52
|
|
|
@@ -286,6 +287,192 @@ var ButtonGroup = /*#__PURE__*/function () {
|
|
|
286
287
|
|
|
287
288
|
return ButtonGroup;
|
|
288
289
|
}();
|
|
290
|
+
/* global */
|
|
291
|
+
|
|
292
|
+
|
|
293
|
+
var WebsyCarousel = /*#__PURE__*/function () {
|
|
294
|
+
function WebsyCarousel(elementId, options) {
|
|
295
|
+
_classCallCheck(this, WebsyCarousel);
|
|
296
|
+
|
|
297
|
+
var DEFAULTS = {
|
|
298
|
+
currentFrame: 0,
|
|
299
|
+
frameDuration: 4000,
|
|
300
|
+
showFrameSelector: true,
|
|
301
|
+
showPrevNext: true
|
|
302
|
+
};
|
|
303
|
+
this.playTimeoutFn = null;
|
|
304
|
+
this.options = _extends({}, DEFAULTS, options);
|
|
305
|
+
|
|
306
|
+
if (!elementId) {
|
|
307
|
+
console.log('No element Id provided');
|
|
308
|
+
}
|
|
309
|
+
|
|
310
|
+
var el = document.getElementById(elementId);
|
|
311
|
+
|
|
312
|
+
if (el) {
|
|
313
|
+
this.elementId = elementId;
|
|
314
|
+
el.addEventListener('click', this.handleClick.bind(this));
|
|
315
|
+
this.render();
|
|
316
|
+
}
|
|
317
|
+
}
|
|
318
|
+
|
|
319
|
+
_createClass(WebsyCarousel, [{
|
|
320
|
+
key: "handleClick",
|
|
321
|
+
value: function handleClick(event) {
|
|
322
|
+
if (event.target.classList.contains('websy-next-arrow')) {
|
|
323
|
+
this.next();
|
|
324
|
+
}
|
|
325
|
+
|
|
326
|
+
if (event.target.classList.contains('websy-prev-arrow')) {
|
|
327
|
+
this.prev();
|
|
328
|
+
}
|
|
329
|
+
|
|
330
|
+
if (event.target.classList.contains('websy-progress-btn' || 'websy-progress-btn-active')) {
|
|
331
|
+
var index = +event.target.getAttribute('data-index');
|
|
332
|
+
var prevFrameIndex = this.options.currentFrame;
|
|
333
|
+
this.options.currentFrame = index;
|
|
334
|
+
this.showFrame(prevFrameIndex, index);
|
|
335
|
+
}
|
|
336
|
+
}
|
|
337
|
+
}, {
|
|
338
|
+
key: "next",
|
|
339
|
+
value: function next() {
|
|
340
|
+
this.pause();
|
|
341
|
+
var prevFrameIndex = this.options.currentFrame;
|
|
342
|
+
|
|
343
|
+
if (this.options.currentFrame === this.options.frames.length - 1) {
|
|
344
|
+
this.options.currentFrame = 0;
|
|
345
|
+
} else {
|
|
346
|
+
this.options.currentFrame++;
|
|
347
|
+
}
|
|
348
|
+
|
|
349
|
+
this.showFrame(prevFrameIndex, this.options.currentFrame); // this.play()
|
|
350
|
+
// document.getElementById(`${this.elementId}_frame_${this.options.currentFrame}`)
|
|
351
|
+
// .style.transform = `translateX(-100%)`
|
|
352
|
+
// if (`${this.options.currentFrame === this.options.frames.length - 1}`) {
|
|
353
|
+
// document.getElementById`${this.elementId}_frame_${this.options.currentFrame}`.style.transform = `translateX('-100%')`
|
|
354
|
+
// }
|
|
355
|
+
}
|
|
356
|
+
}, {
|
|
357
|
+
key: "pause",
|
|
358
|
+
value: function pause() {
|
|
359
|
+
if (this.playTimeoutFn) {
|
|
360
|
+
clearTimeout(this.playTimeoutFn);
|
|
361
|
+
}
|
|
362
|
+
}
|
|
363
|
+
}, {
|
|
364
|
+
key: "play",
|
|
365
|
+
value: function play() {
|
|
366
|
+
var _this2 = this;
|
|
367
|
+
|
|
368
|
+
this.playTimeoutFn = setTimeout(function () {
|
|
369
|
+
var prevFrameIndex = _this2.options.currentFrame;
|
|
370
|
+
|
|
371
|
+
if (_this2.options.currentFrame === _this2.options.frames.length - 1) {
|
|
372
|
+
_this2.options.currentFrame = 0;
|
|
373
|
+
} else {
|
|
374
|
+
_this2.options.currentFrame++;
|
|
375
|
+
}
|
|
376
|
+
|
|
377
|
+
_this2.showFrame(prevFrameIndex, _this2.options.currentFrame);
|
|
378
|
+
|
|
379
|
+
_this2.play();
|
|
380
|
+
}, this.options.frameDuration);
|
|
381
|
+
}
|
|
382
|
+
}, {
|
|
383
|
+
key: "prev",
|
|
384
|
+
value: function prev() {
|
|
385
|
+
this.pause();
|
|
386
|
+
var prevFrameIndex = this.options.currentFrame;
|
|
387
|
+
|
|
388
|
+
if (this.options.currentFrame === 0) {
|
|
389
|
+
this.options.currentFrame = this.options.frames.length - 1;
|
|
390
|
+
} else {
|
|
391
|
+
this.options.currentFrame--;
|
|
392
|
+
}
|
|
393
|
+
|
|
394
|
+
this.showFrame(prevFrameIndex, this.options.currentFrame); // this.play()
|
|
395
|
+
// document.getElementById(`${this.elementId}_frame_${this.options.currentFrame}`)
|
|
396
|
+
// .style.transform = `translateX(100%)`
|
|
397
|
+
}
|
|
398
|
+
}, {
|
|
399
|
+
key: "render",
|
|
400
|
+
value: function render(options) {
|
|
401
|
+
this.options = _extends({}, this.options, options);
|
|
402
|
+
this.resize();
|
|
403
|
+
}
|
|
404
|
+
}, {
|
|
405
|
+
key: "resize",
|
|
406
|
+
value: function resize() {
|
|
407
|
+
var _this3 = this;
|
|
408
|
+
|
|
409
|
+
var el = document.getElementById(this.elementId);
|
|
410
|
+
|
|
411
|
+
if (el) {
|
|
412
|
+
var html = "\n <div class=\"websy-carousel\">\n ";
|
|
413
|
+
this.options.frames.forEach(function (frame, frameIndex) {
|
|
414
|
+
html += "\n <div id=\"".concat(_this3.elementId, "_frame_").concat(frameIndex, "\" class=\"websy-frame-container animate\" style=\"transform: translateX(").concat(frameIndex === 0 ? '0' : '100%', ")\">\n ");
|
|
415
|
+
frame.images.forEach(function (image) {
|
|
416
|
+
html += "\n <div style=\"".concat(image.style || 'position: absolute; width: 100%; height: 100%; top: 0; left: 0;', " background-image: url('").concat(image.url, "')\" class=\"").concat(image.classes || '', " websy-carousel-image\">\n </div>\n ");
|
|
417
|
+
});
|
|
418
|
+
frame.text && frame.text.forEach(function (text) {
|
|
419
|
+
html += "\n <div style=\"".concat(text.style || 'position: absolute; width: 100%; height: 100%; top: 0; left: 0;', "\" class=\"").concat(text.classes || '', " websy-carousel-image\">\n ").concat(text.html, "\n </div>\n ");
|
|
420
|
+
});
|
|
421
|
+
html += "</div>";
|
|
422
|
+
});
|
|
423
|
+
|
|
424
|
+
if (this.options.showFrameSelector === true) {
|
|
425
|
+
html += "<div class=\"websy-btn-parent\">";
|
|
426
|
+
this.options.frames.forEach(function (frame, frameIndex) {
|
|
427
|
+
html += "\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\" data-index=\"".concat(frameIndex, "\" id=\"").concat(_this3.elementId, "_selector_").concat(frameIndex, "\" \n class=\"websy-progress-btn ").concat(_this3.options.currentFrame === frameIndex ? 'websy-progress-btn-active' : '', "\">\n <title>Ellipse</title><circle cx=\"256\" cy=\"256\" r=\"192\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"32\"/>\n </svg>\n ");
|
|
428
|
+
});
|
|
429
|
+
html += "</div>";
|
|
430
|
+
}
|
|
431
|
+
|
|
432
|
+
if (this.options.showPrevNext === true) {
|
|
433
|
+
html += "\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"websy-prev-arrow\"\n viewBox=\"0 0 512 512\">\n <title>Caret Back</title>\n <path d=\"M321.94 98L158.82 237.78a24 24 0 000 36.44L321.94 414c15.57 13.34 39.62 2.28 39.62-18.22v-279.6c0-20.5-24.05-31.56-39.62-18.18z\"/>\n </svg>\n </div>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\" class=\"websy-next-arrow\">\n <title>Caret Forward</title>\n <path d=\"M190.06 414l163.12-139.78a24 24 0 000-36.44L190.06 98c-15.57-13.34-39.62-2.28-39.62 18.22v279.6c0 20.5 24.05 31.56 39.62 18.18z\"/>\n </svg>\n ";
|
|
434
|
+
}
|
|
435
|
+
|
|
436
|
+
html += "\n </div>\n ";
|
|
437
|
+
el.innerHTML = html;
|
|
438
|
+
} // this.play()
|
|
439
|
+
// this.showFrameSelector()
|
|
440
|
+
|
|
441
|
+
}
|
|
442
|
+
}, {
|
|
443
|
+
key: "showFrame",
|
|
444
|
+
value: function showFrame(prevFrameIndex, currFrameIndex) {
|
|
445
|
+
var prevTranslateX = prevFrameIndex > currFrameIndex ? '100%' : '-100%';
|
|
446
|
+
var nextTranslateX = prevFrameIndex < currFrameIndex ? '100%' : '-100%';
|
|
447
|
+
|
|
448
|
+
if (currFrameIndex === 0 && prevFrameIndex === this.options.frames.length - 1) {
|
|
449
|
+
prevTranslateX = '-100%';
|
|
450
|
+
nextTranslateX = '100%';
|
|
451
|
+
} else if (prevFrameIndex === 0 && currFrameIndex === this.options.frames.length - 1) {
|
|
452
|
+
prevTranslateX = '100%';
|
|
453
|
+
nextTranslateX = '-100%';
|
|
454
|
+
}
|
|
455
|
+
|
|
456
|
+
var prevF = document.getElementById("".concat(this.elementId, "_frame_").concat(prevFrameIndex));
|
|
457
|
+
prevF.style.transform = "translateX(".concat(prevTranslateX, ")");
|
|
458
|
+
var btnInactive = document.getElementById("".concat(this.elementId, "_selector_").concat(prevFrameIndex));
|
|
459
|
+
btnInactive.classList.remove('websy-progress-btn-active');
|
|
460
|
+
var newF = document.getElementById("".concat(this.elementId, "_frame_").concat(currFrameIndex));
|
|
461
|
+
newF.classList.remove('animate');
|
|
462
|
+
newF.style.transform = "translateX(".concat(nextTranslateX, ")");
|
|
463
|
+
setTimeout(function () {
|
|
464
|
+
newF.classList.add('animate');
|
|
465
|
+
newF.style.transform = 'translateX(0%)';
|
|
466
|
+
}, 100);
|
|
467
|
+
var btnActive = document.getElementById("".concat(this.elementId, "_selector_").concat(currFrameIndex));
|
|
468
|
+
btnActive.classList.add('websy-progress-btn-active');
|
|
469
|
+
} // showFrameSelector () {
|
|
470
|
+
// }
|
|
471
|
+
|
|
472
|
+
}]);
|
|
473
|
+
|
|
474
|
+
return WebsyCarousel;
|
|
475
|
+
}();
|
|
289
476
|
|
|
290
477
|
var WebsyDatePicker = /*#__PURE__*/function () {
|
|
291
478
|
function WebsyDatePicker(elementId, options) {
|
|
@@ -492,7 +679,7 @@ var WebsyDatePicker = /*#__PURE__*/function () {
|
|
|
492
679
|
}, {
|
|
493
680
|
key: "highlightRange",
|
|
494
681
|
value: function highlightRange() {
|
|
495
|
-
var
|
|
682
|
+
var _this4 = this;
|
|
496
683
|
|
|
497
684
|
var el = document.getElementById("".concat(this.elementId, "_dateList"));
|
|
498
685
|
var dateEls = el.querySelectorAll('.websy-dp-date');
|
|
@@ -563,9 +750,9 @@ var WebsyDatePicker = /*#__PURE__*/function () {
|
|
|
563
750
|
this.currentselection.forEach(function (d) {
|
|
564
751
|
var dateEl;
|
|
565
752
|
|
|
566
|
-
if (
|
|
753
|
+
if (_this4.options.mode === 'date') {
|
|
567
754
|
dateEl = document.getElementById("".concat(d, "_date"));
|
|
568
|
-
} else if (
|
|
755
|
+
} else if (_this4.options.mode === 'year') {
|
|
569
756
|
dateEl = document.getElementById("".concat(d, "_year"));
|
|
570
757
|
}
|
|
571
758
|
|
|
@@ -614,7 +801,7 @@ var WebsyDatePicker = /*#__PURE__*/function () {
|
|
|
614
801
|
}, {
|
|
615
802
|
key: "renderDates",
|
|
616
803
|
value: function renderDates(disabledDates) {
|
|
617
|
-
var
|
|
804
|
+
var _this5 = this;
|
|
618
805
|
|
|
619
806
|
var disabled = [];
|
|
620
807
|
this.validDates = [];
|
|
@@ -622,9 +809,9 @@ var WebsyDatePicker = /*#__PURE__*/function () {
|
|
|
622
809
|
|
|
623
810
|
if (disabledDates) {
|
|
624
811
|
disabled = disabledDates.map(function (d) {
|
|
625
|
-
if (
|
|
812
|
+
if (_this5.options.mode === 'date') {
|
|
626
813
|
return d.getTime();
|
|
627
|
-
} else if (
|
|
814
|
+
} else if (_this5.options.mode === 'year') {
|
|
628
815
|
return d;
|
|
629
816
|
}
|
|
630
817
|
|
|
@@ -771,10 +958,10 @@ var WebsyDatePicker = /*#__PURE__*/function () {
|
|
|
771
958
|
}, {
|
|
772
959
|
key: "renderRanges",
|
|
773
960
|
value: function renderRanges() {
|
|
774
|
-
var
|
|
961
|
+
var _this6 = this;
|
|
775
962
|
|
|
776
963
|
return this.options.ranges[this.options.mode].map(function (r, i) {
|
|
777
|
-
return "\n <li data-index='".concat(i, "' class='websy-date-picker-range ").concat(i ===
|
|
964
|
+
return "\n <li data-index='".concat(i, "' class='websy-date-picker-range ").concat(i === _this6.selectedRange ? 'active' : '', " ").concat(r.disabled === true ? 'websy-disabled-range' : '', "'>").concat(r.label, "</li>\n ");
|
|
778
965
|
}).join('') + "<li data-index='-1' class='websy-date-picker-range ".concat(this.selectedRange === -1 ? 'active' : '', "'>Custom</li>");
|
|
779
966
|
}
|
|
780
967
|
}, {
|
|
@@ -889,15 +1076,15 @@ var WebsyDatePicker = /*#__PURE__*/function () {
|
|
|
889
1076
|
}, {
|
|
890
1077
|
key: "updateRange",
|
|
891
1078
|
value: function updateRange() {
|
|
892
|
-
var
|
|
1079
|
+
var _this7 = this;
|
|
893
1080
|
|
|
894
1081
|
var range;
|
|
895
1082
|
|
|
896
1083
|
if (this.selectedRange === -1) {
|
|
897
1084
|
var list = (this.currentselection.length > 0 ? this.currentselection : this.selectedRangeDates).map(function (d) {
|
|
898
|
-
if (
|
|
1085
|
+
if (_this7.options.mode === 'date') {
|
|
899
1086
|
return d.toLocaleDateString();
|
|
900
|
-
} else if (
|
|
1087
|
+
} else if (_this7.options.mode === 'year') {
|
|
901
1088
|
return d;
|
|
902
1089
|
}
|
|
903
1090
|
});
|
|
@@ -946,7 +1133,7 @@ Date.prototype.floor = function () {
|
|
|
946
1133
|
|
|
947
1134
|
var WebsyDropdown = /*#__PURE__*/function () {
|
|
948
1135
|
function WebsyDropdown(elementId, options) {
|
|
949
|
-
var
|
|
1136
|
+
var _this8 = this;
|
|
950
1137
|
|
|
951
1138
|
_classCallCheck(this, WebsyDropdown);
|
|
952
1139
|
|
|
@@ -981,12 +1168,12 @@ var WebsyDropdown = /*#__PURE__*/function () {
|
|
|
981
1168
|
el.addEventListener('mouseout', this.handleMouseOut.bind(this));
|
|
982
1169
|
el.addEventListener('mousemove', this.handleMouseMove.bind(this));
|
|
983
1170
|
var headerLabel = this.selectedItems.map(function (s) {
|
|
984
|
-
return
|
|
1171
|
+
return _this8.options.items[s].label || _this8.options.items[s].value;
|
|
985
1172
|
}).join(this.options.multiValueDelimiter);
|
|
986
1173
|
var headerValue = this.selectedItems.map(function (s) {
|
|
987
|
-
return
|
|
1174
|
+
return _this8.options.items[s].value || _this8.options.items[s].label;
|
|
988
1175
|
}).join(this.options.multiValueDelimiter);
|
|
989
|
-
var html = "\n <div class='websy-dropdown-container ".concat(this.options.disabled ? 'disabled' : '', " ").concat(this.options.disableSearch !== true ? 'with-search' : '', "'>\n <div id='").concat(this.elementId, "_header' class='websy-dropdown-header ").concat(this.selectedItems.length === 1 ? 'one-selected' : '', " ").concat(this.options.allowClear === true ? 'allow-clear' : '', "'>\n <span id='").concat(this.elementId, "_headerLabel' class='websy-dropdown-header-label'>").concat(this.options.label, "</span>\n <span data-info='").concat(headerLabel, "' class='websy-dropdown-header-value' id='").concat(this.elementId, "_selectedItems'>").concat(headerLabel, "</span>\n <input class='dropdown-input' id='").concat(this.elementId, "_input' name='").concat(this.options.field || this.options.label, "' value='").concat(headerValue, "'>\n <svg class='arrow' xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"><path d=\"M23.677 18.52c.914 1.523-.183 3.472-1.967 3.472h-19.414c-1.784 0-2.881-1.949-1.967-3.472l9.709-16.18c.891-1.483 3.041-1.48 3.93 0l9.709 16.18z\"/></svg
|
|
1176
|
+
var html = "\n <div id='".concat(this.elementId, "_container' class='websy-dropdown-container ").concat(this.options.disabled ? 'disabled' : '', " ").concat(this.options.disableSearch !== true ? 'with-search' : '', " ").concat(this.options.style, "'>\n <div id='").concat(this.elementId, "_header' class='websy-dropdown-header ").concat(this.selectedItems.length === 1 ? 'one-selected' : '', " ").concat(this.options.allowClear === true ? 'allow-clear' : '', "'>\n <svg class='search' width=\"20\" height=\"20\" viewBox=\"0 0 512 512\"><path d=\"M221.09,64A157.09,157.09,0,1,0,378.18,221.09,157.1,157.1,0,0,0,221.09,64Z\" style=\"fill:none;stroke:#000;stroke-miterlimit:10;stroke-width:32px\"/><line x1=\"338.29\" y1=\"338.29\" x2=\"448\" y2=\"448\" style=\"fill:none;stroke:#000;stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px\"/></svg>\n <span id='").concat(this.elementId, "_headerLabel' class='websy-dropdown-header-label'>").concat(this.options.label, "</span>\n <span data-info='").concat(headerLabel, "' class='websy-dropdown-header-value' id='").concat(this.elementId, "_selectedItems'>").concat(headerLabel, "</span>\n <input class='dropdown-input' id='").concat(this.elementId, "_input' name='").concat(this.options.field || this.options.label, "' value='").concat(headerValue, "'>\n <svg class='arrow' xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"><path d=\"M23.677 18.52c.914 1.523-.183 3.472-1.967 3.472h-19.414c-1.784 0-2.881-1.949-1.967-3.472l9.709-16.18c.891-1.483 3.041-1.48 3.93 0l9.709 16.18z\"/></svg> \n ");
|
|
990
1177
|
|
|
991
1178
|
if (this.options.allowClear === true) {
|
|
992
1179
|
html += "\n <svg class='clear' xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 512 512\"><title>ionicons-v5-l</title><line x1=\"368\" y1=\"368\" x2=\"144\" y2=\"144\" style=\"fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px\"/><line x1=\"368\" y1=\"144\" x2=\"144\" y2=\"368\" style=\"fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px\"/></svg>\n ";
|
|
@@ -1054,6 +1241,9 @@ var WebsyDropdown = /*#__PURE__*/function () {
|
|
|
1054
1241
|
this.updateSelected(+index);
|
|
1055
1242
|
} else if (event.target.classList.contains('clear')) {
|
|
1056
1243
|
this.clearSelected();
|
|
1244
|
+
} else if (event.target.classList.contains('search')) {
|
|
1245
|
+
var el = document.getElementById("".concat(this.elementId, "_container"));
|
|
1246
|
+
el.classList.toggle('search-open');
|
|
1057
1247
|
}
|
|
1058
1248
|
}
|
|
1059
1249
|
}, {
|
|
@@ -1213,10 +1403,10 @@ var WebsyDropdown = /*#__PURE__*/function () {
|
|
|
1213
1403
|
}, {
|
|
1214
1404
|
key: "renderItems",
|
|
1215
1405
|
value: function renderItems() {
|
|
1216
|
-
var
|
|
1406
|
+
var _this9 = this;
|
|
1217
1407
|
|
|
1218
1408
|
var html = this.options.items.map(function (r, i) {
|
|
1219
|
-
return "\n <li data-index='".concat(i, "' class='websy-dropdown-item ").concat((r.classes || []).join(' '), " ").concat(
|
|
1409
|
+
return "\n <li data-index='".concat(i, "' class='websy-dropdown-item ").concat((r.classes || []).join(' '), " ").concat(_this9.selectedItems.indexOf(i) !== -1 ? 'active' : '', "'>").concat(r.label, "</li>\n ");
|
|
1220
1410
|
}).join('');
|
|
1221
1411
|
var el = document.getElementById("".concat(this.elementId, "_items"));
|
|
1222
1412
|
|
|
@@ -1235,7 +1425,7 @@ var WebsyDropdown = /*#__PURE__*/function () {
|
|
|
1235
1425
|
}, {
|
|
1236
1426
|
key: "updateHeader",
|
|
1237
1427
|
value: function updateHeader(item) {
|
|
1238
|
-
var
|
|
1428
|
+
var _this10 = this;
|
|
1239
1429
|
|
|
1240
1430
|
var el = document.getElementById(this.elementId);
|
|
1241
1431
|
var headerEl = document.getElementById("".concat(this.elementId, "_header"));
|
|
@@ -1281,17 +1471,17 @@ var WebsyDropdown = /*#__PURE__*/function () {
|
|
|
1281
1471
|
} else if (this.selectedItems.length > 1) {
|
|
1282
1472
|
if (this.options.showCompleteSelectedList === true) {
|
|
1283
1473
|
var selectedLabels = this.selectedItems.map(function (s) {
|
|
1284
|
-
return
|
|
1474
|
+
return _this10.options.items[s].label || _this10.options.items[s].value;
|
|
1285
1475
|
}).join(this.options.multiValueDelimiter);
|
|
1286
1476
|
var selectedValues = this.selectedItems.map(function (s) {
|
|
1287
|
-
return
|
|
1477
|
+
return _this10.options.items[s].value || _this10.options.items[s].label;
|
|
1288
1478
|
}).join(this.options.multiValueDelimiter);
|
|
1289
1479
|
labelEl.innerHTML = selectedLabels;
|
|
1290
1480
|
labelEl.setAttribute('data-info', selectedLabels);
|
|
1291
1481
|
inputEl.value = selectedValues;
|
|
1292
1482
|
} else {
|
|
1293
1483
|
var _selectedValues = this.selectedItems.map(function (s) {
|
|
1294
|
-
return
|
|
1484
|
+
return _this10.options.items[s].value || _this10.options.items[s].label;
|
|
1295
1485
|
}).join(this.options.multiValueDelimiter);
|
|
1296
1486
|
|
|
1297
1487
|
labelEl.innerHTML = "".concat(this.selectedItems.length, " selected");
|
|
@@ -1420,13 +1610,13 @@ var WebsyForm = /*#__PURE__*/function () {
|
|
|
1420
1610
|
}, {
|
|
1421
1611
|
key: "checkRecaptcha",
|
|
1422
1612
|
value: function checkRecaptcha() {
|
|
1423
|
-
var
|
|
1613
|
+
var _this11 = this;
|
|
1424
1614
|
|
|
1425
1615
|
return new Promise(function (resolve, reject) {
|
|
1426
|
-
if (
|
|
1427
|
-
if (
|
|
1428
|
-
|
|
1429
|
-
grecaptcharesponse:
|
|
1616
|
+
if (_this11.options.useRecaptcha === true) {
|
|
1617
|
+
if (_this11.recaptchaValue) {
|
|
1618
|
+
_this11.apiService.add('/google/checkrecaptcha', JSON.stringify({
|
|
1619
|
+
grecaptcharesponse: _this11.recaptchaValue
|
|
1430
1620
|
})).then(function (response) {
|
|
1431
1621
|
if (response.success && response.success === true) {
|
|
1432
1622
|
resolve(true);
|
|
@@ -1484,14 +1674,14 @@ var WebsyForm = /*#__PURE__*/function () {
|
|
|
1484
1674
|
}, {
|
|
1485
1675
|
key: "processComponents",
|
|
1486
1676
|
value: function processComponents(components, callbackFn) {
|
|
1487
|
-
var
|
|
1677
|
+
var _this12 = this;
|
|
1488
1678
|
|
|
1489
1679
|
if (components.length === 0) {
|
|
1490
1680
|
callbackFn();
|
|
1491
1681
|
} else {
|
|
1492
1682
|
components.forEach(function (c) {
|
|
1493
1683
|
if (typeof WebsyDesigns[c.component] !== 'undefined') {
|
|
1494
|
-
c.instance = new WebsyDesigns[c.component]("".concat(
|
|
1684
|
+
c.instance = new WebsyDesigns[c.component]("".concat(_this12.elementId, "_input_").concat(c.field, "_component"), c.options);
|
|
1495
1685
|
} else {// some user feedback here
|
|
1496
1686
|
}
|
|
1497
1687
|
});
|
|
@@ -1512,7 +1702,7 @@ var WebsyForm = /*#__PURE__*/function () {
|
|
|
1512
1702
|
}, {
|
|
1513
1703
|
key: "render",
|
|
1514
1704
|
value: function render(update, data) {
|
|
1515
|
-
var
|
|
1705
|
+
var _this13 = this;
|
|
1516
1706
|
|
|
1517
1707
|
var el = document.getElementById(this.elementId);
|
|
1518
1708
|
var componentsToProcess = [];
|
|
@@ -1522,11 +1712,11 @@ var WebsyForm = /*#__PURE__*/function () {
|
|
|
1522
1712
|
this.options.fields.forEach(function (f, i) {
|
|
1523
1713
|
if (f.component) {
|
|
1524
1714
|
componentsToProcess.push(f);
|
|
1525
|
-
html += "\n ".concat(i > 0 ? '-->' : '', "<div class='").concat(f.classes || '', "'>\n ").concat(f.label ? "<label for=\"".concat(f.field, "\">").concat(f.label, "</label>") : '', "\n <div id='").concat(
|
|
1715
|
+
html += "\n ".concat(i > 0 ? '-->' : '', "<div class='").concat(f.classes || '', "'>\n ").concat(f.label ? "<label for=\"".concat(f.field, "\">").concat(f.label, "</label>") : '', "\n <div id='").concat(_this13.elementId, "_input_").concat(f.field, "_component' class='form-component'></div>\n </div><!--\n ");
|
|
1526
1716
|
} else if (f.type === 'longtext') {
|
|
1527
|
-
html += "\n ".concat(i > 0 ? '-->' : '', "<div class='").concat(f.classes || '', "'>\n ").concat(f.label ? "<label for=\"".concat(f.field, "\">").concat(f.label, "</label>") : '', "\n <textarea\n id=\"").concat(
|
|
1717
|
+
html += "\n ".concat(i > 0 ? '-->' : '', "<div class='").concat(f.classes || '', "'>\n ").concat(f.label ? "<label for=\"".concat(f.field, "\">").concat(f.label, "</label>") : '', "\n <textarea\n id=\"").concat(_this13.elementId, "_input_").concat(f.field, "\"\n ").concat(f.required === true ? 'required' : '', " \n placeholder=\"").concat(f.placeholder || '', "\"\n name=\"").concat(f.field, "\" \n class=\"websy-input websy-textarea\"\n ></textarea>\n </div><!--\n ");
|
|
1528
1718
|
} else {
|
|
1529
|
-
html += "\n ".concat(i > 0 ? '-->' : '', "<div class='").concat(f.classes || '', "'>\n ").concat(f.label ? "<label for=\"".concat(f.field, "\">").concat(f.label, "</label>") : '', "\n <input \n id=\"").concat(
|
|
1719
|
+
html += "\n ".concat(i > 0 ? '-->' : '', "<div class='").concat(f.classes || '', "'>\n ").concat(f.label ? "<label for=\"".concat(f.field, "\">").concat(f.label, "</label>") : '', "\n <input \n id=\"").concat(_this13.elementId, "_input_").concat(f.field, "\"\n ").concat(f.required === true ? 'required' : '', " \n type=\"").concat(f.type || 'text', "\" \n class=\"websy-input\" \n name=\"").concat(f.field, "\" \n placeholder=\"").concat(f.placeholder || '', "\"\n value=\"").concat(f.value || '', "\"\n valueAsDate=\"").concat(f.type === 'date' ? f.value : '', "\"\n oninvalidx=\"this.setCustomValidity('").concat(f.invalidMessage || 'Please fill in this field.', "')\"\n />\n </div><!--\n ");
|
|
1530
1720
|
}
|
|
1531
1721
|
});
|
|
1532
1722
|
html += "\n --><button class=\"websy-btn submit ".concat(this.options.submit.classes || '', "\">").concat(this.options.submit.text || 'Save', "</button>").concat(this.options.cancel ? '<!--' : '', "\n ");
|
|
@@ -1543,8 +1733,8 @@ var WebsyForm = /*#__PURE__*/function () {
|
|
|
1543
1733
|
|
|
1544
1734
|
el.innerHTML = html;
|
|
1545
1735
|
this.processComponents(componentsToProcess, function () {
|
|
1546
|
-
if (
|
|
1547
|
-
|
|
1736
|
+
if (_this13.options.useRecaptcha === true && typeof grecaptcha !== 'undefined') {
|
|
1737
|
+
_this13.recaptchaReady();
|
|
1548
1738
|
}
|
|
1549
1739
|
});
|
|
1550
1740
|
}
|
|
@@ -1552,7 +1742,7 @@ var WebsyForm = /*#__PURE__*/function () {
|
|
|
1552
1742
|
}, {
|
|
1553
1743
|
key: "submitForm",
|
|
1554
1744
|
value: function submitForm() {
|
|
1555
|
-
var
|
|
1745
|
+
var _this14 = this;
|
|
1556
1746
|
|
|
1557
1747
|
var formEl = document.getElementById("".concat(this.elementId, "Form"));
|
|
1558
1748
|
|
|
@@ -1566,22 +1756,22 @@ var WebsyForm = /*#__PURE__*/function () {
|
|
|
1566
1756
|
data[key] = value;
|
|
1567
1757
|
});
|
|
1568
1758
|
|
|
1569
|
-
if (
|
|
1570
|
-
|
|
1571
|
-
if (
|
|
1759
|
+
if (_this14.options.url) {
|
|
1760
|
+
_this14.apiService.add(_this14.options.url, data).then(function (result) {
|
|
1761
|
+
if (_this14.options.clearAfterSave === true) {
|
|
1572
1762
|
// this.render()
|
|
1573
1763
|
formEl.reset();
|
|
1574
1764
|
}
|
|
1575
1765
|
|
|
1576
|
-
|
|
1766
|
+
_this14.options.onSuccess.call(_this14, result);
|
|
1577
1767
|
}, function (err) {
|
|
1578
1768
|
console.log('Error submitting form data:', err);
|
|
1579
1769
|
|
|
1580
|
-
|
|
1770
|
+
_this14.options.onError.call(_this14, err);
|
|
1581
1771
|
});
|
|
1582
|
-
} else if (
|
|
1583
|
-
|
|
1584
|
-
if (
|
|
1772
|
+
} else if (_this14.options.submitFn) {
|
|
1773
|
+
_this14.options.submitFn(data, function () {
|
|
1774
|
+
if (_this14.options.clearAfterSave === true) {
|
|
1585
1775
|
// this.render()
|
|
1586
1776
|
formEl.reset();
|
|
1587
1777
|
}
|
|
@@ -1601,17 +1791,17 @@ var WebsyForm = /*#__PURE__*/function () {
|
|
|
1601
1791
|
}, {
|
|
1602
1792
|
key: "data",
|
|
1603
1793
|
set: function set(d) {
|
|
1604
|
-
var
|
|
1794
|
+
var _this15 = this;
|
|
1605
1795
|
|
|
1606
1796
|
if (!this.options.fields) {
|
|
1607
1797
|
this.options.fields = [];
|
|
1608
1798
|
}
|
|
1609
1799
|
|
|
1610
1800
|
var _loop = function _loop(key) {
|
|
1611
|
-
|
|
1801
|
+
_this15.options.fields.forEach(function (f) {
|
|
1612
1802
|
if (f.field === key) {
|
|
1613
1803
|
f.value = d[key];
|
|
1614
|
-
var el = document.getElementById("".concat(
|
|
1804
|
+
var el = document.getElementById("".concat(_this15.elementId, "_input_").concat(f.field));
|
|
1615
1805
|
el.value = f.value;
|
|
1616
1806
|
}
|
|
1617
1807
|
});
|
|
@@ -1911,7 +2101,7 @@ var WebsyNavigationMenu = /*#__PURE__*/function () {
|
|
|
1911
2101
|
|
|
1912
2102
|
var Pager = /*#__PURE__*/function () {
|
|
1913
2103
|
function Pager(elementId, options) {
|
|
1914
|
-
var
|
|
2104
|
+
var _this16 = this;
|
|
1915
2105
|
|
|
1916
2106
|
_classCallCheck(this, Pager);
|
|
1917
2107
|
|
|
@@ -1964,8 +2154,8 @@ var Pager = /*#__PURE__*/function () {
|
|
|
1964
2154
|
allowClear: false,
|
|
1965
2155
|
disableSearch: true,
|
|
1966
2156
|
onItemSelected: function onItemSelected(selectedItem) {
|
|
1967
|
-
if (
|
|
1968
|
-
|
|
2157
|
+
if (_this16.options.onChangePageSize) {
|
|
2158
|
+
_this16.options.onChangePageSize(selectedItem.value);
|
|
1969
2159
|
}
|
|
1970
2160
|
}
|
|
1971
2161
|
});
|
|
@@ -1989,13 +2179,13 @@ var Pager = /*#__PURE__*/function () {
|
|
|
1989
2179
|
}, {
|
|
1990
2180
|
key: "render",
|
|
1991
2181
|
value: function render() {
|
|
1992
|
-
var
|
|
2182
|
+
var _this17 = this;
|
|
1993
2183
|
|
|
1994
2184
|
var el = document.getElementById("".concat(this.elementId, "_pageList"));
|
|
1995
2185
|
|
|
1996
2186
|
if (el) {
|
|
1997
2187
|
var pages = this.options.pages.map(function (item, index) {
|
|
1998
|
-
return "<li data-index=\"".concat(index, "\" class=\"websy-page-num ").concat(
|
|
2188
|
+
return "<li data-index=\"".concat(index, "\" class=\"websy-page-num ").concat(_this17.options.activePage === index ? 'active' : '', "\">").concat(index + 1, "</li>");
|
|
1999
2189
|
});
|
|
2000
2190
|
var startIndex = 0;
|
|
2001
2191
|
|
|
@@ -2063,58 +2253,58 @@ var WebsyPDFButton = /*#__PURE__*/function () {
|
|
|
2063
2253
|
_createClass(WebsyPDFButton, [{
|
|
2064
2254
|
key: "handleClick",
|
|
2065
2255
|
value: function handleClick(event) {
|
|
2066
|
-
var
|
|
2256
|
+
var _this18 = this;
|
|
2067
2257
|
|
|
2068
2258
|
if (event.target.classList.contains('websy-pdf-button')) {
|
|
2069
2259
|
this.loader.show();
|
|
2070
2260
|
setTimeout(function () {
|
|
2071
|
-
if (
|
|
2072
|
-
var el = document.getElementById(
|
|
2261
|
+
if (_this18.options.targetId) {
|
|
2262
|
+
var el = document.getElementById(_this18.options.targetId);
|
|
2073
2263
|
|
|
2074
2264
|
if (el) {
|
|
2075
2265
|
var pdfData = {
|
|
2076
2266
|
options: {}
|
|
2077
2267
|
};
|
|
2078
2268
|
|
|
2079
|
-
if (
|
|
2080
|
-
pdfData.options = _extends({},
|
|
2269
|
+
if (_this18.options.pdfOptions) {
|
|
2270
|
+
pdfData.options = _extends({}, _this18.options.pdfOptions);
|
|
2081
2271
|
}
|
|
2082
2272
|
|
|
2083
|
-
if (
|
|
2084
|
-
if (
|
|
2085
|
-
var headerEl = document.getElementById(
|
|
2273
|
+
if (_this18.options.header) {
|
|
2274
|
+
if (_this18.options.header.elementId) {
|
|
2275
|
+
var headerEl = document.getElementById(_this18.options.header.elementId);
|
|
2086
2276
|
|
|
2087
2277
|
if (headerEl) {
|
|
2088
2278
|
pdfData.header = headerEl.outerHTML;
|
|
2089
2279
|
|
|
2090
|
-
if (
|
|
2091
|
-
pdfData.options.headerCSS =
|
|
2280
|
+
if (_this18.options.header.css) {
|
|
2281
|
+
pdfData.options.headerCSS = _this18.options.header.css;
|
|
2092
2282
|
}
|
|
2093
2283
|
}
|
|
2094
|
-
} else if (
|
|
2095
|
-
pdfData.header =
|
|
2284
|
+
} else if (_this18.options.header.html) {
|
|
2285
|
+
pdfData.header = _this18.options.header.html;
|
|
2096
2286
|
|
|
2097
|
-
if (
|
|
2098
|
-
pdfData.options.headerCSS =
|
|
2287
|
+
if (_this18.options.header.css) {
|
|
2288
|
+
pdfData.options.headerCSS = _this18.options.header.css;
|
|
2099
2289
|
}
|
|
2100
2290
|
} else {
|
|
2101
|
-
pdfData.header =
|
|
2291
|
+
pdfData.header = _this18.options.header;
|
|
2102
2292
|
}
|
|
2103
2293
|
}
|
|
2104
2294
|
|
|
2105
|
-
if (
|
|
2106
|
-
if (
|
|
2107
|
-
var footerEl = document.getElementById(
|
|
2295
|
+
if (_this18.options.footer) {
|
|
2296
|
+
if (_this18.options.footer.elementId) {
|
|
2297
|
+
var footerEl = document.getElementById(_this18.options.footer.elementId);
|
|
2108
2298
|
|
|
2109
2299
|
if (footerEl) {
|
|
2110
2300
|
pdfData.footer = footerEl.outerHTML;
|
|
2111
2301
|
|
|
2112
|
-
if (
|
|
2113
|
-
pdfData.options.footerCSS =
|
|
2302
|
+
if (_this18.options.footer.css) {
|
|
2303
|
+
pdfData.options.footerCSS = _this18.options.footer.css;
|
|
2114
2304
|
}
|
|
2115
2305
|
}
|
|
2116
2306
|
} else {
|
|
2117
|
-
pdfData.footer =
|
|
2307
|
+
pdfData.footer = _this18.options.footer;
|
|
2118
2308
|
}
|
|
2119
2309
|
}
|
|
2120
2310
|
|
|
@@ -2123,23 +2313,23 @@ var WebsyPDFButton = /*#__PURE__*/function () {
|
|
|
2123
2313
|
// document.getElementById(`${this.elementId}_pdfFooter`).value = pdfData.footer
|
|
2124
2314
|
// document.getElementById(`${this.elementId}_form`).submit()
|
|
2125
2315
|
|
|
2126
|
-
|
|
2316
|
+
_this18.service.add('', pdfData, {
|
|
2127
2317
|
responseType: 'blob'
|
|
2128
2318
|
}).then(function (response) {
|
|
2129
|
-
|
|
2319
|
+
_this18.loader.hide();
|
|
2130
2320
|
|
|
2131
2321
|
var blob = new Blob([response], {
|
|
2132
2322
|
type: 'application/pdf'
|
|
2133
2323
|
});
|
|
2134
2324
|
var msg = "\n <div class='text-center websy-pdf-download'>\n <div>Your file is ready to download</div>\n <a href='".concat(URL.createObjectURL(blob), "' target='_blank'\n ");
|
|
2135
2325
|
|
|
2136
|
-
if (
|
|
2137
|
-
msg += "download='".concat(
|
|
2326
|
+
if (_this18.options.directDownload === true) {
|
|
2327
|
+
msg += "download='".concat(_this18.options.fileName || 'Export', ".pdf'");
|
|
2138
2328
|
}
|
|
2139
2329
|
|
|
2140
|
-
msg += "\n >\n <button class='websy-btn download-pdf'>".concat(
|
|
2330
|
+
msg += "\n >\n <button class='websy-btn download-pdf'>".concat(_this18.options.buttonText, "</button>\n </a>\n </div>\n ");
|
|
2141
2331
|
|
|
2142
|
-
|
|
2332
|
+
_this18.popup.show({
|
|
2143
2333
|
message: msg,
|
|
2144
2334
|
mask: true
|
|
2145
2335
|
});
|
|
@@ -2324,7 +2514,7 @@ var WebsyPubSub = /*#__PURE__*/function () {
|
|
|
2324
2514
|
|
|
2325
2515
|
var WebsyResultList = /*#__PURE__*/function () {
|
|
2326
2516
|
function WebsyResultList(elementId, options) {
|
|
2327
|
-
var
|
|
2517
|
+
var _this19 = this;
|
|
2328
2518
|
|
|
2329
2519
|
_classCallCheck(this, WebsyResultList);
|
|
2330
2520
|
|
|
@@ -2352,9 +2542,9 @@ var WebsyResultList = /*#__PURE__*/function () {
|
|
|
2352
2542
|
|
|
2353
2543
|
if (_typeof(options.template) === 'object' && options.template.url) {
|
|
2354
2544
|
this.templateService.get(options.template.url).then(function (templateString) {
|
|
2355
|
-
|
|
2545
|
+
_this19.options.template = templateString;
|
|
2356
2546
|
|
|
2357
|
-
|
|
2547
|
+
_this19.render();
|
|
2358
2548
|
});
|
|
2359
2549
|
} else {
|
|
2360
2550
|
this.render();
|
|
@@ -2373,7 +2563,7 @@ var WebsyResultList = /*#__PURE__*/function () {
|
|
|
2373
2563
|
}, {
|
|
2374
2564
|
key: "buildHTML",
|
|
2375
2565
|
value: function buildHTML(d) {
|
|
2376
|
-
var
|
|
2566
|
+
var _this20 = this;
|
|
2377
2567
|
|
|
2378
2568
|
var startIndex = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
|
|
2379
2569
|
var html = "";
|
|
@@ -2381,7 +2571,7 @@ var WebsyResultList = /*#__PURE__*/function () {
|
|
|
2381
2571
|
if (this.options.template) {
|
|
2382
2572
|
if (d.length > 0) {
|
|
2383
2573
|
d.forEach(function (row, ix) {
|
|
2384
|
-
var template = "".concat(ix > 0 ? '-->' : '').concat(
|
|
2574
|
+
var template = "".concat(ix > 0 ? '-->' : '').concat(_this20.options.template).concat(ix < d.length - 1 ? '<!--' : ''); // find conditional elements
|
|
2385
2575
|
|
|
2386
2576
|
var ifMatches = _toConsumableArray(template.matchAll(/<\s*if[^>]*>([\s\S]*?)<\s*\/\s*if>/g));
|
|
2387
2577
|
|
|
@@ -2501,7 +2691,7 @@ var WebsyResultList = /*#__PURE__*/function () {
|
|
|
2501
2691
|
}, {
|
|
2502
2692
|
key: "handleClick",
|
|
2503
2693
|
value: function handleClick(event) {
|
|
2504
|
-
var
|
|
2694
|
+
var _this21 = this;
|
|
2505
2695
|
|
|
2506
2696
|
if (event.target.classList.contains('clickable')) {
|
|
2507
2697
|
var l = event.target.getAttribute('data-event');
|
|
@@ -2519,8 +2709,8 @@ var WebsyResultList = /*#__PURE__*/function () {
|
|
|
2519
2709
|
l = l[0];
|
|
2520
2710
|
params = params.map(function (p) {
|
|
2521
2711
|
if (typeof p !== 'string' && typeof p !== 'number') {
|
|
2522
|
-
if (
|
|
2523
|
-
p =
|
|
2712
|
+
if (_this21.rows[+id]) {
|
|
2713
|
+
p = _this21.rows[+id][p];
|
|
2524
2714
|
}
|
|
2525
2715
|
} else if (typeof p === 'string') {
|
|
2526
2716
|
p = p.replace(/"/g, '').replace(/'/g, '');
|
|
@@ -2542,13 +2732,13 @@ var WebsyResultList = /*#__PURE__*/function () {
|
|
|
2542
2732
|
}, {
|
|
2543
2733
|
key: "render",
|
|
2544
2734
|
value: function render() {
|
|
2545
|
-
var
|
|
2735
|
+
var _this22 = this;
|
|
2546
2736
|
|
|
2547
2737
|
if (this.options.entity) {
|
|
2548
2738
|
this.apiService.get(this.options.entity).then(function (results) {
|
|
2549
|
-
|
|
2739
|
+
_this22.rows = results.rows;
|
|
2550
2740
|
|
|
2551
|
-
|
|
2741
|
+
_this22.resize();
|
|
2552
2742
|
});
|
|
2553
2743
|
} else {
|
|
2554
2744
|
this.resize();
|
|
@@ -2627,7 +2817,7 @@ var WebsyRouter = /*#__PURE__*/function () {
|
|
|
2627
2817
|
_createClass(WebsyRouter, [{
|
|
2628
2818
|
key: "addGroup",
|
|
2629
2819
|
value: function addGroup(group) {
|
|
2630
|
-
var
|
|
2820
|
+
var _this23 = this;
|
|
2631
2821
|
|
|
2632
2822
|
if (!this.groups[group]) {
|
|
2633
2823
|
var els = document.querySelectorAll(".websy-view[data-group=\"".concat(group, "\"]"));
|
|
@@ -2635,7 +2825,7 @@ var WebsyRouter = /*#__PURE__*/function () {
|
|
|
2635
2825
|
if (els) {
|
|
2636
2826
|
console.log('els', els);
|
|
2637
2827
|
this.getClosestParent(els[0], function (parent) {
|
|
2638
|
-
|
|
2828
|
+
_this23.groups[group] = {
|
|
2639
2829
|
activeView: '',
|
|
2640
2830
|
views: [],
|
|
2641
2831
|
parent: parent.getAttribute('data-view')
|
|
@@ -2956,12 +3146,12 @@ var WebsyRouter = /*#__PURE__*/function () {
|
|
|
2956
3146
|
}, {
|
|
2957
3147
|
key: "showComponents",
|
|
2958
3148
|
value: function showComponents(view) {
|
|
2959
|
-
var
|
|
3149
|
+
var _this24 = this;
|
|
2960
3150
|
|
|
2961
3151
|
if (this.options.views && this.options.views[view] && this.options.views[view].components) {
|
|
2962
3152
|
this.options.views[view].components.forEach(function (c) {
|
|
2963
3153
|
if (typeof c.instance === 'undefined') {
|
|
2964
|
-
|
|
3154
|
+
_this24.prepComponent(c.elementId, c.options);
|
|
2965
3155
|
|
|
2966
3156
|
c.instance = new c.Component(c.elementId, c.options);
|
|
2967
3157
|
} else if (c.instance.render) {
|
|
@@ -3328,7 +3518,7 @@ var Switch = /*#__PURE__*/function () {
|
|
|
3328
3518
|
|
|
3329
3519
|
var WebsyTemplate = /*#__PURE__*/function () {
|
|
3330
3520
|
function WebsyTemplate(elementId, options) {
|
|
3331
|
-
var
|
|
3521
|
+
var _this25 = this;
|
|
3332
3522
|
|
|
3333
3523
|
_classCallCheck(this, WebsyTemplate);
|
|
3334
3524
|
|
|
@@ -3354,9 +3544,9 @@ var WebsyTemplate = /*#__PURE__*/function () {
|
|
|
3354
3544
|
|
|
3355
3545
|
if (_typeof(options.template) === 'object' && options.template.url) {
|
|
3356
3546
|
this.templateService.get(options.template.url).then(function (templateString) {
|
|
3357
|
-
|
|
3547
|
+
_this25.options.template = templateString;
|
|
3358
3548
|
|
|
3359
|
-
|
|
3549
|
+
_this25.render();
|
|
3360
3550
|
});
|
|
3361
3551
|
} else {
|
|
3362
3552
|
this.render();
|
|
@@ -3366,7 +3556,7 @@ var WebsyTemplate = /*#__PURE__*/function () {
|
|
|
3366
3556
|
_createClass(WebsyTemplate, [{
|
|
3367
3557
|
key: "buildHTML",
|
|
3368
3558
|
value: function buildHTML() {
|
|
3369
|
-
var
|
|
3559
|
+
var _this26 = this;
|
|
3370
3560
|
|
|
3371
3561
|
var html = "";
|
|
3372
3562
|
|
|
@@ -3428,14 +3618,14 @@ var WebsyTemplate = /*#__PURE__*/function () {
|
|
|
3428
3618
|
}
|
|
3429
3619
|
|
|
3430
3620
|
if (polarity === true) {
|
|
3431
|
-
if (typeof
|
|
3621
|
+
if (typeof _this26.options.data[parts[0]] !== 'undefined' && _this26.options.data[parts[0]] === parts[1]) {
|
|
3432
3622
|
// remove the <if> tags
|
|
3433
3623
|
removeAll = false;
|
|
3434
3624
|
} else if (parts[0] === parts[1]) {
|
|
3435
3625
|
removeAll = false;
|
|
3436
3626
|
}
|
|
3437
3627
|
} else if (polarity === false) {
|
|
3438
|
-
if (typeof
|
|
3628
|
+
if (typeof _this26.options.data[parts[0]] !== 'undefined' && _this26.options.data[parts[0]] !== parts[1]) {
|
|
3439
3629
|
// remove the <if> tags
|
|
3440
3630
|
removeAll = false;
|
|
3441
3631
|
}
|
|
@@ -3703,7 +3893,7 @@ var WebsyUtils = {
|
|
|
3703
3893
|
|
|
3704
3894
|
var WebsyTable = /*#__PURE__*/function () {
|
|
3705
3895
|
function WebsyTable(elementId, options) {
|
|
3706
|
-
var
|
|
3896
|
+
var _this27 = this;
|
|
3707
3897
|
|
|
3708
3898
|
_classCallCheck(this, WebsyTable);
|
|
3709
3899
|
|
|
@@ -3741,8 +3931,8 @@ var WebsyTable = /*#__PURE__*/function () {
|
|
|
3741
3931
|
allowClear: false,
|
|
3742
3932
|
disableSearch: true,
|
|
3743
3933
|
onItemSelected: function onItemSelected(selectedItem) {
|
|
3744
|
-
if (
|
|
3745
|
-
|
|
3934
|
+
if (_this27.options.onChangePageSize) {
|
|
3935
|
+
_this27.options.onChangePageSize(selectedItem.value);
|
|
3746
3936
|
}
|
|
3747
3937
|
}
|
|
3748
3938
|
});
|
|
@@ -3763,7 +3953,7 @@ var WebsyTable = /*#__PURE__*/function () {
|
|
|
3763
3953
|
_createClass(WebsyTable, [{
|
|
3764
3954
|
key: "appendRows",
|
|
3765
3955
|
value: function appendRows(data) {
|
|
3766
|
-
var
|
|
3956
|
+
var _this28 = this;
|
|
3767
3957
|
|
|
3768
3958
|
this.hideError();
|
|
3769
3959
|
var bodyHTML = '';
|
|
@@ -3771,15 +3961,15 @@ var WebsyTable = /*#__PURE__*/function () {
|
|
|
3771
3961
|
if (data) {
|
|
3772
3962
|
bodyHTML += data.map(function (r, rowIndex) {
|
|
3773
3963
|
return '<tr>' + r.map(function (c, i) {
|
|
3774
|
-
if (
|
|
3964
|
+
if (_this28.options.columns[i].show !== false) {
|
|
3775
3965
|
var style = '';
|
|
3776
3966
|
|
|
3777
3967
|
if (c.style) {
|
|
3778
3968
|
style += c.style;
|
|
3779
3969
|
}
|
|
3780
3970
|
|
|
3781
|
-
if (
|
|
3782
|
-
style += "width: ".concat(
|
|
3971
|
+
if (_this28.options.columns[i].width) {
|
|
3972
|
+
style += "width: ".concat(_this28.options.columns[i].width, "; ");
|
|
3783
3973
|
}
|
|
3784
3974
|
|
|
3785
3975
|
if (c.backgroundColor) {
|
|
@@ -3794,18 +3984,18 @@ var WebsyTable = /*#__PURE__*/function () {
|
|
|
3794
3984
|
style += "color: ".concat(c.color, "; ");
|
|
3795
3985
|
}
|
|
3796
3986
|
|
|
3797
|
-
if (
|
|
3798
|
-
return "\n <td \n data-row-index='".concat(
|
|
3799
|
-
} else if ((
|
|
3800
|
-
return "\n <td \n data-view='".concat(c.value, "' \n data-row-index='").concat(
|
|
3987
|
+
if (_this28.options.columns[i].showAsLink === true && c.value.trim() !== '') {
|
|
3988
|
+
return "\n <td \n data-row-index='".concat(_this28.rowCount + rowIndex, "' \n data-col-index='").concat(i, "' \n class='").concat(_this28.options.columns[i].classes || '', "' \n style='").concat(style, "'\n colspan='").concat(c.colspan || 1, "'\n rowspan='").concat(c.rowspan || 1, "'\n >\n <a href='").concat(c.value, "' target='").concat(_this28.options.columns[i].openInNewTab === true ? '_blank' : '_self', "'>").concat(c.displayText || _this28.options.columns[i].linkText || c.value, "</a>\n </td>\n ");
|
|
3989
|
+
} else if ((_this28.options.columns[i].showAsNavigatorLink === true || _this28.options.columns[i].showAsRouterLink === true) && c.value.trim() !== '') {
|
|
3990
|
+
return "\n <td \n data-view='".concat(c.value, "' \n data-row-index='").concat(_this28.rowCount + rowIndex, "' \n data-col-index='").concat(i, "' \n class='trigger-item ").concat(_this28.options.columns[i].clickable === true ? 'clickable' : '', " ").concat(_this28.options.columns[i].classes || '', "' \n style='").concat(style, "'\n colspan='").concat(c.colspan || 1, "'\n rowspan='").concat(c.rowspan || 1, "'\n >").concat(c.displayText || _this28.options.columns[i].linkText || c.value, "</td>\n ");
|
|
3801
3991
|
} else {
|
|
3802
3992
|
var info = c.value;
|
|
3803
3993
|
|
|
3804
|
-
if (
|
|
3994
|
+
if (_this28.options.columns[i].showAsImage === true) {
|
|
3805
3995
|
c.value = "\n <img src='".concat(c.value, "'>\n ");
|
|
3806
3996
|
}
|
|
3807
3997
|
|
|
3808
|
-
return "\n <td \n data-info='".concat(info, "' \n data-row-index='").concat(
|
|
3998
|
+
return "\n <td \n data-info='".concat(info, "' \n data-row-index='").concat(_this28.rowCount + rowIndex, "' \n data-col-index='").concat(i, "' \n class='").concat(_this28.options.columns[i].classes || '', "' \n style='").concat(style, "'\n colspan='").concat(c.colspan || 1, "'\n rowspan='").concat(c.rowspan || 1, "'\n >").concat(c.value, "</td>\n ");
|
|
3809
3999
|
}
|
|
3810
4000
|
}
|
|
3811
4001
|
}).join('') + '</tr>';
|
|
@@ -3964,7 +4154,7 @@ var WebsyTable = /*#__PURE__*/function () {
|
|
|
3964
4154
|
}, {
|
|
3965
4155
|
key: "render",
|
|
3966
4156
|
value: function render(data) {
|
|
3967
|
-
var
|
|
4157
|
+
var _this29 = this;
|
|
3968
4158
|
|
|
3969
4159
|
if (!this.options.columns) {
|
|
3970
4160
|
return;
|
|
@@ -3989,7 +4179,7 @@ var WebsyTable = /*#__PURE__*/function () {
|
|
|
3989
4179
|
|
|
3990
4180
|
var headHTML = '<tr>' + this.options.columns.map(function (c, i) {
|
|
3991
4181
|
if (c.show !== false) {
|
|
3992
|
-
return "\n <th ".concat(c.width ? 'style="width: ' + (c.width || 'auto') + ';"' : '', ">\n <div class =\"tableHeader\">\n <div class=\"leftSection\">\n <div\n class=\"tableHeaderField ").concat(['asc', 'desc'].indexOf(c.sort) !== -1 ? 'sortable-column' : '', "\"\n data-index=\"").concat(i, "\" \n data-sort=\"").concat(c.sort, "\" \n >\n ").concat(c.name, "\n </div>\n </div>\n <div class=\"").concat(c.activeSort ? c.sort + ' sortOrder' : '', "\"></div>\n <!--").concat(c.searchable === true ?
|
|
4182
|
+
return "\n <th ".concat(c.width ? 'style="width: ' + (c.width || 'auto') + ';"' : '', ">\n <div class =\"tableHeader\">\n <div class=\"leftSection\">\n <div\n class=\"tableHeaderField ").concat(['asc', 'desc'].indexOf(c.sort) !== -1 ? 'sortable-column' : '', "\"\n data-index=\"").concat(i, "\" \n data-sort=\"").concat(c.sort, "\" \n >\n ").concat(c.name, "\n </div>\n </div>\n <div class=\"").concat(c.activeSort ? c.sort + ' sortOrder' : '', "\"></div>\n <!--").concat(c.searchable === true ? _this29.buildSearchIcon(c.qGroupFieldDefs[0]) : '', "-->\n </div>\n </th>\n ");
|
|
3993
4183
|
}
|
|
3994
4184
|
}).join('') + '</tr>';
|
|
3995
4185
|
var headEl = document.getElementById("".concat(this.elementId, "_head"));
|
|
@@ -4008,7 +4198,7 @@ var WebsyTable = /*#__PURE__*/function () {
|
|
|
4008
4198
|
|
|
4009
4199
|
if (pagingEl) {
|
|
4010
4200
|
var pages = new Array(this.options.pageCount).fill('').map(function (item, index) {
|
|
4011
|
-
return "<li data-page=\"".concat(index, "\" class=\"websy-page-num ").concat(
|
|
4201
|
+
return "<li data-page=\"".concat(index, "\" class=\"websy-page-num ").concat(_this29.options.pageNum === index ? 'active' : '', "\">").concat(index + 1, "</li>");
|
|
4012
4202
|
});
|
|
4013
4203
|
var startIndex = 0;
|
|
4014
4204
|
|
|
@@ -4076,7 +4266,7 @@ var WebsyTable = /*#__PURE__*/function () {
|
|
|
4076
4266
|
|
|
4077
4267
|
var WebsyTable2 = /*#__PURE__*/function () {
|
|
4078
4268
|
function WebsyTable2(elementId, options) {
|
|
4079
|
-
var
|
|
4269
|
+
var _this30 = this;
|
|
4080
4270
|
|
|
4081
4271
|
_classCallCheck(this, WebsyTable2);
|
|
4082
4272
|
|
|
@@ -4117,8 +4307,8 @@ var WebsyTable2 = /*#__PURE__*/function () {
|
|
|
4117
4307
|
allowClear: false,
|
|
4118
4308
|
disableSearch: true,
|
|
4119
4309
|
onItemSelected: function onItemSelected(selectedItem) {
|
|
4120
|
-
if (
|
|
4121
|
-
|
|
4310
|
+
if (_this30.options.onChangePageSize) {
|
|
4311
|
+
_this30.options.onChangePageSize(selectedItem.value);
|
|
4122
4312
|
}
|
|
4123
4313
|
}
|
|
4124
4314
|
});
|
|
@@ -4142,7 +4332,7 @@ var WebsyTable2 = /*#__PURE__*/function () {
|
|
|
4142
4332
|
_createClass(WebsyTable2, [{
|
|
4143
4333
|
key: "appendRows",
|
|
4144
4334
|
value: function appendRows(data) {
|
|
4145
|
-
var
|
|
4335
|
+
var _this31 = this;
|
|
4146
4336
|
|
|
4147
4337
|
this.hideError();
|
|
4148
4338
|
var bodyEl = document.getElementById("".concat(this.elementId, "_body"));
|
|
@@ -4151,37 +4341,41 @@ var WebsyTable2 = /*#__PURE__*/function () {
|
|
|
4151
4341
|
if (data) {
|
|
4152
4342
|
bodyHTML += data.map(function (r, rowIndex) {
|
|
4153
4343
|
return '<tr>' + r.map(function (c, i) {
|
|
4154
|
-
if (
|
|
4155
|
-
var style = "height: ".concat(
|
|
4344
|
+
if (_this31.options.columns[i].show !== false) {
|
|
4345
|
+
var style = "height: ".concat(_this31.options.cellSize, "px; line-height: ").concat(_this31.options.cellSize, "px;");
|
|
4156
4346
|
|
|
4157
4347
|
if (c.style) {
|
|
4158
4348
|
style += c.style;
|
|
4159
4349
|
}
|
|
4160
4350
|
|
|
4161
|
-
if (
|
|
4162
|
-
style += "width: ".concat(
|
|
4351
|
+
if (_this31.options.columns[i].width) {
|
|
4352
|
+
style += "width: ".concat(_this31.options.columns[i].width, "; ");
|
|
4163
4353
|
}
|
|
4164
4354
|
|
|
4165
4355
|
if (c.backgroundColor) {
|
|
4166
4356
|
style += "background-color: ".concat(c.backgroundColor, "; ");
|
|
4357
|
+
|
|
4358
|
+
if (!c.color) {
|
|
4359
|
+
style += "color: ".concat(WebsyDesigns.Utils.getLightDark(c.backgroundColor), "; ");
|
|
4360
|
+
}
|
|
4167
4361
|
}
|
|
4168
4362
|
|
|
4169
4363
|
if (c.color) {
|
|
4170
4364
|
style += "color: ".concat(c.color, "; ");
|
|
4171
4365
|
}
|
|
4172
4366
|
|
|
4173
|
-
if (
|
|
4174
|
-
return "\n <td \n data-row-index='".concat(
|
|
4175
|
-
} else if ((
|
|
4176
|
-
return "\n <td \n data-view='".concat(c.value, "' \n data-row-index='").concat(
|
|
4367
|
+
if (_this31.options.columns[i].showAsLink === true && c.value.trim() !== '') {
|
|
4368
|
+
return "\n <td \n data-row-index='".concat(_this31.rowCount + rowIndex, "' \n data-col-index='").concat(i, "' \n class='").concat(_this31.options.columns[i].classes || '', "' \n style='").concat(style, "'\n colspan='").concat(c.colspan || 1, "'\n rowspan='").concat(c.rowspan || 1, "'\n >\n <a href='").concat(c.value, "' target='").concat(_this31.options.columns[i].openInNewTab === true ? '_blank' : '_self', "'>").concat(c.displayText || _this31.options.columns[i].linkText || c.value, "</a>\n </td>\n ");
|
|
4369
|
+
} else if ((_this31.options.columns[i].showAsNavigatorLink === true || _this31.options.columns[i].showAsRouterLink === true) && c.value.trim() !== '') {
|
|
4370
|
+
return "\n <td \n data-view='".concat(c.value, "' \n data-row-index='").concat(_this31.rowCount + rowIndex, "' \n data-col-index='").concat(i, "' \n class='trigger-item ").concat(_this31.options.columns[i].clickable === true ? 'clickable' : '', " ").concat(_this31.options.columns[i].classes || '', "' \n style='").concat(style, "'\n colspan='").concat(c.colspan || 1, "'\n rowspan='").concat(c.rowspan || 1, "'\n >").concat(c.displayText || _this31.options.columns[i].linkText || c.value, "</td>\n ");
|
|
4177
4371
|
} else {
|
|
4178
4372
|
var info = c.value;
|
|
4179
4373
|
|
|
4180
|
-
if (
|
|
4374
|
+
if (_this31.options.columns[i].showAsImage === true) {
|
|
4181
4375
|
c.value = "\n <img src='".concat(c.value, "'>\n ");
|
|
4182
4376
|
}
|
|
4183
4377
|
|
|
4184
|
-
return "\n <td \n data-info='".concat(info, "' \n data-row-index='").concat(
|
|
4378
|
+
return "\n <td \n data-info='".concat(info, "' \n data-row-index='").concat(_this31.rowCount + rowIndex, "' \n data-col-index='").concat(i, "' \n class='").concat(_this31.options.columns[i].classes || '', "' \n style='").concat(style, "'\n colspan='").concat(c.colspan || 1, "'\n rowspan='").concat(c.rowspan || 1, "'\n >").concat(c.value, "</td>\n ");
|
|
4185
4379
|
}
|
|
4186
4380
|
}
|
|
4187
4381
|
}).join('') + '</tr>';
|
|
@@ -4424,7 +4618,7 @@ var WebsyTable2 = /*#__PURE__*/function () {
|
|
|
4424
4618
|
}, {
|
|
4425
4619
|
key: "render",
|
|
4426
4620
|
value: function render(data) {
|
|
4427
|
-
var
|
|
4621
|
+
var _this32 = this;
|
|
4428
4622
|
|
|
4429
4623
|
if (!this.options.columns) {
|
|
4430
4624
|
return;
|
|
@@ -4450,19 +4644,22 @@ var WebsyTable2 = /*#__PURE__*/function () {
|
|
|
4450
4644
|
|
|
4451
4645
|
var headHTML = '<tr>' + this.options.columns.map(function (c, i) {
|
|
4452
4646
|
if (c.show !== false) {
|
|
4453
|
-
return "\n <th ".concat(c.width ? 'style="width: ' + (c.width || 'auto') + ';"' : '', ">\n <div class =\"tableHeader\">\n <div class=\"leftSection\">\n <div\n class=\"tableHeaderField ").concat(['asc', 'desc'].indexOf(c.sort) !== -1 ? 'sortable-column' : '', "\"\n data-index=\"").concat(i, "\" \n data-sort=\"").concat(c.sort, "\" \n >\n ").concat(c.name, "\n </div>\n </div>\n <div class=\"").concat(c.activeSort ? c.sort + ' sortOrder' : '', "\"></div>\n ").concat(c.searchable === true ?
|
|
4647
|
+
return "\n <th ".concat(c.width ? 'style="width: ' + (c.width || 'auto') + ';"' : '', ">\n <div class =\"tableHeader\">\n <div class=\"leftSection\">\n <div\n class=\"tableHeaderField ").concat(['asc', 'desc'].indexOf(c.sort) !== -1 ? 'sortable-column' : '', "\"\n data-index=\"").concat(i, "\" \n data-sort=\"").concat(c.sort, "\" \n >\n ").concat(c.name, "\n </div>\n </div>\n <div class=\"").concat(c.activeSort ? c.sort + ' sortOrder' : '', "\"></div>\n ").concat(c.searchable === true ? _this32.buildSearchIcon(i) : '', "\n </div>\n </th>\n ");
|
|
4454
4648
|
}
|
|
4455
4649
|
}).join('') + '</tr>';
|
|
4456
4650
|
var headEl = document.getElementById("".concat(this.elementId, "_head"));
|
|
4457
4651
|
headEl.innerHTML = headHTML;
|
|
4458
|
-
var dropdownHTML = "";
|
|
4459
|
-
this.options.columns.forEach(function (c, i) {
|
|
4460
|
-
if (c.searchable && c.searchField) {
|
|
4461
|
-
dropdownHTML += "\n <div id=\"".concat(_this30.elementId, "_columnSearch_").concat(i, "\" class=\"websy-modal-dropdown\"></div>\n ");
|
|
4462
|
-
}
|
|
4463
|
-
});
|
|
4464
4652
|
var dropdownEl = document.getElementById("".concat(this.elementId, "_dropdownContainer"));
|
|
4465
|
-
|
|
4653
|
+
|
|
4654
|
+
if (dropdownEl.innerHTML === '') {
|
|
4655
|
+
var dropdownHTML = "";
|
|
4656
|
+
this.options.columns.forEach(function (c, i) {
|
|
4657
|
+
if (c.searchable && c.searchField) {
|
|
4658
|
+
dropdownHTML += "\n <div id=\"".concat(_this32.elementId, "_columnSearch_").concat(i, "\" class=\"websy-modal-dropdown\"></div>\n ");
|
|
4659
|
+
}
|
|
4660
|
+
});
|
|
4661
|
+
dropdownEl.innerHTML = dropdownHTML;
|
|
4662
|
+
} // const colGroupEl = document.getElementById(`${this.elementId}_cols`)
|
|
4466
4663
|
// colGroupEl.innerHTML = colGroupHTML
|
|
4467
4664
|
// let footHTML = '<tr>' + this.options.columns.map((c, i) => {
|
|
4468
4665
|
// if (c.show !== false) {
|
|
@@ -4474,12 +4671,13 @@ var WebsyTable2 = /*#__PURE__*/function () {
|
|
|
4474
4671
|
// const footEl = document.getElementById(`${this.elementId}_foot`)
|
|
4475
4672
|
// footEl.innerHTML = footHTML
|
|
4476
4673
|
|
|
4674
|
+
|
|
4477
4675
|
if (this.options.paging === 'pages') {
|
|
4478
4676
|
var pagingEl = document.getElementById("".concat(this.elementId, "_pageList"));
|
|
4479
4677
|
|
|
4480
4678
|
if (pagingEl) {
|
|
4481
4679
|
var pages = new Array(this.options.pageCount).fill('').map(function (item, index) {
|
|
4482
|
-
return "<li data-page=\"".concat(index, "\" class=\"websy-page-num ").concat(
|
|
4680
|
+
return "<li data-page=\"".concat(index, "\" class=\"websy-page-num ").concat(_this32.options.pageNum === index ? 'active' : '', "\">").concat(index + 1, "</li>");
|
|
4483
4681
|
});
|
|
4484
4682
|
var startIndex = 0;
|
|
4485
4683
|
|
|
@@ -4566,14 +4764,14 @@ var WebsyTable2 = /*#__PURE__*/function () {
|
|
|
4566
4764
|
}, {
|
|
4567
4765
|
key: "getColumnParameters",
|
|
4568
4766
|
value: function getColumnParameters(values) {
|
|
4569
|
-
var
|
|
4767
|
+
var _this33 = this;
|
|
4570
4768
|
|
|
4571
4769
|
var tableEl = document.getElementById("".concat(this.elementId, "_table"));
|
|
4572
4770
|
tableEl.style.tableLayout = 'auto';
|
|
4573
4771
|
tableEl.style.width = 'auto';
|
|
4574
4772
|
var bodyEl = document.getElementById("".concat(this.elementId, "_body"));
|
|
4575
4773
|
bodyEl.innerHTML = '<tr>' + values.map(function (c) {
|
|
4576
|
-
return "\n <td \n style='height: ".concat(
|
|
4774
|
+
return "\n <td \n style='height: ".concat(_this33.options.cellSize, "px; line-height: ").concat(_this33.options.cellSize, "px;'\n >").concat(c.value || ' ', "</td>\n ");
|
|
4577
4775
|
}).join('') + '</tr>'; // get height of the first data cell
|
|
4578
4776
|
|
|
4579
4777
|
var cells = bodyEl.querySelectorAll("tr:first-of-type td");
|
|
@@ -4614,7 +4812,7 @@ var WebsyTable2 = /*#__PURE__*/function () {
|
|
|
4614
4812
|
|
|
4615
4813
|
var WebsyChart = /*#__PURE__*/function () {
|
|
4616
4814
|
function WebsyChart(elementId, options) {
|
|
4617
|
-
var
|
|
4815
|
+
var _this34 = this;
|
|
4618
4816
|
|
|
4619
4817
|
_classCallCheck(this, WebsyChart);
|
|
4620
4818
|
|
|
@@ -4662,22 +4860,22 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
4662
4860
|
this.invertOverride = function (input, input2) {
|
|
4663
4861
|
var xAxis = 'bottomAxis';
|
|
4664
4862
|
|
|
4665
|
-
if (
|
|
4863
|
+
if (_this34.options.orientation === 'horizontal') {
|
|
4666
4864
|
xAxis = 'leftAxis';
|
|
4667
4865
|
}
|
|
4668
4866
|
|
|
4669
|
-
var width =
|
|
4867
|
+
var width = _this34[xAxis].step();
|
|
4670
4868
|
|
|
4671
4869
|
var output;
|
|
4672
4870
|
|
|
4673
|
-
var domain = _toConsumableArray(
|
|
4871
|
+
var domain = _toConsumableArray(_this34[xAxis].domain());
|
|
4674
4872
|
|
|
4675
|
-
if (
|
|
4873
|
+
if (_this34.options.orientation === 'horizontal') {
|
|
4676
4874
|
domain = domain.reverse();
|
|
4677
4875
|
}
|
|
4678
4876
|
|
|
4679
4877
|
for (var j = 0; j < domain.length; j++) {
|
|
4680
|
-
var breakA =
|
|
4878
|
+
var breakA = _this34[xAxis](domain[j]) - width / 2;
|
|
4681
4879
|
var breakB = breakA + width;
|
|
4682
4880
|
|
|
4683
4881
|
if (input > breakA && input <= breakB) {
|
|
@@ -4777,10 +4975,10 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
4777
4975
|
}, {
|
|
4778
4976
|
key: "handleEventMouseMove",
|
|
4779
4977
|
value: function handleEventMouseMove(event, d) {
|
|
4780
|
-
var
|
|
4978
|
+
var _this35 = this;
|
|
4781
4979
|
|
|
4782
4980
|
var bisectDate = d3.bisector(function (d) {
|
|
4783
|
-
return
|
|
4981
|
+
return _this35.parseX(d.x.value);
|
|
4784
4982
|
}).left;
|
|
4785
4983
|
|
|
4786
4984
|
if (this.options.showTrackingLine === true && d3.pointer(event)) {
|
|
@@ -4819,8 +5017,8 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
4819
5017
|
}
|
|
4820
5018
|
|
|
4821
5019
|
this.options.data.series.forEach(function (s) {
|
|
4822
|
-
if (
|
|
4823
|
-
xPoint =
|
|
5020
|
+
if (_this35.options.data[xData].scale !== 'Time') {
|
|
5021
|
+
xPoint = _this35[xAxis](_this35.parseX(xLabel));
|
|
4824
5022
|
s.data.forEach(function (d) {
|
|
4825
5023
|
if (d.x.value === xLabel) {
|
|
4826
5024
|
if (!d.y.color) {
|
|
@@ -4835,13 +5033,13 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
4835
5033
|
var pointA = s.data[index - 1];
|
|
4836
5034
|
var pointB = s.data[index];
|
|
4837
5035
|
|
|
4838
|
-
if (
|
|
5036
|
+
if (_this35.options.orientation === 'horizontal') {
|
|
4839
5037
|
pointA = _toConsumableArray(s.data).reverse()[index - 1];
|
|
4840
5038
|
pointB = _toConsumableArray(s.data).reverse()[index];
|
|
4841
5039
|
}
|
|
4842
5040
|
|
|
4843
5041
|
if (pointA && !pointB) {
|
|
4844
|
-
xPoint =
|
|
5042
|
+
xPoint = _this35[xAxis](_this35.parseX(pointA.x.value));
|
|
4845
5043
|
tooltipTitle = pointA.x.value;
|
|
4846
5044
|
|
|
4847
5045
|
if (!pointA.y.color) {
|
|
@@ -4851,12 +5049,12 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
4851
5049
|
tooltipData.push(pointA.y);
|
|
4852
5050
|
|
|
4853
5051
|
if (typeof pointA.x.value.getTime !== 'undefined') {
|
|
4854
|
-
tooltipTitle = d3.timeFormat(
|
|
5052
|
+
tooltipTitle = d3.timeFormat(_this35.options.dateFormat || _this35.options.calculatedTimeFormatPattern)(pointA.x.value);
|
|
4855
5053
|
}
|
|
4856
5054
|
}
|
|
4857
5055
|
|
|
4858
5056
|
if (pointB && !pointA) {
|
|
4859
|
-
xPoint =
|
|
5057
|
+
xPoint = _this35[xAxis](_this35.parseX(pointB.x.value));
|
|
4860
5058
|
tooltipTitle = pointB.x.value;
|
|
4861
5059
|
|
|
4862
5060
|
if (!pointB.y.color) {
|
|
@@ -4866,14 +5064,14 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
4866
5064
|
tooltipData.push(pointB.y);
|
|
4867
5065
|
|
|
4868
5066
|
if (typeof pointB.x.value.getTime !== 'undefined') {
|
|
4869
|
-
tooltipTitle = d3.timeFormat(
|
|
5067
|
+
tooltipTitle = d3.timeFormat(_this35.options.dateFormat || _this35.options.calculatedTimeFormatPattern)(pointB.x.value);
|
|
4870
5068
|
}
|
|
4871
5069
|
}
|
|
4872
5070
|
|
|
4873
5071
|
if (pointA && pointB) {
|
|
4874
|
-
var d0 =
|
|
5072
|
+
var d0 = _this35[xAxis](_this35.parseX(pointA.x.value));
|
|
4875
5073
|
|
|
4876
|
-
var d1 =
|
|
5074
|
+
var d1 = _this35[xAxis](_this35.parseX(pointB.x.value));
|
|
4877
5075
|
|
|
4878
5076
|
var mid = Math.abs(d0 - d1) / 2;
|
|
4879
5077
|
|
|
@@ -4882,7 +5080,7 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
4882
5080
|
tooltipTitle = pointB.x.value;
|
|
4883
5081
|
|
|
4884
5082
|
if (typeof pointB.x.value.getTime !== 'undefined') {
|
|
4885
|
-
tooltipTitle = d3.timeFormat(
|
|
5083
|
+
tooltipTitle = d3.timeFormat(_this35.options.dateFormat || _this35.options.calculatedTimeFormatPattern)(pointB.x.value);
|
|
4886
5084
|
}
|
|
4887
5085
|
|
|
4888
5086
|
if (!pointB.y.color) {
|
|
@@ -4895,7 +5093,7 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
4895
5093
|
tooltipTitle = pointA.x.value;
|
|
4896
5094
|
|
|
4897
5095
|
if (typeof pointB.x.value.getTime !== 'undefined') {
|
|
4898
|
-
tooltipTitle = d3.timeFormat(
|
|
5096
|
+
tooltipTitle = d3.timeFormat(_this35.options.dateFormat || _this35.options.calculatedTimeFormatPattern)(pointB.x.value);
|
|
4899
5097
|
}
|
|
4900
5098
|
|
|
4901
5099
|
if (!pointA.y.color) {
|
|
@@ -5000,7 +5198,7 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
5000
5198
|
}, {
|
|
5001
5199
|
key: "render",
|
|
5002
5200
|
value: function render(options) {
|
|
5003
|
-
var
|
|
5201
|
+
var _this36 = this;
|
|
5004
5202
|
|
|
5005
5203
|
/* global d3 options */
|
|
5006
5204
|
if (typeof options !== 'undefined') {
|
|
@@ -5069,7 +5267,7 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
5069
5267
|
var legendData = this.options.data.series.map(function (s, i) {
|
|
5070
5268
|
return {
|
|
5071
5269
|
value: s.label || s.key,
|
|
5072
|
-
color: s.color ||
|
|
5270
|
+
color: s.color || _this36.options.colors[i % _this36.options.colors.length]
|
|
5073
5271
|
};
|
|
5074
5272
|
});
|
|
5075
5273
|
|
|
@@ -5308,7 +5506,7 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
5308
5506
|
|
|
5309
5507
|
if (this.options.data.bottom.formatter) {
|
|
5310
5508
|
bAxisFunc.tickFormat(function (d) {
|
|
5311
|
-
return
|
|
5509
|
+
return _this36.options.data.bottom.formatter(d);
|
|
5312
5510
|
});
|
|
5313
5511
|
}
|
|
5314
5512
|
|
|
@@ -5335,8 +5533,8 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
5335
5533
|
|
|
5336
5534
|
if (this.options.margin.axisLeft > 0) {
|
|
5337
5535
|
this.leftAxisLayer.call(d3.axisLeft(this.leftAxis).ticks(this.options.data.left.ticks || 5).tickFormat(function (d) {
|
|
5338
|
-
if (
|
|
5339
|
-
d =
|
|
5536
|
+
if (_this36.options.data.left.formatter) {
|
|
5537
|
+
d = _this36.options.data.left.formatter(d);
|
|
5340
5538
|
}
|
|
5341
5539
|
|
|
5342
5540
|
return d;
|
|
@@ -5373,8 +5571,8 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
5373
5571
|
|
|
5374
5572
|
if (this.options.margin.axisRight > 0 && (this.options.data.right.min !== 0 || this.options.data.right.max !== 0)) {
|
|
5375
5573
|
this.rightAxisLayer.call(d3.axisRight(this.rightAxis).ticks(this.options.data.left.ticks || 5).tickFormat(function (d) {
|
|
5376
|
-
if (
|
|
5377
|
-
d =
|
|
5574
|
+
if (_this36.options.data.right.formatter) {
|
|
5575
|
+
d = _this36.options.data.right.formatter(d);
|
|
5378
5576
|
}
|
|
5379
5577
|
|
|
5380
5578
|
return d;
|
|
@@ -5400,16 +5598,16 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
5400
5598
|
|
|
5401
5599
|
this.options.data.series.forEach(function (series, index) {
|
|
5402
5600
|
if (!series.key) {
|
|
5403
|
-
series.key =
|
|
5601
|
+
series.key = _this36.createIdentity();
|
|
5404
5602
|
}
|
|
5405
5603
|
|
|
5406
5604
|
if (!series.color) {
|
|
5407
|
-
series.color =
|
|
5605
|
+
series.color = _this36.options.colors[index % _this36.options.colors.length];
|
|
5408
5606
|
}
|
|
5409
5607
|
|
|
5410
|
-
|
|
5608
|
+
_this36["render".concat(series.type || 'bar')](series, index);
|
|
5411
5609
|
|
|
5412
|
-
|
|
5610
|
+
_this36.renderLabels(series, index);
|
|
5413
5611
|
});
|
|
5414
5612
|
}
|
|
5415
5613
|
}
|
|
@@ -5417,17 +5615,17 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
5417
5615
|
}, {
|
|
5418
5616
|
key: "renderarea",
|
|
5419
5617
|
value: function renderarea(series, index) {
|
|
5420
|
-
var
|
|
5618
|
+
var _this37 = this;
|
|
5421
5619
|
|
|
5422
5620
|
/* global d3 series index */
|
|
5423
5621
|
var drawArea = function drawArea(xAxis, yAxis, curveStyle) {
|
|
5424
5622
|
return d3.area().x(function (d) {
|
|
5425
|
-
return
|
|
5623
|
+
return _this37[xAxis](_this37.parseX(d.x.value));
|
|
5426
5624
|
}).y0(function (d) {
|
|
5427
|
-
return
|
|
5625
|
+
return _this37[yAxis](0);
|
|
5428
5626
|
}).y1(function (d) {
|
|
5429
|
-
return
|
|
5430
|
-
}).curve(d3[curveStyle ||
|
|
5627
|
+
return _this37[yAxis](isNaN(d.y.value) ? 0 : d.y.value);
|
|
5628
|
+
}).curve(d3[curveStyle || _this37.options.curveStyle]);
|
|
5431
5629
|
};
|
|
5432
5630
|
|
|
5433
5631
|
var xAxis = 'bottomAxis';
|
|
@@ -5600,15 +5798,15 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
5600
5798
|
}, {
|
|
5601
5799
|
key: "renderline",
|
|
5602
5800
|
value: function renderline(series, index) {
|
|
5603
|
-
var
|
|
5801
|
+
var _this38 = this;
|
|
5604
5802
|
|
|
5605
5803
|
/* global series index d3 */
|
|
5606
5804
|
var drawLine = function drawLine(xAxis, yAxis, curveStyle) {
|
|
5607
5805
|
return d3.line().x(function (d) {
|
|
5608
|
-
return
|
|
5806
|
+
return _this38[xAxis](_this38.parseX(d.x.value));
|
|
5609
5807
|
}).y(function (d) {
|
|
5610
|
-
return
|
|
5611
|
-
}).curve(d3[curveStyle ||
|
|
5808
|
+
return _this38[yAxis](isNaN(d.y.value) ? 0 : d.y.value);
|
|
5809
|
+
}).curve(d3[curveStyle || _this38.options.curveStyle]);
|
|
5612
5810
|
};
|
|
5613
5811
|
|
|
5614
5812
|
var xAxis = 'bottomAxis';
|
|
@@ -5646,14 +5844,14 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
5646
5844
|
}, {
|
|
5647
5845
|
key: "rendersymbol",
|
|
5648
5846
|
value: function rendersymbol(series, index) {
|
|
5649
|
-
var
|
|
5847
|
+
var _this39 = this;
|
|
5650
5848
|
|
|
5651
5849
|
/* global d3 series index series.key */
|
|
5652
5850
|
var drawSymbol = function drawSymbol(size) {
|
|
5653
5851
|
return d3.symbol() // .type(d => {
|
|
5654
5852
|
// return d3.symbols[0]
|
|
5655
5853
|
// })
|
|
5656
|
-
.size(size ||
|
|
5854
|
+
.size(size || _this39.options.symbolSize);
|
|
5657
5855
|
};
|
|
5658
5856
|
|
|
5659
5857
|
var xAxis = 'bottomAxis';
|
|
@@ -5671,7 +5869,7 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
5671
5869
|
symbols.attr('d', function (d) {
|
|
5672
5870
|
return drawSymbol(d.y.size || series.symbolSize)(d);
|
|
5673
5871
|
}).transition(this.transition).attr('fill', 'white').attr('stroke', series.color).attr('transform', function (d) {
|
|
5674
|
-
return "translate(".concat(
|
|
5872
|
+
return "translate(".concat(_this39[xAxis](_this39.parseX(d.x.value)), ", ").concat(_this39[yAxis](isNaN(d.y.value) ? 0 : d.y.value), ")");
|
|
5675
5873
|
}); // Enter
|
|
5676
5874
|
|
|
5677
5875
|
symbols.enter().append('path').attr('d', function (d) {
|
|
@@ -5680,7 +5878,7 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
5680
5878
|
.attr('fill', 'white').attr('stroke', series.color).attr('class', function (d) {
|
|
5681
5879
|
return "symbol symbol_".concat(series.key);
|
|
5682
5880
|
}).attr('transform', function (d) {
|
|
5683
|
-
return "translate(".concat(
|
|
5881
|
+
return "translate(".concat(_this39[xAxis](_this39.parseX(d.x.value)), ", ").concat(_this39[yAxis](isNaN(d.y.value) ? 0 : d.y.value), ")");
|
|
5684
5882
|
});
|
|
5685
5883
|
}
|
|
5686
5884
|
}, {
|
|
@@ -5835,7 +6033,7 @@ var WebsyLegend = /*#__PURE__*/function () {
|
|
|
5835
6033
|
}, {
|
|
5836
6034
|
key: "resize",
|
|
5837
6035
|
value: function resize() {
|
|
5838
|
-
var
|
|
6036
|
+
var _this40 = this;
|
|
5839
6037
|
|
|
5840
6038
|
var el = document.getElementById(this.elementId);
|
|
5841
6039
|
|
|
@@ -5848,7 +6046,7 @@ var WebsyLegend = /*#__PURE__*/function () {
|
|
|
5848
6046
|
// }
|
|
5849
6047
|
var html = "\n <div class='text-".concat(this.options.align, "'>\n ");
|
|
5850
6048
|
html += this._data.map(function (d, i) {
|
|
5851
|
-
return
|
|
6049
|
+
return _this40.getLegendItemHTML(d);
|
|
5852
6050
|
}).join('');
|
|
5853
6051
|
html += "\n <div>\n ";
|
|
5854
6052
|
el.innerHTML = html;
|
|
@@ -6021,7 +6219,7 @@ var WebsyMap = /*#__PURE__*/function () {
|
|
|
6021
6219
|
}, {
|
|
6022
6220
|
key: "render",
|
|
6023
6221
|
value: function render() {
|
|
6024
|
-
var
|
|
6222
|
+
var _this41 = this;
|
|
6025
6223
|
|
|
6026
6224
|
var mapEl = document.getElementById("".concat(this.elementId, "_map"));
|
|
6027
6225
|
var legendEl = document.getElementById("".concat(this.elementId, "_map"));
|
|
@@ -6030,7 +6228,7 @@ var WebsyMap = /*#__PURE__*/function () {
|
|
|
6030
6228
|
var legendData = this.options.data.polygons.map(function (s, i) {
|
|
6031
6229
|
return {
|
|
6032
6230
|
value: s.label || s.key,
|
|
6033
|
-
color: s.color ||
|
|
6231
|
+
color: s.color || _this41.options.colors[i % _this41.options.colors.length]
|
|
6034
6232
|
};
|
|
6035
6233
|
});
|
|
6036
6234
|
var longestValue = legendData.map(function (s) {
|
|
@@ -6094,7 +6292,7 @@ var WebsyMap = /*#__PURE__*/function () {
|
|
|
6094
6292
|
|
|
6095
6293
|
if (this.polygons) {
|
|
6096
6294
|
this.polygons.forEach(function (p) {
|
|
6097
|
-
return
|
|
6295
|
+
return _this41.map.removeLayer(p);
|
|
6098
6296
|
});
|
|
6099
6297
|
}
|
|
6100
6298
|
|
|
@@ -6152,18 +6350,18 @@ var WebsyMap = /*#__PURE__*/function () {
|
|
|
6152
6350
|
}
|
|
6153
6351
|
|
|
6154
6352
|
if (!p.options.color) {
|
|
6155
|
-
p.options.color =
|
|
6353
|
+
p.options.color = _this41.options.colors[i % _this41.options.colors.length];
|
|
6156
6354
|
}
|
|
6157
6355
|
|
|
6158
6356
|
var pol = L.polygon(p.data.map(function (c) {
|
|
6159
6357
|
return c.map(function (d) {
|
|
6160
6358
|
return [d.Latitude, d.Longitude];
|
|
6161
6359
|
});
|
|
6162
|
-
}), p.options).addTo(
|
|
6360
|
+
}), p.options).addTo(_this41.map);
|
|
6163
6361
|
|
|
6164
|
-
|
|
6362
|
+
_this41.polygons.push(pol);
|
|
6165
6363
|
|
|
6166
|
-
|
|
6364
|
+
_this41.map.fitBounds(pol.getBounds());
|
|
6167
6365
|
});
|
|
6168
6366
|
} // if (this.data.markers.length > 0) {
|
|
6169
6367
|
// el.classList.remove('hidden')
|