Class: GuindillaGUI::Guindilla

Inherits:
Object
  • Object
show all
Defined in:
lib/guindilla_gui/guindilla_classes.rb,
lib/guindilla_gui/guindilla_methods.rb

Overview

Normally ‘Guindilla` will be the only class you explicitly instantiate. Other classes are instantiated by methods called inside the `Guindilla` block. Option keys may include `host:` , and/or `port:`

Direct Known Subclasses

Element, Timer

Instance Attribute Summary collapse

Instance Method Summary collapse

Constructor Details

#initialize(options = {}, &block) ⇒ Guindilla

Returns a new instance of Guindilla.



23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
 
# File 'lib/guindilla_gui/guindilla_classes.rb', line 23

def initialize(options={}, &block)
  @@gui = self
  @active_id = 'body'
  @elements = {}
  @blocks = {}
  @inputs = {}
  html_file = File.expand_path File.dirname(__FILE__) + "/resources/guindilla.html"
  options[:host] ? host = options[:host] : host = 'localhost'
  options[:port] ? port = options[:port] : port = 8181

  # initialize socket client #
  Launchy.open(html_file) do |exception|
    puts "Attempted to open #{html_file} and failed because #{exception}"
  end

  # initialize socket server #
  EM.run do
    EM::WebSocket.start(:host => host, :port => port) do |socket|
      @socket = socket

      socket.onopen do |handshake|
        puts "GuindillaGUI WebSocket connection open on: #{host}, port #{port}"
        # make the main box #
        v_box do
          # pass off to user #
          self.instance_eval &block if block
        end
      end

      # handle events #
      socket.onmessage do |msg|
        puts "Recieved message: #{msg}" if options[:verbose] == true
        ##
        # not sure how necessary this is, but think it handles funky closes
        socket.close if msg == "UI closed."

        message = msg.split(":!!:")
        id = message[0]

        if message[1]
          case message[1]
          when "position"
            element = @elements[:"#{id}"]
            message[2].chop!.split(",").each do |pair|
              keyval = pair.split(":")
              element.position[:"#{keyval[0]}"] = keyval[1].to_f
            end
            @blocks[:"#{id}_pos"].call(element.position) if @blocks[:"#{id}_pos"]
          when "input"
            message[2] = "" unless message[2]
            begin
              message[2] = Integer(message[2])
            rescue ArgumentError => e
            end
            @inputs[:"#{id}"].value = message[2]
            @blocks[:"#{id}"].call(message[2]) if @blocks[:"#{id}"]
          when "mousemove"
            xy = message[2].split(',')
            @blocks[:"#{id}_move"].call(xy[0].to_i, xy[1].to_i) if @blocks[:"#{id}_move"]
          end
        else
          @blocks[:"#{id}"].call if @blocks[:"#{id}"]
        end
      end #socket.onmessage

      socket.onclose do
        #send_js(%Q~ window.stop(); process.exit(1); ~) # maybe not necessary
        puts "GuindillaGUI WebSocket connection closed"
        #abort "exiting GuindillaGUI..."
        puts "exiting GuindillaGUI..."
        exit!
      end

    end #EM::WebSocket.run
  end #EM.run
end

Instance Attribute Details

#active_id ⇒ Object

Returns the value of attribute active_id.



21
22
23
 
# File 'lib/guindilla_gui/guindilla_classes.rb', line 21

def active_id
  @active_id
end

#blocks ⇒ Object

Returns the value of attribute blocks.



21
22
23
 
# File 'lib/guindilla_gui/guindilla_classes.rb', line 21

def blocks
  @blocks
end

#elements ⇒ Object

Returns the value of attribute elements.



21
22
23
 
# File 'lib/guindilla_gui/guindilla_classes.rb', line 21

def elements
  @elements
end

#inputs ⇒ Object

Returns the value of attribute inputs.



21
22
23
 
# File 'lib/guindilla_gui/guindilla_classes.rb', line 21

def inputs
  @inputs
end

#socket ⇒ Object

Returns the value of attribute socket.



21
22
23
 
# File 'lib/guindilla_gui/guindilla_classes.rb', line 21

def socket
  @socket
end

Instance Method Details

#after(seconds, &block) ⇒ Object

JavaScript ‘setTimeout` Timer



19
20
21
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 19

def after(seconds, &block)
  Timer.new("timeout", seconds, &block)
end

#alert(message) ⇒ Object 



23
24
25
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 23

def alert(message)
  send_js(%Q~ alert("#{message}") ~)
end

#align(position) ⇒ Object Also known as: align=

Vertical alignment within a box. Position may be ‘’stretch’‘(default), `’center’‘, `’start’‘, `’end’‘, or `’baseline’‘. See ’align-items’: css-tricks.com/snippets/css/a-guide-to-flexbox/



415
416
417
418
419
420
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 415

def align(position)  # vertical
  position = "flex-start" if position == "start"
  position = "flex-end" if position == "end"
  self.style(align_items: "#{position}")
  return self
end

#append(element) ⇒ Object 



27
28
29
30
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 27

def append(element)
  id = caller_id(self)
  send_js(%Q~ $("##{self.id}").append($("##{element.id}")); ~)
end

#attributes ⇒ Object

initialize



100
101
102
 
# File 'lib/guindilla_gui/guindilla_classes.rb', line 100

def attributes  # REVIEW: not sure this is needed (it's only for stand-alone) #
  @@gui.elements[:"#{caller_id(self)}"].attributes
end

#audio_out(attributes = {}) ⇒ Object

attributes may include ‘controls: true`



34
35
36
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 34

def audio_out(attributes={})
  AudioVideo.new("audio", attributes)
end

#background(color_string) ⇒ Object Also known as: background=

‘color_string` may be rgb, rgba, hex, or CSS color



425
426
427
428
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 425

def background(color_string)
  self.style(background: "#{color_string}")
  return self
end

#border(border_string) ⇒ Object Also known as: border=

www.w3schools.com/css/css_border.asp e.g. ‘border(’2px solid blue’)‘



434
435
436
437
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 434

def border(border_string)
  self.style(border: "#{border_string}")
  return self
end

#border_color(color_string) ⇒ Object Also known as: border_color=

‘color_string` may be rgb, rgba, hex, or CSS color



442
443
444
445
446
447
448
449
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 442

def border_color(color_string)
  if self.class.to_s == "GuindillaGUI::Svg"
    self.style(stroke: "#{color_string}")
  else
    self.style(border_color: "#{color_string}")
  end
  return self
end

#border_radius(pixels) ⇒ Object Also known as: border_radius=

www.w3schools.com/cssref/css3_pr_border-radius.asp



454
455
456
457
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 454

def border_radius(pixels)
self.style(border_radius: "#{pixels}")
return self
end

#border_width(width) ⇒ Object Also known as: border_width= 



460
461
462
463
464
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 460

def border_width(width)
  self.style(border_width: "#{width_integer}")
  return self

end

#bullet_list(list_array, attributes = {}) ⇒ Object 



38
39
40
41
42
43
44
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 38

def bullet_list(list_array, attributes={})
  ul = Element.new("ul")
  list_array.each do |li|
    send_js(%Q~ $("##{ul.id}").append($("<li>").html("#{li}")); ~)
  end
  return ul
end

#button(*args, &block) ⇒ Object

‘button(text=“”, attributes={}, &block)`



48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 48

def button(*args, &block)
  args.unshift("") unless args[0].is_a?(String)
  txt = args[0]
  args[1] ? attributes = args[1] : attributes = {}
  btn = Element.new("button", attributes)
  send_js(%Q~ #{btn.id}.innerHTML = "#{txt}"; ~)
  send_js(%Q~
    #{btn.id}.onclick = function(event){
      socket.send("#{btn.id}:!!:");
      event.stopPropagation();
    };
  ~)
  @@gui.blocks[:"#{btn.id}"] = block if block_given?
  return btn
end

#canvas(attributes = {}, &block) ⇒ Object 



64
65
66
67
68
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 64

def canvas(attributes={}, &block)
  attributes[:width] = "50%" unless attributes[:width]
  attributes[:height] = "33%" unless attributes[:height]
  Canvas.new(attributes, &block)
end

#chart(attributes = {}, &block) ⇒ Object

‘chart(type: ’scatter’, title: “”, attributes={}, &block)‘



72
73
74
75
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 72

def chart(attributes={}, &block)
  # OPTIMIZE: use Hash#merge!
  Chart.new(attributes, &block)
end

#checkbox(*args, &block) ⇒ Object

‘checkbox(label=“”, attributes={}, &block |boolean|)`



79
80
81
82
83
84
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 79

def checkbox(*args, &block)
  args.unshift("") unless args[0].is_a?(String)
  label = args[0]
  args[1] ? attributes = args[1] : attributes = {}
  Input.new("checkbox", label, attributes, &block)
end

#circle(radius, attributes = {}) ⇒ Object 



86
87
88
89
90
91
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 86

def circle(radius, attributes={})
  attributes[:cx] = radius
  attributes[:cy] = radius
  attributes[:r] = radius
  Svg.new("circle", attributes)
end

#color(color_string) ⇒ Object Also known as: color=

‘color_string` may be rgb, rgba, hex, or CSS color



469
470
471
472
473
474
475
476
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 469

def color(color_string)
  if self.class.to_s == "GuindillaGUI::Svg"
    self.style(fill: "#{color_string}")
  else
    self.style(color: "#{color_string}")
  end
  return self
end

#color_input(*args, &block) ⇒ Object

‘color_input(label=“”, attributes={}, &block |color|)`



95
96
97
98
99
100
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 95

def color_input(*args, &block)
  args.unshift("") unless args[0].is_a?(String)
  label = args[0]
  args[1] ? attributes = args[1] : attributes = {}
  Input.new("color", label, attributes, &block)
end

#container(attributes = {}, &block) ⇒ Object 



102
103
104
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 102

def container(attributes={}, &block)
  Box.new(nil, attributes, &block)
end

#display(property) ⇒ Object Also known as: display=

CSS display property. www.w3schools.com/CSSref/pr_class_display.asp



482
483
484
485
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 482

def display(property)
  self.style(display: "#{property}")
  return self
end

#every(seconds, &block) ⇒ Object

JavaScript ‘setInterval` Timer



108
109
110
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 108

def every(seconds, &block)
  Timer.new("interval", seconds, &block)
end

#file_input(*args, &block) ⇒ Object

‘file_input(label=“”, attributes={}, &block |file|)`



114
115
116
117
118
119
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 114

def file_input(*args, &block)
  args.unshift("") unless args[0].is_a?(String)
  label = args[0]
  args[1] ? attributes = args[1] : attributes = {}
  Input.new("file", label, attributes, &block)
end

#font(family_string, size_integer) ⇒ Object Also known as: font=

www.w3schools.com/css/css_font.asp



490
491
492
493
494
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 490

def font(family_string, size_integer)
  id = caller_id(self)
  self.style(font_family: "#{family_string}", font_size: "#{size_integer}")
  return self
end

#font_family(family_string) ⇒ Object Also known as: font_family=

www.w3schools.com/Css/css_font.asp



499
500
501
502
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 499

def font_family(family_string)
  self.style(font_family: "#{family_string}")
  return self
end

#font_size(size) ⇒ Object Also known as: font_size=

www.w3schools.com/cssref/pr_font_font-size.asp



507
508
509
510
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 507

def font_size(size)
  self.style(font_size: "#{size}")
  return self
end

#h_box(attributes = {}, &block) ⇒ Object 



121
122
123
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 121

def h_box(attributes={}, &block)
  Box.new("row", attributes, &block)
end

#h_rule(attributes = {}) ⇒ Object 



125
126
127
128
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 125

def h_rule(attributes={})
  attributes[:width] = "100%" unless attributes[:width]
  Element.new("hr", attributes)
end

#heading(*args) ⇒ Object

‘heading(level=1, string, attributes={})`



132
133
134
135
136
137
138
139
140
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 132

def heading(*args)
  args.unshift(1) unless args[0].is_a?(Integer)
  level = args[0]
  string = args[1]
  args[2] ? attributes = args[2] : attributes = {}
  h = Element.new("#{'h' + level.to_s}", attributes)
  send_js(%Q~ #{h.id}.innerHTML = "#{string}"; ~)
  return h
end

#height(h) ⇒ Object Also known as: height=

www.w3schools.com/cssref/pr_dim_height.asp



515
516
517
518
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 515

def height(h)
  self.style(height: "#{h}")
  return self
end

#hide ⇒ Object 



142
143
144
145
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 142

def hide
  id = caller_id(self)
  send_js(%Q~ $("##{id}").hide(); ~)
end

#image(source, attributes = {}) ⇒ Object 



147
148
149
150
151
152
153
154
155
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 147

def image(source, attributes={})
  img = Element.new("img", attributes)
  send_js(%Q~ #{img.id}.src = "#{source}"; ~)
  send_js(%Q~ #{img.id}.onerror = function(){
      #{img.id}.src = "resources/guindilla_gui.png"
    };
  ~)
  return img
end

#justify(position) ⇒ Object Also known as: justify=

Horizontal justification within a box. www.w3schools.com/csSref/css3_pr_justify-content.asp



524
525
526
527
528
529
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 524

def justify(position)
  position = "flex-start" if position == "start"
  position = "flex-end" if position == "end"
  self.style(justify_content: "#{position}")
  return self
end

#line_break ⇒ Object 



157
158
159
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 157

def line_break
  para("")
end

#link(url, attributes = {}) ⇒ Object 



161
162
163
164
165
166
167
168
169
170
171
172
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 161

def link(url, attributes={})
  lnk = Element.new("a", attributes)
  if self.is_a?(GuindillaGUI::Element)
    lnk.append(self)
  else
    attributes[:text] ? txt = attributes[:text] : txt = url
    send_js(%Q~ #{lnk.id}.textContent = "#{txt}"; ~)
  end
  send_js(%Q~ #{lnk.id}.href = "#{url}"; ~)
  send_js(%Q~ #{lnk.id}.target = "_blank"; ~)
  return lnk
end

#margin(size) ⇒ Object Also known as: margin=

margin in pixels, or ‘’auto’‘ to center



534
535
536
537
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 534

def margin(size)
  self.style(margin: "#{size}")
  return self
end

#move_to(x, y) ⇒ Object

set position by x and y pixel coordinates



542
543
544
545
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 542

def move_to(x, y)
  self.style(position: 'absolute') unless self.attributes.has_key?(:position)
  self.style(left: "#{x}px", top: "#{y}px")
end

#number_input(*args, &block) ⇒ Object

‘number_input(label=“”, attributes={}, &block |input|)`



176
177
178
179
180
181
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 176

def number_input(*args, &block)
  args.unshift("") unless args[0].is_a?(String)
  label = args[0]
  args[1] ? attributes = args[1] : attributes = {}
  Input.new("number", label, attributes, &block)
end

#on_click(&block) ⇒ Object 



183
184
185
186
187
188
189
190
191
192
193
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 183

def on_click(&block)
  id = caller_id(self)
  send_js(%Q~
    #{id}.onclick = function(event){
      socket.send("#{id}_click:!!:");
      event.stopPropagation();
    };
  ~)
  @@gui.blocks[:"#{id}_click"] = block if block_given?
  return @@gui.elements[:"#{id}"]
end

#on_hover(&block) ⇒ Object 



195
196
197
198
199
200
201
202
203
204
205
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 195

def on_hover(&block)
  id = caller_id(self)
  send_js(%Q~
    #{id}.onmouseover = function(event){
      socket.send("#{id}_hover:!!:");
      event.stopPropagation();
    };
  ~)
  @@gui.blocks[:"#{id}_hover"] = block if block_given?
  return @@gui.elements[:"#{id}"]
end

#on_leave(&block) ⇒ Object 



207
208
209
210
211
212
213
214
215
216
217
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 207

def on_leave(&block)
  id = caller_id(self)
  send_js(%Q~
    #{id}.onmouseout = function(event){
      socket.send("#{id}_leave:!!:");
      event.stopPropagation();
    };
  ~)
  @@gui.blocks[:"#{id}_leave"] = block if block_given?
  return @@gui.elements[:"#{id}"]
end

#on_mouse_move(&block) ⇒ Object 



219
220
221
222
223
224
225
226
227
228
229
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 219

def on_mouse_move(&block)
  id = caller_id(self)
  send_js(%Q~
    #{id}.onmousemove = function(event){
      socket.send("#{id}:!!:mousemove:!!:" + event.pageX + ',' + event.pageY);
      event.stopPropagation();
    };
  ~)
  @@gui.blocks[:"#{id}_move"] = block if block_given?
  return @@gui.elements[:"#{id}"]
end

#opacity(value) ⇒ Object Also known as: opacity=

0.0 to 1.0



549
550
551
552
553
554
555
556
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 549

def opacity(value)
  if self.class.to_s == "GuindillaGUI::Svg"
    self.style(fill_opacity: "#{value}")
  else
    self.style(opacity: "#{value}")
  end
  return self
end

#ordered_list(list_array, attributes = {}) ⇒ Object 



231
232
233
234
235
236
237
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 231

def ordered_list(list_array, attributes={})
  ol = Element.new("ol")
  list_array.each do |li|
    send_js(%Q~ $("##{ol.id}").append($("<li>").html("#{li}")); ~)
  end
  return ol
end

#padding(size) ⇒ Object Also known as: padding=

padding in pixels



561
562
563
564
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 561

def padding(size)
  self.style(padding: "#{size}")
  return self
end

#para(string, attributes = {}) ⇒ Object 



239
240
241
242
243
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 239

def para(string, attributes={})
  p = Element.new("p", attributes)
  send_js(%Q~ #{p.id}.innerHTML = "#{string}"; ~)
  return p
end

#polygon(points_array, attributes = {}) ⇒ Object

‘polygon` takes a nested array of x, y coordinates, e.g.: `polygon([[2, 0], [0, 3], [3, 3], [2, 0]])`



248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 248

def polygon(points_array, attributes={})
  points = ""
  points_array.each do |arr|
    points += arr.join(",")
    points += " "
  end
  attributes[:points] = points
  width = 0
  height = 0
  points.split(" ").each do |xy|
    pair = xy.split(",")
    width = pair[0].to_i if pair[0].to_i > width
    height = pair[1].to_i if pair[1].to_i > height
  end
  attributes[:width] = width unless attributes[:width]
  attributes[:height] = height unless attributes[:height]
  Svg.new("polygon", attributes)
end

#radio_button(*args, &block) ⇒ Object

‘radio_button(label=“”, attributes={}, &block |boolean|)` attributes may include a group: key to group buttons



270
271
272
273
274
275
276
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 270

def radio_button(*args, &block)
  args.unshift("") unless args[0].is_a?(String)
  label = args[0]
  args[1] ? attributes = args[1] : attributes = {}
  attributes[:group] = "no_group" unless attributes[:group]
  Input.new("radio", label, attributes, &block)
end

#range_slider(*args, &block) ⇒ Object

‘range_slider(label=“”, 0, max: 1.0, step: 0.05, value: 0.5, &block |value|)`



280
281
282
283
284
285
286
287
288
289
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 280

def range_slider(*args, &block)
  args.unshift("") unless args[0].is_a?(String)
  label = args[0]
  args[1] ? attributes = args[1] : attributes = {}
  attributes[:min] = 0 unless attributes[:min]
  attributes[:max] = 1.0 unless attributes[:max]
  attributes[:step] = 0.05 unless attributes[:step]
  attributes[:value] = (attributes[:max] - attributes[:min]) / 2 unless attributes[:value]
  Input.new("range", label, attributes, &block)
end

#rectangle(width_integer, height_integer, attributes = {}) ⇒ Object 



291
292
293
294
295
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 291

def rectangle(width_integer, height_integer, attributes={})
  attributes[:width] = width_integer
  attributes[:height] = height_integer
  Svg.new("rect", attributes)
end

#rotate(degrees) ⇒ Object 



567
568
569
570
571
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 567

def rotate(degrees)
  rotation = self.attributes[:rotate].to_i + degrees
  self.style(rotate: "#{rotation}deg")
  return self
end

#show ⇒ Object 



297
298
299
300
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 297

def show
  id = caller_id(self)
  send_js(%Q~ $("##{id}").show(); ~)
end

#size(width, height) ⇒ Object Also known as: size= 



573
574
575
576
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 573

def size(width, height)
  self.style(width: "#{width}", height: "#{height}")
  return self
end

#source(path_string) ⇒ Object Also known as: source= 



302
303
304
305
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 302

def source(path_string)
  id = caller_id(self)
  send_js(%Q~ #{id}.src = "#{path_string}"; ~)
end

#square(size_integer, attributes = {}) ⇒ Object 



308
309
310
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 308

def square(size_integer, attributes={})
  rectangle(size_integer, size_integer, attributes)
end

#style(hash) ⇒ Object Also known as: style=

—————————————————————————-#

style methods                                 #

—————————————————————————-#

CSS properties key/value pairs with underscores ‘_` rather than dashes `-` e.g. `style(color: ’blue’, text_align: ‘center’)‘



399
400
401
402
403
404
405
406
407
408
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 399

def style(hash)
  id = caller_id(self)
  hash.each do |key, value|
  send_js(%Q~
    $("##{id}").css("#{key.to_s.gsub("_","-")}", "#{value}");
  ~)
  @@gui.elements[:"#{id}"].attributes[:"#{key}"] = "#{value}"
  end
  return self
end

#sub_script(string, attributes = {}) ⇒ Object 



312
313
314
315
316
317
318
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 312

def sub_script(string, attributes={})
  ## FIXME: displays superscript, huh???
  sub = Element.new("p", attributes)
  send_js(%Q~ #{sub.id}.innerHTML = "#{string}"; ~)
  sub.style(vertical_align: "sub", font_size: "small")
  return sub
end

#sup_script(string, attributes = {}) ⇒ Object 



320
321
322
323
324
325
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 320

def sup_script(string, attributes={})
  sup = Element.new("p", attributes)
  send_js(%Q~ #{sup.id}.innerHTML = "#{string}"; ~)
  sup.style(vertical_align: "super", font_size: "small")
  return sup
end

#text(string) ⇒ Object Also known as: text=

set element text



329
330
331
332
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 329

def text(string)
  id = caller_id(self)
  send_js(%Q~ #{id}.innerHTML = "#{string}"; ~)
end

#text_align(position) ⇒ Object Also known as: text_align=

position may be ‘’left’‘, `’right’‘, `’center’‘, or `’justify’‘



581
582
583
584
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 581

def text_align(position)
  self.style(text_align: "#{position}")
  return self
end

#text_input(*args, &block) ⇒ Object

‘text_input(label=“”, attributes={}, &block |input|)`



337
338
339
340
341
342
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 337

def text_input(*args, &block)
  args.unshift("") unless args[0].is_a?(String)
  label = args[0]
  args[1] ? attributes = args[1] : attributes = {}
  Input.new("text", label, attributes, &block)
end

#toggle ⇒ Object

show/hide element



346
347
348
349
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 346

def toggle
  id = caller_id(self)
  send_js(%Q~ $("##{id}").toggle(); ~)
end

#transition(property, duration, *args) ⇒ Object Also known as: transition=

‘transition(property, duration, delay=0, type=“ease”)` www.w3schools.com/css/css3_transitions.asp



590
591
592
593
594
595
596
597
598
599
600
601
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 590

def transition(property, duration, *args)
  self.style(transition: "#{property} #{duration}s")
  unless args.empty?
    args.each do |arg|
      if arg.is_a?(String)
        self.style(transition_timing_function: "#{arg}")
      elsif arg.is_a?(Integer)
        self.style(transition_delay: "#{arg}s")
      end
    end
  end
end

#triangle(size_integer, attributes = {}) ⇒ Object 



351
352
353
354
355
356
357
358
359
360
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 351

def triangle(size_integer, attributes={})
  polygon(
    [
      [0, size_integer * 0.866],
      [size_integer / 2, 0],
      [size_integer, size_integer * 0.866]
    ],
    attributes
  )
end

#url_input(*args, &block) ⇒ Object

‘url_input(label=“”, attributes={}, &block |input|)`



364
365
366
367
368
369
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 364

def url_input(*args, &block)
  args.unshift("") unless args[0].is_a?(String)
  label = args[0]
  args[1] ? attributes = args[1] : attributes = {}
  Input.new("url", label, attributes, &block)
end

#v_box(attributes = {}, &block) ⇒ Object 



371
372
373
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 371

def v_box(attributes={}, &block)
  Box.new("column", attributes, &block)
end

#video_out(attributes = {}) ⇒ Object

attributes may include ‘controls: true`



377
378
379
380
381
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 377

def video_out(attributes={})
  attributes[:width] = 500 unless attributes[:width]
  attributes[:height] = 300 unless attributes[:height]
  AudioVideo.new("video", attributes)
end

#web_frame(attributes = {}) ⇒ Object 



383
384
385
386
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 383

def web_frame(attributes={})
  attributes[:height] = "500px" unless attributes[:height]
  Element.new("iframe", attributes)
end

#width(w) ⇒ Object Also known as: width=

www.w3schools.com/cssref/pr_dim_width.asp



606
607
608
609
 
# File 'lib/guindilla_gui/guindilla_methods.rb', line 606

def width(w)
  self.style(width: "#{w}")
  return self
end