Implementing search box javascript

app/coffee/modules/nav.coffee

@@ -82,7 +82,6 @@ ProjectsNavigationDirective = ($rootscope, animationFrame, $timeout) ->
     <h1>Your projects</h1>
     <form>
         <fieldset>
-            <!--TODO-->
             <input type="text" placeholder="Search in..." class="search-project"/>
             <a class="icon icon-search"></a>
         </fieldset>
@@ -266,7 +265,7 @@ ProjectMenuDirective = ($log, $compile, $auth, $rootscope, $tgAuth, $location) -
     <div class="menu-container">
         <ul class="main-nav">
         <li id="nav-search">
-            <a href="" title="Search" tg-nav="project-search:project=project.slug">
+            <a href="" title="Search">
                 <span class="icon icon-search"></span><span class="item">Search</span>
             </a>
         </li>
@@ -376,6 +375,7 @@ ProjectMenuDirective = ($log, $compile, $auth, $rootscope, $tgAuth, $location) -
 
     link = ($scope, $el, $attrs, $ctrl) ->
         renderMainMenu($el)
+        project = null
 
         $el.on "click", ".logo > a", (event) ->
             event.preventDefault()
@@ -391,7 +391,12 @@ ProjectMenuDirective = ($log, $compile, $auth, $rootscope, $tgAuth, $location) -
             $scope.$apply ->
                 $location.path("/login")
 
-        $scope.$on "project:loaded", (ctx, project) ->
+        $el.on "click", "#nav-search > a", (event) ->
+            event.preventDefault()
+            $rootscope.$broadcast("search-box:show", project)
+
+        $scope.$on "project:loaded", (ctx, newProject) ->
+            project = newProject
             if $el.hasClass("hidden")
                 $el.removeClass("hidden")
 

app/coffee/modules/search.coffee

@@ -98,6 +98,39 @@ class SearchController extends mixOf(taiga.Controller, taiga.PageMixin)
 module.controller("SearchController", SearchController)
 
 
+#############################################################################
+## Search box directive
+#############################################################################
+
+SearchBoxDirective = ($lightboxService, $navurls, $location)->
+    link = ($scope, $el, $attrs) ->
+        project = null
+        $scope.$on "search-box:show", (ctx, newProject)->
+            project = newProject
+            $lightboxService.open($el)
+
+        $el.on "click", ".button-green", (event) ->
+            event.preventDefault()
+            form = $el.find("form").checksley()
+            if not form.validate()
+                return
+
+            text = $el.find("#search-text").val()
+
+            url = $navurls.resolve("project-search")
+            url = $navurls.formatUrl(url, {'project': project.slug})
+
+            $lightboxService.close($el)
+            $scope.$apply ->
+                $location.path(url)
+                $location.search("text",text).path(url)
+
+    return {link:link}
+
+
+module.directive("tgSearchBox", ["lightboxService", "$tgNavUrls", "$tgLocation", SearchBoxDirective])
+
+
 #############################################################################
 ## Search Directive
 #############################################################################

app/index.jade

@@ -27,7 +27,7 @@ html(lang="en", ng-app="taiga")
             include partials/views/modules/lightbox-generic-success
         div.hidden.lightbox.lightbox-generic-error
             include partials/views/modules/lightbox-generic-error
-        div.lightbox.lightbox-search
+        div.lightbox.lightbox-search(tg-search-box)
             include partials/views/modules/lightbox-search
 
         include partials/views/modules/loader

app/partials/views/modules/lightbox-search.jade

@@ -2,6 +2,6 @@ a.close(href="", title="close")
     span.icon.icon-delete
 form
     h2.title Search
-    input(type="text", placeholder="What are you looking for?")
+    input(type="text", name="text", id="search-text", placeholder="What are you looking for?", data-required="true")
     a.button.button-green(href="", title="Accept")
-        span Search
+        span Search