Clean javascript is clean <3

This commit is contained in:
Tom Naessens 2014-12-10 00:38:48 +01:00
parent dc50fdec88
commit 3eeaaf3835
6 changed files with 43 additions and 47 deletions

View file

@ -3,23 +3,23 @@
# You can use CoffeeScript in this file: http://coffeescript.org/
ready = ->
$('.btn-inc').on 'click', ->
increment(this, 1)
increment($(this), 1)
$('.btn-dec').on 'click', ->
increment(this, -1)
increment($(this), -1)
increment = (button, n) ->
# Fix the counter
counter = $(button).closest('.form_row').find('.row_counter')
newCount = parseInt(counter.val()) + n
counter.val(Math.max(newCount, 0))
calculatePrice()
counter.val(parseInt(counter.val()) + n)
calculatePrice = ->
price = 0
$('#form_products').children().each(->
price += parseInt($(this).find('.price').html()) * parseInt($(this).find('.row_counter').val())
)
$('#order_total_price').val(price)
# Enable or disable the dec button
counter.parent().find('.btn-dec').prop("disabled", counter.val() == '0');
# Update the price
oldVal = parseFloat($('#order_total_price').val())
$('#order_total_price').val(parseFloat(oldVal + counter.parent().find('.price').val() * n).toFixed(2))
$(document).ready(ready)
$(document).on('page:load', ready)

View file

@ -28,11 +28,6 @@ $gray-medium-light: #eaeaea;
box-sizing: border-box;
}
.thumbnail {
height: 150px;
}
/* miscellaneous */
.nowrap {
white-space: nowrap;

View file

@ -1,16 +1,3 @@
// Place all the styles related to the Orders controller here.
// They will automatically be included in application.css.
// You can use Sass (SCSS) here: http://sass-lang.com/
.form_products {
border-width: 1px;
border-color: #000;
border-style: solid;
margin-bottom: 2px;
}
.form_total {
border-width: 1px;
border-color: #000;
border-style: solid;
}

View file

@ -1,10 +1,19 @@
<div class="form_row">
<%= image_tag f.object.product.avatar %>
<%= content_tag(:span, euro(f.object.product.price), class: "price") %>
<div class="input-group">
<%= render 'btn_dec', id: f.object.product_id %>
<%= f.text_field :count, class: 'form-control row_counter', value: 0 %>
<%= render 'btn_inc', id: f.object.product_id %>
<%= f.hidden_field :product_id %>
<div class="col-md-3 form_products">
<div class="thumbnail ">
<div class="form_row center">
<%= image_tag f.object.product.avatar %>
<div class="caption">
<h3><%= f.object.product.name %> - <%= content_tag :span, euro(f.object.product.price), class: "price" %></h3>
<p>
<div class="input-group">
<%= render 'btn_dec', id: f.object.product_id %>
<%= f.text_field :count, class: 'form-control row_counter', value: 0 %>
<%= f.hidden_field :price, value: f.object.product.price, class: :price %>
<%= render 'btn_inc', id: f.object.product_id %>
<%= f.hidden_field :product_id %>
</div>
</p>
</div>
</div>
</div>
</div>

View file

@ -1,2 +1,2 @@
<%= f.label :total_price %>
<%= f.number_field :total_price %>
<%= f.number_field :total_price, step: :any %>

View file

@ -1,16 +1,21 @@
<h3><%= @user.name %></h3>
<h3>Order for <%= @user.nickname %></h3>
<%= form_for( @order, url: user_orders_path(@user)) do |f| %>
<%= form_for @order, url: user_orders_path(@user) do |f| %>
<%= render 'application/errors', model: @order %>
<div class="col-md-2 thumbnail form_products">
<%= f.fields_for :order_products do |op_field| %>
<%= render 'order_products/form_row', f: op_field %>
<% end %>
<div class="row">
<div class="col-md-12">
<%= f.fields_for :order_products do |op_field| %>
<%= render 'order_products/form_row', f: op_field %>
<% end %>
</div>
</div>
<div class="col-md-12 form_total">
<%= render 'order_products/total_price', f: f %>
<%= f.submit "Order", class: "btn btn-primary " %>
<div class="row">
<div class="col-md-12 form_total">
<%= render 'order_products/total_price', f: f %>
<%= f.submit "Order", class: "btn btn-primary " %>
</div>
</div>
<% end %>