From 87d8a54b91bfe0ddbcb9acd476b2d5bf3fbabe32 Mon Sep 17 00:00:00 2001
From: Gittenburg <gittenburg@fsinf.at>
Date: Tue, 28 Jul 2020 22:48:50 +0200
Subject: [PATCH] help: Stop collapsing sidebar sections.

Three reasons:

1. The sliding was disorienting.
2. The collapsing disallowed searching for other pages with Ctrl+F.
3. The collapsing mechanism wasn't accessible (not usable with the
   keyboard / no ARIA tags).

Tweaked by tabbott to center the left sidebar on the selected page.

Part of #15948.
---
 static/js/portico/help.js                | 13 ++-----------
 templates/zerver/documentation_main.html |  2 +-
 zerver/views/documentation.py            |  4 ----
 3 files changed, 3 insertions(+), 16 deletions(-)

diff --git a/static/js/portico/help.js b/static/js/portico/help.js
index bbbaa76165..bbe7cefbc7 100644
--- a/static/js/portico/help.js
+++ b/static/js/portico/help.js
@@ -100,17 +100,6 @@ const update_page = function (html_map, path) {
 
 new SimpleBar($(".sidebar")[0]);
 
-$(".sidebar.slide h2").on("click", (e) => {
-    const $next = $(e.target).next();
-
-    if ($next.is("ul")) {
-        // Close other article's headings first
-        $(".sidebar ul").not($next).hide();
-        // Toggle the heading
-        $next.slideToggle("fast", "swing");
-    }
-});
-
 $(".sidebar a").on("click", function (e) {
     const path = $(this).attr("href");
     const path_dir = path.split("/")[1];
@@ -173,3 +162,5 @@ window.addEventListener("popstate", () => {
 });
 
 $("body").addClass("noscroll");
+
+$(".highlighted")[0].scrollIntoView({block: "center"});
diff --git a/templates/zerver/documentation_main.html b/templates/zerver/documentation_main.html
index fcf1f2e056..3efab133da 100644
--- a/templates/zerver/documentation_main.html
+++ b/templates/zerver/documentation_main.html
@@ -5,7 +5,7 @@
 
 {% block portico_content %}
 <div class="app help terms-page inline-block{% if page_is_help_center %} help-center{% endif %}{% if page_is_api_center %} api-center{% endif %}">
-    <div class="{{ sidebar_class }}">
+    <div class="sidebar">
         <div class="content">
             <h1><a href="{{ doc_root }}" class="no-underline">Home</a></h1>
             {{ render_markdown_path(sidebar_index, api_uri_context) }}
diff --git a/zerver/views/documentation.py b/zerver/views/documentation.py
index e93f04ce81..b2cdba721f 100644
--- a/zerver/views/documentation.py
+++ b/zerver/views/documentation.py
@@ -91,14 +91,11 @@ class MarkdownDirectoryView(ApiURLView):
             context["page_is_help_center"] = True
             context["doc_root"] = "/help/"
             (sidebar_index, http_status_ignored) = self.get_path("include/sidebar_index")
-            # We want the sliding/collapsing behavior for /help pages only
-            sidebar_class = "sidebar slide"
             title_base = "Zulip Help Center"
         else:
             context["page_is_api_center"] = True
             context["doc_root"] = "/api/"
             (sidebar_index, http_status_ignored) = self.get_path("sidebar_index")
-            sidebar_class = "sidebar"
             title_base = "Zulip API Documentation"
 
         # The following is a somewhat hacky approach to extract titles from articles.
@@ -118,7 +115,6 @@ class MarkdownDirectoryView(ApiURLView):
             context["OPEN_GRAPH_DESCRIPTION"] = self.request.placeholder_open_graph_description
 
         context["sidebar_index"] = sidebar_index
-        context["sidebar_class"] = sidebar_class
         # An "article" might require the api_uri_context to be rendered
         api_uri_context: Dict[str, Any] = {}
         add_api_uri_context(api_uri_context, self.request)