mirror of
https://github.com/coderaiser/cloudcmd.git
synced 2026-01-23 18:55:26 +00:00
fixed terminal plagin
This commit is contained in:
coderaiser
parent
d613049334
commit
680dcd1584
8 changed files with 55 additions and 2284 deletions
|
|
@ -1121,6 +1121,15 @@ CloudClient.init = (function(){
|
|||
});
|
||||
|
||||
CloudClient.baseInit = (function(){
|
||||
if(applicationCache){
|
||||
var lFunc = applicationCache.onupdateready;
|
||||
applicationCache.onupdateready = function(){
|
||||
console.log('app cacheed');
|
||||
location.reload();
|
||||
if(typeof lFunc === 'function')
|
||||
lFunc();
|
||||
};
|
||||
}
|
||||
/* меняем title
|
||||
* если js включен - имена папок отображать необязательно...
|
||||
* а может и обязательно при переходе, можно будет это сделать
|
||||
|
|
|
|||
|
|
@ -60,7 +60,7 @@ var CloudCommander;
|
|||
|
||||
};
|
||||
|
||||
var key_event = function(event){
|
||||
var key_event = function(event){
|
||||
/* получаем выдленный файл*/
|
||||
var lCurrentFile = Util.getCurrentFile(),
|
||||
lName, i;
|
||||
|
|
@ -382,7 +382,7 @@ var CloudCommander;
|
|||
|
||||
/* добавляем обработчик клавишь */
|
||||
if(document.addEventListener)
|
||||
document.addEventListener('keydown', key_event,false);
|
||||
document.addEventListener('keydown', key_event, false);
|
||||
else document.onkeydown = key_event;
|
||||
|
||||
/* клавиши назначены*/
|
||||
|
|
|
|||
|
|
@ -1,11 +1,12 @@
|
|||
var CloudCommander;
|
||||
var CloudCommander, $;
|
||||
/* object contains terminal jqconsole */
|
||||
|
||||
(function(){
|
||||
"use strict";
|
||||
|
||||
var cloudcmd = CloudCommander,
|
||||
Util = CloudCommander.Util,
|
||||
KeyBinding = CloudCommander.KeyBinding,
|
||||
JQConsole,
|
||||
TerminalId,
|
||||
Hidden = false;
|
||||
|
||||
|
|
@ -15,28 +16,35 @@ var CloudCommander;
|
|||
|
||||
|
||||
jqconsole.load = (function(){
|
||||
Util.cssLoad({
|
||||
src : 'lib/client/terminal/jqconsole/ansi.css'
|
||||
});
|
||||
|
||||
Util.cssSet({
|
||||
id :'terminal-css',
|
||||
inner :'#terminal{' +
|
||||
'position : relative' +
|
||||
'},' +
|
||||
'#terminal::selection{' +
|
||||
'background: #fe57a1;' +
|
||||
'color: #fff;' +
|
||||
'text-shadow: none;' +
|
||||
'}'
|
||||
});
|
||||
|
||||
Util.jsload('lib/client/terminal/jqconsole/jqconsole-2.7.min.js', function(){
|
||||
jqconsole.init();
|
||||
jqconsole.show();
|
||||
});
|
||||
Util.cssLoad({
|
||||
src : 'lib/client/terminal/jquery-terminal/jquery.terminal.css'
|
||||
});
|
||||
|
||||
Util.cssSet({
|
||||
id :'terminal-css',
|
||||
inner :'#terminal{' +
|
||||
'position : relative' +
|
||||
'},' +
|
||||
'#terminal::selection{' +
|
||||
'background: #fe57a1;' +
|
||||
'color: #fff;' +
|
||||
'text-shadow: none;' +
|
||||
'}'
|
||||
});
|
||||
|
||||
var lLoadTerm_func = function(){
|
||||
Util.jsload('lib/client/terminal/jquery-terminal/jquery.terminal.js',
|
||||
function(){
|
||||
jqconsole.init();
|
||||
jqconsole.show();
|
||||
});
|
||||
};
|
||||
|
||||
Util.jsload('lib/client/terminal/jquery-terminal/jquery.mousewheel.js',
|
||||
lLoadTerm_func);
|
||||
});
|
||||
|
||||
|
||||
jqconsole.init = (function(){
|
||||
if(!TerminalId){
|
||||
var lFM = Util.getById('fm');
|
||||
|
|
@ -57,29 +65,24 @@ var CloudCommander;
|
|||
Util.hidePanel();
|
||||
KeyBinding.unSet();
|
||||
|
||||
$(function () {
|
||||
if(!JQConsole){
|
||||
JQConsole = $('#terminal').jqconsole('Hi\n', '>>>');
|
||||
var startPrompt = function () {
|
||||
// Start the prompt with history enabled.
|
||||
JQConsole.Prompt(true, function (input) {
|
||||
// Output input with the class jqconsole-output.
|
||||
JQConsole.Write(input + '\n', 'jqconsole-output');
|
||||
|
||||
console.log(input);
|
||||
// Restart the prompt.
|
||||
startPrompt();
|
||||
});
|
||||
};
|
||||
startPrompt();
|
||||
}
|
||||
$(function($, undefined) {
|
||||
$('#terminal').terminal(function(command, term) {
|
||||
term.echo('');
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
function jqueryLoad (pCallBack)
|
||||
{
|
||||
/* загружаем jquery: */
|
||||
Util.jsload('lib/client/terminal/jquery-terminal/jquery-1.7.1.min.js',
|
||||
function(){
|
||||
if(typeof pCallBack === 'function')
|
||||
pCallBack();
|
||||
});
|
||||
}
|
||||
|
||||
cloudcmd.Terminal.Keys = (function(){
|
||||
"use strict";
|
||||
|
||||
cloudcmd.Terminal.Keys = (function(){
|
||||
/* loading js and css*/
|
||||
Util.jqueryLoad( jqconsole.load );
|
||||
|
||||
|
|
|
|||
|
|
@ -1,107 +0,0 @@
|
|||
#jq-console
|
||||
|
||||
A simple jQuery terminal plugin written in CoffeeScript.
|
||||
|
||||
This project was spawned because of our need for a simple web terminal plugin
|
||||
for the <a href="http://github.com/amasad/jsrepl">jsREPL</a> project. It
|
||||
tries to simulate a low level terminal by providing (almost) raw input/output
|
||||
streams as well as input and output states.
|
||||
|
||||
##Tested Browsers
|
||||
|
||||
The plugin has been tested on the following browsers:
|
||||
|
||||
* IE 8
|
||||
* Chrome 10
|
||||
* Firefox 3.6
|
||||
* Safari 4
|
||||
* Opera 10
|
||||
|
||||
##Getting Started
|
||||
|
||||
###Instantiating
|
||||
|
||||
var jqconsole = $(div).jqconsole(welcomeString);
|
||||
|
||||
* `div` is the div element or selector.
|
||||
* `welcomeString` is the string to be shown when the terminal is first rendered.
|
||||
|
||||
###Configuration
|
||||
|
||||
There isn't much initial configuration needed, because the user must supply
|
||||
options and callbacks with each state change. The only config method is used to
|
||||
create custom shortcuts:
|
||||
|
||||
* `jqconsole.RegisterShortcut`: Registers a callback for a keyboard shortcut.
|
||||
It takes two arguments:
|
||||
|
||||
* `int keyCode`: The code of the key pressing which (when Ctrl is held) will
|
||||
trigger this shortcut.
|
||||
|
||||
* `function callback`: A function called when the shortcut is pressed;
|
||||
"this" will point to the JQConsole object.
|
||||
|
||||
Example:
|
||||
|
||||
// Ctrl+R: resets the console.
|
||||
jqconsole.RegisterShortCut(82, function() {
|
||||
this.Reset();
|
||||
});
|
||||
|
||||
##Usage
|
||||
|
||||
Unlike most terminal plugins, jq-console gives you complete low-level control
|
||||
over the execution; you have to call the appropriate methods to start input
|
||||
or output:
|
||||
|
||||
* `jqconsole.Input`: Asks user for input. It takes three arguments:
|
||||
|
||||
* `bool history_enabled`: Whether this input should use history. If true,
|
||||
the user can select the input from history, and their input will also be
|
||||
added as a new history item.
|
||||
|
||||
* `function result_callback`: A function called with the user's input when
|
||||
the user presses Enter and the input operation is complete.
|
||||
|
||||
* `function multiline_callback`: If specified, this function is called when
|
||||
the user presses Enter to check whether the input should continue to the
|
||||
next line. If this function returns a falsy value, the input operation
|
||||
is completed. Otherwise, input continues and the cursor moves to the next
|
||||
line.
|
||||
|
||||
Example:
|
||||
|
||||
jqconsole.Input(true, function(input) {
|
||||
alert(input);
|
||||
}, function (input) {
|
||||
return /\\$/.test('asdasd \\');
|
||||
});
|
||||
|
||||
* `jqconsole.Write`: Writes the given text to the console in a `<span>`, with an
|
||||
optional class. This is used for output and writing prompt labels. It takes
|
||||
two arguments:
|
||||
|
||||
* `string text`: The text to write.
|
||||
|
||||
* `string cls`: The class to give the span containing the text. Optional.
|
||||
|
||||
Examples:
|
||||
|
||||
jqconsole.Write('>>>', 'prompt')
|
||||
jqconsole.Write(output, 'output')
|
||||
jqconsole.Write(err.message, 'error')
|
||||
|
||||
* `jqconsole.SetPromptText` Sets the text currently in the input prompt. Takes
|
||||
only one parameter:
|
||||
|
||||
* `string text`: The text to put in the prompt.
|
||||
|
||||
Examples:
|
||||
|
||||
jqconsole.SetPromptText('ls')
|
||||
jqconsole.SetPromptText('print [i ** 2 for i in range(10)]')
|
||||
|
||||
##Contributors
|
||||
|
||||
[Max Shawabkeh](http://max99x.com/)
|
||||
[Amjad Masad](http://twitter.com/amjad_masad)
|
||||
|
|
@ -1,678 +0,0 @@
|
|||
#jq-console
|
||||
|
||||
A jQuery terminal plugin written in CoffeeScript.
|
||||
|
||||
This project was spawned because of our need for a simple web terminal plugin
|
||||
for the <a href="http://repl.it">repl.it</a> project. It tries to simulate a low level terminal by providing (almost)
|
||||
raw input/output streams as well as input and output states.
|
||||
|
||||
Version 2.0 adds baked-in support for rich multi-line prompting and operation
|
||||
queueing.
|
||||
|
||||
NOTE: This info is for jq-console v2.0. For jq-console v1.0 see README-v1.md.
|
||||
|
||||
|
||||
##Tested Browsers
|
||||
|
||||
The plugin has been tested on the following browsers:
|
||||
|
||||
* IE 9-10
|
||||
* Chrome 10-14
|
||||
* Firefox 3.6-6
|
||||
* Opera 11
|
||||
|
||||
|
||||
##Getting Started
|
||||
|
||||
###Echo example
|
||||
|
||||
```css
|
||||
/* The console container element */
|
||||
#console {
|
||||
position: absolute;
|
||||
width: 400px;
|
||||
height: 500px;
|
||||
background-color:black;
|
||||
}
|
||||
/* The inner console element. */
|
||||
.jqconsole {
|
||||
padding: 10px;
|
||||
}
|
||||
/* The cursor. */
|
||||
.jqconsole-cursor {
|
||||
background-color: gray;
|
||||
}
|
||||
/* The cursor color when the console looses focus. */
|
||||
.jqconsole-blurred .jqconsole-cursor {
|
||||
background-color: #666;
|
||||
}
|
||||
/* The current prompt text color */
|
||||
.jqconsole-prompt {
|
||||
color: #0d0;
|
||||
}
|
||||
/* The command history */
|
||||
.jqconsole-old-prompt {
|
||||
color: #0b0;
|
||||
font-weight: normal;
|
||||
}
|
||||
/* The text color when in input mode. */
|
||||
.jqconsole-input {
|
||||
color: #dd0;
|
||||
}
|
||||
/* Previously entered input. */
|
||||
.jqconsole-old-input {
|
||||
color: #bb0;
|
||||
font-weight: normal;
|
||||
}
|
||||
/* The text color of the output. */
|
||||
.jqconsole-output {
|
||||
color: white;
|
||||
}
|
||||
```
|
||||
|
||||
```html
|
||||
<div id="console"></div>
|
||||
<script src="jquery.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="jqconsole.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script>
|
||||
$(function () {
|
||||
var jqconsole = $('#console').jqconsole('Hi\n', '>>>');
|
||||
var startPrompt = function () {
|
||||
// Start the prompt with history enabled.
|
||||
jqconsole.Prompt(true, function (input) {
|
||||
// Output input with the class jqconsole-output.
|
||||
jqconsole.Write(input + '\n', 'jqconsole-output');
|
||||
// Restart the prompt.
|
||||
startPrompt();
|
||||
});
|
||||
};
|
||||
startPrompt();
|
||||
});
|
||||
</script>
|
||||
```
|
||||
<iframe src="demo/echo.html" style="width:400px;height:500px">
|
||||
</iframe>
|
||||
|
||||
###Instantiating
|
||||
|
||||
```javascript
|
||||
$(div).jqconsole(welcomeString, promptLabel, continueLabel);
|
||||
```
|
||||
|
||||
* `div` is the div element or selector. Note that this element must be
|
||||
explicity sized and positioned `absolute` or `relative`.
|
||||
* `welcomeString` is the string to be shown when the terminal is first rendered.
|
||||
* `promptLabel` is the label to be shown before the input when using Prompt().
|
||||
* `continueLabel` is the label to be shown before the continued lines of the
|
||||
input when using Prompt().
|
||||
|
||||
##Configuration
|
||||
|
||||
There isn't much initial configuration needed, because the user must supply
|
||||
options and callbacks with each state change. There are a few config methods
|
||||
provided to create custom shortcuts and change indentation width:
|
||||
|
||||
###jqconsole.RegisterShortcut
|
||||
Registers a callback for a keyboard shortcut.
|
||||
Takes two arguments:
|
||||
|
||||
* __(int|string)__ *keyCode*: The code of the key pressing which (when Ctrl is
|
||||
held) will trigger this shortcut. If a string is provided, the ASCII code
|
||||
of the first character is taken.
|
||||
|
||||
* __function__ *callback*: A function called when the shortcut is pressed;
|
||||
"this" will point to the JQConsole object.
|
||||
|
||||
|
||||
Example:
|
||||
|
||||
// Ctrl+R: resets the console.
|
||||
jqconsole.RegisterShortcut('R', function() {
|
||||
this.Reset();
|
||||
});
|
||||
|
||||
###jqconsole.SetIndentWidth
|
||||
Sets the number of spaces inserted when indenting and removed when unindenting.
|
||||
Takes one argument:
|
||||
|
||||
* __int__ *width*: The code of the key pressing which (when Ctrl is held) will
|
||||
trigger this shortcut.
|
||||
|
||||
|
||||
Example:
|
||||
|
||||
// Sets the indent width to 4 spaces.
|
||||
jqconsole.SetIndentWidth(4);
|
||||
|
||||
###jqconsole.RegisterMatching
|
||||
Registers an opening and closing characters to match and wraps each of the
|
||||
opening and closing characters with a span with the specified class.
|
||||
Takes one parameters:
|
||||
|
||||
* __char__ *open*: The opening character of a "block".
|
||||
* __char__ *close*: The closing character of a "block".
|
||||
* __string__ *class*: The css class that is applied to the matched characters.
|
||||
|
||||
|
||||
Example:
|
||||
|
||||
jqconsole.RegisterMatching('{', '}', 'brackets');
|
||||
|
||||
##Usage
|
||||
|
||||
Unlike most terminal plugins, jq-console gives you complete low-level control
|
||||
over the execution; you have to call the appropriate methods to start input
|
||||
or output:
|
||||
|
||||
###jqconsole.Input:
|
||||
Asks user for input. If another input or prompt operation is currently underway,
|
||||
the new input operation is enqueued and will be called when the current
|
||||
operation and all previously enqueued operations finish. Takes one argument:
|
||||
|
||||
* __function__ *input_callback*: A function called with the user's input when
|
||||
the user presses Enter and the input operation is complete.
|
||||
|
||||
|
||||
Example:
|
||||
|
||||
// Echo the input.
|
||||
jqconsole.Input(function(input) {
|
||||
jqconsole.Write(input);
|
||||
});
|
||||
|
||||
|
||||
###jqconsole.Prompt
|
||||
Asks user for input. If another input or prompt operation is currently underway
|
||||
the new prompt operation is enqueued and will be called when the current
|
||||
peration and all previously enqueued operations finish. Takes three arguments:
|
||||
|
||||
* __bool__ *history_enabled*: Whether this input should use history. If true,
|
||||
the user can select the input from history, and their input will also be
|
||||
added as a new history item.
|
||||
|
||||
* __function__ *result_callback*: A function called with the user's input when
|
||||
the user presses Enter and the prompt operation is complete.
|
||||
|
||||
* __function__ *multiline_callback*: If specified, this function is called when
|
||||
the user presses Enter to check whether the input should continue to the
|
||||
next line. The function must return one of the following values:
|
||||
|
||||
* `false`: the input operation is completed.
|
||||
|
||||
* `0`: the input continues to the next line with the current indent.
|
||||
|
||||
* `N` (int): the input continues to the next line, and the current
|
||||
indent is adjusted by `N`, e.g. `-2` to unindent two levels.
|
||||
|
||||
|
||||
* __bool__ *async_multiline*: Whether the multiline callback function should
|
||||
be treated as an asynchronous operation and be passed a continuation
|
||||
function that should be called with one of the return values mentioned
|
||||
above: `false`/`0`/`N`.
|
||||
|
||||
|
||||
Example:
|
||||
|
||||
jqconsole.Prompt(true, function(input) {
|
||||
// Alert the user with the command.
|
||||
alert(input);
|
||||
}, function (input) {
|
||||
// Continue if the last character is a backslash.
|
||||
return /\\$/.test(input);
|
||||
});
|
||||
|
||||
###jqconsole.AbortPrompt
|
||||
Aborts the current prompt operation and returns to output mode or the next
|
||||
queued input/prompt operation. Takes no arguments.
|
||||
|
||||
Example:
|
||||
|
||||
jqconsole.Prompt(true, function(input) {
|
||||
alert(input);
|
||||
});
|
||||
// Give the user 2 seconds to enter the command.
|
||||
setTimeout(function() {
|
||||
jqconsole.AbortPrompt();
|
||||
}, 2000);
|
||||
|
||||
###jqconsole.Write
|
||||
Writes the given text to the console in a `<span>`, with an
|
||||
optional class. If a prompt is currently being shown, the text is inserted
|
||||
before it. Takes two arguments:
|
||||
|
||||
* __string__ *text*: The text to write.
|
||||
|
||||
* __string__ *cls*: The class to give the span containing the text. Optional.
|
||||
|
||||
* __bool__ *escape*: Whether the text to write should be html escaped.
|
||||
Optional, defaults to true.
|
||||
|
||||
|
||||
Examples:
|
||||
|
||||
jqconsole.Write(output, 'my-output-class')
|
||||
jqconsole.Write(err.message, 'my-error-class')
|
||||
|
||||
|
||||
###jqconsole.SetPromptText
|
||||
Sets the text currently in the input prompt. Takes one parameter:
|
||||
|
||||
* __string__ *text*: The text to put in the prompt.
|
||||
|
||||
Examples:
|
||||
|
||||
jqconsole.SetPromptText('ls')
|
||||
jqconsole.SetPromptText('print [i ** 2 for i in range(10)]')
|
||||
|
||||
|
||||
###jqconsole.ClearPromptText
|
||||
Clears all the text currently in the input prompt. Takes one parameter:
|
||||
|
||||
* __bool__ *clear_label*: If specified and true, also clears the main prompt
|
||||
label (e.g. ">>>").
|
||||
|
||||
|
||||
Example:
|
||||
|
||||
jqconsole.ClearPromptText()
|
||||
|
||||
|
||||
###jqconsole.GetPromptText
|
||||
Returns the contents of the prompt. Takes one parameter:
|
||||
|
||||
* __bool__ *full*: If specified and true, also includes the prompt labels
|
||||
(e.g. ">>>").
|
||||
|
||||
|
||||
Examples:
|
||||
|
||||
var currentCommand = jqconsole.GetPromptText()
|
||||
var logEntry = jqconsole.GetPromptText(true)
|
||||
|
||||
|
||||
###jqconsole.Reset
|
||||
Resets the console to its initial state, cancelling all current and pending
|
||||
operations. Takes no parameters.
|
||||
|
||||
Example:
|
||||
|
||||
jqconsole.Reset()
|
||||
|
||||
|
||||
###jqconsole.GetColumn
|
||||
Returns the 0-based number of the column on which the cursor currently is.
|
||||
Takes no parameters.
|
||||
|
||||
Example:
|
||||
|
||||
// Show the current line and column in a status area.
|
||||
$('#status').text(jqconsole.GetLine() + ', ' + jqconsole.GetColumn())
|
||||
|
||||
|
||||
###jqconsole.GetLine
|
||||
Returns the 0-based number of the line on which the cursor currently is.
|
||||
Takes no parameters.
|
||||
|
||||
Example:
|
||||
|
||||
// Show the current line and column in a status area.
|
||||
$('#status').text(jqconsole.GetLine() + ', ' + jqconsole.GetColumn())
|
||||
|
||||
###jqconsole.Focus
|
||||
Forces the focus onto the console so events can be captured.
|
||||
Takes no parameters.
|
||||
|
||||
Example:
|
||||
|
||||
// Redirect focus to the console whenever the user clicks anywhere.
|
||||
$(window).click(function() {
|
||||
jqconsole.Focus();
|
||||
})
|
||||
|
||||
|
||||
###jqconsole.GetIndentWidth
|
||||
Returns the number of spaces inserted when indenting. Takes no parameters.
|
||||
|
||||
Example:
|
||||
|
||||
jqconsole.SetIndentWidth(4);
|
||||
console.assert(jqconsole.GetIndentWidth() == 4);
|
||||
|
||||
|
||||
###jqconsole.UnRegisterMatching
|
||||
Deletes a certain matching settings set by `jqconsole.RegisterMatching`.
|
||||
Takes two paramaters:
|
||||
|
||||
* __char__ *open*: The opening character of a "block".
|
||||
* __char__ *close*: The closing character of a "block".
|
||||
|
||||
|
||||
Example:
|
||||
|
||||
jqconsole.UnRegisterMatching('{', '}');
|
||||
|
||||
|
||||
###jqconsole.Dump
|
||||
Returns the text content of the console.
|
||||
|
||||
###jqconsole.GetState
|
||||
Returns the current state of the console. Could be one of the following:
|
||||
|
||||
* Input: `"input"`
|
||||
* Output: `"output"`
|
||||
* Prompt: `"prompt"`
|
||||
|
||||
|
||||
Example:
|
||||
|
||||
jqconsole.GetState(); //output
|
||||
|
||||
|
||||
###jqconsole.MoveToStart
|
||||
Moves the cursor to the start of the current line.
|
||||
Takes one parameter:
|
||||
|
||||
* __bool__ *all_lines*: If true moves the cursor to the beginning of the first
|
||||
line in the current prompt. Defaults to false.
|
||||
|
||||
|
||||
Example:
|
||||
|
||||
// Move to line start Ctrl+A.
|
||||
jqconsole.RegisterShortcut('A', function() {
|
||||
jqconsole.MoveToStart();
|
||||
handler();
|
||||
});
|
||||
|
||||
|
||||
###jqconsole.MoveToEnd
|
||||
Moves the cursor to the end of the current line.
|
||||
Takes one parameter:
|
||||
|
||||
* __bool__ *all_lines*: If true moves the cursor to the end of the first
|
||||
line in the current prompt. Defaults to false.
|
||||
|
||||
Example:
|
||||
|
||||
// Move to line end Ctrl+E.
|
||||
jqconsole.RegisterShortcut('E', function() {
|
||||
jqconsole.MoveToEnd();
|
||||
handler();
|
||||
});
|
||||
|
||||
###jqconsole.Disable
|
||||
Disables input and focus on the console.
|
||||
|
||||
|
||||
###jqconsole.Enable
|
||||
Enables input and focus on the console.
|
||||
|
||||
|
||||
###jqconsole.IsDisabled
|
||||
Returns true if the console is disabled.
|
||||
|
||||
|
||||
###jqconsole.ResetHistory
|
||||
Resets the console history.
|
||||
|
||||
|
||||
###jqconsole.ResetMatchings
|
||||
Resets the character matching configuration.
|
||||
|
||||
|
||||
###jqconsole.ResetShortcuts
|
||||
Resets the shortcut configuration.
|
||||
|
||||
|
||||
##Default Key Config
|
||||
|
||||
The console responds to the followind keys and key combinations by default:
|
||||
|
||||
* `Delete`: Delete the following character.
|
||||
* `Ctrl+Delete`: Delete the following word.
|
||||
* `Backspace`: Delete the preceding character.
|
||||
* `Ctrl+Backspace`: Delete the preceding word.
|
||||
* `Ctrl+Left`: Move one word to the left.
|
||||
* `Ctrl+Right`: Move one word to the right.
|
||||
* `Home`: Move to the beginning of the current line.
|
||||
* `Ctrl+Home`: Move to the beginnig of the first line.
|
||||
* `End`: Move to the end of the current line.
|
||||
* `Ctrl+End`: Move to the end of the last line.
|
||||
* `Shift+Up`, `Ctrl+Up`: Move cursor to the line above the current one.
|
||||
* `Shift+Down`, `Ctrl+Down`: Move cursor to the line below the current one.
|
||||
* `Tab`: Indent.
|
||||
* `Shift+Tab`: Unindent.
|
||||
* `Up`: Previous history item.
|
||||
* `Down`: Next history item.
|
||||
* `Enter`: Finish input/prompt operation. See Input() and Prompt() for details.
|
||||
* `Shift+Enter`: New line.
|
||||
* `Page Up`: Scroll console one page up.
|
||||
* `Page Down`: Scroll console one page down.
|
||||
|
||||
##ANSI escape code SGR support
|
||||
|
||||
jq-console implements a large subset of the ANSI escape code graphics.
|
||||
Using the `.Write` method you could add style to the console using
|
||||
the following syntax:
|
||||
|
||||
`ASCII 27 (decimal) or 0x1b (hex)` `[` `SGR code` `m`
|
||||
|
||||
Example:
|
||||
|
||||
jqconsole.Write('\033[31mRed Text');
|
||||
|
||||
Note that the third parameter `escape` must be true which defaults to it.
|
||||
|
||||
You'll need to include the `ansi.css` file for default effects or create your
|
||||
own using the css classes from the table below.
|
||||
|
||||
###SGR
|
||||
[Reference](http://en.wikipedia.org/wiki/ANSI_escape_code#graphics).
|
||||
<table>
|
||||
<tr>
|
||||
<th>Code</th>
|
||||
<th>Effect</th>
|
||||
<th>Class</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>0</td>
|
||||
<td>Reset / Normal</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>Bold</td>
|
||||
<td>`jqconsole-ansi-bold`</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td>Faint</td>
|
||||
<td>`jqconsole-ansi-lighter`</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>3</td>
|
||||
<td>Italic</td>
|
||||
<td>`jqconsole-ansi-italic`</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>4</td>
|
||||
<td>Line below text</td>
|
||||
<td>`jqconsole-ansi-underline`</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>5</td>
|
||||
<td>Blink: 1s delay</td>
|
||||
<td>`jqconsole-ansi-blink`</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>6</td>
|
||||
<td>Blink: 0.5s delay</td>
|
||||
<td>`jqconsole-ansi-blink-rapid`</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>8</td>
|
||||
<td>Hide text</td>
|
||||
<td>`jqconsole-ansi-hidden`</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>9</td>
|
||||
<td>Line through text</td>
|
||||
<td>`jqconsole-ansi-line-through`</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>10</td>
|
||||
<td>Remove all fonts</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>11-19</td>
|
||||
<td>Add custom font</td>
|
||||
<td>`jqconsole-ansi-fonts-{N}` where N is code - 10</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>20</td>
|
||||
<td>Add Fraktur font (not implemented in ansi.css)</td>
|
||||
<td>`jqconsole-ansi-fraktur`</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>21</td>
|
||||
<td>Remove Bold and Faint effects</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>22</td>
|
||||
<td>Same as 21</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>23</td>
|
||||
<td>Remove italic and fraktur effects</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>24</td>
|
||||
<td>Remove underline effect</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>25</td>
|
||||
<td>Remove blinking effect(s).</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>28</td>
|
||||
<td>Reveal text</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>29</td>
|
||||
<td>Remove line-through effect</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>30-37</td>
|
||||
<td>Set foreground color to color from the color table below</td>
|
||||
<td>jqconsole-ansi-color-{COLOR} where {COLOR} is the color name</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>39</td>
|
||||
<td>Restore default foreground color</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>40-47</td>
|
||||
<td>Set background color to color from the color table below</td>
|
||||
<td>`jqconsole-ansi-background-color-{COLOR}` where {COLOR} is the color name</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>49</td>
|
||||
<td>Restore default background color</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>51</td>
|
||||
<td>Adds a frame around the text</td>
|
||||
<td>`jqconsole-ansi-framed`</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>53</td>
|
||||
<td>Line above text</td>
|
||||
<td>jqconsole-ansi-overline</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>54</td>
|
||||
<td>Remove frame effect</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>55</td>
|
||||
<td>Remove over-line effect</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
###Colors
|
||||
[Reference](http://en.wikipedia.org/wiki/ANSI_escape_code#Colors).
|
||||
<table>
|
||||
<tr>
|
||||
<th>Code offset</th>
|
||||
<th>Color</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>0</td>
|
||||
<td>Black</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>Red</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td>Green</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>3</td>
|
||||
<td>Yellow</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>4</td>
|
||||
<td>Blue</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>5</td>
|
||||
<td>Magenta</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>6</td>
|
||||
<td>Cyan</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>7</td>
|
||||
<td>White</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
##CSS Classes
|
||||
|
||||
Several CSS classes are provided to help stylize the console:
|
||||
|
||||
* `jqconsole`: The main console container.
|
||||
* `jqconsole, jqconsole-blurred`: The main console container, when not in focus.
|
||||
* `jqconsole-cursor`: The cursor.
|
||||
* `jqconsole-header`: The welcome message at the top of the console.
|
||||
* `jqconsole-input`: The prompt area during input. May have multiple lines.
|
||||
* `jqconsole-old-input`: Previously-entered inputs.
|
||||
* `jqconsole-prompt`: The prompt area during prompting. May have multiple lines.
|
||||
* `jqconsole-old-prompt`: Previously-entered prompts.
|
||||
* `jqconsole-composition`: The div encapsulating the composition of multi-byte
|
||||
characters.
|
||||
|
||||
|
||||
Of course, custom classes may be specified when using `jqconsole.Write()` for
|
||||
further customization.
|
||||
|
||||
|
||||
##Contributors
|
||||
|
||||
[Max Shawabkeh](http://max99x.com/)
|
||||
[Amjad Masad](http://twitter.com/amjad_masad)
|
||||
|
|
@ -1,172 +0,0 @@
|
|||
.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;
|
||||
}
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load diff
Loading…
Add table
Add a link
Reference in a new issue