oxodesign/gist:6416867

## gistfile1.txt
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">

<html lang="en">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
    <meta name="author" content="Joachim Haagen Skeie">

	<title>Ember Data</title>
	<link rel="stylesheet" href="css/bootstrap.css" type="text/css" charset="utf-8">
	<link rel="stylesheet" href="css/master.css" type="text/css" charset="utf-8">

    <script src="http://empir.io/emberjs/assets/js/vendor/jquery-1.9.1.js"></script>
    <script src="http://empir.io/emberjs/assets/js/vendor/handlebars-1.0.0.js"></script>
    <script src="http://empir.io/emberjs/assets/js/vendor/ember-1.0.0.js"></script>
    <script src="http://empir.io/emberjs/assets/js/vendor/ember-data.js"></script>
    <script src="http://empir.io/emberjs/assets/js/vendor/ember-data-localstorage.js"></script>
    <script src="http://empir.io/emberjs/assets/js/vendor/bootstrap.js"></script>

    <script type="text/javascript" charset="utf-8">
		App = Ember.Application.create();

		App.Router.map(function() {
			this.resource('companies', {path: '/'}, function() {
				this.resource('company', {path: '/company/:company_id'}, function() {
					this.route('employees');
				});
			});
		});

		App.IndexRoute = Ember.Route.extend({
			redirect: function() {
				 this.transitionTo('companies');
			}
		})

		App.CompaniesRoute = Ember.Route.extend({
		    model: function(){
		        return this.store.find('company');
		    }
		});

		App.CompanyRoute = Ember.Route.extend({
			actions: {
				addEmployee: function() {
					var company = this.modelFor('company');
					var controller = this.get('controller');

					if (company) {
						var newEmployee = this.store.createRecord('employee');
						newEmployee.set('name', controller.get('newEmployeeName'));
						newEmployee.set('company', company);


						company.get('employees').pushObject(newEmployee);
						company.save().then(function() {
							console.log('save success');
						}, function() {
							console.log('save failed');
						});


						newEmployee.save();

						controller.set('newEmployeeName', null);
					}
				}
			}
		})

		App.EmployeesRoute = Ember.Route.extend({
		    model: function(){
		        return this.store.find('employee');
		    }
		});

		App.CompaniesController = Ember.ArrayController.extend({
			newCompanyName: null,

			actions: {
				addCompany: function() {
					console.log('adding company: ' + this.get('newCompanyName'));
					var newCompany = this.store.createRecord('company');
					newCompany.set('name', this.get('newCompanyName'));
					this.set('newCompanyName', null);
					newCompany.save();
				}
			}
		});

		App.CompanyController = Ember.ObjectController.extend({
			newEmployeeName: null,
		})

		App.EmployeesController = Ember.ObjectController.extend({

		});


		App.Store = DS.Store.extend({
		    revision: 13,
		    adapter: DS.LSAdapter

		});

		App.Company = DS.Model.extend({
		    name: DS.attr('string'),

		    employees: DS.hasMany('employee')
		});

		App.Employee = DS.Model.extend({
		    name: DS.attr('string'),
		    email: DS.attr('string'),

		    company: DS.belongsTo('company')
		});
	</script>

	<!DOCTYPE html>
	<html>
	<head>

	<meta charset=utf-8 />
	<title>JS Bin</title>
	</head>
	<body>

	  <script type="text/x-handlebars">
	    <h2>Welcome to Ember.js</h2>

	    {{outlet}}
	  </script>

	  <script type="text/x-handlebars" data-template-name="index">
	      {{outlet}}
	  </script>


	  <script type="text/x-handlebars" data-template-name="companies">
		<h1>Companies</h1>
			{{input type="text" valueBinding="newCompanyName"}}
			<button {{action addCompany}}>Add Company</button> <br />
			<ul>
			{{#each controller}}
				<li>{{#linkTo "company" this}}{{name}}{{/linkTo}}</li>
			{{/each}}
			</ul>

			{{outlet}}
	  </script>

	  <script type="text/x-handlebars" data-template-name="company">
			<h1>Company: {{name}} Employees: </h1>
			{{input type="text" valueBinding="newEmployeeName"}}
			<button {{action addEmployee}}>Add Employee</button> <br />

			<ul>
			{{#each employees}}
				<li>{{name}}</li>
			{{/each}}
			</ul>
	  </script>
	</body>
	</html>
</head>
<body bgcolor="#ffffff">

</body>
</html>
	<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
	"http://www.w3.org/TR/html4/strict.dtd">

	<html lang="en">
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
	<meta name="author" content="Joachim Haagen Skeie">

	<title>Ember Data</title>
	<link rel="stylesheet" href="css/bootstrap.css" type="text/css" charset="utf-8">
	<link rel="stylesheet" href="css/master.css" type="text/css" charset="utf-8">

	<script src="http://empir.io/emberjs/assets/js/vendor/jquery-1.9.1.js"></script>
	<script src="http://empir.io/emberjs/assets/js/vendor/handlebars-1.0.0.js"></script>
	<script src="http://empir.io/emberjs/assets/js/vendor/ember-1.0.0.js"></script>
	<script src="http://empir.io/emberjs/assets/js/vendor/ember-data.js"></script>
	<script src="http://empir.io/emberjs/assets/js/vendor/ember-data-localstorage.js"></script>
	<script src="http://empir.io/emberjs/assets/js/vendor/bootstrap.js"></script>

	<script type="text/javascript" charset="utf-8">
	App = Ember.Application.create();

	App.Router.map(function() {
	this.resource('companies', {path: '/'}, function() {
	this.resource('company', {path: '/company/:company_id'}, function() {
	this.route('employees');
	});
	});
	});

	App.IndexRoute = Ember.Route.extend({
	redirect: function() {
	this.transitionTo('companies');
	}
	})

	App.CompaniesRoute = Ember.Route.extend({
	model: function(){
	return this.store.find('company');
	}
	});

	App.CompanyRoute = Ember.Route.extend({
	actions: {
	addEmployee: function() {
	var company = this.modelFor('company');
	var controller = this.get('controller');

	if (company) {
	var newEmployee = this.store.createRecord('employee');
	newEmployee.set('name', controller.get('newEmployeeName'));
	newEmployee.set('company', company);


	company.get('employees').pushObject(newEmployee);
	company.save().then(function() {
	console.log('save success');
	}, function() {
	console.log('save failed');
	});


	newEmployee.save();

	controller.set('newEmployeeName', null);
	}
	}
	}
	})

	App.EmployeesRoute = Ember.Route.extend({
	model: function(){
	return this.store.find('employee');
	}
	});

	App.CompaniesController = Ember.ArrayController.extend({
	newCompanyName: null,

	actions: {
	addCompany: function() {
	console.log('adding company: ' + this.get('newCompanyName'));
	var newCompany = this.store.createRecord('company');
	newCompany.set('name', this.get('newCompanyName'));
	this.set('newCompanyName', null);
	newCompany.save();
	}
	}
	});

	App.CompanyController = Ember.ObjectController.extend({
	newEmployeeName: null,
	})

	App.EmployeesController = Ember.ObjectController.extend({

	});


	App.Store = DS.Store.extend({
	revision: 13,
	adapter: DS.LSAdapter

	});

	App.Company = DS.Model.extend({
	name: DS.attr('string'),

	employees: DS.hasMany('employee')
	});

	App.Employee = DS.Model.extend({
	name: DS.attr('string'),
	email: DS.attr('string'),

	company: DS.belongsTo('company')
	});
	</script>

	<!DOCTYPE html>
	<html>
	<head>

	<meta charset=utf-8 />
	<title>JS Bin</title>
	</head>
	<body>

	<script type="text/x-handlebars">
	<h2>Welcome to Ember.js</h2>

	{{outlet}}
	</script>

	<script type="text/x-handlebars" data-template-name="index">
	{{outlet}}
	</script>


	<script type="text/x-handlebars" data-template-name="companies">
	<h1>Companies</h1>
	{{input type="text" valueBinding="newCompanyName"}}
	<button {{action addCompany}}>Add Company</button> <br />
	<ul>
	{{#each controller}}
	<li>{{#linkTo "company" this}}{{name}}{{/linkTo}}</li>
	{{/each}}
	</ul>

	{{outlet}}
	</script>

	<script type="text/x-handlebars" data-template-name="company">
	<h1>Company: {{name}} Employees: </h1>
	{{input type="text" valueBinding="newEmployeeName"}}
	<button {{action addEmployee}}>Add Employee</button> <br />

	<ul>
	{{#each employees}}
	<li>{{name}}</li>
	{{/each}}
	</ul>
	</script>
	</body>
	</html>
	</head>
	<body bgcolor="#ffffff">

	</body>
	</html>