I want to take this opportunity to thank my wife for everything. Her constant loving support helps me in every aspect of my life from fatherhood to business to helping me deal with my health problems. I honestly don’t know what I would do without her.

❤ Thank You, Jem ❤

You’re the most wonderful woman I know - beautiful, funny, clever, loving, honest, understanding and a fantastic wife and mother. Every day I feel grateful to have you in my life and I truly hope I make you feel loved and appreciated. Together we make a brilliant team - the future never scares me, because I know whatever happens you’ll be there, by my side.

To me, you are perfect; I love you now, always and forever.

John Hrvatin from the Internet Explorer team:

The transition to a plug-in free Web is happening today. Any site that uses plug-ins needs to understand what their customers experience when browsing plug-in free. Lots of Web browsing today happens on devices that simply don’t support plug-ins. Even browsers that do support plug-ins offer many ways to run plug-in free.

Metro style IE runs plug-in free to improve battery life as well as security, reliability, and privacy for consumers.

How long until Google joins the party?

Frequently friends and acquaintances will talk to me about iOS/Android (being an iOS developer) and one of the things they’ll very often say is “yeah, but iOS can’t run Flash,” as if that’s a bad thing! Banning Flash from the platform is one of the things that makes me really glad I own iOS devices and that they’ve such a large market share. Many websites that use Flash are being forced to redevelop into open and standards-compliant HTML & JS so that they can capture the mobile audience.

Flash is the most common browser plugin, and I loathe it. I block it on all my computers and only use it where I absolutely have to. If a shopping website forces me to use Flash to shop there then I simply don’t shop there. And with HTML5 Video/Audio and the speed of JavaScript in todays modern browsers (even the latest Internet Explorers!) there’s less and less justification for websites to use Flash (or worse: Silverlight! I’m looking at you, LoveFilm).

I’m not the only person who hates Flash, just look at all the plugins to disable it!

Why Plugins Suck

There’s many reasons, but mostly it comes down to non-compatibility, performance, security and user experience.

Compatibility

For a long time there was no Flash player for Linux. Then there was no Flash player for 64-bit operating systems. There’s no Flash for iOS. My Blu-ray player can’t run Flash. Apparently my Tivo does run Flash, but it’s god-awful.

And because Flash runs in a different rendering pipeline it doesn’t integrate well with web browsers - especially when it comes to transparency. (See “User Experience”)

Performance

A lot of devices are easily capable of rendering HTML/CSS/JS but Flash pushes them too hard and the experience is ugly and slow. And Flash seems to be used for a whole host of things that HTML/CSS/JS have been capable of for years and years across all major browsers - one thing that comes to mind is all the advertising you get on certain websites.

Security

Bugs in plugins expose your browser to a lot of potential security risks - cross site scripting (XSS) attacks, information disclosure, even sharing your webcam feed without your permission (October 2011)! Over the years a lot of these issues have been patched, but it should be the job of the web browser to allow/deny access to various resources, having two interfaces increases the attack surface - it’s risky and confusing.

User Experience

When hover to expand adverts first came out they used to actually block the viewing of the content on some websites in some browsers - so I simply stopped visiting those website. What’s the point if you can’t actually read the content?!

Once you’ve got 10 Flash adverts on a web-page the scroll performance drops significantly, even on a dual core computer. There’s also the increased render time of the webpage as a whole, and the annoying (and unnecessary!) loading indicators.

When you close a browser tab, plugins on that page playing audio/etc often won’t close until a couple of seconds later, which can be very irritating. And don’t get me started on websites that suddenly start talking to you without you asking them to! (Though this is possible with HTML5 also…)

Acceptable Use Cases

There used to be lots of use-cases for which I found the use of Flash acceptable, but many of these are being diminished due to HTML5 adding extra capabilities to the browser:

• 3D browser games (soon to be invalid due to WebGL and similar technologies)
• streaming video/audio (now supported by HTML5 audio and video)
• video conferencing (there’s many workarounds for this - W3 are attempting to create a Media Capture API)
• real-time socket communications (WebSockets allow real time communications by extending HTTP)

Progress

Apple, Microsoft I applaud your efforts to rid the internet of these plugins (despite the existence of QuickTime, Silverlight and the like).

Google, I’m disappointed with you integrating Flash so deeply into Chrome, but Chrome’s an awesome browser for development so I shall use it anyway. Good work on making YouTube work with HTML5 though :)

HTML5 guys, you all rock.

This year I’m making an effort to do the things I’ve always meant to do as a programmer; and playing with lots of new (to me) tech in the process! I intend to cover a few of these topics in the coming weeks/months, but here’s a summary:

Vim

I’ve started using Vim as my main editor (or more specifically MacVim with the Janus vim distribution) and I’m loving it. It’s a relatively steep learning curve, but you don’t have to jump in at the deep end - just start with i to enter insert mode, use it like a normal editor, and then to save press <Esc> followed by :wq<Enter> to save and exit (drop the q if you don’t want to exit). Slowly start learning new things and forcing yourself to start using normal mode (where you type commands like :wq) and as you use more, you’ll want to use more. Once you’ve mastered the whole count-verb-modifier-noun grammar of vim you’ll be using it for everything and wondering how you ever managed without it!

Node.js

Okay, so I’ve been playing with this for a while, but I’m using it for more and more stuff now - pretty much anything that needs scripting I now do in JavaScript, or more specifically…

CoffeeScript

… CoffeeScript, which is bloody brilliant - especially if you have a strong understanding of how the underlying JavaScript functions. This isn’t new either, but I’m now using it for ALL my JavaScript programming

Underscore.js

Underscore.js is a light library of helpful JavaScript functions for working with objects, arrays, collections and other such things in a functional programming way without extending the native objects. jQuery/Mootools use $ for working with DOM nodes, Underscore uses _ for dealing with everything else.

Backbone.js

Backbone.js extends Underscore.js and is a great way of keeping the code of your RIAs organised. It’s very flexible and can fit to many different programming methodologies, but I use it in a M-VC (Model, ViewController) manner not dissimilar to iOS. Event are emitted from models when they’re added, changed or deleted; hooking into these events allows your app to always display consistent information without the need for lots of hard-coded callbacks.

jQuery

It seems everybody uses jQuery, and has done since its inception. I refused to jump on the band-wagon and I’m glad I did - I coded everything in JavaScript from scratch using native methods and help from articles across the web (especially sites such as QuirksMode) and now have a very good understanding of how different parts of a modern web browser piece together and the faster/slower ways to go about doing things.

However, jQuery is a lot faster than it used to be, as are modern web browsers, so my concerns are much less valid. It reduces programming time significantly and adds flexibility so I now use it (or Zepto.js) in a lot of my projects and I really like it - it doesn’t take long to learn and master, and it improves the speed of Backbone development considerably.

Git

Git, as you should know, is a brilliant version control software. I’ve been using SVN for years but have had the itch to switch for ages, so with some new projects that I’ve been working on (using the above technologies) I decided to switch to using git where possible. It’s brilliant - lightening fast and so flexible. The lack of the old /trunk/, /branches/, /tags/ layout makes me happy too - trying to convince employees to use svn switch was very hard, but with git they’ve got no choice but to do it the right way! I’m using gitolite for our internal (private) hosting, and …

Open Sourcing

… I’ve started Open Sourcing some stuff I’m working on to GitHub. First is my ec2-prune-snapshots script for automatically deleting sensibly old EBS snapshots on AWS, but I intend to release much more in the coming year, and possibly even retro-actively releasing some older software, such as MythPyWii which currently sits on Google Code.

What Are You Using?

If you’re using some cool technology for web/mobile application development that you think I might enjoy experimenting with then please let me know in the cooments!

One method of solving this issue is to chain the asynchronous calls, however this means that they’re run one after the other (serially) - and thus it will take longer to complete them. A better way would be to run them in parallel and have something track their completion. This is exactly what my very simple AsyncBatch class does:

1
2
3
4
5
6
7
8
9
10
11

class AsyncBatch extends EventEmitter
  constructor: ->
    @_complete = {}
    @_scheduled = {}

  wrap: (name,cb) ->
    @_scheduled[name] = true
    return =>
      @_complete[name] = cb.apply @, arguments
      if Object.keys(@_complete).length == Object.keys(@_scheduled).length
        @emit 'done', @_complete

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

var AsyncBatch,
  __hasProp = Object.prototype.hasOwnProperty,
  __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor; child.__super__ = parent.prototype; return child; };

AsyncBatch = (function(_super) {

  __extends(AsyncBatch, _super);

  function AsyncBatch() {
    this._complete = {};
    this._scheduled = {};
  }

  AsyncBatch.prototype.wrap = function(name, cb) {
    var _this = this;
    this._scheduled[name] = true;
    return function() {
      _this._complete[name] = cb.apply(_this, arguments);
      if (Object.keys(_this._complete).length === Object.keys(_this._scheduled).length) {
        return _this.emit('done', _this._complete);
      }
    };
  };

  return AsyncBatch;

})(EventEmitter);

To use AsyncBatch, just do the following

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

###
Create a new AsyncBatch instance
###
batch = new AsyncBatch

###
Wrap your callbacks with batch.wrap and a name
The name is used to store the result returned by your callback
(Don't forget to return the result you're interested in!)
###
delay 50, batch.wrap 'timer', ->
  return "Timer complete"

###
Add a completion handler that accepts `results` as a parameter.
  `results` is a JS object where the keys are the callback names 
  from above and the values are the return values of the
  callbacks.
###
batch.on 'done', (results) ->
  console.log "Batch complete, timer result: #{results.timer}"

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

/*
Create a new AsyncBatch instance
*/
var batch;

batch = new AsyncBatch;

/*
Wrap your callbacks with batch.wrap and a name
The name is used to store the result returned by your callback
(Don't forget to return the result you're interested in!)
*/

delay(50, batch.wrap('timer', function() {
  return "Timer complete";
}));

/*
Add a completion handler that accepts `results` as a parameter.
  `results` is a JS object where the keys are the callback names 
  from above and the values are the return values of the
  callbacks.
*/

batch.on('done', function(results) {
  return console.log("Batch complete, timer result: " + results.timer);
});

NOTE: If your asynchronous method accepts both a success and failure callback then simply wrap both individually but ensure you use the same name for both.

NOTE: Other than the case in the previous NOTE, all callbacks should have different names.

A full example (including a stub EventEmitter implementation) follows:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83

#EventEmitter = require('events').EventEmitter

if !EventEmitter?
  class EventEmitter
    on: (eventName, cb) ->
      @_eventCallbacks = {} unless @_eventCallbacks
      @_eventCallbacks[eventName] = [] unless @_eventCallbacks[eventName]
      @_eventCallbacks[eventName].push cb
    emit: (eventName, args...) ->
      if @_eventCallbacks && @_eventCallbacks[eventName]
        cb.apply @, args for cb in @_eventCallbacks[eventName]

class AsyncBatch extends EventEmitter
  constructor: ->
    @_complete = {}
    @_scheduled = {}

  wrap: (name,cb) ->
    @_scheduled[name] = true
    return =>
      @_complete[name] = cb.apply @, arguments
      if Object.keys(@_complete).length == Object.keys(@_scheduled).length
        @emit 'done', @_complete


batch = new AsyncBatch

##########################
# Task 1
http = require 'http'

options =
  host: 'www.example.com'
  port: 80
  path: '/'
  method: 'GET'

req = http.request options, batch.wrap 'status', (res) ->
  console.log 'STATUS: ' + res.statusCode
  console.log 'HEADERS: ' + JSON.stringify(res.headers)
  return res.statusCode

req.on 'error', batch.wrap 'status', (e) ->
  console.log 'problem with request: ' + e.message
  return null

req.end()

#########################
# Task 2
fs = require 'fs'

fs.readFile '/etc/hosts', 'utf8', batch.wrap 'hosts', (err, data) ->
  if err
    return null
  console.log data
  tmp = data.split "\n"
  return tmp[Math.floor(Math.random()*tmp.length)]

########################
# Task 3
delay = (ms, cb) -> setTimeout cb, ms

delay Math.random()*100, batch.wrap 'timer', ->
  console.log "Timer done"
  return true

#########################
# Completion:
batch.on 'done', (results) ->
  console.log "\n\n\nThe fetch, read and timer have completed."
  if results.status != null
    console.log "Fetch succeeded, status code: #{results.status}"
  else
    console.error "Fetch failed!"
  if results.hosts != null
    console.log "Random entry from /etc/hosts: "+results.hosts
  else
    console.error "Couldn't read /etc/hosts!"

batch.on 'done', (results) ->
  console.log "\nSecond completion callback, raw results:"
  console.log results

The following JavaScript creates a new closure inside each iteration of a loop to store the value of the loop variable i into the closure’s local variable j so that we don’t just console.log(10) 10 times. Though this example is trivial it represents a common method for solving closure related issues in asynchronous code.

1
2
3
4
5
6
7
8

for (var i = 0; i < 10; i++) {
  (function(){
    var j = i;
    delay(0, function(){
      console.log(j);
    });
  })();
}

The following CoffeeScript does exactly the same thing, you can see the translation line by line from the JavaScript. However once you’ve learnt the syntax you can much more clearly see what is going on with the CoffeeScript than in the verbose and parenthesis-heavy JavaScript above.

1
2
3
4
5

for i in [0..10]
  do ->
    j = i
    delay 0, ->
      console.log j

1
2
3
4
5
6
7
8
9
10
11
12

var i, _fn;

_fn = function() {
  var j;
  j = i;
  return delay(0, function() {
    return console.log(j);
  });
};
for (i = 0; i <= 10; i++) {
  _fn();
}

As a bonus, when CoffeeScript compiles to JavaScript it automatically takes the anonymous function from line 2 and defines it outside the loop so that it need not be interpretted/defined 10 times - it does this optimization for us. (Though I suspect most modern JavaScript engines do this automatically anyway.) To view the compiled JavaScript press the View JavaScript link at the top left of the code snippet.

Note the delay function is just a reordered setTimeout:

1

delay = (ms, cb) -> setTimeout cb, ms

1
2
3
4
5

var delay;

delay = function(ms, cb) {
  return setTimeout(cb, ms);
};

Strict guidelines will also be placed on internet providers which offer so-called unlimited packages, where users can download to their heart’s content. If a user incurs an “additional charge or suspension of service as a consequence of exceeding a usage threshold,” the ISP cannot use the term “unlimited”.

Finally! I hate it when providers are allowed to say ‘Unlimited’ and then place a limit on it (generally via a Fair Usage Policy). What a load of rubbish! I’m a heavy bandwidth user so it makes it very hard for me to find out what the limit is and then choose the relevant provider. Fortunately Virgin’s XXL broadband truly is unlimited - at least for now!

Scope issue

The developer of Octopress has kindly protected our window object from being polluted with various unnecessary variables by wrapping the whole disqus include in an anonymous function.

However, the Disqus script actually injects another <script> element into the <head> (or <body>) of the page. This injected script, like all other scripts on the page, inherits the global (window) scope, and not the scope of this anonymous function. Thus it will not have access to the disqus variables such as disqus_shortname defined within the anonymous function. Without these variables, disqus loads such domains as undefined.disqus.com which is not very helpful!

Solution

The fix is simple - open up source/_includes/disqus.html and move the beginning of the anonymous function ((function () {) so that it does not contain the var disqus_* variable definitions. We also need to insert a couple of semi-colons that have been accidentally omitted. Here’s the resulting file:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

{% comment %} Load script if disquss comments are enabled and `page.comments` is either empty (index) or set to true {% endcomment %}
{% if site.disqus_short_name and page.comments != false %}
<script type="text/javascript">
      var disqus_shortname = '{{ site.disqus_short_name }}';
      {% if page.comments == true %}
        {% comment %} `page.comments` can be only be set to true on pages/posts, so we embed the comments here. {% endcomment %}
        // var disqus_developer = 1;
        var disqus_identifier = '{{ site.url }}{{ page.url }}';
        var disqus_url = '{{ site.url }}{{ page.url }}';
        var disqus_script = 'embed.js';
      {% else %}
        {% comment %} As `page.comments` is empty, we must be on the index page. {% endcomment %}
        var disqus_script = 'count.js';
      {% endif %}

    (function () {
      var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
      dsq.src = 'http://' + disqus_shortname + '.disqus.com/' + disqus_script;
      (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
    }());
</script>
{% endif %}

One more thing

If you want your links to be absolute, then you should set root to be your root URL in _config.yml - e.g. root: http://www.benjiegillam.com/ rather than root: /. This may or may not be required for Disqus to function properly.

EDIT: @Octopress has confirmed that root must not contain the scheme and host.

Bonus

Now that I’ve implemented the above, my comments and comment counts successfully display on my benjiegillam.dev site (hosted by Pow)!

Or use this solution with sed:
sed ':a;N;$!ba;s/\n/ /g'
This will read the whole file in a loop, then replaces the newline(s) with a space.

Update: explanation.

1. create a register via :a
2. append the current and next line to the register via N
3. if we are before the last line, branch to the created register $!ba ($! means not to do it on the last line (as there should be one final newline)).
4. finally the substitution replaces every newline with a space on the pattern space (which is the contents of the a register = the whole file.

The solution I found was to split the command up into explicit separate commands:

1

sed -e ':a' -e 'N' -e '$!ba' -e 's/\n/ /g'

$ rake generate
(in /Users/benjiegillam/Documents/Blog/octopress)
## Generating Site with Jekyll
Configuration from /Users/benjiegillam/Documents/Blog/octopress/_config.yml
unchanged sass/screen.scss
Building site: source -> public
/Users/benjiegillam/Documents/Blog/octopress/plugins/raw.rb:11:in `gsub': invalid byte sequence in UTF-8 (ArgumentError)
    from /Users/benjiegillam/Documents/Blog/octopress/plugins/raw.rb:11:in `unwrap'
    [...]

However, converting the file was perfectly valid UTF-8 as confirmed by an iconv -c conversion followed by a diff -u.

After a quick bit of hacking in the octopress/plugins/raw.rb file to spit out the content that was being converted, I found the file at fault. After some iteration I got to the root of the issue - Octopress’ default markdown parser, rdiscount, REALLY doesn’t like UTF-8 characters in URLs. I’ve built a test here:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

# encoding: utf-8
require 'rdiscount'

print "Test 1: "
markdown = RDiscount.new("http://commons.wikipedia.org/wiki/Image:Dara_Ó_Briain.jpg")
if markdown.to_html == "<p>http://commons.wikipedia.org/wiki/Image:Dara<em>Ó</em>Briain.jpg</p>\n"
  puts "PASS"
else
  print "FAIL: "
  puts markdown.to_html
end
# Correct: <p>http://commons.wikipedia.org/wiki/Image:Dara<em>Ó</em>Briain.jpg</p>

print "Test 2: "
markdown = RDiscount.new("[Wikipedia](http://commons.wikipedia.org/wiki/Image:Dara_Ó_Briain.jpg)")
if markdown.to_html == "<p><a href=\"http://commons.wikipedia.org/wiki/Image:Dara_%C3%93_Briain.jpg\">Wikipedia</a></p>\n"
  puts "PASS"
else
  print "FAIL: "
  puts markdown.to_html
end
# Incorrect: <p><a href="http://commons.wikipedia.org/wiki/Image:Dara_?%93_Briain.jpg">Wikipedia</a></p>
# Note the invalid character (represented by ?)
# Expected: <p><a href="http://commons.wikipedia.org/wiki/Image:Dara_%C3%93_Briain.jpg">Wikipedia</a></p>

It was converting Dara_Ó_Briain.jpg to Dara_?%93_Briain.jpg, where the ? is an invalid UTF-8 character. (Should be Dara_%C3%93_Briain.jpg)

Solution?

Annoyingly pandoc (a tool employed by exitwp) seems to be converting the link from Dara_%C3%93_Briain.jpg to Dara_Ó_Briain.jpg in the markdown file, which is then breaking when it is rdiscounted. As it only affected 2 characters in my entire blog history I’ve not bothered with an automated fix - I just manually re-encoded the characters. I’ve commented on this issue with pandoc so that hopefully they will fix it.

Crossed out code blocks

The markdown produced by pandoc (an exitwp dependency) uses ~~~~ in places to denote a code block. However, rdiscount (Octopress’ markdown parser) recognises this instead as strike-through. A simple bash command fixes this (though it does lose some of the formatting details).

1
2
3
4
5

for I in *; do sed -i '' -e 's/^~~~~ {\(.*\)}$/\
<!-- \1 -->\
```/g' $I; done
for I in *; do sed -i '' -e 's/^~~~~$/\
```/g' $I; done

Line breaks in links

For some reason exitwp added some linebreaks into the markup for the links. And for some other reason, octopress’ style sheet (screen.css) tells <a> tags that their white-space should be pre-wrap, these two issues combine to give you broken links.

This next command should fix these newline issues. (It finds a [ with no matching ] on the same line and then removes the newline at the end of said line, being careful not to have two newlines next to one another.)

1
2

for I in source/*.markdown source/*/*.markdown; do sed -E -i '' -e ':a' -e 'N' -e '$!ba' -e 's/\n?(\[[^]]*)\n([\t ]*)/\
\2\1 /g' "$I"; done

NOTE: You may need to run the above more than once.

Turns out that the above broke some image embeds - no worries - here’s the solution:

1

for I in *; do sed -i '' -e ':a' -e 'N' -e '$!ba' -e 's/\!\n\[/\![/g' $I; done;

Ordered/Unordered Lists

exitwp does not insert newlines before lists, and rdiscount does not always recognise it as a list unless it has a blank newline above it. Simply find the ‘1.’ entry and put a blank newline above it.

Tildes

rdiscount doesn’t do strikethrough with a single tilde, so it does not need escaping. However exitwp escapes them, so text like ~/Documents/ will become \~/Documents/

Random quotes

rdiscount and exitwp seem to disagree on indentation - causing rdiscount to render indentation (sometimes) as a quote rather than continuation of the text.

URLs with brackets in

exitwp or pandoc do not correctly escape (with a backslash) brackets within links, so captions/etc may be broken. Simply add in the backslashes.

/blog/archives/

I was looking for a line in _config.yml to configure the archives. Turns out it’s actually the file source/blog/archives/index.html that needs to move - I moved this to source/archives/index.html

1
2

mv source/blog/archives source/
rmdir source/blog/

And then updated the navigation source/_includes/custom/navigation.html

Hosting on S3

I followed these instructions from Ian Wootten (which reference these instructions by Jerome Bernard) - thanks!

Disclaimer

This code in this post worked for me, but it is quite dumb - you will need to check the changes it makes are good (this is where git diff comes in handy - make sure to commit before running these commands!)

1
2
3
4
5

if session and not session.prototype?.reload
    req =
        sessionStore: sessionStore
        sessionID: data.sessionID
    session = new express.session.Session req, session

1
2
3
4
5
6
7
8
9

var req, session, _ref;

if (session && !((_ref = session.prototype) != null ? _ref.reload : void 0)) {
  req = {
    sessionStore: sessionStore,
    sessionID: data.sessionID
  };
  session = new express.session.Session(req, session);
}

immediately inside the sessionStore.get callback.

1
2
3
4
5
6
7
8
9
10
11
12

# Alias for setTimeout that reorders parameters to look neater in CoffeeScript
delay = (ms, cb) -> setTimeout cb, ms
# Handle SIGUSR2, but only once
process.once 'SIGUSR2', ->
  console.log 'Doing shutdown tasks...'
  delay 5000, ->
    console.log 'All done, exiting'
    # Kill ourself with the SIGUSR2 signal again
    process.kill process.pid, 'SIGUSR2'
# This next line just to prevent the app exiting in case you want to use this as a demo
delay 99999999, ->
  console.log 'App exiting naturally'

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

var delay;

delay = function(ms, cb) {
  return setTimeout(cb, ms);
};

process.once('SIGUSR2', function() {
  console.log('Doing shutdown tasks...');
  return delay(5000, function() {
    console.log('All done, exiting');
    return process.kill(process.pid, 'SIGUSR2');
  });
});

delay(99999999, function() {
  return console.log('App exiting naturally');
});

By the way, to install nodemon globally: sudo npm install -g nodemon

Original post follows:

(Mac OS X only, works on Lion, Xcode 4.1, Skype 5.3)

Here are the steps to starting work on interfacing a Cocoa app with Skype:

1. Don’t try and get the framework from the documentation (what the hell?! Invalid link? PowerPC issues? Come on Skype!)

2. Copy Skype.framework into your app’s folder from within Skype (find the Skype app, control-click and Show Package Contents)

3. Drag your copy of Skype.framework into the Frameworks folder of your Xcode project.

4. In Project -> Target -> Build Phases:

   1. Ensure Link Binary with Libraries contains Skype.framework
   2. Add a new build phase (Editor -> Add Build Phase -> New Copy Files Build Phase), set the destination to Frameworks, the Subpath blank, and drag Skype.framework here from your Frameworks group.

5. In the relevant source file add

1

#include <Skype/Skype.h>

1. Code your app. You might want to start with the following:

1
2
3

if ([SkypeAPI isSkypeRunning]) {
  NSLog(@"Skype is running.");
}

Hopefully that’ll get you started a bit faster than I did! API documentation can be found here: https://developer.skype.com/resources/public_api_ref.zip

So you can’t use MigrationAssistant because you already have an account (Alice) on the new machine (New) and don’t have the disk space on the old one (Old) to turn FV off? Fear not! Let’s assume the username you want to move is steve:

1. As Alice, create (admin) account on New with same username, steve, and same password, and enable FileVault.
2. Replace /Users/steve/steve.sparsebundle on New with /Users/.steve/steve.sparsebundle from Old. (you could use scp, rsync, an external hard drive, or any other method to transfer these files) (I did this with steve logged in, but you can do it logged out though the path may be different)
3. As Alice, fix the permissions on New: chown -R steve /Users/steve
4. Log in as steve on New (unlocks the sparsebundle and mounts it at /Users/steve)
5. Fix permissions again: either as Alice or steve, sudo chown -R steve /Users/steve
6. Log out an in again Voila!

If this helps you, please drop me a comment :)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

// Root class
function MyClass() {
  return this;
}

// Create first subclass
function MyChildClass1() {
  return this;
}
MyChildClass1.prototype = new MyClass();
MyChildClass1.prototype.parent = MyClass.prototype;
MyChildClass1.prototype.constructor = MyChildClass1;

// Create second subclass
function MyChildClass2() {
  return this;
}
MyChildClass2.prototype = new MyClass();
MyChildClass2.prototype.parent = MyClass.prototype;
MyChildClass2.prototype.constructor = MyChildClass2;

// Create an instance
var instance = new MyChildClass2();

Shorter way (gives wrong output on console.log()):

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

// Automation function
function NS_Extend(parentClass,childClassName) {
  var childClass = function(){return this;}
  childClass.prototype = new parentClass();
  childClass.prototype.parent = parentClass.prototype;
  childClass.prototype.constructor = childClass;
  window[childClassName] = childClass;
}

// Root Class
function MyClass() {
  return this;
}

// First subclass
NS_Extend(MyClass,'MyChildClass1');

// Second subclass
NS_Extend(MyClass,'MyChildClass2');

// Create an instance
var instance = new MyChildClass2();

Simple, but when I console.log(instance) it gives me NS_Extend.childClass as the name of the class, rather than MyChildClass2 as was done previously. It makes no difference to the functionality of the app, but it makes my debugging a bit harder. And I really don’t want to have to keep defining function ClassName(){return this;} everywhere - waste of time typing all that repeated code! So I figured I’d define the function through eval(). However that didn’t work, until I realised that eval() is scoped to the current context. So to define a window level function we’d need to change the scope to the window object. Easy enough with JavaScript’s .call() method. The solution:

1
2
3
4
5
6
7
8
9
10
11
12
13
14

function MyClass() {
  return this;
}
function NS_Extend(parentClass,childClassName) {
  var js = 'function '+childClassName+'(){return this;}';
  eval.call(window,js);
  var childClass = window[childClassName];
  childClass.prototype = new parentClass();
  childClass.prototype.parent = parentClass.prototype;
  childClass.prototype.constructor = childClass;
}
NS_Extend(MyClass,'MyChildClass1');
NS_Extend(MyClass,'MyChildClass2');
var instance = new MyChildClass2();

Now when I console.log(instance) it tells me MyChildClass2 - WIN!

[I use Chrome under Linux, by the way.]

Seems like a simple problem, there must be a simple solution? Here are the existing options:

• syslog-ng or rsyslogd logging to a central location.
  • Pros: centralized logs, easy to analyse, near to real time
  • Cons: Requires extra dedicated server (costs). Have to extend storage or upload to S3 periodically. PITA setup from a security POV unless you know the IP addresses in advance (you can set up your own CA and generate a number of SSL keys and distribute these to the servers on startup and use TLS encrypted communications, but I really CBA with all that hassle - not to mention that last time I checked Amazon Linux didn’t support these servers OOTB so I’d have to install them from a CentOS RPM or similar)
• Message queuing
  • (I don’t think this is a perfect match)
• Hadoop cluster
  • Pros: awesome data crunching ability
  • Cons: we don’t have 10million users yet, I think this is a bit heavy handed (not to mention expensive)
• Scribe from Facebook
  • Cons: too much setup, requires specific server heirarchy.
• logg.ly and splunk
  • Cons: too expensive/untested/unknown for now
• Something else…

I chose “something else” - a custom solution using logrotate to upload the logs to S3 on a per server basis. Here’s how I did it (and how you can do it too) You’ll need:

• /usr/local/bin/s3uploadfile download - a script that uploads a file to S3…
• /etc/init.d/s3logrotate download - an init script to trigger logrotate to be called (twice) on server shutdown
• /usr/local/bin/s3logrotated download - a callback script to call when a log has been rotated (process the logrotate message and calls s3uploadfile to upload the log to S3)
• /root/.s3env - a simple bash script to export your s3 credentials for s3uploadfile to work

1
2
3
4

#!/bin/bash
export S3BUCKETNAME='MyBucketNameHere'
export AWS_ACCESS_KEY_ID='MyKeyHere'
export AWS_SECRET_ACCESS_KEY='MySecretHere'

Step 1: Create your dedicated server log S3 bucket (if you haven’t already)

Step 2: Download and install the scripts above to the locations above, including /root/.s3env and then make them all executable (chmod +x [file])

Step 3: Modify the relevant logrotate scripts to use s3logrotated callback and add s3logrotate to the server rc*.d scripts. When configuring logrotate: don’t use dateext, do use compress, do use delaycompress, do use sharedscripts. Here’s what I use:

1
2
3
4
5
6
7

# This is what I used, you will need to customize this for your own servers
sed -i /etc/logrotate.conf -e 's/^dateext$/#dateext/;s/^weekly$/daily/;s/^rotate 4$/rotate 15/;s/^#compress$/compress/'
sed -i /etc/logrotate.d/httpd -e 's/^\([ \t]*endscript\)/\t\/usr\/local\/bin\/s3logrotated ".2.gz" "\$1"\n\1/'
sed -i /etc/logrotate.d/syslog -e 's/^\([ \t]*sharedscripts\)/\1\n    delaycompress/;s/^\([ \t]*endscript\)/\t\/usr\/local\/bin\/s3logrotated ".2.gz" "\$1"\n\1/'
# This is the centos command to add the s3logrotate script (it contains the levels configuration within it) - 
# you'll want to update-rc.d or similar on debian/ubuntu hosts.
chkconfig --add s3logrotate

Note that the ".2.gz" is because of compress and delaycompress - it is the first compressed log file. This is why we need /etc/init.d/s3logrotate to run ”logrotate -f” twice on server shutdown.

Step 4: Analytics I suppose, but I leave that as an exercise for the reader. I hope this helps someone - if it does, let me know in the comments. If you want any help setting it up (or understanding how it works) then just shoot me an email or leave me a comment.

The cable comes out of the wall:

And then via a splitter:

To the V+HD box:

Note that the “online” LED is lit up, suggesting the system might be online? And the modem:

(it’s not clear here because my flash drowned it out, but the “enet”, “sync” and “ready” indicators are all green, and the “recv” and “send” indicators flash when I load the website below.)

(It’s an ambit 256 modem)

(Note that cable plugs in the back.) Here’s what happens when I connect my laptop to the modem:

1. I am given an IP address of 213.107.40.198 (I have proof this is an NTL/Virgin Media IP address at the bottom of the post)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

jem@jem-laptop:~$ ifconfig
eth0      Link encap:Ethernet  HWaddr 00:22:15:8f:a5:50  
          inet addr:<strong>213.107.40.198</strong>  Bcast:213.107.40.255  Mask:255.255.255.0
          inet6 addr: fe80::222:15ff:fe8f:a550/64 Scope:Link
          UP BROADCAST RUNNING MULTICAST  MTU:1500  Metric:1
          RX packets:10 errors:0 dropped:0 overruns:0 frame:0
          TX packets:43 errors:0 dropped:0 overruns:0 carrier:2
          collisions:0 txqueuelen:1000 
          RX bytes:2606 (2.6 KB)  TX bytes:9440 (9.4 KB)
          Interrupt:28 
lo        Link encap:Local Loopback  
          inet addr:127.0.0.1  Mask:255.0.0.0
          inet6 addr: ::1/128 Scope:Host
          UP LOOPBACK RUNNING  MTU:16436  Metric:1
          RX packets:12 errors:0 dropped:0 overruns:0 frame:0
          TX packets:12 errors:0 dropped:0 overruns:0 carrier:0
          collisions:0 txqueuelen:0 
          RX bytes:800 (800.0 B)  TX bytes:800 (800.0 B)

1. I am taken to the following screen, asking me to activate broadband
2. When I click the link, it asks me to choose between Virgin Media and ntl/telewest

3. I choose virginmedia and the page asks me to phone you:

   Here’s what I see from the V+HD box:

   

Here’s a video of the V+HD box in action, showing the terrestrial channels delivered over cable, but the premium channels cannot be viewed because I don’t have a subscription: The radio channels also work for me through the V+HD box as I guess they are unprotected.

In conclusion: please believe me now that I do in fact already have fibre optic at this house and let me sign up!

Proof that the IP address I was given is a Virgin Media (NTL) address:

$ whois 213.107.40.198
% This is the RIPE Database query service.
% The objects are in RPSL format.
%
% The RIPE Database is subject to Terms and Conditions.
% See http://www.ripe.net/db/support/db-terms-conditions.pdf

% Note: This output has been filtered.
%       To receive output for a database update, use the "-B" flag.

% Information related to '213.107.40.0 - 213.107.45.255'

inetnum:        213.107.40.0 - 213.107.45.255
netname:        NTL-BIA-LONDON-BROMLEY
descr:          NTL Infrastructure - Southampton
country:        GB
admin-c:        NNMC1-RIPE
tech-c:         NNMC1-RIPE
status:         ASSIGNED PA
mnt-by:         AS5089-MNT
source:         RIPE # Filtered

role:           NTLI Network Management Centre
address:        NTL Internet
address:        Crawley Court
address:        Winchester
address:        Hampshire
address:        SO21 2QA
phone:          +44 1633710142
admin-c:        MH22007-RIPE
admin-c:        NR731-RIPE
admin-c:        CW1083-RIPE
tech-c:         MH22007-RIPE
tech-c:         CW1083-RIPE
nic-hdl:        NNMC1-RIPE
mnt-by:         AS5089-MNT
e-mail:         pim@virginmedia.co.uk
source:         RIPE # Filtered

% Information related to '213.104.0.0/14AS5089'

route:        213.104.0.0/14
descr:        NTL-UK-IP-BLOCK-4
origin:       AS5089
mnt-by:       AS5089-MNT
source:       RIPE # Filtered

% Information related to '213.107.0.0/16AS5089'

route:        213.107.0.0/16
descr:        NTL-UK-IP-BLOCK
origin:       AS5089
mnt-by:       AS5089-MNT
source:       RIPE # Filtered

% Information related to '213.107.0.0/17AS5089'

route:        213.107.0.0/17
descr:        NTL-UK-IP-BLOCK
origin:       AS5089
mnt-by:       AS5089-MNT
source:       RIPE # Filtered

After conquering the indestructible box and charging the N900 I decided to have a quick play. I watched the getting started video which I found to be both beautifully smooth, showing off the high definition of the N900 screen immediately, and somewhat slow content-wise.

The N900 is similar in width and height to the iPhone but is much greater in depth at 1.8cm - just a millimetre deeper than the G1. This is not surprising due to it’s hard keyboard and more advanced hardware.

The first thing that struck me about the N900 (other than how high definition the hands were in the famous Nokia splash video!) was how much force it required to press on the screen. The iPhone (my current primary phone because I develop iPhone fitness apps) only requires the lightest of touches; whilst the Android G1 (my wife’s phone) requires a bit more. I later discovered the reason for this heavier interface was probably the stylus (which I discovered accidentally while interrogating the outside of the device), which is great to use - reminds me of my old iPaqs only much much higher resolution and more responsive! I noticed that every time I touched the screen firmly enough the phone would do a very small vibration in the way of haptic feedback. This would be good if it weren’t for the fact that it does it every time, and not only the times when your touch actually triggers an action (opening a menu, etc) - this is becoming more annoying than useful. Because of the devices HD screen I found it quite hard to be exact with my touches (my thumbs must be almost 200 pixels wide on that screen!) though the interface deals with this well by using large touch areas. After failing at playing Marbles (a pre-installed game with small touch areas) for a minute or so I quickly learned where the device thought my presses were and the device became even easier to use. (Sure this would have been much easier with a stylus but I hadn’t discovered that yet!) The web browser is a pleasure to use, though it appears to support in page Flash which I personally hate - especially on a small screen mobile device. I went to YouTube to see how it handles and “very well” was the answer. The device supports the double tap to zoom in to a region of text paradigm of Safari on the iPhone though it obviously lacks the multi-touch pinch and zoom.

Pressing play on a YouTube video, I wished to turn the volume up and so I pressed the volume rocker on the outside of the phone. This surprisingly zoomed the web page (very smoothly!) but not the volume - a useful feature but definitely not what I had expected. I attempted to change the volume using the YouTube Flash control but could not drag the slider up as my fingers were too fat and dragging scrolled the page. (I hadn’t discovered the stylus at this time but have since attempted with they stylus with the same result.) To change the volume I had to click the web page, click the “toggle fullscreen” button at the bottom right, the status icons at the top and then drag the volume slider. Not too hard, but certainly more effort than just using the volume rocker - the video would play on a good few seconds more before you can change the volume and get back to it. Perhaps there’s a better way of doing it, but this is a “first impressions” post so I feel I should stick to first impressions! One very cool feature of the N900 is how blazingly fast the screen lock/unlock is. There’s a sprung switch on the right side of the phone which when you flick it will lock or unlock the screen seemingly instantly (no slider here!). If you prefer the iPhone style slider then you can press the power button at the top of the phone and use the slider there, though I much prefer the flick button on the side.

I like the stand on the back of the phone - this would be immensely useful when you’re trying to watch a film on the train on the way back from London (rather than constructing a stand with your backpack, wallet and other accessories like I do for my iPhone…). The stand is fairly sturdy and definitely supports the phone well, though it does rock a bit when you use the stylus at the top right of the screen (not really the stands intention to be fair!). I know virtually nothing about photography, but to me the camera seems to be a decent quality 5MP phone camera with a fairly decent flash. Coming from a 3MP iPhone with no flash the difference is astounding. The N900’s sheer performance is very visible here - as you move the phone around you can clearly see the surroundings - there is no massive blurring like when you wobble the iPhone’s camera. The photos themselves come out quite well, though there is still minor blurring due to handshake - but no where near the magnitude of the blurring on the iPhone. I bet a “bar code scanner” application on the N900 would be far faster and more accurate than any I have used on the iPhone or Android!

Connecting the device to my WiFi network was painless and intuitive. The major widgets (menu button [top left], fullscreen button [bottom right], close button [top right], status tray [top, right of menu button]) are well laid out and application switching (and closing [Symbian: I’m talking to you]!) is simple and intuitive.

Opening applications could do with some work - the menu first opens and shows you 15 icons (standard icons like Contacts, Phone, Web, Email, Conversations), with a More button at the bottom right. Pressing More is how you get to your other apps - games, utilities, etc. Unfortunately these apps appear ordered by the time they were installed and not separated into folders, and there is no obviously intuitive way to organise them. In fact I have yet to find out how to organise them through exploring the device - I will search the internet later.

That’s the end of my first impressions… When I discovered the X Terminal application I got immediately a lot more excited as I am by nature a hacker. Read on…

This post is part 2 of a three part series. You may also be interested in: Part 1: N900: the tale of the indestructible box Part 3: N900: a phone for hackers? (coming soon…)