- content_for :javascript do
  :javascript

    function update_delta(input) {
      var units = $(input).val();
      var expected = $(input).data('units-expected');
      var html;

      if (units.replace(/\s/g,"")=="") {
        // no value
        html = '';
      } else if (isNaN(units)) {
        html = '<i class="icon-remove" style="color: red"></i>';
      } else if (units == expected) {
        // equal value
        html = '<i class="icon-ok" style="color: green"></i>';
      } else if (units < expected) {
        html = '<span style="color: red">- '+(expected-units)+'</span>';
      } else /*if (units> expected)*/ {
        html = '<span style="color: green">+ '+(units-expected)+'</span>';
      }

      $(input).closest('tr').find('.units_delta').html(html);
    }

    $(document).on('change', 'input[data-units-expected]', function() {
      update_delta(this);
    });

    $(function() {
      $('input[data-units-expected]').each(function() {
        update_delta(this);
      });
    });

%table#order_articles.ordered-articles.table.table-striped.stupidtable
  %thead
    %tr
      %th.sort{:data => {:sort => 'string'}}= heading_helper Article, :order_number, short: true
      %th.default-sort.sort{:data => {:sort => 'string'}}= heading_helper Article, :name
      %th= heading_helper Article, :unit
      %th Members
      %th Ordered
      %th= heading_helper Article, :price
      -#%th Invoice # TODO implement invoice screen
      %th Received
      %th= heading_helper ArticlePrice, :price
      %th
      %th= t 'ui.actions'
  %tfoot
    %tr
      %th{:colspan => 10}
        = link_to t('.add_article'), new_order_order_article_path(@order), remote: true, class: 'btn btn-small'
  %tbody#result_table
    - @order_articles.each do |order_article|
      = render :partial => 'edit_amount', :locals => {:order_article => order_article}