templates added

Gemfile

@@ -20,6 +20,8 @@ gem 'jquery-rails'
 
 gem "koala"
 
+gem 'rails-backbone'
+
 # Use unicorn as the web server
 # gem 'unicorn'
 

Gemfile.lock

@@ -39,6 +39,7 @@ GEM
       coffee-script-source
       execjs
     coffee-script-source (1.6.1)
+    ejs (1.0.0)
     erubis (2.7.0)
     execjs (1.4.0)
       multi_json (~> 1.0)
@@ -78,6 +79,10 @@ GEM
       activesupport (= 3.2.12)
       bundler (~> 1.0)
       railties (= 3.2.12)
+    rails-backbone (0.7.2)
+      coffee-script (~> 2.2.0)
+      ejs (~> 1.0.0)
+      railties (>= 3.1.0)
     railties (3.2.12)
       actionpack (= 3.2.12)
       activesupport (= 3.2.12)
@@ -119,6 +124,7 @@ DEPENDENCIES
   jquery-rails
   koala
   rails (= 3.2.12)
+  rails-backbone
   sass-rails (~> 3.2.3)
   sqlite3
   turn

app/assets/javascripts/backbone/templates/feeds/index.jst.ejs

@@ -0,0 +1,12 @@
+<h1>Feeds</h1>
+
+<a href="#/new">New Feed</a>
+
+<table>
+	<tr>
+		<th>From</th>
+		<th>Message</th>
+		<th>Type</th>
+		<th>Like count</th>
+	</tr>
+</table>

app/assets/javascripts/backbone/templates/feeds/new.jst.ejs

@@ -0,0 +1,13 @@
+<h1>New feed</h1>
+
+<form id="new-feed" name="feed">
+	<div>
+		<b> message:</b>
+		<input type="text" name="message" id="message" />
+	</div>
+
+	<div>
+		<input type="submit" value="Create Feed" />
+	</div>
+</form>
+<a href="#">Home</a>

app/assets/javascripts/backbone/templates/feeds/show.jst.ejs

@@ -0,0 +1,6 @@
+<b>From name:</b>
+<em><%= from_name %></em>
+<b>message:</b>
+<em><%= message %></em>
+
+<a href="#">home</a>

app/assets/javascripts/backbone/views/feeds/feed_view.js

@@ -0,0 +1,7 @@
+App.Views.FeedView = Backbone.View.extend({
+	render: function() {
+		var template = JST["backbone/templates/feeds/feed"];
+    $(this.el).html(template(this.model.attributes))
+		return this;
+	}
+});

app/assets/javascripts/backbone/views/feeds/index_view.js

@@ -8,22 +8,30 @@ App.Views.IndexView = Backbone.View.extend({
     		$(this.el).find("tbody").append('no feeds yet');
     		return;
 		}
-		// TODO: use haml-js or jquery templates
+
+		for (var i = 0; i < this.feeds.models.length; i++)
+			this.addOne(this.feeds.models[i].attributes);
+	},
+
+	addOne: function(feed) {
+
 		var view = '';
 		var template = '<tr><td>[from_name]</td><td>[message]</td><td>[feed_type]</td><td>[like_count]</td><td><a href="#/[id]">Show</td></tr>';
-		for (var i = 0; i < this.feeds.models.length; i++) {
-			var feed = this.feeds.models[i].attributes;
-			view += template.replace('[from_name]', feed.from_name).replace('[message]', feed.message)
-				.replace('[feed_type]', feed.feed_type).replace('[like_count]', feed.like_count).replace('[id]', feed.id);
-		}
+		view = template.replace('[from_name]', feed.from_name).replace('[message]', feed.message)
+			.replace('[feed_type]', feed.feed_type).replace('[like_count]', feed.like_count).replace('[id]', feed.id);
 
-    	$(this.el).find("tbody").append(view);
+    $(this.el).find("tbody").append(view);
+/*
+
+		var view = new App.Views.FeedView({ model: feed });
+		$(this.el).find("tbody").append(view.render().el);*/
 	},
 
 	render: function() {
-		var table = '<h1>Feeds</h1><a href="#/new">New Feed</a><table><tr><th>From</th><th>Message</th><th>Type</th><th>Like count</th></tr></table>';
-		$(this.el).html(table);
+		var template = JST["backbone/templates/feeds/index"];
+    $(this.el).html(template)
+
 		this.addAll();
-		return this; // chain
+		return this;
 	}
 });

app/assets/javascripts/backbone/views/feeds/new_view.js

@@ -9,9 +9,8 @@ App.Views.NewView = Backbone.View.extend({
 	},
 
 	render: function() {
-		var template = '<h1>New feed</h1><form id="new-feed" name="feed"><div><b> message:</b><input type="text" name="message" id="message" /></div><div><input type="submit" value="Create Feed" /></div></form><a href="#">Home</a>';
-
-		$(this.el).html(template);
+		var template = JST["backbone/templates/feeds/new"];
+    $(this.el).html(template(this.model.attributes))
 		return this;
 	},
 

app/assets/javascripts/backbone/views/feeds/show_view.js

@@ -1,9 +1,7 @@
 App.Views.ShowView = Backbone.View.extend({
 	render: function() {
-		var template = '<b>From name:</b><em>[from_name]</em><b>message:</b><em>[message]</em><a href="#">home</a>';
-
-		var view = template.replace('[from_name]', this.model.attributes.from_name).replace('[message]', this.model.attributes.message);
-		$(this.el).html(view);
+		var template = JST["backbone/templates/feeds/show"];
+    $(this.el).html(template(this.model.attributes))
 		return this;
 	}
 });