sproutcore 1.0.1046 → 1.0.1049.pre.1

data/frameworks/sproutcore/themes/ace/chance/chance.rb

@@ -0,0 +1,203 @@
+#!/usr/bin/env ruby
+
+# A CSSParser object is created for every file processed. It opens the file,
+# reads its contents, and can perform two actions on it: parsing and generating.
+#
+# The parsing step reads the file and finds references to images; this causes those
+# images to be added to the object's usedImages, which is a set of images required (images
+# here being hashes with arguments specified). Ruby's "Set" functionality seems
+# to work here (I am not a ruby expert, hence 'seems')
+# 
+# Internally, it actually generates an in-memory CSS file in the parsing step,
+# to be used in the generating step—but that's all transparent. The object is long-lived,
+# staying around from initial parse step to generation.
+#
+# In my opinion, this script is not that great. This is due to two reasons: it is my very
+# first script written in Ruby, and I was figuring out the requirements by writing it (something
+# I often do, but I usually follow that with a rewrite).
+# But still, it generally works, and works with acceptable speed.
+
+$: << File.expand_path(File.dirname(__FILE__) + "/lib")
+
+require 'css'
+require 'slicedice'
+
+require 'optparse'
+require 'pp'
+require 'FileUtils'
+
+config = {}
+argparser = OptionParser.new {|opts|
+  opts.banner = "Usage: ruby generate_theme.rb [options] theme.name"
+  
+  config[:optimization_limit] = 50000
+  opts.on(
+    '-l', 
+    '--optimization-limit [limit]', Integer,
+    "Optimization limit; if reducing latency by eliminating a file causes more " +
+    "than [limit] wasted pixels, it won't be done."
+  ) {|limit|
+    config[:optimization_limit] = limit
+  }
+  
+  opts.on('--prefer-fewer-files', "Prefer fewer files by setting the optimization limit to 2 million pixels.") {
+    config[:optimization_limit] = 2000000
+  }
+  
+  opts.on('--prefer-smaller-download', "Prefer smaller download by setting the optimization limit to 0 pixels.") {
+    config[:optimization_limit] = 0
+  }
+  
+  
+  config[:input] = "./src/"
+  opts.on('-i', '--input [directory]', "Input directory (default: ./)") {|input|
+    config[:input] = input
+  }
+  
+  config[:output] = "resources/"
+  opts.on('-o', '--output [directory]', 'Set output path (default: resources/)') {|out|
+    out += "." if out.length == 0
+    out += "/" if out[out.length - 1] != '/'
+    config[:output] = out
+  }
+  
+  config[:url_template] = "static_url(\"%s\")"
+  opts.on('-u', '--url [PATTERN]', 'The URL template (default: static_url(\"%s\") )') {|template|
+    config[:url_template] = template
+  }
+  
+  config[:extension] = "css"
+  opts.on('-e', '--extension [ext]', "The extension for CSS files.") {|ext|
+    config[:extension] = ext
+  }
+  
+  config[:less] = false
+  opts.on('--less', "Postprocess using LESS.") {
+    config[:less] = true
+  }
+  
+  config[:include_sc_theme] = true
+  opts.on('--no-sc-theme', "Exclude 'sc-theme' prefix (newer themes with SC 1.1 can do this).") {
+    config[:include_sc_theme] = false
+  }
+  
+  config[:use_data_url] = false
+  opts.on('--data-url', "Use data urls embedded in the CSS.") {
+    config[:use_data_url] = true
+  }
+  
+  config[:hue] = 1.0
+  config[:saturation] = 1.0
+  config[:brightness] = 1.0
+  
+  opts.on('--hue [def]', Float, 'Adjust hue (default 1.0)') {|v|
+    config[:hue] = v
+  }
+  
+  opts.on('--saturation [def]', Float, 'Adjust hue (saturation 1.0)') {|v|
+    config[:saturation] = v
+  }
+  
+  opts.on('--brightness [def]', Float, 'Adjust brightness (default 1.0)') {|v|
+    config[:brightness] = v
+  }
+}
+
+argparser.parse!
+if ARGV.length > 0
+  config[:theme_name] = ARGV[0]
+end
+
+require 'find'
+images = {}
+static_images = {}
+parsers = []
+Find.find(config[:input]) do |f|
+  if f =~ /^\.\/(resources)|\/\./
+    Find.prune
+  end
+  if f =~ /\.css$/
+    parser = CSSParser.new(File.dirname(f), File.basename(f), config)
+    parsers << parser
+    parser.parse
+    images.merge! parser.images
+    static_images.merge! parser.static_images
+  end
+end
+
+#---------------------------------------------------------------------------
+# TODO: ?
+#   I should probably make this a boolean option and wrap this in an if
+#   statement based on that option.
+#---------------------------------------------------------------------------
+# Copy all non-sprited images to respective dirs.
+if static_images.length > 0
+  static_images.values.each do |hsh|
+    src_path = hsh[:path]
+    match = /((\/images\/.*)(\/.*(\.png|\.jpg|\.gif)))/.match(src_path)
+    if match
+      location = match[2]
+      new_loc = "#{config[:output].sub(/\/$/,'')}#{location}"
+      FileUtils.mkdir_p(new_loc) if !File.exist?(new_loc)
+      FileUtils.cp("#{src_path}", new_loc) if File.exist?(src_path)
+    end
+  end
+end
+# END Non-sprited image copy 
+
+
+slicer = Slicer.new(config)
+slicer.images = images
+slicer.slice
+slicer.dice
+
+# Add all the code together
+css_code = ""
+parsers.each {|parser|
+  parser.images = slicer.images
+  css_code += parser.generate + "\n"
+}
+
+# Do some cleanup of whitespace
+cleaned = ""
+css_code.each_line {|line|
+  cleaned += line.strip + "\n"
+}
+
+final = cleaned
+
+if config[:less]
+  begin
+    require 'less'
+  rescue
+    raise "Lest less doth be installed, less shall remain unusable. Sad."
+  end
+  
+  keyframes = {}
+  
+  # this is dirty; I took a shower after writing this
+  # first group gets the animation name, the second captures the % keyframes
+  webkitkeyframes_rule = /@\-webkit\-keyframes\s*([\w-]*)\s*{((\s*[\d]*%\s*{[^}]*})*)\s*}/
+  cleaned.gsub!(webkitkeyframes_rule) do |match|
+    keyframes[$1] = $2
+    ".less-sucks-" + $1 + " { less: " + $1 + "; }"
+  end
+  
+  lessed = Less.parse cleaned
+  final = ""
+  
+  rev_webkitkeyframes_rule = /.less\-sucks\-\s*([^\s]*) { less: \1; }/
+  lessed.gsub!(rev_webkitkeyframes_rule) do |match|
+    "@-webkit-keyframes " + $1 + "{ " + keyframes[$1] + "}"
+  end
+  
+  # LESS messes things up
+  lessed.each_line {|line|
+    final += line.gsub(/url\('data:image\/(gif|png);base64,(.*?)'\)/) do |match|
+      "url('data:image/" + $1 + ";base64," + $2.gsub(" ", "+") + "')"
+    end
+  }
+end
+
+
+File.open(config[:output] + "theme." + config[:extension], File::WRONLY|File::TRUNC|File::CREAT) {|f| f.write(final) }

data/frameworks/sproutcore/themes/ace/chance/lib/css.rb

@@ -0,0 +1,202 @@
+require 'set'
+require 'base64'
+class CSSParser
+  attr_accessor :images, :contents, :static_images
+  def initialize(directory, file, config)
+    @directory = directory
+    @file = file
+    @theme = ""
+    if !config[:theme_name].nil?
+      @theme = "." + config[:theme_name]
+    end
+    @config = config
+    @images = {  }
+    @static_images = { }
+  end
+  
+  def parse
+    # first, read file
+    file = File.new(@directory + "/" + @file)
+    contents = ""
+    file.each {|line| contents += line}
+    @contents = contents
+    
+    self.parse_rules
+    self.parse_sprites
+  end
+  
+  def parse_rules
+    # parses @theme "name"
+    # and @view(viewname)
+    contents = @contents
+    
+    view_rule = /(@view|@theme|@end)(\(\s*(["']{2}|["'].*?[^\\]"|[^\s]+)\s*\))?;?/
+    
+    theme_name = @theme
+    theme_parts = [theme_name]
+    contents.gsub!(view_rule) do |match|
+      #".sc-view." + $1 + "." + theme_name # If SproutCore changes some
+      if $1 == "@view"
+        tn = ""
+        if @config[:include_sc_theme]
+          tn = ".sc-theme "
+        end
+        tn + ".sc-view" + theme_name + "." + $3
+      elsif $1 == "@theme"
+        theme_parts.push $3
+        theme_name = theme_parts.join "."
+        ""
+      elsif $1 == "@end"
+        theme_parts.pop
+        theme_name = theme_parts.join "."
+        ""
+      end
+    end
+    
+    boxshadow_rule = /\-sc\-box\-shadow:\s*([^;]*)/
+    contents.gsub!(boxshadow_rule) do |match|
+      "-moz-box-shadow: " + $1 + "; -webkit-box-shadow: " + $1 + "; box-shadow: " + $1
+    end
+    
+    borderradius_rule = /\-sc\-border\-radius:\s*([^;]*)/
+    contents.gsub!(borderradius_rule) do |match|
+      "-moz-border-radius: " + $1 + "; -webkit-border-radius: " + $1 + "; border-radius: " + $1
+    end
+    
+    borderradius_topleft_rule = /\-sc\-border\-top\-left\-radius:\s*([^;]*)/
+    contents.gsub!(borderradius_topleft_rule) do |match|
+      "-moz-border-radius-topleft: " + $1 + "; -webkit-border-top-left-radius: " + $1 + "; border-top-left-radius: " + $1
+    end
+    
+    borderradius_topright_rule = /\-sc\-border\-top\-right\-radius:\s*([^;]*)/
+    contents.gsub!(borderradius_topright_rule) do |match|
+      "-moz-border-radius-topright: " + $1 + "; -webkit-border-top-right-radius: " + $1 + "; border-top-right-radius: " + $1
+    end
+    
+    borderradius_bottomleft_rule = /\-sc\-border\-bottom\-left\-radius:\s*([^;]*)/
+    contents.gsub!(borderradius_bottomleft_rule) do |match|
+      "-moz-border-radius-bottomleft: " + $1 + "; -webkit-border-bottom-left-radius: " + $1 + "; border-bottom-left-radius: " + $1
+    end
+    
+    borderradius_bottomright_rule = /\-sc\-border\-bottom\-right\-radius:\s*([^;]*)/
+    contents.gsub!(borderradius_bottomright_rule) do |match|
+      "-moz-border-radius-bottomright: " + $1 + "; -webkit-border-bottom-right-radius: " + $1 + "; border-bottom-right-radius: " + $1
+    end
+    
+    @contents = contents
+  end
+  
+  def parse_sprites
+    contents = @contents
+    
+    # A whole regexp would include: ([\s,]+(repeat-x|repeat-y))?([\s,]+\[(.*)\])?
+    # but let's keep it simple:
+    sprite_directive = /(sprite|static_url)\(\s*(["']{2}|["'].*?[^\\]['"]|[^\s]+)(.*?)\s*\)/
+    contents = contents.gsub(sprite_directive) do | match |
+      # prepare replacement string
+      replace_with_prefix = "sprite_for("
+      replace_with_suffix = ")"
+      
+      # get name and add to replacement
+      type = $1
+      image_name = $2
+      args = $3
+      image_name = $2.sub(/^["'](.*)["']$/, '\1')
+      
+      result_hash = { 
+        :path => File.expand_path(@directory + "/" + image_name), :image => image_name,
+        :repeat => "no-repeat", :rect => [], :target => "",
+        :anchor => :none, :clear => false, :nosprite => (type == "static_url")
+      }
+      
+      # Replacement string is made to be replaced again in a second pass
+      # first pass generates manifest, second pass actually puts sprite info in.
+      
+      # match: key words (Separated by whitespace) or rects.
+      args.scan(/(\[.*?\]|[^\s]+)/) {|r|
+        arg = $1.strip
+        
+        if arg.match(/^\[/)
+          # A rectangle specifying a slice
+          full_rect = []
+          params = arg.gsub(/^\[|\]$/, "").split(/[,\s]+/)
+          if params.length == 1
+            full_rect = [params[0].to_i, 0, 0, 0]
+          elsif params.length == 2
+            full_rect = [params[0].to_i, 0, params[1].to_i, 0]
+          elsif params.length == 4
+            full_rect = params.map {|e| e.to_i}
+          else
+            
+          end
+          
+          result_hash[:rect] = full_rect
+        else
+          # a normal keyword, probably.
+          if arg == "repeat-x"
+            result_hash[:repeat] = "repeat-x"
+          elsif arg == "repeat-y"
+            result_hash[:repeat] = "repeat-y"
+          elsif arg == "anchor-right"
+            result_hash[:anchor] = :right
+          elsif arg == "anchor-left"
+            result_hash[:anchor] = :left
+          elsif arg == "clear"
+            result_hash[:clear] = true
+          end
+        end
+      }
+      
+      image_key = result_hash[:repeat] + ":" + result_hash[:rect].join(",") + ":" + result_hash[:path]
+      replace_with = replace_with_prefix + image_key + replace_with_suffix
+      @images[image_key] = result_hash
+      
+      replace_with
+    end
+    
+    @contents = contents
+  end
+  
+  def generate
+    contents = @contents
+    contents = contents.gsub(/sprite_for\(\s*(["']{2}|["'].*?[^\\]["']|.*?)\s*\)/) {|match|
+      key = $1
+      result = ""
+      if @images.key? key
+        image = @images[key]
+        
+        # if it is not sprited or we are not doing data urls, we use the url template.
+        if image[:nosprite] or not @config[:use_data_url]
+          result = (@config[:url_template] % [image[:sprite_path]])
+        else
+          # otherwise, we need to use a data url.
+          data = image[:image].to_blob
+          data = Base64.encode64(data)
+          data = data.gsub(/[ \n]/, '')
+        
+          result = "url(\'data:image/png;base64,#{data}\')"
+        end
+        
+        # Only put repeat data if not sprited
+        if not image[:nosprite]
+          result += " #{image[:repeat]}"
+          
+          if not @config[:use_data_url]
+            if image[:anchor] == :none
+              result += image[:sprite_x] == 0 ? " #{image[:sprite_x]}" : " -#{image[:sprite_x]}px"
+            else
+              result += (image[:anchor] == :right ? " right" : " left")
+            end
+            result += image[:sprite_y] == 0 ? " #{image[:sprite_y]}" : " -#{image[:sprite_y]}px"
+          end
+        end
+        
+      else
+        puts "Did not find image with key: ", key
+      end
+      
+      result
+    }
+    return contents
+  end
+end

data/frameworks/sproutcore/themes/ace/chance/lib/slicedice.rb

@@ -0,0 +1,391 @@
+# The Slicer object takes a set of images and slices them as needed, producing a set of images
+# located in a hierarchy (for debugging purposes) in the output directory.
+# The name will be: (output)/path/to/image.png_slice_rect_here.png
+require 'rubygems'
+require 'RMagick'
+require 'FileUtils'
+require 'pp'
+
+class Slicer
+  attr_accessor :images
+  
+  def initialize(config)
+    @config = config
+    @output_dir = config[:output]
+    @optimization_limit = config[:optimization_limit]
+  end
+  
+  # slice performs the slicing operations, putting the images in the output directory
+  def slice
+    config = @config
+    
+    image_set = []
+    @images.each do |key, definition|
+      path = definition[:path]
+      
+      x, y, width, height = 0, 0, 0, 0
+      if definition[:rect].length > 0
+        x, y, width, height = definition[:rect]
+      end
+      
+      
+      print "Processing " + path + "...\n"
+      
+      begin
+        images = Magick::ImageList.new(path)
+        if images.length < 1
+          print "Could not open; length: ", images.length, "\n"
+          next
+        end
+      rescue
+        print "Could not open the file.\n"
+        next
+      end
+      
+      image = images[0]
+      
+      image_width, image_height = image.columns, image.rows
+      if x < 0 then x = image_width + x end
+      if y < 0 then y = image_height + y end
+      if width == 0 then width = image_width - x end
+      if height == 0 then height = image_height - y end
+      
+      # Crop image
+      result = image.crop(x, y, width, height).modulate(config[:brightness], config[:saturation], config[:hue])
+      
+      # Write image: Skipped because we never read it back from disk
+      # Besides, not good to put it in resources/, where it will get added to the build.
+      # FileUtils.mkdir_p @output_dir + "slices/" + File.dirname(path)
+      # slice_path = @output_dir + "slices/" + path + "_" + [x, y, width, height].join("_") + ".png"
+      # result.write(slice_path)
+      
+      # update definition
+      definition[:width] = width
+      definition[:height] = height
+      definition[:key] = key
+      definition[:image] = result
+      
+      # add to new images collection
+      image_set << definition
+    end
+    
+    @image_list = image_set
+  end
+  
+  # dice seems like it should continue that, but I just named it dice for fun. It really sprites things.
+  def dice
+    # For each target, for each try, plan out normal, x-repeat, and y-repeat.
+    # Write out images for each target named target.png, target-x.png, and target-y.png.
+    
+    # Each "try" is a set of settings with which to attempt to generate a plan.
+    # The wasted space that is returned with the plan is used to determine which try to use.
+    # The spriter will usually try a x-repeat with the normal images first, then separate.
+    # A certain amount of leeway should be given when X-repeat and normal are combined (an amount
+    # of wasted space past which it would be impractical to keep them in the same file)
+    #
+    # Settings work as follows: an aim parameter specifies a multiple of a) the image width
+    # b) the least common multiplier of all repeat pattern widths.
+    tries = []
+    10.times {|i| tries << {:aim=>i + 1} }
+    
+    images = @image_list
+    
+    sprites = images.select {|v| not v[:nosprite] }
+    nonsprites = images.select {|v| v[:nosprite] }
+    
+    ximages = sprites.select {|v| v[:repeat] == "repeat-x" }
+    yimages = sprites.select {|v| v[:repeat] == "repeat-y" }
+    nimages = sprites.select {|v| v[:repeat] == "no-repeat" }
+    
+    plans = []
+    tries.each {|try|
+      # we will have either 2 or three images in any case. So,
+      # we need to pick the best case: the smallest possible primary image.
+      plans << [self.plan(ximages + nimages, try), self.yplan(yimages)]
+      plans << [self.plan(nimages, try), self.plan(ximages, try), self.yplan(yimages)]
+      
+    }
+    
+    # sort by wasted space. The least wasted is the one we want.
+    plans.sort! {|a, b|
+      total_wasted_a = 0
+      total_wasted_b = 0
+      a.each {|e| total_wasted_a += e[:wasted] }
+      b.each {|e| total_wasted_b += e[:wasted] }
+      
+      total_wasted_a -= @optimization_limit if a.length < 3
+      total_wasted_b -= @optimization_limit if b.length < 3
+      total_wasted_a <=> total_wasted_b
+    }
+    
+    # Best plan is plan 0.
+    planset = plans[0]
+    new_image_hash = {}
+    total_wasted = 0
+    i = 0
+    
+    FileUtils.mkdir_p @output_dir + "images/"
+    
+    # Write static
+    nonsprites.each {|nonsprite|
+      i += 1
+      filename = i.to_s + ".png"
+      nonsprite[:sprite_path] = "images/" + filename
+      new_image_hash[nonsprite[:key]] = nonsprite
+      nonsprite[:image].write(@output_dir + "images/" + filename)
+    }
+    
+    # Write plan
+    planset.each {|plan|
+      if not (plan and plan[:width] and plan[:width] > 0)
+        next
+      end
+      target_image = Magick::Image.new(plan[:width], plan[:height]) {
+        self.background_color = "transparent"
+      }
+
+      i += 1
+      filename =  i.to_s + ".png"
+      
+      plan[:plan].each {|image|
+        cols = image[:image].columns
+        rows = image[:image].rows
+        written_x = 0
+        written_y = 0
+        
+        image[:sprite_path] = "images/" + filename
+        image[:sprite_x] = image[:x] # just to be as specific as possible
+        image[:sprite_y] = image[:y]
+        new_image_hash[image[:key]] = image
+        
+        # loop through plan
+        while written_y < image[:height] do
+          while written_x < image[:width] do
+            target_image.composite!(image[:image], image[:x] + written_x, image[:y] + written_y, Magick::CopyCompositeOp)
+            written_x += [cols, image[:width]].min
+          end
+          written_y += [rows, image[:height]].min
+        end
+      }
+      
+      target_image.write(@output_dir + "images/" + filename)
+      total_wasted += plan[:wasted]
+    }
+    
+    print "Wasted pixels: ", total_wasted, "\n"
+    @images = new_image_hash
+  end
+  
+  # Plan the y-repeat images
+  def yplan(images)
+    # we go in direction: settings[:direction]. We sort the images first, biggest to smallest
+    # based on their directional size (i.e. width for horizontal).
+    # the first image in the sorted set is used to figure out the width or height of the image
+    # (also using the config's units prop)
+    wasted_pixels = 0
+    plan = [] # images
+    
+    # Handle no images
+    if images.length < 1
+      return {:wasted=>0, :plan=>plan}
+    end
+    
+    # sort images
+    images = images.sort {|a, b|
+      b[:width] <=> a[:width]
+    }
+    
+    lcm = 1
+    images.each {|image|
+      lcm = lcm.lcm image[:height]
+    }
+    
+    
+    x = 0
+    total_height = lcm
+    
+    # loop through images
+    images.each {|image|
+      width = image[:width]
+      height = image[:height]
+            
+      img = image.dup
+      
+      # Set position
+      img[:x] = x
+      img[:y] = 0
+      
+      # handle repeated images
+      img[:height] = total_height
+      wasted_pixels += (total_height - height) * width
+      
+      # width!
+      img[:width] = width
+      
+      # add to plan
+      plan << img
+      
+      
+      x += img[:width]
+    }
+
+    return {:plan=>plan, :width => x, :height => total_height, :wasted=>wasted_pixels}
+  end
+  
+  # Settings={:direction=>}
+  # Returns: {:wasted=>percent, :plan=>collection of clones of image hashes w/plan setings }
+  # Wasted is the amount of a) empty space and b) extra space used by repeating patterns.
+  # The width of the image is either a) the width of the 
+  def plan(images, settings)
+    # the first image in the sorted set is used to figure out the width or height of the image
+    wasted_pixels = 0
+    plan = [] # images
+    
+    # Handle no images
+    if images.length < 1
+      return {:wasted=>0, :plan=>plan}
+    end
+    
+    # sort images
+    images = images.sort {|a, b|
+      res = b[:repeat] <=> a[:repeat] # keep non-repeats together (at begin).
+      if res == 0
+        res = b[:width] <=> a[:width]
+        if res == 0
+          res = b[:height] <=> a[:height] # sort these to get like ones together
+        end
+      end
+      res
+    }
+    
+    # Select images
+    normal_images = images.select {|i|
+      i[:anchor] == :none
+    }
+    anchor_left_images = images.select {|i|
+      i[:anchor] == :left
+    }
+    anchor_right_images = images.select {|i|
+      i[:anchor] == :right #or i[:clear] this was causing duplication if a left anchored image was also cleared :)
+    }
+    
+    max = 0
+    lcm = 1
+    images.each {|image|
+      max = [max, image[:width]].max
+      if image[:repeat] == "repeat-x"
+        lcm = lcm.lcm image[:width]
+      end
+    }
+    
+    # get unit (row/col) size
+    unit_size = max
+    unit_size = unit_size.lcm lcm
+    
+    total_width = unit_size * settings[:aim] # 1 is probably best... but we try many :)
+    x = 0
+    y = 0 # the current total secondary
+    
+    # loop through images. Each iteration represents a single row.
+    while normal_images.length > 0 or anchor_left_images.length > 0 or anchor_right_images.length > 0
+      x = 0
+      row_height = 0
+      row_space = total_width
+      
+      # Very first thing: handle repeat-x
+      if normal_images.length > 0 and normal_images[0][:repeat] == "repeat-x"
+        img = normal_images.shift.dup
+        normal_width = img[:width]
+        img[:width] = total_width
+        img[:x] = 0
+        img[:y] = y
+        plan << img
+        
+        wasted_pixels += (total_width - normal_width) * (img[:height])
+        row_space = 0
+        row_height = img[:height]
+      end
+
+      # fit in anchor left first, if any
+      left = anchor_left_images[0]
+      if left and left[:width] <= row_space
+        left = anchor_left_images.shift
+        left = left.dup
+        left[:x] = 0
+        left[:y] = y
+        plan << left
+        
+        x += left[:width]        
+        row_height = [row_height, left[:height]].max
+        row_space -= left[:width]
+        
+        row_space = 0 if left[:clear]
+      end
+      
+      # now anchor right
+      right = anchor_right_images[0]
+      if right and right[:width] <= row_space
+        right = anchor_right_images.shift
+        right = right.dup
+        right[:x] = total_width - right[:width]
+        right[:y] = y
+        plan << right
+        
+        row_height = [row_height, right[:height]].max
+        row_space -= right[:width]
+        row_space = 0 if right[:clear]
+      end
+      
+      # Find first (largest) image that will fit
+      put_any = false
+      processed = []
+      normal_images.each {|e|
+        # skip those that can't fit
+        if e[:repeat] == "repeat-x" or e[:width] > row_space
+          next
+        end
+        
+        # Get image
+        processed.push(e)
+        img = e.dup
+      
+        # Set position
+        img[:x] = x
+        img[:y] = y
+      
+        # add to plan
+        plan << img
+        
+        x += img[:width]
+        row_space -= img[:width]
+        row_space = 0 if img[:clear]
+        row_height = [row_height, img[:height]].max
+        
+        # If there isn't ANY space, just stop.
+        break if row_space == 0
+      }
+      processed.each {|e| normal_images.delete(e) }
+      
+      while normal_images.length > 0 and normal_images[0][:repeat] != "repeat-x" and normal_images[0][:width] <= row_space
+        img = normal_images.shift.dup
+      
+        # Set position
+        img[:x] = x
+        img[:y] = y
+      
+        # add to plan
+        plan << img
+        
+        x += img[:width]
+        row_space -= img[:width]
+        row_space = 0 if img[:clear]
+        row_height = [row_height, img[:height]].max
+      end
+      
+      wasted_pixels += row_height * row_space  # empty space: free in PNG? Well, not for now, it isn't.
+      y += row_height
+    end
+    
+    return {:plan=>plan, :width => total_width, :height => y, :wasted=>wasted_pixels}
+  end
+end