Author: jmorliaguet Date: Fri Feb 17 19:39:10 2006 New Revision: 2406 Modified: cpsskins/branches/jmo-perspectives/ui/framework/cpsskins.js cpsskins/branches/jmo-perspectives/ui/framework/tests/functional/behaviour/cpsskins_behaviour_test.html cpsskins/branches/jmo-perspectives/ui/framework/tests/functional/behaviour/template.html Log:
- fix: only elements that match the css selector must be observed (not the entire widget) - we bind more information to the event (subscriber, publisher, ...) - more pedagogical test example Modified: cpsskins/branches/jmo-perspectives/ui/framework/cpsskins.js ============================================================================== --- cpsskins/branches/jmo-perspectives/ui/framework/cpsskins.js (original) +++ cpsskins/branches/jmo-perspectives/ui/framework/cpsskins.js Fri Feb 17 19:39:10 2006 @@ -455,9 +455,6 @@ var rules = this.def.rules; CPSSkins.registerEventHandler("displayed", controller, function(event) { - var view = event.publisher; - var widget = view.widget; - $H(rules).each(function(r) { var selector = $$(r[0]); if (selector) { @@ -466,7 +463,7 @@ var handler_name = s[1]; var handler = CPSSkins.Handlers[handler_name]; selector.each(function(el) { - Event.observe(widget, event_name, handler); + Event.observe(el, event_name, handler.bind(event)); }); }) } Modified: cpsskins/branches/jmo-perspectives/ui/framework/tests/functional/behaviour/cpsskins_behaviour_test.html ============================================================================== --- cpsskins/branches/jmo-perspectives/ui/framework/tests/functional/behaviour/cpsskins_behaviour_test.html (original) +++ cpsskins/branches/jmo-perspectives/ui/framework/tests/functional/behaviour/cpsskins_behaviour_test.html Fri Feb 17 19:39:10 2006 @@ -11,12 +11,44 @@ <script src="../../../cpsskins.js" type="text/javascript"></script> <link rel="stylesheet" href="../../../cpsskins.css" type="text/css" /> + <style type="text/css"> + #item1 { + background-color: #efc; + border: 1px solid #ccc; + padding: 0.2em; + margin: 2em; + cursor: pointer; + } + div.area { + margin: 3em; + } + div.area span { + padding: 1em; + border: 1px solid #ccc; + } + </style> + <script type="text/javascript"> function sayHello(event) { - alert('Hello!'); + var target = Event.element(event); + target.innerHTML = 'Hello!'; + } + + function focusArea(event) { + var target = Event.element(event); + Element.setStyle(target, {'background-color': '#ffc'}); + } + + function unfocusArea(event) { + var target = Event.element(event); + Element.setStyle(target, {'background-color': null}); } - CPSSkins.registerHandlers({'say-hello': sayHello}); + CPSSkins.registerHandlers( + {'say-hello': sayHello, + 'focus-area': focusArea, + 'unfocus-area': unfocusArea + }); </script> @@ -33,6 +65,10 @@ "rules": { "#item1": { "click": "say-hello" + }, + "div.area span": { + "mouseover": "focus-area", + "mouseout": "unfocus-area" } }} </ins> Modified: cpsskins/branches/jmo-perspectives/ui/framework/tests/functional/behaviour/template.html ============================================================================== --- cpsskins/branches/jmo-perspectives/ui/framework/tests/functional/behaviour/template.html (original) +++ cpsskins/branches/jmo-perspectives/ui/framework/tests/functional/behaviour/template.html Fri Feb 17 19:39:10 2006 @@ -3,3 +3,7 @@ <li><span id="item1">Click me</span></li> </ul> + <div class="area"> + <span>Mouse over area</span> + </div> + -- http://lists.nuxeo.com/mailman/listinfo/z3lab-checkins