Bug 1765276: Fixed nav tabs in file browser and artefact chooser

behatnotneeded

Change-Id: Ie13f3c3a5503db4bb4ae6b9e4131c8bbf06c4e03

htdocs/lib/form/elements/artefactchooser.php

@@ -159,10 +159,10 @@ jQuery(function($) {
               // Hide the search form
               $(a).on('click', function(e) {
                   $('#artefactchooser-searchform').addClass('d-none');
-                  $(searchA.parentNode).removeClass('active');
+                  $(searchA).removeClass('active');
                   $(browseA).find('.sr-only').html('(' + get_string_ajax('tab', 'mahara') + ' ' + get_string_ajax('selected', 'mahara') + ')');
                   $(searchA).find('.sr-only').html('(' + get_string_ajax('tab', 'mahara') + ')');
-                  $(browseA.parentNode).addClass('active');
+                  $(browseA).addClass('active');
                   $(browseA).trigger("blur");
                   $('#artefactchooser-searchfield').val(''); // forget the search for now, easier than making the tabs remember it
                   if (!browseTabCurrent) {
@@ -179,10 +179,10 @@ jQuery(function($) {
               $(a).on('click', function(e) {
                   $('#artefactchooser-searchform').show();
                   $('#artefactchooser-searchform').removeClass('d-none');
-                  $(browseA.parentNode).removeClass('active');
+                  $(browseA).removeClass('active');
                   $(searchA).find('.sr-only').html('(' + get_string_ajax('tab', 'mahara') + ' ' + get_string_ajax('selected', 'mahara') + ')');
                   $(browseA).find('.sr-only').html('(' + get_string_ajax('tab', 'mahara') + ')');
-                  $(searchA.parentNode).addClass('active');
+                  $(searchA.).addClass('active');
 
                   $('#artefactchooser-searchfield').on('keypress', function(e) {
                       if (e.keycode == 13) { // enter pressed - submitting form

htdocs/theme/raw/plugintype/artefact/file/templates/form/ownertabs.tpl

  <ul class="artefactchooser-tabs files nav nav-tabs" role="tablist">
     {foreach from=$tabs.tabs item=displayname key=name}
-    <li{if $tabs.owner == $name} class="active"{/if}>
-        <a class="changeowner" href="{$querybase|safe}owner={$name}" role="tab">
+    <li>
+        <a class="changeowner {if $tabs.owner == $name} active{/if}" href="{$querybase|safe}owner={$name}" role="tab">
             {$displayname}
             <span class="accessible-hidden sr-only">
                 ({str tag=tab}

htdocs/theme/raw/templates/form/artefactchooser.tpl

 {if $searchable}
 <ul class="artefactchooser-tabs nav nav-tabs">
-    <li{if !$.request.s} class="current active"{/if}><a href="{$browseurl}">{str tag=Browse section=view}</a></li>
-    <li{if $.request.s} class="current active"{/if}><a href="{$searchurl}">{str tag=Search section=view}</a></li>
+    <li><a {if !$.request.s} class="current active"{/if} href="{$browseurl}">{str tag=Browse section=view}</a></li>
+    <li><a {if $.request.s} class="current active"{/if} href="{$searchurl}">{str tag=Search section=view}</a></li>
 </ul>
 {/if}
 <div id="artefactchooser-body">

htdocs/theme/raw/templates/styleguide.tpl

@@ -2138,7 +2138,7 @@ Used as icon for a system notification.
       $j.each(categories, function(i, category) {
           var readableName = category.replace("-", " ");
           if (i === 0) {
-              $j('#category-tabs').append('<li class="active"><a href="#" data-category="' + category + '">' + readableName + '</a></li>');
+              $j('#category-tabs').append('<li><a class="active" href="#" data-category="' + category + '">' + readableName + '</a></li>');
           } else {
               $j('#category-tabs').append('<li><a href="#" data-category="' + category + '">' + readableName + '</a></li>');
           }
@@ -2149,7 +2149,7 @@ Used as icon for a system notification.
           var category = $j(this).data('category');
           event.preventDefault();
           $j(this).parent().siblings().children().removeClass('active');
-          $j(this).addClass('active');
+          $j(this).first().addClass('active');
 
           $j('[data-markdown]').each(function(){
               if ($j(this).data('category') !== category) {