Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Link up individual items on the index page

  • Loading branch information...
commit 3795eedc2130c3de561b57b824598e5b823c581f 1 parent dc1a9c7
@quirkey quirkey authored
View
3  javascripts/json_store.js
@@ -18,8 +18,9 @@
});
this.get('#/', function(context) {
+ context.app.swap('');
$.each(context.items, function(i, item) {
- context.partial('templates/item.template', {item: item}, function(rendered) {
+ context.partial('templates/item.template', {id: i, item: item}, function(rendered) {
context.$element().append(rendered);
});
});
View
10 stylesheets/jsonstore.css
@@ -20,6 +20,10 @@ body {
margin: 0px;
}
+img {
+ border: 0;
+}
+
.item {
float:left;
width: 250px;
@@ -33,3 +37,9 @@ body {
font-weight: bold;
font-size: 14px;
}
+.item-detail .item-image {
+ float:left;
+}
+.item-detail .item-info {
+ padding: 100px 10px 0px 10px;
+}
View
4 templates/item.template
@@ -1,5 +1,7 @@
<div class="item">
- <div class="item-image"><img src="<%= item.image %>" alt="<%= item.title %>" /></div>
+ <div class="item-image">
+ <a href="#/item/<%= id %>"><img src="<%= item.image %>" alt="<%= item.title %>" /></a>
+ </div>
<div class="item-artist"><%= item.artist %></div>
<div class="item-title"><%= item.title %></div>
<div class="item-price">$<%= item.price %></div>
View
12 templates/item_detail.template
@@ -1,8 +1,10 @@
<div class="item-detail">
<div class="item-image"><img src="<%= item.large_image %>" alt="<%= item.title %>" /></div>
- <div class="item-artist"><%= item.artist %></div>
- <div class="item-title"><%= item.title %></div>
- <div class="item-price">$<%= item.price %></div>
- <div class="item-link"><a href="<%= item.url %>">Buy this item on Amazon</a></div>
- <div class="back-link"><a href="#/">&laquo; Back to Items</a></div>
+ <div class="item-info">
+ <div class="item-artist"><%= item.artist %></div>
+ <div class="item-title"><%= item.title %></div>
+ <div class="item-price">$<%= item.price %></div>
+ <div class="item-link"><a href="<%= item.url %>">Buy this item on Amazon</a></div>
+ <div class="back-link"><a href="#/">&laquo; Back to Items</a></div>
+ </div>
</div>
Please sign in to comment.
Something went wrong with that request. Please try again.