From f750251cb81dea8d36af94378b5e2d2b33c66c31 Mon Sep 17 00:00:00 2001
From: Rob H <oeoeaio@gmail.com>
Date: Fri, 21 Jun 2013 09:37:05 +0530
Subject: [PATCH] BPUR: Visually differentiate products and variants in table

---
 .../javascripts/admin/bulk_product_update.js      |  2 ++
 app/assets/stylesheets/admin/products.css.scss    | 15 +++++++++++++++
 .../spree/admin/products/bulk_edit.html.haml      |  6 +++---
 3 files changed, 20 insertions(+), 3 deletions(-)

diff --git a/app/assets/javascripts/admin/bulk_product_update.js b/app/assets/javascripts/admin/bulk_product_update.js
index ca15efb621..7b8543193f 100644
--- a/app/assets/javascripts/admin/bulk_product_update.js
+++ b/app/assets/javascripts/admin/bulk_product_update.js
@@ -68,6 +68,8 @@ productsApp.directive('ngTrackVariant', function(){
 productsApp.directive('ngToggleVariants',function(){
 	return {
 		link: function(scope,element,attrs){
+			if (scope.displayProperties[scope.product.id].showVariants) { element.removeClass('icon-chevron-right'); element.addClass('icon-chevron-down'); }
+			else { element.removeClass('icon-chevron-down'); element.addClass('icon-chevron-right'); }
 			element.bind('click', function(){
 				scope.$apply(function(){
 					if (scope.displayProperties[scope.product.id].showVariants){
diff --git a/app/assets/stylesheets/admin/products.css.scss b/app/assets/stylesheets/admin/products.css.scss
index ec719286df..7c739159c8 100644
--- a/app/assets/stylesheets/admin/products.css.scss
+++ b/app/assets/stylesheets/admin/products.css.scss
@@ -5,3 +5,18 @@
 th.firstcol, td.firstcol {
   border-left: 1px solid #cee1f4;
 }
+
+tbody.odd {
+	tr.product { td { background-color: white; } }
+	tr.variant.odd { td { background-color: lighten(#eff5fc, 3); } }
+	tr.variant.even { td { background-color: white; } }
+}
+tbody.even {
+	tr.product { td { background-color: darken(#eff5fc, 1); } }
+	tr.variant.odd { td { background-color: lighten(#eff5fc, 2); } }
+	tr.variant.even { td { background-color: darken(#eff5fc, 1); } }
+}
+
+tbody tr.product td.actions { background-color: transparent; }
+tbody tr.variant td.actions { background-color: transparent; }
+tbody tr.variant td { padding: 5px 10px; }
diff --git a/app/views/spree/admin/products/bulk_edit.html.haml b/app/views/spree/admin/products/bulk_edit.html.haml
index cc74512ac9..fce6d9aecd 100644
--- a/app/views/spree/admin/products/bulk_edit.html.haml
+++ b/app/views/spree/admin/products/bulk_edit.html.haml
@@ -27,8 +27,8 @@
         %th On Hand
         %th Av. On
         %th.actions
-    %tbody{ 'ng-repeat' => 'product in products | filter:query' }
-      %tr
+    %tbody{ 'ng-repeat' => 'product in products | filter:query', 'ng-class-even' => "'even'", 'ng-class-odd' => "'odd'" }
+      %tr.product
         %td.actions
           %a{ 'ng-toggle-variants' => 'true', :class => "view-variants icon-chevron-right", 'ng-show' => 'hasVariants(product)' }
         %td.firstcol
@@ -46,7 +46,7 @@
           %a{ 'ng-click' => 'editWarn(product)', :class => "edit-product icon-edit no-text" }
           %a{ 'ng-click' => 'cloneProduct(product)', :class => "clone-product icon-copy no-text" }
           %a{ 'ng-click' => 'deleteProduct(product)', :class => "delete-product icon-trash no-text" }
-      %tr{ 'ng-repeat' => 'variant in product.variants', 'ng-show' => 'displayProperties[product.id].showVariants' }
+      %tr.variant{ 'ng-repeat' => 'variant in product.variants', 'ng-show' => 'displayProperties[product.id].showVariants', 'ng-class-even' => "'even'", 'ng-class-odd' => "'odd'" }
         %td.actions
           %a{ :class => "variant-item icon-caret-right" }
         %td.firstcol