Ember.js Starter Kit

Based on latest version (as of today) of the official Ember.js starter kit: https://github.com/emberjs/starter-kit Links to latest full-size versions of Handlebars, Ember, and Ember-Data.

HTML

<script src="https://github.com/downloads/wycats/handlebars.js/handlebars-1.0.rc.1.js"></script>
<script src="https://github.com/downloads/emberjs/ember.js/ember-latest.js"></script>
<script src="https://github.com/downloads/emberjs/data/ember-data-latest.js"></script>
<div class="mainDiv">
<script type="text/x-handlebars" >  <!-- DELETE -->
	<table>
			<tr>
				<th>Track name</th>
				<th>Artist name</th>
				<th>Album name</th>
			</tr>
			
			{{#each Songs.compController}}
			<tr>
				<td>{{title}}</td>
				<td>{{artist}}</td>
				<td>{{album}}</td>
			</tr>
			{{/each}}
			
    </table>
</script> <!-- DELETE -->
</div>

CSS

.mainDiv {
    background-color:#DDD;
	text-align:center;
	width:550px;
	height:330px;
	position:absolute;
	left:50%;
	top:50%;
	margin-left:-275px;
	margin-top:-165px;
}

.mainDiv table {
    background-color:#FFF;
	width:100%;
}

.mainDiv table tr {
	height:26px;
	min-width:100px;
}

.mainDiv table tr:hover:not(:first-child) {
	background-color: #b4d20a;
	color:#000;
	font-weight:bold;
	cursor:pointer;	
}

JavaScript

Songs = Ember.Application.create({  }); 

Songs.Comp = Em.Object.extend({
    title: "-",
    artist: "-",
	album: "-"
});

Songs.compController = Ember.ArrayController.create({
    content: [],
    addSong: function(title, artist, album){ 
        var song = Songs.Comp.create({ 
			title: title,
            artist: artist,
            album: album
        });
        this.pushObject(song);
    }
});

Songs.compController.addSong(1,2,3);
Songs.compController.addSong(7,5,4);