1 | (function(){
|
2 |
|
3 | function splitOnWhitespace(trigger) {
|
4 | return trigger.split(/\s+/);
|
5 | }
|
6 |
|
7 | function parseClassOperation(trimmedValue) {
|
8 | var split = splitOnWhitespace(trimmedValue);
|
9 | if (split.length > 1) {
|
10 | var operation = split[0];
|
11 | var classDef = split[1].trim();
|
12 | var cssClass;
|
13 | var delay;
|
14 | if (classDef.indexOf(":") > 0) {
|
15 | var splitCssClass = classDef.split(':');
|
16 | cssClass = splitCssClass[0];
|
17 | delay = htmx.parseInterval(splitCssClass[1]);
|
18 | } else {
|
19 | cssClass = classDef;
|
20 | delay = 100;
|
21 | }
|
22 | return {
|
23 | operation:operation,
|
24 | cssClass:cssClass,
|
25 | delay:delay
|
26 | }
|
27 | } else {
|
28 | return null;
|
29 | }
|
30 | }
|
31 |
|
32 | function processClassList(elt, classList) {
|
33 | var runs = classList.split("&");
|
34 | for (var i = 0; i < runs.length; i++) {
|
35 | var run = runs[i];
|
36 | var currentRunTime = 0;
|
37 | var classOperations = run.split(",");
|
38 | for (var j = 0; j < classOperations.length; j++) {
|
39 | var value = classOperations[j];
|
40 | var trimmedValue = value.trim();
|
41 | var classOperation = parseClassOperation(trimmedValue);
|
42 | if (classOperation) {
|
43 | if (classOperation.operation === "toggle") {
|
44 | setTimeout(function () {
|
45 | setInterval(function () {
|
46 | elt.classList[classOperation.operation].call(elt.classList, classOperation.cssClass);
|
47 | }, classOperation.delay);
|
48 | }, currentRunTime);
|
49 | currentRunTime = currentRunTime + classOperation.delay;
|
50 | } else {
|
51 | currentRunTime = currentRunTime + classOperation.delay;
|
52 | setTimeout(function () {
|
53 | elt.classList[classOperation.operation].call(elt.classList, classOperation.cssClass);
|
54 | }, currentRunTime);
|
55 | }
|
56 | }
|
57 | }
|
58 | }
|
59 | }
|
60 |
|
61 | htmx.defineExtension('class-tools', {
|
62 | onEvent: function (name, evt) {
|
63 | if (name === "processedNode.htmx") {
|
64 | var elt = evt.detail.elt;
|
65 | if (elt.getAttribute) {
|
66 | var classList = elt.getAttribute("classes") || elt.getAttribute("data-classes");
|
67 | if (classList) {
|
68 | processClassList(elt, classList);
|
69 | }
|
70 | }
|
71 | }
|
72 | }
|
73 | });
|
74 | })();
|