JemiloII/jsbin.qakeba.css

## jsbin.qakeba.css
/* Put your CSS here */
html, body {
    margin: 20px;
}

.active {font-weight: bold;}

## jsbin.qakeba.html
<!DOCTYPE html>
<html>
<head>
	<title>Testing Ember</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
	<script src="http://builds.handlebarsjs.com.s3.amazonaws.com/handlebars-v1.3.0.js"></script>
	<script src="http://builds.emberjs.com/tags/v1.6.0/ember.js"></script>
	<script src="http://builds.emberjs.com/beta/ember-data.js"></script>
</head>
<body>
	<script type="text/x-handlebars">
		<nav>
			{{#link-to 'index'}}Home{{/link-to}} |
			{{#link-to 'members'}}Members{{/link-to}} |
			{{#link-to 'about'}}About{{/link-to}}
		</nav>
		<h1>Hello World!</h1>

		{{outlet}}
	</script>

	<script type="text/x-handlebars" id="index">
		<h2>Home</h2>
	</script>

	<script type="text/x-handlebars" id="members/index">
		<h2>Members</h2>
		<nav>{{#link-to 'members.new'}}New{{/link-to}}</nav>
		{{#each}}
			<p>Member: {{username}} Type: {{type}}</p>
		{{/each}}
	</script>

	<script type="text/x-handlebars" id="members/new">
		<h2>New Member</h2>
		<p>{{model.username}} {{model.type}}</p>
		{{input
			name="username"
			placeholder="Enter Username..."
			valueBinding="model.username"
		}}
		{{view Ember.Select
	       content=types
	       value=selectedType
	       selectionBinding="model.type"
	       prompt="Account type"
		}}
		<button {{action create target="controller"}}>Submit</button>
	</script>

	<script type="text/x-handlebars" id="about">
		<h2>About</h2>
	</script>


</body>
</html>

## jsbin.qakeba.js
App = Ember.Application.create({
	LOG_TRANSITIONS: true,
	LOG_TRANSITIONS_INTERNAL: true,
	LOG_ACTIVE_GENERATION: true,
	LOG_RESOLVER: true
});

App.Router.map(function(){
	this.resource('about');
	this.resource('forums', function(){

	});
	this.resource('threads');
	this.resource('posts');
	this.resource('members', function(){
		this.route('new');
	});
});

App.Router.reopen({
	rootURL: '/qakeba/29',
	location: 'history'
});

App.ApplicationAdapter = DS.RESTAdapter.extend({
	host: 'http://www.clanaoh.com'
});

App.ApplicationSerializer = DS.RESTSerializer.extend({
  serializeIntoHash: function(hash, type, record, options) {
    Ember.merge(hash, this.serialize(record, options));
  }
});

App.ApplicationStore = DS.Store.extend({});

Ember.DSModelRoute = Ember.Route.extend({
    deactivate: function() {
	    var model = this.get('controller.model');
	    model.rollback();
	    if (model.get('isNew')) {
	    	model.deleteRecord();
	    }
	},
	actions: {
    	willTransition: function(transition) {
    		var model = this.get('controller.model');
    	if (model.get('isDirty') && !this.willTransitionConfirm(transition)) {
        	transition.abort();
    	}
    }
	},
	willTransitionConfirm: function(transition) {
		/*jshint unused:false*/
		return true;
	}
});

App.Member = DS.Model.extend({
	username: DS.attr('string'),
	type: DS.attr('string'),
	createdAt: DS.attr('date'),
	updatedAt: DS.attr('date'),
});

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

App.MembersNewRoute = Ember.DSModelRoute.extend({
	model: function(){
		return this.store.createRecord('member');
	},
	setupController : function(controller, model){
        controller.set("model", model);
    }
});

App.MembersNewController = Ember.ObjectController.extend({
	selectedType: "Member",
	types: [
		"Member",
		"Creator",
		"Producer",
		"Moderator",
		"Administer"
	],
	actions: {
		create: function(){
			// console.log('ADDED NEW MEMBER');
			// console.log("Username: "+this.get('model.username') + " Type: " +this.get('model.type'));
			// console.log({username: this.get('model.username'), type: this.get('model.type')});
			this.store.createRecord('member', {username: this.get('model.username'), type: this.get('model.type')}).save();
			this.transitionToRoute('members.index');
		}
	}
});
	/* Put your CSS here */
	html, body {
	margin: 20px;
	}

	.active {font-weight: bold;}
	<!DOCTYPE html>
	<html>
	<head>
	<title>Testing Ember</title>
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
	<script src="http://builds.handlebarsjs.com.s3.amazonaws.com/handlebars-v1.3.0.js"></script>
	<script src="http://builds.emberjs.com/tags/v1.6.0/ember.js"></script>
	<script src="http://builds.emberjs.com/beta/ember-data.js"></script>
	</head>
	<body>
	<script type="text/x-handlebars">
	<nav>
	{{#link-to 'index'}}Home{{/link-to}} \|
	{{#link-to 'members'}}Members{{/link-to}} \|
	{{#link-to 'about'}}About{{/link-to}}
	</nav>
	<h1>Hello World!</h1>

	{{outlet}}
	</script>

	<script type="text/x-handlebars" id="index">
	<h2>Home</h2>
	</script>

	<script type="text/x-handlebars" id="members/index">
	<h2>Members</h2>
	<nav>{{#link-to 'members.new'}}New{{/link-to}}</nav>
	{{#each}}
	<p>Member: {{username}} Type: {{type}}</p>
	{{/each}}
	</script>

	<script type="text/x-handlebars" id="members/new">
	<h2>New Member</h2>
	<p>{{model.username}} {{model.type}}</p>
	{{input
	name="username"
	placeholder="Enter Username..."
	valueBinding="model.username"
	}}
	{{view Ember.Select
	content=types
	value=selectedType
	selectionBinding="model.type"
	prompt="Account type"
	}}
	<button {{action create target="controller"}}>Submit</button>
	</script>

	<script type="text/x-handlebars" id="about">
	<h2>About</h2>
	</script>




	</body>
	</html>
	App = Ember.Application.create({
	LOG_TRANSITIONS: true,
	LOG_TRANSITIONS_INTERNAL: true,
	LOG_ACTIVE_GENERATION: true,
	LOG_RESOLVER: true
	});

	App.Router.map(function(){
	this.resource('about');
	this.resource('forums', function(){

	});
	this.resource('threads');
	this.resource('posts');
	this.resource('members', function(){
	this.route('new');
	});
	});

	App.Router.reopen({
	rootURL: '/qakeba/29',
	location: 'history'
	});

	App.ApplicationAdapter = DS.RESTAdapter.extend({
	host: 'http://www.clanaoh.com'
	});

	App.ApplicationSerializer = DS.RESTSerializer.extend({
	serializeIntoHash: function(hash, type, record, options) {
	Ember.merge(hash, this.serialize(record, options));
	}
	});

	App.ApplicationStore = DS.Store.extend({});

	Ember.DSModelRoute = Ember.Route.extend({
	deactivate: function() {
	var model = this.get('controller.model');
	model.rollback();
	if (model.get('isNew')) {
	model.deleteRecord();
	}
	},
	actions: {
	willTransition: function(transition) {
	var model = this.get('controller.model');
	if (model.get('isDirty') && !this.willTransitionConfirm(transition)) {
	transition.abort();
	}
	}
	},
	willTransitionConfirm: function(transition) {
	/jshint unused:false/
	return true;
	}
	});

	App.Member = DS.Model.extend({
	username: DS.attr('string'),
	type: DS.attr('string'),
	createdAt: DS.attr('date'),
	updatedAt: DS.attr('date'),
	});

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

	App.MembersNewRoute = Ember.DSModelRoute.extend({
	model: function(){
	return this.store.createRecord('member');
	},
	setupController : function(controller, model){
	controller.set("model", model);
	}
	});

	App.MembersNewController = Ember.ObjectController.extend({
	selectedType: "Member",
	types: [
	"Member",
	"Creator",
	"Producer",
	"Moderator",
	"Administer"
	],
	actions: {
	create: function(){
	// console.log('ADDED NEW MEMBER');
	// console.log("Username: "+this.get('model.username') + " Type: " +this.get('model.type'));
	// console.log({username: this.get('model.username'), type: this.get('model.type')});
	this.store.createRecord('member', {username: this.get('model.username'), type: this.get('model.type')}).save();
	this.transitionToRoute('members.index');
	}
	}
	});