gabrielwalt

java -jar cq-quickstart-6.0.0.jar -debug 10123

gabrielwalt

var SlingSettingsService = Packages.org.apache.sling.settings.SlingSettingsService;
 
use(function () {
    // Get runmodes and transform them into an object that is easier to read for Sightly
    var runmodesObj = {};
    var runmodesSet = sling.getService(SlingSettingsService).getRunModes();
    var iterator = runmodesSet.iterator();
    
    while (iterator.hasNext()) {
        runmodesObj[iterator.next()] = true;

gabrielwalt

As Sightly only knows the syntax of HTML and not of JS or of CSS, it can automatically execute the appropriate escaping and cross-site scripting protection for expressions located in HTML, but it cannot do that for expressions located in JS or in CSS contexts. To remain as secure as possible, Sightly makes it mandatory to provide explicitly the context in those two contexts.

For Handlebar templates, this is unfortunate though as it is actually not JavaScript, but HTML that is located within the script elements, which Sightly would be able to parse properly. This trick shows that by separating the Handlebar script into a dedicated file, Sightly then parses that template as HTML again.

Without separating this example into two distinct files, the expression of the example should have been written as follows: ${properties.jcr:title @ context='text'}

The list of all available contexts can be found here: http://docs.adobe.com/content/docs/en/aem/6-0/develop/sightly.html#Display%20Context

gabrielwalt

use(function () {
    var myObj = {
        foo: "bar",
        arr: [1,2,3,4,5,6,7,8,9,10]
    };

    return {
        json: JSON.stringify(myObj)
    };
});

gabrielwalt

package org.summit.lab.core.models;

import java.util.HashMap;
import java.util.Iterator;
import java.util.Map;

import javax.annotation.PostConstruct;
import javax.inject.Inject;
import javax.jcr.RepositoryException;
import javax.jcr.Session;

gabrielwalt

/content
    /example
        @jcr:primaryType = "nt:unstructured"
        @jcr:title = "Outer Component"
        @sling:resourceType = "example/components/outer"
        /one
            @jcr:primaryType = "nt:unstructured"
            @jcr:title = "Inner Component One"
            @sling:resourceType = "example/components/inner"
        /two

gabrielwalt

/content
    /example
        @jcr:primaryType = "nt:unstructured"
        @jcr:title = "Outer Component"
        @sling:resourceType = "example/components/outer"
/apps
    /example
        /components
            /inner
                @jcr:primaryType = "cq:Component"

gabrielwalt

<sly data-sly-template.card="${@ img, title, content}">
    <div class="card">
        <img src="${img}" alt/>
        <h2>${title}</h2>
        <div class="content" data-sly-test="${content}" data-sly-call="${content}"></div>
    </div>
</sly>

<sly data-sly-template.example>
    <p>This example shows how to pass markup to a template</p>

gabrielwalt

1. Use statement

template.html

<sly data-sly-use.logic="logic.js">
    <h1>${logic.pageTitle}</h1>
</sly>

gabrielwalt

#!/bin/bash
mvn archetype:generate \
 -DarchetypeGroupId=com.adobe.granite.archetypes \
 -DarchetypeArtifactId=aem-project-archetype \
 -DarchetypeVersion=22 \
 -DgroupId=org.myorg \
 -DartifactId=mysite \
 -DartifactName="My Site" \
 -Dversion=0.0.1-SNAPSHOT \
 -Dpackage=org.myorg.mysite \