Skip to content
This repository has been archived by the owner on Mar 5, 2020. It is now read-only.

Adding display of fieldLabel and fieldDescription to Touch UI inner fields #8

Open
wants to merge 1 commit into
base: develop
Choose a base branch
from
Open

Adding display of fieldLabel and fieldDescription to Touch UI inner fields #8

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 3 additions & 1 deletion .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,4 +6,6 @@
.classpath
.groovy
.settings/
target/
target/
nb-configuration.xml

4 changes: 2 additions & 2 deletions pom.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
<modelVersion>4.0.0</modelVersion>
<artifactId>multicomposite-addon</artifactId>
<packaging>bundle</packaging>
<version>2.1.3</version>
<version>2.1.4-SNAPSHOT</version>
<name>AEM Multicomposite Addon</name>
<description>Adds multicomposite field to AEM</description>

Expand All @@ -22,7 +22,7 @@
<timestamp>${maven.build.timestamp}</timestamp>
<aem.username>admin</aem.username>
</properties>

<distributionManagement>
<snapshotRepository>
<id>sonatype-nexus-staging</id>
Expand Down
11 changes: 11 additions & 0 deletions src/main/content/jcr_root/apps/multicomposite/granite/multicomposite/readonly/readonly.jsp
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,17 @@
<div>
<c:forEach var="field" items="${multi.fields}">
<div>
<c:if test="${not empty field.fieldLabel}">
<label class="coral-Form-fieldlabel">${field.fieldLabel}</label>
</c:if>
<c:if test="${not empty field.fieldDescription}">
<span class="coral-Form-fieldinfo coral-Icon coral-Icon--infoCircle coral-Icon--sizeS"
data-init="quicktip"
data-quicktip-type="info"
data-quicktip-arrow="right"
data-quicktip-content="${field.fieldDescription}">
</span>
</c:if>
<multicomposite:widgetInclude valueMap="${value}" path="${field.path}" readOnly="true"/>
</div>
</c:forEach>
Expand Down
24 changes: 23 additions & 1 deletion src/main/content/jcr_root/apps/multicomposite/granite/multicomposite/render.jsp
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,11 +9,22 @@
<div ${multi.attributes} data-original-count="${fn:length(multi.values)}" data-base-name="${multi.baseName}" data-multi-name="${multi.name}" data-allow-reorder="${multi.allowReorder }">
<ol class="coral-Multifield-list js-coral-Multicompositefield-list multicompositefield-list">
<c:forEach var="value" items="${multi.values}" varStatus="valueStatus">
<li class="js-coral-Multicompositefield-input coral-Multifield-input">
<li class="js-coral-Multicompositefield-input coral-Multicompositefield-input coral-Multifield-input">
<section class='coral-Form-fieldset multicompositefield-item'>
<div>
<c:forEach var="field" items="${multi.fields}">
<div class="multicompositefield-field" data-content-path="${multi.name}/${multi.baseName}#/${field.name}" data-parent-content-path="${multi.parentContentPath}">
<c:if test="${not empty field.fieldLabel}">
<label class="coral-Form-fieldlabel">${field.fieldLabel}</label>
</c:if>
<c:if test="${not empty field.fieldDescription}">
<span class="coral-Form-fieldinfo coral-Icon coral-Icon--infoCircle coral-Icon--sizeS"
data-init="quicktip"
data-quicktip-type="info"
data-quicktip-arrow="right"
data-quicktip-content="${field.fieldDescription}">
</span>
</c:if>
<c:set var="multiPath" scope="request" value="${multi.name}/${multi.baseName}${valueStatus.count}/${field.name}"/>
<c:set var="multiParentContentPath" scope="request" value="${multi.name}/${multi.baseName}#/${field.name}"/>
<multicomposite:widgetInclude valueMap="${value}" path="${field.path}"/>
Expand All @@ -31,6 +42,17 @@
<div>
<c:forEach var="field" items="${multi.fields}">
<div class="multicompositefield-field" data-content-path="${multi.name}/${multi.baseName}#/${field.name}" data-parent-content-path="${multi.parentContentPath}">
<c:if test="${not empty field.fieldLabel}">
<label class="coral-Form-fieldlabel">${field.fieldLabel}</label>
</c:if>
<c:if test="${not empty field.fieldDescription}">
<span class="coral-Form-fieldinfo coral-Icon coral-Icon--infoCircle coral-Icon--sizeS"
data-init="quicktip"
data-quicktip-type="info"
data-quicktip-arrow="right"
data-quicktip-content="${field.fieldDescription}">
</span>
</c:if>
<c:set var="multiPath" scope="request" value="${multi.name}/${multi.baseName}${valueStatus.count}/${field.name}"/>
<c:set var="multiParentContentPath" scope="request" value="${multi.name}/${multi.baseName}#/${field.name}"/>
<multicomposite:widgetInclude path="${field.path}"/>
Expand Down
2 changes: 1 addition & 1 deletion src/main/content/jcr_root/etc/clientlibs/multicomposite-touchui/css.txt
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
#base=css

Mutlicomposite.css
Multicomposite.less
115 changes: 115 additions & 0 deletions src/main/content/jcr_root/etc/clientlibs/multicomposite-touchui/css/Multicomposite.less
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,115 @@
/* Multicompositefield.form.styl */

.coral-Form--vertical .coral-Form-field.coral-Multicompositefield {
display: block;
}

/* Multicompositefield.dark.styl */

.coral--dark .coral-Multicompositefield,
.coral--dark.coral-Multicompositefield {
border-color: #434343;
background-color: #484848;
}

.coral-Form-field.coral-Multifield.coral-Multicompositefield {
.coral-Multicompositefield-add {
margin-top: .625rem;
}

.coral-Multicompositefield-remove {
position: absolute;
top: 0;
right: 2.375rem;
margin-top: 0.5rem;
}

.coral-Multicompositefield-move {
cursor: url("coralui2/resources/shared/cursors/Cur_Hand_11_11.cur"),move;
cursor: -webkit-grab;
cursor: -moz-grab;
position: absolute;
top: 0;
right: 0;
margin-top: 0.5rem;
}

.coral-Multicompositefield-move:active {
cursor: url("coralui2/resources/shared/cursors/Cur_Fist_11_11.cur"),default !important;
cursor: -webkit-grabbing !important;
cursor: -moz-grabbing !important;
}

.coral-Multicompositefield-input {
position: relative;
margin-top: .5rem;
padding-right: 0;
margin-right: 0;
}

.coral-Multicompositefield-input:first-child {
margin-top: 0;
}

.coral-Multicompositefield-input > :first-child {
width: 100%;
}

.coral-Multicompositefield-input:only-child .coral-Multicompositefield-move {
display: none;
}

.coral-Multicompositefield-input.is-dragging {
opacity: .9;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
filter: alpha(opacity=90);
position: absolute;
top: 0;
left: 0;
z-index: 10000;
}

.coral-Multicompositefield-input.is-dragging:first-child + .coral-Multicompositefield-input {
margin-top: 0;
}

.coral-Multicompositefield-input + .coral-Multicompositefield-input {
margin-top: .625rem;
}

.coral-Multicompositefield-input--dragAfter {
position: relative;
top: 3rem;
}

.multicompositefield-list {
li {
padding-top: 1rem;
&:not(:first-child) {
border-top: 1px solid #3c3c3c;
margin-top: 1rem;
}
}
}

.multicompositefield-item {
padding-top: 1rem;
.coral-Form-fieldlabel {
min-height: auto;
margin-top: 0.2rem;
line-height: 1.0625rem;
}

.multicompositefield-field {
position: relative;
}

.coral-Form-fieldinfo {
float: right;
margin-top: 0.5rem;
&:after {
clear: both;
}
}
}
}
79 changes: 0 additions & 79 deletions src/main/content/jcr_root/etc/clientlibs/multicomposite-touchui/css/Mutlicomposite.css
View file
Open in desktop

This file was deleted.

26 changes: 21 additions & 5 deletions src/main/java/com/citytechinc/aem/multicompositeaddon/Multicomposite.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ public Multicomposite(ComponentHelper component, I18n i18n, SlingHttpServletRequ
Config config = component.getConfig();
attributes = buildAttributes(config, component.consumeTag());
readOnlyAttributes = buildReadOnlyAttributes(component);
fields = buildFields(config);
fields = buildFields(component);
parentContentPath = (String) request.getAttribute("multiParentContentPath");
name =
StringUtils.isNotEmpty((String) request.getAttribute("multiPath")) ? (String) request
Expand Down Expand Up @@ -75,12 +75,12 @@ private String buildReadOnlyAttributes(ComponentHelper component) {
return attrBuilder.build();
}

private List<SubField> buildFields(Config config) {
private List<SubField> buildFields(ComponentHelper component) {
List<SubField> fields = new ArrayList<SubField>();
Resource fieldsResource = config.getChild("fields");
Resource fieldsResource = component.getConfig().getChild("fields");
if (fieldsResource != null && !ResourceUtil.isNonExistingResource(fieldsResource)) {
for (Resource fieldResource : fieldsResource.getChildren()) {
fields.add(new SubField(fieldResource));
fields.add(new SubField(fieldResource, component));
}
}
return fields;
Expand Down Expand Up @@ -137,12 +137,20 @@ public String getFieldLabel() {
public class SubField {

private final String name;
private final String fieldLabel;
private final String fieldDescription;
private final String resourceType;
private final String path;

public SubField(final Resource component) {
public SubField(final Resource component, final ComponentHelper helper) {
ValueMap valueMap = component.adaptTo(ValueMap.class);
this.name = valueMap.get("name", "");
this.fieldLabel = helper.getXss().encodeForHTML(i18n.getVar(valueMap.get("fieldLabel", "")));
this.fieldDescription = helper.getXss().encodeForHTMLAttr(
i18n.getVar(
valueMap.get("fieldDescription", "")
)
);
this.path = component.getPath();
this.resourceType = component.getResourceType();
}
Expand All @@ -155,6 +163,14 @@ public String getName() {
return name;
}

public String getFieldLabel() {
return fieldLabel;
}

public String getFieldDescription() {
return fieldDescription;
}

public String getResourceType() {
return resourceType;
}
Expand Down