- {% ui.select "method", MethodEnum::generateArray(), post('method') %}
+
+
-
- {% ui:text "url" %}
- {% ui:text "token", $this->session->jwt %}
-
-
-
+
+
+ {% ui.select "method", MethodEnum::generateArray(), post('method') %}
+
-
-
{}
+
+ {% ui:text "url" %}
+ {% ui:text "token", $this->session->jwt %}
+
+
+
+
+
@@ -44,7 +59,18 @@
.response-head .response-code {background:#dfdfdf;padding:0 5px;font-weight: bold;line-height: 29px;font-size: 80%;}
.response-head .response-message {padding:0 10px;background:#fbfbfb;line-height: 30px;font-size: 80%;}
+ .request-compose {position:relative;}
+ .loading-anim {display:none;position:absolute;left:0;right:0;top:0;bottom:0;justify-content: center;align-items: center;z-index: 15;background: rgba(122, 121, 121, 0.25);}
+ .la-ball-spin-clockwise-fade-rotating {color: #0f6ab4!important;}
+ .loading .loading-anim {display: flex;}
+
#response {max-height: 66vh;}
+ /*!
+ * Load Awesome v1.1.0 (http://github.danielcardoso.net/load-awesome/)
+ * Copyright 2015 Daniel Cardoso <@DanielCardoso>
+ * Licensed under MIT
+ */
+ .la-ball-spin-clockwise-fade-rotating,.la-ball-spin-clockwise-fade-rotating>div{position:relative;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.la-ball-spin-clockwise-fade-rotating{display:block;font-size:0;color:#fff}.la-ball-spin-clockwise-fade-rotating.la-dark{color:#333}.la-ball-spin-clockwise-fade-rotating>div{display:inline-block;float:none;background-color:currentColor;border:0 solid currentColor}.la-ball-spin-clockwise-fade-rotating{width:32px;height:32px;-webkit-animation:ball-spin-clockwise-fade-rotating-rotate 6s infinite linear;-moz-animation:ball-spin-clockwise-fade-rotating-rotate 6s infinite linear;-o-animation:ball-spin-clockwise-fade-rotating-rotate 6s infinite linear;animation:ball-spin-clockwise-fade-rotating-rotate 6s infinite linear}.la-ball-spin-clockwise-fade-rotating>div{position:absolute;top:50%;left:50%;width:8px;height:8px;margin-top:-4px;margin-left:-4px;border-radius:100%;-webkit-animation:ball-spin-clockwise-fade-rotating 1s infinite linear;-moz-animation:ball-spin-clockwise-fade-rotating 1s infinite linear;-o-animation:ball-spin-clockwise-fade-rotating 1s infinite linear;animation:ball-spin-clockwise-fade-rotating 1s infinite linear}.la-ball-spin-clockwise-fade-rotating>div:nth-child(1){top:5%;left:50%;-webkit-animation-delay:-.875s;-moz-animation-delay:-.875s;-o-animation-delay:-.875s;animation-delay:-.875s}.la-ball-spin-clockwise-fade-rotating>div:nth-child(2){top:18.1801948466%;left:81.8198051534%;-webkit-animation-delay:-.75s;-moz-animation-delay:-.75s;-o-animation-delay:-.75s;animation-delay:-.75s}.la-ball-spin-clockwise-fade-rotating>div:nth-child(3){top:50%;left:95%;-webkit-animation-delay:-.625s;-moz-animation-delay:-.625s;-o-animation-delay:-.625s;animation-delay:-.625s}.la-ball-spin-clockwise-fade-rotating>div:nth-child(4){top:81.8198051534%;left:81.8198051534%;-webkit-animation-delay:-.5s;-moz-animation-delay:-.5s;-o-animation-delay:-.5s;animation-delay:-.5s}.la-ball-spin-clockwise-fade-rotating>div:nth-child(5){top:94.9999999966%;left:50.0000000005%;-webkit-animation-delay:-.375s;-moz-animation-delay:-.375s;-o-animation-delay:-.375s;animation-delay:-.375s}.la-ball-spin-clockwise-fade-rotating>div:nth-child(6){top:81.8198046966%;left:18.1801949248%;-webkit-animation-delay:-.25s;-moz-animation-delay:-.25s;-o-animation-delay:-.25s;animation-delay:-.25s}.la-ball-spin-clockwise-fade-rotating>div:nth-child(7){top:49.9999750815%;left:5.0000051215%;-webkit-animation-delay:-.125s;-moz-animation-delay:-.125s;-o-animation-delay:-.125s;animation-delay:-.125s}.la-ball-spin-clockwise-fade-rotating>div:nth-child(8){top:18.179464974%;left:18.1803700518%;-webkit-animation-delay:0s;-moz-animation-delay:0s;-o-animation-delay:0s;animation-delay:0s}.la-ball-spin-clockwise-fade-rotating.la-sm{width:16px;height:16px}.la-ball-spin-clockwise-fade-rotating.la-sm>div{width:4px;height:4px;margin-top:-2px;margin-left:-2px}.la-ball-spin-clockwise-fade-rotating.la-2x{width:64px;height:64px}.la-ball-spin-clockwise-fade-rotating.la-2x>div{width:16px;height:16px;margin-top:-8px;margin-left:-8px}.la-ball-spin-clockwise-fade-rotating.la-3x{width:96px;height:96px}.la-ball-spin-clockwise-fade-rotating.la-3x>div{width:24px;height:24px;margin-top:-12px;margin-left:-12px}@-webkit-keyframes ball-spin-clockwise-fade-rotating-rotate{100%{-webkit-transform:rotate(-360deg);transform:rotate(-360deg)}}@-moz-keyframes ball-spin-clockwise-fade-rotating-rotate{100%{-moz-transform:rotate(-360deg);transform:rotate(-360deg)}}@-o-keyframes ball-spin-clockwise-fade-rotating-rotate{100%{-o-transform:rotate(-360deg);transform:rotate(-360deg)}}@keyframes ball-spin-clockwise-fade-rotating-rotate{100%{-webkit-transform:rotate(-360deg);-moz-transform:rotate(-360deg);-o-transform:rotate(-360deg);transform:rotate(-360deg)}}@-webkit-keyframes ball-spin-clockwise-fade-rotating{50%{opacity:.25;-webkit-transform:scale(.5);transform:scale(.5)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@-moz-keyframes ball-spin-clockwise-fade-rotating{50%{opacity:.25;-moz-transform:scale(.5);transform:scale(.5)}100%{opacity:1;-moz-transform:scale(1);transform:scale(1)}}@-o-keyframes ball-spin-clockwise-fade-rotating{50%{opacity:.25;-o-transform:scale(.5);transform:scale(.5)}100%{opacity:1;-o-transform:scale(1);transform:scale(1)}}@keyframes ball-spin-clockwise-fade-rotating{50%{opacity:.25;-webkit-transform:scale(.5);-moz-transform:scale(.5);-o-transform:scale(.5);transform:scale(.5)}100%{opacity:1;-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}}
@@ -139,7 +165,7 @@
}
formatResponse("ace/mode/" + aceMode);
- });
+ }).finally(() => requestDebugger.classList.remove("loading"));
responseResponse.classList.toggle('hide', false);
});
@@ -157,17 +183,22 @@
});
async function launchRequest(method = "POST", url = "", body = "{}") {
+ let headers = {
+ "Content-Type": "application/json"
+ };
+
+ if (token.value) {
+ headers['Authorization'] = `Bearer ${token.value}`;
+ }
+
method = method.toUpperCase();
let responseData = {
method: method,
mode: "cors",
cache: "no-cache",
- credentials: "omit",
- headers: {
- "Content-Type": "application/json",
- 'Authorization': `Bearer ${token.value}`
- },
+ credentials: headers.Authorization ? "omit" : "same-origin",
+ headers: headers,
redirect: "follow",
referrerPolicy: "no-referrer"
};
@@ -176,6 +207,8 @@
responseData.body = body;
}
+ requestDebugger.classList.add("loading");
+
return await fetch(url, responseData);
}