green_shoes 0.164.0 → 0.171.0

data/VERSION

@@ -1 +1 @@
-0.164.0
+0.171.0

data/lib/green_shoes.rb

@@ -37,6 +37,7 @@ require_relative 'shoes/text'
 require_relative 'shoes/mask'
 require_relative 'shoes/widget'
 require_relative 'shoes/url'
+require_relative 'shoes/style'
 require_relative 'shoes/projector'
 require_relative 'shoes/download'
 require_relative 'shoes/manual'

data/lib/shoes/app.rb

@@ -7,7 +7,15 @@ class Shoes
       args.each do |k, v|
         instance_variable_set "@#{k}", v
       end
-      
+
+      win_title = @owner.instance_variable_get('@title')
+      class << @owner; self end.
+      class_eval do
+        define_method :to_s do
+          win_title or 'green shoes'
+        end
+      end if @owner
+
       App.class_eval do
         attr_accessor *(args.keys - [:width, :height, :title])
       end
@@ -24,7 +32,7 @@ class Shoes
     attr_accessor :cslot, :cmask, :top_slot, :contents, :canvas, :app, :mccs, :mrcs, :mmcs, 
       :mhcs, :mlcs, :shcs, :mcs, :win, :swin, :width_pre, :height_pre, :order, :dics
     attr_writer :mouse_button, :mouse_pos
-    attr_reader :link_style, :linkhover_style, :animates
+    attr_reader :link_style, :linkhover_style, :animates, :owner
 
     def visit url
       if url =~ /^(http|https):\/\//
@@ -62,22 +70,6 @@ class Shoes
       @top_slot.clear &blk
     end
 
-    def style klass, args={}
-      if klass == Shoes::Link
-          @link_style = LINK_DEFAULT
-          @link_style.sub!('single', 'none') if args[:underline] == false
-          @link_style.sub!("foreground='#06E'", "foreground='#{args[:stroke]}'") if args[:stroke]
-          @link_style.sub!('>', " background='#{args[:fill]}'>") if args[:fill]
-          @link_style.sub!('normal', "#{args[:weight]}") if args[:weight]
-      elsif klass == Shoes::LinkHover
-          @linkhover_style = LINKHOVER_DEFAULT
-          @linkhover_style.sub!('single', 'none') if args[:underline] == false
-          @linkhover_style.sub!("foreground='#039'", "foreground='#{args[:stroke]}'") if args[:stroke]
-          @linkhover_style.sub!('>', " background='#{args[:fill]}'>") if args[:fill]
-          @linkhover_style.sub!('normal', "#{args[:weight]}") if args[:weight]
-      end
-    end
-
     def textblock klass, font_size, *msg
       args = msg.last.class == Hash ? msg.pop : {}
       args = basic_attributes args
@@ -477,7 +469,9 @@ class Shoes
       klass.new args
     end
 
-    def shape args, &blk
+    def shape args={}, &blk
+      args[:left] ||= 0
+      args[:top] ||= 0
       args[:block] = blk
       shapebase Shape, args
     end
@@ -647,5 +641,14 @@ class Shoes
       Shoes.APPS.delete app
       exit if Shoes.APPS.empty?
     end
+
+    def window args={}, &blk
+      args.merge! owner: self
+      Shoes.app args, &blk
+    end
+
+    def flush
+      Shoes.call_back_procs self
+    end
   end
 end

data/lib/shoes/basic.rb

@@ -28,8 +28,8 @@ class Shoes
       @hided, @shows, @hovered = false, true, false
     end
 
-    attr_reader :parent, :click_proc, :release_proc, :hover_proc, :leave_proc, :args, :shows, :initials
-    attr_accessor :hided, :hovered
+    attr_reader :parent,  :args, :shows, :initials
+    attr_accessor :hided
 
     def move x, y
       @app.cslot.contents -= [self]
@@ -122,35 +122,6 @@ class Shoes
         move @left, @top
       end
     end
-
-    def click &blk
-      @click_proc = blk
-      @app.mccs << self
-    end
-    
-    def release &blk
-      @release_proc = blk
-      @app.mrcs << self
-    end
-
-    def hover &blk
-      @hover_proc = blk
-      (@app.mhcs << self) unless @app.mhcs.include? self
-    end
-
-    def leave &blk
-      @leave_proc = blk
-      (@app.mhcs << self) unless @app.mhcs.include? self
-    end
-    
-    def style args
-      clear
-      @args[:nocontrol] = @args[:noorder] = true
-      m = self.class.to_s.downcase[7..-1]
-      args = @args.merge args
-      blk = args[:block]
-      @real = @app.send(m, args, &blk).real
-    end
   end
 
   class Image < Basic; end
@@ -207,14 +178,7 @@ class Shoes
     end
     
     def text= s
-      clear if @real
-      @width = (@left + parent.width <= @app.width) ? parent.width : @app.width - @left
-      @width = initials[:width] unless initials[:width].zero?
-      @height = 20 if @height.zero?
-      m = self.class.to_s.downcase[7..-1]
-      args = [s, @args.merge({left: @left, top: @top, width: @width, height: @height, create_real: true, nocontrol: true})]
-      tb = @app.send(m, *args)
-      @real, @height, @args[:markup] = tb.real, tb.height, tb.markup
+      style markup: s
     end
 
     alias :replace :text=

data/lib/shoes/helper_methods.rb

@@ -10,7 +10,28 @@ class Shoes
       @margin_bottom ||= margin_bottom
     end
 
-    attr_reader :margin_left, :margin_top, :margin_right, :margin_bottom
+    def click &blk
+      @click_proc = blk
+      @app.mccs << self
+    end
+    
+    def release &blk
+      @release_proc = blk
+      @app.mrcs << self
+    end
+
+    def hover &blk
+      @hover_proc = blk
+      (@app.mhcs << self) unless @app.mhcs.include? self
+    end
+
+    def leave &blk
+      @leave_proc = blk
+      (@app.mhcs << self) unless @app.mhcs.include? self
+    end
+
+    attr_reader :margin_left, :margin_top, :margin_right, :margin_bottom, :click_proc, :release_proc, :hover_proc, :leave_proc
+    attr_accessor :hovered
   end
   
   module Mod2
@@ -137,13 +158,13 @@ class Shoes
 
   def self.mouse_click_control app
     app.mccs.each do |e|
-      e.click_proc.call if mouse_on? e
+      e.click_proc[*app.mouse] if mouse_on? e
     end
   end
   
   def self.mouse_release_control app
     app.mrcs.each do |e|
-      e.release_proc.call if mouse_on? e
+      e.release_proc[*app.mouse] if mouse_on? e
     end
   end
 
@@ -157,7 +178,7 @@ class Shoes
     app.mhcs.each do |e|
       if mouse_on?(e) and !e.hovered
         e.hovered = true
-        e.hover_proc.call if e.hover_proc
+        e.hover_proc[e] if e.hover_proc
       end
     end
   end
@@ -166,7 +187,7 @@ class Shoes
     app.mhcs.each do |e|
       if !mouse_on?(e) and e.hovered
         e.hovered = false
-        e.leave_proc.call if e.leave_proc
+        e.leave_proc[e] if e.leave_proc
       end
     end
   end
@@ -180,6 +201,7 @@ class Shoes
   
   def self.set_cursor_type app
     app.mccs.each do |e|
+      next if e.is_a? Slot
       e.real.window.cursor = ARROW if e.real.window
       (e.real.window.cursor = HAND; return) if mouse_on? e
     end
@@ -207,8 +229,13 @@ class Shoes
   end
   
   def self.mouse_on? e
-    mouse_x, mouse_y = e.real.pointer
-    (0..e.width).include?(mouse_x) and (0..e.height).include?(mouse_y)
+    if e.is_a? Slot
+      mouse_x, mouse_y = e.app.win.pointer
+      (e.left..e.left+e.width).include?(mouse_x) and (e.top..e.top+e.height).include?(mouse_y)
+    else
+      mouse_x, mouse_y = e.real.pointer
+      (0..e.width).include?(mouse_x) and (0..e.height).include?(mouse_y)
+    end
   end
 
   def self.mouse_on_link tb, app

data/lib/shoes/slot.rb

@@ -14,7 +14,7 @@ class Shoes
       set_margin
 
       @radio_group = Gtk::RadioButton.new
-      @masked = false
+      @masked = @hovered = false
       @parent = @app.cslot
       @app.cslot = self
       @contents = []
@@ -70,13 +70,36 @@ class Shoes
       if blk
         args = {}
         initials.keys.each{|k| args[k] = instance_variable_get "@#{k}"}
-	args[:nocontrol] = true
+        args[:nocontrol] = true
         tmp = self.is_a?(Stack) ? Stack.new(@app.slot_attributes(args), &blk) : Flow.new(@app.slot_attributes(args), &blk)
         self.contents = tmp.contents
         Shoes.call_back_procs @app
         Shoes.set_cursor_type @app
       end
     end
+
+    def append &blk
+      prepend contents.length, &blk
+    end
+    
+    def prepend n = 0
+      self.contents, tmp = contents[0...n], contents[n..-1]
+      cslot, @app.cslot = @app.cslot, self
+      yield
+      self.contents += tmp
+      @app.cslot = cslot
+      Shoes.call_back_procs @app
+    end
+    
+    def before e, &blk
+      prepend contents.index(e).to_i, &blk
+    end
+    
+    def after e, &blk
+      n = contents.index e
+      n = n ? n+1 : contents.length
+      prepend n, &blk
+    end
   end
 
   class Stack < Slot; end

data/lib/shoes/style.rb

@@ -0,0 +1,56 @@
+class Shoes
+  class App
+    def style klass, args={}
+      if klass == Shoes::Link
+          @link_style = LINK_DEFAULT
+          @link_style.sub!('single', 'none') if args[:underline] == false
+          @link_style.sub!("foreground='#06E'", "foreground='#{args[:stroke]}'") if args[:stroke]
+          @link_style.sub!('>', " background='#{args[:fill]}'>") if args[:fill]
+          @link_style.sub!('normal', "#{args[:weight]}") if args[:weight]
+      elsif klass == Shoes::LinkHover
+          @linkhover_style = LINKHOVER_DEFAULT
+          @linkhover_style.sub!('single', 'none') if args[:underline] == false
+          @linkhover_style.sub!("foreground='#039'", "foreground='#{args[:stroke]}'") if args[:stroke]
+          @linkhover_style.sub!('>', " background='#{args[:fill]}'>") if args[:fill]
+          @linkhover_style.sub!('normal', "#{args[:weight]}") if args[:weight]
+      end
+    end
+  end
+
+  class ShapeBase
+    def style args
+      real.clear
+      m = self.class.to_s.downcase[7..-1]
+      args = @args.merge args
+      obj = @app.send m, args, &args[:block]
+      obj.instance_variables.each{|iv| eval "#{iv} = obj.instance_variable_get('#{iv}')"}
+    end
+  end
+
+  class TextBlock
+    def style args
+      args[:markup] ||= @args[:markup]
+      args[:size] ||= @args[:size]
+      args[:font] ||= @args[:font]
+      args[:align] ||= @args[:align]
+      
+      clear if @real
+      @width = (@left + parent.width <= @app.width) ? parent.width : @app.width - @left
+      @width = initials[:width] unless initials[:width].zero?
+      @height = 20 if @height.zero?
+      m = self.class.to_s.downcase[7..-1]
+      args = [args[:markup], @args.merge({left: @left, top: @top, width: @width, height: @height, 
+        create_real: true, nocontrol: true, size: args[:size], font: args[:font], align: args[:align]})]
+      tb = @app.send(m, *args)
+      @real, @height = tb.real, tb.height
+      @args[:markup], @args[:size], @args[:font], @args[:align] = tb.markup, tb.size, tb.font, tb.align
+    end
+  end
+
+  class Slot
+    def style args = nil
+      args ? [:width, :height].each{|s| @initials[s] = args[s] if args[s]} :
+        {width: @width, height: @height}
+    end
+  end
+end

data/samples/sample12.rb

@@ -11,7 +11,7 @@ Shoes.app width: 300, height: 300 do
   j = 0
   a = animate 1 do |i|
     unless j == i
-      r.style fill: send(COLORS.keys[rand size]), stroke: send(COLORS.keys[rand size])
+      r.style fill: send(COLORS.keys[rand size]), stroke: send(COLORS.keys[rand size]), noorder: true
       o.style fill: send(COLORS.keys[rand size]), stroke: send(COLORS.keys[rand size])
       j = i
     end

data/samples/sample49.rb

@@ -0,0 +1,33 @@
+require '../lib/green_shoes'
+
+Shoes.app do
+  popup = proc{alert 'Testing style method...'}
+
+  s1 = stack width: 0.5, height: 1.0 do
+    background cornflowerblue
+    @star = star 20, 20, 10, 100, 50
+    @star.click &popup
+    @msg = para fg('Wait 5 seconds...', yellow), left: 10, top: 450
+  end
+
+  s2 = stack width: 0.5, height: 1.0 do
+    background coral
+    para 'Green Shoes is one of colorful Shoes. It is written in pure Ruby with Ruby/GTK2.'
+    @para = para 'Testing, ', link('test', &popup), ', test. ',
+      strong('Breadsticks. '),
+      em('Breadsticks. '),
+      code('Breadsticks. '),
+      bg(fg(strong(ins('EVEN BETTER.')), white), rgb(255, 0, 192)),
+      sub('fine!')
+    para 'Yah! Yah! Yah!'
+  end
+
+  timer 5 do
+    @star.style width: 30, fill: gold..deeppink, outer: 70, inner: 50
+    @para.style align: 'center', size: 24, markup: fg(em(@para.markup), green)
+    s1.style width: 0.3
+    s2.style width: 0.7
+    @msg.text = fg('Looks good to me!', yellow)
+    flush
+  end
+end

data/static/manual-en.txt

@@ -1168,8 +1168,6 @@ For: ''check, radio''.
 Is this checkbox or radio button checked?  If set to `true`, the box is
 checked.  Also see the [[Check.checked=]] method.
 
-'''Note:''' Green Shoes doesn't support ''check'' and ''radio''.
-
 === :choose » a string ===
 
 For: ''list_box''.
@@ -1629,15 +1627,13 @@ How should the text wrap when it fills its width? Possible options are:
 
 == Classes List ==
 
-Here is a complete list of all the classes introduced by Shoes.  This chart is
-laid out according to how classes inherits from each other.  Subclasses are
-indented one level to the right, beneath their parent class.
+There is a complete list of all the classes introduced by Green Shoes.  
 
-{INDEX}
+Look at [[http://rdoc.info/github/ashbb/green_shoes/master/frames/file/README.md Green Shoes RDoc]].
 
 == Colors List ==
 
-The following list of colors can be used throughout Shoes.  As background
+The following list of colors can be used throughout Green Shoes.  As background
 colors or border colors.  As stroke and fill colors.  Most of these colors come
 from the X11 and HTML palettes.
 
@@ -1651,11 +1647,11 @@ find the exact numbers which can be used with the [[Built-in.rgb]] method.
 
 Slots are boxes used to lay out images, text and so on. The two most common
 slots are `stacks` and `flows`. Slots can also be referred to as "boxes" or
-"canvases" in Shoes terminology.
+"canvases" in Green Shoes terminology.
 
 Since the mouse wheel and PageUp and PageDown are so pervasive on every
 platform, vertical scrolling has really become the only overflow that matters.
-So, in Shoes, just as on the web, width is generally fixed. While height goes
+So, in Green Shoes, just as on the web, width is generally fixed. While height goes
 on and on.
 
 Now, you can also just use specific widths and heights for everything, if you
@@ -1690,7 +1686,7 @@ contents differently.
 Making a flow means calling the [[Element.flow]] method.  Flows may contain
 other flows and stacks.
 
-Last thing: The Shoes window itself is a flow.
+Last thing: The Green Shoes window itself is a flow.
 
 == Art for Slots ==
 
@@ -1708,15 +1704,14 @@ color used to paint inside the lines.
  Shoes.app do
    stroke red
    fill blue
-   oval :top => 10, :left => 10,
-     :radius => 100
+   oval top: 10, left: 10, radius: 100
  end
 }}}
 
 That code gives you a blue pie with a red line around it.  One-hundred pixels
 wide, placed just a few pixels southeast of the window's upper left corner.
 
-The `blue` and `red` methods above are Color objects.  See the section on
+The `blue` and `red` methods above are RGB array.  See the section on
 Colors for more on how to mix colors.
 
 ==== Inspiration from Processing and NodeBox ====
@@ -1726,9 +1721,9 @@ Python.  In turn, NodeBox gets much of its ideas from Processing, a Java-like
 language for graphics and animation.  I owe a great debt to the creators of
 these wonderful programs!
 
-Shoes does a few things differently from NodeBox and Processing.  For example,
-Shoes has different color methods, including having its own Color objects,
-though these are very similar to Processing's color methods.  And Shoes also
+Green Shoes does a few things differently from NodeBox and Processing.  For example,
+Green Shoes has different color methods, including having its own RGB array,
+though these are very similar to Processing's color methods.  And Green Shoes also
 allows images and gradients to be used for drawing lines and filling in shapes.
 
 Shoes also borrows some animation ideas from Processing and will continue to
@@ -1741,16 +1736,22 @@ method just give you a bit more control than [[oval]], by offering the
 `:angle1` and `:angle2` styles.  (In fact, you can mimick the `oval` method by
 setting `:angle1` to 0 and `:angle2` to `Shoes::TWO_PI`.)
 
+'''Note:''' Green Shoes doesn't support `arc` method.
+
 === arrow(left, top, width) » Shoes::Shape ===
 
 Draws an arrow at coordinates (left, top) with a pixel `width`.
 
+'''Note:''' Green Shoes doesn't support `arrow` method.
+
 === cap(:curve or :rect or :project) » self ===
 
 Sets the line cap, which is the shape at the end of every line you draw.  If
 set to `:curve`, the end is rounded.  The default is `:rect`, a line which ends
 abruptly flat.  The `:project` cap is also fat, but sticks out a bit longer.
 
+'''Note:''' Green Shoes doesn't support `cap` method.
+
 === fill(pattern) » pattern ===
 
 Sets the fill bucket to a specific color (or pattern.)  Patterns can be colors,
@@ -1762,7 +1763,7 @@ To draw a star with an image pattern:
 {{{
  #!ruby
  Shoes.app do
-   fill "../static/gshoes-icon.png"
+   fill File.join(DIR, "../static/gshoes-icon.png")
    star 200, 200, 5, 100, 50
  end
 }}}
@@ -1780,12 +1781,12 @@ Instead, shapes will have only a lining, leaving the middle transparent.
 Empties the line color.  Shapes drawn will have no outer line.  If `nofill` is
 also set, shapes drawn will not be visible.
 
-=== line(left, top, x2, y2) » Shoes::Shape ===
+=== line(left, top, x2, y2) » Shoes::Line ===
 
 Draws a line using the current line color (aka "stroke") starting at
 coordinates (left, top) and ending at coordinates (x2, y2).
 
-=== oval(left, top, radius) » Shoes::Shape ===
+=== oval(left, top, radius) » Shoes::Oval ===
 
 Draws a circular form at pixel coordinates (left, top) with a width and height
 of `radius` pixels.  The line and fill colors are used to draw the shape.  By
@@ -1805,7 +1806,7 @@ style on the next method below.
 
 To draw an oval of varied proportions, you may also use the syntax: `oval(left, top, width, height)`.
 
-=== oval(styles) » Shoes::Shape ===
+=== oval(styles) » Shoes::Oval ===
 
 Draw circular form using a style hash.  The following styles are supported:
 
@@ -1818,11 +1819,12 @@ Draw circular form using a style hash.  The following styles are supported:
 
 These styles may also be altered using the `style` method on the Shape object.
 
-=== rect(top, left, width, height, corners = 0) » Shoes::Shape ===
+'''Note:''' Green Shoes doesn't support `center` style.
+
+=== rect(top, left, width, height) » Shoes::Rect ===
 
 Draws a rectangle starting from coordinates (top, left) with dimensions of
-width x height.  Optionally, you may give the rectangle rounded corners with a
-fifth argument: the radius of the corners in pixels.
+width x height. 
 
 As with all other shapes, the rectangle is drawn using the stroke and fill colors.
 
@@ -1839,7 +1841,7 @@ The above sample draws a rectangle which fills the area of its parent box,
 leaving a margin of 10 pixels around the edge.  Also see the `background`
 method for a rectangle which defaults to filling its parent box.
 
-=== rect(styles) » Shoes::Shape ===
+=== rect(styles) » Shoes::Rect ===
 
 Draw a rectangle using a style hash.  The following styles are supported:
 
@@ -1852,6 +1854,8 @@ Draw a rectangle using a style hash.  The following styles are supported:
 
 These styles may also be altered using the `style` method on the Shape object.
 
+'''Note:''' Green Shoes doesn't support `center` style.
+
 === rotate(degrees: a number) » self ===
 
 Rotates the pen used for drawing by a certain number of `degrees`, so that any
@@ -1876,16 +1880,13 @@ block.  You can look at it as sketching a shape with a long line that curves
 and arcs and bends.
 
 {{{
- #!ruby
- # Not yet available
  Shoes.app do
-   fill red(0.2)
+   fill yellow
    shape do
-     move_to(90, 55)
-     arc_to(50, 55, 50, 50, 0, PI/2)
-     arc_to(50, 55, 60, 60, PI/2, PI)
-     arc_to(50, 55, 70, 70, PI, TWO_PI-PI/2)
-     arc_to(50, 55, 80, 80, TWO_PI-PI/2, TWO_PI)
+     move_to 50, 30
+     curve_to 100, 100, 10, 20, 100, 50
+     line_to 20, 100
+     line_to 30, 30
    end
  end
 }}}
@@ -1896,7 +1897,11 @@ the other methods in this [[Art]] section) inside a shape, but they will not be
 part of the line.  They will be more like a group of shapes are all drawn as
 one.
 
-=== star(left, top, points = 10, outer = 100.0, inner = 50.0) » Shoes::Shape ===
+'''Note:''' The above `line_to`, `move_to` and `curve_to` are Cairo::Context methods. 
+Green Shoes uses them directly inside the block. So, Green Shoes doesn't support `arc_to`.
+Also Green Shoes shape can not contain other shapes.
+
+=== star(left, top, points = 10, outer = 100.0, inner = 50.0) » Shoes::Star ===
 
 Draws a star using the stroke and fill colors.  The star is positioned with its
 center point at coordinates (left, top) with a certain number of `points`.  The
@@ -1909,14 +1914,14 @@ Set the active line color for this slot.  The `pattern` may be a color, a
 gradient or an image, all of which are categorized as "patterns."  The line
 color is then used to draw the borders of any subsequent shape.
 
-So, to draw an arrow with a red line around it:
+So, to draw a star with a red line around it:
 
 {{{
  #!ruby
- # Not yet available
  Shoes.app do
    stroke red
-   arrow 0, 100, 10
+   nofill
+   star 100, 100
  end
 }}}
 
@@ -1933,6 +1938,8 @@ pixels.  Calling `strokewidth(4)` will cause lines to be drawn 4 pixels wide.
 Should transformations (such as `skew` and `rotate`) be performed around the
 center of the shape?  Or the corner of the shape?  Shoes defaults to `:corner`.
 
+'''Note:''' Green Shoes doesn't support `transform` method.
+
 === translate(left, top) » self ===
 
 Moves the starting point of the drawing pen for this slot.  Normally, the pen
@@ -1941,14 +1948,16 @@ point.  With `translate`, if the starting point is moved to (10, 20) and a
 shape is drawn at (50, 60), then the shape is actually drawn at (60, 80) on the
 slot.
 
+'''Note:''' Green Shoes doesn't support `translate` method.
+
 == Element Creation ==
 
-Shoes has a wide variety of elements, many cherry-picked from HTML.  This page
+Green Shoes has a wide variety of elements, many cherry-picked from HTML.  This page
 describes how to create these elements in a slot.  See the Elements section of
 the manual for more on how to modify and use these elements after they have
 been placed.
 
-=== animate(fps) { |frame| ... } » Shoes::Animation ===
+=== animate(fps) { |frame| ... } » Shoes::Anim ===
 
 Starts an animation timer, which runs parallel to the rest of the app.  The
 `fps` is a number, the frames per seconds.  This number dictates how many times
@@ -1960,9 +1969,9 @@ tells the block how many frames of the animation have been shown.
 {{{
  #!ruby
  Shoes.app do
-   @counter = para "STARTING"
-   animate(24) do |frame|
-     @counter.replace "FRAME #{frame}"
+   counter = para "STARTING"
+   animate 24 do |frame|
+     counter.replace "FRAME #{frame}"
    end
  end
 }}}
@@ -1978,13 +1987,13 @@ background.  Gradients stretch to fill the background.
 
 '''PLEASE NOTE:''' Backgrounds are actual elements, not styles.  HTML treats
 backgrounds like styles.  Which means every box can only have one background.
-Shoes layers background elements.
+Green Shoes layers background elements.
 
 {{{
  #!ruby
  Shoes.app do
    background black
-   background white, :width => 50
+   background white, width: 50
  end
 }}}
 
@@ -1994,7 +2003,7 @@ along the left side.
 
 === banner(text) » Shoes::Banner ===
 
-Creates a Banner text block.  Shoes automatically styles this text to 48 pixels high.
+Creates a Banner text block.  Green Shoes automatically styles this text to 48 pixels high.
 
 === border(text, :strokewidth => a number) » Shoes::Border ===
 
@@ -2004,7 +2013,7 @@ Gradients stretch to fill the border.
 
 '''PLEASE NOTE:''' Like Backgrounds, Borders are actual elements, not styles.
 HTML treats backgrounds and borders like styles.  Which means every box can
-only have one borders.  Shoes layers border and background elements, along with
+only have one borders.  Green Shoes layers border and background elements, along with
 text blocks, images, and everything else.
 
 === button(text) { ... } » Shoes::Button ===
@@ -2014,17 +2023,17 @@ optional block can be attached, which is called if the button is pressed.
 
 === caption(text) » Shoes::Caption ===
 
-Creates a Caption text block.  Shoes styles this text to 14 pixels high.
+Creates a Caption text block.  Green Shoes styles this text to 14 pixels high.
 
 === check() » Shoes::Check ===
 
 Adds a check box.
 
-=== code(text) » Shoes::Code ===
+=== code(text) » String ===
 
 Create a Code text fragment.  This text defaults to a monospaced font.
 
-=== del(text) » Shoes::Del ===
+=== del(text) » String ===
 
 Creates a Del text fragment (short for "deleted") which defaults to text with a
 single strikethrough in its middle.
@@ -2034,6 +2043,8 @@ single strikethrough in its middle.
 Opens a new app window (just like the [[Element.window]] method does,) but the
 window is given a dialog box look.
 
+'''Note:''' Green Shoes doesn't support `dialog` method.
+
 === edit_box(text) » Shoes::EditBox ===
 
 Adds a large, multi-line textarea to this slot.  The `text` is optional and
@@ -2045,7 +2056,7 @@ attached here which is called any type the user changes the text in the box.
  Shoes.app do
    edit_box
    edit_box text: "HORRAY EDIT ME"
-   edit_box text: "small one", :width => 100, :height => 160
+   edit_box text: "small one", width: 100, height: 160
  end
 }}}
 
@@ -2055,21 +2066,21 @@ Adds a single-line text box to this slot.  The `text` is optional and should be
 a string that will start out the box.  An optional block can be attached here
 which is called any type the user changes the text in the box.
 
-=== em(text) » Shoes::Em ===
+=== em(text) » String ===
 
 Creates an Em text fragment (short for "emphasized") which, by default, is
 styled with italics.
 
-=== every(seconds) { |count| ... } » Shoes::Every ===
+=== every(seconds) { |count| ... } » Shoes::Anim ===
 
-A timer similar to the `animation` method, but much slower.  This timer fires a
+A timer similar to the `animate` method, but much slower.  This timer fires a
 given number of seconds, running the block attached.  So, for example, if you
 need to check a web site every five minutes, you'd call `every(300)` with a
 block containing the code to actually ping the web site.
 
 === flow(styles) { ... } » Shoes::Flow ===
 
-A flow is an invisible box (or "slot") in which you place Shoes elements.  Both
+A flow is an invisible box (or "slot") in which you place Green Shoes elements.  Both
 flows and stacks are explained in great detail on the main [[Slots]] page.
 
 Flows organize elements horizontally.  Where one would use a [[Element.stack]]
@@ -2088,6 +2099,8 @@ personal Shoes directory.  Remote images are loaded in the background; as with
 browsers, the images will not appear right away, but will be shown when they
 are loaded.
 
+'''Note:''' Green Shoes doesn't support the above personal Shoes directory.
+
 === imagesize(path) » [width, height] ===
 
 Quickly grab the width and height of an image.  The image won't be loaded into
@@ -2096,18 +2109,18 @@ the cache or displayed.
 URGENT NOTE: This method cannot be used with remote images (loaded from HTTP,
 rather than the hard drive.)
 
-=== ins(text) » Shoes::Ins ===
+=== ins(text) » String ===
 
-Creates an Ins text fragment (short for "inserted") which Shoes styles with a
+Creates an Ins text fragment (short for "inserted") which Green Shoes styles with a
 single underline.
 
 === inscription(text) » Shoes::Inscription ===
 
-Creates an Inscription text block.  Shoes styles this text at 10 pixels high.
+Creates an Inscription text block.  Green Shoes styles this text at 10 pixels high.
 
 === link(text, :click => proc or string) » Shoes::Link ===
 
-Creates a Link text block, which Shoes styles with a single underline and
+Creates a Link text block, which Green Shoes styles with a single underline and
 colors with a #06E (blue) colored stroke.
 
 The default LinkHover style is also single-underlined with a #039 (dark blue) stroke.
@@ -2121,9 +2134,12 @@ box becomes selected by the user.
 {{{
  #!ruby
  Shoes.app do
-   stack :margin => 10 do
+   stack  margin: 10 do
      para "Pick a card:"
-     list_box :items => ["Jack", "Ace", "Joker"]
+     list_box items: ["Jack", "Ace", "Joker"] do |item|
+       @p.text = "#{item} was picked!"
+     end
+     @p = para
    end
  end
 }}}
@@ -2137,7 +2153,7 @@ Adds a progress bar.
 
 === para(text) » Shoes::Para ===
 
-Create a Para text block (short for "paragraph") which Shoes styles at 12
+Create a Para text block (short for "paragraph") which Green Shoes styles at 12
 pixels high.
 
 === radio(group name: a string or symbol) » Shoes::Radio ===
@@ -2151,6 +2167,8 @@ any other radio buttons in the same slot.)
 
 Creates a Span text fragment, unstyled by default.
 
+'''Note:''' Green Shoes doesn't support `span` method.
+
 === stack(styles) { ... } » Shoes::Stack ===
 
 Creates a new stack.  A stack is a type of slot.  (See the main [[Slots]] page
@@ -2160,29 +2178,29 @@ In short, stacks are an invisible box (a "slot") for placing stuff.  As you add
 things to the stack, such as buttons or images, those things pile up
 vertically.  Yes, they stack up!
 
-=== strong(text) » Shoes::Strong ===
+=== strong(text) » String ===
 
 Creates a Strong text fragment, styled in bold by default.
 
-=== sub(text) » Shoes::Sub ===
+=== sub(text) » String ===
 
 Creates a Sub text fragment (short for "subscript") which defaults to lowering
 the text by 10 pixels and styling it in an x-small font.
 
-=== subtitle(text) » Shoes::Subtitle ===
+=== subtitle(text) » String ===
 
-Creates a Subtitle text block.  Shoes styles this text to 26 pixels high.
+Creates a Subtitle text block.  Green Shoes styles this text to 26 pixels high.
 
-=== sup(text) » Shoes::Sup ===
+=== sup(text) » String ===
 
 Creates a Sup text fragment (short for "superscript") which defaults to raising
 the text by 10 pixels and styling it in an x-small font.
 
 === tagline(text) » Shoes::Tagline ===
 
-Creates a Tagline text block.  Shoes styles this text to 18 pixels high.
+Creates a Tagline text block.  Green Shoes styles this text to 18 pixels high.
 
-=== timer(seconds) { ... } » Shoes::Timer ===
+=== timer(seconds) { ... } » Fixnum ===
 
 A one-shot timer.  If you want to schedule to run some code in a few seconds
 (or minutes, hours) you can attach the code as a block here.
@@ -2192,20 +2210,22 @@ To display an alert box five seconds from now:
 {{{
  #!ruby
  Shoes.app do
-   timer(5) do
-     alert("Your five seconds are up.")
+   timer 5 do
+     alert "Your five seconds are up."
    end
  end
 }}}
 
 === title(text) » Shoes::Title ===
 
-Creates a Title text block.  Shoes styles these elements to 34 pixels high.
+Creates a Title text block.  Green Shoes styles these elements to 34 pixels high.
 
 === video(path or url) » Shoes::Video ===
 
 Embeds a movie in this slot.
 
+'''Note:''' Green Shoes doesn't support `video` method.
+
 === window(styles) { ... } » Shoes::App ===
 
 Opens a new app window.  This method is almost identical to the
@@ -2218,11 +2238,10 @@ window.  This way the child window can call the parent.
 
 {{{
  #!ruby
- # Not yet available
- Shoes.app :title => "The Owner" do
+ Shoes.app title: "The Owner" do
    button "Pop up?" do
      window do
-       para "Okay, popped up from #{owner}"
+       para "Okay, popped up from [#{owner}]."
      end
    end
  end
@@ -2235,7 +2254,7 @@ to a slot whenever a mouse moves inside the slot.  Or whenever a key is
 pressed.  Even when the slot is created or destroyed.  You can attach a block
 to each of these events.
 
-Mouse events include `motion`, `click`, `hover` and `leave`.  Keyboard typing
+Mouse events include `motion`, `click`, `release`, `hover` and `leave`.  Keyboard typing
 is represented by the `keypress` event.  And the `start` and `finish` events
 indicate when a canvas comes into play or is discarded.
 
@@ -2246,16 +2265,15 @@ away.
 
 {{{
  #!ruby
- # Not yet available
  Shoes.app do
-   s = stack :width => 200, :height => 200 do
+   s = stack width: 200, height: 200 do
      background red
-     hover do
+   end
+   s.hover do
        s.clear { background blue }
-     end
-     leave do
-       s.clear { background red }
-     end
+   end
+   s.leave do
+     s.clear { background red }
    end
  end
 }}}
@@ -2273,6 +2291,8 @@ To catch the moment when the mouse is unclicked, see the [[Events.release]] even
 When a slot is removed, it's finish event occurs.  The finish block is
 immediately handed `self`, the slot object which has been removed.
 
+'''Note:''' Green Shoes doesn't support `finish` method.
+
 === hover { |self| ... } » self ===
 
 The hover event happens when the mouse enters the slot.  The block gets `self`,
@@ -2284,45 +2304,31 @@ To catch the mouse exiting the slot, check out the [[Events.leave]] event.
 
 Whenever a key (or combination of keys) is pressed, the block gets called.  The
 block is sent a `key` which is a string representing the character (such as the
-letter or number) on the key.  For special keys and key combos, a Ruby symbol
-is sent, rather than a string.
+letter or number) on the key. 
 
-So, for example, if `Shift-a` is pressed, the block will get the string `"A"`.
+So, for example, if `Shift-a` is pressed, the block will get the string `"Shift_L"` and `"A"`.
 
-However, if the F1 key is pressed, the `:f1` symbol is received.  For
-`Shift-F1`, the symbol would be `:shift_f1`.
+And if the `F1` key is pressed, the `"F1"` string is received. 
 
-The modifier keys are `control`, `shift` and `alt`.  They appear in that order.
-If `Shift-Control-Alt-PgUp` is pressed, the symbol will be
-`:control_shift_alt_page_up`.
+The left side modifier keys are `"Control_L"`, `"Shift_L"` and `"Alt_L"`.  They appear in that order.
+If `Shift-Control-Alt-PgUp` is pressed, the strings will be
+`"Shift_L"`, `"Control_L"`, `"Alt_L"` and `"Page_Up"`.
 
-One thing about the shift key.  You won't see the shift key on most keys.  On
-US keyboards, `Shift-7` is an ampersand.  So you'll get the string `"&"` rather
-than `:shift_5`.  And, if you press `Shift-Alt-7` on such a keyboard, you'll
-get the symbol: `:alt_&`.  You'll only see the shift modifier on the special
-keys listed a few paragraphs down.
+One thing about the shift key.  On
+US keyboards, `Shift-7` is an ampersand.  So you'll get the string `"Shift_L"` and `"ampersand"` rather
+than `"Shift_L"` and `"7"`.  And, if you press `Shift-Alt-7` on such a keyboard, you'll
+get the strings: `"Shift_L"`, `"Alt_L"` and `"ampersand"`.  
 
 {{{
  #!ruby
  Shoes.app do
-   @info = para "NO KEY is PRESSED."
+   info = para "NO KEY is PRESSED."
    keypress do |k|
-     @info.replace "#{k.inspect} was PRESSED."
+     info.replace "#{k.inspect} was PRESSED."
    end
  end
 }}}
 
-Keep in mind that Shoes itself uses a few hotkeys.  Alt-Period (`:alt_.`),
-Alt-Question (`:alt_?`) and Alt-Slash (`:alt_/`) are reserved for Shoes.
-
-The list of special keys is as follows: `:escape`, `:delete`, `:backspace`,
-`:tab`, `:page_up`, `:page_down`, `:home`, `:end`, `:left`, `:up`, `:right`,
-`:down`, `:f1`, `:f2`, `:f3`, `:f4`, `:f5`, `:f6`, `:f7`, `:f8`, `:f9`, `:f10`,
-`:f11` and `:f12`.
-
-One caveat to all of those rules: normally the Return key gives you a string
-`"\n"`.  When pressed with modifier keys, however, you end up with
-`:control_enter`, `:control_alt_enter`, `:shift_alt_enter` and the like.
 
 === leave { |self| ... } » self ===
 
@@ -2339,13 +2345,13 @@ The block is handed the cursor's `left` and `top` coordinates.
 
 {{{
  #!ruby
- Shoes.app :width => 200, :height => 200 do
+ Shoes.app width: 200, height: 200 do
    background black
    fill white
-   @circ = oval 0, 0, 100, 100
+   circ = oval 0, 0, 100, 100
  
    motion do |top, left|
-     @circ.move top - 50, left - 50
+     circ.move top - 50, left - 50
    end
  end
 }}}
@@ -2364,6 +2370,8 @@ To catch the actual mouse click, use the [[Events.click]] event.
 The first time the slot is drawn, the start event fires.  The block is handed
 `self`, the slot object which has just been drawn.
 
+'''Note:''' Green Shoes doesn't support `start` method.
+
 == Manipulation Blocks ==
 
 The manipulation methods below make quick work of shifting around slots and
@@ -2375,7 +2383,6 @@ Adds elements to the end of a slot.
 
 {{{
  #!ruby
- # Not yet available
  Shoes.app do
    @slot = stack { para 'Good Morning' }
    timer 3 do
@@ -2429,7 +2436,6 @@ Adds elements to the beginning of a slot.
 
 {{{
  #!ruby
- # Not yet available
  Shoes.app do
    @slot = stack { para 'Good Morning' }
    timer 3 do
@@ -2449,7 +2455,10 @@ To set the width of a stack to 150 pixels:
 {{{
  #!ruby
  Shoes.app do
-   stack(:width => 150) { para "Now that's precision." }
+   stack width: 150 do
+     background yellow
+     para "Now that's precision." 
+   end
  end
 }}}
 
@@ -2469,6 +2478,8 @@ The `left` and `top` numbers sent to `displace` are added to the slot's own
 top-left coordinates.  To subtract from the top-left coordinate, use negative
 numbers.
 
+'''Note:''' Green Shoes doesn't support `displace` method.
+
 === gutter() » a number ===
 
 The size of the scrollbar area.  When Shoes needs to show a scrollbar, the
@@ -2488,6 +2499,8 @@ This is commonly used to pad elements on the right, like so:
  end
 }}}
 
+'''Note:''' Green Shoes doesn't support `gutter` method.
+
 === height() » a number ===
 
 The vertical size of the viewable slot in pixels.  So, if this is a scrolling
@@ -2497,6 +2510,8 @@ slot, you'll need to use `scroll_height()` to get the full size of the slot.
 
 Hides the slot, so that it can't be seen.  See also [[Position.show]] and [[Position.toggle]].
 
+'''Note:''' Green Shoes doesn't support `hide` method.
+
 === left() » a number ===
 
 The left pixel location of the slot.  Also known as the x-axis coordinate.
@@ -2506,20 +2521,28 @@ The left pixel location of the slot.  Also known as the x-axis coordinate.
 Moves the slot to specific coordinates, the (left, top) being the upper left
 hand corner of the slot.
 
+'''Note:''' Green Shoes doesn't support `gutter` method.
+
 === remove() » self ===
 
 Removes the slot. It will no longer be displayed and will not be listed in its
 parent's contents. It's gone.
 
+'''Note:''' Green Shoes doesn't support `remove` method. Use `clear` method.
+
 === scroll() » true or false ===
 
 Is this slot allowed to show a scrollbar? True or false. The scrollbar will
 only appear if the height of the slot is also fixed.
 
+'''Note:''' Green Shoes doesn't support `scroll` method.
+
 === scroll_height() » a number ===
 
 The vertical size of the full slot, including any of it which is hidden by scrolling.
 
+'''Note:''' Green Shoes doesn't support `scroll_height` method.
+
 === scroll_max() » a number ===
 
 The top coordinate which this slot can be scrolled down to.  The top coordinate
@@ -2531,21 +2554,29 @@ This is basically a shortcut for writing `slot.scroll_height - slot.height`.
 
 To scroll to the bottom of a slot, use `slot.scroll_top = slot.scroll_max`.
 
+'''Note:''' Green Shoes doesn't support `scroll_max` method.
+
 === scroll_top() » a number ===
 
 The top coordinate which this slot is scrolled down to.  So, if the slot is
 scrolled down twenty pixels, this method will return `20`.
 
+'''Note:''' Green Shoes doesn't support `scroll_top` method.
+
 === scroll_top = a number ===
 
 Scrolls the slot to a certain coordinate.  This must be between zero and
 `scroll_max`.
 
+'''Note:''' Green Shoes doesn't support `scroll_top=` method.
+
 === show() » self ===
 
 Reveals the slot, if it is hidden.  See also [[Position.hide]] and
 [[Position.toggle]].
 
+'''Note:''' Green Shoes doesn't support `show` method.
+
 === style() » styles ===
 
 Calling the `style` method with no arguments returns a hash of the styles
@@ -2557,14 +2588,15 @@ originally requested.
 
 {{{
  #!ruby
- # Not yet available
  Shoes.app do
-   @s = stack :width => "100%"
-   para @s.style[:width]
+   s = stack width: 1.0
+   para s.style[:width]
+   button('Then..'){s.append{para s.style[:width]}}
  end
 }}}
 
-In this example, the paragraph under the stack will display the string "100%".
+In this example, the paragraph under the stack will display "1.0". 
+After click the button, will show you "600" pixels.
 
 === style(styles) » styles ===
 
@@ -2574,10 +2606,9 @@ example, there is a `width` method, thus there is also a `width` style.
 
 {{{
  #!ruby
- # Not yet available
  Shoes.app do
-   @s = stack { background green }
-   @s.style(:width => 400, :height => 200)
+   s = stack { background green }
+   s.style width: 400, height: 200
  end
 }}}
 
@@ -2585,6 +2616,8 @@ example, there is a `width` method, thus there is also a `width` style.
 
 Hides the slot, if it is shown.  Or shows the slot, if it is hidden.
 
+'''Note:''' Green Shoes doesn't support `toggle` method.
+
 === top() » a number ===
 
 The top pixel location of the slot.  Also known as the y-axis coordinate.
@@ -2601,8 +2634,7 @@ element.
 
 On any element, you may call the `parent` method to get the slot directly above
 it. And on slots, you can call the `contents` method to get all of the
-children. (Some elements, such as text blocks, also have a `contents` method
-for getting their children.)
+children. (Some elements, such as shapes, are not included in any slots.)
 
 === contents() » an array of elements ===
 
@@ -2612,6 +2644,18 @@ Lists all elements in a slot.
 
 Gets the object for this element's container.
 
+{{{
+ Shoes.app do
+   s = stack do
+     para 'Green'
+     @p = para 'Shoes'
+   end
+   para s
+   para s.contents
+   para @p.parent
+ end
+}}}
+
 = Elements =
 
 Ah, here's the stuff of Shoes. An element can be as simple as an oval shape. Or

metadata

@@ -4,9 +4,9 @@ version: !ruby/object:Gem::Version
   prerelease: false
   segments: 
   - 0
-  - 164
+  - 171
   - 0
-  version: 0.164.0
+  version: 0.171.0
 platform: ruby
 authors: 
 - ashbb
@@ -14,7 +14,7 @@ autorequire:
 bindir: bin
 cert_chain: []
 
-date: 2011-02-19 00:00:00 +09:00
+date: 2011-02-26 00:00:00 +09:00
 default_executable: 
 dependencies: 
 - !ruby/object:Gem::Dependency 
@@ -67,6 +67,7 @@ files:
 - lib/shoes/projector.rb
 - lib/shoes/ruby.rb
 - lib/shoes/slot.rb
+- lib/shoes/style.rb
 - lib/shoes/text.rb
 - lib/shoes/url.rb
 - lib/shoes/widget.rb
@@ -178,6 +179,7 @@ files:
 - samples/sample46.rb
 - samples/sample47.rb
 - samples/sample48.rb
+- samples/sample49.rb
 - samples/sample5.rb
 - samples/sample6.rb
 - samples/sample7.rb
@@ -233,6 +235,7 @@ files:
 - snapshots/sample46.png
 - snapshots/sample47.png
 - snapshots/sample48.png
+- snapshots/sample49.png
 - snapshots/sample5.png
 - snapshots/sample6.png
 - snapshots/sample7.png