Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
convert html img tags to rails image_tag calls
#!/usr/bin/env ruby
require "nokogiri"
# opens every file in the given dir tree and converts any html img tags to rails image_tag calls
#
# example usage:
# ruby convert.rb ~/my_rails_app/app/views
#
# ***be careful and backup before using this***
#
raise "no directory tree given" if ARGV.first.nil?
path = "#{ARGV.first}/**/*"
@count = {
:files_open => 0,
:files_revised => 0,
:tags => 0
}
class RailsImageTag
Params = [
{ :name => :alt },
{ :name => :height, :type => :int },
{ :name => :width, :type => :int }
]
def initialize(img)
@img = img
end
# construct and return the erb containing the new image_tag call
def to_erb
url = @img['src']
#url.gsub!("/images/", "")
#url.gsub!("images/", "")
"<%= image_tag('#{url}'#{options_to_erb}) %>"
end
# convert the img tag params to image_tag options
# the params to process are defined in the Params constant hash
def options_to_erb
options_erb = {}
Params.each do |opt|
name = opt[:name]
value = @img[name]
value = opt[:type] != :int ? "'#{value}'" : value
options_erb[name] = ":#{name} => #{value}"
end
options_erb.empty? ? "" : ", " + options_erb.values.join(", ")
end
end
class HtmlDoc
def initialize(filename)
@name = filename
file = File.open(@name)
@doc = Nokogiri::HTML(file)
@content = File.open(@name) { |f| f.read }
end
# overwrite the file with new contents
def write_file(log)
log[:files_revised] += 1
File.open(@name, "w") {|f| f.write(@content) }
end
# convert a single file and record stats to <em>log</em>
def convert_img_tags!(log)
log[:files_open] += 1
file_marked = false
@doc.xpath("//img").each do |img|
file_marked = true
log[:tags] += 1
original = img.to_html.gsub("\">", "\" />").gsub("\" >", "\" />").delete("\\")
@content.gsub!(original, RailsImageTag.new(img).to_erb)
end
write_file(log) if file_marked
end
end
Dir.glob(path).each { |filename| HtmlDoc.new(filename).convert_img_tags!(@count) if File.file?(filename) }
p "***********************************"
p "#{@count[:files_open]} files opened"
p "#{@count[:files_revised]} files revised"
p "#{@count[:tags]} tags replaced"
@richardsondx

This comment has been minimized.

Copy link

@richardsondx richardsondx commented Oct 8, 2012

This script is not working I just tried it.

@richardsondx

This comment has been minimized.

Copy link

@richardsondx richardsondx commented Oct 9, 2012

I was using the wrong path sorry

@cmarguel

This comment has been minimized.

Copy link

@cmarguel cmarguel commented May 27, 2014

Your script was incredibly useful in porting a bunch of large templates to Rails (I also modified it to replace <a> tags with link_to), but it never seemed to work until I commented out everything after to_html on line 79. Presumably it's because the gsubbed original no longer matched what was actually in the page. I'm not sure what that line is meant to do, but if anyone is having trouble getting this to work, you'll probably need to do what I did.

@KevinVerre

This comment has been minimized.

Copy link

@KevinVerre KevinVerre commented Jun 11, 2015

I think there is a mistake on line 79. It works for me if I remove a space. Here's what I change:

 original = img.to_html.gsub("\">", "\" />").gsub("\" >", "\" />").delete("\\")
 original = img.to_html.gsub("\">", "\"/>").gsub("\" >", "\" />").delete("\\")

The problem is nokogiri 's img tag.to_html function does not necessarily give you the same string as the in your file. It returns "" when your original HTML is ""

So depending on how your tags are written in the HTML, you might need to play around with line 79 so that the substitution is able to find the original string.

@KevinVerre

This comment has been minimized.

Copy link

@KevinVerre KevinVerre commented Jun 11, 2015

Also, the options_to_erb function and params variable makes certain assumptions that cause problems for your img attributes:

  1. that you always have a width attribute
    2 that height and width are just integers rather than strings
  2. that alt, height, width are the only attributes your image has
@pedromschmitt

This comment has been minimized.

Copy link

@pedromschmitt pedromschmitt commented Feb 27, 2019

Great gist. Helped me a lot.

I just changed the line 79, like @KevinVerre said, and because I had class at my html template, I change:
Params = [ { :name => :alt }, { :name => :height, :type => :int }, { :name => :width, :type => :int } ]

for:
Params = [ { :name => :class } ]

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment