You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@sling.apache.org by dk...@apache.org on 2020/07/14 16:33:57 UTC
[sling-org-apache-sling-app-cms] branch master updated: Minor -
tweaks to UI to improve dialog sizing
This is an automated email from the ASF dual-hosted git repository.
dklco pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/sling-org-apache-sling-app-cms.git
The following commit(s) were added to refs/heads/master by this push:
new 7d7eb98 Minor - tweaks to UI to improve dialog sizing
7d7eb98 is described below
commit 7d7eb98d3f3327703a603f3423035d29e929c813
Author: Dan Klco <dk...@apache.org>
AuthorDate: Tue Jul 14 12:33:40 2020 -0400
Minor - tweaks to UI to improve dialog sizing
---
ui/src/main/frontend/js/editor.js | 12 +++++------
ui/src/main/frontend/scss/editor.scss | 24 ++++++++++++++--------
.../sling-cms/components/pages/editor/body.jsp | 8 +++++---
3 files changed, 25 insertions(+), 19 deletions(-)
diff --git a/ui/src/main/frontend/js/editor.js b/ui/src/main/frontend/js/editor.js
index 752f47a..624c298 100644
--- a/ui/src/main/frontend/js/editor.js
+++ b/ui/src/main/frontend/js/editor.js
@@ -133,16 +133,10 @@ if (!window.CMSEditor) {
}
document.querySelector(".sling-cms-editor-final").innerHTML =
- '<div class="modal"><div class="modal-background"></div><div class="modal-content"><div class="box"><h3 class="modal-title"></h3><section class="modal-body"></section></div></div><button class="modal-close is-large" aria-label="close"></button>';
+ `<div class="modal"><div class="modal-background"></div><div class="modal-content"><div class="box"><h3 class="modal-title"></h3><section class="modal-body"><div class="loader is-loading"></div><iframe class="modal-frame" src="${url}"></iframe></section></div></div><button class="modal-close is-large" aria-label="close"></button>`;
document.querySelector(
".sling-cms-editor .modal-title"
).innerText = title;
- document.querySelector(
- ".sling-cms-editor .modal-body"
- ).innerHTML = `<iframe class="modal-frame" src="${url}"></iframe>`;
- document
- .querySelector(".sling-cms-editor .modal")
- .classList.add("is-active");
CMSEditor.util.attachClick(
document,
".sling-cms-editor .modal-background, .sling-cms-editor .modal-close",
@@ -153,6 +147,9 @@ if (!window.CMSEditor) {
CMSEditor.ui.draggable(
document.querySelector(".sling-cms-editor .modal-content")
);
+ document
+ .querySelector(".sling-cms-editor .modal")
+ .classList.add("is-active");
CMSEditor.ui.modalDisplayed = true;
},
},
@@ -378,5 +375,6 @@ window.addEventListener("message", (event) => {
modalBody.style.height = `${height}px`;
}
}
+ modalBody.querySelector(".loader").classList.add("is-hidden");
}
});
diff --git a/ui/src/main/frontend/scss/editor.scss b/ui/src/main/frontend/scss/editor.scss
index 25762da..cd7bac0 100644
--- a/ui/src/main/frontend/scss/editor.scss
+++ b/ui/src/main/frontend/scss/editor.scss
@@ -19,14 +19,7 @@
.sling-cms-editor {
@import "fonts";
@import "overrides";
- @import "../../../../node_modules/bulma/sass/utilities/_all.sass";
- @import "../../../../node_modules/bulma/sass/helpers/_all.sass";
- @import "../../../../node_modules/bulma/sass/elements/box.sass";
- @import "../../../../node_modules/bulma/sass/elements/button.sass";
- @import "../../../../node_modules/bulma/sass/form/_all.sass";
- @import "../../../../node_modules/bulma/sass/elements/icon.sass";
- @import "../../../../node_modules/bulma/sass/components/level.sass";
- @import "../../../../node_modules/bulma/sass/components/modal.sass";
+ @import "../../../../node_modules/bulma/bulma.sass";
font-family: "Open Sans", sans-serif;
* {
@@ -61,9 +54,22 @@
padding: 0.5em;
}
+ .loader {
+ margin: auto;
+ width: 2em;
+ height: 2em;
+ border: 2px solid $primary;
+ border-right-color: transparent;
+ border-top-color: transparent;
+ }
+
.modal-body {
padding: 0.5em;
- height: 500px;
+ height: 540px;
+ }
+
+ .modal-content {
+ overflow: hidden;
}
.modal-frame {
diff --git a/ui/src/main/resources/jcr_root/libs/sling-cms/components/pages/editor/body.jsp b/ui/src/main/resources/jcr_root/libs/sling-cms/components/pages/editor/body.jsp
index 4b0d83c..8eb287d 100644
--- a/ui/src/main/resources/jcr_root/libs/sling-cms/components/pages/editor/body.jsp
+++ b/ui/src/main/resources/jcr_root/libs/sling-cms/components/pages/editor/body.jsp
@@ -21,15 +21,17 @@
<sling:include path="container" resourceType="sling-cms/components/general/container" />
<sling:call script="scripts.jsp" />
<script>
- if (window.parent) {
+ if (window.parent && window.parent !== window) {
document.onreadystatechange = () => {
if (document.readyState == "complete") {
- window.parent.postMessage({
+ setTimeout(() => {
+ window.parent.postMessage({
action: "slingcms.editorloaded",
- height: document.querySelector("form").clientHeight + 20,
+ height: document.querySelector("form").clientHeight + 40,
},
window.location.origin
);
+ }, 10);
}
};
}