Handled quantity update error that was fixed in Master, but not in Modern.

This commit is contained in:
Elf M. Sternberg 2011-08-07 21:34:41 -07:00
parent b7603b24f8
commit 6c6772dc79
7 changed files with 106 additions and 69 deletions

View File

@ -169,8 +169,10 @@ Also, it would be nice to know the total price of the Item.
<<cart models>>=
class Item extends Backbone.Model
update: (amount) ->
@set
quantity: @get('quantity')
if amount == @get('quantity')
return
@set {quantity: amount}, {silent: true}
@collection.trigger('change', this)
price: () ->
@get('product').get('price') * @get('quantity')
@ -735,6 +737,11 @@ rounded(radius)
border-top-right-radius: radius
border-bottom-left-radius: radius
background_gradient(base)
background: base
background: -webkit-gradient(linear, left top, left bottom, from(lighten(base, 20%)), to(darken(base, 20%)))
background: -moz-linear-gradient(top, lighten(base, 20%), darken(base, 20%))
@
And if you look down below you'll see the [[rounded()]] function
@ -756,9 +763,10 @@ body
#header
background: #C97E41
background_gradient(#999)
margin: 0px
padding: 20px
border-bottom: 1px solid #ccc
h1
font-family: Inconsolata, Monaco, Courier, mono
@ -771,7 +779,7 @@ body
right: 0px
text-align: right
padding: 10px
background: #714625
background_gradient(#555)
color: #FFF
font-size: 12px
font-weight: bold
@ -802,9 +810,11 @@ img
font-size: 14px
.item-detail
margin: 10px 0 0 10px
.item-image
float:left
margin-right: 10px
.item-info
padding: 100px 10px 0px 10px

View File

@ -21,11 +21,11 @@
</ul>
</script>
<script id="store_item_template" type="text/x-underscore-template">
<div class="item-detail"></div>
<div class="item-detail">
<div class="item-image">
<img alt="<%= title %>" src="<%= large_image %>" />
</div>
<div class="item-info"></div>
<div class="item-info">
<div class="item-artist"><%= artist %></div>
<div class="item-title"><%= title %></div>
<div class="item-price">$<%= price %></div>
@ -45,6 +45,8 @@
<div class="back-link">
<a href="#">&laquo; Back to Items</a>
</div>
</div>
</div>
</script>
<script id="store_cart_template" type="text/x-underscore-template">
<p>Items: <%= count %> ($<%= cost %>)</p>

View File

@ -6,9 +6,12 @@ body {
padding: 0px;
}
#header {
background: #c97e41;
background: #999;
background: -webkit-gradient(linear, left top, left bottom, from(#b8b8b8), to(#7a7a7a));
background: -moz-linear-gradient(top, #b8b8b8, #7a7a7a);
margin: 0px;
padding: 20px;
border-bottom: 1px solid #ccc;
}
#header h1 {
font-family: Inconsolata, Monaco, Courier, mono;
@ -21,7 +24,9 @@ body {
right: 0px;
text-align: right;
padding: 10px;
background: #714625;
background: #555;
background: -webkit-gradient(linear, left top, left bottom, from(#666), to(#444));
background: -moz-linear-gradient(top, #666, #444);
color: #fff;
font-size: 12px;
font-weight: bold;
@ -61,8 +66,12 @@ img {
font-weight: bold;
font-size: 14px;
}
.item-detail {
margin: 10px 0 0 10px;
}
.item-detail .item-image {
float: left;
margin-right: 10px;
}
.item-detail .item-info {
padding: 100px 10px 0px 10px;

View File

@ -12,6 +12,11 @@ rounded(radius)
border-top-right-radius: radius
border-bottom-left-radius: radius
background_gradient(base)
background: base
background: -webkit-gradient(linear, left top, left bottom, from(lighten(base, 20%)), to(darken(base, 20%)))
background: -moz-linear-gradient(top, lighten(base, 20%), darken(base, 20%))
body
font-family: "Lucida Grande", Lucida, Helvetica, Arial, sans-serif
background: #FFF
@ -21,9 +26,10 @@ body
#header
background: #C97E41
background_gradient(#999)
margin: 0px
padding: 20px
border-bottom: 1px solid #ccc
h1
font-family: Inconsolata, Monaco, Courier, mono
@ -36,7 +42,7 @@ body
right: 0px
text-align: right
padding: 10px
background: #714625
background_gradient(#555)
color: #FFF
font-size: 12px
font-weight: bold
@ -67,9 +73,11 @@ img
font-size: 14px
.item-detail
margin: 10px 0 0 10px
.item-image
float:left
margin-right: 10px
.item-info
padding: 100px 10px 0px 10px

View File

@ -12,8 +12,10 @@ class ProductCollection extends Backbone.Collection
class Item extends Backbone.Model
update: (amount) ->
@set
quantity: @get('quantity')
if amount == @get('quantity')
return
@set {quantity: amount}, {silent: true}
@collection.trigger('change', this)
price: () ->
@get('product').get('price') * @get('quantity')

View File

@ -36,9 +36,15 @@
Item.__super__.constructor.apply(this, arguments);
}
Item.prototype.update = function(amount) {
return this.set({
quantity: this.get('quantity')
if (amount === this.get('quantity')) {
return;
}
this.set({
quantity: amount
}, {
silent: true
});
return this.collection.trigger('change', this);
};
Item.prototype.price = function() {
return this.get('product').get('price') * this.get('quantity');