tile.jsp 7.18 KB
<%--
  ADOBE CONFIDENTIAL

  Copyright 2015 Adobe Systems Incorporated
  All Rights Reserved.

  NOTICE:  All information contained herein is, and remains
  the property of Adobe Systems Incorporated and its suppliers,
  if any.  The intellectual and technical concepts contained
  herein are proprietary to Adobe Systems Incorporated and its
  suppliers and may be covered by U.S. and Foreign Patents,
  patents in process, and are protected by trade secret or copyright law.
  Dissemination of this information or reproduction of this material
  is strictly forbidden unless prior written permission is obtained
  from Adobe Systems Incorporated.
--%><%
%><%@include file="/libs/granite/ui/global.jsp" %><%
%><%@page session="false"
          import="java.util.Iterator,
                  com.adobe.granite.ui.components.AttrBuilder,
                  com.adobe.granite.ui.components.Config,
                  com.adobe.granite.ui.components.Tag,
                  org.apache.sling.api.resource.Resource" %>
<%@ page import="org.apache.sling.api.resource.ValueMap" %>
<%--###
Tile
=====

.. granite:servercomponent:: /libs/screens/dcc/components/granite/dashboard/tile



   It has the following content structure:

   .. gnd:gnd::

      [granite:Tile] > granite:commonAttrs, granite:renderCondition

      /**
       *
       */
      - title (String)

      /**
       *
       */
      + actions
        + default
        + selection

      /**
       *
       */
      + items

   Example::

      + mytile
        - sling:resourceType = "screens/dcc/components/granite/dashboard/tile"
        - title = "A random title"
        + actions
        + items
###--%><%

    if (!cmp.getRenderCondition(resource, false).check()) {
        return;
    }

    Config cfg = cmp.getConfig();

    Tag tag = cmp.consumeTag();

    AttrBuilder attrs = tag.getAttrs();
    cmp.populateCommonAttrs(attrs);

    attrs.addClass("granite-dashboard-Tile");

%><section <%= attrs.build() %>>
    <div class="granite-dashboard-Tile-header">
        <%
            String targetCollection = cfg.get("target", "");
            String modeGroup = xssAPI.encodeForHTMLAttr(cfg.get("modeGroup", ""));
            Resource actions = resource.getChild("actions");
            if (actions != null) {
                Resource item = null;
        %>
        <div class="foundation-mode-switcher" data-foundation-mode-switcher-group="<%= modeGroup %>">
            <%
                Resource defaultActions = actions.getChild("default");
                if (defaultActions != null) {
            %>
            <div class="foundation-mode-switcher-item foundation-mode-switcher-item-active" data-foundation-mode-switcher-item-mode="default">
                <coral-actionbar class="granite-dashboard-Tile-header-actionbar" data-foundation-collection-actionbar-target="<%= modeGroup %>">
                    <coral-actionbar-container>
                        <coral-actionbar-item>
                            <span class="granite-dashboard-Tile-header-title">
                                <%= outVar(xssAPI, i18n, cfg.get("title", "")) %>
                            </span>
                        </coral-actionbar-item>
                    </coral-actionbar-container>
                    <coral-actionbar-container class="granite-dashboard-Tile-header-actions" threshold="1">
                        <%
                            int actionsCount = 0;
                            for (Iterator<Resource> it = defaultActions.listChildren(); it.hasNext();) {
                                item = it.next();
                                actionsCount++;
                        %>
                        <coral-actionbar-item>
                            <sling:include resource="<%= item %>" />
                        </coral-actionbar-item>
                        <%
                            }

                            if (actionsCount > 1) {
                        %>
                        <!-- used to enforce a fake 0 treshold -->
                        <coral-actionbar-item></coral-actionbar-item>
                        <%  } %>
                    </coral-actionbar-container>
                </coral-actionbar>
            </div>
            <% } %>
            <%
                Resource selectionActions = actions.getChild("selection");
                if (selectionActions != null) {
            %>
            <div class="foundation-mode-switcher-item" data-foundation-mode-switcher-item-mode="selection">
                <coral-actionbar class="foundation-collection-actionbar granite-dashboard-Tile-header-actionbar" data-foundation-collection-actionbar-target="<%= modeGroup %>">
                    <coral-actionbar-container class="granite-dashboard-Tile-header-actions ">
                        <%
                            for (Iterator<Resource> it = selectionActions.listChildren(); it.hasNext();) {
                                item = it.next();
                        %>
                        <coral-actionbar-item>
                            <sling:include resource="<%= item %>" />
                        </coral-actionbar-item>
                        <% } %>
                    </coral-actionbar-container>
                    <coral-actionbar-container class="granite-dashboard-Tile-header-actions ">
                        <coral-actionbar-item><%
                            AttrBuilder deselectAttrs = new AttrBuilder(request, xssAPI);
                            deselectAttrs.add("type", "button");
                            deselectAttrs.add("is", "coral-button");
                            deselectAttrs.add("variant", "quiet");
                            deselectAttrs.addClass("granite-collection-deselect");
                            deselectAttrs.add("data-granite-collection-deselect-target", targetCollection);

                            AttrBuilder counterAttrs = new AttrBuilder(request, xssAPI);
                            counterAttrs.addClass("foundation-admin-selectionstatus");
                            counterAttrs.add("data-foundation-admin-selectionstatus-template", i18n.get("{0} selected", null, "{{count}}"));
                            counterAttrs.add("data-foundation-admin-selectionstatus-target", targetCollection);

                            %><button <%= deselectAttrs %>><span <%= counterAttrs %>></span><coral-icon icon="close" size="S"></coral-icon></button>
                        </coral-actionbar-item>
                    </coral-actionbar-container>
                </coral-actionbar>
            </div>
            <% } %>
        </div>
        <% } %>
    </div>
    <%
        AttrBuilder contentAttrs = new AttrBuilder(request, xssAPI);
        Resource content = resource.getChild("content");

        contentAttrs.addClass("granite-dashboard-Tile-content");
        if (content != null) {
            ValueMap contentProps = content.getValueMap();
            contentAttrs.addClass(contentProps.get("granite:class", ""));
        }

    %>
    <div <%= contentAttrs.build() %>>
    <%
        if (content != null) {
            for (Iterator<Resource> it = content.listChildren(); it.hasNext();) {
                Resource item = it.next();
    %><sling:include resource="<%= item %>" /><%
        }
    }
    %>
    </div>
</section>