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 2018/02/09 16:11:44 UTC
[sling-whiteboard] branch master updated: UI tweaks to clean up the
editing interface
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-whiteboard.git
The following commit(s) were added to refs/heads/master by this push:
new 1e1cd62 UI tweaks to clean up the editing interface
1e1cd62 is described below
commit 1e1cd62af6cbf6e9502ae60dd1f9fb95f7c4ed87
Author: Dan Klco <da...@gmail.com>
AuthorDate: Fri Feb 9 11:11:29 2018 -0500
UI tweaks to clean up the editing interface
---
.../org/apache/sling/cms/core/filters/EditIncludeFilter.java | 10 ++++++----
cms/ui/src/main/frontend/src/scss/styles.scss | 8 ++++++++
.../jcr_root/etc/clientlibs/sling-cms-editor/editor.css | 4 +++-
.../jcr_root/etc/clientlibs/sling-cms-editor/editor.js | 8 ++++++--
.../libs/sling-cms/components/editor/scripts/finalize.jsp | 6 ++++--
.../jcr_root/libs/sling-cms/components/pages/editor/body.jsp | 2 +-
6 files changed, 28 insertions(+), 10 deletions(-)
diff --git a/cms/core/src/main/java/org/apache/sling/cms/core/filters/EditIncludeFilter.java b/cms/core/src/main/java/org/apache/sling/cms/core/filters/EditIncludeFilter.java
index bea6f4d..b56e6b3 100644
--- a/cms/core/src/main/java/org/apache/sling/cms/core/filters/EditIncludeFilter.java
+++ b/cms/core/src/main/java/org/apache/sling/cms/core/filters/EditIncludeFilter.java
@@ -82,9 +82,11 @@ public class EditIncludeFilter implements Filter {
}
boolean exists = resource.getResourceResolver().getResource(resource.getPath()) != null;
writer = response.getWriter();
- writer.write("<div class=\"Sling-CMS__component\" data-sling-cms-resource-path=\"" + resource.getPath()
- + "\" data-sling-cms-resource-type=\"" + resource.getResourceType() + "\" data-sling-cms-edit=\""
- + editPath + "\">");
+ Component component = resource.adaptTo(EditableResource.class).getComponent();
+ writer.write("<div class=\"Sling-CMS__component\" data-sling-cms-title=\""
+ + (component != null ? component.getTitle() : "") + "\" data-sling-cms-resource-path=\""
+ + resource.getPath() + "\" data-sling-cms-resource-type=\"" + resource.getResourceType()
+ + "\" data-sling-cms-edit=\"" + editPath + "\">");
writer.write("<div class=\"Sling-CMS__edit-bar\">");
writer.write(
"<button class=\"Sling-CMS__edit-button\" data-sling-cms-action=\"edit\" data-sling-cms-path=\""
@@ -105,7 +107,7 @@ public class EditIncludeFilter implements Filter {
"<button class=\"Sling-CMS__edit-button\" data-sling-cms-action=\"delete\" data-sling-cms-path=\""
+ resource.getPath() + "\" title=\"Delete\">×</button>");
}
- Component component = resource.adaptTo(EditableResource.class).getComponent();
+
if (component != null) {
writer.write("<span class=\"Sling-CMS__component-title\">" + component.getTitle() + "</span>");
}
diff --git a/cms/ui/src/main/frontend/src/scss/styles.scss b/cms/ui/src/main/frontend/src/scss/styles.scss
index b8104c4..53cbc83 100644
--- a/cms/ui/src/main/frontend/src/scss/styles.scss
+++ b/cms/ui/src/main/frontend/src/scss/styles.scss
@@ -54,6 +54,14 @@ ul.Breadcrumb {
padding: 1em;
}
+.Editor-Page {
+ background-color: white;
+}
+
+.Editor-Page form {
+ padding: 1em;
+}
+
.Field-Group {
margin: 1em 0;
}
diff --git a/cms/ui/src/main/resources/jcr_root/etc/clientlibs/sling-cms-editor/editor.css b/cms/ui/src/main/resources/jcr_root/etc/clientlibs/sling-cms-editor/editor.css
index 463a10e..24d690b 100644
--- a/cms/ui/src/main/resources/jcr_root/etc/clientlibs/sling-cms-editor/editor.css
+++ b/cms/ui/src/main/resources/jcr_root/etc/clientlibs/sling-cms-editor/editor.css
@@ -70,8 +70,9 @@
margin: 3em auto;
padding: 2em;
border: 1px solid gray;
- width: 85%;
+ width: 85%;
z-index: 1;
+ max-width: 900px;
}
.Sling-CMS__modal-frame-container {
@@ -87,6 +88,7 @@
left: 0;
width: 100%;
height: 100%;
+ border: none;
}
.Sling-CMS__modal-close {
diff --git a/cms/ui/src/main/resources/jcr_root/etc/clientlibs/sling-cms-editor/editor.js b/cms/ui/src/main/resources/jcr_root/etc/clientlibs/sling-cms-editor/editor.js
index 8110a84..9115be3 100644
--- a/cms/ui/src/main/resources/jcr_root/etc/clientlibs/sling-cms-editor/editor.js
+++ b/cms/ui/src/main/resources/jcr_root/etc/clientlibs/sling-cms-editor/editor.js
@@ -29,7 +29,9 @@ if(!window.CMSEditor){
CMSEditor.ui.showModal('/cms/editor/delete.html'+$(this).attr('data-sling-cms-path'));
});
$(".Sling-CMS__edit-button[data-sling-cms-action=edit]").click(function(){
- CMSEditor.ui.showModal('/cms/editor/edit.html'+$(this).attr('data-sling-cms-path')+'?editor='+$(this).attr('data-sling-cms-edit'));
+ CMSEditor.ui.showModal(
+ '/cms/editor/edit.html'+$(this).attr('data-sling-cms-path')+'?editor='+$(this).attr('data-sling-cms-edit'),
+ $(this).closest('.Sling-CMS__component').attr('data-sling-cms-title'));
});
$(".Sling-CMS__edit-button[data-sling-cms-action=moveup]").click(function(){
CMSEditor.ui.showModal('/cms/editor/moveup.html'+$(this).attr('data-sling-cms-path'));
@@ -60,11 +62,13 @@ if(!window.CMSEditor){
CMSEditor.ui.modalDisplayed = false;
}
},
- showModal: function(url){
+ showModal: function(url, title){
+ title = title || '';
if(CMSEditor.ui.modalDisplayed) {
CMSEditor.ui.hideModal();
}
+ $(".Sling-CMS__modal-frame-title").text(title);
$(".Sling-CMS__modal-box iframe").attr('src',url);
$(".Sling-CMS__modal-background").show();
$(".Sling-CMS__modal-box").show();
diff --git a/cms/ui/src/main/resources/jcr_root/libs/sling-cms/components/editor/scripts/finalize.jsp b/cms/ui/src/main/resources/jcr_root/libs/sling-cms/components/editor/scripts/finalize.jsp
index eb1fac7..8b97700 100644
--- a/cms/ui/src/main/resources/jcr_root/libs/sling-cms/components/editor/scripts/finalize.jsp
+++ b/cms/ui/src/main/resources/jcr_root/libs/sling-cms/components/editor/scripts/finalize.jsp
@@ -21,8 +21,10 @@
<script src="/etc/clientlibs/sling-cms-editor/editor.js"></script>
<div class="Sling-CMS__modal-background">
<div class="Sling-CMS__modal-box">
- <button class="Sling-CMS__modal-close Sling-CMS__edit-button">x</button>
- <br/>
+ <div class="Sling-CMS__modal-frame-header">
+ <span class="Sling-CMS__modal-frame-title"></span>
+ <button class="Sling-CMS__modal-close Sling-CMS__edit-button">x</button>
+ </div>
<div class="Sling-CMS__modal-frame-container">
<iframe class="Sling-CMS__modal-frame" src=""></iframe>
</div>
diff --git a/cms/ui/src/main/resources/jcr_root/libs/sling-cms/components/pages/editor/body.jsp b/cms/ui/src/main/resources/jcr_root/libs/sling-cms/components/pages/editor/body.jsp
index 473af0a..d8db3b3 100644
--- a/cms/ui/src/main/resources/jcr_root/libs/sling-cms/components/pages/editor/body.jsp
+++ b/cms/ui/src/main/resources/jcr_root/libs/sling-cms/components/pages/editor/body.jsp
@@ -17,7 +17,7 @@
* under the License.
*/ --%>
<%@include file="/libs/sling-cms/global.jsp"%>
-<body style="background-color:white">
+<body class="Editor-Page">
<sling:include path="container" resourceType="sling-cms/components/general/container" />
<sling:call script="scripts.jsp" />
</body>
\ No newline at end of file
--
To stop receiving notification emails like this one, please contact
dklco@apache.org.