opal-irb 0.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- data/.gitignore +3 -0
- data/.ruby-gemset +1 -0
- data/.ruby-version +1 -0
- data/Gemfile +14 -0
- data/Gemfile.lock +113 -0
- data/Guardfile +5 -0
- data/LICENSE +21 -0
- data/README.md +175 -0
- data/Rakefile +65 -0
- data/Roadmap.org +17 -0
- data/app/assets/stylesheets/opal-irb/jqconsole.css +263 -0
- data/compiled/app-embeddable.js +39765 -0
- data/compiled/app-jqconsole.js +39767 -0
- data/compiled/application.js +27399 -0
- data/css/ansi.css +172 -0
- data/css/opal_irb_jqconsole.css +79 -0
- data/css/show-hint.css +38 -0
- data/doc/presentations/opal_irb_overview.html +678 -0
- data/doc/presentations/opal_irb_overview.org +448 -0
- data/examples/app-embeddable.rb +8 -0
- data/examples/app-jqconsole.rb +10 -0
- data/examples/application.rb +8 -0
- data/index-embeddable.html +29 -0
- data/index-homebrew.html +115 -0
- data/index-jq.html +80 -0
- data/js/anyword-hint.js +44 -0
- data/js/jqconsole.js +1583 -0
- data/js/nodeutil.js +546 -0
- data/js/ruby.js +285 -0
- data/js/show-hint.js +383 -0
- data/lib/opal-irb/rails_engine.rb +3 -0
- data/lib/opal-irb/version.rb +3 -0
- data/lib/opal-irb-rails.rb +2 -0
- data/lib/opal-irb.rb +44 -0
- data/opal/object_extensions.rb +20 -0
- data/opal/opal_irb/completion_engine.rb +202 -0
- data/opal/opal_irb/completion_formatter.rb +49 -0
- data/opal/opal_irb/completion_results.rb +88 -0
- data/opal/opal_irb.rb +88 -0
- data/opal/opal_irb_homebrew_console.rb +398 -0
- data/opal/opal_irb_jqconsole.rb +517 -0
- data/opal/opal_irb_jqconsole_css.rb +259 -0
- data/opal/opal_irb_log_redirector.rb +32 -0
- data/opal/opal_phantomjs.rb +49 -0
- data/opal-irb.gemspec +20 -0
- data/spec/code_link_handler_spec.rb +30 -0
- data/spec/jquery.js +5 -0
- data/spec/object_extensions_spec.rb +32 -0
- data/spec/opal_irb/completion_engine_spec.rb +204 -0
- data/spec/opal_irb/completion_results_spec.rb +32 -0
- data/spec/opal_irb_log_director_spec.rb +19 -0
- data/spec/opal_irb_spec.rb +19 -0
- data/spec/spec_helper.rb +1 -0
- metadata +151 -0
@@ -0,0 +1,448 @@
|
|
1
|
+
#+Title: Overview of Opal-IRB features
|
2
|
+
#+Author: Forrest Chang
|
3
|
+
#+Email: fkchang2000@yahoo.com
|
4
|
+
#+REVEAL_ROOT: http://cdn.jsdelivr.net/reveal.js/3.0.0/
|
5
|
+
#+OPTIONS: num:nil toc:nil
|
6
|
+
* Reason for the talk
|
7
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
8
|
+
#+ATTR_HTML: :target "_blank"
|
9
|
+
- [[https://github.com/fkchang/opal-irb/blob/master/README.md][opal-irb]] has many features
|
10
|
+
- Most don't know about them
|
11
|
+
- Hence this talk (based on http://funkworks.blogspot.com/2015/08/an-overview-of-opal-irbs-features.html)
|
12
|
+
|
13
|
+
|
14
|
+
* What is opal-irb?
|
15
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
16
|
+
- https://github.com/fkchang/opal-irb
|
17
|
+
- An in browser REPL (read eval print loop)
|
18
|
+
- Aims to be the opal equivalent of Ruby's irb (interactive ruby), and pry
|
19
|
+
- A tool in which you can play with Ruby any time you have access to a browser
|
20
|
+
|
21
|
+
|
22
|
+
* 3 Sections
|
23
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
24
|
+
1. What opal-irb has in common with irb
|
25
|
+
2. How opal-irb differs from irb
|
26
|
+
3. Features unique to opal-irb
|
27
|
+
|
28
|
+
* 1) In Common with irb
|
29
|
+
|
30
|
+
** Terminal Emulation (of sorts)
|
31
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
32
|
+
- irb - terminal formatting
|
33
|
+
- opal-irb, via a jqconsole fork, supports some ANSI formatting code
|
34
|
+
|
35
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
36
|
+
Example
|
37
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
38
|
+
#+BEGIN_SRC ruby
|
39
|
+
puts "\033[31mRed Text"
|
40
|
+
#+END_SRC
|
41
|
+
|
42
|
+
*** ANSI colors In browser
|
43
|
+
#+BEGIN_HTML
|
44
|
+
<iframe width="100%" height="500" src="http://git.io/vmQVY" frameborder="0" allowfullscreen></iframe>
|
45
|
+
#+END_HTML
|
46
|
+
|
47
|
+
** History up down history
|
48
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
49
|
+
- Like irb, opal-irb stores a history of previous statements.
|
50
|
+
- Navigate this history with the up/down arrows
|
51
|
+
- or use the "GNU readline commands".
|
52
|
+
|
53
|
+
*** GNU readline commands (emacs subset)
|
54
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
55
|
+
- A subset of the gnu readline manipulation is supported.
|
56
|
+
- Will likely add more support over time.
|
57
|
+
- The currently supported bindings are:
|
58
|
+
|
59
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
60
|
+
#+BEGIN_SRC
|
61
|
+
Up/Down Arrow and ctrl-p/ctrl-n: Navigate through history
|
62
|
+
ctrl-a: Beginning of line
|
63
|
+
ctrl-e: End of line
|
64
|
+
ctrl-b: Back 1 character
|
65
|
+
ctrl-f: Forward 1 character
|
66
|
+
ctrl-d: Delete 1 character
|
67
|
+
ctrl-k: Kill to the end of the line
|
68
|
+
alt-b: Back 1 word
|
69
|
+
alt-f: Forward 1 word
|
70
|
+
alt-d: Delete 1 word
|
71
|
+
#+END_SRC
|
72
|
+
|
73
|
+
** Autocomplete
|
74
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
75
|
+
- A work-in-progress
|
76
|
+
- Same tab completion model that irb does. It looks like this:
|
77
|
+
|
78
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
79
|
+
#+BEGIN_SRC
|
80
|
+
opal> S<tab>
|
81
|
+
STDERR STDIN STDOUT ScriptError Set
|
82
|
+
SignalException StandardError StopIteration String StringIO
|
83
|
+
StringScanner Struct Symbol SyntaxError SystemCallError
|
84
|
+
SystemExit
|
85
|
+
#+END_SRC
|
86
|
+
|
87
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
88
|
+
#+BEGIN_SRC
|
89
|
+
opal> ST<tab>
|
90
|
+
STDERR STDIN STDOUT
|
91
|
+
#+END_SRC
|
92
|
+
|
93
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
94
|
+
#+BEGIN_SRC
|
95
|
+
opal> STDI<tab>
|
96
|
+
#+END_SRC
|
97
|
+
|
98
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
99
|
+
#+BEGIN_SRC
|
100
|
+
opal> STDIN
|
101
|
+
#+END_SRC
|
102
|
+
|
103
|
+
** Live Autocomplete demo
|
104
|
+
#+BEGIN_HTML
|
105
|
+
<iframe width="100%" height="500" src="http://fkchang.github.io/opal-irb/index-jq.html" frameborder="0" allowfullscreen></iframe>
|
106
|
+
#+END_HTML
|
107
|
+
|
108
|
+
|
109
|
+
** Multi Line Input
|
110
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
111
|
+
- You can type multiple lines until your entry is complete.
|
112
|
+
- Incomplete lines shown with leading periods:
|
113
|
+
|
114
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
115
|
+
#+BEGIN_SRC
|
116
|
+
Welcome to Opal 0.7.1
|
117
|
+
type help for assistance
|
118
|
+
opal> class Foo
|
119
|
+
... def bar
|
120
|
+
... :bar
|
121
|
+
... end
|
122
|
+
... end
|
123
|
+
=> "bar"
|
124
|
+
opal>
|
125
|
+
|
126
|
+
#+END_SRC
|
127
|
+
|
128
|
+
|
129
|
+
* 2) Different than irb
|
130
|
+
|
131
|
+
** Last value returned - irb
|
132
|
+
In irb the last value returned is stored in _ variable:
|
133
|
+
|
134
|
+
#+BEGIN_SRC
|
135
|
+
2.2.1 :001 > 2 * 3
|
136
|
+
=> 6
|
137
|
+
2.2.1 :002 > puts _
|
138
|
+
6
|
139
|
+
=> nil
|
140
|
+
2.2.1 :003 >
|
141
|
+
#+END_SRC
|
142
|
+
|
143
|
+
** Opal-irb
|
144
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
145
|
+
- Last value is stored as $_.
|
146
|
+
- Departs due to technical reasons
|
147
|
+
- Would like to make it the same
|
148
|
+
|
149
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
150
|
+
#+BEGIN_SRC
|
151
|
+
opal> 2 * 3
|
152
|
+
=> 6
|
153
|
+
opal> puts $_
|
154
|
+
6
|
155
|
+
=> nil
|
156
|
+
opal>
|
157
|
+
#+END_SRC
|
158
|
+
|
159
|
+
** Help command
|
160
|
+
|
161
|
+
*** irb
|
162
|
+
|
163
|
+
Help in irb allows you to lookup documentation for methods via ri and rdoc docs.
|
164
|
+
|
165
|
+
#+BEGIN_SRC
|
166
|
+
2.0.0-p247 :001 > help
|
167
|
+
|
168
|
+
Enter the method name you want to look up.
|
169
|
+
You can use tab to autocomplete.
|
170
|
+
Enter a blank line to exit.
|
171
|
+
|
172
|
+
>>
|
173
|
+
#+END_SRC
|
174
|
+
|
175
|
+
*** Opal-irb
|
176
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
177
|
+
- Opal-irb's help shows how to operate opal-irb.
|
178
|
+
- Help for method lookup to be done in a different fashion.
|
179
|
+
|
180
|
+
*** Current help command output
|
181
|
+
#+BEGIN_SRC
|
182
|
+
opal> help
|
183
|
+
help: This text
|
184
|
+
$_ last value returned is stored in this global
|
185
|
+
history: Shows history
|
186
|
+
irb_link_for history_num: Create a link for the code in the history
|
187
|
+
ctrl-c: Abort prompt
|
188
|
+
ctrl-m: Pop up multi-line editor
|
189
|
+
ctrl-Enter: Submit code in multi-line editor
|
190
|
+
ctrl-l: Creates a link with the code you have on the current line/lines
|
191
|
+
|
192
|
+
EDITOR FUNCTIONALITY
|
193
|
+
Up/Down Arrow and ctrl-p/ctrl-n: Navigate through history
|
194
|
+
ctrl-a: Beginning of line
|
195
|
+
ctrl-e: End of line
|
196
|
+
ctrl-b: Back 1 character
|
197
|
+
ctrl-f: Forward 1 character
|
198
|
+
ctrl-d: Delete 1 character
|
199
|
+
ctrl-k: Kill to the end of the line
|
200
|
+
alt-b: Back 1 word
|
201
|
+
alt-f: Forward 1 word
|
202
|
+
alt-d: Delete 1 word
|
203
|
+
=> nil
|
204
|
+
|
205
|
+
#+END_SRC
|
206
|
+
|
207
|
+
* 3) Beyond irb
|
208
|
+
|
209
|
+
There are number of things that opal-irb does that irb does not:
|
210
|
+
|
211
|
+
|
212
|
+
** "Live gist", create a link w/code
|
213
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
214
|
+
- Create a link with =ctl-l= (=l= for =link=),
|
215
|
+
- Link will be displayed above the line in question.
|
216
|
+
- Scroll through history, hit =ctl-l= to give history for that line
|
217
|
+
|
218
|
+
*** Live gist
|
219
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
220
|
+
- Like a gist, it's shareable bit of code.
|
221
|
+
- Unlike a gist, it's "live code"
|
222
|
+
- Live gist can be shared in any real app that has opal-irb embedded.
|
223
|
+
- Already used this in a production codebase to duplicate a bug condition for a coworker to debug.
|
224
|
+
- All embedded opal-irb's on this prensentation are all done via "live gist."
|
225
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
226
|
+
- For example, the red text printing example eariler
|
227
|
+
|
228
|
+
** Enhanced History
|
229
|
+
*** History Command (like shells have, bash, etc.)
|
230
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
231
|
+
- You can type =history= at the prompt to get a listing of your history.
|
232
|
+
- Shows listing of the code you've typed in including line numbers.
|
233
|
+
|
234
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
235
|
+
#+BEGIN_SRC
|
236
|
+
opal> history
|
237
|
+
1: class Foo
|
238
|
+
def bar
|
239
|
+
:bar
|
240
|
+
end
|
241
|
+
end
|
242
|
+
2: f = Foo.new
|
243
|
+
3: f.bar
|
244
|
+
4: history
|
245
|
+
=> nil
|
246
|
+
opal>
|
247
|
+
#+END_SRC
|
248
|
+
|
249
|
+
*** Link for History
|
250
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
251
|
+
- Alternate to navigating through history and typing =ctrl-l=
|
252
|
+
- Use =irb_link_for= command with the history number
|
253
|
+
- Different from =jsbin=, =jsfiddle=, etc.
|
254
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
255
|
+
- Experiment and have several "live gists"
|
256
|
+
- Matches repl-based experimentation.
|
257
|
+
|
258
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
259
|
+
#+BEGIN_SRC
|
260
|
+
irb_link_for <history_num>
|
261
|
+
#+END_SRC
|
262
|
+
|
263
|
+
|
264
|
+
** Multiline edit
|
265
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in roll-in roll-in roll-in roll-in)
|
266
|
+
- irb's multi-line edit can be cumbersome if you make a mistake
|
267
|
+
- I've made many
|
268
|
+
- Need to =ctrl-c= and start over
|
269
|
+
- opal-irb has multi-line editor support.
|
270
|
+
- Invoke with =ctrl-m= (m for the multi-line editor)
|
271
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
272
|
+
- Pops up editor window will pop up with the code on the prompt.
|
273
|
+
- Has syntax highlighting
|
274
|
+
- Auto indenting
|
275
|
+
- WIP autocomplete functionality
|
276
|
+
|
277
|
+
*** More tips
|
278
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
279
|
+
- Editor can be used with all code in the history
|
280
|
+
- Navigate to the desired code in your history and hit =ctl-m=.
|
281
|
+
- Run the code by hitting the run it button, or the =ctrl-Enter= short cut.
|
282
|
+
- Close the window with either the close icon, or hit escape.
|
283
|
+
|
284
|
+
*** Live demo of Multiline edit
|
285
|
+
#+BEGIN_HTML
|
286
|
+
<iframe width="100%" height="500" src="http://fkchang.github.io/opal-irb/index-jq.html" frameborder="0" allowfullscreen></iframe>
|
287
|
+
#+END_HTML
|
288
|
+
|
289
|
+
|
290
|
+
** Requiring code at run time
|
291
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
292
|
+
- *opal-irb* intended to be able to explore things at run-time
|
293
|
+
- 2 commands to support this
|
294
|
+
|
295
|
+
|
296
|
+
*** require_remote
|
297
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
298
|
+
- Part of *opal-parser*
|
299
|
+
- =require_remote= allows you require a remote ruby file.
|
300
|
+
|
301
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
302
|
+
#+BEGIN_SRC ruby
|
303
|
+
require_remote <url_to_ruby_file>"
|
304
|
+
#+END_SRC
|
305
|
+
|
306
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
307
|
+
As an example, I'll require the raw form of this gist, which prints
|
308
|
+
out "require_remote is cool" 10 times.
|
309
|
+
|
310
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
311
|
+
#+BEGIN_HTML
|
312
|
+
<script src="https://gist.github.com/fkchang/c52173c276976a9ccede.js"></script>
|
313
|
+
#+END_HTML
|
314
|
+
|
315
|
+
*** require_remote In browser
|
316
|
+
#+BEGIN_HTML
|
317
|
+
<iframe width="100%" height="500" src="http://git.io/vOmoR" frameborder="0" allowfullscreen></iframe>
|
318
|
+
#+END_HTML
|
319
|
+
|
320
|
+
*** require_js (asynchronous require)
|
321
|
+
|
322
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
323
|
+
- require_js requires javascript with a URL.
|
324
|
+
- Asynchronous
|
325
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
326
|
+
- Ok when typed in by hand, is usually fine, the file
|
327
|
+
- If not hand typed, say via live-gist, you'll need to put some sort of delay.
|
328
|
+
|
329
|
+
*** A Raphael.js based example.
|
330
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
331
|
+
- does a =require_js= of the raphael.js lib
|
332
|
+
- Adds a reanimate button (via Opal-browser's DOM DSL)
|
333
|
+
- delays via a =Timeout= and creates an animation and bind reanimation
|
334
|
+
code to the reanimate button
|
335
|
+
|
336
|
+
*** require_js Raphael.js example
|
337
|
+
#+BEGIN_HTML
|
338
|
+
<iframe width="100%" height="500" src="http://git.io/vOm1c" frameborder="0" allowfullscreen></iframe>
|
339
|
+
#+END_HTML
|
340
|
+
|
341
|
+
|
342
|
+
*** require_js_sync (synchronous require)
|
343
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
344
|
+
- Synchronous calls are atypical in javascript
|
345
|
+
- Chrome says this is deprecated
|
346
|
+
- Still might be useful
|
347
|
+
|
348
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
349
|
+
Same raphael example, but without the delay
|
350
|
+
|
351
|
+
*** require_js_sync Raphael.js
|
352
|
+
#+BEGIN_HTML
|
353
|
+
<iframe width="100%" height="500" src="http://git.io/vOmDg" frameborder="0" allowfullscreen></iframe>
|
354
|
+
#+END_HTML
|
355
|
+
|
356
|
+
** Say, say, say, what you want...
|
357
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
358
|
+
- I use the =say= command in OSX a lot
|
359
|
+
- Lets me know when a long running process is done
|
360
|
+
- Implemented for opal-irb, may make a standalone gem
|
361
|
+
|
362
|
+
*** say example in the browser
|
363
|
+
#+BEGIN_HTML
|
364
|
+
<iframe width="100%" height="500" src="http://git.io/vYveZ" frameborder="0" allowfullscreen></iframe>
|
365
|
+
#+END_HTML
|
366
|
+
|
367
|
+
|
368
|
+
* Examples
|
369
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
370
|
+
- There are several example opal-irb pages referenced from the README on https://github.com/fkchang/opal-irb. They are:
|
371
|
+
|
372
|
+
** Homebrew console example
|
373
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
374
|
+
#+ATTR_HTML: :target "_blank"
|
375
|
+
- My 1st attempt, port of a [[https://github.com/larryng/coffeescript-repl][coffescript repl]] with hand written terminal code
|
376
|
+
- not as full features as the jq-console example
|
377
|
+
|
378
|
+
** Homebrew console live
|
379
|
+
#+ATTR_HTML: :target "_blank"
|
380
|
+
http://fkchang.github.io/opal-irb/index-homebrew.html
|
381
|
+
|
382
|
+
#+BEGIN_HTML
|
383
|
+
<iframe width="100%" height="500" src="http://fkchang.github.io/opal-irb/index-homebrew.html" frameborder="0" allowfullscreen></iframe>
|
384
|
+
#+END_HTML
|
385
|
+
|
386
|
+
** jq-console Example
|
387
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
388
|
+
- This uses (a fork of) =jq-console=, for improved console support.
|
389
|
+
- Most development has been on a =jq-console= based *opal-irb*
|
390
|
+
- I might revisit a =jq-console= port to remove the *jquery* dependency in *opal-irb*
|
391
|
+
|
392
|
+
** jq-console Live
|
393
|
+
#+ATTR_HTML: :target "_blank"
|
394
|
+
http://fkchang.github.io/opal-irb/index-jq.html
|
395
|
+
#+BEGIN_HTML
|
396
|
+
<iframe width="100%" height="500" src="http://fkchang.github.io/opal-irb/index-jq.html" frameborder="0" allowfullscreen></iframe>
|
397
|
+
#+END_HTML
|
398
|
+
|
399
|
+
|
400
|
+
** Embedded console example
|
401
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
402
|
+
- How opal-irb might be embedded in an app
|
403
|
+
- Has some nominal DOM elements for maniuplation
|
404
|
+
- Button to show opal-irb
|
405
|
+
- *Opal-irb* supports 2 ways to display a hidden opal-irb:
|
406
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
407
|
+
- hot key
|
408
|
+
- click event on a DOM element
|
409
|
+
#+ATTR_HTML: :target "_blank"
|
410
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
411
|
+
- Both are documented in the [[https://github.com/fkchang/opal-irb/blob/master/README.md][README]]
|
412
|
+
|
413
|
+
** Embedded Console live
|
414
|
+
embedded iframe does not render right in safari, use chrome
|
415
|
+
#+ATTR_HTML: :target "_blank"
|
416
|
+
http://fkchang.github.io/opal-irb/index-embeddable.html
|
417
|
+
#+BEGIN_HTML
|
418
|
+
<iframe width="100%" height="500" onload='setTimeout(function() {this.height = 550;}, 100);' src="http://fkchang.github.io/opal-irb/index-embeddable.html" frameborder="0" allowfullscreen></iframe>
|
419
|
+
#+END_HTML
|
420
|
+
|
421
|
+
|
422
|
+
** Embedded in the opal-playground
|
423
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
424
|
+
- *Opal-irb* has been embedded into my fork of the *opal-playground*.
|
425
|
+
- *Opal-irb* is available in the RESULTS section by hitting the blue "Show Irb" button.
|
426
|
+
- Sometimes repl is what you need
|
427
|
+
** Opal-Playground live
|
428
|
+
#+ATTR_HTML: :target "_blank"
|
429
|
+
http://fkchang.github.io/opal-playground/
|
430
|
+
#+BEGIN_HTML
|
431
|
+
<iframe width="100%" height="500" src="http://fkchang.github.io/opal-playground/" frameborder="0" allowfullscreen></iframe>
|
432
|
+
#+END_HTML
|
433
|
+
|
434
|
+
** Videos and more
|
435
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
436
|
+
#+ATTR_HTML: :target "_blank"
|
437
|
+
- Many features demonstrated in part of [[https://www.youtube.com/watch?feature%3Dplayer_detailpage&v%3DGH9FAfKG-qY#t%3D1838][RubyConf 2013 talk "Opal - A New Hope"]];
|
438
|
+
- [[Https://www.youtube.com/watch?v%3DmQTulgBm5Nk][Video]] for the in progress auto complete in the console.
|
439
|
+
#+ATTR_HTML: :target "_blank"
|
440
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
441
|
+
- Video [[https://www.youtube.com/watch?feature%3Dplayer_detailpage&v%3DGH9FAfKG-qY#t%3D2099][preview]] of a prototype of opal-inspector 2 years back
|
442
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
443
|
+
- Showing features previously only supported in Smalltalk and Lisp machines.
|
444
|
+
#+ATTR_REVEAL: :frag (roll-in roll-in roll-in roll-in roll-in roll-in)
|
445
|
+
- Intend on beefing it up
|
446
|
+
|
447
|
+
* Done for now
|
448
|
+
Thanks!
|
@@ -0,0 +1,29 @@
|
|
1
|
+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
|
2
|
+
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
3
|
+
<html>
|
4
|
+
<head>
|
5
|
+
<link rel="stylesheet" href="css/ansi.css" type="text/css" media="all" />
|
6
|
+
|
7
|
+
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" ></script>
|
8
|
+
<script src="http://code.jquery.com/jquery-migrate-1.2.1.js"></script>
|
9
|
+
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
|
10
|
+
<script src="js/jqconsole.js"></script>
|
11
|
+
<link href="css/opal_irb_jqconsole.css" rel="stylesheet" type="text/css">
|
12
|
+
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
|
13
|
+
<link rel="stylesheet" href="http://codemirror.net/lib/codemirror.css"/>
|
14
|
+
<link rel="stylesheet" href="css/show-hint.css"/>
|
15
|
+
<script src="http://codemirror.net/lib/codemirror.js"></script>
|
16
|
+
<script src="js/show-hint.js"></script>
|
17
|
+
<script src="js/anyword-hint.js"></script>
|
18
|
+
<script type="text/javascript" src="http://codemirror.net/keymap/emacs.js"></script>
|
19
|
+
<script src="http://codemirror.net/mode/ruby/ruby.js"></script>
|
20
|
+
<script src="compiled/app-embeddable.js"></script>
|
21
|
+
</head>
|
22
|
+
<body>
|
23
|
+
<button id="show-irb">Show Irb</button>
|
24
|
+
<div id='mydiv'>
|
25
|
+
<h1 id="h1">An h1 headline inside of #mydiv</h1>
|
26
|
+
</div>
|
27
|
+
<h2 id="h2">An h2 headline standalone</h2>
|
28
|
+
</body>
|
29
|
+
</html>
|
data/index-homebrew.html
ADDED
@@ -0,0 +1,115 @@
|
|
1
|
+
<!DOCTYPE html>
|
2
|
+
<html>
|
3
|
+
<head>
|
4
|
+
<title>Online OPAL Interactive Console (REPL)</title>
|
5
|
+
<meta charset='utf-8' />
|
6
|
+
<meta name="description" content="An Opal interactive console (REPL) as a webpage." />
|
7
|
+
|
8
|
+
<style>
|
9
|
+
|
10
|
+
a {
|
11
|
+
color: #fff;
|
12
|
+
text-decoration: none;
|
13
|
+
}
|
14
|
+
|
15
|
+
a:hover {
|
16
|
+
text-decoration: underline;
|
17
|
+
}
|
18
|
+
|
19
|
+
pre {
|
20
|
+
margin: 0;
|
21
|
+
padding: 0;
|
22
|
+
font: inherit;
|
23
|
+
}
|
24
|
+
|
25
|
+
body {
|
26
|
+
background-color: #9b111e;
|
27
|
+
color: #fff;
|
28
|
+
font-size: 14px;
|
29
|
+
font-family: DejaVu Sans Mono, monospace;
|
30
|
+
}
|
31
|
+
|
32
|
+
#container {
|
33
|
+
width: 100%;
|
34
|
+
height: 100%;
|
35
|
+
font: inherit;
|
36
|
+
}
|
37
|
+
|
38
|
+
#output {
|
39
|
+
word-wrap: break-word;
|
40
|
+
}
|
41
|
+
|
42
|
+
#inputdiv {
|
43
|
+
width: 100%;
|
44
|
+
}
|
45
|
+
|
46
|
+
#inputl {
|
47
|
+
display: inline;
|
48
|
+
float: left;
|
49
|
+
}
|
50
|
+
|
51
|
+
#inputr {
|
52
|
+
display: inline;
|
53
|
+
float: left;
|
54
|
+
}
|
55
|
+
|
56
|
+
#input {
|
57
|
+
border: none;
|
58
|
+
outline: none;
|
59
|
+
background-color: #9b111e;
|
60
|
+
color: #fff;
|
61
|
+
font: inherit;
|
62
|
+
margin: 0;
|
63
|
+
padding: 0;
|
64
|
+
resize: none;
|
65
|
+
position: absolute;
|
66
|
+
overflow: hidden;
|
67
|
+
}
|
68
|
+
|
69
|
+
#inputcopy {
|
70
|
+
display: none;
|
71
|
+
white-space: pre-wrap;
|
72
|
+
min-height: 2em;
|
73
|
+
padding: 0;
|
74
|
+
margin: 0;
|
75
|
+
word-wrap: break-word;
|
76
|
+
}
|
77
|
+
|
78
|
+
.s_special { color: #4ff }
|
79
|
+
|
80
|
+
.s_number { color: #ff4 }
|
81
|
+
|
82
|
+
.s_boolean { color: #ff4 }
|
83
|
+
|
84
|
+
.s_undefined { color: #999 }
|
85
|
+
|
86
|
+
.s_null { font-weight: bold }
|
87
|
+
|
88
|
+
.s_string { color: #4f4 }
|
89
|
+
|
90
|
+
.s_date { color: #f4f }
|
91
|
+
|
92
|
+
.s_regexp { color: #f44 }
|
93
|
+
|
94
|
+
</style>
|
95
|
+
<link rel="stylesheet" href="http://codemirror.net/lib/codemirror.css"/>
|
96
|
+
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
|
97
|
+
</head>
|
98
|
+
<body>
|
99
|
+
<div id="container">
|
100
|
+
</div>
|
101
|
+
<div id="dialog" class="dialog" style="display:none" >
|
102
|
+
<textarea name="multi_line_input" id="multi_line_input"></textarea>
|
103
|
+
</div>
|
104
|
+
|
105
|
+
<script src="http://codemirror.net/lib/codemirror.js"></script>
|
106
|
+
<script type="text/javascript" src="http://codemirror.net/keymap/emacs.js"></script>
|
107
|
+
<script src="http://codemirror.net/mode/ruby/ruby.js"></script>
|
108
|
+
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" ></script>
|
109
|
+
<script src="js/nodeutil.js"></script>
|
110
|
+
<script src="compiled/application.js"></script>
|
111
|
+
|
112
|
+
|
113
|
+
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
|
114
|
+
</body>
|
115
|
+
</html>
|