Files
edx-platform/cms/templates/edit-tabs.html
Nimisha Asthagiri e86b4a12dc Changes for viewing built-in tabs in studio
Changed "Status Page" -> "Page".

UX:
    support for displaying built-in tabs
    restored drag and drop on Studio Pages
    additional styling for fixed state on Studio Pages
    add a new page action added to bottom of Studio Pages

Dev
    changes for viewing tabs in studio,
    refactored the tab code,
    decoupled the code from django layer.
    is_hideable flag on tabs
    get_discussion method is needed to continue to support
external_discussion links for now since used by 6.00x course.
    override the __eq__ operator to support comparing with
dict-type tabs.

Test
    moved test code to common,
    added acceptance test for built-in pages
    added additional unit tests for tabs.
    changed test_split_modulestore test to support serializing objects
that are fields in a Course.

Env:
    updated environment configuration settings so they are
    consistent for both cms and lms.
2014-03-21 13:58:01 -04:00

127 lines
4.8 KiB
HTML

<%inherit file="base.html" />
<%namespace name='static' file='static_content.html'/>
<%!
from django.utils.translation import ugettext as _
from django.core.urlresolvers import reverse
%>
<%block name="title">${_("Pages")}</%block>
<%block name="bodyclass">is-signedin course view-static-pages</%block>
<%block name="jsextra">
<script type='text/javascript'>
require(["js/models/explicit_url", "coffee/src/views/tabs",
"xmodule", "coffee/src/main", "xblock/cms.runtime.v1"],
function (TabsModel, TabsEditView) {
var model = new TabsModel({
id: "${course_locator}",
explicit_url: "${course_locator.url_reverse('tabs')}"
});
new TabsEditView({
el: $('.tab-list'),
model: model,
mast: $('.wrapper-mast')
});
});
</script>
</%block>
<%block name="content">
<div class="wrapper-mast wrapper">
<header class="mast has-actions has-subtitle">
<h1 class="page-header">
<small class="subtitle">${_("Content")}</small>
## Translators: Pages refer to the tabs that appear in the top navigation of each course.
<span class="sr">&gt; </span>${_("Pages")}
</h1>
<nav class="nav-actions">
<h3 class="sr">${_("Page Actions")}</h3>
<ul>
<li class="nav-item">
<a href="#" class="button new-button new-tab"><i class="icon-plus"></i> ${_("New Page")}</a>
</li>
</ul>
</nav>
</header>
</div>
<div class="wrapper-content wrapper">
<section class="content">
<article class="content-primary" role="main">
<div class="inner-wrapper">
<article class="unit-body">
<div class="tab-list">
<ol class="course-nav-tab-list components">
% for tab in built_in_tabs:
<li class="course-nav-tab fixed">
<div class="course-nav-tab-header">
<h3 class="title">${_(tab.name)}</h3>
</div>
<div class="course-nav-tab-actions wrapper-actions-list">
<ul class="actions-list">
% if tab.is_hideable:
<li class="action-item action-visible">
<label for="[id]"><span class="sr">${_("Show this page")}</span></label>
<input type="checkbox" id="[id]" class="toggle-checkbox" data-tooltip="${_('Show/hide page')}" />
<div class="action-button"><i class="icon-eye-open"></i><i class="icon-eye-close"></i></div>
</li>
%endif
</ul>
</div>
<div class="drag-handle is-fixed" data-tooltip="${_('Cannot be reordered')}">
<span class="sr">${_("Fixed page")}</span>
</div>
</li>
% endfor
% for locator in components:
<li class="component" data-locator="${locator}"></li>
% endfor
<li class="new-component-item">
</li>
</ol>
</div>
<div class="add-pages">
<p>${_("You can add additional custom pages to your course.")} <a href="#" class="button new-button new-tab"><i class="icon-plus"></i>${_("Add a New Page")}</a></p>
</div>
</article>
</div>
</article>
<aside class="content-supplementary" role="complimentary">
<div class="bit">
<h3 class="title-3">${_("What are Pages?")}</h3>
<p>${_("Pages are the items that appear in your course navigation. Some are required and cannot be moved or edited (Courseware, Course info, Discussion, Progress, Wiki), and you can add your own custom pages to hold additional content you want to provide to your students, like a syllabus, calendar, or handouts.")}</p>
</div>
<div class="bit">
<h3 class="title-3">${_("How do Pages look to students in my course?")}</h3>
<p>${_("Pages are the navigational items that appear across the top of your course.")} <br /> <a rel="modal" href="#preview-lms-staticpages">${_("See an example")}</a></p>
</div>
</aside>
</section>
</div>
<div class="content-modal" id="preview-lms-staticpages">
<h3 class="title">${_("Pages in Your Course")}</h3>
<figure>
<img src="${static.url("img/preview-lms-staticpages.png")}" alt="${_('Preview of Pages in your course')}" />
<figcaption class="description">${_("The names of your Pages appear in your course's main navigation bar, along with Courseware, Course Info, Discussion, Wiki, and Progress.")}</figcaption>
</figure>
<a href="#" rel="view" class="action action-modal-close">
<i class="icon-remove-sign"></i>
<span class="label">${_("close modal")}</span>
</a>
</div>
</%block>