diff --git a/app/controllers/artists_controller.rb b/app/controllers/artists_controller.rb index 0581c34..a7163a0 100644 --- a/app/controllers/artists_controller.rb +++ b/app/controllers/artists_controller.rb @@ -5,9 +5,12 @@ class ArtistsController < ApplicationController @artist = LastFM::Artist.getInfo CGI.unescape(params[:id]) @tracks = LastFM::Artist.getTopTracks @artist.name, 10 @albums = LastFM::Artist.getTopAlbums @artist.name, 8 + @images = LastFM::Artist.getImages @artist.name, 18 end def index + @albums = LastFM::Artist.getTopAlbums "Avril Lavigne", 20 + puts @albums end end diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb index 02da1cd..a9d72a3 100644 --- a/app/helpers/application_helper.rb +++ b/app/helpers/application_helper.rb @@ -2,12 +2,12 @@ module ApplicationHelper def validate_img_url image, type, size + @attr = (type=="gallery") ? "name" : "size" image.each do |img| - if img["size"] == size.to_s + if img[@attr] == size.to_s if img["#text"].empty? return "/images/placeholder/#{type.to_s}.png" end - return img["#text"] end end diff --git a/app/views/artists/index.html.haml b/app/views/artists/index.html.haml index 5dd8fd0..3938f3e 100644 --- a/app/views/artists/index.html.haml +++ b/app/views/artists/index.html.haml @@ -1 +1 @@ -#empty \ No newline at end of file +- @albums.album.each do |album| =image_tag validate_img_url(album.image, "album", :medium) \ No newline at end of file diff --git a/app/views/artists/show.html.haml b/app/views/artists/show.html.haml index b191b38..23464da 100644 --- a/app/views/artists/show.html.haml +++ b/app/views/artists/show.html.haml @@ -10,6 +10,9 @@ %br %br =raw @artist.bio.summary + %br + =link_to "CLICK", "javascript:ajj();" + #myajax .main %h2.headline.blue= @artist.name %ul.navigation.hash{:steering=>"artist"} @@ -48,4 +51,15 @@ = link_to "NACHLADEN", :class => "more" do = image_tag "ico/more.png" %div Related - %div Pics \ No newline at end of file + .gallery + - @images.image.each_with_index do |img, i| + - @bigPicture = validate_img_url(img.sizes["size"], "gallery", :extralarge) + = link_to "javascript:void(0);", :picture=>@bigPicture, :onClick=>"javascript:overlay('#overlayGallery');" do + =image_tag validate_img_url(img.sizes["size"], "gallery", :medium) + + +#overlayGallery.overlay + %span.close< + = image_tag "ico/close.png" + .content + = image_tag "placeholder/gallery.png" \ No newline at end of file diff --git a/app/views/search/index.html.haml b/app/views/search/index.html.haml index 0314c77..af07138 100644 --- a/app/views/search/index.html.haml +++ b/app/views/search/index.html.haml @@ -26,24 +26,20 @@ %li = image_tag "ico/play.png", :class=>"play" = image_tag "ico/add.png", :class=>"add" - %span - = track.name - =raw " " - = "by #{trimString(track.artist, 50)}" + %span= track.name + =raw " by " + = link_to trimString(track.artist, 50), :controller=>"artists",:action=>"show",:id=>CGI.escape(track.artist) #search_all_albums %h2.headline.small Albums %ul.albums - @albums.album.each_with_index do |album, i| - break if i == 6 %li - .img - = image_tag validate_img_url(album.image, "album", :medium) - %p - %span - = trimString(album.name, 38) - %br - = trimString(album.artist, 22) - %sub + .img= image_tag validate_img_url(album.image, "album", :medium) + %p< + %span= trimString(album.name, 38) + %br> + = link_to trimString(album.artist, 22), :controller=>"artists",:action=>"show",:id=>CGI.escape(album.artist) #search_artists %ul.artists - @artists.artist.each_with_index do |artist, i| diff --git a/lib/LastFM/Album.rb b/lib/LastFM/Album.rb index ee5ba15..e52c8c9 100644 --- a/lib/LastFM/Album.rb +++ b/lib/LastFM/Album.rb @@ -7,7 +7,7 @@ module LastFM # return: album name, artist, (top)tags, tracks ( name, duration (in sec) ) mbid (album), release date, image urls ( different sizes ) def self.getInfo album, artist - album_request "getInfo", nil, album, artist + album_request "getInfo", "album", album, artist end # return: tags ( name, tag´s last.fm-url ) ordered by popularity diff --git a/lib/LastFM/Artist.rb b/lib/LastFM/Artist.rb index 2a86f7e..a19996d 100644 --- a/lib/LastFM/Artist.rb +++ b/lib/LastFM/Artist.rb @@ -29,6 +29,10 @@ module LastFM def self.getTopAlbums artist, limit = nil, page = nil artist_request "getTopAlbums", "topalbums", artist, limit, page end + + def self.getImages artist, limit = nil + artist_request "getImages", "images", artist, limit + end end diff --git a/public/images/placeholder/gallery.png b/public/images/placeholder/gallery.png new file mode 100644 index 0000000..c243134 Binary files /dev/null and b/public/images/placeholder/gallery.png differ diff --git a/public/javascripts/application.js b/public/javascripts/application.js index 0822a9e..646fb91 100644 --- a/public/javascripts/application.js +++ b/public/javascripts/application.js @@ -7,17 +7,37 @@ $(document).ready(function(){ handleNavigation(); // handle animations and content switch orderNavigation(); // order if predefined category + fitArtistImages(); // resize and resposition images (artists, album) onImageError(); // replace broken image links with placeholders + + initPictureOverlay(); }); $(window).load(function() { initSearchDropdown(); // dropdown for the search input - fitArtistImages(); // resize and resposition images (artists, album) }); +function initPictureOverlay(){ + $('#artist .gallery a').live("click", function(){ + $src = $(this).attr("picture"); + $('#overlayGallery .content img').hide().attr('src', $src).show(); + }); + $('#overlayGallery .close').click(function(){ + setTimeout( + "$('#overlayGallery .content img').attr('src', '/images/placeholder/gallery.png');" + , 450); + }); +} +function ajj(){ +/* + $('#myajax').load('/artists', function() { + $(this).prepend("FERTIG"); + });*/ +} + @@ -67,7 +87,7 @@ function initSearchDropdown() $(this).children(".box").fadeOut(300); }); $("div[dropping] .box").live("click", function(){ - $(this).children(".box").fadeOut(300); + $(this).fadeOut(300); }); $("div[dropping] .box li").live("click", function(){ @@ -81,6 +101,7 @@ function fixLists() { $(".artists li:nth-child(6n)").css("marginRight", 0); $(".songs.tab li:nth-child(2n)").css("marginRight", 0); + $("#artist .gallery a:nth-child(6n)").css("marginRight", 0); } // set positions for navigation elements @@ -208,24 +229,10 @@ function handleNavigation() function overlay(id) { $.blockUI({ - css: { - cursor: 'default' - }, - overlayCSS: { - opacity: 0, - cursor: 'default' - }, - themedCSS: { - width: '388px', - top: '17%', - left: '50%' - }, - theme: true, - message: $(id), - timeout: 0, - fadeIn: 400, - fadeOut: 300, - focusInput: false + message: $(id), + timeout: 0, + fadeIn: 200, + fadeOut: 300 }); $(id+" .close").click(function() { $.unblockUI(); diff --git a/public/javascripts/jqueryPlugins.js b/public/javascripts/jqueryPlugins.js index 7db420f..88b134e 100644 --- a/public/javascripts/jqueryPlugins.js +++ b/public/javascripts/jqueryPlugins.js @@ -4,11 +4,11 @@ /*! * jQuery blockUI plugin - * Version 2.33 (29-MAR-2010) + * Version 2.38 (29-MAR-2011) * @requires jQuery v1.2.3 or later * * Examples at: http://malsup.com/jquery/block/ - * Copyright (c) 2007-2008 M. Alsup + * Copyright (c) 2007-2010 M. Alsup * Dual licensed under the MIT and GPL licenses: * http://www.opensource.org/licenses/mit-license.php * http://www.gnu.org/licenses/gpl.html @@ -69,7 +69,7 @@ $.fn.unblock = function(opts) { }); }; -$.blockUI.version = 2.33; // 2nd generation blocking at no extra cost! +$.blockUI.version = 2.38; // 2nd generation blocking at no extra cost! // override these in your code to change the default behavior and style $.blockUI.defaults = { @@ -79,7 +79,7 @@ $.blockUI.defaults = { title: null, // title string; only used when theme == true draggable: true, // only used when theme == true (requires jquery-ui.js to be loaded) - theme: false, // set to true to use with jQuery UI themes + theme: true, // set to true to use with jQuery UI themes // styles for the message when blocking; if you wish to disable // these and use an external stylesheet then do this in your code: @@ -87,35 +87,35 @@ $.blockUI.defaults = { css: { padding: 0, margin: 0, - width: '30%', - top: '40%', - left: '35%', + width: '388px', + top: '17%', + left: '50%', textAlign: 'center', color: '#000', border: '3px solid #aaa', backgroundColor:'#fff', - cursor: 'wait' + cursor: 'default' }, // minimal style set used when themes are used themedCSS: { - width: '30%', - top: '40%', - left: '35%' + width: '388px', + top: '17%', + left: '50%', }, // styles for the overlay overlayCSS: { backgroundColor: '#000', opacity: 0.6, - cursor: 'wait' + cursor: 'default' }, // styles applied when using $.growlUI growlCSS: { - width: '350px', - top: '10px', - left: '', + width: '388px', + top: '17%', + left: '50%', right: '10px', border: 'none', padding: '5px', @@ -157,7 +157,7 @@ $.blockUI.defaults = { fadeIn: 200, // fadeOut time in millis; set to 0 to disable fadeOut on unblock - fadeOut: 300, + fadeOut: 400, // time in millis to wait before auto-unblocking; set to 0 to disable auto-unblock timeout: 0, @@ -182,7 +182,10 @@ $.blockUI.defaults = { onUnblock: null, // don't ask; if you really must know: http://groups.google.com/group/jquery-en/browse_thread/thread/36640a8730503595/2f6a79a77a78e493#2f6a79a77a78e493 - quirksmodeOffsetHack: 4 + quirksmodeOffsetHack: 4, + + // class name of the message block + blockMsgClass: 'blockMsg' }; // private data and functions follow... @@ -228,26 +231,29 @@ function install(el, opts) { var lyr1 = ($.browser.msie || opts.forceIframe) ? $('') : $(''); - var lyr2 = $(''); + var lyr2 = opts.theme + ? $('') + : $(''); + var lyr3, s; if (opts.theme && full) { - s = '