Permalink
Browse files

haha! Rewrote basically the entire app.

  • Loading branch information...
1 parent 8f22b72 commit 273330f6c1a524204f38747aca3a2c8520ba5997 Julian Connor committed Mar 28, 2012
@@ -41,8 +41,8 @@ def charts_paginate
# Will is the best!
# GET /charts/1.xml
def show
- @data = @chart = Chart.find(params[:id])
- @data['songs'] = @chart.songs
+ @chart = Chart.find(params[:id])
+ @data = @chart.songs.map { |song| song.attributes }
render :json => @data.to_json
end
@@ -55,13 +55,13 @@
- <div id="content" class="container clearfix">
- <div id="charts"></div>
- <div class="right"></div>
- </div>
+ <% if current_user %>
+ <div id="content" class="container clearfix">
+ <div id="charts"></div>
+ <div id="songs"></div>
+ </div>
- <% if current_user %>
<div id="jquery_jplayer_1" class="jp-jplayer"></div>
<div class="jp-audio-container">
@@ -90,6 +90,8 @@
</div>
</div>
</div>
+ <% else %>
+ <div id="content" class="container clearfix"><%= yield %></div>
<% end %>
</body>
@@ -111,7 +113,7 @@
<span class="genre">{{= name }}</span>
</script>
- <script type="text/template" id="song_item_template">
+ <script type="text/template" id="song-item-template">
<td class="thumb">
<img src = "{{= thumbnail_small }}"/>
</td>
@@ -15,7 +15,8 @@
"jquery.jplayer.min.js",
"underscore.js",
"backbone.js",
- "application.js"
+ "application.js",
+ "jquery_extension.js"
]
MYVOLUME_JS_APP = [
"chart.view.js",
@@ -24,6 +25,7 @@
"chart.collection.js",
"song.view.js",
"songs.view.js",
+ "songstable.view.js",
"song.model.js",
"song.collection.js",
"workspace.js"
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
@@ -11,7 +11,16 @@ myvolume.views.Chart = Backbone.View.extend({
initialize: function() {
console.log("ChartItemView::Init");
- _.bindAll(this, 'render', 'triggerClicked');
+ _.bindAll(this,
+ 'render',
+ 'triggerClicked',
+ 'triggerActivate',
+ 'triggerDeactivate',
+ 'activate',
+ 'deactivate');
+
+ this.model.on('activate', this.activate);
+ this.model.on('deactivate', this.deactivate);
},
render: function() {
@@ -29,9 +38,20 @@ myvolume.views.Chart = Backbone.View.extend({
},
triggerClicked: function() {
- this.trigger('clicked', this.model);
- $('[active="true"]').attr('active', 'false');
+ this.trigger('chart:clicked', this.model);
+ },
+ triggerActivate: function() {
+ this.trigger('activate', this.model);
+ },
+ triggerDeactivate: function() {
+ this.trigger('deactivate', this.model);
+ },
+ activate: function() {
$(this.el).attr('active', 'true');
+ },
+ deactivate: function() {
+ $(this.el).attr('active', 'false');
}
+
});
@@ -8,28 +8,37 @@ myvolume.views.Charts = Backbone.View.extend({
this.collection = new myvolume.collections.Charts();
},
- render: function(chart_id) {
+ render: function() {
console.log("ChartsView::Render");
$(this.el).empty();
$.when(this.collection.fetch()).then(this.addAll);
return this;
},
addAll: function(callback) {
- console.log("ChartsView::addAll");
this.collection.each(this.addOne);
+
+ this.activeModel = this.collection.first();
+ this.activeModel.trigger('activate');
+
+ myvolume.views.songs.render(this.collection.first().get('id'));
return this;
},
addOne: function(chart) {
console.log("ChartsView::addOne");
var item = new myvolume.views.Chart({ model: chart});
- item.on('clicked', this.handleClick);
+ item.on('chart:clicked', this.handleClick);
$(this.el).append(item.render().el);
return this;
},
- handleClick: function() {
- console.log("clicked!", arguments);
+ handleClick: function(model) {
+
+ this.activeModel.trigger('deactivate');
+ this.activeModel = model;
+ this.activeModel.trigger('activate');
+
+ myvolume.views.songs.render(model.get('id'));
}
@@ -0,0 +1,8 @@
+(function($) {
+ $.fn.extend({
+ htmlFadeIn: function(dom_obj) {
+ $(this).hide().html(dom_obj);
+ $(this).fadeIn();
+ }
+ });
+})(jQuery);
@@ -1,4 +1,12 @@
myvolume.collections.Songs = Backbone.Collection.extend({
model: myvolume.models.Song,
- url: "/songs"
+ initialize: function() {
+ _.bindAll(this, 'url');
+ },
+ url: function() {
+ return "/songs?chart_id=" + this.id;
+ },
+ parse: function(response) {
+ return response;
+ }
});
@@ -1,10 +1,13 @@
-myvolume.views.Song = Backbone.View.extend({
+myvolume.views.SongRow = Backbone.View.extend({
tagName: 'tr',
events: {
"click" : "play"
},
+ template: _.template($('#song-item-template').html()),
+ templateGenre: _.template($('#genre-item-template').html()),
+
initialize: function() {
console.log("ChartItemView::Init");
@@ -13,16 +16,14 @@ myvolume.views.Song = Backbone.View.extend({
},
render: function() {
- console.log("ChartItemView::Render");
- console.log(this.model.toJSON());
+ console.log("ChartItemView::Render", this.model);
- var template = ich.song_item_template(this.model.toJSON());
- $(this.el).html(template);
+ $(this.el).html(this.template(this.model.toJSON()));
//TODO: Add Genres
- var genre = this.model.attributes.genre;
+ var genre = this.model.get('genre');
var node = this.$(".genre");
- node.append(ich.genre_item_template({ name: genre }));
+ node.append(this.templateGenre({ name: genre }));
return this;
},
@@ -1,28 +1,24 @@
myvolume.views.Songs = Backbone.View.extend({
- id: 'songs',
- tagName: 'table',
+ el: '#songs',
initialize: function(chartId) {
- console.log("ChartSongsView::Init");
- _.bindAll(this, "render", "addOne", "addAll");
+ _.bindAll(this,
+ 'render',
+ 'fadeIn');
+ this.view = new myvolume.views.SongsTable();
+ this.view.on('ready', this.fadeIn);
},
- render: function() {
- console.log("ChartSongsView::render");
- $('#content').append($(this.el));
- this.addAll();
+ render: function(id) {
+ myvolume.routers.workspace.navigate('charts/' + id);
+ $(this.el).empty();
+ $(this.el).html('<div class="loader"><img src="/images/ajax-loader.gif" /></div>');
+ this.view.render(id);
return this;
},
-
- addOne: function(result) {
- console.log("ChartSongsView::addOne");
- var song = new SongItemView({model: result});
- $(this.el).append(song.render().el);
- },
-
- addAll: function() {
- console.log("ChartSongsView::addAll");
- $('table#songs').empty();
+
+ fadeIn: function() {
+ $(this.el).htmlFadeIn(this.view.el);
}
-
+
});
@@ -0,0 +1,35 @@
+myvolume.views.SongsTable = Backbone.View.extend({
+ id: 'songs',
+ tagName: 'table',
+
+ initialize: function(chartId) {
+ console.log("ChartSongsView::Init");
+ _.bindAll(this, "render", "addOne", "addAll");
+ this.songs = new myvolume.collections.Songs();
+ this.songs.on('reset', this.addAll);
+ },
+
+ render: function(id) {
+ console.log("ChartSongsView::render");
+ this.songs.id = id;
+ //$(this.el).empty();
+ this.songs.fetch();
+ return this;
+ },
+
+ addAll: function() {
+ console.log("ChartSongsView::addAll");
+ $(this.el).empty();
+ this.songs.each(this.addOne);
+
+ this.trigger('ready');
+ },
+
+ addOne: function(result) {
+ console.log("ChartSongsView::addOne");
+ var song = new myvolume.views.SongRow({model: result});
+ $(this.el).append(song.render().el);
+ }
+
+
+});
Oops, something went wrong.

0 comments on commit 273330f

Please sign in to comment.