new blog post, tweak style, minor fixes

assets/blog.css

@@ -71,15 +71,15 @@ a.img { border: none }
 #posts { border-left: solid 0.15em #999
        ; width: 80%
        ; min-width: 400px
-       ; max-width: 800px
+       ; max-width: 680px
        ; margin: 4em auto 2em
-       ; padding: 0 3em
+       ; padding: 0 5%
        ; font-size: 1.2em
+       ; line-height: 1.4em
        }
 
 article { color: #222
         ; padding-bottom: 1em
-        ; line-height: 1.2em
         }
 
 article:last-child { padding-bottom: 0
@@ -88,6 +88,7 @@ article:last-child { padding-bottom: 0
 
 article h1 { text-align: left
            ; font-size: 2em
+	   ; line-height: 1.1em
            ; font-weight: normal
            ; color: #222
            ; margin: 1em 0
@@ -167,6 +168,8 @@ input[type=submit]:active,
                ; padding: 2em 0
                }
 
+#comments-spinner { text-align: center }
+
 #comments { width: 70%
 	  ; max-width: 400px
 	  ; margin: 0 auto

assets/blog.js

@@ -55,6 +55,17 @@
 
     $('#comment-form').submit(function() {
       var comment = $(this).serializeObject()
+      comment.name = (comment.name || '').trim() || 'anonymous'
+      comment.url = (comment.url || '').trim()
+      if (comment.url && !comment.url.match(/^https?:\/\//)) {
+          comment.url = 'http://' + comment.url
+      }
+      comment.body = comment.body || ''
+      if (!comment.body) {
+          alert("is that all you have to say?")
+          return false
+      }
+
       var options = { method: 'POST'
                     , uri: postCommentURL()
                     , body: JSON.stringify(comment)
@@ -63,13 +74,20 @@
         if (err) {
           console.dir(err)
           alert('derp')
-          return
+          return false
         }
 
         // FIXME check for error, how do we get the returned status code?
 
+        $('#comment-form').get(0).reset()
+
         comment.timestamp = +new Date()
         comment.html = showdown.makeHtml(comment.body)
+        comment.name = (comment.name || '').trim() || 'anonymous'
+        comment.url = (comment.url || '').trim()
+        if (comment.url && !comment.url.match(/^https?:\/\//)) {
+            comment.url = 'http://' + comment.url
+        }
         $('#comments').append(tmpl('comment_tmpl', comment))
       })
       return false

blog/37signals-chalk-dissected.html

@@ -285,7 +285,7 @@ addLineNumbersToAllGists();
 <div class=center id=sd-container><a id=sd href=#comment-stuff>show the discussion</a></div>
 <div id=comment-stuff>
   <div id=comments>
-    <img id=discussion-spinner src=../assets/spinner.gif>
+    <div id=comments-spinner><img src=../assets/spinner.gif></div>
   </div>
   <form id=comment-form>
     <input name=post type=hidden value=37signals-chalk-dissected.html>

blog/a-preview-of-mach-o-file-generation.html

@@ -80,7 +80,7 @@ straightforward, an example is in asm/binary.rb, in the #output method.</p>
 <div class=center id=sd-container><a id=sd href=#comment-stuff>show the discussion</a></div>
 <div id=comment-stuff>
   <div id=comments>
-    <img id=discussion-spinner src=../assets/spinner.gif>
+    <div id=comments-spinner><img src=../assets/spinner.gif></div>
   </div>
   <form id=comment-form>
     <input name=post type=hidden value=a-preview-of-mach-o-file-generation.html>

blog/basics-of-the-mach-o-file-format.html

@@ -303,7 +303,7 @@ would almost have a useful Mach object file.)</i></p>
 <div class=center id=sd-container><a id=sd href=#comment-stuff>show the discussion</a></div>
 <div id=comment-stuff>
   <div id=comments>
-    <img id=discussion-spinner src=../assets/spinner.gif>
+    <div id=comments-spinner><img src=../assets/spinner.gif></div>
   </div>
   <form id=comment-form>
     <input name=post type=hidden value=basics-of-the-mach-o-file-format.html>

blog/index.html

@@ -42,6 +42,7 @@ SJS.filename = "37signals-chalk-dissected.html"
     <li><a href=a-preview-of-mach-o-file-generation.html>A preview of Mach-O file generation</a> <span class=date>January 20, 2010</span></li>
     <li><a href=basics-of-the-mach-o-file-format.html>Basics of the Mach-O file format</a> <span class=date>January 18, 2010</span></li>
     <li><a href=working-with-c-style-structs-in-ruby.html>Working with C-style structs in Ruby</a> <span class=date>January 17, 2010</span></li>
+    <li><a href=using-emacs-to-develop-mojo-apps-for-webos.html>Using Emacs to Develop Mojo Apps for WebOS</a> <span class=date>November 21, 2009</span></li>
     </ul>
 </nav>
 <div id=posts>
@@ -304,7 +305,7 @@ addLineNumbersToAllGists();
 <div class=center id=sd-container><a id=sd href=#comment-stuff>show the discussion</a></div>
 <div id=comment-stuff>
   <div id=comments>
-    <img id=discussion-spinner src=../assets/spinner.gif>
+    <div id=comments-spinner><img src=../assets/spinner.gif></div>
   </div>
   <form id=comment-form>
     <input name=post type=hidden value=37signals-chalk-dissected.html>

blog/using-emacs-to-develop-mojo-apps-for-webos.html

@@ -0,0 +1,188 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name=viewport content=width=device-width>
+<title>Using Emacs to Develop Mojo Apps for WebOS :: samhuri.net</title>
+<link rel=stylesheet href=../assets/blog.css>
+<script>
+var _gaq = _gaq || [];
+_gaq.push( ['_setAccount', 'UA-214054-5']
+         , ['_trackPageview']
+         )
+
+;(function() {
+  var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true
+  ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'
+  var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s)
+})()
+</script>
+<script src=http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js></script>
+<script>
+window.SJS = window.SJS || {}
+SJS.filename = "using-emacs-to-develop-mojo-apps-for-webos.html"
+</script>
+<script src=../assets/blog-all.min.js></script>
+<header>
+  <h1><a href=index.html>sjs' blog</a></h1>
+</header>
+<nav id=breadcrumbs><a href=../>samhuri.net</a> &rarr; <a href=index.html>blog</a></nav>
+<div id=posts>
+  
+  <article>
+    <header>
+      <h1><a href=using-emacs-to-develop-mojo-apps-for-webos.html>Using Emacs to Develop Mojo Apps for WebOS</a></h1>
+      <time>November 21, 2009</time>
+    </header>
+    <p>
+  The latest technology I've been learning is Palm's SDK for webOS,
+  Mojo. My first impression is that it's a great platform and
+  Palm could do a great job of 2.0 if they cut down on some of the
+  verbosity of gluing together the UI. I have learned to like
+  JavaScript over the years as I learned that despite its
+  warts <a href="http://ca.video.yahoo.com/watch/630959/2974197">there
+  are good parts</a> too. If you squint just right you can
+  see that it's scheme with Algol syntax. HTML and CSS are what
+  they are, but with WebKit running the show and only a single engine
+  to target it's not that bad. I've gone from Eclipse to Emacs
+  for the coding itself and highly recommend Emacs for Mojo
+  development. There is nothing that I miss from the Eclipse or
+  Komodo Edit thanks to the fact that Mojo uses open languages and
+  standards.
+</p>
+
+
+
+
+<p>
+  As far as actual development goes the Mojo documentation steers you
+  towards a combination of Eclipse, Palm's Mojo plugin for Eclipse,
+  and the Aptana Studio plugin. My editor of choice is Emacs but
+  I decided to give it a spin just to get started quickly, how bad
+  could it be? I'm not going to get into details but I will say that I
+  don't think I'll ever use Eclipse for anything; it's far too
+  sluggish and provides no compelling features for the languages
+  that I use. I tried Komodo Edit and it was significantly
+  better but still not for me. Emacs is great for editing HTML,
+  JavaScript, and CSS so all I really missed from the IDEs were the
+  shortcuts to package, install, and launch apps in the
+  emulator. I headed over to
+  the <a href="http://www.emacswiki.org/">Emacs Wiki</a> and
+  downloaded Jonathan
+  Arkell's <a href="http://www.emacswiki.org/emacs/MojoSdk">Mojo
+  support for Emacs</a> which provided a great base to get
+  started with. There are wrappers around (all?) of the Palm SDK
+  commands but it needed a bit of work to make it just do what I
+  wanted with as little input and thought as possible.
+</p>
+
+
+
+
+<p>
+  A couple of of Lisp hacking sessions later and I'm happy enough with
+  mojo.el to bump the version to v0.9. I've checked off what I
+  feel are the most important checkpoints on
+  the <a href="http://www.webos-internals.org/wiki/Comparison_of_Editors">webOS
+  Internals comparison of editors</a> and the framework is in
+  place to make implementing most of the remaining commands very
+  trivial. I might take a bit of time today to flesh things out
+  just to check more points off so people feel more confident that
+  it's a fully featured environment, because it certainly is.
+</p>
+
+
+
+
+<p>
+  It now requires json.el in order to parse appinfo.json. json.el
+  might be included with Emacs if you have a very recent version,
+  otherwise you can google for it or get it from
+  my <a href="https://github.com/samsonjs/config/tree/master/emacs.d">config
+  file repo on github</a> where you can also find my latest
+  version of mojo.el. You still just (require 'mojo) in your
+  .emacs file.
+</p>
+
+
+
+
+<p>
+  The wrappers around Palm SDK commands now search upwards for the
+  Mojo project root directory (from the default-directory for
+  current-buffer) and parse appinfo.json to give you sane defaults for
+  mojo-package, mojo-install, mojo-launch, mojo-delete, and
+  mojo-inspect. You can list installed apps and when entering app
+  ids there is completion and history, as you have come to expect in
+  Emacs. The most useful command for development is
+  mojo-package-install-and-inspect which does exactly what it says:
+  packages, installs, and launches the application for
+  inspection. No interaction is required as long as you are
+  editing a buffer inside your Mojo project.
+</p>
+
+
+
+
+<p>
+  If you read the install instructions in mojo.el and decide to setup
+  some keybindings then you will have single-task commands for
+  packaging, installing, launching, or all three steps at once.
+</p>
+
+
+
+
+<p>
+  Please give me some feedback if you try this out. I've
+  developed it on Mac OS X and Jonathan on Windows so please try it on
+  Linux and send me a patch or even better a pull request on github if
+  it needs some work. There is room for improvement.  The next feature
+  on my radar before I would consider it worthy of a v1.0 tag is
+  intelligent switching to corresponding buffers,
+  e.g. mojo-switch-to-view, mojo-switch-to-assistant, things like
+  that.  Basically things I miss from the Rails package for Emacs.
+</p>
+
+
+
+
+<p>Happy hacking!</p>
+
+
+    </article>
+</div>
+<p class=sep>&#x0f04;</p>
+<div id=around>
+  <a id=next href=working-with-c-style-structs-in-ruby.html>Working with C-style structs in Ruby &rarr;</a>
+  <br style=clear:both>
+</div>
+<p id=need-js align=center><strong>(discussion requires JavaScript)</strong></p>
+<div class=center id=sd-container><a id=sd href=#comment-stuff>show the discussion</a></div>
+<div id=comment-stuff>
+  <div id=comments>
+    <div id=comments-spinner><img src=../assets/spinner.gif></div>
+  </div>
+  <form id=comment-form>
+    <input name=post type=hidden value=using-emacs-to-develop-mojo-apps-for-webos.html>
+    <p><input name=name type=text placeholder=name></p>
+    <p><input name=email type=text placeholder=email></p>
+    <p><input name=url type=text placeholder=url></p>
+    <p><textarea name=body placeholder=thoughts></textarea></p>
+    <p align=center><input type=submit value='so there'></p>
+  </form>
+</div>
+<script type="text/html" id="comment_tmpl">
+  <div class=comment>
+    <p>
+      <% if (url) { %>
+        <a href="<%= url %>"><%= name %></a>
+      <% } else { %>
+        <%= name %>
+      <% } %>
+      @ <%= strftime('%F %r', new Date(timestamp)) %>
+    </p>
+    <blockquote><%= html %></blockquote>
+  </div>
+</script>
+<footer>
+  <a href=https://twitter.com/_sjs>@_sjs</a>
+</footer>

blog/working-with-c-style-structs-in-ruby.html

@@ -144,6 +144,7 @@ of the Mach-O file format</a></i><p>
 </div>
 <p class=sep>&#x0f04;</p>
 <div id=around>
+  <a id=prev href=using-emacs-to-develop-mojo-apps-for-webos.html>&larr; Using Emacs to Develop Mojo Apps for WebOS</a>
   <a id=next href=basics-of-the-mach-o-file-format.html>Basics of the Mach-O file format &rarr;</a>
   <br style=clear:both>
 </div>
@@ -151,7 +152,7 @@ of the Mach-O file format</a></i><p>
 <div class=center id=sd-container><a id=sd href=#comment-stuff>show the discussion</a></div>
 <div id=comment-stuff>
   <div id=comments>
-    <img id=discussion-spinner src=../assets/spinner.gif>
+    <div id=comments-spinner><img src=../assets/spinner.gif></div>
   </div>
   <form id=comment-form>
     <input name=post type=hidden value=working-with-c-style-structs-in-ruby.html>

discussd/discussd.js

@@ -223,7 +223,7 @@ function commentServer(context) {
             name = (data.name || 'anonymous').trim()
             email = (data.email || '').trim()
             url = (data.url || '').trim()
-            if (!url.match(/^https?:\/\//)) url = 'http://' + url
+            if (url && !url.match(/^https?:\/\//)) url = 'http://' + url
             body = data.body || ''
             if (!post || !body || context.posts.indexOf(post) === -1) {
                 console.warn('mising post, body, or post not found: ' + post)

templates/blog/index.html

@@ -72,7 +72,7 @@ SJS.filename = "{{filename}}"
 <div class=center id=sd-container><a id=sd href=#comment-stuff>show the discussion</a></div>
 <div id=comment-stuff>
   <div id=comments>
-    <img id=discussion-spinner src=../assets/spinner.gif>
+    <div id=comments-spinner><img src=../assets/spinner.gif></div>
   </div>
   <form id=comment-form>
     <input name=post type=hidden value={{filename}}>

templates/blog/post.html

@@ -54,7 +54,7 @@ SJS.filename = "{{filename}}"
 <div class=center id=sd-container><a id=sd href=#comment-stuff>show the discussion</a></div>
 <div id=comment-stuff>
   <div id=comments>
-    <img id=discussion-spinner src=../assets/spinner.gif>
+    <div id=comments-spinner><img src=../assets/spinner.gif></div>
   </div>
   <form id=comment-form>
     <input name=post type=hidden value={{filename}}>