Templatize event handlers

googlearchive · Oct 23, 2013 · 8c7c655 · 8c7c655
1 parent 190083a
commit 8c7c655
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 13 deletions.
diff --git a/elements/td-input.html b/elements/td-input.html
@@ -1,4 +1,4 @@
-<polymer-element name="td-input" extends="input" on-keyup="keyupAction" on-keypress="keypressAction">
+<polymer-element name="td-input" extends="input" on-keyup="{{keyupAction}}" on-keypress="{{keypressAction}}">
 	<script>
 		(function() {
 			var ENTER_KEY = 13;

diff --git a/elements/td-item.html b/elements/td-item.html
@@ -1,13 +1,13 @@
 <link rel="import" href="td-input.html">
-<polymer-element name="td-item" extends="li" attributes="item editing" on-blur="commitAction">
+<polymer-element name="td-item" extends="li" attributes="item editing" on-blur="{{commitAction}}">
 	<template>
 		<link rel="stylesheet" href="td-item.css">
-		<div class="view {{completed: item.completed; editing: editing}}" hidden?="{{editing}}" on-dblclick="editAction">
-			<input type="checkbox" class="toggle" checked="{{item.completed}}" on-click="itemChangeAction">
+		<div class="view {{completed: item.completed; editing: editing}}" hidden?="{{editing}}" on-dblclick="{{editAction}}">
+			<input type="checkbox" class="toggle" checked="{{item.completed}}" on-click="{{itemChangeAction}}">
 			<label>{{item.title}}</label>
-			<button class="destroy" on-click="destroyAction"></button>
+			<button class="destroy" on-click="{{destroyAction}}"></button>
 		</div>
-		<input is="td-input" id="edit" class="edit" value="{{item.title}}" hidden?="{{!editing}}" on-td-input-commit="commitAction" on-td-input-cancel="cancelAction">
+		<input is="td-input" id="edit" class="edit" value="{{item.title}}" hidden?="{{!editing}}" on-td-input-commit="{{commitAction}}" on-td-input-cancel="{{cancelAction}}">
 	</template>
 	<script>
 		(function() {

diff --git a/elements/td-todos.html b/elements/td-todos.html
@@ -9,12 +9,12 @@
 		<flatiron-director route="{{route}}"></flatiron-director>
 		<section id="todoapp">
 			<header id="header">
-				<input is="td-input" id="new-todo" placeholder="What needs to be done?" autofocus on-td-input-commit="addTodoAction" on-td-input-cancel="cancelAddTodoAction">
+				<input is="td-input" id="new-todo" placeholder="What needs to be done?" autofocus on-td-input-commit="{{addTodoAction}}" on-td-input-cancel="{{cancelAddTodoAction}}">
 			</header>
 			<section id="main" hidden?="{{model.items.length == 0}}">
-				<input id="toggle-all" type="checkbox" on-change="toggleAllCompletedAction" checked="{{model.allCompleted}}">
+				<input id="toggle-all" type="checkbox" on-change="{{toggleAllCompletedAction}}" checked="{{model.allCompleted}}">
 				<label for="toggle-all">Mark all as complete</label>
-				<ul id="todo-list" on-td-item-changed="itemChangedAction" on-td-destroy-item="destroyItemAction">
+				<ul id="todo-list" on-td-item-changed="{{itemChangedAction}}" on-td-destroy-item="{{destroyItemAction}}">
 					<template repeat="{{model.filtered}}">
 						<li is="td-item" item="{{}}"></li>
 					</template>
@@ -33,7 +33,7 @@
 						<a href="../#/completed">Completed</a>
 					</li>
 				</polymer-selector>
-				<button hidden?="{{model.completedCount == 0}}" id="clear-completed" on-click="clearCompletedAction">Clear completed ({{model.completedCount}})</button>
+				<button hidden?="{{model.completedCount == 0}}" id="clear-completed" on-click="{{clearCompletedAction}}">Clear completed ({{model.completedCount}})</button>
 			</footer>
 		</section>
 	</template>

diff --git a/lib-elements/polymer-selector.html b/lib-elements/polymer-selector.html
@@ -15,7 +15,7 @@
  *
  * Example:
  *
- *     <polymer-selector selected="0" on-polymer-activate="activateAction">
+ *     <polymer-selector selected="0" on-polymer-activate="{{activateAction}}">
  *       <div>Item 1</div>
  *       <div>Item 2</div>
  *       <div>Item 3</div>
@@ -48,10 +48,10 @@
 -->
 <link rel="import" href="polymer-selection.html">
 
-<polymer-element name="polymer-selector" on-tap="activateHandler" touch-action="none"
+<polymer-element name="polymer-selector" on-tap="{{activateHandler}}" touch-action="none"
 		attributes="selected multi valueattr selectedClass setectedProperty selectedModel notap">
 	<template>
-		<polymer-selection id="selection" multi="{{multi}}" on-polymer-select="selectionSelect"></polymer-selection>
+		<polymer-selection id="selection" multi="{{multi}}" on-polymer-select="{{selectionSelect}}"></polymer-selection>
 		<content id="items" select="*"></content>
 	</template>
 	<script>