hyper-console 0.1.0

data/lib/hyper-console.rb

@@ -0,0 +1,14 @@
+require "hyperloop/console/version"
+require 'hyper-store'
+require 'hyper-operation'
+require 'hyperloop/console/hyper_console'
+require 'hyperloop/console/evaluate'
+Hyperloop.import 'hyper-console'
+
+if RUBY_ENGINE == 'opal'
+  require 'hyperloop/console/object_space'
+  require 'securerandom'
+else
+  require 'hyperloop/console/engine'
+  Opal.append_path File.expand_path('../', __FILE__).untaint
+end

data/lib/hyperloop/console/client_components.rb

@@ -0,0 +1,244 @@
+class DebugConsole < Hyperloop::Component
+  param :application_window_id
+  param :context
+  param :title
+
+  state history: [], scope: :shared
+  state console_state: :waiting_for_code, scope: :shared
+
+  class << self
+    attr_accessor :application_window_id
+    attr_accessor :context
+
+    def console_id
+      @console_id ||=
+        (
+          `sessionStorage.getItem('Hyperloop::Console::ConsoleId')` ||
+          SecureRandom.uuid.tap { |id| `sessionStorage.setItem('Hyperloop::Console::ConsoleId', #{id})` }
+        )
+    end
+
+    def ready!(code, compiled_code)
+      @code_to_send = code
+      mutate.error_message nil
+      evaluate compiled_code if @code_to_send =~ /.\n$/
+    end
+
+    def evaluate(compiled_code)
+      @code_to_send = @code_to_send[0..-2]
+      mutate.history << {eval: @code_to_send}
+      mutate.console_state :sending
+      Evaluate.run target_id: application_window_id, sender_id: console_id, context: context, string: compiled_code
+    end
+  end
+
+  after_mount do
+    DebugConsole.application_window_id = params.application_window_id
+    DebugConsole.context = params.context
+    mutate.history(JSON.parse(`sessionStorage.getItem('Hyperloop::Console.history')` || '[]'))
+    `document.title = #{params.title}`
+    `window.scrollTo(window.scrollX, 99999)`
+
+    Response.on_dispatch do |p|
+      next unless p.target_id == DebugConsole.console_id
+      mutate.console_state :waiting_for_code
+      mutate.history << {p.kind => p.message}
+      `sessionStorage.setItem('Hyperloop::Console.history', #{state.history.to_json})`
+    end
+
+  end
+
+  after_update do
+    `window.scrollTo(window.scrollX, 99999)`
+  end
+
+  render(DIV, style: { height: '100vh' }) do
+    # the outer DIV is needed to set fill the window so mouse clicks anywhere
+    # will go to the last line of the editor
+    DIV(class: :card) do
+      state.history.each do |item|
+        CodeHistoryItem(item_type: item.first.first, value: item.first.last || '')
+      end
+      CodeEditor(history: state.history, context: params.context) unless state.console_state == :sending
+    end.on(:mouse_down) do |e|
+      CodeEditor.set_focus
+      e.prevent_default
+    end
+  end
+end
+
+class CodeMirror < Hyperloop::Component
+
+  attr_reader :editor
+
+  after_mount do
+    @editor = `CodeMirror(#{dom_node}, {
+      value: #{@code.to_s},
+      mode: 'text/x-ruby',
+      matchBrackets: true,
+      lineNumbers: false,
+      indentUnit: 2,
+      theme: 'github',
+      readOnly: #{!!@read_only}
+    });`
+  end
+
+  render(DIV)
+
+end
+
+class CodeHistoryItem < CodeMirror
+
+  param :item_type
+  param :value
+
+  def format
+    case params.item_type
+    when :eval
+      params.value
+    when :exception
+      format_lines("!!", params.value)
+    when :result
+      format_lines(">>", params.value)
+    else
+      format_lines("#{params.item_type}:", params.value)
+    end
+  end
+
+  def format_lines(prefix, value)
+    fill = prefix.gsub(/./, ' ')
+    lines = value.split("\n")
+    (["#{prefix} #{lines.shift}"]+lines.collect do |line|
+      "#{fill} #{line}"
+    end).join("\n")
+  end
+
+  def mark_response_lines
+    return if params.item_type == :eval
+    lines = params.value.split("\n")
+    padding = [:exception, :result].include?(params.item_type) ? 3 : 2+params.item_type.to_s.length
+    last_line = lines[-1] || ''
+    `#{@editor}.markText({line: 0, ch: 0}, {line: #{lines.count-1}, ch: #{last_line.length+padding}}, {className: 'response-line'})`
+  end
+
+  before_mount do
+    @code = format
+    @read_only = true
+  end
+
+  after_mount do
+    mark_response_lines
+  end
+
+  render do
+    DIV {}.on(:mouse_down) { |e| e.stop_propagation }
+  end
+
+end
+
+class CodeEditor < CodeMirror
+  param :history
+  param :context
+
+  class << self
+    attr_accessor :editor
+
+    def set_focus
+      editor.set_focus_at_end if editor
+    end
+  end
+
+  before_mount do
+    @history = params.history.collect { |item| item[:eval] }.compact + ['']
+    @history_pos = @history.length-1
+  end
+
+  after_mount do
+    `#{@editor}.on('change', #{lambda {on_change} })`
+    `#{@editor}.on('keydown', #{lambda { |cm, e| on_key_down(cm, e) } })`
+    `#{@editor}.focus()`
+    self.class.editor = self
+  end
+
+  before_unmount do
+    self.class.editor = nil
+  end
+
+  def move_history(n)
+    @history[@history_pos] = `#{@editor}.getValue()`
+    @history_pos += n
+    text = @history[@history_pos]
+    lines = text.split("\n")
+    `#{@editor}.setValue(#{text})`
+
+    after(0) do
+      `window.scrollTo(window.scrollX, 99999)`
+      `#{@editor}.setCursor({line: #{lines.count}, ch: #{(lines.last || '').length}})`
+    end
+  end
+
+  def set_focus_at_end
+    `#{@editor}.focus()`
+    lines = `#{@editor}.getValue()`.split("\n")
+    `#{@editor}.setCursor({line: #{lines.count}, ch: #{(lines.last || '').length}})`
+  end
+
+
+  def on_key_down(cm, e)
+    if `e.metaKey` || `e.ctrlKey`
+      return unless `e.keyCode` == 13
+      `#{@editor}.setValue(#{@editor}.getValue()+#{"\n"})`
+      #on_change
+    elsif `e.key` == 'ArrowUp'
+      move_history(-1) if @history_pos > 0
+    elsif `e.key` == 'ArrowDown'
+      move_history(1) if @history_pos < @history.length-1
+    end
+  end
+
+  def mark_error(message)
+    from, to, title = parse_error(message)
+    @error = `#{@editor}.markText(#{from.to_n}, #{to.to_n}, {className: 'syntax-error', title: title})`
+  end
+
+  def parse_error(message)
+    message = message.split("\n")
+    position_info = message[3].split(':')
+    last_line_number = `#{@editor}.lineCount()`
+    last_line = `#{@editor}.getLine(last_line_number-1)`
+    [
+      {line: 0, ch: 0},
+      {line: last_line_number, ch: last_line.length},
+      message[2].split(':(file)')[0]
+    ]
+  end
+
+  def clear_error
+    `#{@error}.clear()` if @error
+    @error = nil
+  end
+
+  def on_change
+    clear_error
+    code = `#{@editor}.getValue()`
+    if params.context.empty?
+      compiled_code = Opal.compile(code, irb: true)
+    else
+      compiled_code = Opal.compile("#{params.context}.instance_eval {#{code}}")
+    end
+    DebugConsole.ready!(code, compiled_code)
+  rescue Exception => e
+    mark_error(e.message)
+  end
+
+  render do
+    DIV {}.on(:mouse_down) { |e| e.stop_propagation }
+  end
+end
+
+Document.ready? do
+  mount_point = Element["[data-react-class='React.TopLevelRailsComponent']"]
+  mount_point.render do
+    DebugConsole(JSON.parse(mount_point.attr('data-react-props'))[:render_params])
+  end
+end

data/lib/hyperloop/console/engine.rb

@@ -0,0 +1,11 @@
+module Hyperloop
+  module Console
+    module Rails
+      class Engine < ::Rails::Engine
+        initializer "static assets" do |app|
+          app.middleware.use ::ActionDispatch::Static, "#{root}/public"
+        end
+      end
+    end
+  end
+end

data/lib/hyperloop/console/evaluate.rb

@@ -0,0 +1,18 @@
+class Evaluate < Hyperloop::ServerOp
+  param acting_user: nil, nils: true
+  param :target_id
+  param :sender_id
+  param :context
+  param string: nil
+
+  dispatch_to { Hyperloop::Application }
+end
+
+class Response < Hyperloop::ServerOp
+  param acting_user: nil, nils: true
+  param :target_id
+  param :kind
+  param :message
+
+  dispatch_to { Hyperloop::Application }
+end

data/lib/hyperloop/console/hyper-console-client-manifest.rb

@@ -0,0 +1,26 @@
+require 'opal'
+require 'browser/interval'
+require 'browser/delay'
+require 'opal-jquery'
+#require 'reactrb/auto-import'
+module Hyperloop
+  class Component
+    VERSION = "0.12.4"
+  end
+end
+require 'hyper-component'
+require 'hyper-operation'
+require 'hyper-store'
+require 'react/top_level_render'
+require 'opal/compiler'
+require 'active_support'
+require 'securerandom'
+require 'hyperloop/console/evaluate'
+require 'hyperloop/console/sources/codemirror'
+require 'hyperloop/console/sources/jquery-2.1.4'
+require 'hyperloop/console/sources/react'
+require 'hyperloop/console/sources/react-dom'
+require 'hyperloop/console/ruby'
+require 'hyperloop/console/client_components'
+#require 'action_cable'
+require 'hyperloop/pusher'

data/lib/hyperloop/console/hyper_console.rb

@@ -0,0 +1,100 @@
+if RUBY_ENGINE=='opal'
+  module Kernel
+    def console(title: nil, context: nil)
+      Hyperloop::Console.console(title: title, context: context)
+    end
+  end
+
+  module Hyperloop
+    module Console
+      def self.console_id
+        @console_id ||= (
+          `sessionStorage.getItem('Hyperloop::Console::MainWindowId')` ||
+          SecureRandom.uuid.tap { |id| `sessionStorage.setItem('Hyperloop::Console::MainWindowId', #{id})` }
+          )
+      end
+
+      def self.messenger(target_id, kind, m)
+        Response.run(target_id: target_id, kind: kind, message: m.gsub(/\n$/, ''))
+      end
+
+      def self.console(title: nil, context: nil)
+        title ||= context || 'Hyperloop Application Console'
+        title = `encodeURIComponent(#{title})`
+        context = `encodeURIComponent(#{context})`
+        location = "/hyperloop/hyperloop-debug-console/#{console_id}?context=#{context}&title=#{title}"
+        window_params = 'width=640,height=460,scrollbars=no,location=0'
+        `window.open(#{location}, #{"window#{title}"}, #{window_params}).focus()`
+        @__console_dispatcher__ ||= Evaluate.on_dispatch do |params|
+          if params.target_id == console_id
+            cwarn =  `console.warn`
+            clog =   `console.log`
+            cerror = `console.error`
+            cinfo =  `console.info`
+            `console.warn =  function(m) { #{messenger(params.sender_id, :warn,  `m`)} }`
+            `console.log =   function(m) { #{messenger(params.sender_id, :log,   `m`)} }`
+            `console.error = function(m) { #{messenger(params.sender_id, :error, `m`)} }`
+            `console.info =  function(m) { #{messenger(params.sender_id, :info,  `m`)} }`
+            begin
+              message = `eval(#{params.string})`.inspect
+              Response.run(target_id: params.sender_id, kind: :result, message: message || '')
+            rescue Exception => e
+              Response.run(target_id: params.sender_id, kind: :exception, message: e.to_s)
+            ensure
+              `console.warn =  cwarn`
+              `console.log =   clog`
+              `console.error = cerror`
+              `console.info =  cinfo`
+              nil
+            end
+          end
+        end
+        self
+      end
+      `window.hyperconsole = function() { Opal.Opal.$console() }`
+      Hyperloop::Application::Boot.on_dispatch do
+        @console ||= console if `window.HyperloopConsoleAutoStart`
+      end
+    end
+  end
+else
+  module Hyperloop
+    define_setting :console_auto_start, true
+
+    module Console
+      class Config
+        include React::IsomorphicHelpers
+        prerender_footer do |controller|
+          "<script type='text/javascript'>\n"\
+            "window.HyperloopConsoleAutoStart = #{!!Hyperloop.console_auto_start};\n"\
+          "</script>\n"
+        end
+      end
+    end
+
+    ::Hyperloop::Engine.routes.append do
+      Hyperloop.initialize_policies
+
+      HyperloopController.class_eval do
+        def opal_debug_console
+          console_params = { application_window_id: params[:application_window_id], context: params[:context], title: params[:title] }
+          render inline:
+            "<!DOCTYPE html>\n"\
+            "<html>\n"\
+            "  <head>\n"\
+            "    <title>Hyperloop Console Loading...</title>\n"\
+            "    <%= csrf_meta_tags %>\n"\
+            "    <%= stylesheet_link_tag    'hyper-console-client' %>\n"\
+            "    <%= javascript_include_tag 'hyper-console-client.min.js' %>\n"\
+            "    <%= javascript_include_tag 'action_cable' %>\n"\
+            "  </head>\n"\
+            "  <body>\n"\
+            "    <%= react_component '::DebugConsole', #{console_params}, { prerender: false } %>\n"\
+            "  </body>\n"\
+            "</html>\n"
+        end
+      end
+      match 'hyperloop-debug-console/:application_window_id', to: 'hyperloop#opal_debug_console', via: :get
+    end
+  end
+end

data/lib/hyperloop/console/object_space.rb

@@ -0,0 +1,53 @@
+class Object
+  def self.instance
+    ObjectSpace.objects(self).tap do |arr|
+      arr.define_singleton_method(:console) { |*args| method_missing(:console, *args) }
+      klass = self
+      arr.define_singleton_method(:method_missing) do |method, *args, &block|
+        if length > 1 && self[0].respond_to?(method)
+          raise "Ambiguous #{klass}.instance.#{method} application.\n"\
+          "There are #{length} instances of #{klass}.\n"\
+          "You can either apply #{method} to a specific instance using #{klass}.instance[x].#{method};\n"\
+          "or use an enumerator method like each or collect."
+        elsif length == 0
+          raise "There are no #{klass} instances."
+        else
+          self[0].send(method, *args, &block)
+        end
+      end
+    end
+  end
+end
+
+module ObjectSpace
+  def self.objects(klass)
+    objs = []
+    matching_objs = []
+    %x{
+      var walk_the_object = function(js_obj) {
+        var keys = Object.keys(js_obj) //get all own property names of the object
+
+        keys.forEach( function ( key ) {
+          if ( key != '$$proto' ) {
+            var value = js_obj[ key ]; // get property value
+
+            // if the property value is an object...
+            if ( value && typeof value === 'object'  ) {
+
+                // if we don't have this reference, and its an object of the class we want
+                if ( #{objs}.indexOf( value ) < 0 ) {
+                    #{objs}.push( value ); // store the reference
+                    if ( Object.keys(value).indexOf('$$id') >= 0 && value.$$class == #{klass} ) {
+                      #{matching_objs}.push ( value )
+                    }
+                    walk_the_object(value) // traverse all its own properties
+                }
+            }
+          }
+        })
+      }
+      walk_the_object(window)
+    }
+    matching_objs
+  end
+end