diff --git a/javascripts/app.js.coffee b/javascripts/app.js.coffee
new file mode 100644
index 0000000..7a56c82
--- /dev/null
+++ b/javascripts/app.js.coffee
@@ -0,0 +1,38 @@
+jQuery ($) ->
+  loadChessGame = (container, options, callback) ->
+    chess = $('.board', container).chess(options)
+    $('.back', container).click => 
+      chess.transitionBackward()
+      $('.annot', container).text( chess.annotation() )
+      return false
+    $('.next', container).click =>
+      chess.transitionForward()
+      $('.annot', container).text( chess.annotation() )
+      return false
+    $('.flip', container).click =>
+      chess.flipBoard()
+      return false
+    callback(chess) if ( typeof callback != "undefined" )
+
+  loadChessGame( '#game3',
+    pgn : $('#pgn-fischer-spassky').html() )
+
+  loadChessGame( '#game1', {} )
+  loadChessGame( '#game2',
+    fen : "rnbqkbnr/pp1ppppp/8/2p5/4P3/5N2/PPPP1PPP/RNBQKB1R b KQkq - 1 2" )
+  loadChessGame( '#game3',
+    pgn : $('#pgn-fischer-spassky').html() )
+  loadChessGame( '#game4',
+    pgn : $('#justdoeet').html() )
+  loadChessGame( '#game5',
+    pgn : $('#with-queening').html() )
+  loadChessGame( '#game6',
+    pgn : $('#unambiguous-knight-move').html() )
+  loadChessGame( '#game7',
+    pgn : $('#heavily-annotated').html() )
+  loadChessGame( '#game8',
+    fen : $('#fen-html').html() )
+  loadChessGame( '#game9',
+    pgn : $('#middle-game').html() , (chess)->
+      chess.transitionTo(25)
+  )
diff --git a/javascripts/jchess-0.1.0.js b/javascripts/jchess-0.1.0.js
index a0fdea0..3359904 100644
--- a/javascripts/jchess-0.1.0.js
+++ b/javascripts/jchess-0.1.0.js
@@ -1,5 +1,5 @@
 /*
- * jChess 0.1.0 - Chess Library Built From jQuery
+ * jChess 0.1.1 - Chess Library Built From jQuery
  *
  * Copyright (c) 2008 Ben Marini
  *
@@ -132,7 +132,7 @@ jQuery.eachWithContext = function(context, object, callback) {
       },
 
       getDomPieceId : function(id) {
-        return this.wrapper.id + "_piece_" + id;
+        return $(this.wrapper).id + "_piece_" + id;
       },
 
       addDomPiece : function(id, piece, algebraic) {
diff --git a/stylesheets/chess.css.scss b/stylesheets/chess.css.scss
new file mode 100644
index 0000000..36b7758
--- /dev/null
+++ b/stylesheets/chess.css.scss
@@ -0,0 +1,35 @@
+.chess-board {
+  margin: 0 auto;
+  position: relative;
+  background: transparent asset-url("bw-board.gif", image) no-repeat 0 0;
+  width: 344px;
+  height: 344px;
+}
+
+.chess-board div {
+  position: absolute;
+  vertical-align: top;
+  width: 43px;
+  height: 43px;
+  padding: 0; margin: 0;
+}
+
+#chess-board h1,h3 { text-align: center; }
+
+.chess-board .wP { background: transparent asset-url("chess-sets/acmaster.gif", image) -1px -1px; }
+.chess-board .wN { background: transparent asset-url("chess-sets/acmaster.gif", image) -46px -1px; }
+.chess-board .wB { background: transparent asset-url("chess-sets/acmaster.gif", image) -91px -1px; }
+.chess-board .wR { background: transparent asset-url("chess-sets/acmaster.gif", image) -136px -1px; }
+.chess-board .wQ { background: transparent asset-url("chess-sets/acmaster.gif", image) -181px -1px; }
+.chess-board .wK { background: transparent asset-url("chess-sets/acmaster.gif", image) -226px -1px; }
+
+.chess-board .bp { background: transparent asset-url("chess-sets/acmaster.gif", image) -1px -46px; }
+.chess-board .bn { background: transparent asset-url("chess-sets/acmaster.gif", image) -46px -46px; }
+.chess-board .bb { background: transparent asset-url("chess-sets/acmaster.gif", image) -91px -46px; }
+.chess-board .br { background: transparent asset-url("chess-sets/acmaster.gif", image) -136px -46px; }
+.chess-board .bq { background: transparent asset-url("chess-sets/acmaster.gif", image) -181px -46px; }
+.chess-board .bk { background: transparent asset-url("chess-sets/acmaster.gif", image) -226px -46px; }
+
+#chess-nav {
+  text-align: center;
+}