Adobe-Consulting-Services/acs-aem-commons

View on GitHub
ui.apps/src/main/content/jcr_root/apps/acs-commons/components/utilities/manage-redirects/manage-redirects.html

Summary

Maintainability
Test Coverage
<!--
  ~ ACS AEM Commons
  ~
  ~ Copyright (C) 2013 - 2023 Adobe
  ~
  ~ Licensed under the Apache License, Version 2.0 (the "License");
  ~ you may not use this file except in compliance with the License.
  ~ You may obtain a copy of the License at
  ~
  ~      http://www.apache.org/licenses/LICENSE-2.0
  ~
  ~ Unless required by applicable law or agreed to in writing, software
  ~ distributed under the License is distributed on an "AS IS" BASIS,
  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  ~ See the License for the specific language governing permissions and
  ~ limitations under the License.
  -->

<!DOCTYPE html>
<html  lang="en" >
<head>
    <link rel="shortcut icon" href="/libs/granite/core/content/login/favicon.ico">
</head>
<body class="coral--light foundation-layout-util-maximized-alt">
<sly data-sly-call="${clientLib.all @ categories=['coralui3','granite.ui.coral.foundation','granite.ui.shell','cq.authoring.dialog', 'acs-commons.manage-redirects.app']}"
     data-sly-use.clientLib="/libs/granite/sightly/templates/clientlib.html"
     data-sly-use.redirectsTemplate="template.html"
     data-sly-use.context="serverlibs/context.js"
     data-sly-use.pg="com.adobe.acs.commons.redirects.models.Redirects"/>

<input type="hidden" name="caconfig" value="${context.redirectResource.path}"/>
<input type="hidden" name="fulltextSearchEnabled" value="${context.redirectResource.valueMap['fulltextSearchEnabled']}"/>

<coral-shell-header aria-hidden="false" aria-label="Header Bar"
                    class="coral--dark granite-shell-header coral3-Shell-header"
                    role="region">
    <coral-shell-header-home aria-level="2" class="globalnav-toggle" data-globalnav-toggle-href="/" role="heading">
        <a class="coral3-Shell-homeAnchor" href="/"
           icon="adobeExperienceManagerColor" is="coral-shell-homeanchor"
           style="display: inline-block; padding-right: 0;">
            <coral-icon
                    aria-label="adobe experience manager color"
                    class="coral3-Icon coral3-Shell-homeAnchor-icon coral3-Icon--adobeExperienceManagerColor coral3-Icon--sizeM"
                    icon="adobeExperienceManagerColor" role="img"
                    size="M"></coral-icon>
            <coral-shell-homeanchor-label>Adobe Experience Manager
            </coral-shell-homeanchor-label>
        </a>
        <span style="line-height: 2.375rem;"> / ACS AEM Commons / ${properties.jcr:title} </span>
    </coral-shell-header-home>
</coral-shell-header>


<div class="foundation-layout-panel">
    <div class="foundation-layout-panel-header">
        <betty-titlebar>
            <betty-titlebar-title>
                <betty-breadcrumbs  class="granite-collection-navigator" id="granite-collection-breadcrumbs-toggle" trackingfeature="aem:collectionpage" trackingelement="breadcrumbs" data-granite-collection-navigator-target=".granite-request-collection">
                    <betty-breadcrumbs-item  data-granite-collection-navigator-href="#">Manage Redirects</betty-breadcrumbs-item>
                    <betty-breadcrumbs-item  data-granite-collection-navigator-href="/apps/acs-commons/content/redirect-manager/redirects.html">Redirect Configurations</betty-breadcrumbs-item>
                </betty-breadcrumbs>
            </betty-titlebar-title>
            <betty-titlebar-primary></betty-titlebar-primary>
            <betty-titlebar-secondary>
            </betty-titlebar-secondary>
        </betty-titlebar>
    </div>
    <div class="content-container-inner" style="width:95%; margin:0 auto;">
        <coral-alert size="L" variant="warning" data-sly-test=${context.disabled}>
            <coral-alert-header>OSGi CONFIGURATION MISSING</coral-alert-header>
            <coral-alert-content>RedirectFilter is disabled and requires an OSGi configuration to start.
                Please create an OSGi configuration for PID <i>com.adobe.acs.commons.redirects.filter.RedirectFilter</i>
                <p>
                    For more information, see the <a target="_blank" href="https://adobe-consulting-services.github.io/acs-aem-commons/features/redirect-manager/index.html">ACS AEM Commons Redirect Manager feature doc page</a>.
                </p>
            </coral-alert-content>
        </coral-alert>
        <coral-tabview>
            <coral-tablist target="main-panel-1">
                <coral-tab>Manage</coral-tab>
                <coral-tab>Export</coral-tab>
                <coral-tab>Import</coral-tab>
                <coral-tab>Publish</coral-tab>
                <coral-tab>Options</coral-tab>
            </coral-tablist>
            <coral-panelstack id="main-panel-1" >
                <coral-panel class="coral-Well">
                    <div class="coral-Form-fieldwrapper">
                        <button class="coral-Button coral-Button--primary new-redirect-rule"
                                data-path="${context.redirectResource.path}/*">
                            + Redirect Configuration</button>
                    </div>
                    <br />
                    <div data-sly-test="${pg.contextPrefix}"
                         class="coral-Form-fieldwrapper context-prefix-set">
                        A context prefix <h3 style="display: inline;">${pg.contextPrefix}</h3>
                        has been set for this configuration.<br>
                        This prefix can be omitted from the redirect rules.<br>
                        To ignore the context prefix for a rule, check the "Ignore Context Prefix" checkbox or use an absolute url.

                    </div>
                    <section class="coral-Form coral-Form--vertical">
                        <div clas="coral-Form-fieldset">
                            <br>
                            <coral-search placeholder="Search" class="coral-Form-field" name="redirect-rule-search" id="redirect-search-box"  data-path="${context.redirectResource.path}/"/>
                            </coral-search>
                        </div>

                        <table is="coral-table" id="edit-redirect-coral-table" class="table-sticky" orderable  style="height:500px">
                            <colgroup>
                                <col is="coral-table-column">
                                <col is="coral-table-column">
                                <col is="coral-table-column">
                                <col is="coral-table-column">
                                <col is="coral-table-column" fixedwidth>
                                <col is="coral-table-column" fixedwidth>
                                <col is="coral-table-column">
                                <col is="coral-table-column">
                                <col is="coral-table-column">
                                <col is="coral-table-column">
                                <col is="coral-table-column">
                                <col is="coral-table-column">
                                <col is="coral-table-column">
                            </colgroup>
                            <thead is="coral-table-head" sticky>
                            <tr is="coral-table-row">
                                <th is="coral-table-headercell">Edit</th>
                                <th is="coral-table-headercell">Redirect From</th>
                                <th is="coral-table-headercell">Redirect To</th>
                                <th is="coral-table-headercell">Status Code</th>
                                <th is="coral-table-headercell">Created By</th>
                                <th is="coral-table-headercell">State</th>
                                <th is="coral-table-headercell">On Time</th>
                                <th is="coral-table-headercell">Off Time</th>
                                <th is="coral-table-headercell">Tags</th>
                                <th is="coral-table-headercell">Notes</th>
                                <th is="coral-table-headercell">Evaluate URI</th>
                                <th is="coral-table-headercell">Ignore Context Prefix</th>
                                <th is="coral-table-headercell">Cache Control</th>
                                <th is="coral-table-headercell"></th>
                            </tr>
                            </thead>

                            <tbody is="coral-table-body" id="redirect-rows" divider="cell">
                                <sly data-sly-list.item="${pg.items}">
                                    <sly data-sly-call="${redirectsTemplate.row @ redirectResource = item, allowRearrange = true}"/>
                                </sly>
                            </tbody>

                        </table>
                        <div id="table-footer" data-sly-test="${pg.paginated}">
                            <a data-sly-test="${pg.hasPrevious}" href="/apps/acs-commons/content/redirect-manager.html${request.requestPathInfo.suffix}?page=${pg.previousPage}">
                                Previous
                            </a>

                            Page ${pg.pageNumber} of ${pg.pages}

                            <a  data-sly-test="${pg.hasNext}"  href="/apps/acs-commons/content/redirect-manager.html${request.requestPathInfo.suffix}?page=${pg.nextPage}">
                                Next
                            </a>
                        </div>
                    </section>
                </coral-panel>
                <coral-panel class="coral-Well">
                    <section>
                        <h2 class="coral-Heading coral-Heading--2">Export Redirect Map</h2>
                        <p>Export combined redirect map into Excel spreadsheet. You can edit it offline and upload the redirect configurations using the Import option.</p>
                        <form action="${resource.path}.export.html" method="get" class="coral-Form--aligned">
                            <input type="hidden" name="path" value="${context.redirectResource.path}" />
                            <div class="coral-Form-fieldwrapper">
                                <button class="coral-Button coral-Button--primary  cq-dialog-download" icon="fileExcel" is="coral-button" variant="primary">Export Redirect Map</button>
                            </div>
                        </form>
                    </section>
                </coral-panel>
                <coral-panel class="coral-Well">
                    <section>
                        <h2 class="coral-Heading coral-Heading--2">Import Redirect Map</h2>
                        <p>The redirect map file will be combined with the redirects configured in AEM to create the final set of redirects. This file should be a spreadsheet file with the first column containing the source path, the second column containing the redirect destination and the third column containing the redirect status code.</p>
                        <form action="${resource.path}.import.html" method="post" class="coral-Form--aligned" enctype="multipart/form-data" >
                            <input type="hidden" name="path" value="${context.redirectResource.path}" />
                            <div class="coral-Form-fieldwrapper">
                                <label class="coral-Form-fieldlabel" id="label-vertical-inputgroup-2"> Excel Spreadsheet With Redirects * </label>
                                <div class="coral-InputGroup coral-Form-field">
                                    <input is="coral-Textfield" class="coral-InputGroup-input coral3-Textfield" id="acs-redirect-import-ctrl" type="file" name="./redirects.redirectmap.xlsx" accept=".xlsx" />
                                </div>
                            </div>
                            <div class="coral-Form-fieldwrapper">
                                <button class="coral-Button  acs-redirects-form-import" icon="fileExcel" is="coral-button" variant="primary">Import Redirect Map</button>
                            </div>
                        </form>
                    </section>
                </coral-panel>
                <coral-panel class="coral-Well">
                    <section>
                        <form action="${resource.path}.replicate.html" method="post" class="coral-Form--aligned">
                            <input type="hidden" name="cmd" value="Activate" />
                            <input type="hidden" name="path" value="${context.redirectResource.path}" />
                            <input type="hidden" name="_charset_" value="utf-8" />
                            <div class="coral-Form-fieldwrapper">
                                <button class="coral-Button cq-dialog-publish" icon="publish" is="coral-button" variant="primary" alert="Redirects have been published">Publish Redirect Configurations
                                </button>
                                <p>Last Published: ${'dd-MMMM-yyyy hh:mm:ss' @ format=context.redirectResource.valueMap['cq:lastReplicated'], timezone='EST'} by ${context.redirectResource.valueMap['cq:lastReplicatedBy']}
                                </p>
                            </div>
                        </form>
                    </section>
                </coral-panel>
                <coral-panel class="coral-Well">
                    <section>
                        <sly data-sly-resource="${resource.parent.path}/options-form"></sly>
                    </section>
                </coral-panel>
            </coral-panelstack>
        </coral-tabview>

        <div data-sly-list="${resource.getChildren}">
            <sly data-sly-resource="${item.path}"></sly>
        </div>

    </div>
</div>

<div id="swap">
    <tbody is="coral-table-body" id="search-tbody" divider="cell" style="display: none;">
    </tbody>
</div>
</body>
</html>