Improved live search.

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

@@ -15,20 +15,15 @@ class App.Navigation extends App.Controller
     @bind 'auth', (user) =>
       @log 'Navigation', 'notice', 'navbar rebuild', user
 
-      if !_.isEmpty( user )
-        cache = App.Store.get( 'navupdate_ticket_overview' )
-        @ticket_overview_build( cache ) if cache
-
       if !_.isEmpty( user )
         cache = App.Store.get( 'update_recent_viewed' )
         @recent_viewed_build( cache ) if cache
 
       @render()
 
-    # rebuild ticket overview data
+    # remember ticket overview data
     @bind 'navupdate_ticket_overview', (data) =>
-      @ticket_overview_build(data)
-      @render()
+      App.Store.write( 'navupdate_ticket_overview', data )
 
     # rebuild recent viewed data
     @bind 'update_recent_viewed', (data) =>
@@ -47,6 +42,33 @@ class App.Navigation extends App.Controller
       else
         @el.find('.bell').removeClass('show')
 
+  renderResult: (result = []) =>
+    el = @el.find('#global-search-result')
+
+    # remove result if not result exists
+    if _.isEmpty( result )
+      @el.find('#global-search').parents('li').removeClass('open')
+      el.html( '' )
+      return
+
+    # show result list
+    @el.find('#global-search').parents('li').addClass('open')
+
+    # build markup
+    html = App.view('navigation/result')(
+      result: result
+    )
+    el.html( html )
+
+    # start ticket popups
+    @ticketPopups('left')
+
+    # start user popups
+    @userPopups('left')
+
+    # start oorganization popups
+    @organizationPopups('left')
+
   render: () ->
     user      = App.Session.all()
     nav_left  = @getItems( navbar: @Config.get( 'NavBar' ) )
@@ -77,15 +99,6 @@ class App.Navigation extends App.Controller
       search:       search
     )
 
-    # start ticket popups
-    @ticketPopups('left')
-
-    # start user popups
-    @userPopups('left')
-
-    # start oorganization popups
-    @organizationPopups('left')
-
     # set focus to search box
     if @searchFocus
       @searchFocusSet = true
@@ -107,8 +120,8 @@ class App.Navigation extends App.Controller
           # load assets
           App.Collection.loadAssets( data.assets )
 
-          @result = data.result
-          for area in @result
+          result = data.result
+          for area in result
             if area.name is 'Ticket'
               area.result = []
               for id in area.ids
@@ -141,8 +154,7 @@ class App.Navigation extends App.Controller
                   url:      organization.uiUrl()
                 area.result.push data
 
-          if @result
-            @render(user)
+          @renderResult(result)
       )
 
     # observer search box
@@ -163,8 +175,7 @@ class App.Navigation extends App.Controller
       @delay(
         =>
           @searchFocus = false
-          @result = []
-          @render(user)
+          @renderResult()
         320
       )
     )
@@ -274,29 +285,6 @@ class App.Navigation extends App.Controller
     @el.find('li').removeClass('active')
     @el.find("[href=\"#{url}\"]").parents('li').addClass('active')
 
-  ticket_overview_build: (data) =>
-    App.Store.write( 'navupdate_ticket_overview', data )
-    return
-
-    # remove old views
-    NavBar = @Config.get( 'NavBar' ) || {}
-    for key of NavBar
-      if NavBar[key].parent is '#ticket/view'
-        delete NavBar[key]
-
-    # add new views
-    for item in data
-      NavBar['TicketOverview' + item.link] = {
-        prio:   item.prio,
-        parent: '#ticket_view',
-        name:   item.name,
-        count:  item.count,
-        target: '#ticket_view/' + item.link,
-#        role:   ['Agent', 'Customer'],
-      }
-
-    @Config.set( 'NavBar', NavBar )
-
   recent_viewed_build: (data) =>
 
     App.Store.write( 'update_recent_viewed', data )

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

@@ -27,18 +27,11 @@
 <% if !_.isEmpty(@user): %>
   <ul class="nav navbar-nav pull-right">
 
-    <li class="dropdown <% if @result[0] : %>open<% end %>">
+    <li class="dropdown">
       <form class="navbar-form">
         <input id="global-search" class="form-control" type="search" value="<%= @search %>" placeholder="<%- @Ti( 'Search' ) %>" autocomplete="off"/>
       </form>
-      <ul class="dropdown-menu">
-        <% for area in @result: %>
-          <li class="divider" style="padding: 2px 10px; height: auto; margin: 4px 0px;"><%- @T( area.name ) %></li>
-          <% for item in area.result: %>
-            <li><a href="<%- item.url %>" class="<%= item.class %>" data-id="<%= item.id %>"><%= item.display %></a></li>
-          <% end %>
-        <% end %>
-      </ul>
+      <ul id="global-search-result" class="dropdown-menu"></ul>
     </li>
 
     <li class="bell"><a href="#bell" class="glyphicon glyphicon-bell"></a></li>

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

@@ -0,0 +1,6 @@
+<% for area in @result: %>
+  <li class="divider" style="padding: 2px 10px; height: auto; margin: 4px 0px;"><%- @T( area.name ) %></li>
+  <% for item in area.result: %>
+    <li><a href="<%- item.url %>" class="<%= item.class %>" data-id="<%= item.id %>"><%= item.display %></a></li>
+  <% end %>
+<% end %>