table#products-table.table.table-striped.table-hover
  tbody
-# content_for :sidebar do
table#active-order-table.table.table-striped.hide
  thead
    tr
      th Product
      th #
      th.currency Total
      th
  tbody
  tfoot
    tr
      td colspan=2
        button class="btn btn-primary" onClick="Qrammer.order_active_list('/order_active_list')" Bestellen
        | 
        button class="btn btn btn-warning" onClick="Qrammer.clear_active_list()" Clear
      td.currency
        strong#active-order-total
      td
- content_for :footer do
  javascript:
    jQuery(function(){
      $.get('#{product_list_supplier_path(@supplier, format: :json).html_safe}', function(res){
        window.products = res
        body = $('#products-table tbody')
        for(var category in window.products){
          body.append('<tr><td colspan="3"><h4>'+category+'<h4></td></tr>');
          var category_ref = window.products[category];
          for(var iproduct = 0; iproduct < window.products[category].length; iproduct++){
            var product_index = iproduct;
            row = $('<tr></tr>');
            button = $('<button class="btn btn-mini btn-primary">Add</button>');
            var callback = (function(ref){
              return function(){ Qrammer.add_product(ref[product_index]) }
            })(category_ref)
            button.click(callback);
            row.append('<td>'+window.products[category][iproduct].name+'</td>');
            row.append('<td>'+Qrammer.currency(window.products[category][iproduct].price)+'</td>');
            row.append($('<td></td>').append(button));
            body.append(row);
          }
        }
      })
    })