-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
770 lines (729 loc) · 74.5 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
<!DOCTYPE html>
<!-- good html validtor: https://www.onlinewebcheck.com/check.php?adv=1 -->
<html lang="en">
<head>
<title>Dexter Development Environment</title>
<link rel="stylesheet" href="jqwidgets/styles/jqx.base.css" type="text/css" />
<!-- <script type="text/javascript" src="jquery-1.11.3.min.js"></script> -->
<script>window.$ = window.jQuery = require('jquery');</script>
<script type="text/javascript" src="jqwidgets/jqxcore.js"></script>
<script type="text/javascript" src="jqwidgets/jqxbuttons.js"></script>
<script type="text/javascript" src="jqwidgets/jqxcheckbox.js"></script> <!--needed for menu item checkbox -->
<script type="text/javascript" src="jqwidgets/jqxscrollbar.js"></script>
<script type="text/javascript" src="jqwidgets/jqxpanel.js"></script>
<script type="text/javascript" src="jqwidgets/jqxsplitter.js"></script>
<script type="text/javascript" src="jqwidgets/jqxmenu.js"></script>
<script type="text/javascript" src="jqwidgets/jqxwindow.js"></script>
<script type="text/javascript" src="jqwidgets/jqxlistbox.js"></script>
<script type="text/javascript" src="jqwidgets/jqxcombobox.js"></script>
<script type="text/javascript" src="jqwidgets/jqxdata.js"></script> <!--for the scrollarboe table display -->
<script type="text/javascript" src="jqwidgets/jqxdatatable.js"></script> <!--for the scrollarboe table display -->
<script type="text/javascript" src="three.min.js"></script>
<!--codemirror text editor -->
<!--<link rel=stylesheet href="codemirror/doc/docs.css"> included in eslint xample by not in my codemirror download -->
<link rel="stylesheet" href="codemirror/lib/codemirror.css">
<link rel="stylesheet" href="codemirror/addon/dialog/dialog.css">
<script src="codemirror/lib/codemirror.js"></script>
<script src="codemirror/mode/javascript/javascript.js"></script>
<!-- see https://github.com/angelozerr/codemirror-lint-eslint/blob/master/index.html -->
<script src="eslint.js"></script>
<link href="codemirror/addon/lint/lint.css" rel="stylesheet" >
<script src="codemirror/addon/lint/lint.js"></script>
<script src="eslint-lint.js"></script> <!-- use the config setting in this file, NOT the ones in eslint.js -->
<script src="codemirror/addon/dialog/dialog.js"></script> <!-- maybe used by find ??? -->
<script src="codemirror/addon/search/searchcursor.js"></script>
<script src="codemirror/addon/search/search.js"></script>
<script src="codemirror/addon/edit/matchbrackets.js"></script>
<!-- see https://codemirror.net/demo/folding.html -->
<link rel="stylesheet" href="codemirror/addon/fold/foldgutter.css" />
<script src="codemirror/addon/fold/foldcode.js"></script>
<script src="codemirror/addon/fold/foldgutter.js"></script>
<script src="codemirror/addon/fold/brace-fold.js"></script>
<script src="codemirror/addon/fold/comment-fold.js"></script>
<!--
<link rel="stylesheet" href="codemirror/addon/tern/tern.css">
<script src="codemirror/addon/tern/tern.js"></script> js syntax checking
about 10 other js files required to make this work. Looks hairy and jshint does pretty good
at finding syntax errors. But tern looks like it has meta-point capability, and completion
which would be really good.
<script src="codemirror/addon/tern/worker.js"></script>
-->
<style> .CodeMirror {width:98%; height:84%; font-size:17px; font-weight:600} <!--500 and 550 are the same and both too light, but 600 is too dark-->
.CodeMirror-cursor {
border-left: 2px solid black;
border-right: none;
width: 0;
}
div.CodeMirror-cursors {
visibility: visible;
}
.cm-animate-fat-cursor {
animation: blink 0.56s steps(1) infinite;
-webkit-animation: blink 0.56s steps(1) infinite;
}
</style>
<script type="text/javascript" src="stacktrace.min.js"></script>
<script type="text/javascript" src="mark.min.js" charset="UTF-8"></script> <!-- https://markjs.io for marking found search terms in the documentation -->
<!-- ROS interface -->
<!-- From http://cdn.robotwebtools.org/EventEmitter2/current/eventemitter2.min.js on dec 19, 2015 for Chrome app-->
<script type="text/javascript" src="eventemitter2.min.js"></script>
<!-- from http://cdn.robotwebtools.org/roslibjs/current/roslib.min.js on Dec 18, 2015 for Chrome app -->
<script type="text/javascript" src="roslib.min.js"></script>
<!-- <script type="text/javascript" src="async.js"></script>--> <!-- https://github.com/caolan/async -->
<!-- <script> bizzarely this did not bind dde_apps_dir so this is now done in ready.js
const remote = require("electron").remote
dde_apps_dir = remote.getGlobal("dde_apps_dir")
console.log("in index.html with: " + window.dde_apps_dir)
</script> -->
<!--<script>
require('fs-lock')({
'file_accessdir': [__dirname, dde_apps_dir], //for readFile, etc. but must include __dirname since Electron needs it.
'open_basedir': [__dirname ] //__dirname is the folder this app is installed in. //valid folders to get require's from. /usr/local/share/node_modules',
})
</script>--> <!-- errors inside of fs-lock's index.js -->
<script>window.fs = require('fs');</script>
<!--<script type="text/javascript" src="core/utils.js"></script>-->
<script type="text/javascript" src="html_db.js"></script>
<!--<script type="text/javascript" src="core/to_source_code.js"></script>-->
<script type="text/javascript" src="inspect.js"></script>
<!--<script type="text/javascript" src="core/storage.js"></script>
<script type="text/javascript" src="core/object_system.js"></script>-->
<script type="text/javascript" src="js_info.js"></script>
<script type="text/javascript" src="editor.js"></script>
<script type="text/javascript" src="series.js"></script>
<!--<script type="text/javascript" src="core/units.js"></script>-->
<script type="text/javascript" src="simutils.js"></script>
<script type="text/javascript" src="simulate.js"></script>
<script type="text/javascript" src="video.js"></script>
<script type="text/javascript" src="picture1.js"></script>
<script type="text/javascript" src="ros_interface.js"></script>
<link rel="stylesheet" href="ui_widgets/awesomplete.css"/>
<script src="ui_widgets/awesomplete.js"></script>
<!--<script type="text/javascript" src="getusermedia.js"></script> -->
<!--<script type="text/javascript"> require("./core/out.js") </script>-->
<!--<script type="text/javascript"> require("./output.js") </script>-->
<script type="text/javascript" src="output.js"></script>
<!-- <script type="text/javascript"> require("./speech_reco.js") </script> -->
<script type="text/javascript" src="gamepad.js"></script>
<script type="text/javascript" src="svg.js"></script> <!--needed in ui only for series help -->
<script type="text/javascript" src="eval.js"></script>
<script type="text/javascript" src="dex.js"></script>
<!--<script type="text/javascript" src="core/socket.js"></script>
<script type="text/javascript" src="core/instruction.js"></script>
<script type="text/javascript" src="core/robot.js"></script>-->
<script type="text/javascript" src="robot_status.js"></script>
<script type="text/javascript" src="robot_status_dialog.js"></script>
<!--<script type="text/javascript" src="core/dextersim.js"></script>-->
<!--<script type="text/javascript" src="core/job.js"></script>-->
<script type="text/javascript" src="job_examples.js"></script> <!--evals no Job code, just literal strings for insertion-->
<!--<script type="text/javascript" src="core/gcode.js"></script>--> <!-- adds methods to the class Job used by run_gcode-->
<script type="text/javascript" src="run_instruction.js"></script>
<script type="text/javascript" src="robot_utilities.js"></script>
<script type="text/javascript" src="app_builder.js"></script>
<script type="text/javascript" src="doc_code.js"></script>
<script type="text/javascript" src="test_suite/test_suite.js"></script>
<script type="text/javascript" src="test_suite/test_suites.js"></script>
<script type="text/javascript" src="test_suite/make_html_testsuite.js"></script>
<!--loading order of this blcok specified by James -->
<!--
<script type="text/javascript" src="math/Trig_in_Degrees.js"></script>
<script type="text/javascript" src="math/Vector.js"></script>
<script type="text/javascript" src="math/Convert.js"></script>
<script type="text/javascript" src="math/Kin.js"></script>
<script type="text/javascript" src="math/Coor.js"></script>
<script type="text/javascript" src="math/dxf-parser.js"></script>
<script type="text/javascript" src="math/DXF.js"></script>
<script type="text/javascript" src="math/txt.js"></script>
<script type="text/javascript" src="math/Dexter_Modes.js"></script>
-->
<!--<script type="text/javascript" src="core/serial.js"></script>-->
<script type="text/javascript" src="low_level_dexter/ViewEye_Support_Functions.js"></script>
<script type="text/javascript" src="low_level_dexter/ViewEyeRealTime.js"></script>
<script type="text/javascript" src="low_level_dexter/calibrate_optical.js"></script>
<script type="text/javascript" src="low_level_dexter/calibrate_ui.js"></script>
<script type="text/javascript" src="music/note.js"></script>
<script type="text/javascript" src="music/phrase.js"></script>
<script type="text/javascript" src="user_tools/ezTeach_base.js"></script>
<script type="text/javascript" src="blocksde/init.js"></script>
<script type="text/javascript" src="blocksde/workspace.js"></script>
<script type="text/javascript" src="blocksde/category_newObject.js"></script>
<script type="text/javascript" src="blocksde/blocks2.js"></script>
<script type="text/javascript" src="blocksde/jsdb_newObject.js"></script>
<script type="text/javascript" src="blocksde/js2b.js"></script>
<script type="text/javascript" src="de/de.js"></script>
<script type="text/javascript" src="load_job_engine.js"></script>
<script type="text/javascript" src="ready.js"></script>
<link rel="stylesheet" href="styles.css" type="text/css"/>
</head>
<body id="body_id" class="window_frame" onload="on_ready()" style=" padding:0px"><!--<datalist id="dl_id"><option>one</option><option>another one</option></datalist>
<input class="awesomplete" list="dl_id"/>--><!--<span style="font-size:30px;">Dexte<img src="dexter_128.png" width="20" alt="r"/> Development Environment</span>
<i style="font-size:20px;padding-left:20px;">Create software to control the Dexter robot</i><br/>-->
<!--<div style="width: 100%; height: 100%;margin:0px; padding:0px;">--> <!--height of 99% allows a tiny pink bottom border which is good.-->
<div id="outer_splitter">
<div>
<div id="left_splitter">
<div>
<div id="javascript_pane_header_wrapper_id" class="pane_header_wrapper">
<span id="javascript_pane_help_id" class="pane_header" title="Click for help." style="vertical-align:super;"><u>Editor</u></span>
<div id='js_menubar_id' class='dde_menu' style="display:inline-block;">
<ul style="display:inline-block;padding:0;margin-top:0px;">
<li style="display:inline-block;padding-left:3px;padding-right:0px;">File▼
<ul>
<li id="new_id" title="Make a new file.">New</li>
<li id="open_id" title="Edit an exiting file.">Open... Ctrl/⌘o</li>
<li id="load_file_id" title="Evaluate the content of a JavaScript file.">Load...</li>
<li id="insert_file_id" title="Insert the content of a file
into the editor at the cursor,
replacing the selection if any.">Insert file...</li>
<li id="save_id" title="Save the current file.">Save Ctrl/⌘s</li>
<li id="save_as_id" title="Save the current editor content under a new name.
The old file remains unchanged.
It will remain on the list of files.">Save As...</li>
<li id="remove_id" title="Remove the edited file from the file list and editor.
Does not delete the file from disk.">Remove</li>
<li id="update_id" title="Shows doc on how to get
the latest version of DDE.">Update DDE...</li>
</ul>
</li>
<li style="display:inline-block;padding-left:3px;padding-right:0px;">Edit▼
<ul>
<li id="undo_id" title="Redo the last text change in the JS Editor.">Undo Ctrl/⌘z</li>
<li id="redo_id" title="Redo the last Undo text change in the JS Editor.">Redo</li>
<li id="find_id" title="After clicking,
type in seaarch term,
then hit Enter to select all instances
of the search term.">Find...Ctrl/⌘f</li>
<li id="find_next_id" title="Move to the next instance of the search term.">Find Next Ctrl/⌘g</li>
<li id="find_prev_id" title="Move to the previous instance of the search term.">Find Prev Shift Ctrl/⌘g</li>
<li id="replace_id" title="After clicking,
type in seaarch term,
hit Enter
then enter replacement.">Replace...</li>
<li id="fold_all_id" title="Compresses each multi-line statement into just its top line.">Fold All</li>
<li id="unfold_all_id" title="Uncompress all compressed statements.">Unfold All</li>
<li id="select_expr_id" title="Select JS expressions, by
Alt-clicking on their
start, middle or end.
On Mac: Option-click">Select expr alt-click</li>
<li id="select_all_id" title="Select all the text in the Editor.">Select All Ctrl/⌘A</li>
<li>Right click menu in JS pane has more operations.</li>
</ul>
</li>
<li title="Choose these items to learn JavaScript.
Using menu item order recommended." style="display:inline-block;padding-left:3px;padding-right:0px;">Learn JS▼
<ul>
<li id="learn_js_help_id">Help</li>
<li id="js_example_1_id" title="Example of a small JavaScript program.
Good for a refresher course or quick learners.">JavaScript Example</li>
<li>User Interaction
<ul><li id="alert_id" title="Pause JS and show user a dialog with a message.">alert("Hi.")</li>
<li id="confirm_id" title="Pause JS and show user a message to OK.">confirm("Do it?")</li>
<li id="prompt_id" title="Pause JS and show user a dialog to get a string.">prompt("Price?", "$1")</li>
</ul>
</li>
<li title="">Debugging, etc.
<ul>
<li id="dev_tools_id" title="Show instructions for
seeing console.log output and
using debugger; breakpoints.">Help</li>
<li id="console_log_id" title="Prints complex data into the Chrome console. Click right anywhere in DDE and 
choose 'Inspect' to see it.
out(...) prints to Output pane.">console.log(...)</li>
<li id="debugger_id" title="Inserts a breakpoint in any JS code
Click right and choose 'Inspect Element' 
to enable stepping.">debugger;</li>
<li id="debugger_instruction_id" title="Insert a Robot.debugger()
instruction in a do list
which pauses a job
and allows you to step through its instructions.">Robot.debugger()</li>
<li id="comment_out_id" title="Place the selected text in a comment
so it won't be evaled.">Comment out selection</li>
<li id="comment_eol_id" title="Comment out from cursor to end of line
so it won't be evaled.">Comment to end of line</li>
</ul>
</li>
<li title="boolean logic">true & false
<ul>
<li id="true_id" title="The literal true value">true</li>
<li id="false_id" title="The literal false value">false</li>
<li id="and_id" title="Insert && between two other expressions.">and</li>
<li id="or_id" title="Insert || between two other expressions.">or</li>
<li id="not_id" title="Insert ! before the expression to be negated.">not</li>
</ul>
</li>
<li title="Arithmetic Operators">Math
<ul>
<li id="math_example_id" title="Use parens to disambiguate operations.">Arithmetic Example</li>
<li id="plus_id" title="Insert + between two numbers.">plus</li>
<li id="minus_id" title="Insert - between two numbers.
Also used in front of a negative number.">minus</li>
<li id="times_id" title="Insert * between two numbers.">times</li>
<li id="divide_id" title="Insert / between two numbers.
Result will often be a float
even if both numbers are integers.">divide</li>
<li id="pi_id" title="Insert Pi (3.14...)">Pi</li>
<li id="parens_id" title="Wrap parens around the selection.">(...)</li>
</ul>
</li>
<li title="Compare two numbers">Comparisons
<ul>
<li id="compare_example_id" title="Math.PI >= 3
Returns true or false.">Compare Example</li>
<li id="less_id" title="Insert < between two numbers.
Returns true if
the first is less than the second.">less than</li>
<li id="less_or_equal_id" title="Insert <= between two numbers.
Returns true if
the first is less than or equal to the second.">less or equal</li>
<li id="equal_id" title="Insert == between two numbers.
Returns true if
they are the same.">equal</li>
<li id="more_or_equal_id" title="Insert >= between two numbers.
Returns true if
the first is more than or equal to the second.">more or equal</li>
<li id="more_id" title="Insert > between two numbers.
Returns true if
the first is more than the second.">more than</li>
<li id="not_equal_id" title="Insert != between two numbers.
Returns true if
the first is not equal to the second.">not equal</li>
</ul>
</li>
<li title="Operations on text">Strings
<ul>
<li id="double_quote_id" title="Make a literal string by
wrapping double-quotes
around the selection">literal string with "</li>
<li id="single_quote_id" title="Make a literal string by
wrapping single-quotes
around the selection">literal string with '</li>
<li id="back_quote_id" title="Make a multi-lined literal string by
wrapping back-quotes
around the selection">multi-lined string</li>
<li id="add_strings_id" title="Add two strings together
making one long string.
Place + between the strings.">add strings</li>
<li id="string_length_id" title="Return the number of characters
in the string.
Place after the string.">length</li>
<li id="get_char_id" title="Extract the character
at the given index.
Place after the string.">get a character</li>
<li id="slice_id" title="Extract characters
between given indexes.
Place after string.">get characters</li>
<li id="split_id" title="Split the string into parts
separated by a given substring.
Place after the string.">split string</li>
<li id="string_equal_id" title="Insert == between two strings.
Returns true if
they are the same.">string equal</li>
<li id="starts_with_id" title="Returns true if
the string starts with the given substring.
Place after the string.">startsWith</li>
<li id="ends_with_id" title="Returns true if
the string ends with the given substring.
Place after the string.">endsWith</li>
<li id="replace_string_id" title="Return a copy of the string
with the indicated parts replaced.
Place after the string.">replace</li>
</ul>
</li>
<li title="An array is a sequence
of any type of data
including multiple types
in one array.">Arrays
<ul>
<li id="make_array_id" title="Makes a literal array.
It can be any length.">make literal array</li>
<li id="array_length_id" title="Return the number of elements
in the array.
Place after the array.">length</li>
<li id="get_array_element_id" title="Extract the element
at the given index.
Place after the array.">get an element</li>
<li id="set_array_element_id" title="Set the element
at the given index.
Place after the array.">set an element</li>
<li id="push_array_element_id" title="Add a new element
to the end of the array.
Place after the array.">push an element</li>
</ul>
</li>
<li>Date
<ul>
<li id="new_date_day_id" title="Create an instance of Date
with month, day, year.">new Date day month year</li>
<li id="new_date_time_id" title="Create an instance of Date
including time.">new Date and time</li>
<li id="new_date_ms_id" title="Create an instance of Date
giving milliseconds since Jan 1, 1970.">new Date by ms</li>
<li id="date_now_id" title="Milliseconds between now
and Jan 1, 1970.">Date.now()</li>
<li id="date_valueOf_id" title="Get the total milliseconds
of a date.
new Date() with no arg
makes a date representing now.">Date valueOf()</li>
<li id="date_toString_id" title="Get the string representation
of a date.">Date toString()</li>
<li id="duration_hms_id" title="Create a duration from hours:minutes:seconds
This is not standard JS.">new Duration("01:14:05")</li>
<li id="duration_hmsms_id" title="Create a duration from
hours, minutes, seconds, milliseconds.
All default to 0..
This is not standard JS.">new Dur(h,m,s,ms)</li>
<li id="duration_get_ms_id" title="Extract milliseconds from a duration.
This is not standard JS.">Dur.milliseconds</li>
</ul>
</li>
<li title="Store values in variables for later use.">Variables
<ul>
<li id="variable_examples_id" title="Show typical use cases for variables.">Example</li>
<li id="init_variable_id" title="Make a new variable and set its value.
Place before new value.">Initialize variable</li>
<li id="set_variable_id" title="Set the value of an existing variable.
Place = between variable name and new value.">Set variable value</li>
</ul>
</li>
<li title="JS Objects are name:value pairs.">JavaScript Objects
<ul>
<li id="js_object_example_id" title="Shows the most common operations on JS objects">Example</li>
<li id="js_object_cheat_sheet_id" title="Same content as 'Example'
but in its own window.">Cheat Sheet</li>
</ul>
</li>
<li title="if, for loops, and try-catch of errors.">Control Flow
<ul>
<li id="if_single_armed_id" title="if (1 + 1 == 2) {...}
Wrap around selection.">if (single-armed)</li>
<li id="if_multi_armed_id" title="if (1 + 1 == 2) {...}
else if (2 + 2 == 4){ }
else { }
Wrap around selection.">if (multi-armed)</li>
<li id="for_number_of_times_id" title="Repeat code body
a given number of times.
for(var i = 0; i < 10; i++){...}">for (# of times)</li>
<li id="for_through_array_elts_id" title="Repeat code body
once for each array element.
for(var i of [7, 4, 6]){...}">for each array elt</li>
<li id="try_id" title="Catch errors by wrapping code in 'try'.
try {...} catch (err){ }">try {catch errors}</li>
<li id="dde_error_id" title="Forces a JavaScript error.
Takes a string to show the user why it errored.">dde_error</li>
<li id="setTimeout_id" title="Calls the callback after indicated milliseconds.">setTimeout</li>
</ul>
</li>
<li title="Name a code segment
to make it easier to reuse and
customize per use with arguments.">Functions
<ul>
<li id="function_example_id" title="Example of a simple function definition
and a 'call' to run its code.">Example</li>
<li id="named_function_id" title="Wrap a named function definition around the selection.
function foo(x, y){ ... }">named function def</li>
<li id="anonymous_function_id" title="Wrap an anonymous function definiton around the selection.
The result can be passed as an argument or set to a variable.
function(x, y){ ... }">anonymous fn def</li>
<li id="return_id" title="Return a value from a function.
Place inside a function defintion
before the value to be returned.">return (from fn)</li>
</ul>
</li>
</ul>
</li>
<li style="display:inline-block;padding-left:3px;padding-right:0px;">Insert▼
<ul>
<li id="show_output_id" title="Prints its 1st argument to the output pane and returns it.">Print to output
<ul>
<li id="out_black_id" title="Prints its 1st argument to the output pane in black and returns it."><span style="color:#000000;font-weight: bold;">out(...)</span>
<li id="out_purple_id" title="Prints its 1st argument to the output pane in blue and returns it."><span style="color:blue;font-weight: bold;">out(...)</span>
<li id="out_brown_id" title="Prints its 1st argument to the output pane in orange and returns it."><span style="color:rgb(255, 100, 0);font-weight: bold;">out(...)</span>
</ul>
</li>
<li id="editor_insert_id" title="Programmatically inserts text into the Editor.">Editor.insert</li>
<li id="insert_color_id" title="Choose a color to insert into the Editor.
If you select a color first,
the selection will be replaced.">Color</li>
<li title="Pops up an interactive dialog box with HTML content.">show_window
<ul>
<li id="show_window_help_id" title="Documetation for show_window">Help</li>
<li id="window_simple_message_id" title="Basic information presentation">Simple Message</li>
<li id="window_options_id" title="Window title, size, position">Window Options</li>
<li id="window_buttons_id" title="Submit and non-window-closing buttons
Explains callback function.">Buttons</li>
<li id="window_menu_id" title="Hierarchical menu">Menu</li>
<li id="window_many_inputs_id" title="Examples of numerous input types">Many Inputs</li>
<li id="window_onchange_id" title="Examples of using onchange and oninput
to call the callback as soon as
there's a change in an input.">onchange calls</li>
<li id="window_svg_id" title="Examples of using svg
to dynamically add and reposition
shapes in a window.">svg (2D drawing)</li>
<li id="build_window_id" title="Create a show_window call via a dialog box.">Build Window</li>
<li id="window_close_all_id" title="Closes all open 'show_windows'.
Does not insert code into Editor.">Close all</li>
</ul>
</li>
<li title="Image processing using OpenCV.">Machine Vision
<ul>
<li id="machine_vision_help_id" title="Documentation on Machine Vision and OpenCV.">Help</li>
<li id="opencv_gray_id" title="Convert chosen color picture to gray image.">Convert to gray</li>
<li id="opencv_in_range_id" title="Convert chosen color picture to black and white from a designated range of pixel colors.">in_range B&W</li>
<li id="opencv_blur_id" title="Convert chosen picture to blurry.">Blur</li>
<li id="opencv_blob_detector_id" title="Finds blobs with certain characteristics, shown in graphics and numbers.">Blob Detector</li>
<li id="opencv_process_webcam_id" title="Make snapshots from webcam video and modify them.">Process Webcam</li>
<li id="opencv_face_reco_id" title="Locate the faces in a webcam image.">Face Recogition</li>
<li id="opencv_locate_object_id" title="Locate an object using OpenCV and a Job.">Locate Object</li>
<li id="opencv_picture_similarity_id" title="Compare 2 pictures using OpenCV and a Job.">Picture Similarity</li>
</ul>
</li>
<li id="show_page_id" title="Open a browser window on the given url.">show_page(...)</li>
<li id="get_page_id" title="Retrieves the content of
a web page or data service.">get_page</li>
<li>Sound
<ul>
<li id="beep_id" title="Plays a simple beep.">beep()</li>
<li id="beep_options_id" title="Play a beep with lots of options">beep with options</li>
<li id="beeps_id" title="Plays the number of beeps in the argument,
1 per second. Default=1">beeps(3)</li>
<li id="speak_id" title="Say a string.
Wraps call around selection, if any.">speak()</li>
<li id="speak_options_id" title="Say data with lots of options.
Wraps call around selection, if any.">speak with options</li>
<!-- <li id="recognize_speech_id" title="Pops up a control dialog and 
calls a callback with recognized text and confidence score.">recognize_speech</li> -->
</ul>
</li>
<li>Music
<ul>
<li id="music_help_id">Help</li>
<li id="phrase_examples_id" title="Insert examples of creating musical phrases and Phrase Processing.">Phrase Examples</li>
<li id="midi_init_id" title="Evaluates Midi.init()
Does not insert into the editor.
Put Midi.init() in your dde_init.js file
if you usually need this.">Midi.init()</li>
</ul>
</li>
<!-- <li id="train_id" title="Program Dexter by example">Train Dexter</li> -->
<li id="insert_examples" title="Extended examples">Examples
<ul>
<li id="make_dictionary_id" title="Uses speech I/O to start defining a language.">Make Dictionary</li>
<li id="nat_lang_reasoning_id" title="Uses speech I/O and reasoning to answer questions.">Nat Lang Reason</li>
</ul>
</li>
<li id="ez_teach_id" title="Insert a new ezTeach project in a new editor buffer.">ezTeach</li>
</ul>
</li>
<li style="display:inline-block;padding-left:3px;padding-right:0px;">Series▼
<ul>
<li id="series_help_id">Help</li>
<li>Navigation
<ul>
<li id="series_next_item_id" title="Replace the selection with the next item
in the series of the selection.
Numbers, colors, and various JS function names
are in their own series.
For speed, use the right arrow key.">Next item →</li>
<li id="series_prev_item_id" title="Replace the selection with the previous item
in the series of the selection.
Numbers, colors, and various JS function names
are in their own series.
For speed, use the left arrow key.">Prev item ←</li>
<li id="series_next_id" title="Replace the selection with 
an item from the next series
Numbers, colors, and various JS function names
are in their own series.
For speed, use the down arrow key.">Next series ↓</li>
<li id="series_prev_id" title="Replace the selection with 
an item from the previous series
Numbers, colors, and various JS function names
are in their own series.
For speed, use the up arrow key.">Prev series ↑</li>
</ul>
</li>
<li>JavaScript
<uL>
<li id="series_punctuation_id" title="Insert a punctuation character">Punctuation</li>
<li id="series_boolean_id" title="Insert true, false, null or undefined.">Boolean</li>
<li id="series_bitwise_id" title="Insert &, |, ^, ~, <<, >>, >>>.">Bitwise</li>
<li id="series_global_js_id" title="Insert a JS global function.">Global fns</li>
<li>Number
<ul>
<li id="series_integer_id" title="Insert an integer to increment or decriment.">integer</li>
<li id="series_float_id" title="Insert a floating point number to increment or decriment.">float</li>
<li id="series_arithmetic_id" title="Insert an arithmetic operator.">arithmetic</li>
<li id="series_comparison_id" title="Insert a comparison operator.">comparison</li>
<li id="series_math_id" title="Insert a Math function.">math</li>
<li id="series_trigonometry_id" title="Insert a trigonometry function.">trigonometry</li>
<li id="series_number_misc_id" title="Insert a low level number function.">number misc</li>
<li id="series_number_constant_id" title="Insert a symbolic math constant like 'Math.PI'.">number constant</li>
</ul>
</li>
<li id="series_js_object_name_id" title="Insert the name of a built-in global JS object.">Object Name</li>
<li id="series_assignment_id" title="Assign a value to a variable">Assignment</li>
<li>Strings & Arrays
<ul>
<li id="series_literal_string_id" title="Insert a literal string.">literal string</li>
<li id="series_string_id" title="Insert a string method.">string</li>
<li id="series_array_id" title="Insert an array method.">array</li>
<li id="series_forEach_id" title="Loop over the elements of an array.">forEach</li>
</ul>
</li>
<li>Date
<ul>
<li id="series_hours_minutes_seconds_id" title="Insert a time of hours:minutes:seconds.">hours:mins:secs</li>
<li id="series_time_id" title="Insert a time of hours:minutes or minutes:seconds.">time</li>
<li id="series_3_letter_month_id" title="Insert a 3 letter month name.">3 letter month</li>
<li id="series_full_month_id" title="Insert a full month name.">full month</li>
<li id="series_date_id" title="Insert a date.">date</li>
</ul>
</li>
<li title="Control the flow of execution">Control Flow
<ul>
<li id="series_if_id" title='Insert "if", "else if", or "else".'>if</li>
<li id="series_for_id" title='Insert "for" or "while".'>for</li>
<li id="series_try_id" title="Insert a try, catch, or finally">try</li>
</ul>
</li>
<li id="series_function_id" title="Insert a function definition
or one of its friends.">Function</li>
</ul>
</li> <!-- end JavaScript -->
<li>HTML
<ul>
<li id="series_html_tag_id">HTML Tags</li>
<li id="series_html_property_id">HTML Properties</li>
<li id="series_css_property_id">CSS (Style) Properties</li>
</ul>
</li>
<li>DDE
<ul>
<li>Units System
<ul>
<li id="units_system_help_id">Help</li>
<li id="series_length_units_id" title="Insert a length units converter.">length</li>
<li id="series_angle_units_id" title="Insert an angle units converter.">angle</li>
<li id="series_duration_units_id" title="Insert a duration_units converter.">duration_units</li>
<li id="series_frequency_units_id" title="Insert a frequency units converter.">frequency</li>
<li id="series_mass_units_id" title="Insert a mass units converter.">mass</li>
<li id="series_force_units_id" title="Insert a force units converter.">force</li>
<li id="series_pressure_units_id" title="Insert a pressure units converter.">pressure</li>
<li id="series_torque_units_id" title="Insert a torque units converter.">torque</li>
<li id="series_power_units_id" title="Insert a power units converter.">power</li>
<li id="series_energy_units_id" title="Insert an energy units converter.">energy</li>
<li id="series_temperature_id" title="Insert a temperature converter.">temperature</li>
</ul>
</li>
<li id="series_object_system_id" title="Functions for creating and accessing the prototype object system.">Object System</li>
<li>Output
<ul>
<li id="series_output_id" title="Insert a call to an output function.">output functions</li>
<li id="series_color_name_id" title="Insert a color name
such as 'blue'.">color name</li>
<li id="series_color_rgb_id" title="Insert a color rgb designation
such as rgb(0, 100, 255)">color rgb</li>
</ul>
</li>
<li id="series_window_id" title="Insert a call to a window function.">Window</li>
<li File id="series_file_id" title="Functions for files and persistent data.">File</li>
<li>Job
<ul>
<li id="series_job_name_id" title="Insert a job name.">job name</li>
<li id="series_job_method_id" title="Insert a job method.">job method</li>
</ul>
</li>
<li>Robot
<ul>
<li id="robots_help_id">Help</li>
<li id="series_robot_instruction_id" title="Insert a job instruction for Dexter.">instruction</li>
<li id="series_robot_config_id" title="Insert a config arg for the Dexter.move_to instruction.">robot config</li>
<li id="series_robot_status_label_id" title="Insert a robot status label.">robot status label</li>
<li id="series_robot_subclass_id" title="Insert a call to create an instance of a Robot subclass.">robot subclass</li>
<li id="series_robot_name_id" title="Insert code to get a robot instance.">robot name</li>
<li id="series_serial_id" title="Insert function names of DDE's serial port interface.
These low level functions are used by Robot.Series">serial port</li>
</ul>
</li>
<li>Dexter Robot
<ul>
<li id="series_dexter_utility_id" title="Insert a call to a Dexter method.">Dexter utility</li>
<li id="series_dexter_constant_id" title="Insert a Dexter joint angle min, max or link length.">Dexter constant</li>
<li id="series_oplet_id" title="make_ins is a low_level way to make an instruction.
Its first arg is an 'oplet' for 'type of instruction'.">oplet</li>
<li id="series_set_parameter_name_id" title="Insert a set_parameter name (1st arg).">set_param name</li>
</ul>
</li>
<li>Music
<ul>
<li id="series_note_id" title="Insert a call to create or process notes.">Note</li>
<li id="series_phrase_id" title="Insert a call to create or process phrases.">Phrase</li>
</ul>
</li>
<li id="series_test_suite_id">Test Suite</li>
</ul>
</li>
</ul>
</li>
<li style="display:inline-block;padding-left:3px;padding-right:0px;">Jobs▼
<ul>
<li id="jobs_help_id">Help</li>
<!--<li id="start_job_id" title="Eval job that cursor is in and start it.">Start Job
<ul><li id="start_job_help_id">Start Job Help</li></ul>
</li>-->
<li id="show_robot_status_id" title="Pop up a dialog showing the robot status
for a Dexter of your choosing.
It displays updates as soon as they are available.">Show robot status</li>
<li id="jobs_report_id" title="Display a report of all Jobs in this session.">Show report</li>
<!--<li id="stop_all_jobs_id" title="Stop all of the currently running jobs.">Stop all jobs</li> -->
<!-- <li id="clear_stopped_jobs_id" title="Remove stopped jobs so they don't clutter the jobs report.">Clear stopped jobs</li> -->
<li id="simulate_id" title='Dexter instances with a simulate value of null,
such as the default Dexter: "dexter0",
get their simulate value from the selected radio button.'>
Simulate?
<ul>
<li id="simulate_help_id" title="Documentation on simulate.">Help</li>
<li title="Simulate robots that have simulate=null.">
<input id="simulate_radio_true_id" type="radio" name="simulate" value="true" checked="true"/>
<label for="simulate_radio_true_id">true (simulate)</label></li>
<li title="Send (hardware) instructions to robots that have simulate=null.">
<input id="simulate_radio_false_id" type="radio" name="simulate" value="false"/>
<label for="simulate_radio_false_id">false (real)</label></li>
<li title="Run both the simulator and the 'real' for robots that have simulate=null.">
<input id="simulate_radio_both_id" type="radio" name="simulate" value="both"/>
<label for="simulate_radio_both_id">both</label></li>
</ul>
</li>
<li id="real_time_sim_id" title="If unchecked, simulation
will run as fast as it can.
No pauses for sleep or motion.">
<div style='float: left; margin-right: 5px;' id='real_time_sim_checkbox_id'></div>
Real time sim
</li>
<li> Insert Example
<ul>
<li id="insert_job_example0_id" title="Insert into the editor a 1 instruction Job definition.">0. Simplest</li>
<li id="insert_job_example1_id" title="Insert into the editor an example of defining a simple job.">1. Simple</li>
<li id="insert_job_example2_id" title="Insert into the editor a simple Dexter-moving Job.">2. Dexter-moving</li>
<li id="insert_job_example3_id" title="Insert into the editor a job with function call instructions.">3. Dexter & Fns</li>
<li id="insert_job_example4_id" title="Insert into the editor examples of defining 3 complex jobs using generators.">4. Generators</li>
<li id="insert_job_example5_id" title="Insert into the editor examples of defining jobs that interact with other jobs.">5. Sync Jobs</li>
<li id="insert_job_example6_id" title="Insert into the editor examples of defining a job that gets user input while running.">6. User Input</li>
<li id="insert_job_example7_id" title="Insert into the editor examples of using a human 'robot'.">7. Human Instrs</li>
<li id="insert_job_example8_id" title="Insert into the editor a job containing
Human.enter_instruction.">8. Enter Instruction</li>
<li id="insert_job_example9_id" title="Insert into the editor a tutorial on using Asynchronous Functions.">9. Async Fns</li>
<li id="insert_job_example10_id" title="Insert into the editor a tutorial on using Serial Port.">10. Serial Port</li>
<li id="insert_job_example11_id" title="Insert into the editor a tutorial on using
when_stopped for looping a job, etc.">11. when_stopped</li>
<li id="insert_job_example12_id" title="Insert into the editor a tutorial on using
Robot.go_to instruction for looping a job.">12. Robot.go_to</li>
<li id="insert_job_example13_id" title="Insert into the editor a tutorial on using
loops in a job.">13. Robot.loop</li>
<li id="insert_job_example14_id" title="Insert into the editor a tutorial on using
A TestSuite in a job.">14. TestSuite in Job</li>
</ul>
</li>
<li title="Send a single instruction to a Dexter without typing.">Run Instruction
<ul>
<li id="move_to_home_id" title="Runs a job on dexter0 with the instruction:
Dexter.move_all_joints(Dexter.HOME_ANGLES)">HOME_ANGLES</li>
<li id="move_to_neutral_id" title="Runs a job on dexter0 with the instruction:
Dexter.move_all_joints(Dexter.NEUTRAL_ANGLES)">NEUTRAL_ANGLES</li>
<li id="move_to_parked_id" title="Runs a job on dexter0 with the instruction:
Dexter.move_all_joints(Dexter.PARKED_ANGLES)">PARKED_ANGLES</li>
<li id="move_to_selection_id" title="Treat the selection as an instruction
to run on dexter0.
A number or number array < 4
are args to move_to.
Arrays of 4 or 5 numbers
are args to move_all_joints.">selection</li>
<li id="run_instruction_dialog_id" title="Show a dialog box for running an instruction on Dexter.">Show Dialog...</li>
</ul>
</li>
<li id="init_dxf_drawing_id" title="Insert a call to DXF.init_drawing into the editor.">DXF.init_drawing()</li>
<li id="calibrate_id" title="Calibrate one or more Dexters. Needed each time you power on a Dexter.">Calibrate Dexter...</li>
<li id="ping_dexter_id" title="Find out if a Dexter or other ip_address is connected to this computer . ">Ping a Dexter...</li>
</ul>
</li>
<li style="display:inline-block;padding-left:3px;padding-right:0px;">Test▼
<ul>
<li id="test_suites_help_id">Help</li>
<li id="insert_test_suite_example_id" title="Insert an example of the JS code for a test suite.">Insert Example</li>
<li>Navigation
<ul>
<li id="ts_run_sel_next_item_id" title="Run the selected test, test suite or test suites
and select the next one.
For speed, use Alt right arrow key.">Run&sel next Alt-→</li>
<li id="ts_sel_next_item_id" title="Select the next without running the selected.
For speed, use Alt Shift right arrow key.">Sel next Alt-Sh-→</li>
<li id="ts_sel_prev_id" title="Select the previous item.
For speed, use Alt left arrow key.">Prev item Alt-←</li>
<li id="ts_sel_down_id" title="Select the first contained item.
For speed, use Alt down arrow key.">Down item Alt-↓</li>
<li id="ts_sel_up_id" title="Select the containing item.
For speed, use Alt up arrow key.">Up Item Alt-↑</li>
</ul>
</li>
<li id="show_suite_statistics_id" title="Show number of suites and tests.">Show suite stats</li>
<!--obsoleted by increased functionality in doc pane Find button <li id="find_test_suites_id" title="Find TestSuites that contain the selected string. With no selection, show all defined test suites.">Find TestSuites</li>-->
<!-- <li id="show_all_test_suites_id" title="Show all test suites' source code in the Output pane.">Show all</li> functionality obtained with Find and no selection -->
<li id="insert_all_test_suites_id" title="Insert all test suites' source code into the Editor.">Insert all</li>
<li id="run_all_test_suites_id" title="Run all defined test suites.">Run all TestSuites</li>
<li id="run_test_suite_file_id" title="Lets user choose file of tests to run.">Run TestSuite File</li>
<li id="selection_to_test_id" title="Wrap a test around the current selection. If no selection, insert an empty test template.">Selection to test</li>
</ul>
</li>
</ul>
</div>
<!-- <div style="vertical-align:top;display:inline-block;line-height: 1.0;font-size:10px;margin:0px;padding:0px;"> -->
<div style="display:inline-block;margin:0px;padding:0px;vertical-align:super;">
<span style="font-size:9px;margin:0px;padding:0px;">fontsize</span><br/>
<input id="font_size_id" type="number" style="vertical-align:top; width:30px;margin:0px;padding:0px;" value="17" min="6"/>
</div>
<select id="file_name_id" style="width:250px;font-size:14px;margin-right:0px;padding-right:0px;vertical-align:50%;" title=""><option>new file</option></select>
<!-- </div> -->
<!--ROS url: <input id='dexter_url' value="localhost:9090" style="font-size:14px;"/> -->
</div>
<textarea id="js_textarea_id" wrap="off" style="width:98%; height:84%; font-size:17px; font-family:monospace;padding:4px;"
placeholder="Enter JavaScript code here."></textarea>
</div>
<div style="background-color:#dddddd;">
<div class='pane_header_wrapper' style="white-space:nowrap;height:80px;min-height:80px;max-height:80px;">
<span id="output_pane_help_id" class='pane_header' title="Click for help."><u>Output</u></span>
<button id="eval_id" style="vertical-align:middle;" title="Evaluate (run) the selected JS in any pane
or, if none, all the JavaScript in the Editor pane.
Can also be invoked by typing ⌘e">Eval</button>
<button id="step_button_id" style="vertical-align:middle;" title="Step through the evaluation of the selected code.">Step</button>
<div style="vertical-align:middle;display:inline-block;margin:0px;padding:0px;">
<div title="Automatically save the edited file
when you click 'Eval',
and when you edit another file."> <input id="save_on_eval_id" type="checkbox" style="padding_bottom:15px;"/> <div style="padding:0px;margin:0px;display:inline-block;font-size:10px; vertical-align:0%;">Save</div></div>
<div title="When checked, 'out' function calls, by default, format the output string as code." style="vertical-align:middle;display:inline-block;"><input id="format_as_code_id" type="checkbox" style="padding_bottom:15px;"/> <div style="padding:0px;margin:0px;display:inline-block;font-size:10px; line-height:10px;">Code</div></div>
</div>
<button id="clear_output_id" title="Remove all previously output text.">Clear</button>
<div id="ros_menu_id" class="dde_menu" style="display:none;margin-left:10px;vertical-align: middle;">
<ul style="display:inline-block;padding:0;margin-top:0px;">
<li style="display:inline-block;">ROS▼
<ul>
<li id="init_ros_id" title="Initialize ROS. Will error without proper set up.">Init ROS</li>
<li title="Get Information about your running ROS">ROS Info
<ul>
<li id="ping_id" title="Connected to ROS?" >ping</li>
<li id="cat_etc_hosts_id" title="Show Internet hosts table." >cat /etc/hosts</li>
<li id="rosversion_id" title="Show the version of your running ROS.">rosversion -d</li>
<li id="roswtf_id" title="General ROS diagnostics." >roswtf</li>
<li id="printenv_id" title="ROS Environment Varibles." >printenv | grep ROS</li>
<li id="rqt_graph_id" title="Graph nodes and topics.
Shows on ROS computer only.">rqt_graph</li>
</ul>
</li>
<li title="Lists of ROS data.">ROS Lists
<ul>
<li id="rosmsg_id" title="Show ROS message types." >rosmsg list</li>
<li id="rosnode_id" title="Show active ROS nodes." >rosnode list</li>
<li id="rospack_id" title="Show ROS packages." >rospack list</li>
<li id="rosparam_id" title="Show ROS params." >rosparam list</li>
<li id="rosservice_is" title="Show active ROS services." >rosservice list</li>
<li id="rostopic_id" title="Show ROS topics." >rostopic list</li>
</ul>
</li>
<li title="The history of recently typed in commands.">User Commands
<ul id="user_cmds_ul">
</ul>
</li>
</ul>
</li>
</ul>
</div>
<div style="display:inline-block;font-size:10px;margin:0px;padding:0px;height:16px;vertical-align:top;">
<input id="js_radio_button_id" type="radio" name="js_or_ros" value="js" checked="checked" style="margin-top:0px;padding-top:0px;"/>JS<br/>
<input id="ros_radio_button_id" type="radio" name="js_or_ros" value="ros"/>ROS
</div>
<input id="cmd_input_id"
placeholder="Type in code & hit Enter key to eval"
title="Type in code & hit Enter key to eval. Up arrow for previous cmd. Down arrow for next cmd or, at end, clear cmd line."
style="font-size:14px;width:500px;"/>
<br/>
<div style="display:inline-block;width:100%;">
<button id="eval_and_start_button_id" style="vertical-align:top;" title="Eval the selected JS.
With the result, call its 'start' method or, 
if its a do_list item, run it in a Job on dexter0.">Eval&Start</button>
<button id="start_job_id" style="vertical-align:top;" title='Eval job that cursor is in and start it. Click on "Output" pane title for doc.'>Start Job</button>
<!-- <button id="stop_all_jobs_id" title="Stop all of the currently running jobs."><b>X</b></button></span> -->
<img id="stop_all_jobs_id" src="stop_sign.png" title="Stop all of the currently running jobs." style="vertical-align:top;"/>
<button id="undefine_jobs_id" style="vertical-align:top;" title="Undefine all jobs that are not running.">Undef</button>
<span style="vertical-align:top; margin-right:0px; padding-right:0px;">Jobs:</span>
<div id="jobs_button_bar_id" style="display:inline-block; vertical-align:100%; height: 50px; width:calc(100% - 320px); overflow-x:auto; padding:0px;margin:0px;">
</div>
</div>
</div>
<div id="output_div_id" contentEditable="false" style="width:98%; height:calc(100% - 100px); font-size:16px;overflow:auto;white-space:nowrap;padding:5px;"></div> <!-- for height:calc(100% - 60px); te60 is the height of the output pane header, This letsthe lower part of outpt pane take up 100% of the hieght of the lower split pane MINUS the outut pane header of 60px.-->
<!-- contentEditable="false" means the text can't be edited BUT for chrome apps, this makes the content selectable and now I can copy and paste it whereas previoiusly I couldn't select and copy it. -->
</div>
</div>
</div>
<div>
<div id="right_splitter">
<div id="doc_pane_id" style="background-color:#e1e1e1; padding-left:5px;">
<div class="pane_header_wrapper" style="height:30px;white-space:nowrap;">
<span id="documentation_pane_help_id" class="pane_header"><u>Doc</u></span>
<span id="doc_prev_id" title='Show previous documentation.' style='cursor:pointer;color:blue;font-weight:900; font-size:20px; opacity:0.3;'><</span>
<span id="doc_next_id" title='Show next documentation.' style='cursor:pointer;color:blue;font-weight:900; font-size:20px; opacity:0.3;'>></span>
<input id="find_doc_input_id" placeholder="search string" title="If this field is empty,
the selection in the
Editor, Cmd line, Doc, or Output
pane is used."
style="width:150px; font-size:14px;"/>
<!--<div style='display:inline-block;' id="find_doc_input_id"/> -->
<button id="find_doc_button_id" title="Find documentation on text to the left
or, if none, selected text anywhere.">Find</button>
<a id="help_system_id" href="#" title="Help on DDE's Help System"><b style="font-size:20px;">?</b></a>
<!-- <button id="eval_doc_button_id" title="Evaluated the selected code
in the Doc pane.
Result goes in the Output pane.ƒ">Eval Doc</button> obsolete now that Out pane Eval button can do this-->
</div>
<div id="doc_pane_content_id" contentEditable="false" style="width:97%; height:90%;padding:5px;overflow:scroll;">
</div>
</div> <!--doc_pane -->
<div id="simulate_pane" style="background-color:black">
<div class="pane_header_wrapper" style="white-space:nowrap;">
<span id="simulate_pane_help_id" class="pane_header" title="Click for help."><u>Sim</u></span>
<select id='videos_id'>
<!--<option value='Simulate Dexter'>Simulate Dexter</option>-->
<option value='All'>All</option>
<option value='None'>None</option>
<!-- <option value='http://hdrobotic.com/videos/'>Dexter Videos</option> can't show these in Sim pane, so forget it -->
<option value='http://static1.squarespace.com/static/55f1275ee4b0c65e2113baa5/563c04f5e4b0904f35c87cbb/563c0973e4b06c4bb72a5c89/1446775444596/HD+Robotics-8517.jpg'>Dexter Photo</option>
<option value='Reference Manual'>Reference Manual</option>
<option value='Choose File'>Choose File</option>
<!--<option value=''>Measurements Video</option>-->
</select>
<button id="demo_id" title="Moves graphical depiction of Dexter randomly." style="padding:2px">Demo</button>
<span title="Pause job execution."><input id="pause_id" type="checkbox"/>Pause</span>
<button id="go_id" title="Continue paused job execution." style="padding:2px">Go</button>
</div>
<div id='sim_pane_content_wrapper'>
<div id="sim_graphics_pane_id"></div>
<div id="video_player_id" style="display:none;"></div>
</div>
</div>
</div>
</div>
</div>
<!-- used by compute_string_size utility -->
<div id="compute_string_size_id"
style="position:absolute;visibility: hidden;height: auto;width: auto;white-space: nowrap;"
</div>
</body>
</html>