bodyrep/bodyrep-sandpit
1
0
Fork 0
mirror of https://github.com/bodyrep/bodyrep-sandpit.git synced 2026-01-25 06:11:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

Backbone + REST API implementation

Browse Source
This commit is contained in:
root
2012-10-23 16:52:18 +11:00
parent 908e993ce5
commit 9e7c5c5131
10 changed files with 2346 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1687
bodyrep/media/js/backbone-relational.js Normal file
View File

File diff suppressed because it is too large Load Diff

12
bodyrep/templates/core/member/comment.html Normal file
View File

@@ -0,0 +1,12 @@
{% for c in p.comment_set.all %}
<div class="user-sub-comment">
<div class="sub-avatar user2"></div>
<a>{{p.member.firstname}} {{p.member.lastname}}</a>
<p id='ctx'>{{c.text}}</p>
<div class="like-comment-time">
<i class="icon-thumbs-up"></i>
<i class="icon-comment"></i>
<span>{{c.created}}</span>
</div>
</div>
{% endfor %}

12
bodyrep/templates/core/member/commentModel.html Normal file
View File

@@ -0,0 +1,12 @@
<script type="text/template" id="commentModel">
<div class="user-sub-comment">
<div class="sub-avatar user2"></div>
<a><%= firstname %><%= lastname %></a>
<p id='ctx'><%= text %></p>
<div class="like-comment-time">
<i class="icon-thumbs-up"></i>
<i class="icon-comment"></i>
<span><%= created %></span>
</div>
</div>
</script>

13
bodyrep/templates/core/member/post.html
View File

@@ -24,19 +24,8 @@
<i class="icon-comment"></i>
<span>{{ p.created }}</span>
</div>
{% include 'core/member/comment.html' %}
{% for c in p.comment_set.all %}
<div class="user-sub-comment">
<div class="sub-avatar user2"></div>
<a>{{p.member.firstname}} {{p.member.lastname}}</a>
<p id='ctx'>{{c.text}}</p>
<div class="like-comment-time">
<i class="icon-thumbs-up"></i>
<i class="icon-comment"></i>
<span>{{c.created}}</span>
</div>
</div>
{% endfor %}
<div class="user-sub-comment">
<div class="sub-avatar user2"></div>
<p id='ctx'><input type='text' class='comment' placeholder='Type something' /></p>

38
bodyrep/templates/core/member/postModel.html Normal file
View File

@@ -0,0 +1,38 @@
<script type="text/template" id="postModel">
<div class="stats">
<div class="comment_block">
<div class="block_types">
<div class="block_type greenbd">
<i class="gicon-search"></i>
</div>
<div class="block_type orangebd">
<i class="gicon-screen"></i>
</div>
</div>
</div>
<div class="tnc-blurb">
<i class="icon-time"></i>
45
<i class="icon-signal"></i>
900
</div>
<div class="basic-comment">
<%= text %>
</div>
<div class="like-comment-time">
<i class="icon-thumbs-up"></i>
<i class="icon-comment"></i>
<span><%= created %></span>
</div>
<div class="user-sub-comment">
<div class="sub-avatar user2"></div>
<p id='ctx'><input type='text' class='comment' placeholder='Type something' /></p>
<div class="like-comment-time hidden">
<i class="icon-thumbs-up"></i>
<i class="icon-comment"></i>
<span>{{c.created}}</span>
</div>
</div>
</div>
</script>

56
bodyrep/templates/core/member/profile.html
View File

@@ -4,12 +4,14 @@
{% block content %}
{% include 'navbar.html' %}
{% include 'core/member/profileModel.html' %}
{% include 'core/member/postModel.html' %}
<!--
<div class="row-fluid">
<div class="span2">
<div class="well sidebar-nav">
<ul class="nav nav-list">
<li class="nav-header">Profile</li>
<li class="nav-header">Profile (member)</li>
<li class="active"><a href="#">Body Stats</a></li>
<li><a href="#">Body Reputation</a></li>
<li><a href="#">Challenges</a></li>
@@ -20,11 +22,12 @@
<li class="nav-header">Apps</li>
<li class="nav-header">Shopping</li>
</ul>
</div><!--/.well -->
</div><!--/span-->
</div>
</div>
<div class="span6" id='mcnt'>
<div class="row-fluid">
<h2 class="pull-left">{{ member.firstname }} {{ member.lastname }}</h2>
</div>
<div class="row-fluid" style='font-size : 12px;'>
<i class="icon-signal"></i><span> Weight: 100kg ( <div class='arrowup'></div> 0)</span>
@@ -65,47 +68,10 @@
</div>
</div>
{% include 'core/member/post.html' %}
</div>
<div class="span4">
<div class="hero-unit">
<h1>Hello, world!</h1>
<p>This is a template for a simple marketing or informational website. It includes a large callout called the hero unit and three supporting pieces of content. Use it as a starting point to create something more unique.</p>
<p><a id='test' class="btn btn-primary btn-large">Learn more &raquo;</a></p>
{% include 'core/member/rightMenu.html' %}
</div>
<div class="row-fluid">
<div class="span4">
<h2>Heading</h2>
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
<p><a class="btn" href="#">View details &raquo;</a></p>
</div><!--/span-->
<div class="span4">
<h2>Heading</h2>
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
<p><a class="btn" href="#">View details &raquo;</a></p>
</div><!--/span-->
<div class="span4">
<h2>Heading</h2>
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
<p><a class="btn" href="#">View details &raquo;</a></p>
</div><!--/span-->
</div><!--/row-->
<div class="row-fluid">
<div class="span4">
<h2>Heading</h2>
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
<p><a class="btn" href="#">View details &raquo;</a></p>
</div><!--/span-->
<div class="span4">
<h2>Heading</h2>
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
<p><a class="btn" href="#">View details &raquo;</a></p>
</div><!--/span-->
<div class="span4">
<h2>Heading</h2>
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
<p><a class="btn" href="#">View details &raquo;</a></p>
</div><!--/span-->
</div><!--/row-->
</div><!--/span-->
</div><!--/row-->
</div>-->
{% endblock %}

227
bodyrep/templates/core/member/profileModel.html Normal file
View File

@@ -0,0 +1,227 @@
<script type="text/template" id="profileModel">
<div class="row-fluid">
<h2 class="pull-left"><%= firstname %> <%= lastname %></h2>
</div>
<div class="row-fluid" style='font-size : 12px;'>
<i class="icon-signal"></i><span> Weight: 100kg ( <div class='arrowup'></div> 0)</span>
<span>Bodyfat: 20% ( <div class='arrowup'></div> 2)</span>
<span>Measurements: 400cm ( <div class='arrowup'></div> 15)</span>
</div>
<div class="row-fluid" style='font-size : 12px;'>
<i class="icon-home"></i><span> Lives in </span><a>Calgary, Alberta</a>
<i class="icon-signal"></i><span> Trains at </span><a>Talisman Center,Fitness First</a>
<i class="icon-signal"></i><span> Hobbies: </span><a>Skiing,</a><span> and </span><a>(5) other</a><span> ...</span>
<i class="icon-signal"></i><span> Professionals: </span><a>Heath Spence</a><span>,</span><a>Steve Baudo</a><a> see more...</a>
</div>
<hr />
<div class="row-fluid">
<h5 class="pull-left">Filters:</h5>
<div class="pull-left">
<div class="block_type_small redbg redbd pull-left">
<i class="icon-user icon-white"></i>
</div>
<div class="block_type_small bluebg bluebd pull-left">
<i class="icon-wrench icon-white"></i>
</div>
<div class="block_type_small orangebg orangebd pull-left">
<i class="icon-magnet icon-white"></i>
</div>
<div class="block_type_small tealbg tealbd pull-left">
<i class="icon-heart icon-white"></i>
</div>
<div class="block_type_small purplebg purplebd pull-left">
<i class="icon-th icon-white"></i>
</div>
<div class="block_type_small greenbg greenbd pull-left">
<i class="icon-book icon-white"></i>
</div>
<div class="block_type_small graybg graybd pull-left">
<i class="icon-file icon-white"></i>
</div>
</div>
</div>
</script>
<script type="text/javascript">
$LAB.script("/s/js/backbone.js")
.script("/s/js/backbone-relational.js").wait(function() {
window.Post = Backbone.RelationalModel.extend({
idAttribute: 'id',
urlRoot: function () {
// Seems like there would be a better way to get this information. this.get and this.id don't work
var un = this.collection.models[0].attributes.username.attributes.username;
return '/api/member/'+un+'/posts/';
},
defaults: {
"text": '',
'username': '',
"created": ''
}
/*url: function() {
var origUrl = Backbone.Model.prototype.url.call(this);
un = this.attributes['username'].attributes['username'];
return ('/api/member/'+un+'/posts/');
//return origUrl + (origUrl.charAt(origUrl.length - 1) == '/' ? '' : '/');
}*/
});
window.Member = Backbone.RelationalModel.extend({
relations: [
{
type: Backbone.HasMany,
key: 'post',
relatedModel: 'window.Post',
reverseRelation: {
key: 'username'
}
}
] ,
idAttribute: 'username',
defaults: {
"username": '',
"firstname": '',
"lastname": ''
},
urlRoot: "/api/member",
url: function() {
var origUrl = Backbone.Model.prototype.url.call(this);
return origUrl + (origUrl.charAt(origUrl.length - 1) == '/' ? '' : '/');
}
});
window.MemberView = Backbone.View.extend({
tagName: "div",
template:_.template($('#profileModel').html()),
initialize: function() {
this.model.bind("change", this.render, this);
post = new Post({username: this.model.get('username')})
post.fetch()
this.postview = new PostView({el: "#postModel", model: post});
this.post = post;
},
render: function(eventName) {
$(this.el).html(this.template(this.model.toJSON()));
return this;
},
events: {
"change input": "change",
//"click .save": "saveMember",
//"click .delete": "deleteMember"
},
change: function(event) {
var target = event.target;
var change = {};
change[target.id] = target.value;
this.model.set(change);
this.model.save();
},
});
/*window.MemberCollection = Backbone.Collection.extend({
model: Member,
url: "/api/member/"
});*/
var PostView = Backbone.View.extend({
template:_.template($('#postModel').html()),
tagName: "div", // Not required since 'div' is the default if no el or tagName specified
initialize: function() {
// I want to re-render on changes
//this.model.bind("change", this.render, this);
// Render
},
render: function() {
// Just render my template /this.template()
$(this.el).html(this.template(this.model.toJSON()));
return this;
},
});
/*window.PostCollection = Backbone.Collection.extend({
model: Post,
url: function( models ) {
// Logic to create a url for the whole collection, or a set of models.
// See the tests, or Backbone-tastypie, for an example.
return '/api/member/' + _.pluck( models, 'username' ) + 'comments';
}
});*/
Backbone.View.prototype.close = function () {
if (this.beforeClose) {
this.beforeClose();
}
this.remove();
this.unbind();
};
// Router
var AppRouter = Backbone.Router.extend({
initialize: function() {
//$('#header').html( new HeaderView().render().el );
_.bindAll(this);
},
routes:{
"::username":"viewMember"
},
viewMember: function(username) {
var member = new Member({username: username});
member.fetch();
app.showView( '#mcnt', new MemberView({model: member}) );
//app.showView( '#test', new PostView({model: member.post}) );
},
showView: function(selector, view) {
if (this.currentView)
this.currentView.close();
$(selector).html(view.render().el);
this.currentView = view;
return view;
},
before: function(callback) {
// if (this.MemberList) {
// if (callback) callback();
// } else {
var member = new Member({username: username});
member.fetch();
// this.MemberList = new MemberCollection();
// this.MemberList.fetch({success: function() {
// $('.symfony-content').html( new MemberListView({model: app.MemberList}).render().el );
// if (callback) callback();
// }});
//}
}
});
var app = new AppRouter();
Backbone.history.start();
});
</script>

41
bodyrep/templates/core/member/rightMenu.html Normal file
View File

@@ -0,0 +1,41 @@
<div class="span4">
<div class="hero-unit">
<h1>Member right</h1>
<p>This is a template for a simple marketing or informational website. It includes a large callout called the hero unit and three supporting pieces of content. Use it as a starting point to create something more unique.</p>
<p><a class="btn btn-primary btn-large">Learn more &raquo;</a></p>
</div>
<div class="row-fluid">
<div class="span4">
<h2>Heading</h2>
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
<p><a class="btn" href="#">View details &raquo;</a></p>
</div>
<div class="span4">
<h2>Heading</h2>
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
<p><a class="btn" href="#">View details &raquo;</a></p>
</div>
<div class="span4">
<h2>Heading</h2>
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
<p><a class="btn" href="#">View details &raquo;</a></p>
</div>
</div>
<div class="row-fluid">
<div class="span4">
<h2>Heading</h2>
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
<p><a class="btn" href="#">View details &raquo;</a></p>
</div>
<div class="span4">
<h2>Heading</h2>
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
<p><a class="btn" href="#">View details &raquo;</a></p>
</div>
<div class="span4">
<h2>Heading</h2>
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
<p><a class="btn" href="#">View details &raquo;</a></p>
</div>
</div>
</div>

274
bodyrep/templates/core/user/profile.html Normal file
View File

@@ -0,0 +1,274 @@
{% extends 'base.html' %}
{% block title %}BodyRep{% endblock %}
{% block content %}
{% include 'navbar.html' %}
<div class="row-fluid">
<div class="span2">
<div class="well sidebar-nav">
<ul class="nav nav-list">
<li class="nav-header">Profile (user)</li>
<li class="active"><a href="#">Body Stats</a></li>
<li><a href="#">Body Reputation</a></li>
<li><a href="#">Challenges</a></li>
<li class="nav-header">Workouts</li>
<li class="nav-header">Meals</li>
<li class="nav-header">Community</li>
<li class="nav-header">Learning</li>
<li class="nav-header">Apps</li>
<li class="nav-header">Shopping</li>
</ul>
</div><!--/.well -->
</div><!--/span-->
<div class="span6" id='ucnt'>
<div class="row-fluid">
<h2 class="pull-left">{{ member.firstname }} {{ member.lastname }}</h2>
<a class="pull-right btn btn-primary btn-mini" id='edprf' href="#"><i class="icon-cog icon-white"></i> Edit Profile</a>
</div>
<div class="row-fluid" style='font-size : 12px;'>
<i class="icon-signal"></i><span> Weight: 100kg ( <div class='arrowup'></div> 0)</span>
<span>Bodyfat: 20% ( <div class='arrowup'></div> 2)</span>
<span>Measurements: 400cm ( <div class='arrowup'></div> 15)</span>
</div>
<div class="row-fluid" style='font-size : 12px;'>
<i class="icon-home"></i><span> Lives in </span><a>Calgary, Alberta</a>
<i class="icon-signal"></i><span> Trains at </span><a>Talisman Center,Fitness First</a>
<i class="icon-signal"></i><span> Hobbies: </span><a>Skiing,</a><span> and </span><a>(5) other</a><span> ...</span>
<i class="icon-signal"></i><span> Professionals: </span><a>Heath Spence</a><span>,</span><a>Steve Baudo</a><a> see more...</a>
</div>
<hr />
<div class="row-fluid">
<h5 class="pull-left">Filters:</h5>
<div class="pull-left">
<div class="block_type_small redbg redbd pull-left">
<i class="icon-user icon-white"></i>
</div>
<div class="block_type_small bluebg bluebd pull-left">
<i class="icon-wrench icon-white"></i>
</div>
<div class="block_type_small orangebg orangebd pull-left">
<i class="icon-magnet icon-white"></i>
</div>
<div class="block_type_small tealbg tealbd pull-left">
<i class="icon-heart icon-white"></i>
</div>
<div class="block_type_small purplebg purplebd pull-left">
<i class="icon-th icon-white"></i>
</div>
<div class="block_type_small greenbg greenbd pull-left">
<i class="icon-book icon-white"></i>
</div>
<div class="block_type_small graybg graybd pull-left">
<i class="icon-file icon-white"></i>
</div>
</div>
</div>
<div class="stats" id='stats1'>
<div class="comment_block">
<div class="block_types">
<div class="block_type redbd">
<i class="gicon-magnet"></i>
</div>
</div>
</div>
<div class="tnc-blurb">
<i class="icon-signal"></i>
565
</div>
<div class="basic-comment">
<b>Breakfast:</b><span> 30g Oats, 1x Banana, 5x Egg Whites</span>
</div>
<div class="like-comment-time">
<i class="icon-thumbs-up"></i>
<i class="icon-comment"></i>
<span>14 minutes ago</span>
</div>
<div class="user-sub-comment">
<div class='sub-avatar user1'></div>
<a>Brian Goff</a>
<p>Good to see you're keeping up the good work mate. Keep us posted ;)</p>
<div class="like-comment-time">
<i class="icon-thumbs-up"></i>
<i class="icon-comment"></i>
<span>April 3 at 2:05pm</span>
</div>
</div>
<div class="user-sub-comment">
<div class='sub-avatar user2'></div>
<a>Alex Zborowski</a>
<p>Well it's not easy but you do your best every day and you judge every action.</p>
<div class="like-comment-time">
<i class="icon-thumbs-up"></i>
<i class="icon-comment"></i>
<span>April 3 at 2:05pm</span>
</div>
</div>
</div>
<div class="stats">
<div class="comment_block">
<div class="block_types">
<div class="block_type greenbd">
<i class="gicon-search"></i>
</div>
<div class="block_type orangebd">
<i class="gicon-screen"></i>
</div>
</div>
</div>
<div class="tnc-blurb">
<i class="icon-time"></i>
45
<i class="icon-signal"></i>
900
</div>
<div class="basic-comment">
Workout at <a>Talisman Center</a> with <a>Brian Goff</a>
</div>
<div class="like-comment-time">
<i class="icon-thumbs-up"></i>
<i class="icon-comment"></i>
<span>37 minutes ago</span>
</div>
</div>
<div class="stats">
<div class="comment_block">
<div class="block_types">
<div class="block_type greenbd">
<i class="gicon-search"></i>
</div>
</div>
</div>
<div class="tnc-blurb">
<i class="icon-time"></i>
90
<i class="icon-signal"></i>
720
</div>
<div class="basic-comment">
Workout at <a>Talisman Center</a>
</div>
<div class="like-comment-time">
<i class="icon-thumbs-up"></i>
<i class="icon-comment"></i>
<span>April 4 at 7:00pm</span>
</div>
</div>
<div class="stats">
<div class="comment_block">
<div class="block_types">
<div class="block_type bluebd">
<i class="gicon-profile"></i>
</div>
</div>
</div>
<div class="tnc-blurb">
</div>
<div class="basic-comment">
You commented on <a>Brian Goff's workout</a>
</div>
<div class="like-comment-time">
<i class="icon-thumbs-up"></i>
<i class="icon-comment"></i>
<span>April 4 at 6:30pm</span>
</div>
</div>
<div class="stats">
<div class="comment_block">
<div class="block_types">
<div class="block_type purplebd">
<i class="gicon-profile"></i>
</div>
</div>
</div>
<div class="tnc-blurb">
</div>
<div class="basic-comment">
Your read <a>"Fatigue Recovery & Supercompensation Theory"</a>
</div>
<div class="like-comment-time">
<i class="icon-thumbs-up"></i>
<i class="icon-comment"></i>
<span>April 2 at 8:00am</span>
</div>
</div>
<div class="stats">
<div class="comment_block">
<div class="block_types">
<div class="block_type greenbd">
<i class="gicon-search"></i>
</div>
<div class="block_type orangebd">
<i class="gicon-screen"></i>
</div>
<div class="block_type tealbd">
<i class="gicon-line"></i>
</div>
</div>
</div>
<div class="tnc-blurb">
<i class="icon-time"></i>
30
<i class="icon-signal"></i>
450
</div>
<div class="basic-comment">
<a>Workout</a> using <a>Runtracker</a> with <a>Brian Goff</a>
</div>
<div class="like-comment-time">
<i class="icon-thumbs-up"></i>
<i class="icon-comment"></i>
<span>April 2 at 6:00am</span>
</div>
</div>
<div class="stats">
<div class="comment_block">
<div class="block_types">
<div class="block_type orangebd">
<i class="gicon-screen"></i>
</div>
</div>
</div>
<div class="user-comment">
<div class='avatar user1'></div>
<a>Brian Goff</a>
<p>Hey "mate"! Want to train at the <a>Talisman</a> again tonight?</p>
</div>
<div class="like-comment-time">
<i class="icon-thumbs-up"></i>
<i class="icon-comment"></i>
<span>April 3 at 2:00pm</span>
</div>
<div class="user-sub-comment">
<div class='sub-avatar user2'></div>
<a>Alex Zborowski</a>
<p>Sorry Brian, working on the BodyREP pitch tonight.</p>
<div class="like-comment-time">
<i class="icon-thumbs-up"></i>
<i class="icon-comment"></i>
<span>April 3 at 2:05pm</span>
</div>
</div>
<div class="user-sub-comment">
<div class='sub-avatar user1'></div>
<a>Brian Goff</a>
<p>No worries "mate", maybe next time.</p>
<div class="like-comment-time">
<i class="icon-thumbs-up"></i>
<i class="icon-comment"></i>
<span>April 3 at 2:07pm</span>
</div>
</div>
</div>
</div>
{% include 'core/user/rightMenu.html' %}
</div>
{% endblock %}

41
bodyrep/templates/core/user/rightMenu.html Normal file
View File

@@ -0,0 +1,41 @@
<div class="span4">
<div class="hero-unit">
<h1>User right</h1>
<p>This is a template for a simple marketing or informational website. It includes a large callout called the hero unit and three supporting pieces of content. Use it as a starting point to create something more unique.</p>
<p><a class="btn btn-primary btn-large">Learn more &raquo;</a></p>
</div>
<div class="row-fluid">
<div class="span4">
<h2>Heading</h2>
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
<p><a class="btn" href="#">View details &raquo;</a></p>
</div>
<div class="span4">
<h2>Heading</h2>
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
<p><a class="btn" href="#">View details &raquo;</a></p>
</div>
<div class="span4">
<h2>Heading</h2>
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
<p><a class="btn" href="#">View details &raquo;</a></p>
</div>
</div>
<div class="row-fluid">
<div class="span4">
<h2>Heading</h2>
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
<p><a class="btn" href="#">View details &raquo;</a></p>
</div>
<div class="span4">
<h2>Heading</h2>
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
<p><a class="btn" href="#">View details &raquo;</a></p>
</div>
<div class="span4">
<h2>Heading</h2>
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
<p><a class="btn" href="#">View details &raquo;</a></p>
</div>
</div>
</div>