terrancebryant/jsbin.IYIjAvAs.html

## jsbin.IYIjAvAs.html
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.0/handlebars.js"></script>
<script src="http://builds.emberjs.com.s3.amazonaws.com/tags/v1.0.0/ember.js"></script>
<!-- <script src='app.js'></script> -->
<link href="http://getbootstrap.com/dist/css/bootstrap.css" rel="stylesheet" type="text/css" />
<script src="http://getbootstrap.com/dist/js/bootstrap.js"></script>
<meta name="description" content="ember.js tutorial" />
<meta charset=utf-8 />
<title>Ember.js Tutorial</title>
</head>
<body>
    <script type='text/x-handlebars' data-template-name='application'>
    <div class='navbar navbar-default'>
      <div class='container'>
        {{#link-to 'index' class='navbar-brand'}}Terrance Bryant{{/link-to}}
        <ul class='nav navbar-nav navbar-right'>
          <li>{{#link-to 'index' class='active'}}Home{{/link-to}}</li>
          <li>{{#link-to 'about'}}About{{/link-to}}</li>
        </ul>
      </div>
    </div>
    <div class='container'>
      {{outlet}}
    </div>
    <footer class='container'>
      <hr />
      <p class='pull-left'>&copy; 2013 The Flint &amp; Flame</p>
      <p class='pull-right'>{{#link-to 'credits'}}Credits{{/link-to}}</p>
    </footer>
  </script>
  <script type='text/x-handlebars' data-template-name='index'>
    <div class="jumbotron">
      <h1>Welcome to The Flint &amp; Flame!</h1>
      <p class="tagline">
        <img {{bind-attr src='logo'}} alt='Logo' />
        Everything you need to make it through the winter.
      </p>
      <p>Browse All {{productCount}} Items &raquo;</p>
    </div>
    <p class='pull-right text-muted'>Rendered on {{time}}</p>
  </script>

  <script type='text/x-handlebars' data-template-name='about'>
    <h1>About The Fire Spirits</h1>
    <p>{{open}}</p>
    <p><img {{bind-attr src='avatar'}} alt='Avatar' /></p>
    <p>Contact {{contactName}} for more info!</p>
  </script>

  <script type='text/x-handlebars' data-template-name='credits'>
    <h1>Thanks for the Help!</h1>
    <p>This site would not be possible without the hardworking Ember Core Team!</p>
  </script>
</body>
</html>

## jsbin.IYIjAvAs.js
var App = Ember.Application.create({
  LOG_TRANSITIONS: true
});

App.Router.map(function() {
  this.route('credits', { path: '/thanks' });
  this.route('about');
});

App.IndexController = Ember.Controller.extend({
	productsCount: 6,
	logo: 'images/logo.png',
	time: function() {
    return (new Date()).toDateString();
  }.property()
});

App.AboutController = Ember.Controller.extend({
	contactName: 'Anostagia',
	avatar: 'images/avatar.png',
	open: function() {
    return ((new Date()).getDay() === 0) ? "Closed" : "Open";
  }.property()
})
	<!DOCTYPE html>
	<html>
	<head>
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
	<script src="http://cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.0/handlebars.js"></script>
	<script src="http://builds.emberjs.com.s3.amazonaws.com/tags/v1.0.0/ember.js"></script>
	<!-- <script src='app.js'></script> -->
	<link href="http://getbootstrap.com/dist/css/bootstrap.css" rel="stylesheet" type="text/css" />
	<script src="http://getbootstrap.com/dist/js/bootstrap.js"></script>
	<meta name="description" content="ember.js tutorial" />
	<meta charset=utf-8 />
	<title>Ember.js Tutorial</title>
	</head>
	<body>
	<script type='text/x-handlebars' data-template-name='application'>
	<div class='navbar navbar-default'>
	<div class='container'>
	{{#link-to 'index' class='navbar-brand'}}Terrance Bryant{{/link-to}}
	<ul class='nav navbar-nav navbar-right'>
	<li>{{#link-to 'index' class='active'}}Home{{/link-to}}</li>
	<li>{{#link-to 'about'}}About{{/link-to}}</li>
	</ul>
	</div>
	</div>
	<div class='container'>
	{{outlet}}
	</div>
	<footer class='container'>
	<hr />
	<p class='pull-left'>© 2013 The Flint & Flame</p>
	<p class='pull-right'>{{#link-to 'credits'}}Credits{{/link-to}}</p>
	</footer>
	</script>
	<script type='text/x-handlebars' data-template-name='index'>
	<div class="jumbotron">
	<h1>Welcome to The Flint & Flame!</h1>
	<p class="tagline">
	<img {{bind-attr src='logo'}} alt='Logo' />
	Everything you need to make it through the winter.
	</p>
	<p>Browse All {{productCount}} Items »</p>
	</div>
	<p class='pull-right text-muted'>Rendered on {{time}}</p>
	</script>

	<script type='text/x-handlebars' data-template-name='about'>
	<h1>About The Fire Spirits</h1>
	<p>{{open}}</p>
	<p><img {{bind-attr src='avatar'}} alt='Avatar' /></p>
	<p>Contact {{contactName}} for more info!</p>
	</script>

	<script type='text/x-handlebars' data-template-name='credits'>
	<h1>Thanks for the Help!</h1>
	<p>This site would not be possible without the hardworking Ember Core Team!</p>
	</script>
	</body>
	</html>
	var App = Ember.Application.create({
	LOG_TRANSITIONS: true
	});

	App.Router.map(function() {
	this.route('credits', { path: '/thanks' });
	this.route('about');
	});

	App.IndexController = Ember.Controller.extend({
	productsCount: 6,
	logo: 'images/logo.png',
	time: function() {
	return (new Date()).toDateString();
	}.property()
	});

	App.AboutController = Ember.Controller.extend({
	contactName: 'Anostagia',
	avatar: 'images/avatar.png',
	open: function() {
	return ((new Date()).getDay() === 0) ? "Closed" : "Open";
	}.property()
	})