Improved navigation. Moved recent viewed to navbar.

2012-04-24 12:33:34 +02:00 · 2012-04-24 12:33:34 +02:00 · 56eb2c19dd
commit 56eb2c19dd
parent c9a7108af2
5 changed files with 176 additions and 60 deletions
--- a/app/assets/javascripts/app/controllers/dashboard.js.coffee
+++ b/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,
+#        }
      }
    }

--- a/app/assets/javascripts/app/controllers/navigation.js.coffee
+++ b/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
+    )
--- a/app/assets/javascripts/app/controllers/organizations.js.coffee
+++ b/app/assets/javascripts/app/controllers/organizations.js.coffee
@ -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' ] }
+
--- a/app/assets/javascripts/app/views/navigation.jst.eco
+++ b/app/assets/javascripts/app/views/navigation.jst.eco
@ -1,14 +1,20 @@
-    <div class="navbar navbar-fixed-top">
+<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: %>
+          <% 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 %>
              </ul>
@ -23,17 +29,26 @@
        </form>
 <% if @user: %>
        <ul class="nav pull-right">
-              <li>
-                <a href="#ticket_create">New</a>
-              </li>
+        <% for item in @navbar_right: %>
+          <% if item.child: %>
            <li class="dropdown">
-                <a href="#current_user" class="dropdown-toggle" data-toggle="dropdown"><%= @user.login %> <b class="caret"></b></a>
+              <a href="<%= item.target %>" class="dropdown-toggle" data-toggle="dropdown"><%= item.name %> <b class="caret"></b></a>
              <ul class="dropdown-menu">
-                  <li><a href="#profile">Profile</a></li>
+                <% for item in item.child: %>
+                  <% if item.divider: %>
                  <li class="divider"></li>
-                  <li><a href="#logout">Sign out</a></li>
+                  <% 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">
@ -42,4 +57,4 @@
 <% end %>
    </div>
  </div>
-    </div>
+</div>
--- a/app/assets/javascripts/init.js
+++ b/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 = {};