| Index: src/diagrams/tutorials/polymer/click-handler.graffle/data.plist | 
| diff --git a/src/diagrams/tutorials/web-ui/little-ben-dart.graffle/data.plist b/src/diagrams/tutorials/polymer/click-handler.graffle/data.plist | 
| similarity index 75% | 
| copy from src/diagrams/tutorials/web-ui/little-ben-dart.graffle/data.plist | 
| copy to src/diagrams/tutorials/polymer/click-handler.graffle/data.plist | 
| index 40c298f2917a34aca1310163ce08319945e75119..79f6cc39669d6d26c79872f5ce50b87d6013a288 100644 | 
| --- a/src/diagrams/tutorials/web-ui/little-ben-dart.graffle/data.plist | 
| +++ b/src/diagrams/tutorials/polymer/click-handler.graffle/data.plist | 
| @@ -7,7 +7,7 @@ | 
| <key>ApplicationVersion</key> | 
| <array> | 
| <string>com.omnigroup.OmniGrafflePro</string> | 
| -		<string>139.16.0.171715</string> | 
| +		<string>139.18.0.187838</string> | 
| </array> | 
| <key>AutoAdjust</key> | 
| <true/> | 
| @@ -42,7 +42,7 @@ | 
| <key>ColumnSpacing</key> | 
| <real>36</real> | 
| <key>CreationDate</key> | 
| -	<string>2012-12-11 21:18:24 +0000</string> | 
| +	<string>2013-09-18 21:29:51 +0000</string> | 
| <key>Creator</key> | 
| <string>Mary Campione</string> | 
| <key>DisplayScale</key> | 
| @@ -53,144 +53,7 @@ | 
| <array> | 
| <dict> | 
| <key>Bounds</key> | 
| -			<string>{{414.44741114783801, 243.25000286102295}, {54, 21}}</string> | 
| -			<key>Class</key> | 
| -			<string>ShapedGraphic</string> | 
| -			<key>ID</key> | 
| -			<integer>34147</integer> | 
| -			<key>Magnets</key> | 
| -			<array> | 
| -				<string>{-0.064044943820224631, 0}</string> | 
| -			</array> | 
| -			<key>Shape</key> | 
| -			<string>Rectangle</string> | 
| -			<key>Style</key> | 
| -			<dict> | 
| -				<key>fill</key> | 
| -				<dict> | 
| -					<key>Color</key> | 
| -					<dict> | 
| -						<key>a</key> | 
| -						<string>0.39</string> | 
| -						<key>b</key> | 
| -						<string>0.160477</string> | 
| -						<key>g</key> | 
| -						<string>0.655234</string> | 
| -						<key>r</key> | 
| -						<string>1</string> | 
| -					</dict> | 
| -				</dict> | 
| -				<key>shadow</key> | 
| -				<dict> | 
| -					<key>Draws</key> | 
| -					<string>NO</string> | 
| -				</dict> | 
| -				<key>stroke</key> | 
| -				<dict> | 
| -					<key>Draws</key> | 
| -					<string>NO</string> | 
| -				</dict> | 
| -			</dict> | 
| -		</dict> | 
| -		<dict> | 
| -			<key>Class</key> | 
| -			<string>LineGraphic</string> | 
| -			<key>Head</key> | 
| -			<dict> | 
| -				<key>ID</key> | 
| -				<integer>34145</integer> | 
| -			</dict> | 
| -			<key>ID</key> | 
| -			<integer>34149</integer> | 
| -			<key>Points</key> | 
| -			<array> | 
| -				<string>{262.8878377336971, 172}</string> | 
| -				<string>{102.2965768098519, 334}</string> | 
| -			</array> | 
| -			<key>Style</key> | 
| -			<dict> | 
| -				<key>stroke</key> | 
| -				<dict> | 
| -					<key>HeadArrow</key> | 
| -					<string>0</string> | 
| -					<key>Legacy</key> | 
| -					<true/> | 
| -					<key>TailArrow</key> | 
| -					<string>FilledArrow</string> | 
| -				</dict> | 
| -			</dict> | 
| -			<key>Tail</key> | 
| -			<dict> | 
| -				<key>ID</key> | 
| -				<integer>34141</integer> | 
| -			</dict> | 
| -		</dict> | 
| -		<dict> | 
| -			<key>Class</key> | 
| -			<string>LineGraphic</string> | 
| -			<key>Head</key> | 
| -			<dict> | 
| -				<key>ID</key> | 
| -				<integer>34147</integer> | 
| -			</dict> | 
| -			<key>ID</key> | 
| -			<integer>34148</integer> | 
| -			<key>Points</key> | 
| -			<array> | 
| -				<string>{283.09044896569822, 172}</string> | 
| -				<string>{418.09376017120087, 243.25000286102295}</string> | 
| -			</array> | 
| -			<key>Style</key> | 
| -			<dict> | 
| -				<key>stroke</key> | 
| -				<dict> | 
| -					<key>HeadArrow</key> | 
| -					<string>FilledArrow</string> | 
| -					<key>Legacy</key> | 
| -					<true/> | 
| -					<key>TailArrow</key> | 
| -					<string>0</string> | 
| -				</dict> | 
| -			</dict> | 
| -			<key>Tail</key> | 
| -			<dict> | 
| -				<key>ID</key> | 
| -				<integer>34141</integer> | 
| -			</dict> | 
| -		</dict> | 
| -		<dict> | 
| -			<key>Bounds</key> | 
| -			<string>{{256, 182.2500057220459}, {320, 120}}</string> | 
| -			<key>Class</key> | 
| -			<string>ShapedGraphic</string> | 
| -			<key>ID</key> | 
| -			<integer>34170</integer> | 
| -			<key>ImageID</key> | 
| -			<integer>3</integer> | 
| -			<key>Shape</key> | 
| -			<string>Rectangle</string> | 
| -			<key>Style</key> | 
| -			<dict> | 
| -				<key>fill</key> | 
| -				<dict> | 
| -					<key>Draws</key> | 
| -					<string>NO</string> | 
| -				</dict> | 
| -				<key>shadow</key> | 
| -				<dict> | 
| -					<key>Draws</key> | 
| -					<string>NO</string> | 
| -				</dict> | 
| -				<key>stroke</key> | 
| -				<dict> | 
| -					<key>Draws</key> | 
| -					<string>NO</string> | 
| -				</dict> | 
| -			</dict> | 
| -		</dict> | 
| -		<dict> | 
| -			<key>Bounds</key> | 
| -			<string>{{13, 38}, {211, 22}}</string> | 
| +			<string>{{13, 441.5}, {221, 22}}</string> | 
| <key>Class</key> | 
| <string>ShapedGraphic</string> | 
| <key>FitText</key> | 
| @@ -242,12 +105,12 @@ | 
| <key>Pad</key> | 
| <integer>2</integer> | 
| <key>Text</key> | 
| -				<string>{\rtf1\ansi\ansicpg1252\cocoartf1187\cocoasubrtf370 | 
| +				<string>{\rtf1\ansi\ansicpg1252\cocoartf1187\cocoasubrtf390 | 
| \cocoascreenfonts1{\fonttbl\f0\fnil\fcharset0 HelveticaNeue;} | 
| {\colortbl;\red255\green255\blue255;\red128\green0\blue0;} | 
| \pard\tx560\tx1120\tx1680\tx2240\tx2800\tx3360\tx3920\tx4480\tx5040\tx5600\tx6160\tx6720\pardirnatural | 
|  | 
| -\f0\i\b\fs28 \cf2 Uses little-ben-screenshot.png}</string> | 
| +\f0\i\b\fs28 \cf2 Uses stopwatch-screenshot.png}</string> | 
| <key>VerticalPad</key> | 
| <integer>2</integer> | 
| </dict> | 
| @@ -256,7 +119,7 @@ | 
| </dict> | 
| <dict> | 
| <key>Bounds</key> | 
| -			<string>{{7, 10}, {347, 22}}</string> | 
| +			<string>{{13, 419.5}, {348, 22}}</string> | 
| <key>Class</key> | 
| <string>ShapedGraphic</string> | 
| <key>FitText</key> | 
| @@ -280,7 +143,7 @@ | 
| <real>14</real> | 
| </dict> | 
| <key>ID</key> | 
| -			<integer>34169</integer> | 
| +			<integer>63</integer> | 
| <key>Shape</key> | 
| <string>Rectangle</string> | 
| <key>Style</key> | 
| @@ -308,12 +171,12 @@ | 
| <key>Pad</key> | 
| <integer>2</integer> | 
| <key>Text</key> | 
| -				<string>{\rtf1\ansi\ansicpg1252\cocoartf1187\cocoasubrtf370 | 
| +				<string>{\rtf1\ansi\ansicpg1252\cocoartf1187\cocoasubrtf390 | 
| \cocoascreenfonts1{\fonttbl\f0\fnil\fcharset0 HelveticaNeue;} | 
| {\colortbl;\red255\green255\blue255;\red128\green0\blue0;} | 
| \pard\tx560\tx1120\tx1680\tx2240\tx2800\tx3360\tx3920\tx4480\tx5040\tx5600\tx6160\tx6720\pardirnatural | 
|  | 
| -\f0\i\b\fs28 \cf2 Save to $tutorial/web-ui/images/little-ben-dart.png}</string> | 
| +\f0\i\b\fs28 \cf2 Save to $tutorial/polymer/images/click-handler.png}</string> | 
| <key>VerticalPad</key> | 
| <integer>2</integer> | 
| </dict> | 
| @@ -322,22 +185,15 @@ | 
| </dict> | 
| <dict> | 
| <key>Bounds</key> | 
| -			<string>{{19, 269.25}, {83, 20}}</string> | 
| +			<string>{{65, 249}, {414, 122}}</string> | 
| <key>Class</key> | 
| <string>ShapedGraphic</string> | 
| <key>FitText</key> | 
| <string>YES</string> | 
| <key>Flow</key> | 
| <string>Resize</string> | 
| -			<key>FontInfo</key> | 
| -			<dict> | 
| -				<key>Font</key> | 
| -				<string>HelveticaNeue-Bold</string> | 
| -				<key>Size</key> | 
| -				<real>13</real> | 
| -			</dict> | 
| <key>ID</key> | 
| -			<integer>34152</integer> | 
| +			<integer>34180</integer> | 
| <key>Shape</key> | 
| <string>Rectangle</string> | 
| <key>Style</key> | 
| @@ -354,47 +210,43 @@ | 
| </dict> | 
| <key>stroke</key> | 
| <dict> | 
| -					<key>Draws</key> | 
| -					<string>NO</string> | 
| +					<key>CornerRadius</key> | 
| +					<real>7</real> | 
| </dict> | 
| </dict> | 
| <key>Text</key> | 
| <dict> | 
| <key>Align</key> | 
| <integer>0</integer> | 
| -				<key>Pad</key> | 
| -				<integer>2</integer> | 
| <key>Text</key> | 
| -				<string>{\rtf1\ansi\ansicpg1252\cocoartf1187\cocoasubrtf370 | 
| -\cocoascreenfonts1{\fonttbl\f0\fnil\fcharset0 HelveticaNeue;} | 
| +				<string>{\rtf1\ansi\ansicpg1252\cocoartf1187\cocoasubrtf390 | 
| +\cocoascreenfonts1{\fonttbl\f0\fmodern\fcharset0 CourierNewPSMT;} | 
| {\colortbl;\red255\green255\blue255;} | 
| -\pard\tx560\tx1120\tx1680\tx2240\tx2800\tx3360\tx3920\tx4480\tx5040\tx5600\tx6160\tx6720\pardirnatural | 
| +\deftab720 | 
| +\pard\pardeftab720 | 
|  | 
| -\f0\b\fs26 \cf0 littleben.dart}</string> | 
| -				<key>VerticalPad</key> | 
| -				<integer>2</integer> | 
| +\f0\fs24 \cf0 void start(Event e, var detail, Node target) \{\ | 
| +    mywatch.start();\ | 
| +    var oneSecond = new Duration(seconds:1);\ | 
| +    mytimer = new Timer.periodic(oneSecond, updateTime);\ | 
| +    startButton.disabled = true;\ | 
| +    stopButton.disabled = false;\ | 
| +    resetButton.disabled = true;\ | 
| +\pard\tx560\tx1120\tx1680\tx2240\tx2800\tx3360\tx3920\tx4480\tx5040\tx5600\tx6160\tx6720\pardeftab720\pardirnatural | 
| +\cf0 \}}</string> | 
| </dict> | 
| <key>Wrap</key> | 
| <string>NO</string> | 
| </dict> | 
| <dict> | 
| <key>Bounds</key> | 
| -			<string>{{13, 66}, {85, 20}}</string> | 
| +			<string>{{366, 181}, {40.754718780517578, 48}}</string> | 
| <key>Class</key> | 
| <string>ShapedGraphic</string> | 
| -			<key>FitText</key> | 
| -			<string>YES</string> | 
| -			<key>Flow</key> | 
| -			<string>Resize</string> | 
| -			<key>FontInfo</key> | 
| -			<dict> | 
| -				<key>Font</key> | 
| -				<string>HelveticaNeue-Bold</string> | 
| -				<key>Size</key> | 
| -				<real>13</real> | 
| -			</dict> | 
| <key>ID</key> | 
| -			<integer>34151</integer> | 
| +			<integer>34187</integer> | 
| +			<key>ImageID</key> | 
| +			<integer>2</integer> | 
| <key>Shape</key> | 
| <string>Rectangle</string> | 
| <key>Style</key> | 
| @@ -415,51 +267,37 @@ | 
| <string>NO</string> | 
| </dict> | 
| </dict> | 
| -			<key>Text</key> | 
| -			<dict> | 
| -				<key>Align</key> | 
| -				<integer>0</integer> | 
| -				<key>Pad</key> | 
| -				<integer>2</integer> | 
| -				<key>Text</key> | 
| -				<string>{\rtf1\ansi\ansicpg1252\cocoartf1187\cocoasubrtf370 | 
| -\cocoascreenfonts1{\fonttbl\f0\fnil\fcharset0 HelveticaNeue;} | 
| -{\colortbl;\red255\green255\blue255;} | 
| -\pard\tx560\tx1120\tx1680\tx2240\tx2800\tx3360\tx3920\tx4480\tx5040\tx5600\tx6160\tx6720\pardirnatural | 
| - | 
| -\f0\b\fs26 \cf0 littleben.html}</string> | 
| -				<key>VerticalPad</key> | 
| -				<integer>2</integer> | 
| -			</dict> | 
| -			<key>Wrap</key> | 
| -			<string>NO</string> | 
| </dict> | 
| <dict> | 
| <key>Bounds</key> | 
| -			<string>{{26, 86}, {307, 144}}</string> | 
| +			<string>{{115, 605}, {141, 44}}</string> | 
| <key>Class</key> | 
| <string>ShapedGraphic</string> | 
| -			<key>FitText</key> | 
| -			<string>YES</string> | 
| -			<key>Flow</key> | 
| -			<string>Resize</string> | 
| -			<key>FontInfo</key> | 
| -			<dict> | 
| -				<key>Font</key> | 
| -				<string>HelveticaNeue</string> | 
| -				<key>Size</key> | 
| -				<real>13</real> | 
| -			</dict> | 
| <key>ID</key> | 
| -			<integer>4</integer> | 
| +			<integer>34193</integer> | 
| +			<key>Magnets</key> | 
| +			<array> | 
| +				<string>{-0.43046357615894015, 0.033333333333333215}</string> | 
| +				<string>{0.038461538461538769, 0.25}</string> | 
| +				<string>{-0.24999999999999994, 0.033333333333331439}</string> | 
| +			</array> | 
| <key>Shape</key> | 
| <string>Rectangle</string> | 
| <key>Style</key> | 
| <dict> | 
| <key>fill</key> | 
| <dict> | 
| -					<key>Draws</key> | 
| -					<string>NO</string> | 
| +					<key>Color</key> | 
| +					<dict> | 
| +						<key>a</key> | 
| +						<string>0.33</string> | 
| +						<key>b</key> | 
| +						<string>1</string> | 
| +						<key>g</key> | 
| +						<string>0.860429</string> | 
| +						<key>r</key> | 
| +						<string>0.745947</string> | 
| +					</dict> | 
| </dict> | 
| <key>shadow</key> | 
| <dict> | 
| @@ -468,65 +306,182 @@ | 
| </dict> | 
| <key>stroke</key> | 
| <dict> | 
| -					<key>CornerRadius</key> | 
| -					<real>5</real> | 
| +					<key>Draws</key> | 
| +					<string>NO</string> | 
| </dict> | 
| </dict> | 
| <key>Text</key> | 
| <dict> | 
| <key>Align</key> | 
| -				<integer>0</integer> | 
| -				<key>Pad</key> | 
| -				<integer>2</integer> | 
| -				<key>Text</key> | 
| -				<string>{\rtf1\ansi\ansicpg1252\cocoartf1187\cocoasubrtf370 | 
| -\cocoascreenfonts1{\fonttbl\f0\fmodern\fcharset0 CourierNewPSMT;} | 
| -{\colortbl;\red255\green255\blue255;} | 
| -\deftab720 | 
| -\pard\pardeftab720 | 
| - | 
| -\f0\fs24 \cf0 <html>\ | 
| -  ...\ | 
| -  <body>\ | 
| -    <h1>Little Ben</h1>\ | 
| -    <div>\ | 
| -      The current time is: \{\{currentTime\}\}\ | 
| -    </div>\ | 
| -    ...\ | 
| -  </body>\ | 
| -</html>}</string> | 
| -				<key>VerticalPad</key> | 
| <integer>2</integer> | 
| </dict> | 
| -			<key>Wrap</key> | 
| -			<string>NO</string> | 
| +		</dict> | 
| +		<dict> | 
| +			<key>Class</key> | 
| +			<string>LineGraphic</string> | 
| +			<key>Head</key> | 
| +			<dict> | 
| +				<key>ID</key> | 
| +				<integer>34189</integer> | 
| +			</dict> | 
| +			<key>ID</key> | 
| +			<integer>34192</integer> | 
| +			<key>Points</key> | 
| +			<array> | 
| +				<string>{194.97561591645811, 105.5}</string> | 
| +				<string>{353.06965934906117, 167.81320542442131}</string> | 
| +			</array> | 
| +			<key>Style</key> | 
| +			<dict> | 
| +				<key>stroke</key> | 
| +				<dict> | 
| +					<key>HeadArrow</key> | 
| +					<string>FilledArrow</string> | 
| +					<key>Legacy</key> | 
| +					<true/> | 
| +					<key>TailArrow</key> | 
| +					<string>0</string> | 
| +				</dict> | 
| +			</dict> | 
| +			<key>Tail</key> | 
| +			<dict> | 
| +				<key>ID</key> | 
| +				<integer>34182</integer> | 
| +			</dict> | 
| +		</dict> | 
| +		<dict> | 
| +			<key>Class</key> | 
| +			<string>LineGraphic</string> | 
| +			<key>Head</key> | 
| +			<dict> | 
| +				<key>ID</key> | 
| +				<integer>34188</integer> | 
| +			</dict> | 
| +			<key>ID</key> | 
| +			<integer>34191</integer> | 
| +			<key>Points</key> | 
| +			<array> | 
| +				<string>{184.12079062966848, 105.5}</string> | 
| +				<string>{130.66964373245017, 255}</string> | 
| +			</array> | 
| +			<key>Style</key> | 
| +			<dict> | 
| +				<key>stroke</key> | 
| +				<dict> | 
| +					<key>HeadArrow</key> | 
| +					<string>FilledArrow</string> | 
| +					<key>Legacy</key> | 
| +					<true/> | 
| +					<key>TailArrow</key> | 
| +					<string>0</string> | 
| +				</dict> | 
| +			</dict> | 
| +			<key>Tail</key> | 
| +			<dict> | 
| +				<key>ID</key> | 
| +				<integer>34182</integer> | 
| +			</dict> | 
| +		</dict> | 
| +		<dict> | 
| +			<key>Class</key> | 
| +			<string>LineGraphic</string> | 
| +			<key>Head</key> | 
| +			<dict> | 
| +				<key>ID</key> | 
| +				<integer>34188</integer> | 
| +			</dict> | 
| +			<key>ID</key> | 
| +			<integer>34190</integer> | 
| +			<key>Points</key> | 
| +			<array> | 
| +				<string>{366, 209.53431606595601}</string> | 
| +				<string>{161.67578263810441, 255.00000000000003}</string> | 
| +			</array> | 
| +			<key>Style</key> | 
| +			<dict> | 
| +				<key>stroke</key> | 
| +				<dict> | 
| +					<key>HeadArrow</key> | 
| +					<string>FilledArrow</string> | 
| +					<key>Legacy</key> | 
| +					<true/> | 
| +					<key>TailArrow</key> | 
| +					<string>0</string> | 
| +				</dict> | 
| +			</dict> | 
| +			<key>Tail</key> | 
| +			<dict> | 
| +				<key>ID</key> | 
| +				<integer>34187</integer> | 
| +			</dict> | 
| </dict> | 
| <dict> | 
| <key>Bounds</key> | 
| -			<string>{{28, 288.75}, {487, 326}}</string> | 
| +			<string>{{354, 165}, {44.754718780517578, 24}}</string> | 
| <key>Class</key> | 
| <string>ShapedGraphic</string> | 
| -			<key>FitText</key> | 
| -			<string>YES</string> | 
| -			<key>Flow</key> | 
| -			<string>Resize</string> | 
| -			<key>FontInfo</key> | 
| +			<key>ID</key> | 
| +			<integer>34189</integer> | 
| +			<key>Shape</key> | 
| +			<string>Rectangle</string> | 
| +			<key>Style</key> | 
| <dict> | 
| -				<key>Font</key> | 
| -				<string>CourierNewPSMT</string> | 
| -				<key>Size</key> | 
| -				<real>11</real> | 
| +				<key>fill</key> | 
| +				<dict> | 
| +					<key>Color</key> | 
| +					<dict> | 
| +						<key>a</key> | 
| +						<string>0.5</string> | 
| +						<key>b</key> | 
| +						<string>1</string> | 
| +						<key>g</key> | 
| +						<string>0.860429</string> | 
| +						<key>r</key> | 
| +						<string>0.745947</string> | 
| +					</dict> | 
| +				</dict> | 
| +				<key>stroke</key> | 
| +				<dict> | 
| +					<key>Color</key> | 
| +					<dict> | 
| +						<key>b</key> | 
| +						<string>0.988815</string> | 
| +						<key>g</key> | 
| +						<string>0.585211</string> | 
| +						<key>r</key> | 
| +						<string>0.380747</string> | 
| +					</dict> | 
| +					<key>Width</key> | 
| +					<real>2</real> | 
| +				</dict> | 
| </dict> | 
| +		</dict> | 
| +		<dict> | 
| +			<key>Bounds</key> | 
| +			<string>{{69, 255}, {337.75471878051758, 15}}</string> | 
| +			<key>Class</key> | 
| +			<string>ShapedGraphic</string> | 
| <key>ID</key> | 
| -			<integer>3</integer> | 
| +			<integer>34188</integer> | 
| +			<key>Magnets</key> | 
| +			<array> | 
| +				<string>{-0.32535211267605629, 0}</string> | 
| +			</array> | 
| <key>Shape</key> | 
| <string>Rectangle</string> | 
| <key>Style</key> | 
| <dict> | 
| <key>fill</key> | 
| <dict> | 
| -					<key>Draws</key> | 
| -					<string>NO</string> | 
| +					<key>Color</key> | 
| +					<dict> | 
| +						<key>b</key> | 
| +						<string>0.909179</string> | 
| +						<key>g</key> | 
| +						<string>0.755853</string> | 
| +						<key>r</key> | 
| +						<string>1</string> | 
| +					</dict> | 
| </dict> | 
| <key>shadow</key> | 
| <dict> | 
| @@ -535,62 +490,27 @@ | 
| </dict> | 
| <key>stroke</key> | 
| <dict> | 
| -					<key>CornerRadius</key> | 
| -					<real>5</real> | 
| +					<key>Draws</key> | 
| +					<string>NO</string> | 
| </dict> | 
| </dict> | 
| <key>Text</key> | 
| <dict> | 
| <key>Align</key> | 
| -				<integer>0</integer> | 
| -				<key>Pad</key> | 
| -				<integer>2</integer> | 
| -				<key>Text</key> | 
| -				<string>{\rtf1\ansi\ansicpg1252\cocoartf1187\cocoasubrtf370 | 
| -\cocoascreenfonts1{\fonttbl\f0\fmodern\fcharset0 CourierNewPSMT;} | 
| -{\colortbl;\red255\green255\blue255;} | 
| -\deftab720 | 
| -\pard\pardeftab720 | 
| - | 
| -\f0\fs24 \cf0 import 'dart:async';\ | 
| -import 'package:web_ui/web_ui.dart';\ | 
| -\ | 
| -@observable\ | 
| -String currentTime;\ | 
| -\ | 
| -void main() \{\ | 
| -  var oneSecond = new Duration(seconds:1);\ | 
| -  var timer = new Timer.periodic(oneSecond, updateTime);\ | 
| -  updateTime(timer);\ | 
| -\}\ | 
| -\ | 
| -void updateTime(Timer _) \{\ | 
| -  DateTime today = new DateTime.now();\ | 
| -  currentTime = formatTime(today.hour, today.minute, today.second);\ | 
| -\}\ | 
| -\ | 
| -String formatTime(int h, int m, int s) \{\ | 
| -  if (h > 12) \{ h = h - 12; \}\ | 
| -  String minute = (m <= 9) ? '0$m' : '$m';\ | 
| -  String second = (s <= 9) ? '0$s' : '$s';\ | 
| -  return '$h:$minute:$second';\ | 
| -\}}</string> | 
| -				<key>VerticalPad</key> | 
| <integer>2</integer> | 
| </dict> | 
| -			<key>Wrap</key> | 
| -			<string>NO</string> | 
| </dict> | 
| <dict> | 
| <key>Bounds</key> | 
| -			<string>{{44, 487}, {471, 14}}</string> | 
| +			<string>{{123, 90.5}, {116, 15}}</string> | 
| <key>Class</key> | 
| <string>ShapedGraphic</string> | 
| <key>ID</key> | 
| -			<integer>34171</integer> | 
| +			<integer>34182</integer> | 
| <key>Magnets</key> | 
| <array> | 
| -				<string>{-0.064044943820224631, 0}</string> | 
| +				<string>{-0.43046357615894015, 0.033333333333333215}</string> | 
| +				<string>{0.038461538461538769, 0.25}</string> | 
| </array> | 
| <key>Shape</key> | 
| <string>Rectangle</string> | 
| @@ -601,9 +521,9 @@ String formatTime(int h, int m, int s) \{\ | 
| <key>Color</key> | 
| <dict> | 
| <key>b</key> | 
| -						<string>0.604698</string> | 
| +						<string>0.909179</string> | 
| <key>g</key> | 
| -						<string>0.928911</string> | 
| +						<string>0.755853</string> | 
| <key>r</key> | 
| <string>1</string> | 
| </dict> | 
| @@ -619,33 +539,47 @@ String formatTime(int h, int m, int s) \{\ | 
| <string>NO</string> | 
| </dict> | 
| </dict> | 
| +			<key>Text</key> | 
| +			<dict> | 
| +				<key>Align</key> | 
| +				<integer>2</integer> | 
| +				<key>Pad</key> | 
| +				<integer>0</integer> | 
| +				<key>Text</key> | 
| +				<string>{\rtf1\ansi\ansicpg1252\cocoartf1187\cocoasubrtf390 | 
| +\cocoascreenfonts1{\fonttbl\f0\fmodern\fcharset0 CourierNewPSMT;} | 
| +{\colortbl;\red255\green255\blue255;} | 
| +\pard\tx560\tx1120\tx1680\tx2240\tx2800\tx3360\tx3920\tx4480\tx5040\tx5600\tx6160\tx6720\pardirnatural\qr | 
| + | 
| +\f0\fs24 \cf0 on-click="start"}</string> | 
| +			</dict> | 
| </dict> | 
| <dict> | 
| <key>Bounds</key> | 
| -			<string>{{29, 334}, {138, 26.5}}</string> | 
| +			<string>{{65, 371}, {128, 20}}</string> | 
| <key>Class</key> | 
| <string>ShapedGraphic</string> | 
| +			<key>FitText</key> | 
| +			<string>YES</string> | 
| +			<key>Flow</key> | 
| +			<string>Resize</string> | 
| +			<key>FontInfo</key> | 
| +			<dict> | 
| +				<key>Font</key> | 
| +				<string>HelveticaNeue-Bold</string> | 
| +				<key>Size</key> | 
| +				<real>13</real> | 
| +			</dict> | 
| <key>ID</key> | 
| -			<integer>34145</integer> | 
| -			<key>Magnets</key> | 
| -			<array> | 
| -				<string>{-0.064044943820224631, 0}</string> | 
| -			</array> | 
| +			<integer>34181</integer> | 
| <key>Shape</key> | 
| <string>Rectangle</string> | 
| <key>Style</key> | 
| <dict> | 
| <key>fill</key> | 
| <dict> | 
| -					<key>Color</key> | 
| -					<dict> | 
| -						<key>b</key> | 
| -						<string>0.604698</string> | 
| -						<key>g</key> | 
| -						<string>0.928911</string> | 
| -						<key>r</key> | 
| -						<string>1</string> | 
| -					</dict> | 
| +					<key>Draws</key> | 
| +					<string>NO</string> | 
| </dict> | 
| <key>shadow</key> | 
| <dict> | 
| @@ -658,18 +592,36 @@ String formatTime(int h, int m, int s) \{\ | 
| <string>NO</string> | 
| </dict> | 
| </dict> | 
| +			<key>Text</key> | 
| +			<dict> | 
| +				<key>Align</key> | 
| +				<integer>0</integer> | 
| +				<key>Pad</key> | 
| +				<integer>2</integer> | 
| +				<key>Text</key> | 
| +				<string>{\rtf1\ansi\ansicpg1252\cocoartf1187\cocoasubrtf390 | 
| +\cocoascreenfonts1{\fonttbl\f0\fnil\fcharset0 HelveticaNeue;} | 
| +{\colortbl;\red255\green255\blue255;} | 
| +\pard\tx560\tx1120\tx1680\tx2240\tx2800\tx3360\tx3920\tx4480\tx5040\tx5600\tx6160\tx6720\pardirnatural | 
| + | 
| +\f0\b\fs26 \cf0 tute-stopwatch.dart}</string> | 
| +				<key>VerticalPad</key> | 
| +				<integer>2</integer> | 
| +			</dict> | 
| +			<key>Wrap</key> | 
| +			<string>NO</string> | 
| </dict> | 
| <dict> | 
| <key>Bounds</key> | 
| -			<string>{{221, 158}, {112, 14}}</string> | 
| +			<string>{{60, 86}, {414, 24}}</string> | 
| <key>Class</key> | 
| <string>ShapedGraphic</string> | 
| +			<key>FitText</key> | 
| +			<string>YES</string> | 
| +			<key>Flow</key> | 
| +			<string>Resize</string> | 
| <key>ID</key> | 
| -			<integer>34141</integer> | 
| -			<key>Magnets</key> | 
| -			<array> | 
| -				<string>{-0.064044943820224631, 0}</string> | 
| -			</array> | 
| +			<integer>3</integer> | 
| <key>Shape</key> | 
| <string>Rectangle</string> | 
| <key>Style</key> | 
| @@ -678,12 +630,14 @@ String formatTime(int h, int m, int s) \{\ | 
| <dict> | 
| <key>Color</key> | 
| <dict> | 
| +						<key>a</key> | 
| +						<string>0.5</string> | 
| <key>b</key> | 
| -						<string>0.604698</string> | 
| +						<string>1</string> | 
| <key>g</key> | 
| -						<string>0.928911</string> | 
| +						<string>0.860429</string> | 
| <key>r</key> | 
| -						<string>1</string> | 
| +						<string>0.745947</string> | 
| </dict> | 
| </dict> | 
| <key>shadow</key> | 
| @@ -693,6 +647,51 @@ String formatTime(int h, int m, int s) \{\ | 
| </dict> | 
| <key>stroke</key> | 
| <dict> | 
| +					<key>CornerRadius</key> | 
| +					<real>7</real> | 
| +				</dict> | 
| +			</dict> | 
| +			<key>Text</key> | 
| +			<dict> | 
| +				<key>Align</key> | 
| +				<integer>0</integer> | 
| +				<key>Text</key> | 
| +				<string>{\rtf1\ansi\ansicpg1252\cocoartf1187\cocoasubrtf390 | 
| +\cocoascreenfonts1{\fonttbl\f0\fmodern\fcharset0 CourierNewPSMT;} | 
| +{\colortbl;\red255\green255\blue255;} | 
| +\deftab720 | 
| +\pard\pardeftab720 | 
| + | 
| +\f0\fs24 \cf0 <button on-click="start" id="startbutton">Start</button>}</string> | 
| +			</dict> | 
| +			<key>Wrap</key> | 
| +			<string>NO</string> | 
| +		</dict> | 
| +		<dict> | 
| +			<key>Bounds</key> | 
| +			<string>{{333, 119}, {182, 84}}</string> | 
| +			<key>Class</key> | 
| +			<string>ShapedGraphic</string> | 
| +			<key>ID</key> | 
| +			<integer>34178</integer> | 
| +			<key>ImageID</key> | 
| +			<integer>1</integer> | 
| +			<key>Shape</key> | 
| +			<string>Rectangle</string> | 
| +			<key>Style</key> | 
| +			<dict> | 
| +				<key>fill</key> | 
| +				<dict> | 
| +					<key>Draws</key> | 
| +					<string>NO</string> | 
| +				</dict> | 
| +				<key>shadow</key> | 
| +				<dict> | 
| +					<key>Draws</key> | 
| +					<string>NO</string> | 
| +				</dict> | 
| +				<key>stroke</key> | 
| +				<dict> | 
| <key>Draws</key> | 
| <string>NO</string> | 
| </dict> | 
| @@ -700,30 +699,30 @@ String formatTime(int h, int m, int s) \{\ | 
| </dict> | 
| <dict> | 
| <key>Bounds</key> | 
| -			<string>{{29, 304.625}, {261, 14}}</string> | 
| +			<string>{{60, 66}, {130, 20}}</string> | 
| <key>Class</key> | 
| <string>ShapedGraphic</string> | 
| +			<key>FitText</key> | 
| +			<string>YES</string> | 
| +			<key>Flow</key> | 
| +			<string>Resize</string> | 
| +			<key>FontInfo</key> | 
| +			<dict> | 
| +				<key>Font</key> | 
| +				<string>HelveticaNeue-Bold</string> | 
| +				<key>Size</key> | 
| +				<real>13</real> | 
| +			</dict> | 
| <key>ID</key> | 
| -			<integer>34172</integer> | 
| -			<key>Magnets</key> | 
| -			<array> | 
| -				<string>{-0.064044943820224631, 0}</string> | 
| -			</array> | 
| +			<integer>34151</integer> | 
| <key>Shape</key> | 
| <string>Rectangle</string> | 
| <key>Style</key> | 
| <dict> | 
| <key>fill</key> | 
| <dict> | 
| -					<key>Color</key> | 
| -					<dict> | 
| -						<key>b</key> | 
| -						<string>0.604698</string> | 
| -						<key>g</key> | 
| -						<string>0.928911</string> | 
| -						<key>r</key> | 
| -						<string>1</string> | 
| -					</dict> | 
| +					<key>Draws</key> | 
| +					<string>NO</string> | 
| </dict> | 
| <key>shadow</key> | 
| <dict> | 
| @@ -736,6 +735,24 @@ String formatTime(int h, int m, int s) \{\ | 
| <string>NO</string> | 
| </dict> | 
| </dict> | 
| +			<key>Text</key> | 
| +			<dict> | 
| +				<key>Align</key> | 
| +				<integer>0</integer> | 
| +				<key>Pad</key> | 
| +				<integer>2</integer> | 
| +				<key>Text</key> | 
| +				<string>{\rtf1\ansi\ansicpg1252\cocoartf1187\cocoasubrtf390 | 
| +\cocoascreenfonts1{\fonttbl\f0\fnil\fcharset0 HelveticaNeue;} | 
| +{\colortbl;\red255\green255\blue255;} | 
| +\pard\tx560\tx1120\tx1680\tx2240\tx2800\tx3360\tx3920\tx4480\tx5040\tx5600\tx6160\tx6720\pardirnatural | 
| + | 
| +\f0\b\fs26 \cf0 tute-stopwatch.html}</string> | 
| +				<key>VerticalPad</key> | 
| +				<integer>2</integer> | 
| +			</dict> | 
| +			<key>Wrap</key> | 
| +			<string>NO</string> | 
| </dict> | 
| </array> | 
| <key>GridInfo</key> | 
| @@ -747,14 +764,16 @@ String formatTime(int h, int m, int s) \{\ | 
| <key>HPages</key> | 
| <integer>1</integer> | 
| <key>ImageCounter</key> | 
| -	<integer>4</integer> | 
| +	<integer>3</integer> | 
| <key>ImageLinkBack</key> | 
| <array> | 
| <dict/> | 
| +		<dict/> | 
| </array> | 
| <key>ImageList</key> | 
| <array> | 
| -		<string>image3.png</string> | 
| +		<string>image2.png</string> | 
| +		<string>image1.png</string> | 
| </array> | 
| <key>KeepToScale</key> | 
| <false/> | 
| @@ -793,7 +812,7 @@ String formatTime(int h, int m, int s) \{\ | 
| <key>MasterSheets</key> | 
| <array/> | 
| <key>ModificationDate</key> | 
| -	<string>2013-04-16 16:19:29 +0000</string> | 
| +	<string>2013-09-19 23:09:20 +0000</string> | 
| <key>Modifier</key> | 
| <string>Mary Campione</string> | 
| <key>NotesVisible</key> | 
| @@ -867,9 +886,14 @@ String formatTime(int h, int m, int s) \{\ | 
| <key>CurrentSheet</key> | 
| <integer>0</integer> | 
| <key>ExpandedCanvases</key> | 
| -		<array/> | 
| +		<array> | 
| +			<dict> | 
| +				<key>name</key> | 
| +				<string>Canvas 1</string> | 
| +			</dict> | 
| +		</array> | 
| <key>Frame</key> | 
| -		<string>{{424, 126}, {1029, 1052}}</string> | 
| +		<string>{{88, 311}, {1275, 1187}}</string> | 
| <key>ListView</key> | 
| <true/> | 
| <key>OutlineWidth</key> | 
| @@ -883,7 +907,7 @@ String formatTime(int h, int m, int s) \{\ | 
| <key>SidebarWidth</key> | 
| <integer>120</integer> | 
| <key>VisibleRegion</key> | 
| -		<string>{{-148, -90}, {872, 913}}</string> | 
| +		<string>{{-271, -157}, {1118, 1048}}</string> | 
| <key>Zoom</key> | 
| <real>1</real> | 
| <key>ZoomValues</key> | 
|  |