green_shoes 0.131.0 → 0.138.0

data/samples/sample1.rb

@@ -0,0 +1,32 @@
+require '../lib/green_shoes'
+
+xspeed, yspeed = 10, 6
+xdir, ydir = 1, 1
+
+Shoes.app width: 300, height: 300 do
+  a = nil
+  p = para 'Hello', ' World!', top: 30
+  button('pause'){a.pause}
+  button('stop'){a.stop}
+  button('move'){p.move 200, 30}
+  button('remove'){p.clear}
+  img = image '../static/gshoes-icon.png'
+  img.click{alert "You're soooo quick!"}
+
+  x, y = 150, 150
+  size = [128, 128]
+  pause = 0
+
+  a = animate(24, false) do |n|
+    unless pause == n
+      x += xspeed * xdir
+      y += yspeed * ydir
+
+      xdir *= -1 if x > 300 - size[0] or x < 0
+      ydir *= -1 if y > 300 - size[1] or y < 0
+
+      img.move x.to_i, y.to_i
+    end
+    pause = n
+  end
+end

data/samples/sample10.rb

@@ -0,0 +1,10 @@
+require '../lib/green_shoes'
+
+Shoes.app width: 300, height: 300 do
+  flow do
+    10.times do |i|
+      flow(width: 0.5, height: 30){background forestgreen.push(0.1*(i+1)); para 'green'}
+      flow(width: 0.5, height: 30){background orangered.push(1.0 - 0.1*i); para 'shoes'}
+    end
+  end
+end

data/samples/sample11.rb

@@ -0,0 +1,12 @@
+# Same snippet as http://shoes.heroku.com/manual/Events.html#motion{|left,top|...}
+
+require '../lib/green_shoes'
+
+Shoes.app width: 200, height: 200 do
+  background black
+  fill white
+  @circ = oval 0, 0, 100, 100
+  motion do |top, left|
+    @circ.move top - 50, left - 50
+  end
+end

data/samples/sample12.rb

@@ -0,0 +1,21 @@
+require '../lib/green_shoes'
+
+Shoes.app width: 300, height: 300 do
+  background cadetblue
+  r = rect 100, 10, 100, fill: red, strokewidth: 5, curve: 10, stroke: pink
+  r.click{alert 'Yay!'}
+  o = oval 100, 110, 100, 100, fill: green, strokewidth: 10, stroke: white
+  para 'Green Shoes!!', left: 100, top: 70
+
+  size = COLORS.keys.size
+  j = 0
+  a = animate 1 do |i|
+    unless j == i
+      r.style fill: send(COLORS.keys[rand size]), stroke: send(COLORS.keys[rand size])
+      o.style fill: send(COLORS.keys[rand size]), stroke: send(COLORS.keys[rand size])
+      j = i
+    end
+  end
+
+  button('pause'){a.pause}
+end

data/samples/sample13.rb

@@ -0,0 +1,17 @@
+require '../lib/green_shoes'
+
+# The same as sample60.rb on Shoes Tutorial Note
+Shoes.app :width => 300, :height => 300 do
+  i = 45
+  button 'new'do
+    i += 5
+    box = rand(2) == 0 ? rect(i, i, 20) : oval(i, i, 10)
+    box.style :fill => send(COLORS.keys[rand(COLORS.keys.size)])
+
+    @flag = false
+    box.click{@flag = true; @box = box}
+    box.release{@flag = false}
+    motion{|left, top| @box.move(left-10, top-10) if @flag}
+  end
+
+end

data/samples/sample14-1.rb

@@ -0,0 +1,38 @@
+require '../lib/green_shoes'
+
+Shoes.app width: 520, height: 520 do
+  def mk_ovals degree, color, size, mx, my, n, n1, n2, n3
+    ret = []
+    n.times do |i|
+      current_size = n1 + size
+      d = (i * n2 - degree) * Math::PI / 180
+      rx = Math::cos(d) * n3
+      ry = Math::sin(d) * n3
+      left = -current_size/2 + rx + mx
+      top = -current_size/2 + ry + my
+      ret << oval(left, top, current_size, current_size, fill: color).hide
+    end
+    ret
+  end
+
+  degree, color, size = 0, 0.1, 0
+  mx = my = 520 / 2
+  blue_ovals, red_ovals = [], []
+  
+  nostroke
+  background pink
+  
+  150.times do |j|
+    degree += 1
+    color += 0.002
+    size += 1
+    red_ovals << mk_ovals(-degree, red.push(color), size, mx, my, 6, 100, 60, 100)
+    blue_ovals << mk_ovals(degree, blue.push(color), size, mx, my, 12, 50, 30, 150)
+  end
+
+  animate 24 do |i|
+    i %= 150
+    red_ovals[i-1].each &:hide; red_ovals[i].each &:show
+    blue_ovals[i-1].each &:hide; blue_ovals[i].each &:show
+  end
+end

data/samples/sample14.rb

@@ -0,0 +1,64 @@
+# This is from http://github.com/shoes/shoes-contrib/blob/master/animation/flowers.rb
+# Edited a little for Green Shoes by ashbb
+#
+###############################################
+#
+# This is from juixe "Running with Shoes - 2D Examples" 
+# http://juixe.com/techknow/index.php/2007/10/19/running-with-shoes-2d-examples/ 
+#
+# This is an animation of two concentric sets of circles moving in different
+# directions. As the circles move they change size and color. 
+#
+
+require '../lib/green_shoes'
+
+degree = 0
+color = 0
+size = 0
+
+Shoes.app :width => 537, :height => 500 do
+  # Convert degrees to radians
+  def to_radians(deg)
+    deg * Math::PI / 180
+  end
+
+  mx, my = (500/2).to_i, (537/2).to_i
+  animate(2) do
+    clear do
+      # Manage color
+      nostroke
+      #background rgb(1.0, 0.5, 1.0, 1.0)
+      # Update some variables
+      degree += 1
+      size += 1
+      degree = 0 if(degree >= 360)
+      size = 0 if(size >= 100)
+      color = 0.0 if(color >= 1.0)
+      color += 0.05 if(degree % 10 == 0)
+
+      # Draw inner circle
+      fill red.push(color)
+      10.times do |i|
+        current_size = 100 + size
+        d = to_radians(i * 60 + degree)
+        rx = Math::cos(d) * 100
+        ry = Math::sin(d) * 100
+        center_x = -current_size/2 + rx + mx
+        center_y = -current_size/2 + ry + my
+        oval center_x, center_y, current_size, current_size
+      end
+
+      # Draw outer circle
+      fill blue.push(color)
+      20.times do |i|
+        current_size = 50 + size
+        d = to_radians(i * 30 - degree)
+        rx = Math::cos(d) * 150
+        ry = Math::sin(d) * 150
+        center_x = -current_size/2 + rx + mx
+        center_y = -current_size/2 + ry + my
+        oval center_x, center_y, current_size, current_size
+      end
+    end
+  end
+end

data/samples/sample15.rb

@@ -0,0 +1,17 @@
+require '../lib/green_shoes'
+
+TEXT =<<EOS
+    Lorem ipsum dolor sit amet, consectetur adipisicing elit, \
+sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
+
+    Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris \
+nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in \
+reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. 
+
+    Excepteur sint occaecat cupidatat non proident, sunt in \
+culpa qui officia deserunt mollit anim id est laborum.
+EOS
+
+Shoes.app do
+  para TEXT
+end

data/samples/sample16.rb

@@ -0,0 +1,12 @@
+# Same snippet as http://shoes-tutorial-note.heroku.com/html/00402_No.1_para.html
+
+require '../lib/green_shoes'
+
+Shoes.app :width => 240, :height => 95 do
+  para 'Testing, test, test. ',
+    strong('Breadsticks. '),
+    em('Breadsticks. '),
+    code('Breadsticks. '),
+    strong(ins('EVEN BETTER.')),
+    sub('fine!')
+end

data/samples/sample17.rb

@@ -0,0 +1,12 @@
+# Add new method bg and fg to sample17
+
+require '../lib/green_shoes'
+
+Shoes.app :width => 240, :height => 95 do
+  para 'Testing, test, test. ',
+    strong('Breadsticks. '),
+    em('Breadsticks. '),
+    code('Breadsticks. '),
+    bg(fg(strong(ins('EVEN BETTER.')), white), rgb(255, 0, 192)),
+    sub('fine!')
+end

data/samples/sample18.rb

@@ -0,0 +1,23 @@
+require "../lib/green_shoes"
+
+Shoes.app width: 700, height: 600 do
+  title "Shoes is a ", link("tiny"){alert "Cool!"}, " graphics toolkit. "
+
+  flow width: 0.4 do
+    img = image '../static/gshoes-icon.png'
+    img.click{alert "You're soooo quick!"}
+  end
+
+  flow width: 0.6 do
+    tagline "It's simple and straightforward. ", 
+      link("Shoes "){alert "Yay!"}, 
+      "was born to be easy! ", 
+      link("Shoes "){alert "Yay!"}, 
+      "was born to be easy! ", 
+      link("Shoes "){alert "Yay!"}, 
+      "was born to be easy! ", 
+      "Really, it was made for absolute beginners. "
+  end
+
+  subtitle link(strong em("There's ", fg(bg("really ", "really ", yellow), red), "nothing to it. ")){alert "Have fun!"}
+end

data/samples/sample19.rb

@@ -0,0 +1,39 @@
+# almost the same code as sample58 on (Red) Shoes Tutorial Note: 
+# http://shoes-tutorial-note.heroku.com/html/00704_Assignment_4_Pong_in_Shoes.html
+require '../lib/green_shoes'
+
+Shoes.app :width => 400, :height => 400, :resizable => false do
+  vx, vy = 3, 4
+
+  nostroke
+  @ball = oval 0, 0, 20, 20, :fill => forestgreen
+  @comp = rect 0, 0, 75, 4, :curve => 2
+  @you = rect 0, 396, 75, 4, :curve => 2
+
+  @anim = animate 32 do
+    nx, ny = @ball.left + vx.to_i, @ball.top + vy.to_i
+
+    if @ball.top + 20 < 0 or @ball.top > 400
+      para "<span font_desc='32'>", strong('GAME OVER'), "</span>\n",
+        @ball.top < 0 ? "You win!" : "Computer wins", :top => 140, :align => 'center'
+      @ball.clear and @anim.stop
+    end
+
+    vx = -vx  if nx + 20 > 400 or nx < 0
+
+    if ny + 20 > 400 and nx + 20 > @you.left and nx < @you.left + 75
+      vy = -vy * 1.2
+      vx = (nx - @you.left - (75 / 2)) * 0.25
+    end
+
+    if ny < 0 and nx + 20 > @comp.left and nx < @comp.left + 75
+      vy = -vy * 1.2
+      vx = (nx - @comp.left - (75 / 2)) * 0.25
+    end
+
+    @ball.move nx, ny
+    @you.left = mouse[1] - (75 / 2)
+    @comp.left += 10  if @comp.left + 75 < @ball.left
+    @comp.left -= 10  if @ball.left + 20 < @comp.left
+  end
+end

data/samples/sample2.rb

@@ -0,0 +1,13 @@
+require '../lib/green_shoes'
+
+Shoes.app title: 'Green Shoes New Logo Icon!', width: 300, height: 420 do
+  stack do
+    image '../static/gshoes-icon.png'
+    flow do
+      image '../static/gshoes-icon.png'
+      image '../static/gshoes-icon.png'
+    end
+    image '../static/gshoes-icon.png'
+    para ' ' * 30, 'Created by Zak'
+  end
+end

data/samples/sample20.rb

@@ -0,0 +1,26 @@
+# This is a tiny flip book (aka Para-Para Manga in Japanese)
+# original is http://www.paraman.net/play/preview/1258
+# 
+require '../lib/green_shoes'
+
+Shoes.app title: 'potacho', width: 175, height: 160 do
+  background tan
+  
+  @imgs = []
+  1.upto 60 do |i|
+    @imgs << image("./potato_chopping/1258_s#{"%03d" % i}.gif").hide.move(10, 10)
+  end
+
+  @imgs.first.show
+  
+  def potacho
+    @imgs[59].hide
+    a = animate 12 do |i|
+      @imgs[i].show
+      @imgs[i-1].hide if i > 0
+      a.stop if i > 58
+    end
+  end
+  
+  button('  start  '){potacho}.move 10, 130
+end

data/samples/sample21.rb

@@ -0,0 +1,7 @@
+require '../lib/green_shoes'
+
+Shoes.app width: 300, height: 100 do
+  background forestgreen, curve: 30
+  border gold, strokewidth: 5, curve: 30
+  subtitle fg(strong('Shoes Shoes Shoes'), white), align: 'center'
+end

data/samples/sample22.rb

@@ -0,0 +1,13 @@
+require '../lib/green_shoes'
+
+Shoes.app do
+  background chocolate..black, angle: 130
+  strokewidth 20
+  border deeppink..forestgreen, curve: 30
+  nostroke
+  fill crimson..cyan
+  oval 100, 100, 100, 100, angle: 45
+  nofill
+  strokewidth 50
+  rect 200, 200, 300, 200, stroke: darkblue..ivory, angle: 90
+end

data/samples/sample23.rb

@@ -0,0 +1,10 @@
+require '../lib/green_shoes'
+
+Shoes.app width: 300, height: 300 do
+  fname = '../static/gshoes-icon.png'
+  background yellow..orange, angle: 90
+  border fname, strokewidth: 20, curve: 100
+  fill fname
+  nostroke
+  oval 100, 100, 100, 100
+end

data/samples/sample24.rb

@@ -0,0 +1,21 @@
+require '../lib/green_shoes'
+
+Shoes.app width: 400, height: 400 do
+  background yellow
+  rect 0, 0, 100, 100
+  rect 100, 100, 100, 100
+  rect 200, 200, 100, 100
+  rect 0, 200, 100, 100
+  rect 200, 0, 100, 100
+  stroke '../static/gshoes-icon.png'
+  strokewidth 10
+  line 355, 180, 5, 111, strokewidth: 20
+  stroke red
+  line 0, 0, 100, 0
+  line 0, 100, 0, 0
+  line 300, 200, 200, 200
+  line 100, 200, 200, 100
+  stroke white
+  line 200, 200, 200, 300
+  line 300, 200, 200, 100
+end

data/samples/sample25.rb

@@ -0,0 +1,22 @@
+require '../lib/green_shoes'
+
+Shoes.app width: 305, height: 460 do
+  background lightskyblue
+
+  flow do
+    background green
+    3.times do
+      button 'button', margin: 5
+      edit_line margin_top: 5
+    end
+  end
+
+  image '../static/gshoes-icon.png', margin: 20, margin_left: 80
+  tagline fg(em(strong('A sample for margin style.')), maroon), 
+    margin: [30, 0, 0, 30]
+
+  flow do
+    background gold
+    10.times{button 'button', margin: [10, 5, 0, 5]}
+  end
+end

data/samples/sample26.rb

@@ -0,0 +1,21 @@
+require '../lib/green_shoes'
+
+Shoes.app width: 450, height: 150 do
+  background black
+  strokewidth 4
+
+  paint_lines = proc do
+    20.times do |i|
+      stroke rgb((0.0..0.5).rand, (0.0..1.0).rand, (0.0..0.3).rand)
+      line 0, i * 5, 400, i * 8
+    end
+  end
+
+  s = stack do
+    mask do
+      title strong("<span size='#{82*1024}'>Shoes</span>"), left: 50
+    end
+  end
+
+  animate(5){s.clear{paint_lines.call}}
+end

data/samples/sample27.rb

@@ -0,0 +1,19 @@
+require '../lib/green_shoes'
+
+Shoes.app do
+  button 'go' do
+    p = para 0, top: 30
+    a = every do |i|
+      j = i*20
+      p.text = i.to_s
+      para i.to_s, left: j*2, top: 30
+      oval 100+j, 100+j, 10, 10
+      a.stop if i > 8
+    end
+
+    timer 10 do
+      p.text = 'hello'
+      para 'green shoes', top: 200
+    end
+  end
+end

data/samples/sample28.rb

@@ -0,0 +1,64 @@
+# The Game Snake. Refer to Gallery No.7: http://shoes-tutorial-note.heroku.com/html/01120_Fancy_Gallery_6-10.html
+require '../lib/green_shoes'
+
+Shoes.app :title => 'Snake Game v0.1' do
+  background black
+
+  def game_start
+    @score = para fg('Score:', white)
+    @pos = {:up => [0, -10], :down => [0, 10], :left => [-10, 0], :right => [10, 0]}
+    @rx, @ry = proc{20 + 10*rand(56)}, proc{40 + 10*rand(44)}
+
+    @foods = []
+    stroke lime
+    50.times{@foods << rect(@rx[], @ry[], 10, 10)}
+
+    @bricks = []
+    stroke deepskyblue; fill blue
+    50.times{@bricks << rect(@rx[], @ry[], 10, 10)}
+    20.step(570, 10){|n| @bricks << rect(n, 40, 10, 10) << rect(n, 470, 10, 10)}
+    40.step(470, 10){|n| @bricks << rect(10, n, 10, 10) << rect(570, n, 10, 10)}
+
+    @snake = []
+    stroke white; nofill
+    @snake << rect(300, 100, 10, 10)
+    @snake[0].style stroke: red
+
+    dir = :left
+    @run  = animate 5 do
+      keypress{|k| k = k.downcase.to_sym; dir = k if @pos.keys.include? k}
+      check_food
+      go dir
+      @score.text = fg("Score: #{@snake.length * 10}", white)
+      brick? @snake[0]
+    end
+  end
+
+  def go k
+    x, y = @pos[k]
+    @snake.unshift @snake.pop
+    n = @snake.length > 1 ? 1 : 0
+    @snake[0].move @snake[n].left + x, @snake[n].top + y
+    @snake[0].style stroke: red
+    @snake[1..-1].each{|s| s.style stroke: white}
+  end
+
+  def check_food
+    (@snake << rect(0, 0, 10, 10)) if eat? @snake[0]
+  end
+
+  def eat? s
+    @foods.each_with_index do |f, i|
+      (f.move @rx[], @ry[]; return true) if f.left == s.left and f.top == s.top
+    end
+    return false
+  end
+
+  def brick? s
+    @bricks.each do |b|
+      (@run.stop; alert 'Game Over. ') if b.left == s.left and b.top == s.top      
+    end
+  end
+
+  game_start
+end

data/samples/sample29.rb

@@ -0,0 +1,13 @@
+require '../lib/green_shoes'
+
+Shoes.app do
+  lb = list_box items: COLORS.keys.map(&:to_s), choose: 'red' do |item|
+    @o.style fill: eval(item)
+    @p.text = item
+  end.move(300, 0)
+  @p = para
+  nostroke
+  @o = oval 100, 100, 100, 100
+  i = 0
+  button('print'){para lb.text, top: 20*(i+=1)}.move(500, 0)
+end

data/samples/sample3.rb

@@ -0,0 +1,10 @@
+require '../lib/green_shoes'
+
+Shoes.app width: 300, height: 400 do
+  fill rgb(0, 0.6, 0.9, 0.1)
+  stroke rgb(0, 0.6, 0.9)
+  strokewidth 0.25
+  100.times do
+    oval left: (-30..self.width).rand, top: (-30..self.height).rand, radius: (25..50).rand
+  end
+end

data/samples/sample30.rb

@@ -0,0 +1,30 @@
+# Almost same code as sample22.rb : http://shoes-tutorial-note.heroku.com/html/00508_The_Widget_class.html
+
+require '../lib/green_shoes'
+
+class Answer < Shoes::Widget
+  attr_reader :mark
+  def initialize word
+    flow do
+      flow(width: 70){para word}
+      @mark = image('./loogink.png', width: 20, height: 20).hide
+    end
+  end
+end
+
+Shoes.app width: 200, height: 100 do
+  stack width: 0.5 do
+    background palegreen
+    para '1. apple'
+    ans = answer '2. tomato'
+    para '3. orange'
+    button('Ans.'){ans.mark.toggle}
+  end
+  stack width: 0.5 do
+    background lightsteelblue
+    para '1. cat'
+    para '2. dog'
+    ans = answer '3. bird'
+    button('Ans.'){ans.mark.toggle}
+  end
+end