Improved navigation. Moved recent viewed to navbar.

app/assets/javascripts/app/controllers/dashboard.js.coffee

@@ -31,9 +31,9 @@ class Index extends App.Controller
         activity_stream: {
           controller: App.DashboardActivityStream,
         },
-        recent_viewed: {
-          controller: App.DashboardRecentViewed,
-        }
+#        recent_viewed: {
+#          controller: App.DashboardRecentViewed,
+#        }
       }
     }
 

app/assets/javascripts/app/controllers/navigation.js.coffee

@@ -1,6 +1,6 @@
 $ = jQuery.sub()
 
-class App.Navigation extends Spine.Controller
+class App.Navigation extends App.Controller
   events:
     'focusin [data-type=edit]':     'edit_in'
 
@@ -9,6 +9,12 @@ class App.Navigation extends Spine.Controller
     @log 'nav...'
     @render()
     
+    sync_ticket_overview = =>
+      @sync(@ticket_overview, 30000,'interval_id_ticket_overview')
+
+    sync_recent_viewed = =>
+      @sync(@recent_viewed, 40000, 'interval_id_recent_viewed')
+    
     Spine.bind 'navupdate', (data) =>
       @update(arguments[0])
     
@@ -18,21 +24,36 @@ class App.Navigation extends Spine.Controller
 
     Spine.bind 'navupdate_remote', (user) =>
       @log 'navupdate_remote'
-      @delay( @sync, 500 )
+      @delay( sync_ticket_overview, 500 )
+      @delay( sync_recent_viewed, 1000 )
     
     # rerender if new overview data is there
-    @delay( @sync, 800 )
-    @delay( @sync, 2000 )
+    @delay( sync_ticket_overview, 800 )
+    @delay( sync_ticket_overview, 2000 )
+    
+    @delay( sync_recent_viewed, 1000 )
     
   render: (user) ->
-#    @log 'nav render', Config.NavBar
-#    @log '111', _.keys(Config.NavBar)
-    navbar =  _.values(Config.NavBar)
+    nav_left  = @getItems( navbar: Config.NavBar )
+    nav_right = @getItems( navbar: Config.NavBarRight )
+
+    @html App.view('navigation')(
+      navbar_left:  nav_left,
+      navbar_right: nav_right,
+      user:         user,
+    )
+
+  getItems: (data) ->
+    navbar =  _.values(data.navbar)
     
     level1 = []
     dropdown = {}
 
     for item in navbar
+      if typeof item.callback is 'function'
+        data = item.callback() || {}
+        for key, value of data
+          item[key] = value
       if !item.parent
         match = 0
         if !window.Session['roles']
@@ -72,10 +93,7 @@ class App.Navigation extends Spine.Controller
             itemLevel1.child = sub
             
     nav = @getOrder(level1)
-    @html App.view('navigation')(
-      navbar: nav,
-      user: user,
-    )
+    return nav
 
   getOrder: (data) ->
     newlist = {}
@@ -110,19 +128,23 @@ class App.Navigation extends Spine.Controller
     @el.find("[href=\"#{url}\"]").parents('li').addClass('active')
 #      @el.find("[href*=\"#{url}\"]").parents('li').addClass('active')
 
-  sync: =>
+  sync: (action, interval, interval_id) =>
     
-    @ticket_overview()
+    # check global var
+    if !@intervalID
+      @intervalID = {}
+
+    action()
 
     # auto save
     every = (ms, cb) -> setInterval cb, ms
 
     # clear auto save
-    clearInterval(@intervalID) if @intervalID
+    clearInterval(@intervalID[interval_id]) if @intervalID[interval_id]
 
     # request new data
-    @intervalID = every 30000, () =>
-      @ticket_overview()
+    @intervalID[interval_id] = every interval, () =>
+      action()
 
   # get data
   ticket_overview: =>
@@ -162,3 +184,65 @@ class App.Navigation extends Spine.Controller
         # rebuild navbar
         Spine.trigger 'navrebuild', window.Session
     )
+
+
+  # get data
+  recent_viewed: =>
+
+    # do no load and rerender if sub-menu is open
+    open = @el.find('.open').val()
+    if open isnt undefined
+      return
+    
+    # do no load and rerender if user is not logged in
+    if !window.Session['id']
+      return
+
+    @ajax = new App.Ajax
+    @ajax.ajax(
+      type:  'GET',
+      url:   '/recent_viewed',
+      data:  {
+        limit: 5,
+      }
+      processData: true,
+      success: (data, status, xhr) =>
+
+        items = data.recent_viewed
+
+        # load user collection
+        @loadCollection( type: 'User', data: data.users )
+
+        # load ticket collection
+        @loadCollection( type: 'Ticket', data: data.tickets )
+
+        # remove old views
+        for key of Config.NavBarRight
+          if Config.NavBarRight[key].parent is '#current_user'
+            part = Config.NavBarRight[key].target.split '::'
+            if part is 'RecendViewed'
+              delete Config.NavBarRight[key]
+
+        # add new views
+        prio = 5000
+        for item in items
+          divider   = false
+          navheader = false
+          if prio is 5000
+            divider   = true
+            navheader = 'Recent Viewed'
+          ticket = App.Ticket.find(item.o_id)
+          prio++
+          Config.NavBarRight['RecendViewed::' + ticket.id] = {
+            prio:      prio,
+            parent:    '#current_user',
+            name:      item.history_object.name + ' (' + ticket.title + ')',
+            target:    '#ticket/zoom/' + ticket.id,
+            role:      ['Agent'],
+            divider:   divider,
+            navheader: navheader
+          }
+
+        # rebuild navbar
+        Spine.trigger 'navrebuild', window.Session
+    )

app/assets/javascripts/app/controllers/organizations.js.coffee

@@ -40,7 +40,7 @@ Config.NavBar['AdminTrigger'] = { prio: 3000, parent: '#admin', name: 'Trigger',
 Config.NavBar['AdminScheduler'] = { prio: 3500, parent: '#admin', name: 'Scheduler', target: '#scheduler', role: ['Admin'] }
 
 
-Config.NavBar['Setting'] = { prio: 20000, parent: '', name: 'Settings', target: '#settings', role: ['Admin'] }
+Config.NavBar['Setting']         = { prio: 20000, parent: '', name: 'Settings', target: '#settings', role: ['Admin'] }
 Config.NavBar['SettingSystem']   = { prio: 1400, parent: '#settings', name: 'System', target: '#settings/system', role: ['Admin'] }
 Config.NavBar['SettingSecurity'] = { prio: 1500, parent: '#settings', name: 'Security', target: '#settings/security', role: ['Admin'] }
 Config.NavBar['SettingTicket']   = { prio: 1600, parent: '#settings', name: 'Ticket', target: '#settings/ticket', role: ['Admin'] }
@@ -60,3 +60,18 @@ Config.NavBar['TicketOverview'] = { prio: 1000, parent: '', name: 'Overviews', t
 #Config.NavBar[''] = { prio: 1600, parent: '', name: 'anybody+agent', target: '#aa', role: ['Anybody', 'Agent'] }
 #Config.NavBar[''] = { prio: 1600, parent: '', name: 'Anybody', target: '#anybody', role: ['Anybody'] }
 Config.NavBar['CustomerTickets'] = { prio: 1600, parent: '', name: 'Tickets', target: '#customer_tickets', role: ['Customer'] }
+
+Config.NavBarRight['TicketNew'] = { prio: 8000, parent: '', name: 'New', target: '#ticket_create', role: ['Agent'] }
+Config.NavBarRight['User'] = {
+  prio:   10000,
+  parent: '',
+  callback: ->
+    item = {}
+    item['name'] = window.Session['login']
+    return item
+  target: '#current_user',
+  role:   [ 'Agent', 'Customer' ]
+}
+Config.NavBarRight['UserProfile'] = { prio: 1700, parent: '#current_user', name: 'Profile', target: '#profile', role: [ 'Agent', 'Customer' ] }
+Config.NavBarRight['UserLogout']  = { prio: 1800, parent: '#current_user', name: 'Sign out', target: '#logout', divider: true, role: [ 'Agent', 'Customer' ] }
+

app/assets/javascripts/app/views/navigation.jst.eco

@@ -1,45 +1,60 @@
-    <div class="navbar navbar-fixed-top">
-      <div class="navbar-inner">
-        <div class="container">
-          <a class="brand" href="#/"><%- Config.product_name %></a>
-            <ul class="nav">
-              <% for item in @navbar: %>
-                <% if item.child: %>
-                  <li class="dropdown">
-                    <a href="<%= item.target %>" class="dropdown-toggle" data-toggle="dropdown"><%= item.name %> <b class="caret"></b></a>
-                    <ul class="dropdown-menu">
-                      <% for item in item.child: %>
-                        <li><a href="<%= item.target %>"><%= item.name %></a></li>
-                      <% end %>
-                    </ul>
-                  </li>
-                <% else: %>
+<div class="navbar navbar-fixed-top">
+  <div class="navbar-inner">
+    <div class="container">
+      <a class="brand" href="#/"><%- Config.product_name %></a>
+        <ul class="nav">
+          <% for item in @navbar_left: %>
+            <% if item.child: %>
+            <li class="dropdown">
+              <a href="<%= item.target %>" class="dropdown-toggle" data-toggle="dropdown"><%= item.name %> <b class="caret"></b></a>
+              <ul class="dropdown-menu">
+                <% for item in item.child: %>
+                  <% if item.divider: %>
+                  <li class="divider"></li>
+                  <% end %>
+                  <% if item.navheader: %>
+                  <li class="nav-header"><%= item.navheader %></li>
+                  <% end %>
                   <li><a href="<%= item.target %>"><%= item.name %></a></li>
                 <% end %>
-              <% end %>
-            </ul>
-            <form class="navbar-search pull-left">
-              <input class="search-query" type="search" value="" placeholder="Search"/>
-            </form>
+              </ul>
+            </li>
+            <% else: %>
+            <li><a href="<%= item.target %>"><%= item.name %></a></li>
+            <% end %>
+          <% end %>
+        </ul>
+        <form class="navbar-search pull-left">
+          <input class="search-query" type="search" value="" placeholder="Search"/>
+        </form>
 <% if @user: %>
-            <ul class="nav pull-right">
-              <li>
-                <a href="#ticket_create">New</a>
-              </li>
-              <li class="dropdown">
-                <a href="#current_user" class="dropdown-toggle" data-toggle="dropdown"><%= @user.login %> <b class="caret"></b></a>
-                <ul class="dropdown-menu">
-                  <li><a href="#profile">Profile</a></li>
+        <ul class="nav pull-right">
+        <% for item in @navbar_right: %>
+          <% if item.child: %>
+            <li class="dropdown">
+              <a href="<%= item.target %>" class="dropdown-toggle" data-toggle="dropdown"><%= item.name %> <b class="caret"></b></a>
+              <ul class="dropdown-menu">
+                <% for item in item.child: %>
+                  <% if item.divider: %>
                   <li class="divider"></li>
-                  <li><a href="#logout">Sign out</a></li>
-                </ul>
-              </li>
-            </ul>
+                  <% end %>
+                  <% if item.navheader: %>
+                  <li class="nav-header"><%= item.navheader %></li>
+                  <% end %>
+                  <li><a href="<%= item.target %>"><%= item.name %></a></li>
+                <% end %>
+              </ul>
+            </li>
+            <% else: %>
+            <li><a href="<%= item.target %>"><%= item.name %></a></li>
+            <% end %>
+          <% end %>
+        </ul>
 <% else: %>
-            <ul class="nav pull-right">
-              <li><a href="#login">Sign in</a></li>
-            </ul>
+        <ul class="nav pull-right">
+          <li><a href="#login">Sign in</a></li>
+        </ul>
 <% end %>
-        </div>
-      </div>
     </div>
+  </div>
+</div>

app/assets/javascripts/init.js

@@ -1,6 +1,8 @@
 var Config = {};
 Config.Routes = {};
 Config.NavBar = {};
+Config.NavBarRight = {};
 Config.product_name = 'Zammad'
 Config.requested_url = ''
+var Store = {};
 var Session = {};