scarpe 0.2.2 → 0.3.0

data/lib/scarpe/wv/edit_box.rb

@@ -1,13 +1,13 @@
 # frozen_string_literal: true
 
-class Scarpe
-  class WebviewEditBox < Scarpe::WebviewWidget
+module Scarpe::Webview
+  class EditBox < Drawable
     attr_reader :text, :height, :width
 
     def initialize(properties)
       super
 
-      # The JS handler sends a "change" event, which we forward to the Shoes widget tree
+      # The JS handler sends a "change" event, which we forward to the Shoes drawable tree
       bind("change") do |new_text|
         send_self_event(new_text, event_name: "change")
       end
@@ -23,20 +23,7 @@ class Scarpe
     end
 
     def element
-      oninput = handler_js_code("change", "this.value")
-
-      HTML.render do |h|
-        h.textarea(id: html_id, oninput: oninput, style: style) { text }
-      end
-    end
-
-    protected
-
-    def style
-      super.merge({
-        height: Dimensions.length(height),
-        width: Dimensions.length(width),
-      }.compact)
+      render("edit_box")
     end
   end
 end

data/lib/scarpe/wv/edit_line.rb

@@ -1,13 +1,13 @@
 # frozen_string_literal: true
 
-class Scarpe
-  class WebviewEditLine < WebviewWidget
+module Scarpe::Webview
+  class EditLine < Drawable
     attr_reader :text, :width
 
     def initialize(properties)
       super
 
-      # The JS handler sends a "change" event, which we forward to the Shoes widget tree
+      # The JS handler sends a "change" event, which we forward to the Shoes drawable tree
       bind("change") do |new_text|
         send_self_event(new_text, event_name: "change")
       end
@@ -23,21 +23,7 @@ class Scarpe
     end
 
     def element
-      oninput = handler_js_code("change", "this.value")
-
-      HTML.render do |h|
-        h.input(id: html_id, oninput: oninput, value: @text, style: style)
-      end
-    end
-
-    protected
-
-    def style
-      styles = super
-
-      styles[:width] = Dimensions.length(@width) if @width
-
-      styles
+      render("edit_line")
     end
   end
 end

data/lib/scarpe/wv/flow.rb

@@ -1,22 +1,6 @@
 # frozen_string_literal: true
 
-class Scarpe
-  class WebviewFlow < Scarpe::WebviewSlot
-    def initialize(properties)
-      super
-    end
-
-    protected
-
-    def style
-      {
-        display: "flex",
-        "flex-direction": "row",
-        "flex-wrap": "wrap",
-        "align-content": "flex-start",
-        "justify-content": "flex-start",
-        "align-items": "flex-start",
-      }.merge(super)
-    end
+module Scarpe::Webview
+  class Flow < Slot
   end
 end

data/lib/scarpe/wv/image.rb

@@ -2,40 +2,20 @@
 
 require "scarpe/components/base64"
 
-class Scarpe
-  class WebviewImage < WebviewWidget
-    include Components::Base64
+module Scarpe::Webview
+  class Image < Drawable
+    include Scarpe::Components::Base64
+
     def initialize(properties)
       super
 
-      @url = valid_url?(@url) ? @url : "data:image/png;base64,#{encode_file_to_base64(@url)}"
-    end
-
-    def element
-      if @click
-        HTML.render do |h|
-          h.a(id: html_id, href: @click) { h.img(id: html_id, src: @url, style:) }
-        end
-      else
-        HTML.render do |h|
-          h.img(id: html_id, src: @url, style:)
-        end
+      unless valid_url?(@url)
+        @url = "data:image/png;base64,#{encode_file_to_base64(@url)}"
       end
     end
 
-    protected
-
-    def style
-      styles = super
-
-      styles[:width] = Dimensions.length(@width) if @width
-      styles[:height] = Dimensions.length(@height) if @height
-
-      styles[:top] = Dimensions.length(@top) if @top
-      styles[:left] = Dimensions.length(@left) if @left
-      styles[:position] = "absolute" if @top || @left
-
-      styles
+    def element
+      render("image")
     end
   end
 end

data/lib/scarpe/wv/line.rb

@@ -1,35 +1,13 @@
 # frozen_string_literal: true
 
-class Scarpe
-  class WebviewLine < Scarpe::WebviewWidget
+module Scarpe::Webview
+  class Line < Drawable
     def initialize(properties)
       super(properties)
     end
 
     def element
-      HTML.render do |h|
-        h.div(id: html_id, style: style) do
-          h.svg(width: @x2, height: @y2) do
-            h.line(x1: @left, y1: @top, x2: @x2, y2: @y2, style: line_style)
-          end
-        end
-      end
-    end
-
-    protected
-
-    def style
-      super.merge({
-        left: "#{@left}px",
-        top: "#{@top}px",
-      })
-    end
-
-    def line_style
-      {
-        stroke: @draw_context["stroke"],
-        "stroke-width": "4",
-      }
+      render("line")
     end
   end
 end

data/lib/scarpe/wv/link.rb

@@ -1,7 +1,7 @@
 # frozen_string_literal: true
 
-class Scarpe
-  class WebviewLink < WebviewWidget
+module Scarpe::Webview
+  class Link < TextDrawable
     def initialize(properties)
       super
 
@@ -11,20 +11,7 @@ class Scarpe
     end
 
     def element
-      HTML.render do |h|
-        h.a(**attributes) do
-          @text
-        end
-      end
-    end
-
-    def attributes
-      {
-        id: html_id,
-        href: @click,
-        onclick: (handler_js_code("click") if @has_block),
-        style: style,
-      }.compact
+      render "link"
     end
   end
 end

data/lib/scarpe/wv/list_box.rb

@@ -1,20 +1,19 @@
 # frozen_string_literal: true
 
-class Scarpe
-  class WebviewListBox < Scarpe::WebviewWidget
-    attr_reader :selected_item, :items, :height, :width
+module Scarpe::Webview
+  class ListBox < Drawable
+    attr_reader :items, :height, :width, :chosen
 
     def initialize(properties)
-      super(properties)
+      super
 
-      # The JS handler sends a "change" event, which we forward to the Shoes widget tree
       bind("change") do |new_item|
         send_self_event(new_item, event_name: "change")
       end
     end
 
     def properties_changed(changes)
-      selected = changes.delete("selected_item")
+      selected = changes.delete("chosen")
       if selected
         html_element.value = selected
       end
@@ -22,29 +21,7 @@ class Scarpe
     end
 
     def element
-      onchange = handler_js_code("change", "this.options[this.selectedIndex].value")
-
-      select_attrs = { id: html_id, onchange: onchange, style: style }
-      option_attrs = { value: nil, selected: false }
-
-      HTML.render do |h|
-        h.select(**select_attrs) do
-          items.each do |item|
-            h.option(**option_attrs, value: item, selected: (item == selected_item)) { item }
-          end
-        end
-      end
-    end
-
-    protected
-
-    def style
-      styles = super
-
-      styles[:height] = Dimensions.length(height) if height
-      styles[:width] = Dimensions.length(width) if width
-
-      styles
+      render("list_box")
     end
   end
 end

data/lib/scarpe/wv/para.rb

@@ -1,7 +1,12 @@
 # frozen_string_literal: true
 
-class Scarpe
-  class WebviewPara < WebviewWidget
+module Scarpe::Webview
+  class Para < Drawable
+    # Currently this is duplicated in Calzini. How to refactor?
+    # Similarly, we make some assumptions about when size is a symbol
+    # versus string that may not survive JSON deserialization.
+    # Do we want to hardcode these sizes in Lacci and have it always
+    # pass numbers?
     SIZES = {
       inscription: 10,
       ins: 10,
@@ -14,10 +19,6 @@ class Scarpe
     }.freeze
     private_constant :SIZES
 
-    def initialize(properties)
-      super
-    end
-
     def properties_changed(changes)
       items = changes.delete("text_items")
       if items
@@ -40,39 +41,23 @@ class Scarpe
         if item.is_a?(String)
           item
         else
-          WebviewDisplayService.instance.query_display_widget_for(item)
+          Scarpe::Webview::DisplayService.instance.query_display_drawable_for(item)
         end
       end
     end
 
     def element(&block)
-      HTML.render do |h|
-        h.p(**options, &block)
-      end
+      render("para", &block)
     end
 
+    # Because para's to_html takes a block, and it needs to convert IDs into display
+    # drawables, it needs to also override to_html
     def to_html
       @children ||= []
 
       element { child_markup }
     end
 
-    protected
-
-    def style
-      super.merge({
-        color: rgb_to_hex(@stroke),
-        "font-size": font_size,
-        "font-family": @font,
-      }.compact)
-    end
-
-    def font_size
-      font_size = @size.is_a?(Symbol) ? SIZES[@size] : @size
-
-      Dimensions.length(font_size)
-    end
-
     private
 
     def child_markup
@@ -84,9 +69,5 @@ class Scarpe
         end
       end.join
     end
-
-    def options
-      @html_attributes.merge(id: html_id, style: style)
-    end
   end
 end

data/lib/scarpe/wv/progress.rb

@@ -0,0 +1,19 @@
+# frozen_string_literal: true
+
+module Scarpe::Webview
+  class Progress < Drawable
+    def initialize(properties)
+      super
+    end
+
+    # For now do *not* catch properties_changed and do a small update.
+    # Tiranti updates some additional fields (e.g. aria-valuenow) that
+    # Calzini does not. We'll want Calzini and Tiranti to handle the
+    # updates more for themselves. See issue #419 for updates on how
+    # we'll handle this. But for right now we re-render the whole
+    # drawable every time we change the progress fraction.
+    def element
+      render("progress")
+    end
+  end
+end

data/lib/scarpe/wv/radio.rb

@@ -1,7 +1,8 @@
 # frozen_string_literal: true
 
-class Scarpe
-  class WebviewRadio < Scarpe::WebviewWidget
+module Scarpe::Webview
+  class Radio < Drawable
+    # TODO: is this needed?
     attr_reader :text
 
     def initialize(properties)
@@ -20,15 +21,13 @@ class Scarpe
     end
 
     def element
-      HTML.render do |h|
-        h.input(type: :radio, id: html_id, onclick: handler_js_code("click"), name: group_name, value: "hmm #{text}", checked: @checked, style: style)
-      end
-    end
+      props = shoes_styles
 
-    private
-
-    def group_name
-      @group || @parent
+      # If a group isn't set, default to the linkable ID of the parent slot
+      unless @group
+        props["group"] = @parent ? @parent.shoes_linkable_id : "no_group"
+      end
+      render("radio", props)
     end
   end
 end

data/lib/scarpe/wv/rect.rb

@@ -0,0 +1,13 @@
+# frozen_string_literal: true
+
+module Scarpe::Webview
+  class Rect < Drawable
+    def initialize(properties)
+      super(properties)
+    end
+
+    def element(&block)
+      render("rect", &block)
+    end
+  end
+end

data/lib/scarpe/wv/shape.rb

@@ -1,12 +1,7 @@
 # frozen_string_literal: true
 
-class Scarpe
-  # Should inherit from Slot?
-  class WebviewShape < Scarpe::WebviewWidget
-    def initialize(properties)
-      super(properties)
-    end
-
+module Scarpe::Webview
+  class Shape < Drawable
     def to_html
       @children ||= []
       child_markup = @children.map(&:to_html).join
@@ -51,7 +46,7 @@ class Scarpe
           x, y = *args
           current_path += "L #{x} #{y} "
         else
-          raise "Unknown shape command! #{cmd.inspect}"
+          raise Scarpe::UnknownShapeCommandError, "Unknown shape command! #{cmd.inspect}"
         end
       end
 

data/lib/scarpe/wv/slot.rb

@@ -1,11 +1,7 @@
 # frozen_string_literal: true
 
-class Scarpe
-  class WebviewSlot < Scarpe::WebviewWidget
-    include Scarpe::WebviewBackground
-    include Scarpe::WebviewBorder
-    include Scarpe::WebviewSpacing
-
+module Scarpe::Webview
+  class Slot < Drawable
     def initialize(properties)
       @event_callbacks = {}
 
@@ -13,16 +9,16 @@ class Scarpe
     end
 
     def element(&block)
-      HTML.render do |h|
-        h.div(attributes.merge(id: html_id, style: style), &block)
-      end
+      props = shoes_styles.merge("html_attributes" => html_attributes)
+      render_name = self.class.name.split("::")[-1].downcase # usually "stack" or "flow" or "documentroot"
+      render(render_name, props, &block)
     end
 
     def set_event_callback(obj, event_name, js_code)
       event_name = event_name.to_s
       @event_callbacks[event_name] ||= {}
       if @event_callbacks[event_name][obj]
-        raise "Can't have two callbacks on the same event, from the same object, on the same parent!"
+        raise Scarpe::DuplicateCallbackError, "Can't have two callbacks on the same event, from the same object, on the same parent!"
       end
 
       @event_callbacks[event_name][obj] = js_code
@@ -54,7 +50,8 @@ class Scarpe
       html_element.set_attribute(event_name, @event_callbacks[event_name].values.join(";"))
     end
 
-    def attributes
+    # These get added for event handlers and passed to Calzini
+    def html_attributes
       attr = {}
 
       @event_callbacks.each do |event_name, handlers|
@@ -63,19 +60,5 @@ class Scarpe
 
       attr
     end
-
-    def style
-      styles = super
-
-      styles[:"margin-top"] = @margin_top if @margin_top
-      styles[:"margin-bottom"] = @margin_bottom if @margin_bottom
-      styles[:"margin-left"] = @margin_left if @margin_left
-      styles[:"margin-right"] = @margin_right if @margin_right
-
-      styles[:width] = Dimensions.length(@width) if @width
-      styles[:height] = Dimensions.length(@height) if @height
-
-      styles
-    end
   end
 end

data/lib/scarpe/wv/span.rb

@@ -1,7 +1,7 @@
 # frozen_string_literal: true
 
-class Scarpe
-  class WebviewSpan < Scarpe::WebviewWidget
+module Scarpe::Webview
+  class Span < TextDrawable
     SIZES = {
       inscription: 10,
       ins: 10,
@@ -34,35 +34,11 @@ class Scarpe
     end
 
     def element(&block)
-      HTML.render do |h|
-        h.span(**options, &block)
-      end
+      render("span", &block)
     end
 
     def to_html
       element { @text }
     end
-
-    protected
-
-    def style
-      {
-        color: @stroke,
-        "font-size": font_size,
-        "font-family": @font,
-      }.compact
-    end
-
-    private
-
-    def options
-      @html_attributes.merge(id: html_id, style: style)
-    end
-
-    def font_size
-      font_size = @size.is_a?(Symbol) ? SIZES[@size] : @size
-
-      Dimensions.length(font_size)
-    end
   end
 end

data/lib/scarpe/wv/stack.rb

@@ -1,22 +1,6 @@
 # frozen_string_literal: true
 
-class Scarpe
-  class WebviewStack < Scarpe::WebviewSlot
-    def get_style
-      style
-    end
-
-    protected
-
-    def style
-      {
-        display: "flex",
-        "flex-direction": "column",
-        "align-content": "flex-start",
-        "justify-content": "flex-start",
-        "align-items": "flex-start",
-        overflow: @scroll ? "auto" : nil,
-      }.compact.merge(super)
-    end
+module Scarpe::Webview
+  class Stack < Slot
   end
 end

data/lib/scarpe/wv/star.rb

@@ -1,63 +1,13 @@
 # frozen_string_literal: true
 
-class Scarpe
-  class WebviewStar < Scarpe::WebviewWidget
+module Scarpe::Webview
+  class Star < Drawable
     def initialize(properties)
       super(properties)
     end
 
     def element(&block)
-      fill = @draw_context["fill"]
-      stroke = @draw_context["stroke"]
-      fill = "black" if fill == ""
-      stroke = "black" if stroke == ""
-      HTML.render do |h|
-        h.div(id: html_id, style: style) do
-          h.svg(width: @outer, height: @outer, style: "fill:#{fill};") do
-            h.polygon(points: star_points, style: "stroke:#{stroke};stroke-width:2")
-          end
-          block.call(h) if block_given?
-        end
-      end
-    end
-
-    protected
-
-    def style
-      super.merge({
-        width: Dimensions.length(@width),
-        height: Dimensions.length(@height),
-      })
-    end
-
-    private
-
-    def star_points
-      get_star_points.join(",")
-    end
-
-    def get_star_points
-      angle = 2 * Math::PI / @points
-      coordinates = []
-
-      @points.times do |i|
-        outer_angle = i * angle
-        inner_angle = outer_angle + angle / 2
-
-        coordinates.concat(get_coordinates(outer_angle, inner_angle))
-      end
-
-      coordinates
-    end
-
-    def get_coordinates(outer_angle, inner_angle)
-      outer_x = @outer / 2 + Math.cos(outer_angle) * @outer / 2
-      outer_y = @outer / 2 + Math.sin(outer_angle) * @outer / 2
-
-      inner_x = @outer / 2 + Math.cos(inner_angle) * @inner / 2
-      inner_y = @outer / 2 + Math.sin(inner_angle) * @inner / 2
-
-      [outer_x, outer_y, inner_x, inner_y]
+      render("star", &block)
     end
   end
 end