Adding working scrolling to anchors

app/assets/javascripts/darkswarm/all.js.coffee

@@ -8,6 +8,7 @@
 #= require angular-sanitize
 #= require angular-resource
 #= require lodash.underscore.js
+#= require angular-scroll.min.js
 #= require angular-google-maps.min.js
 #= require ../shared/mm-foundation-tpls-0.2.0-SNAPSHOT
 #= require ../shared/bindonce.min.js

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

@@ -7,6 +7,7 @@ window.Darkswarm = angular.module("Darkswarm", ["ngResource",
   'templates',
   'ngSanitize',
   'google-maps',
+  'duScroll',
   'backstretch']).config ($httpProvider, $tooltipProvider, $locationProvider, $anchorScrollProvider) ->
   $httpProvider.defaults.headers.post['X-CSRF-Token'] = $('meta[name="csrf-token"]').attr('content') 
   $httpProvider.defaults.headers.put['X-CSRF-Token'] = $('meta[name="csrf-token"]').attr('content') 

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

@@ -0,0 +1,8 @@
+Darkswarm.directive 'scrollAfterLoad', ($timeout, $location, $document)->
+  restrict: "A"
+  link: (scope, element, attr) ->
+    if scope.$last is true
+      $(window).load ->
+        $timeout ->
+          $document.scrollTo $("##{$location.hash()}"), 100, 200, (x)->
+            x * (2 - x)

app/views/json/_producer.rabl

@@ -1,5 +1,16 @@
 attributes :id, :name, :description, :long_description, :website, :instagram, :facebook, :linkedin, :twitter
 
 node :promo_image do |producer| 
-  producer.promo_image.url 
+  producer.promo_image(:large) 
+end
+node :logo do |producer| 
+  producer.logo(:medium) 
+end
+
+node :path do |producer|
+  producer_path(producer) 
+end
+
+node :hash do |producer|
+  producer.to_param
 end

app/views/modals/_producer.html.haml

@@ -9,41 +9,35 @@
   .row  
     .small-12.large-6.columns
       %p{"ng-bind-html" => "producer.long_description"}
-    .small-12.large-6.columns
+    .small-8.large-4.columns
+      %a{"ng-href" => '/producers##{{producer.hash}}'}
+        Find my products
       %img.producer-logo{"ng-src" => "{{producer.logo}}", "ng-if" => "producer.logo"} 
-      %h5 Stay in touch with {{ producer.name }}
-      
+    .small-4.large-2.columns
       %ul.small-block-grid-1{bindonce: true}
-        
         %li{"ng-if" => "producer.website"}
           %a{"ng-href" => "http://{{producer.website | stripUrl}}", target: "_blank" }
             %i.ofn-i_049-web
-            {{ producer.website | stripUrl }}
         
         %li{"ng-if" => "producer.email"}
           %a{"ng-href" => "mailto:{{producer.email | stripUrl}}", target: "_blank" }
             %i.ofn-i_050-mail-circle
-            {{ producer.email | stripUrl }}
         
         %li{"ng-if" => "producer.twitter"} 
           %a{"ng-href" => "http://twitter.com/{{producer.twitter}}", target: "_blank"}
             %i.ofn-i_041-twitter
-            {{ producer.twitter }}
         
         %li{"ng-if" => "producer.facebook"}
           %a{"ng-href" => "http://{{producer.facebook | stripUrl}}", target: "_blank"}
             %i.ofn-i_044-facebook
-            {{ producer.facebook | stripUrl }}
         
         %li{"ng-if" => "producer.linkedin"}
           %a{"ng-href" => "http://{{producer.linkedin | stripUrl}}", target: "_blank"}
             %i.ofn-i_042-linkedin
-            {{ producer.linkedin | stripUrl }}
         
         %li{"ng-if" => "producer.instagram"}
           %a{"ng-href" => "http://instagram.com/{{producer.instagram}}", target: "_blank"}  
             %i.ofn-i_043-instagram
-            {{ producer.instagram }}
   
   %a.close-reveal-modal{"ng-click" => "$close()"}
     %i.ofn-i_009-close

app/views/producers/index.haml

@@ -26,6 +26,7 @@
     .small-12.columns
       .active_table
         %producer.active_table_node.row{id: "{{producer.path}}",
+        "scroll-after-load" => true,
         "ng-repeat" => "producer in filteredProducers = (Producers.producers | filterProducers:query)",
         "ng-controller" => "ProducerNodeCtrl",
         "ng-class" => "{'closed' : !open(), 'open' : open(), 'inactive' : !producer.active}",

app/views/shop/products/_summary.html.haml

@@ -3,7 +3,7 @@
     %img{"bo-src" => "product.master.images[0].small_url"}
 
   .small-4.columns.summary-header
-    %object.taxon{"data" => "{{taxon.icon}}", type: "image/svg+xml",
+    %object.taxon{"data" => "{{primary_taxon.icon}}", type: "image/svg+xml",
     "ng-click" => "ordering.order = 'primary_taxon.name'"}
       {{taxon.name}}
     = render partial: "modals/product"