(X)HTML5 validation results for http://intertwingly.net/blog/index.html5

Validator Input

The document is valid XHTML5 + ARIA + SVG 1.1 + MathML 2.0 (subject to the utter previewness of this service).

Source

  1. <!DOCTYPE html>
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
  3. <head>
  4. <title>Sam Ruby</title>
  5. <link rel="alternate" type="application/atom+xml" title="It&#8217;s just data" href="http://intertwingly.net/blog/index.atom"/>
  6. <link rel="openid.server" href="http://intertwingly.net/id/"/>
  7. <link rel="openid2.provider" href="http://intertwingly.net/id/"/>
  8. <link rel="search" type="application/opensearchdescription+xml" href="http://intertwingly.net/search/" title="intertwingly blog search"/>
  9. <link rel="stylesheet" href="/css/blog5.css" type="text/css" media="screen"/>
  10. <link rel="stylesheet" href="/css/print.css" type="text/css" media="print"/>
  11. <link rel="shortcut icon" href="/favicon.ico"/>
  12. <meta name="ICBM" content="35.708298,-78.695515"/>
  13. <script type="text/javascript" src="/js/localize_dates.js"></script>
  14. </head>
  15. <body>
  16. <header>
  17. <h1><a href="http://intertwingly.net/blog/">intertwingly</a></h1>
  18. <form method="get" action="http://intertwingly.net/blog/">
  19. <div>
  20. <label for="q">Search</label>
  21. <input type="text" id="q" name="q" value=""/>
  22. </div>
  23. </form>
  24. <p>It&#8217;s just data</p>
  25. </header>
  26. <article>
  27. <header>
  28. <h3><a rel="bookmark" href="http://intertwingly.net/blog/2014/10/21/pegurl-js">pegurl.js</a></h3>
  29. <hr/><div><time title="GMT" datetime="2014-10-21T15:17:36Z">Tue 21 Oct 2014 at 15:17</time></div>
  30. </header>
  31. <svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100">
  32. <path d="M38,38c0-12,24-15,23-2c0,9-16,13-16,23v7h11v-4c0-9,17-12,17-27c-2-22-45-22-45,3zM45,70h11v11h-11z" fill="#371"></path>
  33. <circle cx="50" cy="50" r="45" fill="none" stroke="#371" stroke-width="10"></circle>
  34. </svg>
  35. <p><a href="http://intertwingly.net/projects/pegurl/">pegurl.js</a> is the result of two days worth of work.&#160; While it is undoubtedly buggy and incomplete, it does pass 255 out of <a href="https://raw.githubusercontent.com/w3c/web-platform-tests/master/url/urltestdata.txt">256 tests</a> and that <a href="http://krijnhoetmer.nl/irc-logs/whatwg/20141021#l-399">last test is wrong</a>.&#160; For comparison: <a href="http://intertwingly.net/stories/2014/10/16/urltest-results/">results from other user agents</a>.</p>
  36. <p>Current work products:</p>
  37. <ul>
  38. <li>Source: <a href="http://intertwingly.net/projects/pegurl/url.js">API</a>, <a href="http://intertwingly.net/projects/pegurl/url.pegjs">grammar</a>; the latter based on <a href="http://pegjs.majda.cz/">PEG.js</a></li>
  39. <li><a href="http://intertwingly.net/projects/pegurl/liveview.html">LiveViewer</a>.&#160; Differences mean that either or both of the following are true: (a) pegurl.js doesn&#8217;t match the Url Standard or (b) the Url Standard doesn&#8217;t match your browser.</li>
  40. <li><a href="http://intertwingly.net/stories/2014/10/20/Url.xhtml">Grammar expressed in the form of railroad diagrams</a>.&#160; Produced using <a href="https://twitter.com/peg_js/status/329493915881320448">Gunther Rademacher&#8217;s converter</a>.</li>
  41. </ul>
  42. <p>Future work:</p>
  43. <ul>
  44. <li>The implementation is incomplete, in particular, much of the character encoding logic and IP address parsing is just roughed id at this point.</li>
  45. <li>I&#8217;d like to propose a number of changes to the test results; mostly to more closely match existing browser behavior, and perhaps where possible to make the implementation logic less convoluted.&#160; Meanwhile, I felt that it was important to have a faithful baseline implemented so that I could experiment with changes and see if there were any unintended consequences to those changes.</li>
  46. <li>More tests!&#160; There&#8217;s no such thing as too many tests.</li>
  47. <li><a href="https://www.w3.org/Bugs/Public/show_bug.cgi?id=25946">Rewrite URL parser</a>.&#160; I suspect that the railroad diagrams (converted to <a href="https://github.com/tabatkins/bikeshed">bikeshed</a>?) plus the parts of the grammar contained in curly braces expressed in prose would be more comprehensible and maintainable than the current state machine approach.</li>
  48. </ul>
  49. <footer>
  50. <a title="pegurl.js" href="http://intertwingly.net/blog/2014/10/21/pegurl-js#comments">1 comment</a>
  51. </footer>
  52. </article>
  53. <article>
  54. <header>
  55. <h3><a rel="bookmark" href="http://intertwingly.net/blog/2014/10/02/WHATWG-URL-vs-IETF-URI">WHATWG URL vs IETF URI</a></h3>
  56. <hr/><div><time title="GMT" datetime="2014-10-02T20:46:29Z">Thu 02 Oct 2014 at 20:46</time></div>
  57. </header>
  58. <svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100">
  59. <path d="M38,38c0-12,24-15,23-2c0,9-16,13-16,23v7h11v-4c0-9,17-12,17-27c-2-22-45-22-45,3zM45,70h11v11h-11z" fill="#371"></path>
  60. <circle cx="50" cy="50" r="45" fill="none" stroke="#371" stroke-width="10"></circle>
  61. </svg>
  62. <p>I&#8217;ve been looking into differences between the <a href="https://url.spec.whatwg.org/">WHATWG URL Living Standard</a> and the combination of <a href="http://www.ietf.org/rfc/rfc3986.txt">RFC 3986</a> and <a href="http://www.ietf.org/rfc/rfc3987.txt">RFC 3987</a>.&#160; I&#8217;ve come up with an indirect but effective way to identify the differences using <a href="https://raw.githubusercontent.com/w3c/web-platform-tests/master/url/urltestdata.txt">urltestdata.txt</a> and <a href="https://github.com/sporkmonger/addressable">addressable</a>.</p>
  63. <p><a href="http://intertwingly.net/blog/2014/10/02/WHATWG-URL-vs-IETF-URI">...</a></p>
  64. <footer>
  65. <a title="WHATWG URL vs IETF URI" href="http://intertwingly.net/blog/2014/10/02/WHATWG-URL-vs-IETF-URI#comments">9 comments</a>
  66. </footer>
  67. </article>
  68. <article>
  69. <header>
  70. <h3><a rel="bookmark" href="http://intertwingly.net/blog/2014/09/29/Dreamhost-upgrade">Dreamhost upgrade</a></h3>
  71. <hr/><div><time title="GMT" datetime="2014-09-29T23:45:08Z">Mon 29 Sep 2014 at 23:45</time></div>
  72. </header>
  73. <svg xmlns='http://www.w3.org/2000/svg' width="100" height="100" viewBox="0 0 100 100">
  74. <rect fill="#039" x="0" y="3" height="95" width="95" rx="15"></rect>
  75. <path d='M20,56L19,35C19,30,27,20,33,21L55,21A30,30,0,0,1,20,56Z' fill='#369' stroke='#369' stroke-linejoin='round' stroke-width='5px'></path>
  76. <path d='M17,67A37,37,0,0,0,67,18A36,36,0,1,1,17,67' fill='#FFF'></path>
  77. </svg>
  78. <p>Dreamhost <a href="http://www.dreamhoststatus.com/2014/09/22/upgrading-100-shared-web-hosting-servers-to-ubuntu-12-04-precise-september-28th-8pm-1am-pdt/">upgraded my server to Ubuntu 12.04</a>.&#160; I noticed things breaking in preparation for the move, and things that broke after the move.&#160; If you see something not working correctly, please let me know.</p>
  79. <footer>
  80. <a title="Dreamhost upgrade" href="http://intertwingly.net/blog/2014/09/29/Dreamhost-upgrade#comments">3 comments</a>
  81. </footer>
  82. </article>
  83. <article>
  84. <header>
  85. <h3><a rel="bookmark" href="http://intertwingly.net/blog/2014/09/16/The-URL-Mess">The URL Mess</a></h3>
  86. <hr/><div><time title="GMT" datetime="2014-09-16T18:49:07Z">Tue 16 Sep 2014 at 18:49</time></div>
  87. </header>
  88. <svg xmlns='http://www.w3.org/2000/svg' width="94" height="106" viewBox="0 0 94 106">
  89. <path d='M11,94l-9-91h90l-8,91l-37,10' fill='#E44D26'></path>
  90. <path d='M47,97l30-9l7-78h-37' fill='#F16529'></path>
  91. <path d='M47,44h-15l-1-11h16v-12h-28l3,34h25M47,73l-12.5-3l-1-9h-11l1.5,18l23,6' fill='#EBEBEB'></path>
  92. <path d='M47,44v11h14l-1,15l-13,3v12l23-6l3-35M47,21v12h27l1-12' fill='#FFF'></path>
  93. </svg><p><b>tl;dr</b>: shipping is a feature; getting the URL feature well-defined should not block HTML5 given the nature of the HTML5 reference to the URL spec.</p>
  94. <p>This is a subject desperately in need of an elevator pitch.&#160; From my&#160; perspective, here are the three top things that need to be understood.</p>
  95. <p><a href="http://intertwingly.net/blog/2014/09/16/The-URL-Mess">...</a></p>
  96. <footer>
  97. <a title="The URL Mess" href="http://intertwingly.net/blog/2014/09/16/The-URL-Mess#comments">18 comments</a>
  98. </footer>
  99. </article>
  100. <article>
  101. <header>
  102. <h3><a rel="bookmark" href="http://intertwingly.net/blog/2014/06/16/New-Toy">New Toy</a></h3>
  103. <hr/><div><time title="GMT" datetime="2014-06-16T14:57:35Z">Mon 16 Jun 2014 at 14:57</time></div>
  104. </header>
  105. <svg xmlns='http://www.w3.org/2000/svg' width="90" height="100" viewBox="0 0 90 100">
  106. <path d='M62,0c2,10-9,24-20,24c-3-14,9-22,20-24M5,36c5-8,13-12,21-12c7,0,12,4,19,4c6,0,10-4,19-4c6,0,14,3,19,10c-16,4-15,35,3,39c-7,17-18,27-24,27c-7,0-8-5-17-5c-9,0-11,5-17,5c-7-1-13-7-17-13c-9-10-15-40-6-51' fill='#AAA'></path>
  107. </svg><p>New laptop for work: MBP 15.4/2.6/16GB/1TBFlash.&#160; First time I ever went the Apple route.&#160; I did so as I figured with those specs, I could run multiple operating systems simultaneously.&#160; So far, so good.&#160; I&#8217;m using VirtualBox to do so.</p>
  108. <p>Notes for Mac OS X 10.9, Ubuntu 14.04, Windows 8.1, and Red Hat Enterprise Linux 6.5.</p>
  109. <p><a href="http://intertwingly.net/blog/2014/06/16/New-Toy">...</a></p>
  110. <footer>
  111. <a title="New Toy" href="http://intertwingly.net/blog/2014/06/16/New-Toy#comments">5 comments</a>
  112. </footer>
  113. </article>
  114. <article>
  115. <header>
  116. <h3><a rel="bookmark" href="http://intertwingly.net/blog/2014/06/06/Travisizing-My-Projects">Travisizing My Projects.</a></h3>
  117. <hr/><div><time title="GMT" datetime="2014-06-07T01:58:30Z">Sat 07 Jun 2014 at 01:58</time></div>
  118. </header>
  119. <svg xmlns='http://www.w3.org/2000/svg' width="100" height="100" viewBox="0 0 100 100">
  120. <defs>
  121. <linearGradient gradientUnits='userSpaceOnUse' id='travisGrad'
  122. x1='4' x2='4' y1='4' y2='96'>
  123. <stop offset='0' stop-color='#d8432f'></stop>
  124. <stop offset='1' stop-color='#c52127'></stop>
  125. </linearGradient>
  126. </defs>
  127. <rect fill='url(#travisGrad)' height='100' width='100' ry='7'></rect>
  128. <path d='M36,72h7v-45h-10v9h-15v-22h65v22h-15v-9h-10v45h6v13h-28z'
  129. fill-opacity='0' stroke='#FFF' stroke-miterlimit='4' stroke-width='2'></path>
  130. </svg>
  131. <p>Today, I got a <a href="https://github.com/rubys/nokogumbo/pull/7">pull request</a> from <a href="https://github.com/rgrove">Ryan Grove</a> to make <a href="https://github.com/rubys/nokogumbo/">nokogumbo</a> work on Ruby 2.1 and add <a href="https://travis-ci.org/rubys/nokogumbo">Travis support</a>.&#160; Very cool.&#160; I was surprised how easy it was to set up.</p>
  132. <p>A few hours later I got <a href="https://github.com/rubys/ruby2js/">ruby2js</a> to work on Ruby 2.0 and 2.1 and added <a href="https://travis-ci.org/rubys/ruby2js">Travis support</a>.&#160; <a href="https://github.com/rubys/wunderbar/">Wunderbar</a> <a href="https://travis-ci.org/rubys/wunderbar">worked</a> right out of the box.</p>
  133. <footer>
  134. <a title="Travisizing My Projects." href="http://intertwingly.net/blog/2014/06/06/Travisizing-My-Projects#comments">2 comments</a>
  135. </footer>
  136. </article>
  137. <article>
  138. <header>
  139. <h3><a rel="bookmark" href="http://intertwingly.net/blog/2014/05/12/Frameworks-as-Stepping-Stones">Frameworks as Stepping Stones</a></h3>
  140. <hr/><div><time title="GMT" datetime="2014-05-12T23:12:16Z">Mon 12 May 2014 at 23:12</time></div>
  141. </header>
  142. <svg xmlns='http://www.w3.org/2000/svg' width="94" height="106" viewBox="0 0 94 106">
  143. <path d='M11,94l-9-91h90l-8,91l-37,10' fill='#E44D26'></path>
  144. <path d='M47,97l30-9l7-78h-37' fill='#F16529'></path>
  145. <path d='M47,44h-15l-1-11h16v-12h-28l3,34h25M47,73l-12.5-3l-1-9h-11l1.5,18l23,6' fill='#EBEBEB'></path>
  146. <path d='M47,44v11h14l-1,15l-13,3v12l23-6l3-35M47,21v12h27l1-12' fill='#FFF'></path>
  147. </svg><p><a href="http://bitworking.org/news/2014/05/zero_framework_manifesto">Joe Gregorio</a>: <em>But something else has happened over the past ten years; browsers got better. Their support for standards improved, and now there are evergreen browsers: automatically updating browsers, each version more capable and standards compliant than the last. With newer standards like <a href="http://w3c.github.io/webcomponents/spec/imports/">HTML Imports</a>, <a href="http://wiki.ecmascript.org/doku.php?id=harmony:observe">Object.observe</a>, <a href="http://www.html5rocks.com/en/tutorials/es6/promises/">Promises</a>, and <a href="http://www.w3.org/TR/html5/scripting-1.html#the-template-element">HTML Templates</a> I think it&#8217;s time to rethink the model of JS frameworks. There&#8217;s no need to invent yet another way to do something, just use HTML+CSS+JS.</em></p>
  148. <p>I&#8217;m curious as to where Joe believes that these features came from.</p>
  149. <p><a href="http://intertwingly.net/blog/2014/05/12/Frameworks-as-Stepping-Stones">...</a></p>
  150. <footer>
  151. <a title="Frameworks as Stepping Stones" href="http://intertwingly.net/blog/2014/05/12/Frameworks-as-Stepping-Stones#comments">3 comments</a>
  152. </footer>
  153. </article>
  154. <article>
  155. <header>
  156. <h3><a rel="bookmark" href="http://intertwingly.net/blog/2014/04/07/Technology-behind-Whimsy-apache-org">Technology behind Whimsy.apache.org</a></h3>
  157. <hr/><div><time title="GMT" datetime="2014-04-07T17:14:17Z">Mon 07 Apr 2014 at 17:14</time></div>
  158. </header>
  159. <svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100">
  160. <path d="M4,14h92" stroke="#4682b4" stroke-width="5"></path>
  161. <text x="50" y="90" font-size="90" fill="#5f9ea0" font-family="serif" text-anchor="middle"><![CDATA[W]]></text>
  162. </svg>
  163. <p><a href="http://intertwingly.net/slides/2014/apachecon-whimsy/">Slides</a> for my <a href="http://apacheconnorthamerica2014.sched.org/event/036138880bfec3a2a3b10101a158189b#.U0K-XabwDzo">ApacheCon talk</a>.&#160; Right/left goes to the next/previous section, up/down for navigating with a section.</p>
  164. <p>The demo is unfortunately only available to ASF committers (for privacy reasons, as it exposes email addresses).</p>
  165. <footer>
  166. <a title="Technology behind Whimsy.apache.org" href="http://intertwingly.net/blog/2014/04/07/Technology-behind-Whimsy-apache-org#comments">Add comment</a>
  167. </footer>
  168. </article>
  169. <article>
  170. <header>
  171. <h3><a rel="bookmark" href="http://intertwingly.net/blog/2014/03/14/Angular-rb-example">Angular.rb example</a></h3>
  172. <hr/><div><time title="GMT" datetime="2014-03-14T12:49:42Z">Fri 14 Mar 2014 at 12:49</time></div>
  173. </header>
  174. <svg xmlns='http://www.w3.org/2000/svg' width="97" height="103" viewBox="0 0 97 103">
  175. <path d='M48,0l-48,17l8,63l40,23l41-23l8-63z' fill='#B2B2B2'></path>
  176. <path d='M92,20l-44-15v92l37-20z' fill='#B52E31'></path>
  177. <path d='M5,21l7,56l36,20v-92z' fill='#E23237'></path>
  178. <path d='M58,51l-10-21l-9,21zM62,60h-27l-6,15h-11l30-66l31,66h-10z' fill='#F2F2F2'></path>
  179. <path d='M48,9v21l10,21h-10v9h14l7,15h10z' fill='#B2B2B2'></path>
  180. </svg><p><a href="https://twitter.com/timbray/status/444375162167623681">Tim Bray</a>: <em>If hating this is wrong, I don&#8217;t want to be right.</em></p>
  181. <p>Perhaps you would like this better?&#160; :-)</p>
  182. <p><a href="http://intertwingly.net/blog/2014/03/14/Angular-rb-example">...</a></p>
  183. <footer>
  184. <a title="Angular.rb example" href="http://intertwingly.net/blog/2014/03/14/Angular-rb-example#comments">3 comments</a>
  185. </footer>
  186. </article>
  187. <article>
  188. <header>
  189. <h3><a rel="bookmark" href="http://intertwingly.net/blog/2014/03/13/Time-Warner-Rate-Hike">Time Warner Rate Hike</a></h3>
  190. <hr/><div><time title="GMT" datetime="2014-03-13T23:48:45Z">Thu 13 Mar 2014 at 23:48</time></div>
  191. </header>
  192. <svg xmlns='http://www.w3.org/2000/svg' width="108" height="93" viewBox="0 0 108 93">
  193. <path d='M17,27c-3,3-5,6-10,11c-2,1-3,1-5,0c-4-4-2-7,8-17c11-11,24-19,36-20c13-2,30,1,43,11c7,6,15,14,19,21c-4,7-9,13-14,17c-5,5-11,8-16,10c-13,4-28,3-36-10c-2-4-2-8,0-12c2-5,8-9,13-9c4,0,9,2,11,7c1,2,1,6-1,8c-1,1-6,2-7-2c0-2-0-4-2-4c-4,0-7,3-6,8c1,3,4,6,11,7c3,0,7-1,11-6c3-4,3-11,0-15c-4-7-10-10-18-10c-9,0-17,5-21,14c-3,7-5,17,0,28c4,8,11,13,17,16c5,3,16,4,17,8c0,3-2,5-4,5c-17-3-31-11-37-25c-7-13-6-30,2-41c5-7,13-12,20-13c19-5,38,9,35,28c-1,3-2,6-4,8c0,1,0,1-1,1l2-1c7-4,13-10,17-17c-10-18-32-27-49-24c-14,2-23,10-31,18' fill='#0056a2'></path>
  194. </svg>
  195. <p>Backdrop: </p>
  196. <ul>
  197. <li>Google Fiber announces it is considering <a href="https://fiber.google.com/newcities/">new cities, including Raleigh</a>.</li>
  198. <li>RST announces <a href="http://www.newsobserver.com/2014/03/11/3693348/rst-fiber-hopes-to-beat-time-warner.html">gigabit service for Raleigh</a>, starting as early as May.</li>
  199. <li>My current service is &#8220;Standard Cable&#8221; (70+ channels, no premium ones) and &#8220;Standard Internet&#8221; (nominally 15 Mbps up, 1 Mbs down).&#160; At the end of the month, I will have had basic cable with Time Warner at the same location for 22 contiguous years, and standard Internet for more than half of that.</li>
  200. </ul>
  201. <p>With that context, today I got in the mail notification that my rates are set to go up by 60% as my &#8220;Promotional&#8221; rates (Seriously?&#160; A twenty two year long promotion?) will be expiring.&#160; After spoofing my User Agent as the chat function doesn&#8217;t recognize my browser/operating system combination, I verified this is indeed the plan with &#8220;Veronica&#8221;.&#160; I was then provided a transcript and directed to an online survey when promptly logged me off without submitting my feedback once I had completed it.</p>
  202. <p>I plan to follow up with @TWC_Help.</p>
  203. <footer>
  204. <a title="Time Warner Rate Hike" href="http://intertwingly.net/blog/2014/03/13/Time-Warner-Rate-Hike#comments">5 comments</a>
  205. </footer>
  206. </article>
  207. <article>
  208. <header>
  209. <h3><a rel="bookmark" href="http://intertwingly.net/blog/2014/01/26/Wunderbar-JQuery-filter">Wunderbar JQuery filter</a></h3>
  210. <hr/><div><time title="GMT" datetime="2014-01-26T17:55:05Z">Sun 26 Jan 2014 at 17:55</time></div>
  211. </header>
  212. <svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100">
  213. <path d="M4,14h92" stroke="#4682b4" stroke-width="5"></path>
  214. <text x="50" y="90" font-size="90" fill="#5f9ea0" font-family="serif" text-anchor="middle"><![CDATA[W]]></text>
  215. </svg>
  216. <p>I got a suggestion to look into <a href="http://facebook.github.io/react/">React.js</a>, a JavaScript library which is focused on the problemspace that Angular.js&#8217;s <a href="http://docs.angularjs.org/guide/directive">directive</a> addresses.</p>
  217. <p>One of the ways React.js facilitates the creation of web components is via <a href="http://facebook.github.io/react/docs/jsx-in-depth.html">JSX</a> which mixes &#8220;XML&#8221; with JavaScript.&#160; The &#8220;XML&#8221; is &#8220;desugared&#8221; into <code>React.DOM</code> calls.</p>
  218. <p>Based on this idea, I created a <a href="https://github.com/rubys/wunderbar/blob/master/lib/wunderbar/jquery/filter.rb">Wunderbar jquery filter</a> to &#8220;desugar&#8221; Wunderbar calls into JQuery calls.&#160; The <a href="https://github.com/rubys/wunderbar/blob/master/test/test_jquery_filter.rb">tests</a> show some of the conversions.&#160; I also updated my Bootstrap modal dialog directive to make use of this: <a href="https://svn.apache.org/repos/infra/infrastructure/trunk/projects/whimsy/www/test/board/agenda/js/directives._js?p=894265">before</a> =&gt; <a href="https://svn.apache.org/repos/infra/infrastructure/trunk/projects/whimsy/www/test/board/agenda/js/directives._js?p=895482">after</a>.</p>
  219. <footer>
  220. <a title="Wunderbar JQuery filter" href="http://intertwingly.net/blog/2014/01/26/Wunderbar-JQuery-filter#comments">Add comment</a>
  221. </footer>
  222. </article>
  223. <article>
  224. <header>
  225. <h3><a rel="bookmark" href="http://intertwingly.net/blog/2014/01/23/Ruby2js-underscore-js">Ruby2js += underscore.js</a></h3>
  226. <hr/><div><time title="GMT" datetime="2014-01-23T14:52:24Z">Thu 23 Jan 2014 at 14:52</time></div>
  227. </header>
  228. <svg xmlns='http://www.w3.org/2000/svg' width="100" height="100" viewBox="0 0 100 100">
  229. <path d='M20,100l74-5l6-75zM61,35l37-2l-29-24z' fill='#b11'></path>
  230. <path d='M21,100l74-5l-47-4zM98,33c4-12,5-29-14-33l-15,9l29,24z' fill='#811'></path>
  231. <path d='M7,67l14,33l11-38z' fill='#d44'></path>
  232. <path d='M29,61l42,13l-10-42zM56,0h28l-16,10zM1,51l-1,29l7-13z' fill='#c22'></path>
  233. <path d='M32,61l39,13c-14,13-30,24-50,26z' fill='#a00'></path>
  234. <path d='M61,35l10,39l17-23zM32,61l16,30c9-5,16-11,23-17l-39-13z' fill='#900'></path>
  235. <path d='M61,35l27,17l10-20l-37,3z' fill='#800'></path>
  236. <path d='M71,74l23,21l-6-44zM0,80c1,19,15,20,21,20l-14-33l-7,13zM7,67l-2,26c4,6,9,7,15,6c-4-11-13-32-13-32zM69,9l30,4c-1-7-6-11-15-13l-15,9z' fill='#911'></path>
  237. <path
  238. d='M1,51l6,16l25-5l29-27l8-26l-13-9l-22,8c-6,7-20,19-20,19c-1,1-9,16-13,24z'
  239. fill='#f84'></path>
  240. <path d='M21,21c15-14,34-23,42-16c7,8-1,26-16,40c-14,15-33,24-41,17c-7-7,1-26,15-41z' fill='#F0DB4F'></path>
  241. <g transform="rotate(307,33,12),scale(0.45)">
  242. <path d='M26,84l8-5c1,3,3,5,6,5c3,0,5-1,5-6v-32h9v32c0,10-5,14-14,14c-7,0-11-4-14-8' id='j'></path>
  243. <path d='M60,83l7-5c2,3,5,6,9,6c4,0,7-2,7-5c0-3-3-4-7-6l-2-1c-7-3-12-7-12-14c0-7,6-13,14-13c6,0,10,2,13,8l-7,5c-1-3-3-4-6-4c-3,0-4,1-4,4c0,2,1,4,5,5l3,1c8,4,12,7,12,15c0,9-6,13-15,13c-9,0-15-4-17-9' id='s'></path>
  244. </g>
  245. </svg><p>When compared to Ruby, JavaScript doesn&#8217;t have as much functional support built in.&#160; <a href="http://underscorejs.org/">Underscore.js</a> fills that gap for many.&#160; Underscore.js, in turn, was inspired by Ruby&#8217;s <a href="http://ruby-doc.org/core/classes/Enumerable.html">Enumerable</a> module.&#160; A <a href="https://github.com/rubys/ruby2js/blob/master/lib/ruby2js/filter/underscore.rb">underscore filter</a> (<a href="https://github.com/rubys/ruby2js/blob/master/spec/underscore_spec.rb">tests</a>) completes the mapping.</p>
  246. <p>In many cases, the resulting JavaScript is formed by applying a number of filter rules.</p>
  247. <p><a href="http://intertwingly.net/blog/2014/01/23/Ruby2js-underscore-js">...</a></p>
  248. <footer>
  249. <a title="Ruby2js += underscore.js" href="http://intertwingly.net/blog/2014/01/23/Ruby2js-underscore-js#comments">Add comment</a>
  250. </footer>
  251. </article>
  252. <article>
  253. <header>
  254. <h3><a rel="bookmark" href="http://intertwingly.net/blog/2014/01/18/Ruby2JS-Attribute-Property-support">Ruby2JS Attribute=&gt;Property support</a></h3>
  255. <hr/><div><time title="GMT" datetime="2014-01-18T15:58:05Z">Sat 18 Jan 2014 at 15:58</time></div>
  256. </header>
  257. <svg xmlns='http://www.w3.org/2000/svg' width="100" height="100" viewBox="0 0 100 100">
  258. <path d='M20,100l74-5l6-75zM61,35l37-2l-29-24z' fill='#b11'></path>
  259. <path d='M21,100l74-5l-47-4zM98,33c4-12,5-29-14-33l-15,9l29,24z' fill='#811'></path>
  260. <path d='M7,67l14,33l11-38z' fill='#d44'></path>
  261. <path d='M29,61l42,13l-10-42zM56,0h28l-16,10zM1,51l-1,29l7-13z' fill='#c22'></path>
  262. <path d='M32,61l39,13c-14,13-30,24-50,26z' fill='#a00'></path>
  263. <path d='M61,35l10,39l17-23zM32,61l16,30c9-5,16-11,23-17l-39-13z' fill='#900'></path>
  264. <path d='M61,35l27,17l10-20l-37,3z' fill='#800'></path>
  265. <path d='M71,74l23,21l-6-44zM0,80c1,19,15,20,21,20l-14-33l-7,13zM7,67l-2,26c4,6,9,7,15,6c-4-11-13-32-13-32zM69,9l30,4c-1-7-6-11-15-13l-15,9z' fill='#911'></path>
  266. <path
  267. d='M1,51l6,16l25-5l29-27l8-26l-13-9l-22,8c-6,7-20,19-20,19c-1,1-9,16-13,24z'
  268. fill='#f84'></path>
  269. <path d='M21,21c15-14,34-23,42-16c7,8-1,26-16,40c-14,15-33,24-41,17c-7-7,1-26,15-41z' fill='#F0DB4F'></path>
  270. <g transform="rotate(307,33,12),scale(0.45)">
  271. <path d='M26,84l8-5c1,3,3,5,6,5c3,0,5-1,5-6v-32h9v32c0,10-5,14-14,14c-7,0-11-4-14-8' id='j_2'></path>
  272. <path d='M60,83l7-5c2,3,5,6,9,6c4,0,7-2,7-5c0-3-3-4-7-6l-2-1c-7-3-12-7-12-14c0-7,6-13,14-13c6,0,10,2,13,8l-7,5c-1-3-3-4-6-4c-3,0-4,1-4,4c0,2,1,4,5,5l3,1c8,4,12,7,12,15c0,9-6,13-15,13c-9,0-15-4-17-9' id='s_2'></path>
  273. </g>
  274. </svg>
  275. <p><a href="http://rubygems.org/gems/ruby2js/">Ruby2JS</a> now maps Ruby attributes to JavaScript properties.</p>
  276. <p><a href="http://intertwingly.net/blog/2014/01/18/Ruby2JS-Attribute-Property-support">...</a></p>
  277. <footer>
  278. <a title="Ruby2JS Attribute=&gt;Property support" href="http://intertwingly.net/blog/2014/01/18/Ruby2JS-Attribute-Property-support#comments">Add comment</a>
  279. </footer>
  280. </article>
  281. <article>
  282. <header>
  283. <h3><a rel="bookmark" href="http://intertwingly.net/blog/2014/01/13/HTML5-Mode-Links">HTML5 Mode Links</a></h3>
  284. <hr/><div><time title="GMT" datetime="2014-01-13T17:46:19Z">Mon 13 Jan 2014 at 17:46</time></div>
  285. </header>
  286. <svg xmlns='http://www.w3.org/2000/svg' width="97" height="103" viewBox="0 0 97 103">
  287. <path d='M48,0l-48,17l8,63l40,23l41-23l8-63z' fill='#B2B2B2'></path>
  288. <path d='M92,20l-44-15v92l37-20z' fill='#B52E31'></path>
  289. <path d='M5,21l7,56l36,20v-92z' fill='#E23237'></path>
  290. <path d='M58,51l-10-21l-9,21zM62,60h-27l-6,15h-11l30-66l31,66h-10z' fill='#F2F2F2'></path>
  291. <path d='M48,9v21l10,21h-10v9h14l7,15h10z' fill='#B2B2B2'></path>
  292. </svg>
  293. <p>Based on a suggestion by Tim Bray, I converted my board agenda Angular.js application to use <a href="http://docs.angularjs.org/guide/dev_guide.services.$location#hashbang-and-html5-modes">html5 mode</a>.&#160; The process was straightforward:</p>
  294. <p>1) add the following to your application configuration:</p>
  295. <pre class="code">$locationProvider.html5Mode(true).hashPrefix('!')</pre>
  296. <p>2) Add a <code>&lt;base&gt;</code> element to my generated HTML, indicating which part of my path was &#8220;owned&#8221; by the server.</p>
  297. <p>3) Convert my relative links.&#160; Based on how my application was structured:</p>
  298. <ul>
  299. <li><code>#/comments</code> became <code>comments</code></li>
  300. <li><code>#/</code> became <code>./</code></li>
  301. <li><code>js/app.js</code> became <code>../js/app.js</code></li>
  302. </ul>
  303. <p>I&#8217;ve not yet tested it with <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history#Browser_compatibility">Internet Explorer &lt;= 9</a>, but the <a href="http://docs.angularjs.org/guide/dev_guide.services.$location#hashbang-and-html5-modes_html5-mode_sending-links-among-different-browsers">Angular.js docs</a> indicate that it should work there too.</p>
  304. <footer>
  305. <a title="HTML5 Mode Links" href="http://intertwingly.net/blog/2014/01/13/HTML5-Mode-Links#comments">Add comment</a>
  306. </footer>
  307. </article>
  308. <article>
  309. <header>
  310. <h3><a rel="bookmark" href="http://intertwingly.net/blog/2014/01/09/Software-in-2014">Software in 2014</a></h3>
  311. <hr/><div><time title="GMT" datetime="2014-01-10T07:45:05Z">Fri 10 Jan 2014 at 07:45</time></div>
  312. </header>
  313. <svg xmlns='http://www.w3.org/2000/svg' width="97" height="103" viewBox="0 0 97 103">
  314. <path d='M48,0l-48,17l8,63l40,23l41-23l8-63z' fill='#B2B2B2'></path>
  315. <path d='M92,20l-44-15v92l37-20z' fill='#B52E31'></path>
  316. <path d='M5,21l7,56l36,20v-92z' fill='#E23237'></path>
  317. <path d='M58,51l-10-21l-9,21zM62,60h-27l-6,15h-11l30-66l31,66h-10z' fill='#F2F2F2'></path>
  318. <path d='M48,9v21l10,21h-10v9h14l7,15h10z' fill='#B2B2B2'></path>
  319. </svg>
  320. <p><a href="http://www.tbray.org/ongoing/When/201x/2014/01/01/Software-in-2014">Tim Bray</a>:
  321. <em>We’re at an inflection point in the practice of constructing software. Our
  322. tools are good, our server developers are happy, but when it comes to building
  323. client-side software, we really don’t know where we’re going or how to get
  324. there.</em></p>
  325. <p>While I agree with much of this post, I really don’t think the conclusion
  326. is as bad as Tim portrays things. I agree that there are good server side
  327. frameworks, and doing things like MVC is the way to go.</p>
  328. <p>
  329. I just happen to believe that this is true on the client too – including MVC.
  330. Not perfect, perhaps, but more than workable. And full disclosure, I’m firmly
  331. on the
  332. <em>HTML5-rocks</em>
  333. side of the fence.
  334. </p>
  335. <p><a href="http://intertwingly.net/blog/2014/01/09/Software-in-2014">...</a></p>
  336. <footer>
  337. <a title="Software in 2014" href="http://intertwingly.net/blog/2014/01/09/Software-in-2014#comments">2 comments</a>
  338. </footer>
  339. </article>
  340. <article>
  341. <header>
  342. <h3><a rel="bookmark" href="http://intertwingly.net/blog/2013/12/06/Wunderbar-Tutorial">Wunderbar Tutorial</a></h3>
  343. <hr/><div><time title="GMT" datetime="2013-12-07T02:10:14Z">Sat 07 Dec 2013 at 02:10</time></div>
  344. </header>
  345. <svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100">
  346. <path d="M4,14h92" stroke="#4682b4" stroke-width="5"></path>
  347. <text x="50" y="90" font-size="90" fill="#5f9ea0" font-family="serif" text-anchor="middle"><![CDATA[W]]></text>
  348. </svg>
  349. <p>I&#8217;ve begun work on a <a href="https://github.com/rubys/wunderbar/blob/master/docs/Introduction1.md#introduction-part-1">Wunderbar tutorial</a>.</p>
  350. <p>Feedback welcome.</p>
  351. <footer>
  352. <a title="Wunderbar Tutorial" href="http://intertwingly.net/blog/2013/12/06/Wunderbar-Tutorial#comments">Add comment</a>
  353. </footer>
  354. </article>
  355. <article>
  356. <header>
  357. <h3><a rel="bookmark" href="http://intertwingly.net/blog/2013/12/01/Angular-rb-update">Angular.rb update</a></h3>
  358. <hr/><div><time title="GMT" datetime="2013-12-01T15:26:09Z">Sun 01 Dec 2013 at 15:26</time></div>
  359. </header>
  360. <svg xmlns='http://www.w3.org/2000/svg' width="97" height="103" viewBox="0 0 97 103">
  361. <path d='M48,0l-48,17l8,63l40,23l41-23l8-63z' fill='#B2B2B2'></path>
  362. <path d='M92,20l-44-15v92l37-20z' fill='#B52E31'></path>
  363. <path d='M5,21l7,56l36,20v-92z' fill='#E23237'></path>
  364. <path d='M58,51l-10-21l-9,21zM62,60h-27l-6,15h-11l30-66l31,66h-10z' fill='#F2F2F2'></path>
  365. <path d='M48,9v21l10,21h-10v9h14l7,15h10z' fill='#B2B2B2'></path>
  366. </svg>
  367. <p>
  368. It does indeed turn out that <a href="https://github.com/rubys/ruby2js#filters">language macros</a> can reduce the amount of Angular.js <a href="https://github.com/angular/angular-phonecat/blob/step-11/app/js/services.js">boilerplate configuration</a> to a <a href="https://github.com/rubys/wunderbar/blob/master/demo/js/services._js">minimum</a>.&#160; In the process I&#8217;ve spun off <a href="https://github.com/rubys/ruby2js#ruby2js">ruby2js</a> is a standalone supporting library.</p>
  369. <footer>
  370. <a title="Angular.rb update" href="http://intertwingly.net/blog/2013/12/01/Angular-rb-update#comments">3 comments</a>
  371. </footer>
  372. </article>
  373. <article>
  374. <header>
  375. <h3><a rel="bookmark" href="http://intertwingly.net/blog/2013/11/11/Angular-rb">Angular.rb</a></h3>
  376. <hr/><div><time title="GMT" datetime="2013-11-11T20:16:16Z">Mon 11 Nov 2013 at 20:16</time></div>
  377. </header>
  378. <svg xmlns='http://www.w3.org/2000/svg' width="97" height="103" viewBox="0 0 97 103">
  379. <path d='M48,0l-48,17l8,63l40,23l41-23l8-63z' fill='#B2B2B2'></path>
  380. <path d='M92,20l-44-15v92l37-20z' fill='#B52E31'></path>
  381. <path d='M5,21l7,56l36,20v-92z' fill='#E23237'></path>
  382. <path d='M58,51l-10-21l-9,21zM62,60h-27l-6,15h-11l30-66l31,66h-10z' fill='#F2F2F2'></path>
  383. <path d='M48,9v21l10,21h-10v9h14l7,15h10z' fill='#B2B2B2'></path>
  384. </svg>
  385. <p>I&#8217;m looking into what it would take to make it easier to produce <a href="http://angularjs.org/">Angular.JS</a> client applications using a server coded in Ruby.&#160; The approach I&#8217;m taking is to convert idiomatic Ruby into idiomatic AngularJS JavaScript.</p>
  386. <p><a href="https://github.com/rubys/wunderbar/blob/master/demo/angularjs.rb">Demo</a>.&#160; Corresponds roughly to <a href="http://docs.angularjs.org/tutorial/step_04">tutorial step 4</a>.&#160; <a href="http://intertwingly.net/stories/2013/11/11/angularjs.html">Example output</a>.&#160; <a href="https://github.com/rubys/ruby2js/blob/master/spec/angularrb_spec.rb">Specs</a>.</p>
  387. <footer>
  388. <a title="Angular.rb" href="http://intertwingly.net/blog/2013/11/11/Angular-rb#comments">Add comment</a>
  389. </footer>
  390. </article>
  391. <article>
  392. <header>
  393. <h3><a rel="bookmark" href="http://intertwingly.net/blog/2013/11/04/Mavericks">Mavericks</a></h3>
  394. <hr/><div><time title="GMT" datetime="2013-11-04T16:33:35Z">Mon 04 Nov 2013 at 16:33</time></div>
  395. </header>
  396. <svg xmlns='http://www.w3.org/2000/svg' width="90" height="100" viewBox="0 0 90 100">
  397. <path d='M62,0c2,10-9,24-20,24c-3-14,9-22,20-24M5,36c5-8,13-12,21-12c7,0,12,4,19,4c6,0,10-4,19-4c6,0,14,3,19,10c-16,4-15,35,3,39c-7,17-18,27-24,27c-7,0-8-5-17-5c-9,0-11,5-17,5c-7-1-13-7-17-13c-9-10-15-40-6-51' fill='#AAA'></path>
  398. </svg>
  399. <p>Did a clean install of Mavericks on my test mac-mini.&#160; Things to be aware of for next time:</p>
  400. <pre class="code">xcode-select --install
  401. sudo ln -s /Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/ /Applications/Xcode.app/Contents/Developer/Toolchains/OSX10.9.xctoolchain
  402. sudo mkdir -p /usr/local/lib; sudo ln -s /usr/local/mysql/lib/libmysql* /usr/local/lib</pre>
  403. <footer>
  404. <a title="Mavericks" href="http://intertwingly.net/blog/2013/11/04/Mavericks#comments">1 comment</a>
  405. </footer>
  406. </article>
  407. <article>
  408. <header>
  409. <h3><a rel="bookmark" href="http://intertwingly.net/blog/2013/10/22/The-Pile-of-Poo-Test">The Pile of Poo Test&#8482;</a></h3>
  410. <hr/><div><time title="GMT" datetime="2013-10-22T13:20:25Z">Tue 22 Oct 2013 at 13:20</time></div>
  411. </header>
  412. <svg xmlns="http://www.w3.org/2000/svg" width="115" height="87" viewBox="0 0 115 87">
  413. <path d="M0,1v83h26c-10,0-22-11-22-21v-62zM22,1v53c0,16,22,16,22,0v-53zM41,84c10,0,22-11,22-21v-22l27,43zM60,1h30v20h19v-20h5v84h-5v-56h-19v18z" fill="#C60025"></path>
  414. </svg>
  415. <p><a href="http://mathiasbynens.be/notes/javascript-unicode">Mathias Bynens</a>: <em>Whenever you&#8217;re working on a piece of JavaScript code that deals with strings or regular expressions in some way, just add a unit test that contains a pile of poo (&#128169;) in a string, and see if anything breaks. It&#8217;s a quick, fun, and easy way to see if your code supports astral symbols. Once you&#8217;ve found a Unicode-related bug in your code, all you need to do is apply the techniques discussed in this post to fix it.</em></p>
  416. <footer>
  417. <a title="The Pile of Poo Test&#8482;" href="http://intertwingly.net/blog/2013/10/22/The-Pile-of-Poo-Test#comments">5 comments</a>
  418. </footer>
  419. </article>
  420. <aside>
  421. <h2>Nav Bar</h2>
  422. <nav>
  423. <ul>
  424. <li><a href="http://en.wikipedia.org/wiki/Sam_Ruby">About</a></li>
  425. <li><a href="http://twitter.com/samruby">Twitter</a></li>
  426. <li><a href="/blog/comments.html">Comments</a></li>
  427. <li><a id="navbar_register" href="/blog/registry/">Register</a></li>
  428. <li><a href="/stats/">Statistics</a></li>
  429. <li><a href="/blog/archives/">Archives</a></li>
  430. <li><a href="http://planet.intertwingly.net/">Planet</a></li>
  431. <li><a href="http://code.intertwingly.net/public/">Code</a></li>
  432. <li><a href="http://www.pragprog.com/titles/rails4/agile-web-development-with-rails-4th-edition">Rails</a></li>
  433. <li><a href="http://www.oreilly.com/catalog/9780596529260/">RESTful</a></li>
  434. <li><a href="/blog/2005/05/16/Disclaim-This">Disclaimer</a></li>
  435. </ul>
  436. </nav>
  437. </aside>
  438. </body>
  439. </html>

Total execution time 3102 milliseconds.


About this ServiceMore options