dafrancis/blog.css

## blog.css
body {
    background: #CCC;
}

h1 {
    margin: 0;
}

#main {
    min-width: 340px;
    margin: 20px 150px;
    padding: 20px;
    background: white;
    box-shadow: 10px 10px 10px #333;
    border-radius: 20px;
}

body.hide_form #form {
    display: none;
}

## blog.html
<head>
  <title>Real Time Blog</title>
  <script type="text/javascript" src="https://raw.github.com/dafrancis/Bix/master/bix.min.js"></script>
</head>

<body>
    <div id="main">{{> blog}}</div>
</body>

<template name="blog">
    <h1>Blog</h1>
    <div id="blog">
        {{#each getText}}
            <p>{{{text}}}</p>
        {{/each}}
    </div>
    <form id="form" onsubmit="return false;">
        <input id="ed_box">
    </form>
</template>

<template name="error_page">
    <h1>Error {{code}}</h1>
    <p>{{{error_description}}}</p>
    {{#if image}}
        <div id="error_cat"><img src="http://httpcats.herokuapp.com/{{code}}"></div>
    {{/if}}
</template>

## blog.js
if (Meteor.is_client) {
  var Blog = new Meteor.Collection("blog");

  Template.blog.getText = function () {
    return Blog.find({}).fetch();
  };

  Template.blog.events = {
    'submit': function () {
      var tex = $("#ed_box");
      Blog.insert({text: tex.val()});
      tex.val('');
      return false;
    }
  };

  $(function () {
    var HumanisedError = {
      404: "Page was not found.<br><br>Make sure you have typed the address correctly.",
      418: "The server is a teapot<br><br>This shouldn't really happen but in case in case it does we probably need to slap whoever has messed with the Improbability Drive.",
      500: "Internal Server Error.<br><br>Don't worry it wasn't your fault. Our computers over here has gone a bit gammy. Please try again later!"
    };
    var bix = Bix({
      '/': function () {
        $('body').addClass('hide_form');
      },
      '/edit': function () {
        $('body').removeClass('hide_form');
      }
    });
    bix.config({
      error: function (e) {
        $('#main').html(Template.error_page({
            code: e.status,
            error_description: HumanisedError[e.status],
            image: $.inArray(e.status.toString(), "100 101 200 201 202 204 206 207 300 301 303 304 305 307 400 401 402 403 404 405 406 408 409 410 411 413 414 416 417 418 422 423 424 425 426 429 431 444 450 500 502 503 506 507 508 509 599".split(" ")) !== -1
        }));
      }
    });
    bix.run();
  });
}

if (Meteor.is_server) {
  Meteor.startup(function () {
    var Blog = new Meteor.Collection("blog");
    Blog.remove({});
  });
}
	body {
	background: #CCC;
	}

	h1 {
	margin: 0;
	}

	#main {
	min-width: 340px;
	margin: 20px 150px;
	padding: 20px;
	background: white;
	box-shadow: 10px 10px 10px #333;
	border-radius: 20px;
	}

	body.hide_form #form {
	display: none;
	}
	<head>
	<title>Real Time Blog</title>
	<script type="text/javascript" src="https://raw.github.com/dafrancis/Bix/master/bix.min.js"></script>
	</head>

	<body>
	<div id="main">{{> blog}}</div>
	</body>

	<template name="blog">
	<h1>Blog</h1>
	<div id="blog">
	{{#each getText}}
	<p>{{{text}}}</p>
	{{/each}}
	</div>
	<form id="form" onsubmit="return false;">
	<input id="ed_box">
	</form>
	</template>

	<template name="error_page">
	<h1>Error {{code}}</h1>
	<p>{{{error_description}}}</p>
	{{#if image}}
	<div id="error_cat"><img src="http://httpcats.herokuapp.com/{{code}}"></div>
	{{/if}}
	</template>
	if (Meteor.is_client) {
	var Blog = new Meteor.Collection("blog");

	Template.blog.getText = function () {
	return Blog.find({}).fetch();
	};

	Template.blog.events = {
	'submit': function () {
	var tex = $("#ed_box");
	Blog.insert({text: tex.val()});
	tex.val('');
	return false;
	}
	};

	$(function () {
	var HumanisedError = {
	404: "Page was not found.<br><br>Make sure you have typed the address correctly.",
	418: "The server is a teapot<br><br>This shouldn't really happen but in case in case it does we probably need to slap whoever has messed with the Improbability Drive.",
	500: "Internal Server Error.<br><br>Don't worry it wasn't your fault. Our computers over here has gone a bit gammy. Please try again later!"
	};
	var bix = Bix({
	'/': function () {
	$('body').addClass('hide_form');
	},
	'/edit': function () {
	$('body').removeClass('hide_form');
	}
	});
	bix.config({
	error: function (e) {
	$('#main').html(Template.error_page({
	code: e.status,
	error_description: HumanisedError[e.status],
	image: $.inArray(e.status.toString(), "100 101 200 201 202 204 206 207 300 301 303 304 305 307 400 401 402 403 404 405 406 408 409 410 411 413 414 416 417 418 422 423 424 425 426 429 431 444 450 500 502 503 506 507 508 509 599".split(" ")) !== -1
	}));
	}
	});
	bix.run();
	});
	}

	if (Meteor.is_server) {
	Meteor.startup(function () {
	var Blog = new Meteor.Collection("blog");
	Blog.remove({});
	});
	}