opal-irb 0.7.0

data/.gitignore

@@ -0,0 +1,3 @@
+build
+.idea
+*~

data/.ruby-gemset

@@ -0,0 +1 @@
+opal_irb

data/.ruby-version

@@ -0,0 +1 @@
+1.9.3-p545

data/Gemfile

@@ -0,0 +1,14 @@
+source 'https://rubygems.org'
+gemspec
+
+gem 'opal', :git => "git://github.com/opal/opal.git"
+gem 'opal-jquery', :git => "git://github.com/opal/opal-jquery.git"
+gem 'opal-browser', :git => "git://github.com/opal/opal-browser.git"
+gem 'opal-rspec', :git => "git://github.com/opal/opal-rspec.git"
+
+gem 'guard'
+gem 'guard-process'
+gem 'rake'
+gem 'rb-fsevent'
+
+gem 'terminal-notifier'

data/Gemfile.lock

@@ -0,0 +1,113 @@
+GIT
+  remote: git://github.com/opal/opal-browser.git
+  revision: dff179fd08b44d19b6558aa7c429e1cee4770487
+  specs:
+    opal-browser (0.2.0.beta1)
+      opal
+      paggio
+
+GIT
+  remote: git://github.com/opal/opal-jquery.git
+  revision: 6d864fb0dfa0a5cd399f1a46bfa2e24fcb257768
+  specs:
+    opal-jquery (0.3.0)
+      opal (~> 0.7.0)
+
+GIT
+  remote: git://github.com/opal/opal-rspec.git
+  revision: ef2a7b0b969c06617ebbf3f17fc73d7af2363f94
+  specs:
+    opal-rspec (0.4.1)
+      opal (~> 0.7.0)
+
+GIT
+  remote: git://github.com/opal/opal.git
+  revision: 8acef558986dbb4471c6060857c1693302d6293b
+  specs:
+    opal (0.7.1)
+      hike (~> 1.2)
+      sourcemap (~> 0.1.0)
+      sprockets (>= 2.2.3, < 4.0.0)
+      tilt (~> 1.4)
+
+PATH
+  remote: .
+  specs:
+    opal-irb (0.7.0)
+      opal (~> 0.7.0)
+      opal-jquery
+
+GEM
+  remote: https://rubygems.org/
+  specs:
+    celluloid (0.16.0)
+      timers (~> 4.0.0)
+    coderay (1.1.0)
+    ffi (1.9.8)
+    formatador (0.2.5)
+    guard (2.12.5)
+      formatador (>= 0.2.4)
+      listen (~> 2.7)
+      lumberjack (~> 1.0)
+      nenv (~> 0.1)
+      notiffany (~> 0.0)
+      pry (>= 0.9.12)
+      shellany (~> 0.0)
+      thor (>= 0.18.1)
+    guard-compat (1.2.1)
+    guard-process (1.2.1)
+      guard-compat (~> 1.2, >= 1.2.1)
+      spoon (~> 0.0.1)
+    hike (1.2.3)
+    hitimes (1.2.2)
+    listen (2.9.0)
+      celluloid (>= 0.15.2)
+      rb-fsevent (>= 0.9.3)
+      rb-inotify (>= 0.9)
+    lumberjack (1.0.9)
+    method_source (0.8.2)
+    multi_json (1.11.0)
+    nenv (0.2.0)
+    notiffany (0.0.6)
+      nenv (~> 0.1)
+      shellany (~> 0.0)
+    paggio (0.2.4)
+    pry (0.10.1)
+      coderay (~> 1.1.0)
+      method_source (~> 0.8.1)
+      slop (~> 3.4)
+    rack (1.6.0)
+    rake (10.4.2)
+    rb-fsevent (0.9.4)
+    rb-inotify (0.9.5)
+      ffi (>= 0.5.0)
+    shellany (0.0.1)
+    slop (3.6.0)
+    sourcemap (0.1.1)
+    spoon (0.0.4)
+      ffi
+    sprockets (2.12.3)
+      hike (~> 1.2)
+      multi_json (~> 1.0)
+      rack (~> 1.0)
+      tilt (~> 1.1, != 1.3.0)
+    terminal-notifier (1.6.2)
+    thor (0.19.1)
+    tilt (1.4.1)
+    timers (4.0.1)
+      hitimes
+
+PLATFORMS
+  ruby
+
+DEPENDENCIES
+  guard
+  guard-process
+  opal!
+  opal-browser!
+  opal-irb!
+  opal-jquery!
+  opal-rspec!
+  rake
+  rb-fsevent
+  terminal-notifier

data/Guardfile

@@ -0,0 +1,5 @@
+require 'guard/guard'
+
+guard "process", :name => "Opal", :command => "rake" do
+  watch /(opal|spec)\/.+\.rb/
+end

data/LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2013 Forrest K. Chang
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

data/README.md

@@ -0,0 +1,175 @@
+opal-irb
+=========
+
+irb (interactive ruby) for Opal (Ruby running on javascript).  This is
+interactive console (REPL) on a webpage. Good for testing Opal/ruby
+interactively without having to install anything.  Intended to be part
+of a browser based interactive development tool for Opal
+
+Try it here: http://fkchang.github.io/opal-irb/index-jq.html
+
+Embedded example http://fkchang.github.io/opal-irb/index-embeddable.html
+
+Original https://github.com/larryng/coffeescript-repl based port http://fkchang.github.io/opal-irb/index-homebrew.html
+
+
+Instructional Media
+-------------------
+
+Videos:
+* Overview, no sound http://www.youtube.com/watch?v=6hUwN5BdSHo
+* Demo of 1st cut of tab completion  https://youtu.be/mQTulgBm5Nk
+
+Blogposts:
+* Thorough overview of features including embedded iframe examples of such http://funkworks.blogspot.com/2015/08/an-overview-of-opal-irbs-features.html
+
+Presentations:
+* Overview of features based on above blogpost (reveal.js exported by org-mode doc in doc/presentations directory)
+http://fkchang.github.io/opal-irb/doc/presentations/opal_irb_overview.html
+
+Features
+--------
+
+* Opal irb in your browser
+* Command history - up/down arrows, ctrl-n/ctrl-p
+* Multiline support - ctrl-m to enter editor, ctrl-Enter to submit code
+* Colorized output
+* Access last returned value via $_
+* Shareable code links like [this](http://fkchang.github.io/opal-irb/index-jq.html#code:class%20Welcome%0A%20%20def%20announce%0A%20%20%20%20alert%20%22Welcome%20to%20opal-irb%22%0A%20%20end%0Aend%0Aw%20%3D%20Welcome.new%0Aw.announce)
+  * create links by hitting ctrl-L and the lines/multilines will be made into a shareable link
+  * also can create links using the history number, i.e. irb\_link\_for 2
+* Emacs keystrokes like all GNU readline apps (original irb included)
+* 100% HTML and JavaScript
+
+HOW TOS
+-------
+
+## Embedding into opal apps
+
+### Lissio
+
+Embedding into lissio app, as made by lissio new
+
+* add to Gemfile opal-irb
+```ruby
+    gem 'opal-irb', github: 'fkchang/opal-irb'
+```
+* invoke app to require opal-jquery and opal-irb
+```bash
+lissio start --require opal-irb
+```
+* add a helper which includes the jquery and codemirror requirements
+
+```html
+ <%= OpalIrbUtils.include_opal_irb_jqconsole_requirements %>
+```
+
+* change the require in app/app.rb -- order matters, at the moment to have opal-jquery and opal-browser coexist you need to load opal-jquery before loading lissio
+```ruby
+require 'opal'
+require 'jqconsole'                     # add these 3 jqconsole support
+require 'opal_irb_jqconsole_css'        # css for opal_irb_jqconsole_css
+require 'opal_irb_jqconsole'            # the console code
+require 'lissio'
+
+```
+* override Application#start() to create a button and hook up opal-irb
+```ruby
+  def start
+    super
+    element << DOM do
+      button.show_irb! "Show Irb"
+    end
+
+    OpalIrbJqconsole.create_bottom_panel
+    OpalIrbJqconsole.add_open_panel_behavior("show_irb")
+  end
+
+```
+
+* profit!
+
+### Rails
+* setup Rails app for opal use via https://github.com/opal/opal-rails
+* add to Gemfile opal-irb, jquery-ui-rails (for multi editor)
+```ruby
+    gem 'opal-irb', github: 'fkchang/opal-irb', require: 'opal-irb-rails'
+    gem 'jquery-ui-rails'
+```
+* include stylesheets in application.css.scss
+```scss
+/*= require_self
+ *= require jquery-ui/dialog
+ *= require opal-irb/jqconsole
+ */
+```
+* include jquery UI dialog in application.js
+```js
+//= require jquery-ui/dialog
+```
+
+* include codemirror js/css, you can pull from CDN w/the below in your template (haml example below)
+```haml
+= OpalIrbUtils.include_code_mirror.html_safe
+```
+
+* Set it up in opal code
+
+  * Example that creates a bottom panel, a button to bring it up
+```ruby
+    require 'opal_irb_jqconsole'
+
+    # opal-browser code to add a button
+    $document["#workarea"] << DOM do
+      button.show_irb! "Show Irb"
+    end
+    # opal-jquery code to add a button
+    Element.find(".main").append "<button class='btn' id='show_irb'>Show Irb</button>"
+
+    # creates a panel at the bottom
+    OpalIrbJqconsole.create_bottom_panel(hidden=true)
+    # adds open panel behavior to element w/id show_irb
+    OpalIrbJqconsole.add_open_panel_behavior("show_irb")
+```
+
+* Example that creates a bottom panel, makes a hot key "shift-command-c" to toggle the panel
+
+```ruby
+    OpalIrbJqconsole.create_bottom_panel(hidden=true)
+    OpalIrbJqconsole.add_hot_key_panel_behavior(modifiers: %w(meta shift), key: "c")
+
+```
+
+* profit!
+
+Dependencies
+------------
+
+* opal -  of course
+* opal-jquery (would like to do away with this, don't need it)
+  * jquery (cuz of the above)
+  * jquery-ui dialog - for the code dial
+* code mirror - for code editing
+* opal-browser (so you can use it from opal-irb) OPTIONAL, it's used in the examples but it can be deployed without opal-browser, esp. since Rails defaults to using jquery and opal-browser and opal-jquery have a lot of overlap, and some small conflicts
+
+Version Scheme
+--------------
+While in my mind there are a lot of things that keep opal-irb at not yet suitable to be a gem/ 0.1.0 version number, I frequently have to change code to support the latest minor release for Opal, so I think I need to adopt a scheme that tracks such.  So the 1st gem release will be 0.7.0, to indicate compatibility with 0.7.* versions of opal, followed fairly quickly with a 0.8.0 release to match 0.8.0 the current version (at time of writing) of opal.
+
+Roadmap
+-------
+* Figure out how to keep variables -- DONE 6/10/2013, thx @adambeynon
+* have it automatically know when a complete ruby expression is there instead of multi line mode like irb -- CLOSE ENOUGH 6/21/2013 via jqconsole
+* Make a gem - DONE 6/23/2013 1st for use in opal-inspector
+* Hook into smalltalk style object browser for opal that I plan to write - STARTED
+* Some demos to show how convenient it can be - DONE 7/19/2013 - you tube video overview
+* Add more irb/pry functionality
+  * tab completion
+  * cd ls
+  * show source via source maps and opal-inspector
+* Make embeddable in any app STARTED 7/30/2013, made embeddable into lisso 2/4/2014
+* print out inspect in ruby format
+* Rails plugin - WORK done on 8/27/14, works w/opal rails and assets, need to document
+* navigate stacktrace code via source maps
+* remove jquery dependancy -- need to convert jqconsole, and remove the the jquery-ui dialog
+* split up dependancy and hierarchy, jquery and jquery free versions, rails vs no rails, etc.

data/Rakefile

@@ -0,0 +1,65 @@
+require 'bundler/gem_tasks'
+require 'bundler'
+Bundler.require
+
+require 'opal'
+require 'opal-rspec'
+require 'opal/sprockets/environment'
+
+require 'opal/rspec/rake_task'
+Opal::RSpec::RakeTask.new(:default)
+
+desc "build irb with homebrew console"
+task :build_homebrew_console do
+  File.open("compiled/application.js", "w+") do |out|
+    Opal::Processor.source_map_enabled = false
+    env = Opal::Environment.new
+    env.append_path "examples"
+    env.append_path "opal"
+    out << env["application"].to_s
+  end
+  system "open -a 'Google Chrome' index-homebrew.html"
+end
+
+desc "build jqconsole based irb"
+task :build_jqconsole do
+
+  File.open("compiled/app-jqconsole.js", "w+") do |out|
+    env = Opal::Environment.new
+    env.append_path "examples"
+    env.append_path "opal"
+    out << env["app-jqconsole"].to_s
+  end
+  # system "terminal-notifier -title 'opal-irb build' -message 'js file built'"
+  system "open -a 'Google Chrome' index-jq.html"
+end
+
+desc "build embeddable irb"
+task :build_embeddable do
+
+  File.open("compiled/app-embeddable.js", "w+") do |out|
+    env = Opal::Environment.new
+    env.append_path "examples"
+    env.append_path "opal"
+    out << env["app-embeddable"].to_s
+  end
+  # system "terminal-notifier -title 'opal-irb build' -message 'js file built'"
+  system "open -a 'Google Chrome' index-embeddable.html"
+end
+
+desc "build PhantomJS based repl"
+
+task :build_phantomjs do
+  File.open("compiled/opal-phantom.js", "w+") do |out|
+    env = Opal::Environment.new
+    env.append_path "opal"
+    out << env["opal_phantomjs"].to_s
+  end
+end
+
+
+desc "build all the example apps and view them"
+task :build_all => [:build_homebrew_console, :build_jqconsole, :build_embeddable]
+desc "shortcut for build embeddable, cuz I'm lazy"
+task :build_e => :build_embeddable
+#task :default => :build_jqconsole

data/Roadmap.org

@@ -0,0 +1,17 @@
+* Remove jquery dependency
+- [ ] Remove jquery-ui dialog
+- [ ] rewrite jq-console
+* Smalltalk inspired
+- [ ] create/proceed from nomethod error
+- [ ] create/proceed from undefined constant
+- [ ] method search (take in params and get result)
+
+* Lisp Machine inspired
+- [ ] right click edit of text
+- [ ] edit objects from command line
+
+* Other
+- [ ] . tab completion
+- [X] irb var tab completion
+- [X] constant tab completion
+- [X] free standing method completion

data/app/assets/stylesheets/opal-irb/jqconsole.css

@@ -0,0 +1,263 @@
+#opal-irb-console-bottom-panel {
+  width: 100%;
+  position: fixed;
+  bottom: 0px;
+}
+#opal-irb-console-topbar {
+  height:24px;
+}
+#opal-irb-console {
+  height: 400px;
+  position:relative;
+  background-color: #9b111e;
+  border: 2px solid #CCC;
+  margin: 0 auto;
+}
+.jqconsole-ansi-bold {
+  font-weight: bold!important;
+}
+
+.jqconsole-ansi-lighter {
+  font-weight: lighter!important;
+}
+
+.jqconsole-ansi-italic {
+  font-style: italic!important;
+}
+
+.jqconsole-ansi-underline {
+  text-decoration: underline!important;
+}
+
+@-webkit-keyframes blinker {
+  from { opacity: 1.0; }
+  to { opacity: 0.0; }
+}
+
+@-moz-keyframes blinker {
+  from { opacity: 1.0; }
+  to { opacity: 0.0; }
+}
+
+@-ms-keyframes blinker {
+  from { opacity: 1.0; }
+  to { opacity: 0.0; }
+}
+
+@-o-keyframes blinker {
+  from { opacity: 1.0; }
+  to { opacity: 0.0; }
+}
+
+.jqconsole-ansi-blink {
+  -webkit-animation-name: blinker;
+  -moz-animation-name: blinker;
+  -ms-animation-name: blinker;
+  -o-animation-name: blinker;
+  -webkit-animation-iteration-count: infinite;
+  -moz-animation-iteration-count: infinite;
+  -ms-animation-iteration-count: infinite;
+  -o-animation-iteration-count: infinite;
+  -webkit-animation-timing-function: cubic-bezier(1.0,0,0,1.0);
+  -ms-animation-timing-function: cubic-bezier(1.0,0,0,1.0);
+  -o-animation-timing-function: cubic-bezier(1.0,0,0,1.0);
+  -moz-animation-timing-function: cubic-bezier(1.0,0,0,1.0);
+  -webkit-animation-duration: 1s;
+  -moz-animation-duration: 1s;
+  -o-animation-duration: 1s;
+  -ms-animation-duration: 1s;
+}
+
+.jqconsole-ansi-blink-rapid {
+  -webkit-animation-name: blinker;
+  -moz-animation-name: blinker;
+  -ms-animation-name: blinker;
+  -o-animation-name: blinker;
+  -webkit-animation-iteration-count: infinite;
+  -moz-animation-iteration-count: infinite;
+  -ms-animation-iteration-count: infinite;
+  -o-animation-iteration-count: infinite;
+  -webkit-animation-timing-function: cubic-bezier(1.0,0,0,1.0);
+  -ms-animation-timing-function: cubic-bezier(1.0,0,0,1.0);
+  -o-animation-timing-function: cubic-bezier(1.0,0,0,1.0);
+  -moz-animation-timing-function: cubic-bezier(1.0,0,0,1.0);
+  -webkit-animation-duration: 0.5s;
+  -moz-animation-duration: 0.5s;
+  -o-animation-duration: 0.5s;
+  -ms-animation-duration: 0.5s;
+}
+
+
+.jqconsole-ansi-hidden {
+  visibility:hidden!important;
+}
+
+.jqconsole-ansi-line-through {
+  text-decoration: line-through;
+}
+
+.jqconsole-ansi-fonts-1 {
+
+}
+.jqconsole-ansi-fonts-2 {
+
+}
+.jqconsole-ansi-fonts-3 {
+
+}
+.jqconsole-ansi-fonts-4 {
+
+}
+.jqconsole-ansi-fonts-5 {
+
+}
+.jqconsole-ansi-fonts-6 {
+
+}
+.jqconsole-ansi-fonts-7 {
+
+}
+.jqconsole-ansi-fonts-8 {
+
+}
+.jqconsole-ansi-fonts-9 {
+
+}
+
+.jqconsole-ansi-fraktur {
+
+}
+
+.jqconsole-ansi-color-black {
+  color: black!important;
+}
+.jqconsole-ansi-color-red {
+  color: red!important;
+}
+.jqconsole-ansi-color-green {
+  color: green!important;
+}
+.jqconsole-ansi-color-yellow {
+  color: yellow!important;
+}
+.jqconsole-ansi-color-blue {
+  color: blue!important;
+}
+.jqconsole-ansi-color-magenta {
+  color: magenta!important;
+}
+.jqconsole-ansi-color-cyan {
+  color: cyan!important;
+}
+.jqconsole-ansi-color-white {
+  color: white!important;
+}
+
+.jqconsole-ansi-background-color-black {
+  background-color: black!important;
+}
+.jqconsole-ansi-background-color-red {
+  background-color: red!important;
+}
+.jqconsole-ansi-background-color-green {
+  background-color: green!important;
+}
+.jqconsole-ansi-background-color-yellow {
+  background-color: yellow!important;
+}
+.jqconsole-ansi-background-color-blue {
+  background-color: blue!important;
+}
+.jqconsole-ansi-background-color-magenta {
+  background-color: magenta!important;
+}
+.jqconsole-ansi-background-color-cyan {
+  background-color: cyan!important;
+}
+.jqconsole-ansi-background-color-white {
+  background-color: white!important;
+}
+
+.jqconsole-ansi-framed {
+  border: 1px solid!important;
+}
+.jqconsole-ansi-overline {
+  text-decoration: overline!important;
+}
+
+
+#opal-irb-console-bottom-panel {
+  margin: 0;
+  padding: 0;
+  background-color: #333;
+  color: white;
+  font-family: monospace;
+  width: 98%;
+  position: fixed;
+  bottom: 0px;
+}
+#opal-irb-console-topbar {
+  height:24px;
+}
+#opal-irb-console {
+  height: 400px;
+  position:relative;
+  background-color: #9b111e;
+  border: 2px solid #CCC;
+  margin: 0 auto;
+}
+.jqconsole {
+  padding: 10px;
+  padding-bottom: 10px;
+}
+.jqconsole-cursor {
+  background-color: #999;
+}
+.jqconsole-blurred .jqconsole-cursor {
+  background-color: #666;
+}
+.jqconsole-prompt {
+  color: #0d0;
+}
+.jqconsole-old-prompt {
+  color: #0b0;
+  font-weight: normal;
+}
+.jqconsole-input {
+  color: #dd0;
+}
+.jqconsole-old-input {
+  color: #bb0;
+  font-weight: normal;
+}
+.brace {
+  color: #00FFFF;
+}
+.paran {
+  color: #FF00FF;
+}
+.bracket {
+  color: #FFFF00;
+}
+.jqconsole-composition {
+  background-color: red;
+}
+
+span.boxclose, a.boxclose{
+  float:right;
+  cursor:pointer;
+  color: #fff;
+  border: 1px solid #AEAEAE;
+  border-radius: 30px;
+  background: red;
+  font-family: helvetica;
+  font-size: 20px;
+  font-weight: bold;
+  display: inline-block;
+  line-height: 0px;
+  padding: 11px 3px;
+}
+
+.boxclose:before {
+  content: "x";
+}