Update MayanApp to support multiple menus

Signed-off-by: Roberto Rosario <roberto.rosario.gonzalez@gmail.com>

mayan/apps/appearance/static/appearance/js/mayan_app.js

@@ -1,50 +1,22 @@
 'use strict';
 
 class MayanApp {
-    constructor (parameters) {
+    constructor (options) {
         var self = this;
 
-        parameters = parameters || {}
+        options = options || {
+            ajaxMenusOptions: []
+        }
 
-        this.ajaxSpinnerSeletor = '#ajax-spinner';
         this.ajaxExecuting = false;
-        this.ajaxMenusOptions = [
-            {
-                app: this,
-                interval: 5000,
-                menuSelector: '#main-menu',
-                url: apiTemplateMainMenuURL,
-            }
-        ];
+        this.ajaxMenusOptions = options.ajaxMenusOptions;
         this.ajaxMenuHashes = {};
+        this.ajaxSpinnerSeletor = '#ajax-spinner';
         this.window = $(window);
     }
 
     // Class methods and variables
 
-    static mayanNotificationBadge (options, data) {
-        // Callback to add the notifications count inside a badge markup
-        var notifications = data[options.attributeName];
-
-        if (notifications > 0) {
-            // Save the original link text before adding the initial badge markup
-            if (!options.element.data('mn-saved-text')) {
-                options.element.data('mn-saved-text', options.element.html());
-            }
-
-            options.element.html(
-                options.element.data('mn-saved-text') + ' <span class="badge">' + notifications + '</span>'
-            );
-        } else {
-            if (options.element.data('mn-saved-text')) {
-                // If there is a saved original link text, restore it
-                options.element.html(
-                    options.element.data('mn-saved-text')
-                );
-            }
-        }
-    }
-
     static MultiObjectFormProcess ($form, options) {
         /*
          * ajaxForm callback to add the external item checkboxes to the
@@ -69,6 +41,17 @@ class MayanApp {
         }
     }
 
+    static updateNavbarState () {
+        var uri = new URI(window.location.hash);
+        var uriFragment = uri.fragment();
+        $('.a-main-menu-accordion-link').each(function (index, value) {
+            if (value.pathname === uriFragment) {
+                $(this).closest('.collapse').addClass('in').parent().find('.collapsed').removeClass('collapsed').attr('aria-expanded', 'true');
+                $(this).parent().addClass('active');
+            }
+        });
+    }
+
     static tagSelectionTemplate (tag, container) {
         var $tag = $(
             '<span class="label label-tag" style="background: ' + tag.element.dataset.color + ';"> ' + tag.text + '</span>'
@@ -87,35 +70,6 @@ class MayanApp {
 
     // Instance methods
 
-    AJAXperiodicWorker (options) {
-        var app = this;
-
-        $.ajax({
-            complete: function() {
-                if (!options.app) {
-                    // Preserve the app reference between consecutive calls
-                    options.app = app;
-                }
-                setTimeout(options.app.AJAXperiodicWorker, options.interval, options);
-            },
-            success: function(data) {
-                if (options.callback) {
-                    // Conver the callback string to an actual function
-                    var callbackFunction = window;
-
-                    $.each(options.callback.split('.'), function (index, value) {
-                        callbackFunction = callbackFunction[value]
-                    });
-
-                    callbackFunction(options, data);
-                } else {
-                    options.element.text(data[options.attributeName]);
-                }
-            },
-            url: options.APIURL
-      });
-    }
-
     callbackAJAXSpinnerUpdate () {
         if (this.ajaxExecuting) {
             $(this.ajaxSpinnerSeletor).fadeIn(50);
@@ -132,10 +86,10 @@ class MayanApp {
 
                 if ((menuHash === undefined) || (menuHash !== data.hex_hash)) {
                     $(options.menuSelector).html(data.html);
+                    options.app.ajaxMenuHashes[data.name] = data.hex_hash;
                     if (options.callback !== undefined) {
                         options.callback();
                     }
-                    options.app.ajaxMenuHashes[data.name] = data.hex_hash;
                 }
             },
             url: options.url,
@@ -214,7 +168,8 @@ class MayanApp {
     }
 
     initialize () {
-        this.setupAJAXPeriodicWorkers();
+        var self = this;
+
         this.setupAJAXSpinner();
         this.setupAutoSubmit();
         this.setupFullHeightResizing();
@@ -222,27 +177,12 @@ class MayanApp {
         this.setupNavbarCollapse();
         this.setupNewWindowAnchor();
         $.each(this.ajaxMenusOptions, function(index, value) {
+            value.app = self;
             app.doRefreshAJAXMenu(value);
         });
         partialNavigation.initialize();
     }
 
-    setupAJAXPeriodicWorkers () {
-        var app = this;
-
-        $('a[data-apw-url]').each(function() {
-            var $this = $(this);
-
-            app.AJAXperiodicWorker({
-                attributeName: $this.data('apw-attribute'),
-                APIURL: $this.data('apw-url'),
-                callback: $this.data('apw-callback'),
-                element: $this,
-                interval: $this.data('apw-interval'),
-            });
-        });
-    }
-
     setupAJAXSpinner () {
         var self = this;
 

mayan/apps/appearance/templates/appearance/root.html

@@ -33,7 +33,7 @@
         {% if appearance_type == 'plain' %}
             {% block content_plain %}{% endblock %}
         {% else %}
-            <div id="main-menu">
+            <div id="menu-main">
                 {% include 'appearance/main_menu.html' %}
             </div>
             <div class="container-fluid">
@@ -102,11 +102,19 @@
             {# Transfer variable from Django to javascript #}
             var initialURL = '{% url home_view %}';
             var djangoDEBUG = {% if debug %}true{% else %}false{% endif %};
-            var apiTemplateMainMenuURL = '{% url "rest_api:template-detail" "main_menu" %}';
         </script>
         <script src="{% static 'appearance/js/base.js' %}" type="text/javascript"></script>
         <script>
-            var app = new MayanApp();
+            var app = new MayanApp({
+                ajaxMenusOptions: [
+                    {
+                        interval: 5000,
+                        menuSelector: '#menu-main',
+                        name: 'menu_main',
+                        url: '{% url "rest_api:template-detail" "menu_main" %}'
+                    },
+                ]
+            });
 
             var afterBaseLoad = function () {
                 MayanImage.intialize({

mayan/apps/common/apps.py

@@ -99,7 +99,7 @@ class CommonApp(MayanAppConfig):
             )
 
         Template(
-            name='main_menu', template_name='appearance/main_menu.html'
+            name='menu_main', template_name='appearance/main_menu.html'
         )
 
         app.conf.CELERYBEAT_SCHEDULE.update(