Gate One's JavaScript is made up of several modules (aka plugins), each pertaining to a specific type of activity. These modules are laid out like so:
The properties and functions of each respective module are outlined below.
Note
Why is GateOne.Base before GateOne? Two reasons: 1) Because that's how it is laid out in the code. 2) The module-loading functions are all inside GateOne.Base.
The Base module is mostly copied from MochiKit and consists of the following:
- GateOne.Base.module(parent, name, version, deps)¶
Creates a new name module in a parent namespace. This function will create a new empty module object with NAME, VERSION, toString and __repr__ properties. It will also verify that all the strings in deps are defined in parent, or an error will be thrown.
Arguments:
- parent (object) -- The parent module or namespace (object).
- name -- A string representing the new module name.
- version -- The version string for this module (e.g. "1.0").
- deps -- An array of module dependencies, as strings.
The following example would create a new object named, "Net", attach it to the GateOne object, at version "0.9", with GateOne.Base and GateOne.Utils as dependencies:
> GateOne.Base.module(GateOne, 'Net', '0.9', ['Base', 'Utils']); > GateOne.Net.__repr__(); "[GateOne.Net 0.9]" > GateOne.Net.NAME; "GateOne.Net"
- GateOne.Base.update(self, obj[, obj2, ...])¶
Mutate self by replacing its key:value pairs with those from other object(s). Key:value pairs from later objects will overwrite those from earlier objects.
If self is null, a new Object instance will be created and returned.
This mutates and returns self, be warned.
Arguments:
- self (object) -- The object you wish to mutate with obj.
- obj -- Any given JavaScript object (e.g. {}).
Returns: self
The following example would mutate GateOne.Net with a new function, "someFunc()".
> GateOne.Base.update(GateOne.Net, {someFunc: function(i) { return "someFunc() was just executed with " + i + "."; }}); > GateOne.Net.someFunc('1234'); "someFunc() was just executed with 1234."Note
In this example, if GateOne.Net.someFunc() already existed, it would be overridden.
GateOne.Base.update() can be used to combine multiple sets of objects into one single object with latter objects taking precedence. Essentially, it's a way to emulate Python-style class mixins with JavaScript objects.
GateOne is the base object for all of GateOne's client-side JavaScript. Besides the aforementioned modules (Utils, Net, Input, Visual, and Terminal), it contains the following properties, objects, and methods:
Note
These are ordered by importance/usefulness.
This is where all of Gate One's client-side preferences are kept. If the client changes them they will be saved in localStorage['prefs']. Also, these settings can be passed to GateOne.init() as an object in the first argument like so:
GateOne.init({fillContainer: false, style: {'width': '50em', 'height': '32em'}, scheme: 'white'});
Each individual setting is outlined below:
GateOne.prefs.url = window.location.href;
URL of the Gate One server. Gate One will open a WebSocket to this URL, converting 'http://' and 'https://' to 'ws://' and 'wss://'.
GateOne.prefs.fillContainer = true;
If set to true, GateOne.prefs.goDiv (e.g. #gateone) will fill itself out to the full size of its parent element.
GateOne.prefs.style = {};
An object that will be used to apply styles to GateOne.prefs.goDiv element (#gateone by default). Example:
GateOne.prefs.style = {'padding': '1em', 'margin': '0.5em'};
Note
Width and height will be skipped if fillContainer is true.
GateOne.prefs.goDiv = '#gateone';
The element to place Gate One inside of.
GateOne.prefs.scrollback = 500;
The default number of lines of scrollback that clients will be instructed to use. Clients will still be able to change it.
GateOne.prefs.rows = null;
This will force the number of rows in the terminal. If null, Gate One will automatically figure out how many will fit within GateOne.prefs.goDiv.
GateOne.prefs.cols = null;
This will force the number of columns in the terminal. If null, Gate One will automatically figure out how many will fit within GateOne.prefs.goDiv.
GateOne.prefs.prefix = 'go_';
Instructs Gate One to prefix all elements it creates with this string (except GateOne.prefs.goDiv itself). You usually won't want to change this unless you're embedding Gate One into a page where a name conflict exists (e.g. you already have an element named #go_notice). The Gate One server will be made aware of this setting when the client connects so it can apply it to all generated templates.
GateOne.prefs.scheme = 'black';
This sets the default CSS scheme. Clients will still be able to change it.
GateOne.prefs.autoConnectURL = null;
If the SSH plugin is installed, this setting can be used to ensure that whenever a client connects it will automatically connect to the given SSH URL. Here's an example where Gate One would auto-connect as a guest user to localhost (hypothetical terminal program demo):
GateOne.prefs.autoConnectURL = 'ssh://guest:guest@localhost:22;
GateOne.prefs.embedded = false;
This instructs Gate One to run without any interface elements, strictly applying what was provided to GateOne.init().
Note
Doesn't do anything yet. Should be available in 1.0.
Terminal-specific settings and information are stored within this object like so:
GateOne.terminals['1'] = { backspace: String.fromCharCode(127), columns: 165, created: Date(), mode: "default", playbackFrames: Array(), prevScreen: Array(), rows: 45, screen: Array(), scrollback: Array(), scrollbackTimer: 2311, scrollbackVisible: true, sshConnectString: "user@localhost:22" };
Each terminal in Gate One has its own object--referenced by terminal number--attached to terminals that gets created when a new terminal is opened (in GateOne.Terminal.newTerminal()). Theses values and what they mean are outlined below:
GateOne.terminals[num].backspace = String.fromCharCode(127);
The backspace key used by this terminal. One of ^? (String.fromCharCode(127)) or ^H (String.fromCharCode(8)).
Note
Not configurable yet. Should be soon.
GateOne.terminals[num].columns = GateOne.prefs.cols;
The number of columns this terminal is configured to use. Unless the user changed it, it will match whatever is in GateOne.prefs.cols.
GateOne.terminals[num].created = new Date();
The date and time a terminal was originally created.
GateOne.terminals[num].mode = "default";
The current keyboard input mode of the terminal. One of "default" or "appmode" representing whether or not the terminal is in standard or "application cursor keys" mode (which changes what certain keystrokes send to the Gate One server).
GateOne.terminals[num].playbackFrames = Array();
This is where Gate One stores the frames of your session so they can be played back on-the-fly.
Note
playbackFrames only gets used if the playback plugin is available.
GateOne.terminals[num].prevScreen = Array(); // Whatever was last in GateOne.terminals[num].screen
This stores the previous screen array from the last time the terminal was updated. Gate One's terminal update protocol only sends lines that changed since the last screen was sent. This variable allows us to create an updated screen from just the line that changed.
GateOne.terminals[num].rows = GateOne.prefs.rows;
The number of rows this terminal is configured to use. Unless the user changed it, it will match whatever is in GateOne.prefs.rows.
GateOne.terminals[num].screen = Array();
This stores the current terminal's screen as an array of lines.
GateOne.terminals[num].scrollback = Array();
Stores the given terminal's scrollback buffer (so we can remove/replace it at-will).
GateOne.terminals[num].scrollbackVisible = true;
Kept up to date on the current status of whether or not the scrollback buffer is visible in the terminal (so we don't end up replacing it or removing it when we don't have to).
GateOne.terminals[num].sshConnectString = "ssh://user@somehost:22"; // Will actually be whatever the user connected to
If the SSH plugin is enabled, this variable contains the connection string used by the SSH client to connect to the server.
Note
This is a good example of a plugin using GateOne.terminals to great effect.
This is where Gate One stores all of its (inline) SVG icons. If your plugin has its own icons they can be kept in here. Here's a (severely shortened) example from the Bookmarks plugin:
GateOne.Icons['bookmark'] = '<svg xmlns:rdf="blah blah">svg stuff here</svg>';
For reference, using an existing icon is as easy as:
someElement.appendChild(GateOne.Icons['close']);
Note
All of Gate One's icons use a linearGradient that has stop points--stop1, stop2, stop3, and stop4--defined in CSS. This allows the SVG icons to change color with the CSS scheme. If you're writing your own plugin with it's own icon(s) it would be best to use the same stop points.
All modules (aka plugins) loaded via GateOne.Base.module() are kept here as a quick reference. For example:
> GateOne.loadedModules;
[
"GateOne.Base",
"GateOne.Utils",
"GateOne.Net",
"GateOne.Input",
"GateOne.Visual",
"GateOne.Terminal",
"GateOne.Bookmarks",
"GateOne.Help",
"GateOne.Logging",
"GateOne.Playback",
"GateOne.SSH"
]
Holds Gate One's open WebSocket object.
Warning
Only use this if you know what you're doing.
GateOne only contains one function: init. It is responsible for setting up Gate One's interface, connecting to the server, (re)loading user preferences, and calling the init() function of each module/plugin:
- GateOne.init(prefs)¶
Initalizes Gate One and calls each module's init() function.
Arguments:
- prefs (object) -- An object containing the settings that will be used by Gate One. See GateOne.prefs under Properties for details on what can be set.
Example:
GateOne.init({url: 'https://console12.serialconcentrators.mycompany.com/', scheme: 'black'});
This module consists of a collection of utility functions used throughout Gate One. Think of it like a mini JavaScript library of useful tools.
A simplified version of MochiKit's createDOM function, it creates a tagname (e.g. "div") element using the given properties.
Arguments: |
|
---|---|
Returns: | A node suitable for adding to the DOM. |
Examples:
myDiv = GateOne.Utils.createElement('div', {'id': 'foo', 'style': {'opacity': 0.5, 'color': 'black'}});
myAnchor = GateOne.Utils.createElement('a', {'id': 'liftoff', 'href': 'http://liftoffsoftware.com/'});
myParagraph = GateOne.Utils.createElement('p', {'id': 'some_paragraph'});
Deletes the given cookie (name) from path for the given domain.
Arguments: |
|
---|
Examples:
GateOne.Utils.deleteCookie('user', '/', ''); // Deletes the 'user' cookie
Returns true if str ends with substr.
Arguments: |
|
---|---|
Returns: | true/false |
Examples:
> GateOne.Utils.endsWith('.txt', 'somefile.txt');
true
> GateOne.Utils.endsWith('.txt', 'somefile.svg');
false
Returns the height and width of 1em inside the given elem (e.g. '#term1_pre'). The returned object will be in the form of:
{'w': <width in px>, 'h': <height in px>}
Arguments: |
|
---|---|
Returns: | An object containing the width and height as obj.w and obj.h. |
Example:
> GateOne.Utils.getEmDimensions('#gateone');
{'w': 8, 'h': 15}
Returns a DOM node if given a querySelector-style string or an existing DOM node (will return the node as-is).
Note
The benefit of this over just document.querySelector() is that if it is given a node it will return the node as-is (so functions can accept both without having to worry about such things). See removeElement() below for a good example.
Arguments: |
|
---|---|
Returns: | A DOM node or null if not found. |
Example:
goDivNode = GateOne.Utils.getNode('#gateone');
Calculates and returns the number of text rows and colunmns that will fit in the given element (elem) as an object like so:
{'cols': 165, 'rows': 45}
Arguments: |
|
---|---|
Returns: | An object with obj.cols and obj.rows representing the maximum number of columns and rows of text that will fit inside elem. |
Warning
elem must be a basic block element such as DIV, SPAN, P, PRE, etc. Elements that require sub-elements such as TABLE (requires TRs and TDs) probably won't work.
Note
This function only works properly with monospaced fonts but it does work with high-resolution displays (so users with properly-configured high-DPI displays will be happy =). Other similar functions I've found on the web had hard-coded pixel widths for known fonts at certain point sizes. These break on any display with a resolution higher than 96dpi.
Example:
> GateOne.Utils.getRowsAndColumns('#gateone');
{'cols': 165, 'rows': 45}
Returns: | The text that is currently highlighted in the browser. |
---|
Example:
> GateOne.Utils.getSelText();
"localhost" // Assuming the user had highlighted the word, "localhost"
This function is a work in progress... Doesn't do anything right now, but will (likely) eventually return time-based token (based on a random seed provided by the Gate One server) for use in an anti-session-hijacking mechanism.
Almost a direct copy of MochiKit.DOM.hasElementClass... Returns true if className is found on element. element is looked up with getNode() so querySelector-style identifiers or DOM nodes are acceptable.
Arguments: |
|
---|---|
Returns: | true/false |
Example:
> GateOne.Utils.hasElementClass('#go_panel_info', 'go_panel');
true
> GateOne.Utils.hasElementClass('#go_panel_info', 'foo');
false
Hides the given element by setting elem.style.display = 'none'.
Arguments: |
|
---|
Example:
> GateOne.Utils.hideElement('#go_icon_newterm');
Returns true if obj is an Array.
Arguments: |
|
---|---|
Returns: | true/false |
Example:
> GateOne.Utils.isArray(GateOne.terminals['1'].screen);
true
Returns true if obj is an HTMLElement.
Arguments: |
|
---|---|
Returns: | true/false |
Example:
> GateOne.Utils.isElement(GateOne.Utils.getNode('#gateone'));
true
Returns true if someNumber is even.
Arguments: |
|
---|---|
Returns: | true/false |
Example:
> GateOne.Utils.isEven(2);
true
> GateOne.Utils.isEven(3);
false
Returns true if obj is an HTMLCollection. HTMLCollection objects come from DOM level 1 and are what is returned by some browsers when you execute functions like document.getElementsByTagName(). This function lets us know if the Array-like object we've got is an actual HTMLCollection (as opposed to a NodeList or just an Array).
Arguments: |
|
---|---|
Returns: | true/false |
Example:
> GateOne.Utils.isHTMLCollection(document.getElementsByTagName('pre'));
true // Will vary from browser to browser. Don't you just love JavaScript programming? Sigh.
Returns true if obj is a NodeList. NodeList objects come from DOM level 3 and are what is returned by some browsers when you execute functions like document.getElementsByTagName(). This function lets us know if the Array-like object we've got is an actual NodeList (as opposed to an HTMLCollection or just an Array).
Arguments: |
|
---|---|
Returns: | true/false |
Example:
> GateOne.Utils.isHTMLCollection(document.getElementsByTagName('pre'));
true // Just like isHTMLCollection this will vary
Returns true if n is a prime number.
Arguments: |
|
---|---|
Returns: | true/false |
Example:
> GateOne.Utils.isPrime(13);
true
> GateOne.Utils.isPrime(14);
false
Copied from MochiKit.Base.itemgetter. Returns a function(obj) that returns obj[name].
Arguments: |
|
---|---|
Returns: | A function. |
To better understand what this function does it is probably best to simply provide the code:
itemgetter: function (name) {
return function (arg) {
return arg[name];
}
}
Here's an example of how to use it:
> var object1 = {};
> var object2 = {};
> object1.someNumber = 12;
> object2.someNumber = 37;
> var numberGetter = GateOne.Utils.itemgetter("someNumber");
> numberGetter(object1);
12
> numberGetter(object2);
37
Note
Yes, it can be confusing. Especially when thinking up use cases but it actually is incredibly useful when the need arises!
Copied from MochiKit.Base.items. Returns an Array of [propertyName, propertyValue] pairs for the given obj.
Arguments: |
|
---|---|
Returns: | Array |
Example:
> GateOne.Utils.items(GateOne.terminals).forEach(function(item) { console.log(item) });
["1", Object]
["2", Object]
Note
Can be very useful for debugging.
Loads and applies the given Gate One CSS scheme.
Arguments: |
|
---|
Example:
GateOne.Utils.loadCSS("black");
Populates GateOne.prefs with values from localStorage['prefs'].
Arguments: |
|
---|
Loads the JavaScript (.js) file at URL and appends it to document.body.
Arguments: |
|
---|
Example:
GateOne.Utils.loadScript("/static/someplugin/whatever.js");
AKA "No Operation". Returns whatever is given to it (if anything at all). In other words, this function doesn't do anything and that's exactly how it is supposed to be!
Arguments: |
|
---|---|
Returns: | a |
Example:
var functionList = {'1': GateOne.Utils.noop, '2': GateOne.Utils.noop};
Note
This function is most useful as a placeholder for when you plan to update something later. In the event that something never gets replaced, you can be assured that nothing bad will happen if it gets called.
Similar to MochiKit.Base.partial. Returns partially applied function.
Arguments: |
|
---|
Example:
> addNumbers = function (a, b) {
return a + b;
}
> addOne = GateOne.Utils.partial(addNumbers, 1);
> addOne(3);
4
Note
This function can also be useful to simply save yourself a lot of typing. If you're planning on calling a function with the same parameters a number of times it is a good idea to use partial() to create a new function with all the parameters pre-applied. Can make code easier to read too.
Returns: | A random prime number <= 9 digits. |
---|
Example:
> GateOne.Utils.randomPrime();
618690239
Removes the given elem from the DOM.
Arguments: |
|
---|
Example:
GateOne.Utils.removeElement('#go_infocontainer');
Turns textual URLs like 'http://whatever.com/' into links.
Arguments: |
|
---|
Example:
> GateOne.Utils.replaceURLWithHTMLLinks('Downloading http://foo.bar.com/some/file.zip');
"Downloading <a href='http://foo.bar.com/some/file.zip'>http://foo.bar.com/some/file.zip</a>"
Saves much of what's set in GateOne.prefs to localStorage['prefs'] as JSON. Specifically, it saves the following:
> localStorage['prefs'];
"{
"scheme":"black",
"logLevel":"INFO",
"logLines":2000,
"scrollback":600,
"playbackFrames":200,
"rows":null,
"cols":null
}"
Note
There are plans in the works to change this to localStorage[GateOne.prefs.prefix+'prefs'] so don't get too comfy with it =). Also, hooks will soon be added so that plugins can save and restore their own preferences here (not that it is hard to access localStorage directly).
Scrolls the given element (elem) by the number given in lines. It will automatically determine the line height using getEmDimensions(). lines can be a positive or negative integer (to scroll down or up, respectively).
Arguments: |
|
---|
Example:
GateOne.Utils.scrollLines('#go_term1_pre', -3);
Note
There must be a scrollbar visible (and overflow-y = "auto" or equivalent) for this to work.
Scrolls the given element (elem) to the very bottom (all the way down).
Arguments: |
|
---|
Example:
GateOne.Utils.scrollLines('#term1_pre');
Sets the stylesheet matching title to be active.
Thanks to Paul Sowden at A List Apart for this function. See: http://www.alistapart.com/articles/alternate/ for a great article on how to control active/alternate stylesheets in JavaScript.
Arguments: |
|
---|
Example:
GateOne.Utils.setActiveStyleSheet("myplugin_stylesheet");
Shows the given element (if previously hidden via hideElement()) by setting elem.style.display = 'block'.
Arguments: |
|
---|
Example:
> GateOne.Utils.showElement('#go_icon_newterm');
Returns true if str starts with substr.
Arguments: |
|
---|---|
Returns: | true/false |
Examples:
> GateOne.Utils.startsWith('some', 'somefile.txt');
true
> GateOne.Utils.startsWith('foo', 'somefile.txt');
false
Returns an actual Array() given an Array-like obj such as an HTMLCollection or a NodeList.
Arguments: |
|
---|---|
Returns: | Array |
Example:
> var terms = document.getElementsByClassName(go.prefs.prefix+'terminal');
> GateOne.Utils.toArray(terms).forEach(function(termObj) {
GateOne.Terminal.closeTerminal(termObj.id.split('term')[1]);
});
Performs a GET on the given url and if given, calls callback with the responseText as the only argument.
Arguments: |
|
---|
Example:
> var mycallback = function(responseText) { console.log("It worked: " + responseText) };
> GateOne.Utils.xhrGet('https://demo.example.com/static/about.html', mycallback);
It worked: <!DOCTYPE html>
<html>
<head>
...
Just about all of Gate One's communications with the server are handled inside this module. It contains all the functions and properties to deal with setting up the WebSocket and issuing/receiving commands over it. The most important facet of GateOne.Net is GateOne.Net.actions which holds the mapping of what function maps to which command. More info on GateOne.Net.actions is below...
This is where all of Gate One's WebSocket protocol actions are assigned to functions. This is how they are defined by default:
GateOne.Net.actions = {
// These are what will get called when the server sends us each respective action
'log': GateOne.Net.log,
'ping': GateOne.Net.ping,
'pong': GateOne.Net.pong,
'reauthenticate': GateOne.Net.reauthenticate,
'set_mode': GateOne.Terminal.setMode,
'terminals': GateOne.Terminal.reattachTerminals,
'termupdate': GateOne.Terminal.updateTerminal,
'scroll_up': GateOne.Terminal.scrollUp,
'term_exists': GateOne.Terminal.reconnectTerminalAction,
'set_title': GateOne.Visual.setTitle, // NOTE: This actually gets assigned via GateOne.Visual.init()
'bell': GateOne.Visual.bellAction, // NOTE: Ditto
'metadata': GateOne.Terminal.storeMetadata
}
For example, if we execute GateOne.Net.ping(), this will send a message over the WebSocket like so:
GateOne.ws.send(JSON.stringify({'ping': timestamp}));
The GateOne server will receive this message and respond with a pong message that looks like this (Note: Python code below):
message = {'pong': timestamp} # The very same timestamp we just sent via GateOne.Net.ping()
self.write_message(json_encode(message))
When GateOne.Net receives a message from the server over the WebSocket it will evaluate the object it receives as {action: message} and call the matching action in GateOne.Net.actions. In this case, our action "pong" matches GateOne.Net.actions['pong'] so it will be called like so:
GateOne.Net.actions['pong'](message);
Plugin authors can add their own arbitrary actions using GateOne.Net.addAction(). Here's an example taken from the SSH plugin:
GateOne.Net.addAction('sshjs_connect', GateOne.SSH.handleConnect);
GateOne.Net.addAction('sshjs_reconnect', GateOne.SSH.handleReconnect);
Adds an action to the GateOne.Net.actions object.
Arguments: |
|
---|
Example:
GateOne.Net.addAction('sshjs_connect', GateOne.SSH.handleConnect);
Opens a connection to the WebSocket defined in GateOne.prefs.url and stores it in GateOne.ws. This function gets called by GateOne.init() and there's really no reason why it should be called directly by anything else.
Called when there's an error communicating over the WebSocket... Displays a message to the user indicating there's a problem, logs the error (using logError()), and sets a five-second timeout to attempt reconnecting.
This function is attached to the WebSocket's onclose event and shouldn't be called directly.
Normally called when the user closes a terminal, it sends a message to the GateOne server telling it to end the process associated with term. Normally this function would not be called directly. To close a terminal cleanly, plugins should use GateOne.Terminal.closeTerminal(term) (which calls this function).
Arguments: |
|
---|
This function can be used in debugging actions; it logs whatever message is received from the Gate One server: GateOne.Logging.logInfo(msg) (which would equate to console.log under most circumstances).
Arguments: |
|
---|
When developing a new action, you can test out or debug your server-side messages by attaching the respective action to GateOne.Net.log() like so:
GateOne.Net.addAction('my_action', GateOne.Net.log);
Then you can view the exact messages received by the client in the JavaScript console in your browser.
Sends a ping to the server with a client-generated timestamp attached. The expectation is that the server will return a 'pong' respose with the timestamp as-is so we can measure the round-trip time.
> GateOne.Net.ping();
2011-10-09 21:13:08 INFO PONG: Gate One server round-trip latency: 2ms
Note
That response was actually logged by pong() below.
Simply logs timestamp using GateOne.Logging.logInfo() and includes a measurement of the round-trip time in milliseconds.
Arguments: |
|
---|
Called when the Gate One server wants us to re-authenticate our session (e.g. our cookie expired). Deletes the 'user' cookie and reloads the current page with the following code:
GateOne.Utils.deleteCookie('user', '/', '');
window.location.reload();
This will force the client to re-authenticate with the Gate One server.
Sends a message to the Gate One server telling it to perform a full screen refresh (i.e. send us the whole thing as opposed to just the difference from the last screen).
Sends the current character queue to the Gate One server and empties it out. Typically it would be used like this:
GateOne.Input.queue("echo 'This text will be sent to the server'\n");
GateOne.Net.sendChars(); // Send it off and empty the queue
Sends the current dimensions of term to the Gate One server. Typically used when the user resizes their browser window.
GateOne.Net.sendDimensions();
Note
Right now the optional term argument isn't used but it will be once we start supporting individual terminal dimensions (as opposed to a global rows/cols setting).
Tells the Gate One server which is our active terminal and sets localStorage['selectedTerminal'].
GateOne.Net.setTerminal(1);
This module handles mouse and keyboard input for Gate One. It consists of a few tables of information that tell Gate One how to act upon a given keystroke as well as functions that make working with keyboard and mouse events a bit easier.
Note
Properties that have to do with temporary, internal states (e.g. GateOne.Input.metaHeld) were purposefully left out of this documentation since there's really no reason to ever reference them.
This is an Array that temporarily stores characters before sending them to the Gate One server. The charBuffer gets sent to the server and emptied when GateOne.Net.sendChars() is called.
Typically, characters wind up in the buffer by way of GateOne.Input.queue().
This is an object that houses all of Gate One's special key mappings. Here's an example from the default keyTable:
'KEY_2': {'default': "2", 'shift': "@", 'ctrl': String.fromCharCode(0)}
This entry tells Gate One how to respond when the '2' key is pressed; by default, when the shift key is held, or when the Ctrl key is held. If no entry existed for the '2' key, Gate One would simply use the standard keyboard defaults (for the key itself and when shift is held).
Note
This property is used by both GateOne.Input.emulateKey() and GateOne.Input.emulateKeyCombo().
Warning
Entries in GateOne.Input.shortcuts will supersede anything in GateOne.Input.keyTable. So if you use GateOne.Input.registerShortcut() to bind the '2' key to some JavaScript action, that action will need to ALSO send the proper character or the user will wind up dazed and confused as to why their '2' key doesn't work.
Keyboard shortcuts that get added using GateOne.Input.registerShortcut() are stored here like so:
> GateOne.Input.shortcuts;
{'KEY_N': [
{
'modifiers': {'ctrl': true, 'alt': true, 'meta': false, 'shift': false},
'action': 'GateOne.Terminal.newTerminal()'
}
]}
Note
A single key can have multiple entries depending on which modifier is held.
Prepends an ESC character to chars and adds it to the charBuffer
// This would send the same as the up arrow key:
GateOne.Input.bufferEscSeq("[A") // Would end up as ^[[A
Sets the browser's focus to GateOne.prefs.goDiv and enables the capture of keyboard and mouse events.
Disables the capture of keyboard and mouse events by setting all of the relevant events tied to GateOne.prefs.goDiv to null like so:
GateOne.prefs.goDiv.onpaste = null;
GateOne.prefs.goDiv.tabIndex = null;
GateOne.prefs.goDiv.onkeydown = null;
GateOne.prefs.goDiv.onkeyup = null;
GateOne.prefs.goDiv.onmousedown = null;
GateOne.prefs.goDiv.onmouseup = null;
Typically you would call this function if a user needed to fill out a form or use a non-terminal portion of the web page. GateOne.prefs.capture() can be called to turn it all back on.
Typically called by GateOne.prefs.onKeyDown(), converts a keyboard event (e) into a string (using GateOne.Input.keyTable) and appends it to the charBuffer using GateOne.Input.queue(). This function also has logic that allows the user to double-tap the F11 key to send the browser's native keystroke (enable/disable fullscreen). This is to prevent the user from getting stuck in fullscreen mode (since we call e.preventDefault() for nearly all events).
Arguments: |
|
---|
Typically called by GateOne.prefs.onKeyDown(), converts a keyboard event (e) into a string. The difference between this function and emulateKey() is that this funcion handles key combinations that include non-shift modifiers (Ctrl, Alt, and Meta).
Arguments: |
|
---|
Given an event (e), returns a very straightforward (e.g. easy to read/understand) object representing any keystrokes contained within it. The object will look like this:
{
type: <event type>, // Just preserves it.
code: <the key code>, // e.g. 27
string: 'KEY_<key string>' // e.g. KEY_N or KEY_F11
}
This makes keystroke-handling code a lot easier to read and more consistent across browsers and platforms. For example, here's a hypothetical function that gets passed a keystroke event:
var keystrokeHandler(e) {
var key = GateOne.Input.key(e);
console.log('key.code: ' + key.code + ', key.string: ' + key.string);
}
The key.string comes from GateOne.Input.specialKeys, GateOne.Input.specialMacKeys, and the key event itself (onkeydown events provide an upper-case string for most keys).
Arguments: |
|
---|
Like GateOne.Input.key(), this function returns a well-formed object for a fairly standard JavaScript event. This object looks like so:
{
shift: false,
alt: false,
ctrl: false,
meta: false
}
Since some browsers (i.e. Chrome) don't register the 'meta' key (aka "the Windows key") as a proper modifier, modifiers() will emulate it by examining the GateOne.Input.metaHeld property. The state of the meta key is tracked via GateOne.Input.metaHeld by way of the GateOne.Input.onKeyDown() and GateOne.Input.onKeyUp() functions.
Arguments: |
|
---|
Just like GateOne.Input.key() and GateOne.Input.modifiers(), this function returns a well-formed object for a fairly standard JavaScript event:
{
type: <event type>, // Just preserves it
left: <true/false>,
right: <true/false>,
middle: <true/false>,
}
Very convient for figuring out which mouse button was pressed on any given mouse event.
Arguments: |
|
---|
This function gets attached to GateOne.prefs.goDiv.onkeydown by way of GateOne.Input.capture(). It keeps track of the state of the meta key (see modifiers() above), executes any matching keyboard shortcuts defined in GateOne.Input.shortcuts, and calls GateOne.Input.emulateKey() or GateOne.Input.emulateKeyCombo() depending on which (if any) modifiers were held during the keystroke event.
Arguments: |
|
---|
This function gets attached to GateOne.prefs.goDiv.onkeyup by way of GateOne.Input.capture(). It is used in conjunction with GateOne.Input.modifiers() and GateOne.Input.onKeyDown() to emulate the meta key modifier using KEY_WINDOWS_LEFT and KEY_WINDOWS_RIGHT since "meta" doesn't work as an actual modifier on some browsers/platforms.
Arguments: |
|
---|
Adds text to GateOne.Input.charBuffer.
Arguments: |
|
---|
Registers the given shortcutObj for the given keyString by adding a new object to GateOne.Input.shortcuts. Here's an example:
GateOne.Input.registerShortcut('KEY_ARROW_LEFT', {'modifiers': {'ctrl': false, 'alt': false, 'meta': false, 'shift': true}, 'action': 'GateOne.Visual.slideLeft()'});
Note
The 'action' is a string that gets invoked via eval(). This allows plugin authors to register shortcuts that call objects and functions that may not have been available at the time they were registered.
Arguments: |
|
---|
This module contains all of Gate One's visual effect functions. It is just like GateOne.Utils but specific to visual effects and DOM manipulations.
Stores the dimensions of the GateOne.prefs.goDiv element in the form of {w: '800', h: '600'} where 'w' and 'h' represent the width and height in pixels. It is used by several functions in order to calculate how far to slide terminals, how many rows and columns will fit, etc.
Tip
In most of Gate One's JavaScript, term refers to the terminal number (e.g. 1).
Called by createGrid(); creates a terminal div and appends it to go.Visual.squares. Probably not useful for anything else.
Note
In fact, this function would only ever get called if you were debugging the grid... You'd call createGrid() with, say, an Array containing a dozen pre-determined terminal names as the second argument. This would save you the trouble of opening a dozen terminals by hand.
Arguments: |
|
---|
A convenience function that allows us to apply multiple style changes in one go. For example:
GateOne.Visual.applyStyle('#somediv', {'opacity': 0.5, 'color': 'black'});
Arguments: |
|
---|
This function is Gate One's bread and butter: It applies the given CSS3 transform to obj. obj can be one of the following:
- A querySelector-like string (e.g. "#some_element_id").
- A DOM node.
- An Array or an Array-like object containing DOM nodes such as HTMLCollection or NodeList (it will apply the transform to all of them).
The transform should be just the actual transform function (e.g. scale(0.5)). applyTransform() will take care of applying the transform according to how each browser implements it. For example:
GateOne.Visual.applyTransform('#somediv', 'translateX(500%)');
...would result in #somediv getting styles applied to it like this:
#somediv {
-webkit-transform: translateX(500%); /* Chrome/Safari/Webkit-based stuff */
-moz-transform: translateX(500%); /* Mozilla/Firefox/Gecko-based stuff */
-o-transform: translateX(500%); /* Opera */
-ms-transform: translateX(500%); /* IE9+ */
-khtml-transform: translateX(500%); /* Konqueror */
transform: translateX(500%); /* Some day this will be all that is necessary */
}
Arguments: |
|
---|
Plays a bell sound and pops up a message indiciating which terminal the bell came from (visual bell is always enabled). It takes a JavaScript object (bellObj) as an argument because it is meant to be registered as an action in GateOne.Net.actions as it is the Gate One server that tells us when a bell has been encountered.
The format of bellObj is as simple as can be: {'term': 1}. The bell sound will be whatever <source> is attached to an <audio> tag with ID #bell. By default, Gate One's index.html template includes a such an <audio> tag with a data:URI as the <source> that gets created from '<gateone dir>/static/bell.ogg'.
GateOne.Visual.bellAction({'term': 1});
Arguments: |
|
---|
Note
Why is the visual bell always enabled? Without a visual indicator, if you had more than one terminal open it would be impossible to tell which terminal the bell came from.
Creates a container for housing terminals and optionally, pre-creates them using terminalNames (useful in debugging). The container will be laid out in a 2x2 grid.
GateOne.Visual.createGrid("#"+GateOne.prefs.prefix+"termwrapper");
Arguments: |
|
---|
Note
Work is being done to replace the usage of the grid with more abiguous functions in order to make it possible for plugins to override the default behavior to, say, have a 4x4 grid. Or use some other terminal-switching mechanism/layout altogether (cube, anyone? =). Will probably be available in Gate One v1.5 since it is merely time consuming to replace a zillion function calls with a wrapper.
Replaces the contents of term with just the visible screen (i.e. no scrollback buffer). This makes terminal manipulations considerably faster since the browser doesn't have to reflow as much text. If no term is given, replace the contents of all terminals with just their visible screens.
While this function itself causes a reflow, it is still a good idea to call it just before performing a manipulation of the DOM since the presence of scrollbars really slows down certain CSS3 transformations. Just don't forget to cancel GateOne.terminals[term]['scrollbackTimer'] or any effects underway might get very choppy right in the middle of execution.
GateOne.Visual.disableScrollback(1);
Arguments: |
|
---|
Note
A convenience function for enabling/disabling the scrollback buffer is available: GateOne.Visual.toggleScrollback() (detailed below).
Displays message to the user via a transient pop-up DIV that will appear inside GateOne.prefs.goDiv. How long the message lasts can be controlled via timeout and removeTimeout (which default to 1000 and 5000, respectively).
If id is given, it will be prefixed with GateOne.prefs.prefix and used as the DIV ID for the pop-up. i.e. GateOne.prefs.prefix+id. The default is GateOne.prefs.prefix+"notice".
GateOne.Visual.displayMessage('This is a test.');
Arguments: |
|
---|
Note
The default is to display the message in the lower-right corner of GateOne.prefs.goDiv but this can be controlled via CSS.
Displays the terminal number and terminal title of the given term via a transient pop-up DIV that starts fading away after one second.
GateOne.Visual.displayTermInfo(1);
Arguments: |
|
---|
Note
Like displayMessage(), the location and effect of the pop-up can be controlled via CSS. The DIV ID will be GateOne.prefs.prefix+'infocontainer'.
Replaces the contents of term with the visible scren + scrollback buffer. Use this to restore scrollback after calling disableScrollback(). If no term is given, re-enable the scrollback buffer in all terminals.
GateOne.Visual.enableScrollback(1);
Arguments: |
|
---|
Note
A convenience function for enabling/disabling the scrollback buffer is available: GateOne.Visual.toggleScrollback() (detailed below).
Called by GateOne.init(), performs the following:
Adds an icon to the panel for toggling the grid.
Adds GateOne.Visual.bellAction() as the 'bell' action in GateOne.Net.actions.
Adds GateOne.Visual.setTitleAction() as the 'set_title' action in GateOne.Net.actions.
Registers the following keyboard shortcuts:
Function
Shortcut
GateOne.Visual.toggleGridView()
Control-Alt-G
GateOne.Visual.slideLeft()
Shift-LeftArrow
GateOne.Visual.slideRight()
Shift-RightArrow
GateOne.Visual.slideUp()
Shift-UpArrow
GateOne.Visual.slideDown()
Shift-DownArrow
Plays the bell sound attached to the <audio> tag with ID #bell without any visual notification.
GateOne.Visual.playBell();
Given that titleObj is a JavaScript object such as, {'term': 1, 'title': "user@host:~"}, sets the title of the terminal provided by titleObj['term'] to titleObj['title']. This function is meant to be attached to GateOne.Net.actions (which gets taken care of in GateOne.Visual.init()).
GateOne.Visual.setTitleAction({'term': 1, 'title': "user@host:~"});
Grid specific: Slides the view downward one terminal by pushing all the others up.
GateOne.Visual.slideDown();
Grid specific: Slides the view left one terminal by pushing all the others to the right.
GateOne.Visual.slideLeft();
Grid specific: Slides the view right one terminal by pushing all the others to the left.
GateOne.Visual.slideRight();
Grid specific: Slides the view to term. If changeSelected is true, this will also set the current terminal to the one we're sliding to.
GateOne.Visual.slideToTerm(1, true);
Arguments: |
|
---|
Note
Generally speaking, you'll want changeSelected to always be true.
Grid specific: Slides the view upward one terminal by pushing all the others down.
GateOne.Visual.slideUp();
Brings up the terminal grid view (by scaling all the terminals to 50%) or returns to a single, full-size terminal. If goBack is true (the default), go back to the previously-selected terminal when un-toggling the grid view. This argument is primarily meant for use internally within the function when assigning onclick events to each downsized terminal.
GateOne.Visual.toggleGridView();
Arguments: |
|
---|
Toggles the given panel in or out of view. panel is expected to be the ID of an element with the GateOne.prefs.prefix+"panel" class. If panel is null or false, all open panels will be toggled out of view.
GateOne.Visual.togglePanel('#'+GateOne.prefs.prefix+'panel_bookmarks');
Arguments: |
|
---|
Toggles the scrollback buffer for all terminals by calling GateOne.Visual.disableScrollback() or GateOne.Visual.enableScrollback() depending on the state of the toggle.
GateOne.Visual.toggleScrollback();
Sets GateOne.Visual.goDimensions to the current width/height of GateOne.prefs.goDiv. Typically called when the browser window is resized.
GateOne.Visual.updateDimensions();
GateOne.Terminal contains terminal-specific properties and functions. Really, there's not much more to it than that :)
If a plugin wants to perform an action whenever a terminal is closed it can register a callback here like so:
GateOne.Terminal.closeTermCallbacks.push(GateOne.MyPlugin.termClosed);
All callbacks in closeTermCallbacks will be called whenever a terminal is closed with the terminal number as the only argument.
An object containing a collection of functions that will be called whenever a matching terminal (expanded) mode is encountered. For example, terminal mode '1' (which maps to escape sequences '[?1h' and '[?1l') controls "application cursor keys" mode. In this mode, the cursor keys are meant to send different escape sequences than they normally do.
Functions inside GateOne.Terminal.modes are called with a boolean as their only argument; true meaning 'set this mode' and false meaning 'reset this mode'. These translate back to Gate One's terminal.py module which calls whatever is assigned to Terminal.callbacks[CALLBACK_MODE] with the mode number and a boolean as the only two arguments.
Terminal.callbacks[CALLBACK_MODE] is assigned inside of gateone.py to TerminalWebSocket.mode_handler which sends a message to the Gate One client containing a JSON-encoded object like so:
{'set_mode': {
'mode': setting, # Would be '1' for application cursor keys mode
'boolean': True, # Set this mode
'term': term # On this terminal
}}
This maps directly to the 'set_mode' action in GateOne.Net.actions which calls GateOne.Terminal.modes.
If a plugin wants to perform an action whenever a terminal is opened it can register a callback here like so:
GateOne.Terminal.closeTermCallbacks.push(GateOne.MyPlugin.termOpened);
All callbacks in newTermCallbacks will be called whenever a new terminal is opened with the terminal number as the only argument.
This is a Web Worker (go_process.js) that is used by GateOne.Terminal.updateTerminalAction() to process the text received from the Gate One server. This allows things like linkifying text to take place asynchronously so it doesn't lock or slow down your browser while the CPU does its work.
Closes the given term and tells the Gate One server to end its running process.
GateOne.Terminal.closeTerm(2);
Arguments: |
|
---|
Creates the terminal information panel, initializes the terminal updates Web Worker (which is contained in go_process.js), and registers two keyboard shortcuts:
Function | Shortcut |
---|---|
GateOne.Terminal.newTerminal() | Control-Alt-N |
go.Terminal.closeTerminal(localStorage["selectedTerminal"]) | Control-Alt-W |
Creates a new terminal and gets it updating itself by way of the Gate One server.
GateOne.Terminal.newTerminal();
Arguments: |
|
---|
Notifies the user when there's activity in term by displaying a message and playing the bell.
GateOne.Terminal.notifyActivity(1);
Arguments: |
|
---|
Note
You wouldn't normally call this function directly. It is meant to be called from GateOne.Terminal.updateTerminal() when the right conditions are met.
Notifies the user when the inactivity timeout in term has been reached by displaying a message and playing the bell.
GateOne.Terminal.notifyInactivity(1);
Arguments: |
|
---|
Note
You wouldn't normally call this function directly. It is meant to be called from GateOne.Terminal.updateTerminal() when the right conditions are met.
This function gets attached to the 'terminals' action in GateOne.Net.actions and gets called after we authenticate with the Gate One server (the server is what tells us to call this function). The terminals argument is expected to be an Array (aka Python list) of terminal numbers that are currently running on the Gate One server.
If no terminals currently exist (we received an empty Array), GateOne.Terminal.newTerminal() will be called to create a new one.
Arguments: |
|
---|
This function gets attached to the 'term_exists' action in GateOne.Net.actions and gets called when the server reports that the terminal number supplied via 'new_terminal' already exists. It doesn't actually do anything right now but there might be use case for catching this condition in the future.
Arguments: |
|
---|
This function gets attached to the 'set_mode' action in GateOne.Net.actions and gets called when the server encounters either a "set expanded mode" or "reset expanded mode" escape sequence. Essentially, it uses the values provided by modeObj to call GateOne.Net.actions[modeObj['mode']](modeObj['term'], modeObj['boolean']).
Arguments: |
|
---|
See also
This function gets attached to the 'termupdate' action in GateOne.Net.actions and gets called when a terminal has been modified on the server. The termObj that the this function will receive from the Gate One server will look like this:
{
'term': term,
'scrollback': scrollback,
'screen' : screen,
'ratelimiter': multiplexer.ratelimiter_engaged
}
term will be the number of the terminal that is being updated. scrollback will be an Array of lines of scrollback that the server has preserved for us (in the event that the screen scrolled text faster than we could send it to the client). screen will be an Array of HTML-formatted lines representing the updated terminal. ratelimiter will be a boolean value representing whether or not the rate limiter has been engaged (if the program running on this terminal is updating the screen too fast).
Arguments: |
|
---|