edx-platform/cms/templates/container.html

<%inherit file="base.html" />
<%def name="online_help_token()">
<%
if is_unit_page:
    return "unit"
else:
    return "container"
%>
</%def>
<%!
import json

from contentstore.views.helpers import xblock_studio_url, xblock_type_display_name
from django.utils.translation import ugettext as _
%>
<%block name="title">${xblock.display_name_with_default} ${xblock_type_display_name(xblock)}</%block>
<%block name="bodyclass">is-signedin course container view-container</%block>

<%namespace name='static' file='static_content.html'/>

<%!
templates = ["basic-modal", "modal-button", "edit-xblock-modal",
    "editor-mode-button", "upload-dialog", "image-modal",
    "add-xblock-component", "add-xblock-component-button", "add-xblock-component-menu",
    "add-xblock-component-menu-problem", "xblock-string-field-editor", "publish-xblock", "publish-history",
    "unit-outline", "container-message"]
%>
<%block name="header_extras">
% for template_name in templates:
<script type="text/template" id="${template_name}-tpl">
    <%static:include path="js/${template_name}.underscore" />
</script>
% endfor
<link rel="stylesheet" type="text/css" href="${static.url('js/vendor/timepicker/jquery.timepicker.css')}" />
</%block>

<%block name="jsextra">
<script type='text/javascript'>
    require(["domReady!", "jquery", "js/models/xblock_info", "js/views/pages/container",
        "js/collections/component_template", "xmodule", "coffee/src/main", "xblock/cms.runtime.v1"],
            function(doc, $, XBlockInfo, ContainerPage, ComponentTemplates, xmoduleLoader) {
                var templates = new ComponentTemplates(${component_templates | n}, {parse: true});
                var mainXBlockInfo = new XBlockInfo(${json.dumps(xblock_info) | n}, {parse: true});
                var isUnitPage = ${json.dumps(is_unit_page)}

                xmoduleLoader.done(function () {
                    var view = new ContainerPage({
                        el: $('#content'),
                        model: mainXBlockInfo,
                        action: "${action}",
                        templates: templates,
                        isUnitPage: isUnitPage
                    });
                    view.render();
                });
            });
</script>

</%block>

<%block name="content">


<div class="wrapper-mast wrapper">
    <header class="mast has-actions has-navigation has-subtitle">
        <div class="page-header">
            <small class="navigation navigation-parents subtitle">
                % for ancestor in ancestor_xblocks:
                    <%
                    ancestor_url = xblock_studio_url(ancestor)
                    %>
                    % if ancestor_url:
                        <a href="${ancestor_url}" class="navigation-item navigation-link navigation-parent">${ancestor.display_name_with_default | h}</a>
                    % else:
                        <span class="navigation-item navigation-parent">${ancestor.display_name_with_default | h}</span>
                    % endif
                % endfor
            </small>
            <div class="wrapper-xblock-field incontext-editor is-editable"
                 data-field="display_name" data-field-display-name="${_("Display Name")}">
                <h1 class="page-header-title xblock-field-value incontext-editor-value"><span class="title-value">${xblock.display_name_with_default | h}</span></h1>
            </div>
        </div>

        <nav class="nav-actions">
            <h3 class="sr">${_("Page Actions")}</h3>
            <ul>
                % if is_unit_page:
                    <li class="action-item action-view nav-item">
                        <a href="${published_preview_link}" class="button button-view action-button is-disabled" rel="external">
                            <span class="action-button-text">${_("View Live Version")}</span>
                        </a>
                    </li>
                    <li class="action-item action-preview nav-item">
                        <a href="${draft_preview_link}" class="button button-preview action-button is-disabled" rel="external">
                            <span class="action-button-text">${_("Preview Changes")}</span>
                        </a>
                    </li>
                % else:
                    <li class="action-item action-edit nav-item">
                        <a href="#" class="button button-edit action-button edit-button">
                            <i class="icon-pencil"></i>
                            <span class="action-button-text">${_("Edit")}</span>
                        </a>
                    </li>
                % endif
            </ul>
        </nav>
    </header>
</div>

<div class="wrapper-content wrapper">
    <div class="inner-wrapper">
        <section class="content-area">

            <article class="content-primary">
                <div class="container-message wrapper-message"></div>
                <section class="wrapper-xblock level-page is-hidden studio-xblock-wrapper" data-locator="${xblock_locator}" data-course-key="${xblock_locator.course_key}">
                </section>
                <div class="ui-loading">
                    <p><span class="spin"><i class="icon-refresh"></i></span> <span class="copy">${_("Loading...")}</span></p>
                </div>
            </article>
            <aside class="content-supplementary" role="complimentary">
                % if not is_unit_page:
                    <div class="bit">
                        <h3 class="title-3">${_("What can I do on this page?")}</h3>
                        <ul class="list-details">
                            <li class="item-detail">${_("You can view and edit course components that contain other components on this page. In the case of experiment blocks, this allows you to confirm that you have properly configured your experiment groups and make changes to existing content.")}</li>
                        </ul>
                    </div>
                % endif
                % if is_unit_page:
                    <div id="publish-unit"></div>
                    <div id="publish-history" class="unit-publish-history"></div>
                    <div class="unit-location is-hidden">
                        <h4 class="bar-mod-title">${_("Unit Location")}</h4>
                        <div class="wrapper-unit-id bar-mod-content">
                            <h5 class="title">${_("Location ID")}</h5>
                            <p class="unit-id">
                                <span class="unit-id-value" id="unit-location-id-input">${unit.location.name}</span>
                                <span class="tip"><span class="sr">Tip: </span>${_("Use this ID when you create links to this unit from other course content. You enter the ID in the URL field.")}</span>
                            </p>
                        </div>
                        <div class="wrapper-unit-tree-location bar-mod-content">
                            <h5 class="title">${_("Location in Course Outline")}</h5>
                            <div class="wrapper-unit-overview outline outline-simple">
                            </div>
                        </div>
                    </div>
                % endif
            </aside>
        </section>
    </div>
</div>
</%block>