• Jump To … +
    beanvalidator-validation.coffee t5-core-dom-jquery.coffee t5-core-dom-prototype.coffee ajax.coffee ajaxformloop.coffee alert.coffee autocomplete.coffee bootstrap.coffee confirm-click.coffee console.coffee datefield.coffee events.coffee exception-display.coffee exception-frame.coffee fields.coffee form-fragment.coffee forms.coffee init.coffee localdate.coffee messages.coffee moment.coffee pageinit.coffee palette.coffee select.coffee time-interval.coffee tree.coffee utils.coffee validation.coffee zone-refresh.coffee zone.coffee
  • zone.coffee

  • ¶

    Licensed under the Apache License, Version 2.0 (the “License”); you may not use this file except in compliance with the License. You may obtain a copy of the License at

    http:#www.apache.org/licenses/LICENSE-2.0

    Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an “AS IS” BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.

  • ¶

    t5/core/zone

    Provides a default handler for events related to zones. A zone is any kind of client-side element that can be updated; a zone will normally have a unique id. Typically, a client-side zone element is rendered by, and corresponds to, a server-side core/Zone component; however, certain other components (such as core/ProgressiveDisplay) may also be treated as zones.

    Most often, a zone is any element with attribute data-container-type=zone and corresponds to a core/Zone server-side component.

    define ["./dom", "./events", "./ajax", "./console", "./forms",  "underscore"],
    
      (dom, events, ajax, console, forms, _) ->
  • ¶

    For a given element that may have the data-update-zone attribute, locates the zone element. May return null if the zone can not be found (after logging an error to the console).

    • element - starting point for determining zone
        findZone = (element) ->
          zoneId = element.attr "data-update-zone"
    
          if zoneId is "^"
            zone = element.findParent "[data-container-type=zone]"
    
            if zone is null
              throw new Error "Unable to locate containing zone for #{element}."
    
            return zone
    
          zone = dom zoneId
    
          if zone is null
            throw new Error "Unable to locate zone '#{zoneId}'."
    
          return zone
    
        dom.onDocument "click", "a[data-update-zone]", (event) ->
    
          element = @closest "[data-update-zone]"
    
          unless element
            throw new Error "Could not locate containing element with data-update-zone attribute."
    
          zone = findZone element
    
          if zone
            zone.trigger events.zone.refresh,  url: element.attr "href"
    
          event.nativeEvent.preventDefault()
          return
    
        dom.onDocument "submit", "form[data-update-zone]", ->
    
          zone = findZone this
    
          if zone
            formParameters = forms.gatherParameters this
    
            zone.trigger events.zone.refresh,
              url: (@attr "action")
              parameters: formParameters
    
          return false
    
        dom.onDocument "submit", "form[data-async-trigger]", ->
    
          formParameters = forms.gatherParameters this
    
          @addClass "ajax-update"
    
          ajax (@attr "action"),
            data: formParameters
            complete: => @removeClass "ajax-update"
    
          return false
    
        dom.onDocument events.zone.update, (event) ->
    
          @trigger events.zone.willUpdate
    
          content = event.memo.content
  • ¶

    The server may have passed down the empty string for the content; that removes the existing content. On the other hand, the server may have not provided a content key; in that case, content is undefined which means to leave the existing content alone.

    Note that currently, the willUpdate and didUpdate events are triggered even when the zone is not actually updated. That may be a bug.

          unless content is undefined
            @update content
    
          @trigger events.initializeComponents
          @trigger events.zone.didUpdate
    
        dom.onDocument events.zone.refresh, (event) ->
  • ¶

    This event may be triggered on an element inside the zone, rather than on the zone itself. Scan upwards to find the actual zone.

          zone = @closest "[data-container-type=zone]"
  • ¶

    A Zone inside a form will render some additional parameters to coordinate updates with the Form on the server.

          attr = zone.attr "data-zone-parameters"
    
          parameters = attr and JSON.parse attr
    
          simpleIdParams = if zone.attr "data-simple-ids" then {"t:suppress-namespaced-ids": true}
    
          ajax event.memo.url,
            data: _.extend { "t:zoneid": zone.element.id }, simpleIdParams, parameters, event.memo.parameters
            success: (response) ->
              zone.trigger events.zone.update, content: response.json?.content
    
        dom.onDocument "click", "a[data-async-trigger]", (event)->
          link = @closest 'a[data-async-trigger]'
    
          link.addClass "ajax-update"
    
          ajax (link.attr "href"),
            complete: -> link.removeClass "ajax-update"
    
          event.nativeEvent.preventDefault()
    
          return
  • ¶

    Locates a zone element by its unique id attribute, and (deferred, to a later event loop cycle), performs a standard refresh of the zone. This is primarily used by the core/ProgressiveDisplay component.

    • id - client id of the element
    • url - URL to use to refresh the element.
        deferredZoneUpdate = (id, url) ->
    
          _.defer ->
            zone = dom id
    
            if zone is null
              console.error "Could not locate element '#{id}' to update."
              return
    
            zone.trigger events.zone.refresh, { url }
  • ¶

    Most of this module is document-level event handlers, but there’s also some exports:

        return { deferredZoneUpdate, findZone }