Show collapsed price breakdown

app/assets/javascripts/darkswarm/directives/price_percentage.js.coffee

@@ -0,0 +1,10 @@
+Darkswarm.directive "pricePercentage", ->
+  restrict: 'E'
+  replace: true
+  templateUrl: 'price_percentage.html'
+  scope:
+    percentage: '='
+
+  link: (scope, elem, attrs) ->
+    elem.find(".meter").css
+      width: "#{scope.percentage}%"

app/assets/javascripts/darkswarm/services/variants.js.coffee

@@ -7,5 +7,5 @@ Darkswarm.factory 'Variants', ->
     extend: (variant)->
       variant.getPrice = ->
         variant.price * variant.line_item.quantity
-      variant.basePricePercentage = variant.base_price / variant.price * 100
+      variant.basePricePercentage = Math.round(variant.base_price / variant.price * 100)
       variant

app/assets/javascripts/templates/price_breakdown.html.haml

@@ -1,4 +1,4 @@
 .joyride-tip-guide{"ng-class" => "{ in: tt_isOpen, fade: tt_animation }"}
   %span.joyride-nub.bottom
   .joyride-content-wrapper
-    {{ variant.id }}
+    %price-percentage{percentage: 'variant.basePricePercentage'}

app/assets/javascripts/templates/price_percentage.html.haml

@@ -0,0 +1,4 @@
+.progress
+  .meter
+    Cost
+  Fees

app/serializers/api/variant_serializer.rb

@@ -1,6 +1,6 @@
 class Api::VariantSerializer < ActiveModel::Serializer
   attributes :id, :is_master, :count_on_hand, :name_to_display, :unit_to_display, 
-    :on_demand, :price, :fees
+    :on_demand, :price, :fees, :base_price
 
   def price
     object.price_with_fees(options[:current_distributor], options[:current_order_cycle])

spec/javascripts/unit/darkswarm/services/variants_spec.js.coffee

@@ -5,7 +5,7 @@ describe 'Variants service', ->
   beforeEach ->
     variant =
       id: 1
-      base_price: 80
+      base_price: 80.5
       price: 100
     module 'Darkswarm'
     inject ($injector)->
@@ -22,4 +22,4 @@ describe 'Variants service', ->
     expect(Variants.register(variant)).toBe variant
 
   it "initialises base price percentage", ->
-    expect(Variants.register(variant).basePricePercentage).toEqual 80
+    expect(Variants.register(variant).basePricePercentage).toEqual 81