You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@tapestry.apache.org by hl...@apache.org on 2012/08/09 00:04:54 UTC
[2/2] git commit: More rework of the Zone component's client-side
behavior - remove support for the nested .t-zone-update element - move most
of the update logic into top-level event handlers - change
Tapestry.ZoneManager to trigger events rather than do
More rework of the Zone component's client-side behavior
- remove support for the nested .t-zone-update element
- move most of the update logic into top-level event handlers
- change Tapestry.ZoneManager to trigger events rather than do the work
Project: http://git-wip-us.apache.org/repos/asf/tapestry-5/repo
Commit: http://git-wip-us.apache.org/repos/asf/tapestry-5/commit/88045f09
Tree: http://git-wip-us.apache.org/repos/asf/tapestry-5/tree/88045f09
Diff: http://git-wip-us.apache.org/repos/asf/tapestry-5/diff/88045f09
Branch: refs/heads/5.4-js-rewrite
Commit: 88045f098a01ddca50b6435c09231944f7833138
Parents: c562186
Author: Howard M. Lewis Ship <hl...@apache.org>
Authored: Tue Aug 7 11:27:47 2012 -0700
Committer: Howard M. Lewis Ship <hl...@apache.org>
Committed: Tue Aug 7 11:27:47 2012 -0700
----------------------------------------------------------------------
54_RELEASE_NOTES.txt | 7 ++-
.../META-INF/modules/core/events.coffee | 30 ++++++++
.../coffeescript/META-INF/modules/core/spi.coffee | 54 +++++++++------
.../coffeescript/META-INF/modules/core/zone.coffee | 35 +++++++++
.../resources/org/apache/tapestry5/tapestry.js | 38 ++--------
5 files changed, 111 insertions(+), 53 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/88045f09/54_RELEASE_NOTES.txt
----------------------------------------------------------------------
diff --git a/54_RELEASE_NOTES.txt b/54_RELEASE_NOTES.txt
index b6a7d59..463011b 100644
--- a/54_RELEASE_NOTES.txt
+++ b/54_RELEASE_NOTES.txt
@@ -12,7 +12,12 @@ attach properties to the global JavaScript window object, rather than assume tha
The interface org.apache.tapestry5.services.assets.ResourceTransformer has had a new method added:
getTransformedContentType().
-Minor changes to Tapestry.ElementEffects.
+Older versions of Tapestry included client-side support for an element with the CSS class "t-zone-update" as the actual
+element to be updated when new content is provided for the zone in a partial page render response. This feature
+has been removed with no replacement.
+
+Minor changes to Tapestry.ElementEffects. Despite the names of the properties (kept for compatibility), all "effects"
+are now simply make the element appear or hide, with no animation.
Tapestry code no longer makes use of Scriptaculous. Instead, Tapestry will fire events on elements, and user code
may decide to animate them using whatever library is desired.
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/88045f09/tapestry-core/src/main/coffeescript/META-INF/modules/core/events.coffee
----------------------------------------------------------------------
diff --git a/tapestry-core/src/main/coffeescript/META-INF/modules/core/events.coffee b/tapestry-core/src/main/coffeescript/META-INF/modules/core/events.coffee
new file mode 100644
index 0000000..15993d7
--- /dev/null
+++ b/tapestry-core/src/main/coffeescript/META-INF/modules/core/events.coffee
@@ -0,0 +1,30 @@
+# Copyright 2012 The Apache Software Foundation
+#
+# 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.
+
+# This module defines logical names for all events that Tapestry-controlled elements
+# trigger or listener for. Prototype requires that all custom events have a namespace prefix; jQuery appears to
+# allow it without issue.
+define [], ->
+ zone: # Invoked on a zone element to force an update to its content. The event memo is the
+ # new content (an Element, or a string containing HTML markup). A top-level handler
+ # is responsible for the actual update; it fires an event on the element just before,
+ # and just after, the content is changed.
+ update: "t5:zone-update"
+
+ # Triggered just before the content in a Zone will be updated.
+ willUpdate: "t5:zone-will-update"
+
+ # Triggered just afer the content in a Zone has updated. If the zone was not visible,
+ # it is made visible after its content is changed, and before this event is triggered.
+ didUpdate: "t5:zone-did-update"
\ No newline at end of file
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/88045f09/tapestry-core/src/main/coffeescript/META-INF/modules/core/spi.coffee
----------------------------------------------------------------------
diff --git a/tapestry-core/src/main/coffeescript/META-INF/modules/core/spi.coffee b/tapestry-core/src/main/coffeescript/META-INF/modules/core/spi.coffee
index ba008a3..ff40b3e 100644
--- a/tapestry-core/src/main/coffeescript/META-INF/modules/core/spi.coffee
+++ b/tapestry-core/src/main/coffeescript/META-INF/modules/core/spi.coffee
@@ -20,15 +20,17 @@
# TODO: Define a dependency on "prototype" when that's exposed as a stub module.
define ["_"], (_) ->
-
split = (str) ->
_(str.split " ").reject (s) -> s is ""
# Generic view of an Event that is passed to a handler function.
- #
+ # Properties:
+ # memo - the object passed to ElementWrapper.trigger()
+ # stop() - function to prevent propogation of the event (both bubbling and the default action).
class Event
constructor: (@prototypeEvent) ->
+ @memo = @prototypeEvent.memo
# Stops the event which prevents further propagation of the event,
# as well as event bubbling.
@@ -39,12 +41,13 @@ define ["_"], (_) ->
# events, or even pause listening.
class EventHandler
- # Registers the handler as an event listener for matching elements and event names.
- # elements - array of DOM elements
- # eventNames - array of event names
- # match - selector to match bubbled elements, or null
- # handler - event handler function to invoke; it will be passed an Event instance
+ # Registers the handler as an event listener for matching elements and event names.
+ # elements - array of DOM elements
+ # eventNames - array of event names
+ # match - selector to match bubbled elements, or null
+ # handler - event handler function to invoke; it will be passed an Event instance
constructor: (elements, eventNames, match, handler) ->
+ throw new Error("No event handler was provided.") unless handler?
wrapped = (prototypeEvent, matchedElement) ->
# Set "this" to be the matched element (jQuery style), rather than
@@ -55,19 +58,17 @@ define ["_"], (_) ->
@protoHandlers = []
_.each elements, (element) =>
- _.each eventName, (eventName) =>
- @protoHandlers.push element.on event, match, wrapped
-
- # Invoked after stop() to restart event listening. Returns this EventHandler instance.
- start: ->
+ _.each eventNames, (eventName) =>
+ @protoHandlers.push element.on eventName, match, wrapped
- _.each @protoHandlers, (h) -> h.start()
+ # Invoked after stop() to restart event listening. Returns this EventHandler instance.
+ start: ->
+ _.each @protoHandlers, (h) -> h.start()
- this
+ this
# Invoked to stop or pause event listening. Returns this EventHandler instance.
stop: ->
-
_.each @protoHandlers, (h) -> h.stop()
this
@@ -77,7 +78,6 @@ define ["_"], (_) ->
class ElementWrapper
constructor: (element) ->
-
@element = $(element)
# Hides the wrapped element, setting its display to 'none'. Returns this ElementWrapper.
@@ -148,8 +148,12 @@ define ["_"], (_) ->
@element.visible()
# Fires a named event. Returns this ElementWrapper.
- trigger: (eventName) ->
- @element.fire eventName
+ # eventName - name of event to trigger on the wrapped Element
+ # memo - optional value assocated with the event; available as Event.memo in event handler functions
+ trigger: (eventName, memo) ->
+ throw new Error("Attempt to trigger event with null event name") unless eventName?
+
+ @element.fire eventName, memo
this
# Adds an event handler for one or more events.
@@ -181,6 +185,14 @@ define ["_"], (_) ->
exports =
+ # Invokes the callback only once the DOM has finished loading all elements (other resources, such as images,
+ # may still be in-transit). This is a safe time to search the DOM, modify attributes, and attach event handlers.
+ # Returns this modules exports, for chained calls.
+ domReady: (callback) ->
+ document.observe "dom:loaded", callback
+
+ exports
+
# on() is used to add an event handler
# selector - CSS selector used to select elements to attach handler to; alternately,
# a single DOM element, or an array of DOM elements
@@ -191,18 +203,18 @@ define ["_"], (_) ->
# handler - function invoked; the function is passed an Event object.
# Returns an EventHandler object, making it possible to turn event observation on or off.
on: (selector, events, match, handler) ->
-
- if handler is null
+ unless handler?
handler = match
match = null
elements = parseSelectorToElements selector
- return new EventHandler(elements, split events, match, handler)
+ return new EventHandler(elements, (split events), match, handler)
# Returns a wrapper for the provided DOM element that includes key behaviors:
# hide(), show(), remove(), etc.
# element - a DOM element, or the unique id of a DOM element
# Returns the ElementWrapper.
wrap: (element) ->
+ throw new Error("Attempt to wrap a null DOM element") unless element
new ElementWrapper element
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/88045f09/tapestry-core/src/main/coffeescript/META-INF/modules/core/zone.coffee
----------------------------------------------------------------------
diff --git a/tapestry-core/src/main/coffeescript/META-INF/modules/core/zone.coffee b/tapestry-core/src/main/coffeescript/META-INF/modules/core/zone.coffee
new file mode 100644
index 0000000..8986cef
--- /dev/null
+++ b/tapestry-core/src/main/coffeescript/META-INF/modules/core/zone.coffee
@@ -0,0 +1,35 @@
+# Copyright 2012 The Apache Software Foundation
+#
+# 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.
+
+define ["core/spi", "core/events"],
+ (spi, events) ->
+ spi.domReady ->
+ body = spi.wrap document.body
+
+ body.on events.zone.update, (event) ->
+ zone = spi.wrap this
+
+ zone.trigger events.zone.willUpdate
+
+ # TODO: purge existing children?
+
+ zone.update event.memo
+
+ zone.show() unless zone.visible()
+
+ zone.trigger events.zone.didUpdate
+
+
+ # No meaningful value is returned.
+ true
\ No newline at end of file
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/88045f09/tapestry-core/src/main/resources/org/apache/tapestry5/tapestry.js
----------------------------------------------------------------------
diff --git a/tapestry-core/src/main/resources/org/apache/tapestry5/tapestry.js b/tapestry-core/src/main/resources/org/apache/tapestry5/tapestry.js
index 3ff3a32..c9cc2cd 100644
--- a/tapestry-core/src/main/resources/org/apache/tapestry5/tapestry.js
+++ b/tapestry-core/src/main/resources/org/apache/tapestry5/tapestry.js
@@ -16,10 +16,12 @@
define("core/compat/tapestry", [
"_",
"core/spi",
+ "core/events",
+ "core/zone",
"core/compat/t5-dom",
"core/compat/t5-console",
"core/compat/t5-init",
- "core/compat/t5-ajax"], function (_, spi) {
+ "core/compat/t5-ajax"], function (_, spi, events) {
window.Tapestry = {
@@ -70,7 +72,7 @@ define("core/compat/tapestry", [
FOCUS_CHANGE_EVENT: "tapestry:focuschange",
/** Event, triggered on a zone element after the zone's content has been updated. */
- ZONE_UPDATED_EVENT: "tapestry:zoneupdated",
+ ZONE_UPDATED_EVENT: events.zone.didUpdate,
/**
* Event fired on a form fragment element to change the visibility of the
@@ -1766,7 +1768,7 @@ define("core/compat/tapestry", [
Tapestry.ZoneManager = Class.create({
/*
* spec are the parameters for the Zone: trigger:
- * spec.element -- no or instance of div element
+ * spec.element -- id or instance of div element
* spec.parameters -- additional parameters (related to Zones nested inside Forms) (optional)
* Prior releases included spec.hide and spec.show (to control animations) but these have been
* deprecated.
@@ -1774,29 +1776,13 @@ define("core/compat/tapestry", [
initialize: function (spec) {
this.elementId = spec.element;
- // When updates arrive, the outer element is always made visible.=
+ // When updates arrive, the outer element is always made visible.
this.element = spi.wrap(spec.element);
this.specParameters = spec.parameters;
/* Link the div back to this zone. */
$T(this.element.element).zoneManager = this;
-
- // TODO: This is likely to go next:
-
- /*
- * Look inside the managed element for another element with the CSS
- * class "t-zone-update". If present, then this is the element whose
- * content will be changed, rather then the entire zone's element. This
- * allows a Zone element to contain "wrapper" markup (borders and such).
- * Typically, such a Zone element will initially be invisible. The show
- * and update functions apply to the Zone element, not the update
- * element.
- */
- var updates = this.element.find(".t-zone-update");
-
- this.updateElement =
- _.isEmpty(updates) ? this.element : spi.wrap(updates[0]);
},
/**
@@ -1808,17 +1794,7 @@ define("core/compat/tapestry", [
* @param content
*/
show: function (content) {
-
- // Purging may go into spi.ElementWrapper
- T5.dom.purgeChildren(this.updateElement);
-
- this.updateElement.update(content);
-
- if (!this.element.visible()) {
- this.element.show();
- }
-
- this.element.trigger(Tapestry.ZONE_UPDATED_EVENT);
+ this.element.trigger(events.zone.update, content);
},
/**