Add Slim layout for views

Gemfile

@@ -1,6 +1,8 @@
 source 'https://rubygems.org'
 
 gem 'sinatra', '~> 1.4'
+gem 'sinatra-contrib'
+
 gem 'slim'
 gem 'coffee-script'
 gem 'therubyracer'

Gemfile.lock

@@ -1,21 +1,32 @@
 GEM
   remote: https://rubygems.org/
   specs:
+    backports (3.6.4)
     coffee-script (2.3.0)
       coffee-script-source
       execjs
     coffee-script-source (1.8.0)
     execjs (2.2.2)
     libv8 (3.16.14.7)
+    multi_json (1.10.1)
     rack (1.5.2)
     rack-protection (1.5.3)
       rack
+    rack-test (0.6.2)
+      rack (>= 1.0)
     ref (1.0.5)
     sass (3.2.19)
     sinatra (1.4.5)
       rack (~> 1.4)
       rack-protection (~> 1.4)
       tilt (~> 1.3, >= 1.3.4)
+    sinatra-contrib (1.4.2)
+      backports (>= 2.0)
+      multi_json
+      rack-protection
+      rack-test
+      sinatra (~> 1.4.0)
+      tilt (~> 1.3)
     slim (2.1.0)
       temple (~> 0.6.9)
       tilt (>= 1.3.3, < 2.1)
@@ -32,5 +43,6 @@ DEPENDENCIES
   coffee-script
   sass
   sinatra (~> 1.4)
+  sinatra-contrib
   slim
   therubyracer

nikoli.rb

@@ -1,6 +1,8 @@
 #!/usr/bin/env ruby
 
 require 'sinatra'
+require 'sinatra/content_for'
+
 require 'coffee-script'
 require 'slim'
 require 'sass'

views/index.slim

@@ -1,5 +1 @@
-doctype html
+h1 Hello world!
-html
-  head
-  body
-    h1 Hello world!

views/layout.slim

@@ -0,0 +1,10 @@
+doctype html
+html
+  head
+    title = yield_content :title
+    meta charset="utf-8"
+    meta name="viewport" content="initial-scale=1.0, user-scalable=yes"
+    link rel="stylesheet" media="all" href="/application.css"
+  body
+    == yield
+

views/nurikabe.slim

@@ -1,19 +1,13 @@
-doctype html
+- content_for(:title) { 'Nurikabe' }
-html
-  head
-    title Nurikabe
-    meta charset="utf-8"
-    meta name="viewport" content="initial-scale=1.0, user-scalable=yes"
-    link rel="stylesheet" media="all" href="/application.css"
-    script type="text/javascript" src="/nurikabe.js"
-  body
-    h1 Nurikabe
-    #board
 
-    javascript:
+h1 Nurikabe
-      document.addEventListener("DOMContentLoaded", function() {
+#board
-        var game = JSON.parse("[[4,-1,-1,0,2],[0,-1,2,-1,-1],[0,-1,0,-1,3],[0,-1,-1,-1,0],[-1,-1,1,-1,0]]");
 
-        nurikabe = new Nurikabe(document.getElementById('board'));
+script type="text/javascript" src="/nurikabe.js"
-        nurikabe.generate(game);
+javascript:
-      });
+  document.addEventListener("DOMContentLoaded", function() {
+    var game = JSON.parse("[[4,-1,-1,0,2],[0,-1,2,-1,-1],[0,-1,0,-1,3],[0,-1,-1,-1,0],[-1,-1,1,-1,0]]");
+
+    nurikabe = new Nurikabe(document.getElementById('board'));
+    nurikabe.generate(game);
+  });