unpoly-rails 0.56.7 → 0.57.0

data/lib/assets/javascripts/unpoly/feedback.coffee

@@ -92,7 +92,7 @@ up.feedback = (($) ->
       for attr in ['href', 'up-href', 'up-alias']
         if value = u.presentAttr($section, attr)
           # Allow to include multiple space-separated URLs in [up-alias]
-          for url in value.split(/\s+/)
+          for url in u.splitValues(value)
             unless url == '#'
               url = normalizeUrl(url)
               urls.push(url)
@@ -371,4 +371,4 @@ up.feedback = (($) ->
 
 )(jQuery)
 
-up.renamedModule 'navigation', 'feedback'
+up.deprecateRenamedModule 'navigation', 'feedback'

data/lib/assets/javascripts/unpoly/form.coffee.erb

@@ -28,13 +28,16 @@ up.form = (($) ->
     By default this looks for a `<fieldset>`, `<label>` or `<form>`
     around the validating input field, or any element with an
     `up-fieldset` attribute.
-  @param {string} [config.fields=[':input']]
+  @param {string} [config.fields]
     An array of CSS selectors that represent form fields, such as `input` or `select`.
+  @param {string} [config.submitButtons]
+    An array of CSS selectors that represent submit buttons, such as `input[type=submit]`.
   @stable
   ###
   config = u.config
     validateTargets: ['[up-fieldset]:has(&)', 'fieldset:has(&)', 'label:has(&)', 'form:has(&)']
-    fields: [':input']
+    fields: ['select', 'input:not([type=submit]):not([type=image])', 'button[type]:not([type=submit])', 'textarea'],
+    submitButtons: ['input[type=submit]', 'input[type=image]', 'button[type=submit]', 'button:not([type])']
     observeDelay: 0
 
   reset = ->
@@ -47,6 +50,13 @@ up.form = (($) ->
   fieldSelector = ->
     config.fields.join(',')
 
+  ###**
+  @function up.form.submitButtonSelector
+  @internal
+  ###
+  submitButtonSelector = ->
+    config.submitButtons.join(',')
+
   ###**
   Submits a form via AJAX and updates a page fragment with the response.
 
@@ -129,9 +139,9 @@ up.form = (($) ->
     with the request.
   @param {string} [options.layer='auto']
     The name of the layer that ought to be updated. Valid values are
-    `auto`, `page`, `modal` and `popup`.
+    `'auto'`, `'page'`, `'modal'` and `'popup'`.
 
-    If set to `auto` (default), Unpoly will try to find a match in the form's layer.
+    If set to `'auto'` (default), Unpoly will try to find a match in the form's layer.
   @param {string} [options.failLayer='auto']
     The name of the layer that ought to be updated if the server sends a non-200 status code.
   @return {Promise}
@@ -158,7 +168,7 @@ up.form = (($) ->
     options.origin = u.option(options.origin, $form)
     options.layer = u.option(options.layer, $form.attr('up-layer'), 'auto')
     options.failLayer = u.option(options.failLayer, $form.attr('up-fail-layer'), 'auto')
-    options.data = u.requestDataFromForm($form)
+    options.params = up.params.fromForm($form)
     options = u.merge(options, up.motion.animateOptions(options, $form))
 
     if options.validate
@@ -167,7 +177,7 @@ up.form = (($) ->
       options.failTransition = false
       options.headers[up.protocol.config.validateHeader] = options.validate
 
-    up.bus.whenEmitted('up:form:submit', $element: $form).then ->
+    up.bus.whenEmitted('up:form:submit', message: 'Submitting form', $form: $form, $element: $form).then ->
       up.feedback.start($form)
 
       # If we can't update the location URL, fall back to a vanilla form submission.
@@ -184,7 +194,7 @@ up.form = (($) ->
   This event is [emitted](/up.emit) when a form is [submitted](/up.submit) through Unpoly.
 
   @event up:form:submit
-  @param {jQuery} event.$element
+  @param {jQuery} event.$form
     The `<form>` element that will be submitted.
   @param event.preventDefault()
     Event listeners may call this method to prevent the form from being submitted.
@@ -430,11 +440,11 @@ up.form = (($) ->
     $target = $(target)
     fieldValues ||= switcherValues(findSwitcherForTarget($target))
     if hideValues = $target.attr('up-hide-for')
-      hideValues = hideValues.split(' ')
+      hideValues = u.splitValues(hideValues)
       show = u.intersect(fieldValues, hideValues).length == 0
     else
       if showValues = $target.attr('up-show-for')
-        showValues = showValues.split(' ')
+        showValues = u.splitValues(showValues)
       else
         # If the target has neither up-show-for or up-hide-for attributes,
         # assume the user wants the target to be visible whenever anything
@@ -472,7 +482,7 @@ up.form = (($) ->
 
   \#\#\# Failed submission
 
-  When the server was unable to save the form due to invalid data,
+  When the server was unable to save the form due to invalid params,
   it will usually re-render an updated copy of the form with
   validation messages.
 
@@ -555,9 +565,9 @@ up.form = (($) ->
     or `method` (vanilla HTML) for the same purpose.
   @param {string} [up-layer='auto']
     The name of the layer that ought to be updated. Valid values are
-    `auto`, `page`, `modal` and `popup`.
+    `'auto'`, `'page'`, `'modal'` and `'popup'`.
 
-    If set to `auto` (default), Unpoly will try to find a match in the form's layer.
+    If set to `'auto'` (default), Unpoly will try to find a match in the form's layer.
     If no match was found in that layer,
     Unpoly will search in other layers, starting from the topmost layer.
   @param {string} [up-fail-layer='auto']
@@ -978,6 +988,7 @@ up.form = (($) ->
   switchTargets: switchTargets
   autosubmit: autosubmit
   fieldSelector: fieldSelector
+  submitButtonSelector: submitButtonSelector
 
 )(jQuery)
 

data/lib/assets/javascripts/unpoly/history.coffee

@@ -1,7 +1,7 @@
 ###**
 History
 ========
-  
+
 In an Unpoly app, every page has an URL.
 
 [Fragment updates](/up.link) automatically update the URL.
@@ -60,7 +60,7 @@ up.history = (($) ->
   ###
   currentUrl = (normalizeOptions) ->
     normalizeUrl(up.browser.url(), normalizeOptions)
-  
+
   isCurrentUrl = (url) ->
     normalizeOptions = { stripTrailingSlash: true }
     normalizeUrl(url, normalizeOptions) == currentUrl(normalizeOptions)

data/lib/assets/javascripts/unpoly/layout.coffee.erb

@@ -115,23 +115,16 @@ up.layout = (($) ->
   @experimental
   ###
   scroll = (viewport, scrollTop, options) ->
-    $scrollable = scrollableElementForViewport(viewport)
+    $viewport = $(viewport)
     options = u.options(options)
     options.duration = u.option(options.duration, config.duration)
     options.easing = u.option(options.easing, config.easing)
 
-    finishScrolling($scrollable).then ->
+    finishScrolling($viewport).then ->
       if up.motion.isEnabled() && options.duration > 0
-        scrollWithAnimateNow($scrollable, scrollTop, options)
+        scrollWithAnimateNow($viewport, scrollTop, options)
       else
-        scrollAbruptlyNow($scrollable, scrollTop)
-
-  scrollableElementForViewport = (viewport) ->
-    $viewport = $(viewport)
-    if $viewport.get(0) == document
-      $('html, body') # FML
-    else
-      $viewport
+        scrollAbruptlyNow($viewport, scrollTop)
 
   scrollWithAnimateNow = ($scrollable, scrollTop, animateOptions) ->
     start = ->
@@ -164,7 +157,7 @@ up.layout = (($) ->
     # Don't emit expensive events if no animation can be running anyway
     return Promise.resolve() unless up.motion.isEnabled()
 
-    $scrollable = scrollableElementForViewport(element)
+    $scrollable = viewportOf(element)
     scrollingTracker.finish($scrollable)
 
   ###**
@@ -180,22 +173,25 @@ up.layout = (($) ->
   @return {Object}
   @internal
   ###
-  measureObstruction = ->
-    measurePosition = (obstructor, cssAttr) ->
-      $obstructor = $(obstructor)
-      anchorPosition = u.readComputedStyleNumber($obstructor, cssAttr)
-      unless u.isPresent(anchorPosition)
-        up.fail("Fixed element %o must have a CSS attribute %s", $obstructor.get(0), cssAttr)
-      anchorPosition + $obstructor.height()
-
-    fixedTopBottoms = for obstructor in $(config.fixedTop.join(', '))
-      measurePosition(obstructor, 'top')
-  
-    fixedBottomTops = for obstructor in $(config.fixedBottom.join(', '))
-      measurePosition(obstructor, 'bottom')
-
-    top: Math.max(0, fixedTopBottoms...)
-    bottom: Math.max(0, fixedBottomTops...)
+  measureObstruction = (viewportHeight) ->
+    composeHeight = (obstructor, distanceFromEdgeProps) ->
+      distanceFromEdge = u.sum(distanceFromEdgeProps, (prop) -> u.readComputedStyleNumber(obstructor, prop)) || 0
+      distanceFromEdge + obstructor.offsetHeight
+
+    measureTopObstructor = (obstructor) ->
+      composeHeight(obstructor, ['top', 'margin-top'])
+
+    measureBottomObstructor = (obstructor) ->
+      composeHeight(obstructor, ['bottom', 'margin-bottom'])
+
+    $topObstructors = $(config.fixedTop.join(', '))
+    $bottomObstructors = $(config.fixedBottom.join(', '))
+
+    topObstructions = u.map($topObstructors, measureTopObstructor)
+    bottomObstructions = u.map($bottomObstructors, measureBottomObstructor)
+
+    top: Math.max(0, topObstructions...)
+    bottom: Math.max(0, bottomObstructions...)
 
   ###**
   Scroll's the given element's viewport so the first rows of the
@@ -250,7 +246,7 @@ up.layout = (($) ->
 
       snap = u.option(options.snap, config.snap)
 
-      viewportIsDocument = $viewport.is(document)
+      viewportIsDocument = $viewport.is(up.browser.documentViewportSelector())
       viewportHeight = if viewportIsDocument then u.clientSize().height else $viewport.outerHeight()
       originalScrollPos = $viewport.scrollTop()
       newScrollPos = originalScrollPos
@@ -259,7 +255,7 @@ up.layout = (($) ->
       obstruction = undefined
 
       if viewportIsDocument
-        obstruction = measureObstruction()
+        obstruction = measureObstruction(viewportHeight)
         # Within the body, $.position will always return the distance
         # from the document top and *not* the distance of the viewport
         # top. This is what the calculations below expect, so don't shift.
@@ -274,11 +270,11 @@ up.layout = (($) ->
         offsetShift = originalScrollPos
 
       predictFirstVisibleRow = -> newScrollPos + obstruction.top
-      predictLastVisibleRow = -> newScrollPos + viewportHeight - obstruction.bottom - 1
+      predictLastVisibleRow = -> newScrollPos + viewportHeight - obstruction.bottom
 
       elementDims = u.measure($element, relative: $viewport, includeMargin: true)
       firstElementRow = elementDims.top + offsetShift
-      lastElementRow = firstElementRow + Math.min(elementDims.height, config.substance) - 1
+      lastElementRow = firstElementRow + Math.min(elementDims.height, config.substance)
 
       if lastElementRow > predictLastVisibleRow()
         # Try to show the full height of the element
@@ -297,32 +293,91 @@ up.layout = (($) ->
         Promise.resolve()
 
   ###**
-  [Reveals](/up.reveal) an element matching the `#hash` in the current URL.
+  @function up.layout.scrollAfterInsertFragment
+  @param {boolean|object} [options.restoreScroll]
+  @param {boolean|string|jQuery|Element} [options.reveal]
+  @param {boolean|string} [options.reveal]
+  @return {Promise}
+    A promise that is fulfilled when the scrolling has finished.
+  @internal
+  ###
+  scrollAfterInsertFragment = (selectorOrElement, options) ->
+    options = u.options(options)
+    $element = $(selectorOrElement)
+
+    hashOpt = options.hash
+    revealOpt = options.reveal
+    restoreScrollOpt = options.restoreScroll
+
+    durationOptions = u.only(options, 'duration')
+
+    if restoreScrollOpt
+      # If options.restoreScroll is an object, its keys map viewport selectors
+      # to scroll positions. If it is just true, we leave the scrollTops option
+      # undefined and let restoreScroll() retrieve previous scrollTops from cache.
+      givenTops = u.presence(restoreScrollOpt, u.isObject)
+      return restoreScroll(around: $element, scrollTops: givenTops)
+
+    else if hashOpt && revealOpt == true # hash revealing can be disabled with { reveal: false }
+      return revealHash(hashOpt, durationOptions)
+
+    else if revealOpt
+      # We allow to pass another element as { reveal } option
+      if u.isElement(revealOpt) || u.isJQuery(revealOpt)
+        $element = $(revealOpt)
+
+      # We allow to pass a selector as { reveal } option
+      else if u.isString(revealOpt)
+        selector = up.dom.resolveSelector(revealOpt, options.origin)
+        $element = up.first(selector)
+
+      else
+        # We reveal the given $element
+
+      # If selectorOrElement was a CSS selector, don't blow up by calling reveal()
+      # with an empty jQuery collection. This might happen if a failed form submission
+      # reveals the first validation error message, but the error is shown in an
+      # unexpected element.
+      if $element.length
+        return reveal($element, durationOptions)
+
+    else
+      # If we didn't need to scroll above, just return a resolved promise
+      # to fulfill this function's signature.
+      return Promise.resolve()
+
+  ###**
+  [Reveals](/up.reveal) an element matching the given `#hash` anchor.
 
   Other than the default behavior found in browsers, `up.revealHash` works with
   [multiple viewports](/up-viewport) and honors [fixed elements](/up-fixed-top) obstructing the user's
   view of the viewport.
 
-  This is called automatically when the page loads initially.
+  When the page loads initially, this function is automatically called with the hash from
+  the current URL.
+
+  If no element matches the given `#hash` anchor, a resolved promise is returned.
 
   @function up.layout.revealHash
   @return {Promise}
     A promise that is fulfilled when scroll position has changed to match the location hash.
   @experimental
   ###
-  revealHash = ->
-    if (hash = up.browser.hash()) && ($match = firstHashTarget(hash))
-      reveal($match)
+  revealHash = (hash) ->
+    if (hash) && ($match = firstHashTarget(hash))
+      reveal($match, top: true)
     else
       Promise.resolve()
 
   viewportSelector = ->
-    config.viewports.join(',')
+    # On Edge the document viewport can be changed from CSS
+    [up.browser.documentViewportSelector(), config.viewports...].join(',')
 
   ###**
   Returns the viewport for the given element.
 
-  Returns `$(document)` if no better viewpoint could be found.
+  Returns the [document's scrolling element](https://developer.mozilla.org/en-US/docs/Web/API/Document/scrollingElement)
+  if no closer viewpoint exists.
 
   @function up.layout.viewportOf
   @param {string|Element|jQuery} selectorOrElement
@@ -331,10 +386,7 @@ up.layout = (($) ->
   ###
   viewportOf = (selectorOrElement, options = {}) ->
     $element = $(selectorOrElement)
-    $viewport = $element.closest(viewportSelector())
-    if $viewport.length == 0
-      $viewport = $(document)
-    $viewport
+    $element.closest(viewportSelector())
 
   ###**
   Returns a jQuery collection of all the viewports contained within the
@@ -356,14 +408,10 @@ up.layout = (($) ->
   @internal
   ###
   viewports = ->
-    $(document).add(viewportSelector())
+    $(viewportSelector())
 
   scrollTopKey = (viewport) ->
-    $viewport = $(viewport)
-    if $viewport.is(document)
-      'document'
-    else
-      u.selectorForElement($viewport)
+    u.selectorForElement(viewport)
 
   ###**
   Returns a hash with scroll positions.
@@ -447,7 +495,7 @@ up.layout = (($) ->
     else
       $viewports = viewports()
 
-    scrollTopsForUrl = lastScrollTops.get(url) || {}
+    scrollTopsForUrl = options.scrollTops || lastScrollTops.get(url) || {}
 
     up.log.group 'Restoring scroll positions for URL %s to %o', url, scrollTopsForUrl, ->
       allScrollPromises = u.map $viewports, (viewport) ->
@@ -457,51 +505,6 @@ up.layout = (($) ->
 
       Promise.all(allScrollPromises)
 
-  ###**
-  @function up.layout.revealOrRestoreScroll
-  @param {boolean} [options.restoreScroll]
-  @param {boolean|string} [options.reveal]
-  @return {Promise}
-    A promise that is fulfilled when the element is revealed or
-    the scroll position is restored.
-  @internal
-  ###
-  revealOrRestoreScroll = (selectorOrElement, options) ->
-    options = u.options(options)
-    $element = $(selectorOrElement)
-
-    if options.restoreScroll
-      return restoreScroll(around: $element)
-
-    if options.reveal
-      revealOptions = { duration: options.duration }
-      if u.isString(options.reveal)
-        selector = revealSelector(options.reveal, options)
-        $element = up.first(selector) || $element
-        revealOptions.top = true
-
-      # If selectorOrElement was a CSS selector, don't blow up by calling reveal()
-      # with an empty jQuery collection. This might happen if a failed form submission
-      # reveals the first validation error message, but the error is shown in an
-      # unexpected element.
-      if $element.length
-        return reveal($element, revealOptions)
-
-    # If we didn't need to scroll above, just return a resolved promise
-    # to fulfill this function's signature.
-    return Promise.resolve()
-
-  ###**
-  @internal
-  ###
-  revealSelector = (selector, options) ->
-    # up.dom.resolveSelector() will (1) substitute any "&" shorthands with an selector
-    # for options.origin and (2) convert selector into a string, if it is an Element.
-    selector = up.dom.resolveSelector(selector, options.origin)
-    if selector[0] == '#'
-      selector += ", a[name='#{selector}']"
-    selector
-
   ###**
   @internal
   ###
@@ -686,10 +689,26 @@ up.layout = (($) ->
   @internal
   ###
   firstHashTarget = (hash) ->
-    if hash = up.browser.hash(hash)
-      up.first("[id='#{hash}'], a[name='#{hash}']")
+    if hash = pureHash(hash)
+      byID = u.attributeSelector('id', hash)
+      byName = 'a' + u.attributeSelector('name', hash)
+      up.first("#{byID},#{byName}")
+
+
+  ###**
+  Returns `'foo'` if the hash is `'#foo'`.
+
+  Returns undefined if the hash is `'#'`, `''` or `undefined`.
+
+  @function up.browser.hash
+  @internal
+  ###
+  pureHash = (value) ->
+    if value && value[0] == '#'
+      value = value.substr(1)
+    u.presence(value)
 
-  up.on 'up:app:booted', revealHash
+  up.on 'up:app:booted', -> revealHash(location.hash)
 
   up.on 'up:framework:reset', reset
 
@@ -705,7 +724,7 @@ up.layout = (($) ->
   scrollTops: scrollTops
   saveScroll: saveScroll
   restoreScroll: restoreScroll
-  revealOrRestoreScroll: revealOrRestoreScroll
+  scrollAfterInsertFragment: scrollAfterInsertFragment
   anchoredRight: anchoredRight
   fixedChildren: fixedChildren
   absolutize: absolutize