hokusai-zero 0.2.6 → 0.2.8

data/ui/src/hokusai/blocks/dynamic.rb

@@ -25,6 +25,8 @@ class Hokusai::Blocks::Dynamic < Hokusai::Block
       w += block.node.meta.get_prop?(:width)&.to_f || 0.0
     end
 
+    node.meta.set_prop(:height, h)
+
     [w, h]
   end
 

data/ui/src/hokusai/blocks/input.rb

@@ -87,7 +87,7 @@ class Hokusai::Blocks::Input < Hokusai::Block
   end
 
   def dynamic_keypress_handle(event)
-    return unless node.meta.focused
+    return unless node.meta.focused || event.input.keyboard_override
     case event
     when proc(&:ctrl), proc(&:super)
       if event.char == "z"
@@ -154,7 +154,7 @@ class Hokusai::Blocks::Input < Hokusai::Block
           self.buffer_offset = offset
         end
 
-        self.buffer += event.char
+        self.buffer += event.char unless event.char.nil?
       end
     end
 

data/ui/src/hokusai/blocks/keyboard.rb

@@ -0,0 +1,249 @@
+# frozen_string_literal: true
+
+module Hokusai::Blocks
+  class Key < Hokusai::Block
+    template <<~EOF
+    [template]
+      empty {
+        @mousedown="set_down"
+        @mouseup="set_up"
+        cursor="pointer"
+      }
+    EOF
+
+    uses(empty: Hokusai::Blocks::Empty)
+
+    computed! :value
+    computed :size, default: 24, convert: proc(&:to_i)
+    computed :background, default: Hokusai::Color.new(70, 70, 70), convert: Hokusai::Color
+    computed :color, default: Hokusai::Color.new(244, 244, 244), convert: Hokusai::Color
+    computed :background_down, default: Hokusai::Color.new(33,33,33), convert: Hokusai::Color
+    computed :margin, default: Hokusai::Padding.new(3.0, 2.5, 3.0, 2.5), convert: Hokusai::Padding
+
+    inject :keyboard_icons
+
+    attr_accessor :down, :last_commands, :last_canvas, :last_value
+
+    def initialize(**args)
+      @down = false
+      @last_commands = []
+      @last_canvas = nil
+      @last_value = nil
+
+      super
+    end
+
+    def set_down(event)
+      if !down
+        emit("clicked", value[0], event)
+
+        self.down = true
+      else
+        emit("released", value[0], event)
+      end
+    end
+
+    def set_up(event)
+      self.down = false
+      emit("released", value[0], event)
+    end
+
+    def render(canvas)
+      hpad = (canvas.width  - size) / 2
+      vpad = (canvas.height - margin.height - size) / 2
+
+      draw do
+        if last_canvas != canvas && last_value != value
+          self.last_value = value
+          self.last_canvas = canvas
+
+          if icon = keyboard_icons[value[0]]
+            if icon[:width]
+              node.meta.set_prop(:width, icon[:width])
+            end
+
+            rect(canvas.x + margin.left, canvas.y + margin.top, canvas.width - margin.width, canvas.height - margin.height) do |command|
+              command.color = icon[:background]# down ? background_down : background
+              command.round = 0.2
+
+              last_commands << command
+            end
+
+            svg(icon[:file], canvas.x + icon[:size] / 3, canvas.y + icon[:size] / 3, icon[:size], icon[:size]) do |command|
+              command.color = icon[:color]
+
+              last_commands << command
+            end
+          else
+            rect(canvas.x + margin.left, canvas.y + margin.top, canvas.width - margin.width, canvas.height - margin.height) do |command|
+              command.color = down ? background_down : background
+              command.round = 0.2
+
+              last_commands << command
+            end
+
+            text(value[1].to_s, canvas.x + hpad + margin.width, canvas.y + margin.height) do |command|
+              command.color = color
+              command.size = size
+
+              last_commands << command
+            end
+          end
+        else
+          queue.concat(last_commands)
+        end
+      end
+
+      yield canvas
+    end
+  end
+
+  class KeyboardRow < Hokusai::Block
+    style <<~EOF
+    [style]
+    keyboardStyle {
+      background: rgb(28, 28, 28);
+    }
+    keyStyle {
+      background: rgb(46, 46, 46);
+      color: rgb(208, 205, 218);
+      background_down: rgb(37, 37, 37);
+    }
+    EOF
+
+    template <<~EOF
+    [template]
+      hblock { ...keyboardStyle }
+        [for="number in keys"]
+          key {
+            ...keyStyle
+            :key="index"
+            :value="number"
+            @clicked="emit_key"
+            @released="emit_released"
+          }
+    EOF
+
+    uses(
+      hblock: Hblock,
+      vblock: Vblock,
+      key: Key
+    )
+
+    computed! :keys
+
+    inject :keyboard_icons
+
+    def loop_key(value)
+      @keys ||= {}
+      @keys[value] ||= "key-#{value}".freeze
+    end
+    
+    def emit_key(key, event)
+      emit("key", key, event)
+    end
+
+    def emit_released(key, event)
+      emit("released", key, event)
+    end
+  end
+
+  class Keyboard < Hokusai::Block
+    style <<~EOF
+    [style]
+    kstyle {
+      padding: padding(10.0, 5.0, 10.0, 5.0);
+      background: rgb(28, 28, 28);
+    }
+    EOF
+
+    template <<~EOF
+    [template]
+      vblock { ...kstyle }
+        [for="row in key_rows"]
+          row {
+            :icons="icons"
+            @released="handle_released"
+            @key="handle_keypress"
+            :key="index"
+            :keys="row"
+          }
+    EOF
+
+    uses(
+      vblock: Hokusai::Blocks::Vblock,
+      row: KeyboardRow
+    )
+
+    def icons
+      {
+        :shift => { 
+          file: Hokusai.asset("icons/outline/arrow-big-up.svg"),
+          width: 54.0,
+          size: 30,
+          background: Hokusai::Color.new(50, 109, 70),
+          color: Hokusai::Color.new(172, 224, 189)
+        },
+        :backspace => { 
+          file: Hokusai.asset("icons/outline/backspace.svg"), 
+          width: 54.0, 
+          size: 30,
+          background: Hokusai::Color.new(50, 109, 70),
+          color: Hokusai::Color.new(172, 224, 189)
+         }
+      }
+    end
+
+    computed :row_height, default: 48.0, convert: proc(&:to_f)
+
+    provide :keyboard_icons, :icons
+
+    def on_mounted
+      node.meta.set_prop(:height, row_height * 5.0 + 20)
+    end
+
+    def space_row
+      [[:comma, ","], [:space, ''], [:period, "."]]
+    end
+
+    def key_rows
+      [number_keys, querty_keys, asdf_keys, zxcv_keys, space_row]
+    end
+
+    def handle_released(key, event)
+      event.input.keyboard_override = false
+    end
+
+    def handle_keypress(key, event)
+      event.input.keyboard_override = true
+      LibHokusai.hoku_input_keyboard_start(event.input.raw)
+      LibHokusai.hoku_input_keyboard_set_key(event.input.raw, key.to_sym, true)
+      LibHokusai.hoku_input_keyboard_stop(event.input.raw)
+    end
+
+    def zxcv_keys
+      @zxcv_keys ||= begin
+        keys = %w[z x c v b n m]
+        middle = keys.zip(keys)
+        # middle << [:backspace, :backspace]
+        # middle.unshift([:shift, :shift])
+        middle
+      end
+    end
+
+    def asdf_keys
+      keys = %w[a s d f g h j k l]
+      @asdf_keys ||= keys.zip(keys)
+    end
+
+    def querty_keys
+      keys = %w[q w e r t y u i o p]
+      @querty_keys ||= keys.zip(keys)
+    end
+
+    def number_keys
+      keys = [[:one,1],[:two, 2], [:three,3], [:four,4],[:five, 5], [:six,6], [:seven,7], [:eight,8],[:nine,9], [:zero, 0]]
+      @number_keys ||= keys
+    end
+  end
+end

data/ui/src/hokusai/blocks/panel.rb

@@ -39,6 +39,8 @@ class Hokusai::Blocks::Panel < Hokusai::Block
   provide :panel_height, :panel_height
   provide :panel_top, :panel_top
 
+  inject :selection
+
   attr_accessor :top, :panel_height, :scroll_y, :scroll_percent,
                 :scroll_goto_y, :clipped_offset, :clipped_content_height
 

data/ui/src/hokusai/blocks/scrollbar.rb

@@ -1,7 +1,14 @@
 class Hokusai::Blocks::Scrollbar < Hokusai::Block
+  style <<~EOF
+  [style]
+  scrollbar {
+    cursor: "pointer";
+  }
+  EOF
   template <<~EOF
     [template]
       vblock.scrollbar {
+        ...scrollbar
         @mousedown="scroll_start"
         @mousemove="scroll_handle"
         :background="background"

data/ui/src/hokusai/blocks/selectable.rb

@@ -38,6 +38,7 @@ module Hokusai::Blocks
 
     def start_selection(event)
       if event.left.down && !selection.active?
+        selection.clear
         selection.start(event.pos.x, event.pos.y)
       end
     end

data/ui/src/hokusai/blocks/shader_begin.rb

@@ -0,0 +1,22 @@
+class Hokusai::Blocks::ShaderBegin < Hokusai::Block
+  template <<~EOF
+  [template]
+    slot
+  EOF
+
+  computed :fragment_shader, default: nil
+  computed :vertex_shader, default: nil
+  computed :uniforms, default: []
+
+  def render(canvas)
+    draw do
+      shader_begin do |command|
+        command.vertex_shader = vertex_shader
+        command.fragment_shader = fragment_shader
+        command.uniforms = uniforms
+      end
+    end
+
+    yield canvas
+  end
+end

data/ui/src/hokusai/blocks/shader_end.rb

@@ -0,0 +1,12 @@
+class Hokusai::Blocks::ShaderEnd < Hokusai::Block
+  template <<~EOF
+  [template]
+    virtual
+  EOF
+
+  def render(canvas)
+    draw do
+      shader_end
+    end
+  end
+end

data/ui/src/hokusai/blocks/slider.rb

@@ -0,0 +1,139 @@
+
+module Hokusai::Blocks
+  class Slider < Hokusai::Block
+    template <<~EOF
+    [template]
+      empty {
+        @click="start_slider"
+        @mousemove="move_slider"
+        @mouseup="stop_slider"
+      }
+    EOF
+
+    uses(empty: Hokusai::Blocks::Empty)
+
+    computed :fill, default: [61,171,211], convert: Hokusai::Color
+    computed :initial, default: 0.0, convert: proc(&:to_f)
+    computed :size, default: 50.0, convert: proc(&:to_f)
+    computed :step, default: 20.0, convert: proc(&:to_f)
+    computed :min, default: 0.0, convert: proc(&:to_f)
+    computed :max, default: 100.0, convert: proc(&:to_f)
+
+    attr_reader :slider_width, :slider_start, :steps_x, :steps_val
+    attr_accessor :sliding, :slider_x, :last_index
+
+    def initialize(**args)
+      @sliding = false
+      @slider_width = 0.0
+      @slider_start = 0.0
+      @slider_x = 0.0
+      @last_index = 0
+      @configured = false
+
+      super
+
+      @last_max = nil
+    end
+
+    def start_slider(event)
+      self.sliding = true
+    end
+
+    def on_resize(canvas)
+      # create our buckets for steps
+      @slider_start = canvas.x
+      @slider_width = canvas.width
+
+      @steps_val = [*(min..max).step(step).to_a, max]
+      steps_val.pop if steps_val[-1] == steps_val[-2]
+
+      step_x = (slider_width) / (steps_val.size - 1)
+      @steps_x = (slider_start..(slider_start + slider_width)).step(step_x).to_a
+
+      (steps_val.size - steps_x.size).times do |i|
+        steps_x << steps_x.last + step_x * i
+      end
+
+      steps_x[-1] = slider_start + slider_width  if slider_start + slider_width != steps_x.last
+    end
+
+    def move_slider(event)
+      if sliding && event.left.down
+        pos = event.pos.x
+        index = steps_x.size - 1
+    
+        (0...steps_x.size - 1).each do |i|
+          next if steps_x[i + 1] && pos - steps_x[i + 1] > step
+
+          if pos - steps_x[i] > pos - steps_x[i + 1]
+            index = i
+            break 
+          else
+            index = i + 1
+            break
+          end
+        end
+
+        self.last_index = index
+
+        emit("updated", steps_val[index])
+      else
+        self.sliding = false
+      end
+    end
+
+    def stop_slider(event)
+      if event.left.up
+        self.sliding = false
+      end
+    end
+
+    def render(canvas)
+      if max != @last_max
+        on_resize(canvas)
+
+        @last_max = max
+      end
+
+      unless @setup || steps_val.nil? || initial.nil?
+        steps_val.each_with_index do |val, index|
+          if val == initial
+            self.last_index = index
+
+            break
+          end
+        end
+
+        @setup = true
+      end
+
+      slider_x = steps_x[last_index]
+      padding = Hokusai::Padding.new(0.0, 0.0, 0.0, 0.0)
+      percent = slider_x * 100.00
+      x = slider_x  + padding.left
+      x = (canvas.x + canvas.width) - (size / 2) - 2 if x > (canvas.x + canvas.width) - (size / 2)
+      x = canvas.x  if x < canvas.x
+      cursor = (x + size / 2)
+
+      draw do
+        # draw background
+        rect(canvas.x + padding.left, canvas.y + padding.top, canvas.width - padding.right - padding.left, size) do |command|
+          command.round = size / 2
+          command.color = Hokusai::Color.new(33, 33, 33)
+          command.padding = Hokusai::Padding.new(5.0, 20.0, 5.0, 20.0)
+        end
+
+        rect(canvas.x + padding.left + 1, canvas.y + padding.top + 1, x + (size / 2) - canvas.x - 2, size - 2) do |command|
+          command.round = size / 2
+          command.color = fill
+        end
+
+        circle(cursor + padding.left, canvas.y + (size / 2) + padding.top, size / 2) do |command|
+          command.color = Hokusai::Color.new(233, 233, 233)
+        end
+      end
+      
+      yield canvas
+    end
+  end
+end

data/ui/src/hokusai/blocks/text_stream.rb

@@ -0,0 +1,130 @@
+class Hokusai::Blocks::TextStream < Hokusai::Block
+  template <<~EOF
+  [template]
+    empty {
+      cursor="ibeam"
+    }
+  EOF
+
+  uses(empty: Hokusai::Blocks::Empty)
+
+  computed! :content
+  computed :font, default: nil
+  computed :size, default: 16, convert: proc(&:to_i)
+  computed :color, default: Hokusai::Color.new(33, 33, 33), convert: Hokusai::Color
+  computed :selection_color, default: Hokusai::Color.new(233,233,233), convert: Hokusai::Color
+  computed :padding, default: Hokusai::Padding.new(5.0, 5.0, 5.0, 5.0), convert: Hokusai::Padding
+  computed :cursor_offset, default: nil
+
+  inject :selection
+  inject :panel_top
+  inject :panel_height
+  inject :panel_offset
+
+  attr_accessor :last_commands, :last_content, :last_coords, :last_height,
+                :last_width, :last_selector, :last_panel_offset, :copying, :buffer
+
+  attr_reader :stream
+
+  def initialize(**args)
+    @last_commands = []
+    @last_coords = nil
+    @last_height = 0.0
+    @last_width = nil
+    @last_selector = nil
+    @last_content = nil
+    @last_panel_offset = nil
+    @last_canvas = nil
+    @copying = false
+    @reset = false
+    @buffer = ""
+
+    super
+  end
+
+  def after_updated
+    @stream&.reset(last_width)
+  end
+  
+  def render(canvas)
+    w = canvas.width - padding.left - padding.right
+    poff = panel_offset || 0.0 - panel_top || 0.0
+    selection&.offset_y = poff
+
+    lfont = Hokusai.fonts.active_font_name
+    Hokusai.fonts.activate font unless font.nil?
+
+    # if Hokusai.can_render(canvas)
+      # if (last_content != content || 
+      #     last_width != w || 
+      #     panel_offset != last_panel_offset || 
+      #     last_coords != selection&.coords || 
+      #     copying || 
+      #     last_selector != selection&.type)
+
+        last_commands.clear
+        self.last_panel_offset = panel_offset
+        self.last_content = content
+        self.last_width = w
+        self.last_selector = selection&.type
+        self.last_coords = selection&.coords
+
+        @stream ||= WrapStream.new(w) do |string, extra|
+          [Hokusai.fonts.active.measure_char(string, size), size]
+        end
+
+        stream.origin_x = canvas.x + padding.left
+        stream.origin_y = canvas.y + padding.top
+        stream.offset_y = 0.0
+        stream.reset(w)
+
+        draw do
+          stream.on_text_selection(selection, nil) do |wrapped|
+            self.buffer << wrapped.buffer if copying
+            rect(wrapped.x, wrapped.y, wrapped.width, wrapped.height) do |command|
+              command.color = selection_color
+
+              last_commands << command
+            end
+          end
+
+          stream.on_text do |wrapped|
+            text(wrapped.text, wrapped.x, wrapped.y) do |command|
+              command.color = color
+              command.size = size
+              command.font = font
+
+              last_commands << command
+            end
+          end
+
+          stream.wrap(content, nil)
+          stream.flush
+          stream.y += size
+        end
+
+        self.last_height = stream.y - canvas.y + padding.top + padding.bottom
+        emit("height_updated", last_height)
+        node.meta.set_prop(:height, last_height)
+
+
+      # else
+      #   draw do
+      #     queue.concat last_commands
+      #   end
+      # end
+
+      if copying
+        Hokusai.copy(buffer)
+        self.buffer = ""
+        self.copying = false
+      end
+
+      # node.portal&.meta&.set_prop(:height, last_height + padding.top + padding.bottom)
+
+      yield canvas
+    # end
+
+    Hokusai.fonts.activate lfont
+  end
+end

data/ui/src/hokusai/blocks/texture.rb

@@ -0,0 +1,23 @@
+class Hokusai::Blocks::Texture < Hokusai::Block
+  template <<~EOF
+  [template]
+    virtual
+  EOF
+
+  computed :width, default: nil, convert: proc(&:to_i)
+  computed :height, default: nil, convert: proc(&:to_i)
+  computed :x, default: nil
+  computed :y, default: nil
+  computed :rotation, default: nil
+  computed :scale, default: 100.0
+
+
+  def render(canvas)
+    draw do
+      texture(x || canvas.x, y || canvas.y, width || canvas.width, height || canvas.height) do |command|
+        command.rotation = rotation if rotation
+        command.scale = scale
+      end
+    end
+  end
+end