Add a remove button to each LO concentration tab. @0h15

application/modules/learningoutcomes/views/scripts/edit/index.phtml

 <?php
 $this->layout()->pageTitle = $this->request->getTypeDescription() . ': ' . $this->learningOutcome->getMajor();
+$this->headLink()->appendStylesheet($this->baseUrl() . '/css/learningoutcomes/edit.css', 'all');
 $this->headScript()->appendFile($this->baseUrl('/javascript/learningoutcomes/edit.js'));
 $stubConcentrations = array('stub' => '+');
 $outcomes = array(
@@ -22,7 +23,12 @@ $outcomes = array(
 
     <ul class="wdn_tabs">
         <?php foreach ($this->learningOutcome->getConcentrations() + $stubConcentrations as $concentrationId => $concentration) { ?>
-            <li><a href="#concentration-<?php echo $concentrationId; ?>"><?php echo $this->escape($concentration); ?></a></li>
+            <li>
+                <a href="#concentration-<?php echo $concentrationId; ?>">
+                    <span class="name"><?php echo $this->escape($concentration); ?></span>
+                    <span class="minibutton remove">x</span>
+                </a>
+            </li>
         <?php } ?>
     </ul>
     <div class="wdn_tabs_content">

document_root/css/learningoutcomes/edit.css

+a[href="#concentration-stub"] span.minibutton {display: none;}
+.minibutton.remove {
+    margin-right: -0.4em;
+    padding: 0 0.4em;
+    border: 1px solid transparent;
+    border-radius: 1em;
+    color: #888;
+}
+.minibutton.remove:hover {
+    border-color: #c44;
+    background-color: #fcc;
+    color: #c44;
+}
\ No newline at end of file

document_root/javascript/learningoutcomes/edit.js

@@ -3,6 +3,7 @@ WDN.jQuery(function() {
 
     var newTabIndex = 0;
 
+    WDN.tabs.useHashChange = false;
     WDN.jQuery('ul.wdn_tabs').on('tabchanged', function() {
         var selectedTab = WDN.jQuery(this).find('.selected');
         if (selectedTab.find('a').attr('href') != '#concentration-stub') {
@@ -15,7 +16,7 @@ WDN.jQuery(function() {
         selectedTab.before(newTab);
 
         newTab.find('a').attr('href', '#concentration-new' + newTabIndex);
-        newTab.find('a').text('New Concentration');
+        newTab.find('a span.name').text('New Concentration');
 
         var stubContent = WDN.jQuery('#concentration-stub');
         var newContent = stubContent.clone();
@@ -38,9 +39,17 @@ WDN.jQuery(function() {
             newTab.find('a').trigger('click');
         }, 50);
     });
+    WDN.jQuery('ul.wdn_tabs').on('click', '.minibutton.remove', function() {
+        var tab = WDN.jQuery(this).parent().parent();
+        var content = WDN.jQuery(tab.find('a').attr('href'));
+
+        tab.remove();
+        content.remove();
+        return false;
+    });
 
     WDN.jQuery('.wdn_tabs_content').on('keyup', '.concentration-name', function() {
-        WDN.jQuery('.wdn_tabs .selected a').text(this.value);
+        WDN.jQuery('.wdn_tabs .selected a span.name').text(this.value);
     })