#1: Progress commit - the search popup now responds to clicks correctly!

This commit is contained in:
Peter Deltchev 2016-01-16 20:04:23 -08:00
parent 8960d11869
commit ffca74f45d
2 changed files with 32 additions and 5 deletions

View file

@ -1,5 +1,12 @@
<div class="search" ng-blur="searchInProgress = false"> <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"> <div class="search-results pfm-popup" id="search-results">
<h3 class="-section-header">Matching tracks</h3> <h3 class="-section-header">Matching tracks</h3>

View file

@ -27,14 +27,29 @@ angular.module('ponyfm').directive 'pfmPopup', () ->
$element = $ element $element = $ element
$positionParent = null $positionParent = null
open = false open = false
dontCloseOnClick = attrs.pfmPopupCloseOnClick?
close = () ->
$popup.removeClass 'open'
open = false
documentClickHandler = (event) -> documentClickHandler = (event) ->
console.log(event)
debugger
return if !open 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 return true
calculatePosition = -> calculatePosition = ->
$popup.parents().each () -> $popup.parents().each () ->
$this = $ this $this = $ this
@ -64,6 +79,7 @@ angular.module('ponyfm').directive 'pfmPopup', () ->
top: top - parentPosition.top, top: top - parentPosition.top,
height: height - 15} height: height - 15}
windowResizeHandler = () -> windowResizeHandler = () ->
return if !open return if !open
$popup.css 'height', 'auto' $popup.css 'height', 'auto'
@ -81,8 +97,7 @@ angular.module('ponyfm').directive 'pfmPopup', () ->
e.stopPropagation() e.stopPropagation()
if open and not $element.is(':focus') if open and not $element.is(':focus')
open = false close
$popup.removeClass 'open'
return return
$popup.addClass 'open' $popup.addClass 'open'
@ -98,6 +113,11 @@ angular.module('ponyfm').directive 'pfmPopup', () ->
open = true open = true
), 0 ), 0
scope.$on '$stateChangeStart', () ->
close()
scope.$on '$destroy', () -> scope.$on '$destroy', () ->
$(document.body).unbind 'click', documentClickHandler $(document.body).unbind 'click', documentClickHandler
$(window).unbind 'click', windowResizeHandler $(window).unbind 'click', windowResizeHandler