Port user menu to Vue

Signed-off-by: Christopher Ng <chrng8@gmail.com>

1 files changed, 11 insertions, 34 deletions

diff --git a/core/src/components/UserMenu.js b/core/src/components/UserMenu.js
index f82a303d1fd..e165e784422 100644
--- a/core/src/components/UserMenu.js
+++ b/core/src/components/UserMenu.js
@@ -2,6 +2,7 @@
  * @copyright 2019 Christoph Wurst <christoph@winzerhof-wurst.at>
  *
  * @author Christoph Wurst <christoph@winzerhof-wurst.at>
+ * @author Christopher Ng <chrng8@gmail.com>
  *
  * @license AGPL-3.0-or-later
  *
@@ -20,41 +21,17 @@
  *
  */
 
-import OC from '../OC'
+import Vue from 'vue'
 
-import $ from 'jquery'
+import UserMenu from '../views/UserMenu.vue'
 
 export const setUp = () => {
-	const $menu = $('#header #settings')
-	// Using page terminoogy as below
-	const $excludedPageClasses = [
-		'user-status-menu-item__header',
-	]
-
-	// show loading feedback
-	$menu.delegate('a', 'click', event => {
-		let $page = $(event.target)
-		if (!$page.is('a')) {
-			$page = $page.closest('a')
-		}
-		if (event.which === 1 && !event.ctrlKey && !event.metaKey) {
-			if (!$excludedPageClasses.includes($page.attr('class'))) {
-				$page.find('img').remove()
-				$page.find('div').remove() // prevent odd double-clicks
-				$page.prepend($('<div></div>').addClass('icon-loading-small'))
-			}
-		} else {
-			// Close navigation when opening menu entry in
-			// a new tab
-			OC.hideMenus(() => false)
-		}
-	})
-
-	$menu.delegate('a', 'mouseup', event => {
-		if (event.which === 2) {
-			// Close navigation when opening app in
-			// a new tab via middle click
-			OC.hideMenus(() => false)
-		}
-	})
+	const mountPoint = document.getElementById('user-menu')
+	if (mountPoint) {
+		// eslint-disable-next-line no-new
+		new Vue({
+			el: mountPoint,
+			render: h => h(UserMenu),
+		})
+	}
 }