diff --git a/public/templates/directives/search.html b/public/templates/directives/search.html
index c6ea160d..5455cb96 100644
--- a/public/templates/directives/search.html
+++ b/public/templates/directives/search.html
@@ -1,5 +1,12 @@
 <div class="search" ng-blur="searchInProgress = false">
-    <input class="search-input" type="text" placeholder="Search&hellip;" ng-model="searchQuery" pfm-popup="search-results" />
+    <input
+        class="search-input"
+        type="text"
+        placeholder="Search&hellip;"
+        ng-model="searchQuery"
+        pfm-popup="search-results"
+        pfm-popup-close-on-click
+    />
 
     <div class="search-results pfm-popup" id="search-results">
         <h3 class="-section-header">Matching tracks</h3>
diff --git a/resources/assets/scripts/app/directives/popup.coffee b/resources/assets/scripts/app/directives/popup.coffee
index 133c77ea..25ca462d 100644
--- a/resources/assets/scripts/app/directives/popup.coffee
+++ b/resources/assets/scripts/app/directives/popup.coffee
@@ -27,14 +27,29 @@ angular.module('ponyfm').directive 'pfmPopup', () ->
         $element = $ element
         $positionParent = null
         open = false
+        dontCloseOnClick = attrs.pfmPopupCloseOnClick?
+
+
+        close = () ->
+            $popup.removeClass 'open'
+            open = false
 
 
         documentClickHandler = (event) ->
+            console.log(event)
+            debugger
             return if !open
-            $popup.removeClass 'open'
-            open = false
+
+            if (dontCloseOnClick and
+                (event.target.id == elementId or
+                $(event.target).parents("##{elementId}").size())
+            )
+                return true
+
+            close()
             return true
 
+
         calculatePosition = ->
             $popup.parents().each () ->
                 $this = $ this
@@ -64,6 +79,7 @@ angular.module('ponyfm').directive 'pfmPopup', () ->
                 top: top - parentPosition.top,
                 height: height - 15}
 
+
         windowResizeHandler = () ->
             return if !open
             $popup.css 'height', 'auto'
@@ -81,8 +97,7 @@ angular.module('ponyfm').directive 'pfmPopup', () ->
             e.stopPropagation()
 
             if open and not $element.is(':focus')
-                open = false
-                $popup.removeClass 'open'
+                close
                 return
 
             $popup.addClass 'open'
@@ -98,6 +113,11 @@ angular.module('ponyfm').directive 'pfmPopup', () ->
                 open = true
             ), 0
 
+
+        scope.$on '$stateChangeStart', () ->
+            close()
+
+
         scope.$on '$destroy', () ->
             $(document.body).unbind 'click', documentClickHandler
             $(window).unbind 'click', windowResizeHandler