From 084f3784bacff8b8a82f565aafd50d1057211c35 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Thomas=20Bucho=CC=88ster?=
 <tbuchoester.mmt-b2009@fh-salzburg.ac.at>
Date: Thu, 5 May 2011 02:30:56 +0200
Subject: [PATCH] js: fitArtistImages rails: extended validate_img_url with
 param "type"

---
 app/helpers/application_helper.rb |  5 +++--
 app/views/search/index.html.haml  |  8 ++++----
 config/application.rb             |  2 +-
 public/javascripts/application.js | 33 +++++++++++++++++++++++++++++++
 public/stylesheets/layout.css     |  4 +++-
 5 files changed, 44 insertions(+), 8 deletions(-)

diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb
index 7423133..02da1cd 100644
--- a/app/helpers/application_helper.rb
+++ b/app/helpers/application_helper.rb
@@ -1,12 +1,13 @@
 # encoding: UTF-8
 module ApplicationHelper
   
-  def validate_img_url image, size
+  def validate_img_url image, type, size
     image.each do |img|
       if img["size"] == size.to_s
         if img["#text"].empty?
-           return "/images/placeholder/artist.png"
+          return "/images/placeholder/#{type.to_s}.png"
         end
+
         return img["#text"]
       end
     end
diff --git a/app/views/search/index.html.haml b/app/views/search/index.html.haml
index 066d163..8c506c5 100644
--- a/app/views/search/index.html.haml
+++ b/app/views/search/index.html.haml
@@ -14,7 +14,7 @@
           - break if i >= 6
           %li
             = link_to "LINK" do
-              = image_tag validate_img_url(artist.image, :large)
+              = image_tag validate_img_url(artist.image, :artist, :large), :alt => artist.name
               %p
                 = trimString(artist.name, 22)
       %br.clean
@@ -37,7 +37,7 @@
           - break if i == 6
           %li
             .img
-              = image_tag validate_img_url(album.image, :medium)
+              = image_tag validate_img_url(album.image, :album, :medium)
             %p
               %span
                 = trimString(album.name, 38)
@@ -50,7 +50,7 @@
         - break if i >= 12
         %li
           = link_to "LINK" do
-            = image_tag validate_img_url(artist.image, :large)
+            = image_tag validate_img_url(artist.image, :artist, :large)
             %p
               = trimString(artist.name, 22)
     %br.clean
@@ -62,7 +62,7 @@
         - break if i == 16
         %li
           .img
-            = image_tag validate_img_url(album.image, :medium)
+            = image_tag validate_img_url(album.image, :album, :medium)
           %p
             %span
               = trimString(album.name, 38)
diff --git a/config/application.rb b/config/application.rb
index 657e629..7aaa421 100644
--- a/config/application.rb
+++ b/config/application.rb
@@ -13,7 +13,7 @@ module Nineminutes
     # -- all .rb files in that directory are automatically loaded.
 
     # Custom directories with classes and modules you want to be autoloadable.
-    # config.autoload_paths += %W(#{config.root}/lib)
+    config.autoload_paths += %W(#{config.root}/lib)
     # config.autoload_paths += Dir["#{config.root}/lib/LastFM/"]
     # config.autoload_paths << config.root.join('lib')
     
diff --git a/public/javascripts/application.js b/public/javascripts/application.js
index 39390e6..9747b25 100644
--- a/public/javascripts/application.js
+++ b/public/javascripts/application.js
@@ -8,6 +8,7 @@ $(window).load(function() {
   initSearchDropdown(); // dropdown for the search input
   initNavigation(); // set positions and :active for navigation elements
   handleNavigation(); // handle animations and content switch
+	fitArtistImages(); // resize and resposition images (artists, album)
 });
 
 
@@ -18,7 +19,39 @@ $(window).load(function() {
 
 
 
+function fitArtistImages() {
+	$("ul.artists img").each(function() {
+		$(this).wrap("<div />");
+		divWidth = 147, divHeight = 94;
+		
+		// use this instead of $(this).width(); because .width() of hidden images is zero!
+		width = this.width;
+		height = this.height;
 
+		if( width < divWidth ) {
+			scaleRatio = width / divWidth;
+			width = divWidth;
+			height /= scaleRatio;
+		}
+		
+		if ( height < divHeight ) {
+			scaleRatio = height / divHeight;
+			height = divHeight;
+			width /= scaleRatio;
+		}
+				
+		posX = - (width - divWidth) / 2;
+		posY = - (height - divHeight) / 8;
+				
+		$(this).css({
+			"position" : "absolute",
+			"width" : width,
+			"height" : height,
+			"top" : posY,
+			"left" : posX
+		});
+	});
+}
 
 
 // search dropdown
diff --git a/public/stylesheets/layout.css b/public/stylesheets/layout.css
index ae9ffea..acc28b0 100644
--- a/public/stylesheets/layout.css
+++ b/public/stylesheets/layout.css
@@ -214,7 +214,9 @@ a { text-decoration: none; color: #7d8791; }
   float: left;
   margin: 0 13px 20px 0;
 }
-.artists img { float: left; width: 147px; height: 94px; }
+
+.artists div { position: relative; width: 147px; height: 94px; overflow: hidden; }
+.artists img { float: left; }
 .artists p
 {
   color: White;