popup.js.coffee in unpoly-rails-0.29.0

- old
+ new

@@ -8,11 +8,11 @@
 To open a popup, add an [`up-popup` attribute](/up-popup) to a link,
 or call the Javascript function [`up.popup.attach`](/up.popup.attach).
 
 For modal dialogs see [up.modal](/up.modal) instead.
 
-\#\#\#\# Customizing the popup design
+\#\#\# Customizing the popup design
 
 Loading the Unpoly stylesheet will give you a minimal popup design:
 
 - Popup contents are displayed in a white box
 - There is a a subtle box shadow around the popup
@@ -24,11 +24,11 @@
 
     <div class="up-popup">
       ...
     </div>
 
-\#\#\#\# Closing behavior
+\#\#\# Closing behavior
 
 The popup closes when the user clicks anywhere outside the popup area.
 
 By default the popup also closes
 *when a link within the popup changes a fragment behind the popup*.
@@ -174,18 +174,26 @@
   Attaches a popup overlay to the given element or selector.
 
   Emits events [`up:popup:open`](/up:popup:open) and [`up:popup:opened`](/up:popup:opened).
 
   @function up.popup.attach
-  @param {Element|jQuery|String} elementOrSelector
+  @param {Element|jQuery|String} anchor
+    The element to which the popup will be attached.
   @param {String} [options.url]
+    The URL from which to fetch the popup contents.
+
+    If omitted, the `href` or `up-href` attribute of the anchor element will be used.
+
+    Will be ignored if `options.html` is given.
   @param {String} [options.target]
     A CSS selector that will be extracted from the response and placed into the popup.
   @param {String} [options.position='bottom-right']
     Defines where the popup is attached to the opening element.
 
     Valid values are `bottom-right`, `bottom-left`, `top-right` and `top-left`.
+  @param {String} [options.html]
+    A string of HTML from which to extract the popup contents. No network request will be made.
   @param {String} [options.confirm]
     A message that will be displayed in a cancelable confirmation dialog
     before the modal is being opened.
   @param {String} [options.animation]
     The animation to use when opening the popup.
@@ -380,33 +388,34 @@
     Set this to `'false'` to prevent the URL bar from being updated.
     Set this to a URL string to update the history with the given URL.
 
   @stable
   ###
-  up.link.onAction('[up-popup]', ($link) ->
+  up.link.onAction '[up-popup]', ($link) ->
     if $link.is('.up-current')
       closeAsap()
     else
       attachAsap($link)
-  )
 
-  # Close the popup when someone clicks outside the popup
-  # (but not on a popup opener).
-  up.on('mousedown', 'body', (event, $body) ->
+  # We close the popup when someone clicks on the document.
+  # We also need to listen to up:action:consumed in case an [up-instant] link
+  # was followed on mousedown.
+  up.on 'click up:action:consumed', (event) ->
     $target = $(event.target)
+    # Don't close when the user clicked on a popup opener.
     unless $target.closest('.up-popup, [up-popup]').length
       closeAsap()
-  )
-  
-  up.on('up:fragment:inserted', (event, $fragment) ->
+      # Do not halt the event chain here. The user is allowed to directly activate
+      # a link in the background, even with a (now closing) popup open.
+
+  up.on 'up:fragment:inserted', (event, $fragment) ->
     if contains($fragment)
       if newSource = $fragment.attr('up-source')
         state.url = newSource
     else if contains(event.origin)
       autoclose()
-  )
-  
+
   # Close the pop-up overlay when the user presses ESC.
   up.bus.onEscape(closeAsap)
 
   ###*
   When an element with this attribute is clicked,
@@ -420,17 +429,16 @@
       <a href="/fallback" up-close>Okay</a>
 
   @selector [up-close]
   @stable
   ###
-  up.on('click', '[up-close]', (event, $element) ->
+  up.on 'click', '[up-close]', (event, $element) ->
     if contains($element)
       closeAsap()
       # Only prevent the default when we actually closed a popup.
       # This way we can have buttons that close a popup when within a popup,
       # but link to a destination if not.
-      event.preventDefault()
-  )
+      up.bus.consumeAction(event)
 
   # The framework is reset between tests
   up.on 'up:framework:reset', reset
 
   knife: eval(Knife?.point)