[TikiWiki-commits] [Git][tikiwiki/tiki][master] [FIX] AutoTOC nested levels and CSS issues

Jean-Marc Kadimba pushed to branch master at Tiki Wiki CMS Groupware / Tiki


Commits:
9c511b3b by Yves Ngalamulume at 2025-12-18T16:31:01+02:00
[FIX] AutoTOC nested levels and CSS issues
---
* Enhance AutoTOC click handling: add active class management and smooth scrolling

* Use Bootstrap theme colors in AutoTOC CSS

* Fix AutoTOC nested levels and CSS issues

* [FIX] AutoTOC nested levels and CSS issues

See merge request tikiwiki/tiki!9243

- - - - -


2 changed files:

- lib/jquery_tiki/autoToc.js
- lib/wiki-plugins/wikiplugin_autotoc.php


Changes:

=====================================
lib/jquery_tiki/autoToc.js
=====================================
@@ -327,16 +327,25 @@ function countHeadings(children) {
 
 $(function () {
     $.genAutoToc();
-    $('#autotoc a[href^="#"]').on('click', function (e) {
+    $('#autotoc').on('click', 'a[href^="#"]', function (e) {
         e.preventDefault();
+        $('#autotoc a').removeClass('active');
+        $(this).addClass('active');
+        $('#autotoc li').removeClass('open');
+        $(this).parents('li').addClass('open');
+
         var target = this.hash;
         var $target = $(target);
-        if (typeof parentNode !== 'undefined') {
-            var parent = document.querySelector(target).parentNode;
-            $('.tabs a[href="#'+parent.id+'"]').tab('show');
+
+        if ($target.length) {
+            if (typeof parentNode !== 'undefined') {
+                var parent = document.querySelector(target).parentNode;
+                $('.tabs a[href="#' + parent.id + '"]').tab('show');
+            }
+
+            $('html, body').stop().animate({
+                scrollTop: $target.offset().top
+            }, 900);
         }
-        $('html, body').stop().animate({
-            'scrollTop': $target.offset().top
-        }, 900, 'swing', function () {});
     });
 });


=====================================
lib/wiki-plugins/wikiplugin_autotoc.php
=====================================
@@ -133,8 +133,19 @@ function wikiplugin_autotoc($data, $params)
             $jqueryAutoToc['plugin_autoToc_tabset_names'] = $params['tabset_names'] ?? '';
             $jqueryAutoToc['plugin_autoToc_tabset_panes'] = $params['tabset_panes'] ?? '';
             $jqueryAutoToc['plugin_autoToc_levels'] = $params['levels'] ?? '';
-            $jq_autotoc = json_encode($jqueryAutoToc, JSON_UNESCAPED_SLASHES);
-            $headerlib->add_js('var jqueryAutoToc = ' . $jq_autotoc . '"\n";');
+
+            if (! empty($params['levels'])) {
+                $autoTocLevels = $params['levels'];
+            } else {
+                $autoTocLevels = null;
+            }
+            $jqueryAutoToc['plugin_autoToc_levels'] = $autoTocLevels;
+
+            $js = '
+            var jqueryAutoToc = ' . json_encode($jqueryAutoToc, JSON_UNESCAPED_SLASHES) . "\n";
+
+            $headerlib->add_js($js);
+
             if ($prefs['wiki_auto_toc'] !== 'y' || $prefs['wiki_toc_default'] !== 'on') {
                 $headerlib->add_jsfile('lib/jquery_tiki/autoToc.js');
             }
@@ -157,7 +168,7 @@ function wikiplugin_autotoc($data, $params)
                         text-decoration: none;
                         background-color: transparent;
                         border-left-width: 1px;
-                        border-left-style: solid; // #0075ff;
+                        border-left-style: solid;
                     }');
 
                 return "<div id='autotoc'></div>";
@@ -180,7 +191,7 @@ function wikiplugin_autotoc($data, $params)
                         text-decoration: none;
                         background-color: transparent;
                         border-left-style: solid;
-                        bordr-left-width: 1px; // #0075ff;
+                        border-left-width: 1px;
                     }
 
                     #autotoc .nav-link.active,
@@ -190,11 +201,11 @@ function wikiplugin_autotoc($data, $params)
                         font-weight: bold;
                         background-color: transparent;
                         border-left-style: solid;
-                        border-left-width: 2px;// solid #0075ff;
+                        border-left-width: 2px;
+                        border-left-color: var(--bs-primary);
                     }
 
                     #autotoc .nav-link + ul {
-                        display: none;
                         padding-bottom: 10px;
                     }
 



View it on GitLab: https://gitlab.com/tikiwiki/tiki/-/commit/9c511b3bb7272a5c3b65deb003ac23051c7211a5

-- 
View it on GitLab: https://gitlab.com/tikiwiki/tiki/-/commit/9c511b3bb7272a5c3b65deb003ac23051c7211a5
You're receiving this email because of your account on gitlab.com.

_______________________________________________
TikiWiki-cvs mailing list
[email protected]
https://lists.sourceforge.net/lists/listinfo/tikiwiki-cvs