From b5086cbd40305ee873f6d8912646bbd5ffee6dea Mon Sep 17 00:00:00 2001
From: SBD <strigevitch.boris@gmail.com>
Date: Fri, 12 Jul 2024 17:41:43 +0300
Subject: [PATCH] documentation page

---
 static/aerbimCSS.css                 | 13 +++++-
 static/aerbimCSSMOBILE.css           |  6 +++
 static/aerbimJS.js                   | 21 +++++++++-
 templates/pages/p_documentation.html | 60 +++++++++++++++++-----------
 4 files changed, 73 insertions(+), 27 deletions(-)

diff --git a/static/aerbimCSS.css b/static/aerbimCSS.css
index 288a039..7c5c96d 100644
--- a/static/aerbimCSS.css
+++ b/static/aerbimCSS.css
@@ -1655,6 +1655,7 @@ body.n_scroll{
 .way_bread_crumb{
     font-size: 14px;
     color: #7A8185FF;
+    cursor: pointer;
 }
 
 .way_bread_crumb.last{
@@ -1691,7 +1692,7 @@ body.n_scroll{
 }
 
 .documentation_version_switcher{
-    width: 60px;
+    width: 70px;
     border: 1px solid #CCCED1FF;
     border-radius: 2px;
     margin-left: 16px;
@@ -1882,6 +1883,16 @@ body.n_scroll{
 .content_part_tree_els{
     width: calc(100% - 453px);
     margin-left: 80px;
+    font-size: 16px;
+}
+
+.content_part_tree_els img{
+    max-width: 100%;
+    object-fit: contain;
+}
+
+.content_part_tree_els h1{
+    font-size: 40px;
 }
 
 .name_article_tree{
diff --git a/static/aerbimCSSMOBILE.css b/static/aerbimCSSMOBILE.css
index bc8cc8d..75e5100 100644
--- a/static/aerbimCSSMOBILE.css
+++ b/static/aerbimCSSMOBILE.css
@@ -347,6 +347,9 @@
 }
 
 @media (max-width: 800px) {
+    .content_part_tree_els h1{
+        font-size: 36px;
+    }
     .name_article_tree{
         font-size: 36px;
     }
@@ -639,6 +642,9 @@
 }
 
 @media (max-width: 380px) {
+    .content_part_tree_els h1{
+        font-size: 26px;
+    }
     .descript_process_container{
         margin-bottom: 15px;
     }
diff --git a/static/aerbimJS.js b/static/aerbimJS.js
index cc05a64..0784d4a 100644
--- a/static/aerbimJS.js
+++ b/static/aerbimJS.js
@@ -531,7 +531,12 @@ function closeVersionSwitcherOnBody () {
         let $arrow = document.querySelector(".documentation_switcher_arrow_picture")
         $version_switcher_container_content.addClass("hidden")
         $(".documentation_version_switcher").css({borderBottom: '1px solid #CCCED1FF'})
-        $($arrow).animate({rotate: '180deg'},200)
+        if ($arrow.style.rotate !== '180deg'){
+            $($arrow).animate({rotate: '180deg'},200)
+        } else {
+            $($arrow).animate({rotate: '0deg'},200)
+        }
+
     }
 }
 
@@ -609,7 +614,19 @@ function chooseVersionComplete (el) {
     let url = el.dataset['url']
     let title = el.dataset['title']
     let $parent = el.closest(".documentation_version")
-    let $cur_selected = $parent.querySelector(".documentation_version_txt")
+    let $cur_selected = $parent.querySelector(".cur_documentation_version")
+    let $cont = el.closest(".documentation_switcher_content_part")
+    let $cont_parent = $cont.closest(".documentation_version_switcher")
+    $cont_parent.style.borderBottom = '1px solid #CCCED1FF'
+    $cont.classList.add("hidden")
     $cur_selected.innerHTML = title
     window.location.href = window.location.origin + url
+}
+
+function breadCrumbGo (el){
+    if (el.dataset){
+        let url = el.dataset['url']
+        window.location.href = window.location.origin + url
+    }
+
 }
\ No newline at end of file
diff --git a/templates/pages/p_documentation.html b/templates/pages/p_documentation.html
index 4984373..8d0db5c 100644
--- a/templates/pages/p_documentation.html
+++ b/templates/pages/p_documentation.html
@@ -7,23 +7,35 @@
     <div class="breadcrumbs_documentation_block">
         <div class="cut-width">
             <div class="breadcrumbs_documentation">
-                <div class="way_bread_crumb">
-                    Документация и техническая поддержка
-                </div>
-                <picture class="breadcrumb_arrow_picture">
-                    <source srcset="{% static "images/breadcrumb_arrow.svg" %}">
-                    <img class="breadcrumb_arrow_img" src="{% static "images/breadcrumb_arrow.svg" %}" alt="">
-                </picture>
-                <div class="way_bread_crumb">
-                    Документация для версии 1
-                </div>
-                <picture class="breadcrumb_arrow_picture">
-                    <source srcset="{% static "images/breadcrumb_arrow.svg" %}">
-                    <img class="breadcrumb_arrow_img" src="{% static "images/breadcrumb_arrow.svg" %}" alt="">
-                </picture>
-                <div class="way_bread_crumb last">
-                    Документация для версии 1
-                </div>
+{#                <div class="way_bread_crumb">#}
+{#                    Документация и техническая поддержка#}
+{#                </div>#}
+{#                <picture class="breadcrumb_arrow_picture">#}
+{#                    <source srcset="{% static "images/breadcrumb_arrow.svg" %}">#}
+{#                    <img class="breadcrumb_arrow_img" src="{% static "images/breadcrumb_arrow.svg" %}" alt="">#}
+{#                </picture>#}
+{#                <div class="way_bread_crumb">#}
+{#                    Документация для версии 1#}
+{#                </div>#}
+{#                <picture class="breadcrumb_arrow_picture">#}
+{#                    <source srcset="{% static "images/breadcrumb_arrow.svg" %}">#}
+{#                    <img class="breadcrumb_arrow_img" src="{% static "images/breadcrumb_arrow.svg" %}" alt="">#}
+{#                </picture>#}
+{#                <div class="way_bread_crumb last">#}
+{#                    Документация для версии 1#}
+{#                </div>#}
+                {% for name,url in breadcrumbs.items %}
+                    <div class="way_bread_crumb{% if forloop.last %} last{% endif %}" {% if not forloop.last %}data-url="{{ url }}"{% endif %} onclick="breadCrumbGo(this)">
+                        {{ name }}
+                    </div>
+                    {% if not forloop.last %}
+                    	<picture class="breadcrumb_arrow_picture">
+                            <source srcset="{% static "images/breadcrumb_arrow.svg" %}">
+                            <img class="breadcrumb_arrow_img" src="{% static "images/breadcrumb_arrow.svg" %}" alt="">
+                        </picture>
+                    {% endif %}
+                {% endfor %}
+
             </div>
         </div>
     </div>
@@ -37,7 +49,7 @@
                     <div class="documentation_version_switcher">
                         <div class="first_line_documentation_version_switcher" onclick="openVersionSwitcher(this)">
                             <div class="cur_documentation_version">
-                                1
+                                {{ cur_version.name }}
                             </div>
                             <picture class="documentation_switcher_arrow_picture">
                                 <source srcset="{% static "images/arrow_for_documentation_switcher.svg" %}">
@@ -46,11 +58,11 @@
                         </div>
                         <div class="documentation_switcher_content_part hidden">
                             {% for item in allow_versions %}
-                            
+
                                 <div class="one_item_documentation_switcher_content_part" data-url="{% url 'docs_version_page' item.url %}" data-title="{{ item.name }}" onclick="chooseVersionComplete(this)">
                                     {{ item.name }}
                                 </div>
-                                
+
                             {% endfor %}
                         </div>
                     </div>
@@ -72,7 +84,7 @@
                             {% if obj.children %}
                                 <div class="content_part_tree_documentation_container {% if not obj.active %}hidden{% endif %}">
                                     {% for name, obj in obj.children.items %}
-                                        
+
                                         <div class="tree_documentation_container_second_level">
                                             <div class="tree_documentation_container_first_line">
                                                 {% if obj.children %}
@@ -80,7 +92,7 @@
                                                         <source srcset="{% static "images/arrow_for_documentation_switcher.svg" %}">
                                                         <img class="tree_documentation_arrow_img" src="{% static "images/arrow_for_documentation_switcher.svg" %}" alt="">
                                                     </picture>
-                                                {% endif %} 
+                                                {% endif %}
                                                 <div class="tree_documentation_container_second_level_txt {% if not obj.children %}margin {% endif %}{% if cur_article.url == obj.url %}chose{% endif %}" data-url="{% url 'docs_art_page' cur_version.url obj.url %}" onclick="choseItemTreeDocumentation(this)">
                                                     {{ name }}
                                                 </div>
@@ -104,9 +116,9 @@
                                                         </div>
                                                     </div>
                                                 {% endfor %}
-                                            {% endif %} 
+                                            {% endif %}
                                         </div>
-                                        
+
                                     {% endfor %}
                                 </div>
                             {% endif %}