mirror of
https://github.com/bigskysoftware/htmx.git
synced 2025-10-04 00:05:20 +00:00
Made indicator and request classes customisable
This commit is contained in:
parent
2fbe230853
commit
e6a9501d9a
21
src/htmx.js
21
src/htmx.js
@ -1149,7 +1149,7 @@ return (function () {
|
|||||||
indicators = [elt];
|
indicators = [elt];
|
||||||
}
|
}
|
||||||
forEach(indicators, function(ic) {
|
forEach(indicators, function(ic) {
|
||||||
ic.classList[action].call(ic.classList, "htmx-request");
|
ic.classList[action].call(ic.classList, htmx.config.requestClass);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -1668,18 +1668,16 @@ return (function () {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// insert htmx-indicator css rules immediate, if not configured otherwise
|
function insertIndicatorStyles() {
|
||||||
(function() {
|
if (htmx.config.includeIndicatorStyles !== false) {
|
||||||
var metaConfig = getMetaConfig();
|
|
||||||
if (metaConfig === null || metaConfig.includeIndicatorStyles !== false) {
|
|
||||||
getDocument().head.insertAdjacentHTML("beforeend",
|
getDocument().head.insertAdjacentHTML("beforeend",
|
||||||
"<style>\
|
"<style>\
|
||||||
.htmx-indicator{opacity:0;transition: opacity 200ms ease-in;}\
|
." + htmx.config.indicatorClass + "{opacity:0;transition: opacity 200ms ease-in;}\
|
||||||
.htmx-request .htmx-indicator{opacity:1}\
|
." + htmx.config.requestClass + " ." + htmx.config.indicatorClass + "{opacity:1}\
|
||||||
.htmx-request.htmx-indicator{opacity:1}\
|
." + htmx.config.requestClass + "." + htmx.config.indicatorClass + "{opacity:1}\
|
||||||
</style>");
|
</style>");
|
||||||
}
|
}
|
||||||
})();
|
}
|
||||||
|
|
||||||
function getMetaConfig() {
|
function getMetaConfig() {
|
||||||
var element = getDocument().querySelector('meta[name="htmx-config"]');
|
var element = getDocument().querySelector('meta[name="htmx-config"]');
|
||||||
@ -1700,6 +1698,7 @@ return (function () {
|
|||||||
// initialize the document
|
// initialize the document
|
||||||
ready(function () {
|
ready(function () {
|
||||||
mergeMetaConfig();
|
mergeMetaConfig();
|
||||||
|
insertIndicatorStyles();
|
||||||
var body = getDocument().body;
|
var body = getDocument().body;
|
||||||
processNode(body, true);
|
processNode(body, true);
|
||||||
triggerEvent(body, 'load.htmx', {});
|
triggerEvent(body, 'load.htmx', {});
|
||||||
@ -1733,7 +1732,9 @@ return (function () {
|
|||||||
defaultSwapStyle:'innerHTML',
|
defaultSwapStyle:'innerHTML',
|
||||||
defaultSwapDelay:0,
|
defaultSwapDelay:0,
|
||||||
defaultSettleDelay:100,
|
defaultSettleDelay:100,
|
||||||
includeIndicatorStyles:true
|
includeIndicatorStyles:true,
|
||||||
|
indicatorClass:'htmx-indicator',
|
||||||
|
requestClass:'htmx-request'
|
||||||
},
|
},
|
||||||
parseInterval:parseInterval,
|
parseInterval:parseInterval,
|
||||||
_:internalEval,
|
_:internalEval,
|
||||||
|
Loading…
x
Reference in New Issue
Block a user