Ruby on Rails | Screencasts | Download | Documentation | Weblog | Community | Source

Changeset 8110

Show
Ignore:
Timestamp:
11/07/07 15:37:06 (3 years ago)
Author:
david
Message:

Added :mouseover short-cut to AssetTagHelper#image_tag for doing easy image swaps (closes #6893) [joost]

Files:

Legend:

Unmodified
Added
Removed
Modified
Copied
Moved

  • trunk/actionpack/CHANGELOG

    r8108 r8110  
    11*SVN* 
     2 
     3* Added :mouseover short-cut to AssetTagHelper#image_tag for doing easy image swaps #6893 [joost] 
    24 
    35* Fixed handling of non-domain hosts #9479 [purp] 

  • trunk/actionpack/lib/action_view/helpers/asset_tag_helper.rb

    r8052 r8110  
    336336      # ==== Options 
    337337      # You can add HTML attributes using the +options+. The +options+ supports 
    338       # two additional keys for convienence and conformance: 
     338      # three additional keys for convienence and conformance: 
    339339      # 
    340340      # * <tt>:alt</tt>  - If no alt text is given, the file name part of the 
    …… 
    343343      #   width="30" and height="45". <tt>:size</tt> will be ignored if the 
    344344      #   value is not in the correct format. 
     345      # * <tt>:mouseover</tt> - Set an alternate image to be used when the onmouseover 
     346      #   event is fired, and sets the original image to be replaced onmouseout. 
     347      #   This can be used to implement an easy image toggle that fires on onmouseover. 
    345348      # 
    346349      # ==== Examples 
    …… 
    357360      #  image_tag("/icons/icon.gif", :class => "menu_icon") # => 
    358361      #    <img alt="Icon" class="menu_icon" src="/icons/icon.gif" /> 
     362      #  image_tag("mouse.png", :mouseover => "/images/mouse_over.png") # =>  
     363      #    <img src="/images/mouse.png" onmouseover="this.src='/images/mouse_over.png'" onmouseout="this.src='/images/mouse.png'" alt="Mouse" /> 
     364      #  image_tag("mouse.png", :mouseover => image_path("mouse_over.png")) # =>  
     365      #    <img src="/images/mouse.png" onmouseover="this.src='/images/mouse_over.png'" onmouseout="this.src='/images/mouse.png'" alt="Mouse" /> 
    359366      def image_tag(source, options = {}) 
    360367        options.symbolize_keys! 
    …… 
    363370        options[:alt] ||= File.basename(options[:src], '.*').split('.').first.capitalize 
    364371 
    365         if options[:size] 
    366           options[:width], options[:height] = options[:size].split("x") if options[:size] =~ %r{^\d+x\d+$} 
    367           options.delete(:size) 
     372        if size = options.delete(:size) 
     373          options[:width], options[:height] = size.split("x") if size =~ %r{^\d+x\d+$} 
     374        end 
     375 
     376        if mouseover = options.delete(:mouseover) 
     377          options[:onmouseover] = "this.src='#{image_path(mouseover)}'" 
     378          options[:onmouseout]  = "this.src='#{image_path(options[:src])}'" 
    368379        end 
    369380 

  • trunk/actionpack/test/template/asset_tag_helper_test.rb

    r7976 r8110  
    136136    %(image_tag("error.png", "size" => "45 x 70")) => %(<img alt="Error" src="/images/error.png" />), 
    137137    %(image_tag("error.png", "size" => "x")) => %(<img alt="Error" src="/images/error.png" />), 
    138     %(image_tag("http://www.rubyonrails.com/images/rails.png")) => %(<img alt="Rails" src="http://www.rubyonrails.com/images/rails.png" />) 
     138    %(image_tag("http://www.rubyonrails.com/images/rails.png")) => %(<img alt="Rails" src="http://www.rubyonrails.com/images/rails.png" />), 
     139    %(image_tag("http://www.rubyonrails.com/images/rails.png")) => %(<img alt="Rails" src="http://www.rubyonrails.com/images/rails.png" />), 
     140    %(image_tag("mouse.png", :mouseover => "/images/mouse_over.png")) => %(<img alt="Mouse" onmouseover="this.src='/images/mouse_over.png'" onmouseout="this.src='/images/mouse.png'" src="/images/mouse.png" />), 
     141    %(image_tag("mouse.png", :mouseover => image_path("mouse_over.png"))) => %(<img alt="Mouse" onmouseover="this.src='/images/mouse_over.png'" onmouseout="this.src='/images/mouse.png'" src="/images/mouse.png" />) 
    139142  } 
    140143