gesture binding fixed + test

Vladimir Enchev · Vladimir Enchev · commit 384ba394e738 · 2015-08-11T16:31:30.000+03:00
diff --git a/CrossPlatformModules.csproj b/CrossPlatformModules.csproj
@@ -146,6 +146,7 @@
     <TypeScriptCompile Include="apps\tests\ui\animation\animation-tests.ts" />
     <TypeScriptCompile Include="apps\tests\xml-declaration\inherited-base-page.ts" />
     <TypeScriptCompile Include="apps\tests\xml-declaration\inherited-page.ts" />
+    <TypeScriptCompile Include="apps\ui-tests-app\pages\gesture-binding.ts" />
     <TypeScriptCompile Include="ui\animation\animation.d.ts" />
     <TypeScriptCompile Include="ui\animation\animation-common.ts">
       <DependentUpon>animation.d.ts</DependentUpon>
@@ -934,6 +935,7 @@
     <Content Include="apps\ui-tests-app\layouts\wrap.xml" />
     <Content Include="apps\ui-tests-app\pages\background.xml" />
     <Content Include="apps\ui-tests-app\pages\circle.xml" />
+    <Content Include="apps\ui-tests-app\pages\gesture-binding.xml" />
     <Content Include="apps\ui-tests-app\pages\i86.xml" />
     <Content Include="apps\template-blank\app.css" />
     <Content Include="apps\template-hello-world\app.css" />
diff --git a/apps/ui-tests-app/pages/gesture-binding.ts b/apps/ui-tests-app/pages/gesture-binding.ts
@@ -0,0 +1,16 @@
+import observable = require("data/observable");
+import gestures = require("ui/gestures");
+import pages = require("ui/page");
+
+export function pageLoaded(args: observable.EventData) {
+    var page = <pages.Page>args.object;
+    page.bindingContext = { tapAction: tapAction, doubleTapAction: doubleTapAction };
+}
+
+export function tapAction(args: gestures.GestureEventData) {
+    console.log("tapAction")
+}
+
+export function doubleTapAction(args: gestures.GestureEventData) {
+    console.log("doubleTapAction")
+}
diff --git a/apps/ui-tests-app/pages/gesture-binding.xml b/apps/ui-tests-app/pages/gesture-binding.xml
@@ -0,0 +1,6 @@
+<Page loaded="pageLoaded">
+  <StackLayout>
+    <Label text="Handlers as exports" tap="tapAction" doubleTap="doubleTapAction" />
+    <Label text="Bound handlers" tap="{{ tapAction }}" doubleTap="{{ doubleTapAction }}" />
+  </StackLayout>
+</Page>
diff --git a/ui/builder/component-builder.ts b/ui/builder/component-builder.ts
@@ -30,6 +30,8 @@ var DOCK = "dock";
 var LEFT = "left";
 var TOP = "top";
 
+var eventHandlers, gestureHandlers = {};
+
 export function getComponentModule(elementName: string, namespace: string, attributes: Object, exports: Object): definition.ComponentModule {
     var instance: view.View;
     var instanceModule: Object;
@@ -103,6 +105,8 @@ export function getComponentModule(elementName: string, namespace: string, attri
             }
         }
 
+        eventHandlers, gestureHandlers = {};
+
         componentModule = { component: instance, exports: instanceModule, bindings: bindings };
     }
 
@@ -180,34 +184,34 @@ export function setPropertyValue(instance: view.View, instanceModule: Object, ex
 
 function attachEventBinding(instance: view.View, eventName: string, value: string) {
     // Get the event handler from instance.bindingContext.
-    var propertyChangeHandler = (args: observable.PropertyChangeData) => {
+    eventHandlers[eventName] = (args: observable.PropertyChangeData) => {
         if (args.propertyName === "bindingContext") {
             var handler = instance.bindingContext && instance.bindingContext[getBindingExpressionFromAttribute(value)];
             // Check if the handler is function and add it to the instance for specified event name.
             if (types.isFunction(handler)) {
                 instance.on(eventName, handler, instance.bindingContext);
             }
-            instance.off(observable.Observable.propertyChangeEvent, propertyChangeHandler);
+            instance.off(observable.Observable.propertyChangeEvent, eventHandlers[eventName]);
         }
     };
 
-    instance.on(observable.Observable.propertyChangeEvent, propertyChangeHandler);
+    instance.on(observable.Observable.propertyChangeEvent, eventHandlers[eventName]);
 }
 
 function attachGestureBinding(instance: view.View, gestureName: string, value: string) {
     // Get the event handler from instance.bindingContext.
-    var propertyChangeHandler = (args: observable.PropertyChangeData) => {
+    gestureHandlers[gestureName] = (args: observable.PropertyChangeData) => {
         if (args.propertyName === "bindingContext") {
             var handler = instance.bindingContext && instance.bindingContext[getBindingExpressionFromAttribute(value)];
             // Check if the handler is function and add it to the instance for specified event name.
             if (types.isFunction(handler)) {
                 instance.observe(gestures.fromString(gestureName.toLowerCase()), handler, instance.bindingContext);
             }
-            instance.off(observable.Observable.propertyChangeEvent, propertyChangeHandler);
+            instance.off(observable.Observable.propertyChangeEvent, gestureHandlers[gestureName]);
         }
     };
 
-    instance.on(observable.Observable.propertyChangeEvent, propertyChangeHandler);
+    instance.on(observable.Observable.propertyChangeEvent, gestureHandlers[gestureName]);
 }
 
 function isGesture(name: string, instance: any): boolean {

Original file line number	Diff line number	Diff line change
`@@ -30,6 +30,8 @@ var DOCK = "dock";`
`30`	`30`	`var LEFT = "left";`
`31`	`31`	`var TOP = "top";`
`32`	`32`
	`33`	`+var eventHandlers, gestureHandlers = {};`
	`34`	`+`
`33`	`35`	`export function getComponentModule(elementName: string, namespace: string, attributes: Object, exports: Object): definition.ComponentModule {`
`34`	`36`	`var instance: view.View;`
`35`	`37`	`var instanceModule: Object;`
`@@ -103,6 +105,8 @@ export function getComponentModule(elementName: string, namespace: string, attri`
`103`	`105`	`}`
`104`	`106`	`}`
`105`	`107`
	`108`	`+ eventHandlers, gestureHandlers = {};`
	`109`	`+`
`106`	`110`	`componentModule = { component: instance, exports: instanceModule, bindings: bindings };`
`107`	`111`	`}`
`108`	`112`
`@@ -180,34 +184,34 @@ export function setPropertyValue(instance: view.View, instanceModule: Object, ex`
`180`	`184`
`181`	`185`	`function attachEventBinding(instance: view.View, eventName: string, value: string) {`
`182`	`186`	`// Get the event handler from instance.bindingContext.`
`183`		`- var propertyChangeHandler = (args: observable.PropertyChangeData) => {`
	`187`	`+ eventHandlers[eventName] = (args: observable.PropertyChangeData) => {`
`184`	`188`	`if (args.propertyName === "bindingContext") {`
`185`	`189`	`var handler = instance.bindingContext && instance.bindingContext[getBindingExpressionFromAttribute(value)];`
`186`	`190`	`// Check if the handler is function and add it to the instance for specified event name.`
`187`	`191`	`if (types.isFunction(handler)) {`
`188`	`192`	`instance.on(eventName, handler, instance.bindingContext);`
`189`	`193`	`}`
`190`		`- instance.off(observable.Observable.propertyChangeEvent, propertyChangeHandler);`
	`194`	`+ instance.off(observable.Observable.propertyChangeEvent, eventHandlers[eventName]);`
`191`	`195`	`}`
`192`	`196`	`};`
`193`	`197`
`194`		`- instance.on(observable.Observable.propertyChangeEvent, propertyChangeHandler);`
	`198`	`+ instance.on(observable.Observable.propertyChangeEvent, eventHandlers[eventName]);`
`195`	`199`	`}`
`196`	`200`
`197`	`201`	`function attachGestureBinding(instance: view.View, gestureName: string, value: string) {`
`198`	`202`	`// Get the event handler from instance.bindingContext.`
`199`		`- var propertyChangeHandler = (args: observable.PropertyChangeData) => {`
	`203`	`+ gestureHandlers[gestureName] = (args: observable.PropertyChangeData) => {`
`200`	`204`	`if (args.propertyName === "bindingContext") {`
`201`	`205`	`var handler = instance.bindingContext && instance.bindingContext[getBindingExpressionFromAttribute(value)];`
`202`	`206`	`// Check if the handler is function and add it to the instance for specified event name.`
`203`	`207`	`if (types.isFunction(handler)) {`
`204`	`208`	`instance.observe(gestures.fromString(gestureName.toLowerCase()), handler, instance.bindingContext);`
`205`	`209`	`}`
`206`		`- instance.off(observable.Observable.propertyChangeEvent, propertyChangeHandler);`
	`210`	`+ instance.off(observable.Observable.propertyChangeEvent, gestureHandlers[gestureName]);`
`207`	`211`	`}`
`208`	`212`	`};`
`209`	`213`
`210`		`- instance.on(observable.Observable.propertyChangeEvent, propertyChangeHandler);`
	`214`	`+ instance.on(observable.Observable.propertyChangeEvent, gestureHandlers[gestureName]);`
`211`	`215`	`}`
`212`	`216`
`213`	`217`	`function isGesture(name: string, instance: any): boolean {`