studio outline test fixes

cms/djangoapps/contentstore/features/common.py

@@ -43,9 +43,9 @@ def i_confirm_with_ok(_step):
 @step(u'I press the "([^"]*)" delete icon$')
 def i_press_the_category_delete_icon(_step, category):
     if category == 'section':
-        css = 'a.delete-button.delete-section-button span.delete-icon'
+        css = 'a.action.delete-section-button'
     elif category == 'subsection':
-        css = 'a.delete-button.delete-subsection-button  span.delete-icon'
+        css = 'a.action.delete-subsection-button'
     else:
         assert False, 'Invalid category: %s' % category
     world.css_click(css)
@@ -254,7 +254,7 @@ def create_course_with_unit():
 
     world.wait_for_js_to_load()
     css_selectors = [
-        'div.section-item a.expand-collapse-icon', 'a.new-unit-item'
+        'div.section-item a.expand-collapse', 'a.new-unit-item'
     ]
     for selector in css_selectors:
         world.css_click(selector)

cms/djangoapps/contentstore/features/section.py

@@ -29,7 +29,7 @@ def i_have_added_new_section(_step):
 
 @step('I click the Edit link for the release date$')
 def i_click_the_edit_link_for_the_release_date(_step):
-    button_css = 'div.section-published-date a.edit-button'
+    button_css = 'div.section-published-date a.edit-release-date'
     world.css_click(button_css)
 
 
@@ -88,7 +88,7 @@ def i_see_a_release_date_for_my_section(_step):
     status_text = world.css_text(css)
 
     # e.g. 11/06/2012 at 16:25
-    msg = 'Will Release:'
+    msg = 'Release date:'
     date_regex = r'(Jan|Feb|Mar|Apr|May|Jun|Jul|Aug|Sep|Oct|Nov|Dec) \d\d?, \d{4}'
     if not re.search(date_regex, status_text):
         print status_text, date_regex
@@ -117,7 +117,7 @@ def the_section_release_date_picker_not_visible(_step):
 def the_section_release_date_is_updated(_step):
     css = 'span.published-status'
     status_text = world.css_text(css)
-    assert_equal(status_text, 'Will Release: 12/25/2013 at 00:00 UTC')
+    assert_equal(status_text, 'Release date: 12/25/2013 at 00:00 UTC')
 
 
 def save_section_name(name):

cms/static/js/views/overview.js

@@ -31,7 +31,7 @@ define(["domReady", "jquery", "jquery.ui", "underscore", "gettext", "js/views/fe
 
         var toggleSubmodules = function(e) {
             e.preventDefault();
-            $(this).toggleClass('expand');
+            $(this).toggleClass('expand').toggleClass('collapse');
             $(this).closest('.is-collapsible, .window').toggleClass('collapsed');
         };
 
@@ -100,9 +100,9 @@ define(["domReady", "jquery", "jquery.ui", "underscore", "gettext", "js/views/fe
                             '<strong>' + gettext("Release date:") + '&nbsp;</strong>' +
                             gettext("{month}/{day}/{year} at {hour}:{minute} UTC") +
                             '</span>' +
-                            '<a href="#" class="edit-release-date action" data-date="{month}/{day}/{year}" data-time="{hour}:{minute}" data-locator="{locator}">' +
-                            gettext("Edit") +
-                            '</a>',
+                            '<a href="#" class="edit-release-date action" data-date="{month}/{day}/{year}" data-time="{hour}:{minute}" data-locator="{locator}"><i class="icon-time"></i> <span class="sr">' +
+                            gettext("Edit section release date") +
+                            '</span></a>',
                         {year: datetime.getUTCFullYear(), month: pad2(datetime.getUTCMonth() + 1), day: pad2(datetime.getUTCDate()),
                             hour: pad2(datetime.getUTCHours()), minute: pad2(datetime.getUTCMinutes()),
                             locator: locator},

cms/static/sass/views/_outline.scss

@@ -76,6 +76,9 @@
     padding: ($baseline/4);
   }
 
+  .new-subsection-name-input {
+    @include font-size(14);
+  }
   .new-section-name-save,
   .new-subsection-name-save {
     @include blue-button;
@@ -166,7 +169,7 @@
       &.drag-handle {
         float: none;
         margin: 0;
-        background: none;
+        background: transparent url(../img/drag-handles.png) right 5px no-repeat;
         text-align: center;
       }
 

cms/templates/js/blank-slate-template.underscore

-    <section class="courseware-section new-section">
-      <header>
-      <a href="#"  data-tooltip="${_('Collapse/expand this section')}" class="expand-collapse-icon collapse"></a>
-        <div class="item-details">
-          <h3 class="section-name">
-          <span class="section-name-span">Click here to set the section name</span>
-          <form class="section-name-form">
-            <input type="text" value="${_('New Section Name')}" class="new-section-name" />
-            <input type="submit" class="new-section-name-save" data-parent="${parent_locator}"
-                   data-category="${new_section_category}" value="${_('Save')}" />
-            <input type="button" class="new-section-name-cancel" value="$(_('Cancel')}" /></h3>
-          </form>
-        </div>
-        <div class="item-actions">
-          <a href="#" data-tooltip="${_('Delete this section')}" class="delete-button delete-section-button"><span class="delete-icon"></span></a>
-          <span data-tooltip="${_('Drag to re-order')}" class="drag-handle"></span>
-        </div>
-      </header>
-    </section>

cms/templates/js/new-section-template.underscore

-    <section class="courseware-section new-section is-collapsible is-draggable">
-      <header>
-      <a href="#" data-tooltip="${_('Expand/collapse this section')}" class="action expand-collapse"><i class="icon-caret-down ui-toggle-dd"></i><span class="sr">${_('Expand/collapse this section')}</span></a>
-        <div class="item-details">
-          <h3 class="section-name">
-            <form class="section-name-form">
-              <input type="text" value="New Section Name" class="new-section-name" />
-              <input type="submit" class="new-section-name-save" data-parent="${parent_locator}"
-                     data-category="${new_section_category}" value="Save" />
-              <input type="button" class="new-section-name-cancel" value="Cancel" />
-            </form>
-          </h3>
-        </div>
-      </header>
-    </section>

cms/templates/js/new-subsection-template.underscore

-    <li class="collapsed">
-      <div class="section-item editing">
-        <form class="new-subsection-form">
-          <span class="subsection-name">
-            <input type="text" value="${_('New Subsection')}" class="new-subsection-name-input" />
-          </span>
-          <input type="submit" value="${_('Save')}" class="new-subsection-name-save" />
-          <input type="button" value="${_('Cancel')}" class="new-subsection-name-cancel" />
-        </form>
-      </div>
-      <ol>
-        <li>
-          <a href="unit.html" class="new-unit-item">
-            <i class="icon-plus"></i> ${_('New Unit')}
-          </a>
-        </li>
-      </ol>
-    </li>

cms/templates/js/no-outline-content.underscore

-<div class="no-outline-content">
-    <p><%= gettext("You haven't added any sections to your course outline.") %><a href="#" class="button new-button"><i class="icon-plus"></i><%= gettext("Add your first section") %></a></p>
-</div>

cms/templates/overview.html

@@ -164,7 +164,7 @@ require(["domReady!", "jquery", "js/models/location", "js/models/section", "js/v
                 <%include file="widgets/_ui-dnd-indicator-before.html" />
 
                 <header class="section">
-                  <a href="#" data-tooltip="${_('Expand/collapse this section')}" class="action expand-collapse"><i class="icon-caret-down ui-toggle-expansion"></i><span class="sr">${_('Expand/collapse this section')}</span></a>
+                  <a href="#" data-tooltip="${_('Expand/collapse this section')}" class="action expand-collapse collapse"><i class="icon-caret-down ui-toggle-expansion"></i><span class="sr">${_('Expand/collapse this section')}</span></a>
 
                   <div class="item-details" data-locator="${section_locator}">
                     <h3 class="section-name" data-name="${section.display_name_with_default | h}"></h3>
@@ -194,10 +194,10 @@ require(["domReady!", "jquery", "js/models/location", "js/models/section", "js/v
                         </div>
                       </li>
                       <li class="actions-item delete">
-                        <a href="#" data-tooltip="${_('Delete this section')}" class="action delete-section-button"><i class="icon-trash"></i> <span class="sr">Delete section</span></a>
+                        <a href="#" data-tooltip="${_('Delete this section')}" class="action delete-section-button"><i class="icon-trash"></i> <span class="sr">${_('Delete section')}</span></a>
                       </li>
                       <li class="actions-item drag">
-                        <span data-tooltip="${_('Drag to reorder')}" class="drag-handle section-drag-handle action"><i class="icon-ellipsis-vertical"></i><span class="sr"> ${_("Drag to reorder section")}</span></span>
+                        <span data-tooltip="${_('Drag to reorder')}" class="drag-handle section-drag-handle action"><span class="sr"> ${_("Drag to reorder section")}</span></span>
                       </li>
                     </ul>
                   </div>
@@ -211,14 +211,14 @@ require(["domReady!", "jquery", "js/models/location", "js/models/section", "js/v
                           context_course.location.course_id, subsection.location, False, True
                         )
                       %>
-                    <li class="courseware-subsection collapsed id-holder is-draggable"
+                    <li class="courseware-subsection collapsed id-holder is-draggable is-collapsible "
                         data-parent="${section_locator}" data-locator="${subsection_locator}">
 
                       <%include file="widgets/_ui-dnd-indicator-before.html" />
 
                       <div class="section-item">
                         <div class="details">
-                        <a href="#" data-tooltip="${_('Expand/collapse this subsection')}" class="action expand-collapse"><i class="icon-caret-down ui-toggle-expansion"></i><span class="sr">${_('Expand/collapse this subsection')}</span></a>
+                        <a href="#" data-tooltip="${_('Expand/collapse this subsection')}" class="action expand-collapse expand"><i class="icon-caret-down ui-toggle-expansion"></i><span class="sr">${_('Expand/collapse this subsection')}</span></a>
                           <a href="${subsection_locator.url_reverse('subsection')}">
                             <span class="subsection-name"><span class="subsection-name-value">${subsection.display_name_with_default}</span></span>
                           </a>
@@ -234,7 +234,7 @@ require(["domReady!", "jquery", "js/models/location", "js/models/section", "js/v
                               <a href="#" data-tooltip="${_('Delete this subsection')}" class="action delete-subsection-button"><i class="icon-trash"></i> <span class="sr">${_("Delete subsection")}</span></a>
                             </li>
                             <li class="actions-item drag">
-                              <span data-tooltip="${_('Drag to reorder')}" class="drag-handle subsection-drag-handle action"><i class="icon-ellipsis-vertical"></i></span>
+                              <span data-tooltip="${_('Drag to reorder')}" class="drag-handle subsection-drag-handle action"></span>
                             </li>
                           </ul>
                         </div>
@@ -283,12 +283,10 @@ require(["domReady!", "jquery", "js/models/location", "js/models/section", "js/v
       aria-hidden=""
       role="dialog">
       <div class="dialog confirm">
-
-        <form class="edit-sectionrelease-dialog" method="POST" action="#" enctype="multipart/form-data">
+        <form class="edit-sectionrelease-dialog" action="#">
           <div class="form-content">
           <h2 class="title dialog-edit-sectionrelease-title">${_("Section Release Date")}</h2>
           <p id="dialog-edit-sectionrelease-description" class="message">${_('On the date set below, this section - {name} - will be released to students. Any units marked private will only be visible to admins.').format(name='<strong class="section-name"></strong>')}</p>
-
             <ul class="list-input picker datepair">
               <li class="field field-start-date">
                 <label for="start_date">${_("Release Day")}</label>
@@ -299,9 +297,7 @@ require(["domReady!", "jquery", "js/models/location", "js/models/section", "js/v
                 <input class="start-time time" type="text" name="start_time" value="" placeholder="HH:MM" class="time" size='10' autocomplete="off"/>
               </li>
             </ul>
-
           </div>
-
           <div class="actions">
             <h3 class="sr">${_("Form Actions")}</h3>
           <ul>

cms/templates/widgets/units.html

@@ -41,7 +41,7 @@ This def will enumerate through a passed in subsection and list all of the units
             <a href="#" data-tooltip="Delete this unit" class="delete-unit-button action" data-locator="${unit_locator}"><i class="icon-trash"></i><span class="sr">Delete unit</span></a>
           </li>
           <li class="actions-item drag">
-            <span data-tooltip="Drag to sort" class="drag-handle unit-drag-handle action"><i class="icon-ellipsis-vertical"></i></span>
+            <span data-tooltip="Drag to sort" class="drag-handle unit-drag-handle action"></span>
           </li>
         </ul>
       </div>