Permalink
Browse files

Keep on swimming, keep, on swimming, keep on swimming swimming swimmi…

…ng...
  • Loading branch information...
1 parent 89a2099 commit 922f4c14a676394477bdab4b719a907a78c0955c @ialexi committed Apr 16, 2010
View
8 apps/hedwig/controllers/article.js
@@ -15,6 +15,10 @@ Hedwig.articleController = SC.ObjectController.create(
contentBinding: "Hedwig.guideBrowserController.selection",
contentBindingDefault: SC.Binding.single(),
+ html: function() {
+ return "<div class='article'>" + (this.get("contents") || "") + "</div>";
+ }.property("contents").cacheable(),
+
toolbarShouldShow: YES,
toggleToolbar: function() {
this.set("toolbarShouldShow", !this.get("toolbarShouldShow"));
@@ -27,9 +31,5 @@ Hedwig.articleController = SC.ObjectController.create(
replacementFor: function(href) {
return "<div class='hedwig-demo' href='" + href + "' style=''></div>";
- },
-
- openDemo: function(href) {
- console.error("DEMO: " + href);
}
}) ;
View
2 apps/hedwig/resources/guide/touch.json
@@ -1 +1 @@
-{"title":"Writing Touch Applications","sections":[{"title":"Introduction","articles":[{"content":"<h1>A Brief Touch on Touches</h1>\n\n<p>Some text goes here.</p>\n\n<p>Note that links like the below must appear on empty lines with no preceding whitespace.</p>\n\n<p><a href='touch-demo.js' class='demo'>touch-demo.js</a></p>","errors":[],"demos":{"touch-demo.js":{"ex":"var MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\n","highlighted":"<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n","original":"var MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\n"}},"articleDirectory":"articles/touch/","outputDirectory":"build/","title":"A Brief Touch on Touches","any":"metadata","goes":"Here","damn":"gruber","this":"is still eye-readable","and":"He is wrong about touch apps."},{"content":"","errors":[],"demos":{},"articleDirectory":"articles/touch/","outputDirectory":"build/"}]},{"title":"Built-In Support","articles":[{"error":{"message":"No such file or directory","stack":"Error: No such file or directory\n at Object.readFileSync (fs:74:20)\n at Object.readFile (/Users/alex/.seeds/packages/core-support/0.2.1/lib/fs.js:348:37)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:9:27\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:22:48\n at Object.process (/Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:30:38)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/bin/hoo-worker:55:17\n at Stream.<anonymous> (/Volumes/Docs/Work/web/hedwig/docs/hoo/packages/spawn/lib/spawn.js:63:25)\n at IOWatcher.callback (net:310:14)\n at node.js:818:9","errno":2},"file":"build/articles/controls/button/touch.json"},{"error":{"message":"No such file or directory","stack":"Error: No such file or directory\n at Object.readFileSync (fs:74:20)\n at Object.readFile (/Users/alex/.seeds/packages/core-support/0.2.1/lib/fs.js:348:37)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:9:27\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:22:48\n at Object.process (/Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:30:38)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/bin/hoo-worker:55:17\n at Stream.<anonymous> (/Volumes/Docs/Work/web/hedwig/docs/hoo/packages/spawn/lib/spawn.js:63:25)\n at IOWatcher.callback (net:310:14)\n at node.js:818:9","errno":2},"file":"build/articles/controls/scroll/touch.json"}]},{"title":"Advanced Concepts","articles":[{"error":{"message":"No such file or directory","stack":"Error: No such file or directory\n at Object.readFileSync (fs:74:20)\n at Object.readFile (/Users/alex/.seeds/packages/core-support/0.2.1/lib/fs.js:348:37)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:9:27\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:22:48\n at Object.process (/Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:30:38)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/bin/hoo-worker:55:17\n at Stream.<anonymous> (/Volumes/Docs/Work/web/hedwig/docs/hoo/packages/spawn/lib/spawn.js:63:25)\n at IOWatcher.callback (net:310:14)\n at node.js:818:9","errno":2},"file":"build/articles/touch/capturing.json"},{"error":{"message":"No such file or directory","stack":"Error: No such file or directory\n at Object.readFileSync (fs:74:20)\n at Object.readFile (/Users/alex/.seeds/packages/core-support/0.2.1/lib/fs.js:348:37)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:9:27\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:22:48\n at Object.process (/Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:30:38)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/bin/hoo-worker:55:17\n at Stream.<anonymous> (/Volumes/Docs/Work/web/hedwig/docs/hoo/packages/spawn/lib/spawn.js:63:25)\n at IOWatcher.callback (net:310:14)\n at node.js:818:9","errno":2},"file":"build/articles/touch/releasing.json"}]}],"file":"build/guides/touch"}
+{"title":"Writing Touch Applications","sections":[{"title":"Introduction","articles":[{"content":"<h1>A Brief Touch on Touches</h1>\n\n<p>Some text goes here.</p>\n\n<p>Note that links like the below must appear on empty lines with no preceding whitespace.</p>\n\n<p><a href='touch-demo.js' class='demo'>touch-demo.js</a></p>","errors":[],"demos":{"touch-demo.js":{"ex":"var Dot = SC.View.extend({\n touchStart: function(touch) {\n var f = this.get(\"frame\");\n this._touch = {\n start: { x: touch.pageX, y: touch.pageY },\n ourStart: { x: f.x, y: f.y, width: f.width, height: f.height }\n };\n return YES; // or we won't get touchesDragged\n },\n \n touchesDragged: function(evt, touches) {\n var t = this._touch;\n this.set(\"layout\", { \n left: t.ourStart.x + evt.pageX - t.start.x,\n top: t.ourStart.y + evt.pageY - t.start.y,\n width: t.ourStart.width,\n height: t.ourStart.height\n });\n }\n});\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"white\",\n childViews: \"dot1 dot2\".w(),\n dot1: Dot.design({\n backgroundColor: \"red\",\n layout: { left: 10, top: 10, width: 100, height: 100 }\n }),\n dot2: Dot.design({\n backgroundColor: \"blue\",\n layout: { right: 10, bottom: 10, width: 100, height: 100 }\n })\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n","highlighted":"<span class=\"keyword\">var</span> <span class=\"class\">Dot</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">touchStart</span>: <span class=\"keyword\">function</span>(<span class=\"variable\">touch</span>) {\n <span class=\"keyword\">var</span> <span class=\"variable\">f</span> = <span class=\"this\">this</span>.<span class=\"variable\">get</span>(<span class=\"string\">&quot;frame&quot;</span>);\n <span class=\"this\">this</span>.<span class=\"variable\">_touch</span> = {\n <span class=\"variable\">start</span>: { <span class=\"variable\">x</span>: <span class=\"variable\">touch</span>.<span class=\"variable\">pageX</span>, <span class=\"variable\">y</span>: <span class=\"variable\">touch</span>.<span class=\"variable\">pageY</span> },\n <span class=\"variable\">ourStart</span>: { <span class=\"variable\">x</span>: <span class=\"variable\">f</span>.<span class=\"variable\">x</span>, <span class=\"variable\">y</span>: <span class=\"variable\">f</span>.<span class=\"variable\">y</span>, <span class=\"variable\">width</span>: <span class=\"variable\">f</span>.<span class=\"variable\">width</span>, <span class=\"variable\">height</span>: <span class=\"variable\">f</span>.<span class=\"variable\">height</span> }\n };\n <span class=\"keyword\">return</span> <span class=\"class\">YES</span>; <span class=\"comment\">// or we won't get touchesDragged</span>\n },\n \n <span class=\"variable\">touchesDragged</span>: <span class=\"keyword\">function</span>(<span class=\"variable\">evt</span>, <span class=\"variable\">touches</span>) {\n <span class=\"keyword\">var</span> <span class=\"variable\">t</span> = <span class=\"this\">this</span>.<span class=\"variable\">_touch</span>;\n <span class=\"this\">this</span>.<span class=\"variable\">set</span>(<span class=\"string\">&quot;layout&quot;</span>, { \n <span class=\"variable\">left</span>: <span class=\"variable\">t</span>.<span class=\"variable\">ourStart</span>.<span class=\"variable\">x</span> + <span class=\"variable\">evt</span>.<span class=\"variable\">pageX</span> - <span class=\"variable\">t</span>.<span class=\"variable\">start</span>.<span class=\"variable\">x</span>,\n <span class=\"variable\">top</span>: <span class=\"variable\">t</span>.<span class=\"variable\">ourStart</span>.<span class=\"variable\">y</span> + <span class=\"variable\">evt</span>.<span class=\"variable\">pageY</span> - <span class=\"variable\">t</span>.<span class=\"variable\">start</span>.<span class=\"variable\">y</span>,\n <span class=\"variable\">width</span>: <span class=\"variable\">t</span>.<span class=\"variable\">ourStart</span>.<span class=\"variable\">width</span>,\n <span class=\"variable\">height</span>: <span class=\"variable\">t</span>.<span class=\"variable\">ourStart</span>.<span class=\"variable\">height</span>\n });\n }\n});\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;white&quot;</span>,\n <span class=\"variable\">childViews</span>: <span class=\"string\">&quot;dot1 dot2&quot;</span>.<span class=\"variable\">w</span>(),\n <span class=\"variable\">dot1</span>: <span class=\"class\">Dot</span>.<span class=\"variable\">design</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>,\n <span class=\"variable\">layout</span>: { <span class=\"variable\">left</span>: <span class=\"number integer\">10</span>, <span class=\"variable\">top</span>: <span class=\"number integer\">10</span>, <span class=\"variable\">width</span>: <span class=\"number integer\">100</span>, <span class=\"variable\">height</span>: <span class=\"number integer\">100</span> }\n }),\n <span class=\"variable\">dot2</span>: <span class=\"class\">Dot</span>.<span class=\"variable\">design</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;blue&quot;</span>,\n <span class=\"variable\">layout</span>: { <span class=\"variable\">right</span>: <span class=\"number integer\">10</span>, <span class=\"variable\">bottom</span>: <span class=\"number integer\">10</span>, <span class=\"variable\">width</span>: <span class=\"number integer\">100</span>, <span class=\"variable\">height</span>: <span class=\"number integer\">100</span> }\n })\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n","original":"var Dot = SC.View.extend({\n touchStart: function(touch) {\n var f = this.get(\"frame\");\n this._touch = {\n start: { x: touch.pageX, y: touch.pageY },\n ourStart: { x: f.x, y: f.y, width: f.width, height: f.height }\n };\n return YES; // or we won't get touchesDragged\n },\n \n touchesDragged: function(evt, touches) {\n var t = this._touch;\n this.set(\"layout\", { \n left: t.ourStart.x + evt.pageX - t.start.x,\n top: t.ourStart.y + evt.pageY - t.start.y,\n width: t.ourStart.width,\n height: t.ourStart.height\n });\n }\n});\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"white\",\n childViews: \"dot1 dot2\".w(),\n dot1: Dot.design({\n backgroundColor: \"red\",\n layout: { left: 10, top: 10, width: 100, height: 100 }\n }),\n dot2: Dot.design({\n backgroundColor: \"blue\",\n layout: { right: 10, bottom: 10, width: 100, height: 100 }\n })\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n"}},"articleDirectory":"articles/touch/","outputDirectory":"build/","title":"A Brief Touch on Touches","any":"metadata","goes":"Here","damn":"gruber","this":"is still eye-readable","and":"He is wrong about touch apps."},{"content":"","errors":[],"demos":{},"articleDirectory":"articles/touch/","outputDirectory":"build/"}]},{"title":"Built-In Support","articles":[{"error":{"message":"No such file or directory","stack":"Error: No such file or directory\n at Object.readFileSync (fs:74:20)\n at Object.readFile (/Users/alex/.seeds/packages/core-support/0.2.1/lib/fs.js:348:37)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:9:27\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:22:48\n at Object.process (/Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:30:38)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/bin/hoo-worker:55:17\n at Stream.<anonymous> (/Volumes/Docs/Work/web/hedwig/docs/hoo/packages/spawn/lib/spawn.js:63:25)\n at IOWatcher.callback (net:310:14)\n at node.js:818:9","errno":2},"file":"build/articles/controls/button/touch.json"},{"error":{"message":"No such file or directory","stack":"Error: No such file or directory\n at Object.readFileSync (fs:74:20)\n at Object.readFile (/Users/alex/.seeds/packages/core-support/0.2.1/lib/fs.js:348:37)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:9:27\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:22:48\n at Object.process (/Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:30:38)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/bin/hoo-worker:55:17\n at Stream.<anonymous> (/Volumes/Docs/Work/web/hedwig/docs/hoo/packages/spawn/lib/spawn.js:63:25)\n at IOWatcher.callback (net:310:14)\n at node.js:818:9","errno":2},"file":"build/articles/controls/scroll/touch.json"}]},{"title":"Advanced Concepts","articles":[{"error":{"message":"No such file or directory","stack":"Error: No such file or directory\n at Object.readFileSync (fs:74:20)\n at Object.readFile (/Users/alex/.seeds/packages/core-support/0.2.1/lib/fs.js:348:37)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:9:27\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:22:48\n at Object.process (/Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:30:38)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/bin/hoo-worker:55:17\n at Stream.<anonymous> (/Volumes/Docs/Work/web/hedwig/docs/hoo/packages/spawn/lib/spawn.js:63:25)\n at IOWatcher.callback (net:310:14)\n at node.js:818:9","errno":2},"file":"build/articles/touch/capturing.json"},{"error":{"message":"No such file or directory","stack":"Error: No such file or directory\n at Object.readFileSync (fs:74:20)\n at Object.readFile (/Users/alex/.seeds/packages/core-support/0.2.1/lib/fs.js:348:37)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:9:27\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:22:48\n at Object.process (/Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:30:38)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/bin/hoo-worker:55:17\n at Stream.<anonymous> (/Volumes/Docs/Work/web/hedwig/docs/hoo/packages/spawn/lib/spawn.js:63:25)\n at IOWatcher.callback (net:310:14)\n at node.js:818:9","errno":2},"file":"build/articles/touch/releasing.json"}]}],"file":"build/guides/touch"}
View
2 apps/hedwig/resources/main_page.js
@@ -184,7 +184,7 @@ Hedwig.mainPage = SC.Page.design({
contentView: SC.ScrollView.design({
borderStyle: SC.BORDER_NONE,
contentView: SC.StaticContentView.design({
- contentBinding: "Hedwig.articleController.contents",
+ contentBinding: "Hedwig.articleController.html",
contentDidChange: function() {
sc_super();
this.invokeLater("processContent", 1);
View
2 docs/build/articles/touch/a-brief-touch.json
@@ -1 +1 @@
-{"content":"<h1>A Brief Touch on Touches</h1>\n\n<p>Some text goes here.</p>\n\n<p>Note that links like the below must appear on empty lines with no preceding whitespace.</p>\n\n<p><a href='touch-demo.js' class='demo'>touch-demo.js</a></p>","errors":[],"demos":{"touch-demo.js":{"ex":"var MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\n","highlighted":"<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n","original":"var MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\n"}},"articleDirectory":"articles/touch/","outputDirectory":"build/","title":"A Brief Touch on Touches","any":"metadata","goes":"Here","damn":"gruber","this":"is still eye-readable","and":"He is wrong about touch apps."}
+{"content":"<h1>A Brief Touch on Touches</h1>\n\n<p>Some text goes here.</p>\n\n<p>Note that links like the below must appear on empty lines with no preceding whitespace.</p>\n\n<p><a href='touch-demo.js' class='demo'>touch-demo.js</a></p>","errors":[],"demos":{"touch-demo.js":{"ex":"var Dot = SC.View.extend({\n touchStart: function(touch) {\n var f = this.get(\"frame\");\n this._touch = {\n start: { x: touch.pageX, y: touch.pageY },\n ourStart: { x: f.x, y: f.y, width: f.width, height: f.height }\n };\n return YES; // or we won't get touchesDragged\n },\n \n touchesDragged: function(evt, touches) {\n var t = this._touch;\n this.set(\"layout\", { \n left: t.ourStart.x + evt.pageX - t.start.x,\n top: t.ourStart.y + evt.pageY - t.start.y,\n width: t.ourStart.width,\n height: t.ourStart.height\n });\n }\n});\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"white\",\n childViews: \"dot1 dot2\".w(),\n dot1: Dot.design({\n backgroundColor: \"red\",\n layout: { left: 10, top: 10, width: 100, height: 100 }\n }),\n dot2: Dot.design({\n backgroundColor: \"blue\",\n layout: { right: 10, bottom: 10, width: 100, height: 100 }\n })\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n","highlighted":"<span class=\"keyword\">var</span> <span class=\"class\">Dot</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">touchStart</span>: <span class=\"keyword\">function</span>(<span class=\"variable\">touch</span>) {\n <span class=\"keyword\">var</span> <span class=\"variable\">f</span> = <span class=\"this\">this</span>.<span class=\"variable\">get</span>(<span class=\"string\">&quot;frame&quot;</span>);\n <span class=\"this\">this</span>.<span class=\"variable\">_touch</span> = {\n <span class=\"variable\">start</span>: { <span class=\"variable\">x</span>: <span class=\"variable\">touch</span>.<span class=\"variable\">pageX</span>, <span class=\"variable\">y</span>: <span class=\"variable\">touch</span>.<span class=\"variable\">pageY</span> },\n <span class=\"variable\">ourStart</span>: { <span class=\"variable\">x</span>: <span class=\"variable\">f</span>.<span class=\"variable\">x</span>, <span class=\"variable\">y</span>: <span class=\"variable\">f</span>.<span class=\"variable\">y</span>, <span class=\"variable\">width</span>: <span class=\"variable\">f</span>.<span class=\"variable\">width</span>, <span class=\"variable\">height</span>: <span class=\"variable\">f</span>.<span class=\"variable\">height</span> }\n };\n <span class=\"keyword\">return</span> <span class=\"class\">YES</span>; <span class=\"comment\">// or we won't get touchesDragged</span>\n },\n \n <span class=\"variable\">touchesDragged</span>: <span class=\"keyword\">function</span>(<span class=\"variable\">evt</span>, <span class=\"variable\">touches</span>) {\n <span class=\"keyword\">var</span> <span class=\"variable\">t</span> = <span class=\"this\">this</span>.<span class=\"variable\">_touch</span>;\n <span class=\"this\">this</span>.<span class=\"variable\">set</span>(<span class=\"string\">&quot;layout&quot;</span>, { \n <span class=\"variable\">left</span>: <span class=\"variable\">t</span>.<span class=\"variable\">ourStart</span>.<span class=\"variable\">x</span> + <span class=\"variable\">evt</span>.<span class=\"variable\">pageX</span> - <span class=\"variable\">t</span>.<span class=\"variable\">start</span>.<span class=\"variable\">x</span>,\n <span class=\"variable\">top</span>: <span class=\"variable\">t</span>.<span class=\"variable\">ourStart</span>.<span class=\"variable\">y</span> + <span class=\"variable\">evt</span>.<span class=\"variable\">pageY</span> - <span class=\"variable\">t</span>.<span class=\"variable\">start</span>.<span class=\"variable\">y</span>,\n <span class=\"variable\">width</span>: <span class=\"variable\">t</span>.<span class=\"variable\">ourStart</span>.<span class=\"variable\">width</span>,\n <span class=\"variable\">height</span>: <span class=\"variable\">t</span>.<span class=\"variable\">ourStart</span>.<span class=\"variable\">height</span>\n });\n }\n});\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;white&quot;</span>,\n <span class=\"variable\">childViews</span>: <span class=\"string\">&quot;dot1 dot2&quot;</span>.<span class=\"variable\">w</span>(),\n <span class=\"variable\">dot1</span>: <span class=\"class\">Dot</span>.<span class=\"variable\">design</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>,\n <span class=\"variable\">layout</span>: { <span class=\"variable\">left</span>: <span class=\"number integer\">10</span>, <span class=\"variable\">top</span>: <span class=\"number integer\">10</span>, <span class=\"variable\">width</span>: <span class=\"number integer\">100</span>, <span class=\"variable\">height</span>: <span class=\"number integer\">100</span> }\n }),\n <span class=\"variable\">dot2</span>: <span class=\"class\">Dot</span>.<span class=\"variable\">design</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;blue&quot;</span>,\n <span class=\"variable\">layout</span>: { <span class=\"variable\">right</span>: <span class=\"number integer\">10</span>, <span class=\"variable\">bottom</span>: <span class=\"number integer\">10</span>, <span class=\"variable\">width</span>: <span class=\"number integer\">100</span>, <span class=\"variable\">height</span>: <span class=\"number integer\">100</span> }\n })\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n","original":"var Dot = SC.View.extend({\n touchStart: function(touch) {\n var f = this.get(\"frame\");\n this._touch = {\n start: { x: touch.pageX, y: touch.pageY },\n ourStart: { x: f.x, y: f.y, width: f.width, height: f.height }\n };\n return YES; // or we won't get touchesDragged\n },\n \n touchesDragged: function(evt, touches) {\n var t = this._touch;\n this.set(\"layout\", { \n left: t.ourStart.x + evt.pageX - t.start.x,\n top: t.ourStart.y + evt.pageY - t.start.y,\n width: t.ourStart.width,\n height: t.ourStart.height\n });\n }\n});\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"white\",\n childViews: \"dot1 dot2\".w(),\n dot1: Dot.design({\n backgroundColor: \"red\",\n layout: { left: 10, top: 10, width: 100, height: 100 }\n }),\n dot2: Dot.design({\n backgroundColor: \"blue\",\n layout: { right: 10, bottom: 10, width: 100, height: 100 }\n })\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n"}},"articleDirectory":"articles/touch/","outputDirectory":"build/","title":"A Brief Touch on Touches","any":"metadata","goes":"Here","damn":"gruber","this":"is still eye-readable","and":"He is wrong about touch apps."}
View
205 docs/build/articles/touch/touch-demo.js
@@ -1,180 +1,37 @@
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
+var Dot = SC.View.extend({
+ touchStart: function(touch) {
+ var f = this.get("frame");
+ this._touch = {
+ start: { x: touch.pageX, y: touch.pageY },
+ ourStart: { x: f.x, y: f.y, width: f.width, height: f.height }
+ };
+ return YES; // or we won't get touchesDragged
+ },
+
+ touchesDragged: function(evt, touches) {
+ var t = this._touch;
+ this.set("layout", {
+ left: t.ourStart.x + evt.pageX - t.start.x,
+ top: t.ourStart.y + evt.pageY - t.start.y,
+ width: t.ourStart.width,
+ height: t.ourStart.height
+ });
+ }
+});
+var MyExampleView = SC.View.extend({
+ backgroundColor: "white",
+ childViews: "dot1 dot2".w(),
+ dot1: Dot.design({
+ backgroundColor: "red",
+ layout: { left: 10, top: 10, width: 100, height: 100 }
+ }),
+ dot2: Dot.design({
+ backgroundColor: "blue",
+ layout: { right: 10, bottom: 10, width: 100, height: 100 }
+ })
});
// bootstrap code :)
exports.getDemoView = function() {
return MyExampleView;
};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
View
2 docs/build/guides/touch.json
@@ -1 +1 @@
-{"title":"Writing Touch Applications","sections":[{"title":"Introduction","articles":[{"content":"<h1>A Brief Touch on Touches</h1>\n\n<p>Some text goes here.</p>\n\n<p>Note that links like the below must appear on empty lines with no preceding whitespace.</p>\n\n<p><a href='touch-demo.js' class='demo'>touch-demo.js</a></p>","errors":[],"demos":{"touch-demo.js":{"ex":"var MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\n","highlighted":"<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n\n","original":"var MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"red\"\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n\n"}},"articleDirectory":"articles/touch/","outputDirectory":"build/","title":"A Brief Touch on Touches","any":"metadata","goes":"Here","damn":"gruber","this":"is still eye-readable","and":"He is wrong about touch apps."},{"content":"","errors":[],"demos":{},"articleDirectory":"articles/touch/","outputDirectory":"build/"}]},{"title":"Built-In Support","articles":[{"error":{"message":"No such file or directory","stack":"Error: No such file or directory\n at Object.readFileSync (fs:74:20)\n at Object.readFile (/Users/alex/.seeds/packages/core-support/0.2.1/lib/fs.js:348:37)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:9:27\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:22:48\n at Object.process (/Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:30:38)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/bin/hoo-worker:55:17\n at Stream.<anonymous> (/Volumes/Docs/Work/web/hedwig/docs/hoo/packages/spawn/lib/spawn.js:63:25)\n at IOWatcher.callback (net:310:14)\n at node.js:818:9","errno":2},"file":"build/articles/controls/button/touch.json"},{"error":{"message":"No such file or directory","stack":"Error: No such file or directory\n at Object.readFileSync (fs:74:20)\n at Object.readFile (/Users/alex/.seeds/packages/core-support/0.2.1/lib/fs.js:348:37)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:9:27\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:22:48\n at Object.process (/Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:30:38)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/bin/hoo-worker:55:17\n at Stream.<anonymous> (/Volumes/Docs/Work/web/hedwig/docs/hoo/packages/spawn/lib/spawn.js:63:25)\n at IOWatcher.callback (net:310:14)\n at node.js:818:9","errno":2},"file":"build/articles/controls/scroll/touch.json"}]},{"title":"Advanced Concepts","articles":[{"error":{"message":"No such file or directory","stack":"Error: No such file or directory\n at Object.readFileSync (fs:74:20)\n at Object.readFile (/Users/alex/.seeds/packages/core-support/0.2.1/lib/fs.js:348:37)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:9:27\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:22:48\n at Object.process (/Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:30:38)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/bin/hoo-worker:55:17\n at Stream.<anonymous> (/Volumes/Docs/Work/web/hedwig/docs/hoo/packages/spawn/lib/spawn.js:63:25)\n at IOWatcher.callback (net:310:14)\n at node.js:818:9","errno":2},"file":"build/articles/touch/capturing.json"},{"error":{"message":"No such file or directory","stack":"Error: No such file or directory\n at Object.readFileSync (fs:74:20)\n at Object.readFile (/Users/alex/.seeds/packages/core-support/0.2.1/lib/fs.js:348:37)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:9:27\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:22:48\n at Object.process (/Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:30:38)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/bin/hoo-worker:55:17\n at Stream.<anonymous> (/Volumes/Docs/Work/web/hedwig/docs/hoo/packages/spawn/lib/spawn.js:63:25)\n at IOWatcher.callback (net:310:14)\n at node.js:818:9","errno":2},"file":"build/articles/touch/releasing.json"}]}],"file":"build/guides/touch"}
+{"title":"Writing Touch Applications","sections":[{"title":"Introduction","articles":[{"content":"<h1>A Brief Touch on Touches</h1>\n\n<p>Some text goes here.</p>\n\n<p>Note that links like the below must appear on empty lines with no preceding whitespace.</p>\n\n<p><a href='touch-demo.js' class='demo'>touch-demo.js</a></p>","errors":[],"demos":{"touch-demo.js":{"ex":"var Dot = SC.View.extend({\n touchStart: function(touch) {\n var f = this.get(\"frame\");\n this._touch = {\n start: { x: touch.pageX, y: touch.pageY },\n ourStart: { x: f.x, y: f.y, width: f.width, height: f.height }\n };\n return YES; // or we won't get touchesDragged\n },\n \n touchesDragged: function(evt, touches) {\n var t = this._touch;\n this.set(\"layout\", { \n left: t.ourStart.x + evt.pageX - t.start.x,\n top: t.ourStart.y + evt.pageY - t.start.y,\n width: t.ourStart.width,\n height: t.ourStart.height\n });\n }\n});\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"white\",\n childViews: \"dot1 dot2\".w(),\n dot1: Dot.design({\n backgroundColor: \"red\",\n layout: { left: 10, top: 10, width: 100, height: 100 }\n }),\n dot2: Dot.design({\n backgroundColor: \"blue\",\n layout: { right: 10, bottom: 10, width: 100, height: 100 }\n })\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n","highlighted":"<span class=\"keyword\">var</span> <span class=\"class\">Dot</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">touchStart</span>: <span class=\"keyword\">function</span>(<span class=\"variable\">touch</span>) {\n <span class=\"keyword\">var</span> <span class=\"variable\">f</span> = <span class=\"this\">this</span>.<span class=\"variable\">get</span>(<span class=\"string\">&quot;frame&quot;</span>);\n <span class=\"this\">this</span>.<span class=\"variable\">_touch</span> = {\n <span class=\"variable\">start</span>: { <span class=\"variable\">x</span>: <span class=\"variable\">touch</span>.<span class=\"variable\">pageX</span>, <span class=\"variable\">y</span>: <span class=\"variable\">touch</span>.<span class=\"variable\">pageY</span> },\n <span class=\"variable\">ourStart</span>: { <span class=\"variable\">x</span>: <span class=\"variable\">f</span>.<span class=\"variable\">x</span>, <span class=\"variable\">y</span>: <span class=\"variable\">f</span>.<span class=\"variable\">y</span>, <span class=\"variable\">width</span>: <span class=\"variable\">f</span>.<span class=\"variable\">width</span>, <span class=\"variable\">height</span>: <span class=\"variable\">f</span>.<span class=\"variable\">height</span> }\n };\n <span class=\"keyword\">return</span> <span class=\"class\">YES</span>; <span class=\"comment\">// or we won't get touchesDragged</span>\n },\n \n <span class=\"variable\">touchesDragged</span>: <span class=\"keyword\">function</span>(<span class=\"variable\">evt</span>, <span class=\"variable\">touches</span>) {\n <span class=\"keyword\">var</span> <span class=\"variable\">t</span> = <span class=\"this\">this</span>.<span class=\"variable\">_touch</span>;\n <span class=\"this\">this</span>.<span class=\"variable\">set</span>(<span class=\"string\">&quot;layout&quot;</span>, { \n <span class=\"variable\">left</span>: <span class=\"variable\">t</span>.<span class=\"variable\">ourStart</span>.<span class=\"variable\">x</span> + <span class=\"variable\">evt</span>.<span class=\"variable\">pageX</span> - <span class=\"variable\">t</span>.<span class=\"variable\">start</span>.<span class=\"variable\">x</span>,\n <span class=\"variable\">top</span>: <span class=\"variable\">t</span>.<span class=\"variable\">ourStart</span>.<span class=\"variable\">y</span> + <span class=\"variable\">evt</span>.<span class=\"variable\">pageY</span> - <span class=\"variable\">t</span>.<span class=\"variable\">start</span>.<span class=\"variable\">y</span>,\n <span class=\"variable\">width</span>: <span class=\"variable\">t</span>.<span class=\"variable\">ourStart</span>.<span class=\"variable\">width</span>,\n <span class=\"variable\">height</span>: <span class=\"variable\">t</span>.<span class=\"variable\">ourStart</span>.<span class=\"variable\">height</span>\n });\n }\n});\n<span class=\"keyword\">var</span> <span class=\"class\">MyExampleView</span> = <span class=\"class\">SC</span>.<span class=\"class\">View</span>.<span class=\"variable\">extend</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;white&quot;</span>,\n <span class=\"variable\">childViews</span>: <span class=\"string\">&quot;dot1 dot2&quot;</span>.<span class=\"variable\">w</span>(),\n <span class=\"variable\">dot1</span>: <span class=\"class\">Dot</span>.<span class=\"variable\">design</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;red&quot;</span>,\n <span class=\"variable\">layout</span>: { <span class=\"variable\">left</span>: <span class=\"number integer\">10</span>, <span class=\"variable\">top</span>: <span class=\"number integer\">10</span>, <span class=\"variable\">width</span>: <span class=\"number integer\">100</span>, <span class=\"variable\">height</span>: <span class=\"number integer\">100</span> }\n }),\n <span class=\"variable\">dot2</span>: <span class=\"class\">Dot</span>.<span class=\"variable\">design</span>({\n <span class=\"variable\">backgroundColor</span>: <span class=\"string\">&quot;blue&quot;</span>,\n <span class=\"variable\">layout</span>: { <span class=\"variable\">right</span>: <span class=\"number integer\">10</span>, <span class=\"variable\">bottom</span>: <span class=\"number integer\">10</span>, <span class=\"variable\">width</span>: <span class=\"number integer\">100</span>, <span class=\"variable\">height</span>: <span class=\"number integer\">100</span> }\n })\n});\n\n<span class=\"comment\">// bootstrap code :)</span>\n<span class=\"variable\">exports</span>.<span class=\"variable\">getDemoView</span> = <span class=\"keyword\">function</span>() {\n <span class=\"keyword\">return</span> <span class=\"class\">MyExampleView</span>;\n};\n","original":"var Dot = SC.View.extend({\n touchStart: function(touch) {\n var f = this.get(\"frame\");\n this._touch = {\n start: { x: touch.pageX, y: touch.pageY },\n ourStart: { x: f.x, y: f.y, width: f.width, height: f.height }\n };\n return YES; // or we won't get touchesDragged\n },\n \n touchesDragged: function(evt, touches) {\n var t = this._touch;\n this.set(\"layout\", { \n left: t.ourStart.x + evt.pageX - t.start.x,\n top: t.ourStart.y + evt.pageY - t.start.y,\n width: t.ourStart.width,\n height: t.ourStart.height\n });\n }\n});\nvar MyExampleView = SC.View.extend({\n backgroundColor: \"white\",\n childViews: \"dot1 dot2\".w(),\n dot1: Dot.design({\n backgroundColor: \"red\",\n layout: { left: 10, top: 10, width: 100, height: 100 }\n }),\n dot2: Dot.design({\n backgroundColor: \"blue\",\n layout: { right: 10, bottom: 10, width: 100, height: 100 }\n })\n});\n\n// bootstrap code :)\nexports.getDemoView = function() {\n return MyExampleView;\n};\n"}},"articleDirectory":"articles/touch/","outputDirectory":"build/","title":"A Brief Touch on Touches","any":"metadata","goes":"Here","damn":"gruber","this":"is still eye-readable","and":"He is wrong about touch apps."},{"content":"","errors":[],"demos":{},"articleDirectory":"articles/touch/","outputDirectory":"build/"}]},{"title":"Built-In Support","articles":[{"error":{"message":"No such file or directory","stack":"Error: No such file or directory\n at Object.readFileSync (fs:74:20)\n at Object.readFile (/Users/alex/.seeds/packages/core-support/0.2.1/lib/fs.js:348:37)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:9:27\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:22:48\n at Object.process (/Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:30:38)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/bin/hoo-worker:55:17\n at Stream.<anonymous> (/Volumes/Docs/Work/web/hedwig/docs/hoo/packages/spawn/lib/spawn.js:63:25)\n at IOWatcher.callback (net:310:14)\n at node.js:818:9","errno":2},"file":"build/articles/controls/button/touch.json"},{"error":{"message":"No such file or directory","stack":"Error: No such file or directory\n at Object.readFileSync (fs:74:20)\n at Object.readFile (/Users/alex/.seeds/packages/core-support/0.2.1/lib/fs.js:348:37)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:9:27\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:22:48\n at Object.process (/Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:30:38)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/bin/hoo-worker:55:17\n at Stream.<anonymous> (/Volumes/Docs/Work/web/hedwig/docs/hoo/packages/spawn/lib/spawn.js:63:25)\n at IOWatcher.callback (net:310:14)\n at node.js:818:9","errno":2},"file":"build/articles/controls/scroll/touch.json"}]},{"title":"Advanced Concepts","articles":[{"error":{"message":"No such file or directory","stack":"Error: No such file or directory\n at Object.readFileSync (fs:74:20)\n at Object.readFile (/Users/alex/.seeds/packages/core-support/0.2.1/lib/fs.js:348:37)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:9:27\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:22:48\n at Object.process (/Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:30:38)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/bin/hoo-worker:55:17\n at Stream.<anonymous> (/Volumes/Docs/Work/web/hedwig/docs/hoo/packages/spawn/lib/spawn.js:63:25)\n at IOWatcher.callback (net:310:14)\n at node.js:818:9","errno":2},"file":"build/articles/touch/capturing.json"},{"error":{"message":"No such file or directory","stack":"Error: No such file or directory\n at Object.readFileSync (fs:74:20)\n at Object.readFile (/Users/alex/.seeds/packages/core-support/0.2.1/lib/fs.js:348:37)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:9:27\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:22:48\n at Object.process (/Volumes/Docs/Work/web/hedwig/docs/hoo/lib/guide.js:30:38)\n at /Volumes/Docs/Work/web/hedwig/docs/hoo/bin/hoo-worker:55:17\n at Stream.<anonymous> (/Volumes/Docs/Work/web/hedwig/docs/hoo/packages/spawn/lib/spawn.js:63:25)\n at IOWatcher.callback (net:310:14)\n at node.js:818:9","errno":2},"file":"build/articles/touch/releasing.json"}]}],"file":"build/guides/touch"}
View
205 docs/src/articles/touch/touch-demo.js
@@ -1,180 +1,37 @@
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
+var Dot = SC.View.extend({
+ touchStart: function(touch) {
+ var f = this.get("frame");
+ this._touch = {
+ start: { x: touch.pageX, y: touch.pageY },
+ ourStart: { x: f.x, y: f.y, width: f.width, height: f.height }
+ };
+ return YES; // or we won't get touchesDragged
+ },
+
+ touchesDragged: function(evt, touches) {
+ var t = this._touch;
+ this.set("layout", {
+ left: t.ourStart.x + evt.pageX - t.start.x,
+ top: t.ourStart.y + evt.pageY - t.start.y,
+ width: t.ourStart.width,
+ height: t.ourStart.height
+ });
+ }
+});
+var MyExampleView = SC.View.extend({
+ backgroundColor: "white",
+ childViews: "dot1 dot2".w(),
+ dot1: Dot.design({
+ backgroundColor: "red",
+ layout: { left: 10, top: 10, width: 100, height: 100 }
+ }),
+ dot2: Dot.design({
+ backgroundColor: "blue",
+ layout: { right: 10, bottom: 10, width: 100, height: 100 }
+ })
});
// bootstrap code :)
exports.getDemoView = function() {
return MyExampleView;
};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
-var MyExampleView = SC.View.extend({
- backgroundColor: "red"
-});
-
-// bootstrap code :)
-exports.getDemoView = function() {
- return MyExampleView;
-};
-
View
5 themes/pig/resources/theme.css
@@ -13,7 +13,10 @@
font-size: 16px;
}
.sc-theme .sc-view.ace.light.pig.sc-collection-view.sc-list-view.sc-source-list.desk .disclosure { display: none; }
-.sc-theme .sc-view.ace.light.pig.sc-static-content-view { padding: 1em; }
+.sc-theme .sc-view.ace.light.pig.sc-static-content-view .article {
+ padding: 3em;
+ padding-top: 100px;
+}
.sc-theme .sc-view.ace.light.pig.sc-toolbar-view .sc-label-view {
font-size: 20px;
color: #aaaaaa;
View
8 themes/pig/src/static-content.css
@@ -1,3 +1,5 @@
-@view(sc-static-content-view) {
- padding: 1em;
-}
+@view(sc-static-content-view) .article {
+ padding: 3em;
+ padding-top: 100px;
+}
+

0 comments on commit 922f4c1

Please sign in to comment.