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

View file

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

View file

@ -1,16 +1,3 @@
// Place all the styles related to the Orders controller here. // Place all the styles related to the Orders controller here.
// They will automatically be included in application.css. // They will automatically be included in application.css.
// You can use Sass (SCSS) here: http://sass-lang.com/ // 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"> <div class="col-md-3 form_products">
<%= image_tag f.object.product.avatar %> <div class="thumbnail ">
<%= content_tag(:span, euro(f.object.product.price), class: "price") %> <div class="form_row center">
<div class="input-group"> <%= image_tag f.object.product.avatar %>
<%= render 'btn_dec', id: f.object.product_id %> <div class="caption">
<%= f.text_field :count, class: 'form-control row_counter', value: 0 %> <h3><%= f.object.product.name %> - <%= content_tag :span, euro(f.object.product.price), class: "price" %></h3>
<%= render 'btn_inc', id: f.object.product_id %> <p>
<%= f.hidden_field :product_id %> <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>
</div> </div>

View file

@ -1,2 +1,2 @@
<%= f.label :total_price %> <%= 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 %> <%= render 'application/errors', model: @order %>
<div class="col-md-2 thumbnail form_products"> <div class="row">
<%= f.fields_for :order_products do |op_field| %> <div class="col-md-12">
<%= render 'order_products/form_row', f: op_field %> <%= f.fields_for :order_products do |op_field| %>
<% end %> <%= render 'order_products/form_row', f: op_field %>
<% end %>
</div>
</div> </div>
<div class="col-md-12 form_total">
<%= render 'order_products/total_price', f: f %> <div class="row">
<%= f.submit "Order", class: "btn btn-primary " %> <div class="col-md-12 form_total">
<%= render 'order_products/total_price', f: f %>
<%= f.submit "Order", class: "btn btn-primary " %>
</div>
</div> </div>
<% end %> <% end %>