From 042db2d150342ab58eef3533a1d0d5b83a022e78 Mon Sep 17 00:00:00 2001 From: Will Marshall Date: Thu, 31 Jul 2014 15:05:25 +1000 Subject: [PATCH] Some comments and refactoring --- .../darkswarm/directives/active_selector.js.coffee | 5 ++++- .../directives/active_table_hub_link.js.coffee | 5 +++-- .../darkswarm/directives/cart_popover.js.coffee | 1 + .../darkswarm/directives/price_breakdown.js.coffee | 8 +++++++- .../javascripts/templates/price_breakdown.html.haml | 1 - .../templates/price_breakdown_button.html.haml | 2 ++ .../javascripts/templates/shop_variant.html.haml | 10 ++++------ 7 files changed, 21 insertions(+), 11 deletions(-) create mode 100644 app/assets/javascripts/templates/price_breakdown_button.html.haml diff --git a/app/assets/javascripts/darkswarm/directives/active_selector.js.coffee b/app/assets/javascripts/darkswarm/directives/active_selector.js.coffee index 74523c2c3d..563b5a1716 100644 --- a/app/assets/javascripts/darkswarm/directives/active_selector.js.coffee +++ b/app/assets/javascripts/darkswarm/directives/active_selector.js.coffee @@ -1,4 +1,6 @@ Darkswarm.directive "activeSelector", -> + # A generic selector that allows an object/scope to be toggled between active and inactive + # Used in the filters, but hypothetically useable anywhere restrict: 'E' transclude: true replace: true @@ -8,5 +10,6 @@ Darkswarm.directive "activeSelector", -> elem.bind "click", -> scope.$apply -> scope.selector.active = !scope.selector.active - scope.emit() + # This function is a convention, e.g. a callback on the scope applied when active changes + scope.emit() if scope.emit diff --git a/app/assets/javascripts/darkswarm/directives/active_table_hub_link.js.coffee b/app/assets/javascripts/darkswarm/directives/active_table_hub_link.js.coffee index 4369fced34..994a7ced48 100644 --- a/app/assets/javascripts/darkswarm/directives/active_table_hub_link.js.coffee +++ b/app/assets/javascripts/darkswarm/directives/active_table_hub_link.js.coffee @@ -1,11 +1,12 @@ Darkswarm.directive "activeTableHubLink", (CurrentHub, CurrentOrder) -> + # Change the text of the hub link based on CurrentHub + # To be used with ofnEmptiesCart + # Takes "change" and "shop" as text string attributes restrict: "A" scope: hub: '=activeTableHubLink' template: "{{action}}" link: (scope, elm, attr)-> - # Swap out the text of the hub link depending on whether it'll change current hub - # To be used with ofnEmptiesCart if CurrentHub.hub?.id and CurrentHub.hub.id isnt scope.hub.id scope.action = attr.change else diff --git a/app/assets/javascripts/darkswarm/directives/cart_popover.js.coffee b/app/assets/javascripts/darkswarm/directives/cart_popover.js.coffee index bcc0c8bc08..1ef1b3f9c3 100644 --- a/app/assets/javascripts/darkswarm/directives/cart_popover.js.coffee +++ b/app/assets/javascripts/darkswarm/directives/cart_popover.js.coffee @@ -1,4 +1,5 @@ Darkswarm.directive "cart", -> + # Toggles visibility of the "cart" popover restrict: 'A' link: (scope, elem, attr)-> scope.open = false diff --git a/app/assets/javascripts/darkswarm/directives/price_breakdown.js.coffee b/app/assets/javascripts/darkswarm/directives/price_breakdown.js.coffee index 0d1d6ce0b5..8b0beb17a5 100644 --- a/app/assets/javascripts/darkswarm/directives/price_breakdown.js.coffee +++ b/app/assets/javascripts/darkswarm/directives/price_breakdown.js.coffee @@ -1,9 +1,15 @@ Darkswarm.directive "priceBreakdown", ($tooltip)-> - tooltip = $tooltip 'priceBreakdown', 'priceBreakdown', 'click' + # We use the $tooltip service from Angular foundation to give us boilerplate + # Subsequently we patch the scope, template and restrictions + tooltip = $tooltip 'priceBreakdown', 'priceBreakdown', 'click' tooltip.scope = variant: "=" + tooltip.templateUrl = "price_breakdown_button.html" + tooltip.replace = true + tooltip.restrict = 'E' tooltip +# This is automatically referenced via naming convention in $tooltip Darkswarm.directive 'priceBreakdownPopup', -> restrict: 'EA' replace: true diff --git a/app/assets/javascripts/templates/price_breakdown.html.haml b/app/assets/javascripts/templates/price_breakdown.html.haml index f9919b92ff..9317356d02 100644 --- a/app/assets/javascripts/templates/price_breakdown.html.haml +++ b/app/assets/javascripts/templates/price_breakdown.html.haml @@ -1,7 +1,6 @@ .joyride-tip-guide{bindonce: true, "ng-class" => "{ in: tt_isOpen, fade: tt_animation }"} %span.joyride-nub.right .joyride-content-wrapper - .collapsed{"ng-show" => "!expanded"} %price-percentage{percentage: 'variant.basePricePercentage'} %a{"ng-click" => "expanded = !expanded"} diff --git a/app/assets/javascripts/templates/price_breakdown_button.html.haml b/app/assets/javascripts/templates/price_breakdown_button.html.haml new file mode 100644 index 0000000000..8a86ed2618 --- /dev/null +++ b/app/assets/javascripts/templates/price_breakdown_button.html.haml @@ -0,0 +1,2 @@ +%button.graph-button{"ng-class" => "{open: tt_isOpen}"} + %i.ofn-i-058-graph diff --git a/app/assets/javascripts/templates/shop_variant.html.haml b/app/assets/javascripts/templates/shop_variant.html.haml index bf0907088e..a6db8b4e41 100644 --- a/app/assets/javascripts/templates/shop_variant.html.haml +++ b/app/assets/javascripts/templates/shop_variant.html.haml @@ -50,13 +50,11 @@ %i.ofn-i_009-close {{ variant.price | currency }} - %button.graph-button{"price-breakdown" => "_", - "variant" => "variant", - "ng-class" => "{open: tt_isOpen}", - "price-breakdown-animation" => "true", + -# Now in a template in app/assets/javascripts/templates ! + %price-breakdown{"price-breakdown" => "_", variant: "variant", "price-breakdown-append-to-body" => "true", - "price-breakdown-placement" => "left"} - %i.ofn-i-058-graph + "price-breakdown-placement" => "left", + "price-breakdown-animation" => true} .small-12.medium-2.large-2.columns.total-price.text-right .table-cell