From 7342afc6b8e8a659ebfa07973a252e9a38157a15 Mon Sep 17 00:00:00 2001
From: Nate Wright <natew@notthisway.com>
Date: Mon, 22 Jul 2019 15:48:50 +0100
Subject: [PATCH] pkp/pkp-lib#4684 Toggle nav menu dropdowns on small/large
 screens

---
 plugins/themes/default/js/main.js | 46 +++++++++++++++++++++----------
 1 file changed, 31 insertions(+), 15 deletions(-)

diff --git a/plugins/themes/default/js/main.js b/plugins/themes/default/js/main.js
index 0ef69ac0b71..b29e217d2ab 100644
--- a/plugins/themes/default/js/main.js
+++ b/plugins/themes/default/js/main.js
@@ -9,26 +9,42 @@
  */
 (function($) {
 
-	// Initialize dropdown navigation menus
+	// Initialize dropdown navigation menus on large screens
 	// See bootstrap dropdowns: https://getbootstrap.com/docs/4.0/components/dropdowns/
 	if (typeof $.fn.dropdown !== 'undefined') {
 		var $nav = $('#navigationPrimary, #navigationUser'),
 		$submenus = $('ul', $nav);
+		window.onresize = function() {
+			if (window.innerWidth > 992) {
+				$submenus.each(function(i) {
+					var id = 'pkpDropdown' + i;
+					$(this)
+						.addClass('dropdown-menu')
+						.attr('aria-labelledby', id);
+					$(this).siblings('a')
+						.attr('data-toggle', 'dropdown')
+						.attr('aria-haspopup', true)
+						.attr('aria-expanded', false)
+						.attr('id', id)
+						.attr('href', '#');
+				});
+				$('[data-toggle="dropdown"]').dropdown();
 
-		$submenus.each(function(i) {
-			var id = 'pkpDropdown' + i;
-			$(this)
-				.addClass('dropdown-menu')
-				.attr('aria-labelledby', id);
-			$(this).siblings('a')
-				.attr('data-toggle', 'dropdown')
-				.attr('aria-haspopup', true)
-				.attr('aria-expanded', false)
-				.attr('id', id)
-				.attr('href', '#');
-		});
-
-		$('[data-toggle="dropdown"]').dropdown();
+			} else {
+				$('[data-toggle="dropdown"]').dropdown('dispose');
+				$submenus.each(function(i) {
+					$(this)
+						.removeClass('dropdown-menu')
+						.removeAttr('aria-labelledby');
+					$(this).siblings('a')
+						.removeAttr('data-toggle')
+						.removeAttr('aria-haspopup')
+						.removeAttr('aria-expanded',)
+						.removeAttr('id')
+						.attr('href', '#');
+				});
+			}
+		}
 	}
 
 	// Toggle nav menu on small screens