Home | Ruby | CSS Corners |     Share This Page

Listing: create_round_corner_css.rb


Click here to download original file.

#!/usr/bin/ruby -w

=begin
/***************************************************************************
 *   Copyright (C) 2008, Paul Lutus                                        *
 *                                                                         *
 *   This program is free software; you can redistribute it and/or modify  *
 *   it under the terms of the GNU General Public License as published by  *
 *   the Free Software Foundation; either version 2 of the License, or     *
 *   (at your option) any later version.                                   *
 *                                                                         *
 *   This program is distributed in the hope that it will be useful,       *
 *   but WITHOUT ANY WARRANTY; without even the implied warranty of        *
 *   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the         *
 *   GNU General Public License for more details.                          *
 *                                                                         *
 *   You should have received a copy of the GNU General Public License     *
 *   along with this program; if not, write to the                         *
 *   Free Software Foundation, Inc.,                                       *
 *   59 Temple Place - Suite 330, Boston, MA  02111-1307, USA.             *
 ***************************************************************************/
=end

# version: 1.4

if !ARGV[0] || ARGV.length < 4
   puts "usage:   bordercolor (hex) bg_color (hex) radius id"
   puts "example: c0c0c0 ffffff 16 parch"
   puts "result: creates stylesheet file and sample HTML"
   exit 0
else
   border,interior,radius,id = ARGV
end

graphic_background = (interior =~ /url\(/i)

css_baseclass = "roundcorner_#{radius}_#{id}"

target_css = "#{css_baseclass}.css"
target_html = "#{css_baseclass}.html"

radius = radius.to_i

array = []

# create an array of margin values

0.upto(radius-1) do |i|
   x = i.to_f/radius
   y = 1.0 - Math.sqrt(1.0-(x*x))
   r = (y * radius).to_i
   array << r if r > 0
end

# content of sample HTML page

roundcorner_html = "<html>\n<head>\n"
roundcorner_html += "<link rel=\"stylesheet\" type=\"text/css\" href=\"#{target_css}\"/>\n"
roundcorner_html += "</head>\n<body bgcolor=\"#e0f0ff\">\n"
roundcorner_html += "<div style=\"width:60%;margin-left:15%;height:60%; margin-top:15%;\">\n"
roundcorner_html += "<span class=\"#{css_baseclass}\">\n"

# content of CSS file

roundcorner_css = ".#{css_baseclass} {\ndisplay: block;\n}\n\n"

roundcorner_css += ".#{css_baseclass} * {\ndisplay:block;\noverflow:hidden;\nheight:1px;"

if(graphic_background)
   roundcorner_css += "\nbackground: ##{interior};"
else
   roundcorner_css += "\nbackground-color: ##{interior};"
end
roundcorner_css += "\n}\n\n"

n = 0

array.reverse.each do |item|
   roundcorner_css += ".#{css_baseclass}#{n} {\nmargin-right: #{item}px;\nmargin-left: #{item}px;"
   if(graphic_background)
      roundcorner_css += "\nbackground-position: -#{item}px -#{n}px;"
   else
      if(n == 0)
         roundcorner_css += "\nbackground-color: ##{border};"
      end
   end
   if(n > 0)
      # stretch the border width for certain radii
      bw = 1+(item/6)
      roundcorner_css += "\nborder-left:#{bw}px solid ##{border};"
      roundcorner_css += "\nborder-right:#{bw}px solid ##{border};"
   end
   roundcorner_css += "\n}\n\n"
   roundcorner_html += "<span class=\"#{css_baseclass}#{n}\"></span>\n"
   n += 1
end

roundcorner_css += ".#{css_baseclass}_content {\npadding-right:#{radius}px;\npadding-left:#{radius}px;\ndisplay:block;"
if(graphic_background)
   roundcorner_css += "\nbackground: #{interior};\nbackground-position: 0px -#{array.size}px;"
else
   roundcorner_css += "\nbackground-color: ##{interior};"
end
roundcorner_css += "\nborder-left:1px solid ##{border};"
roundcorner_css += "\nborder-right:1px solid ##{border};"
roundcorner_css += "\n}\n\n"

# content section of the HTML

roundcorner_html += "</span>\n"
roundcorner_html += "<div class=\"#{css_baseclass}_content\">"
roundcorner_html += "sample content " * 48
roundcorner_html += "</div>\n"
roundcorner_html += "<span class=\"#{css_baseclass}\">\n"

(array.size-1).downto(0) do |n|
   roundcorner_html += "<span class=\"#{css_baseclass}#{n}\"></span>\n"
end

# prettify the CSS

prettified_css = ""
tab = 0

roundcorner_css.each do |line|
   tab -= 1 if(line =~ /\}/)
   prettified_css += "  " * tab + line
   tab += 1 if(line =~ /\{/)
end

# more sample page output

roundcorner_html += "</span>\n</div>\n</body>\n</html>\n"

# save the CSS and HTML content

File.open(target_css,"w") { |f| f.write(prettified_css) }

File.open(target_html,"w") { |f| f.write(roundcorner_html) }

Home | Ruby | CSS Corners |     Share This Page