Add a down arrow next to user name to show dropdown options and ensur…

…e it works on all pages (fossasia#426) * Fix toggle dropdown for pretixcontrol and pretixpresale * Update code
lcduong · Nov 18, 2024 · afb64c9 · afb64c9
1 parent 27cc074
commit afb64c9
Show file tree

Hide file tree

Showing 5 changed files with 17 additions and 7 deletions.
diff --git a/src/pretix/control/templates/pretixcontrol/base.html b/src/pretix/control/templates/pretixcontrol/base.html
@@ -61,6 +61,7 @@
             <script type="text/javascript" src="{% static "lightbox/js/lightbox.min.js" %}"></script>
             <script type="text/javascript" src="{% static "are-you-sure/jquery.are-you-sure.js" %}"></script>
             <script type="text/javascript" src="{% static "pretixcontrol/js/ui/popover.js" %}"></script>
+            <script type="text/javascript" src="{% static "utils/js/utils.js" %}"></script>
 		{% endcompress %}
         {{ html_head|safe }}
 

diff --git a/src/pretix/presale/templates/pretixpresale/base.html b/src/pretix/presale/templates/pretixpresale/base.html
@@ -46,6 +46,7 @@
     <meta name="theme-color" content="{{ settings.primary_color|default:"#2185d0" }}">
     {% compress js %}
         <script type="text/javascript" src="{% static "pretixpresale/js/ui/popover.js" %}"></script>
+        <script type="text/javascript" src="{% static "utils/js/utils.js" %}"></script>
     {% endcompress %}
 </head>
 <body class="nojs" data-locale="{{ request.LANGUAGE_CODE }}" data-now="{% now "U.u" %}" data-datetimeformat="{{ js_datetime_format }}" data-timeformat="{{ js_time_format }}" data-dateformat="{{ js_date_format }}" data-datetimelocale="{{ js_locale }}" data-currency="{{ request.event.currency }}">

diff --git a/src/pretix/static/pretixcontrol/js/ui/popover.js b/src/pretix/static/pretixcontrol/js/ui/popover.js
@@ -35,11 +35,9 @@ $(function () {
         trigger: 'manual'
 
     }
-    $('[data-toggle="popover-profile"]').popover(options).click(function(evt) {
+    $('[data-toggle="popover-profile"]').popover(options).click(function (evt) {
         evt.stopPropagation();
-        $(this).popover('show');
-        $('[data-toggle="popover"]').popover('hide');
-
+        togglePopover(this);
     })
 })
 

diff --git a/src/pretix/static/pretixpresale/js/ui/popover.js b/src/pretix/static/pretixpresale/js/ui/popover.js
@@ -72,10 +72,9 @@ $(function () {
         trigger: 'manual'
 
     }
-    $('[data-toggle="popover-profile"]').popover(options).click(function(evt) {
+    $('[data-toggle="popover-profile"]').popover(options).click(function (evt) {
         evt.stopPropagation();
-        $(this).popover('show');
-        $('[data-toggle="popover"]').popover('hide');
+        togglePopover(this);
 
         // Ensure Organizer Area is hidden initially
         $('.organizer-area').hide();

diff --git a/src/pretix/static/utils/js/utils.js b/src/pretix/static/utils/js/utils.js
@@ -0,0 +1,11 @@
+function togglePopover(element) {
+    const popover = $(element).data('bs.popover');
+    const isVisible = popover.tip().hasClass('in');
+    $('[data-toggle="popover"]').popover('hide');
+
+    if (isVisible) {
+        $(element).popover('hide');
+    } else {
+        $(element).popover('show');
+    }
+}