Compare commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
3a782972e3 | ||
|
|
d12406bedc | ||
|
|
561fc59dbc | ||
|
|
ce1d788efe | ||
|
|
01e48b7406 | ||
|
|
a1717fdd8d | ||
|
|
c9f5f235e2 | ||
|
|
21dde3cfa2 | ||
|
|
73bf6d1ce8 | ||
|
|
1b6ad0fd7b | ||
|
|
189a556408 |
@@ -1,6 +1,13 @@
|
||||
# xterm.js
|
||||
# xterm.js — xterm, in the browser
|
||||
|
||||
xterm, in the browser.
|
||||
Xterm.js is a full xterm clone, written completely in JavaScript.
|
||||
|
||||
Xterm.js supplies a modular, event-based interface that lets developers build addons and themes that augment
|
||||
the experience of running a fully-feature terminal inside the browser.
|
||||
|
||||
Xterm.js serves as the foundation for the terminal found at www.sourcelair.com.
|
||||
|
||||

|
||||
|
||||
### Contribution and License Agreement
|
||||
|
||||
@@ -10,5 +17,5 @@ all code is your original work.
|
||||
|
||||
## License
|
||||
|
||||
Copyright (c) 2014, sourceLair Limited (www.sourcelair.com) (MIT License)
|
||||
Copyright (c) 2014, sourceLair, Limited (www.sourcelair.com) (MIT License)
|
||||
Copyright (c) 2012-2013, Christopher Jeffrey (MIT License)
|
||||
|
||||
@@ -5,8 +5,61 @@
|
||||
<link rel="stylesheet" href="../../demo/style.css" />
|
||||
<script src="../../src/xterm.js"></script>
|
||||
<script src="attach.js"></script>
|
||||
<style>
|
||||
body {
|
||||
color: #111;
|
||||
}
|
||||
|
||||
h1, h2 {
|
||||
color: #444;
|
||||
border-bottom: 1px solid #ddd;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
form {
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
|
||||
input, button {
|
||||
line-height: 22px;
|
||||
font-size: 16px;
|
||||
display: inline-block;
|
||||
border-radius: 2px;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
|
||||
input {
|
||||
height: 22px;
|
||||
padding-left: 4px;
|
||||
padding-right: 4px;
|
||||
}
|
||||
|
||||
button {
|
||||
height: 28px;
|
||||
background-color: #ccc;
|
||||
cursor: pointer;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.container {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
|
||||
<h1>
|
||||
xterm.js: socket attach
|
||||
</h1>
|
||||
<p>
|
||||
Attach the terminal to a WebSocket terminal stream with ease. Perfect for attaching to your
|
||||
Docker containers.
|
||||
</p>
|
||||
<h2>
|
||||
Socket information
|
||||
</h2>
|
||||
<form id="socket-form">
|
||||
<input id="socket-url"
|
||||
type="text"
|
||||
@@ -17,6 +70,8 @@
|
||||
</button>
|
||||
</form>
|
||||
<div id="terminal-container"></div>
|
||||
|
||||
</div>
|
||||
<script>
|
||||
var term = new Terminal(),
|
||||
container = document.getElementById('terminal-container'),
|
||||
|
||||
@@ -0,0 +1,29 @@
|
||||
/*
|
||||
* Fit terminal columns and rows to the dimensions of its
|
||||
* DOM element.
|
||||
*
|
||||
* Approach:
|
||||
* - Rows: Truncate the division of the terminal parent element height
|
||||
* by the terminal row height
|
||||
*
|
||||
* - Columns: Truncate the division of the terminal parent element width by
|
||||
* the terminal character width (apply display: inline at the
|
||||
* terminal row and truncate its width with the current number
|
||||
* of columns)
|
||||
*/
|
||||
Terminal.prototype.fit = function () {
|
||||
var container = this.rowContainer,
|
||||
subjectRow = this.rowContainer.firstElementChild,
|
||||
rows = parseInt(container.offsetHeight / subjectRow.offsetHeight),
|
||||
characterWidth,
|
||||
cols;
|
||||
|
||||
subjectRow.style.display = 'inline';
|
||||
characterWidth = parseInt(subjectRow.offsetWidth / this.cols);
|
||||
subjectRow.style.display = '';
|
||||
|
||||
cols = container.offsetWidth / characterWidth;
|
||||
cols = parseInt(cols);
|
||||
|
||||
this.resize(cols, rows);
|
||||
};
|
||||
+1
-1
@@ -1,5 +1,5 @@
|
||||
{
|
||||
"name": "xterm.js",
|
||||
"version": "0.9.2",
|
||||
"version": "0.13",
|
||||
"ignore": ["demo", "docs", "test", ".gitignore"]
|
||||
}
|
||||
|
||||
+4
-3
@@ -5,9 +5,10 @@
|
||||
<link rel="stylesheet" href="../src/xterm.css" />
|
||||
<link rel="stylesheet" href="../addon/fullscreen/fullscreen.css" />
|
||||
<link rel="stylesheet" href="style.css" />
|
||||
<script src="../src/xterm.js"></script>
|
||||
<script src="../addon/fullscreen/fullscreen.js"></script>
|
||||
<script src="main.js" defer></script>
|
||||
<script src="../src/xterm.js" ></script>
|
||||
<script src="../addons/fit/fit.js" ></script>
|
||||
<script src="../addons/fullscreen/fullscreen.js" ></script>
|
||||
<script src="main.js" defer ></script>
|
||||
</head>
|
||||
<body>
|
||||
<h1>
|
||||
|
||||
+3
-3
@@ -44,16 +44,16 @@ master_doc = 'index'
|
||||
|
||||
# General information about the project.
|
||||
project = u'xterm.js'
|
||||
copyright = u'2014, sourceLair Limited'
|
||||
copyright = u'2014, SourceLair Limited'
|
||||
|
||||
# The version info for the project you're documenting, acts as replacement for
|
||||
# |version| and |release|, also used in various other places throughout the
|
||||
# built documents.
|
||||
#
|
||||
# The short X.Y version.
|
||||
version = '0.1a'
|
||||
version = '0.13'
|
||||
# The full version, including alpha/beta/rc tags.
|
||||
release = '0.1a'
|
||||
release = '0.13 Alpha'
|
||||
|
||||
# The language for content autogenerated by Sphinx. Refer to documentation
|
||||
# for a list of supported languages.
|
||||
|
||||
@@ -0,0 +1,43 @@
|
||||
------
|
||||
Events
|
||||
------
|
||||
|
||||
focus
|
||||
^^^^^
|
||||
This event is fired, when the Terminal gets focus.
|
||||
|
||||
blur
|
||||
^^^^
|
||||
This event is fired, when the Terminal loses focus.
|
||||
|
||||
open
|
||||
^^^^
|
||||
This event is fired, when the Terminal gets opened into a DOM Element.
|
||||
|
||||
keydown
|
||||
^^^^^^^
|
||||
This event is fired, when the `keydown` DOM Event gets triggered on the Terminal.
|
||||
|
||||
keypress
|
||||
^^^^^^^^
|
||||
This event is fired, when the `keypress` DOM Event gets triggered on the Terminal.
|
||||
|
||||
key
|
||||
^^^
|
||||
This event is fired, when a key is being handled by the Terminal.
|
||||
|
||||
resize
|
||||
^^^^^^
|
||||
This event is being fired, when the Terminal view gets resized by the `resize` method.
|
||||
|
||||
data
|
||||
^^^^
|
||||
This event is being fired, when a chunk of input data gets handled by the terminal.
|
||||
|
||||
copy
|
||||
^^^^
|
||||
This event is fired, when the `copy` DOM Event gets triggered on the Terminal.
|
||||
|
||||
paste
|
||||
^^^^^
|
||||
This event is fired, when the `paste` DOM Event gets triggered on the Terminal.
|
||||
+35
-12
@@ -6,17 +6,40 @@
|
||||
Welcome to xterm.js's documentation!
|
||||
====================================
|
||||
|
||||
Contents:
|
||||
This is the documentation for xterm.js. Xterm.js is a full xterm clone, written completely in JavaScript.
|
||||
|
||||
Xterm.js supplies a modular, event-based interface that lets developers build addons and themes that augment
|
||||
the experience of running a fully-feature terminal inside the browser.
|
||||
|
||||
Xterm.js serves as the foundation for the terminal found at www.sourcelair.com.
|
||||
|
||||
.. image:: screenshot.png
|
||||
|
||||
Getting started
|
||||
^^^^^^^^^^^^^^^
|
||||
|
||||
.. code-block:: javascript
|
||||
|
||||
var term = new Terminal(),
|
||||
url = 'ws://docker/containers/mycontainer/attach/ws/?stdin=1&stdout=1&stderr=1&logs=1',
|
||||
socket = new WebSocket(url);
|
||||
|
||||
term.open(document.body);
|
||||
term.on('data', function (data) {
|
||||
socket.send(data);
|
||||
});
|
||||
socket.onmessage = function (e) {
|
||||
term.write(e.data);
|
||||
}
|
||||
|
||||
|
||||
Contents
|
||||
^^^^^^^^
|
||||
The standard way to create a terminal-based application with xterm.js is to work with its events and
|
||||
methods, that let you manipulate input, output, state and size of the terminal.
|
||||
|
||||
.. toctree::
|
||||
:maxdepth: 2
|
||||
|
||||
|
||||
|
||||
Indices and tables
|
||||
==================
|
||||
|
||||
* :ref:`genindex`
|
||||
* :ref:`modindex`
|
||||
* :ref:`search`
|
||||
|
||||
:maxdepth: 1
|
||||
|
||||
methods
|
||||
events
|
||||
|
||||
@@ -0,0 +1,47 @@
|
||||
-------
|
||||
Methods
|
||||
-------
|
||||
|
||||
focus()
|
||||
^^^^^^^
|
||||
Sends focus to the terminal
|
||||
|
||||
blur()
|
||||
^^^^^^
|
||||
Blurs the Terminal
|
||||
|
||||
open(element)
|
||||
^^^^
|
||||
Open the Xterm terminal, inside the given element.
|
||||
|
||||
resize(x, y)
|
||||
^^^^^^^^^^^^
|
||||
Resize the terminal, according to the given columns and rows.
|
||||
|
||||
insertRow(row)
|
||||
^^^^^^^^^^^^^^
|
||||
Insert the given row in the terminal.
|
||||
|
||||
on(event, callback)
|
||||
^^^^^^^^^^^^^^^^^^^
|
||||
Hook the given callback, to the given event.
|
||||
|
||||
off(event, callback)
|
||||
^^^^^^^^^^^^^^^^^^^
|
||||
Remove the Hook of the given callback, from the given event.
|
||||
|
||||
once(event, callback)
|
||||
^^^^^^^^^^^^^^^^^^^
|
||||
Hook the given callback to the given event, for just a single invocation.
|
||||
|
||||
write(data)
|
||||
^^^^^^^^^^^
|
||||
Write the given data to the terminal.
|
||||
|
||||
writeln(data)
|
||||
^^^^^^^^^^^^^
|
||||
Write the given data to the terminal, followed by a carriage return and a new line.
|
||||
|
||||
handler(data)
|
||||
^^^^^^^^^^^^^
|
||||
Fire the data event, for the given data.
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 140 KiB |
@@ -2521,35 +2521,6 @@ Terminal.prototype.resize = function(x, y) {
|
||||
this.emit('resize', {terminal: this, cols: x, rows: y});
|
||||
};
|
||||
|
||||
/*
|
||||
* Fit terminal columns and rows to the dimensions of its
|
||||
* DOM element.
|
||||
*
|
||||
* Approach:
|
||||
* - Rows: Truncate the division of the terminal parent element height
|
||||
* by the terminal row height
|
||||
*
|
||||
* - Columns: Truncate the division of the terminal parent element width by
|
||||
* the terminal character width (apply display: inline at the
|
||||
* terminal row and truncate its width with the current number
|
||||
* of columns)
|
||||
*/
|
||||
Terminal.prototype.fit = function () {
|
||||
var container = this.element.parentElement,
|
||||
subjectRow = this.rowContainer.firstElementChild,
|
||||
rows = parseInt(container.offsetHeight / subjectRow.offsetHeight),
|
||||
characterWidth,
|
||||
cols;
|
||||
|
||||
subjectRow.style.display = 'inline';
|
||||
characterWidth = parseInt(subjectRow.offsetWidth / this.cols);
|
||||
subjectRow.style.display = '';
|
||||
|
||||
cols = parseInt(container.offsetWidth / characterWidth);
|
||||
|
||||
this.resize(cols, rows);
|
||||
}
|
||||
|
||||
Terminal.prototype.updateRange = function(y) {
|
||||
if (y < this.refreshStart) this.refreshStart = y;
|
||||
if (y > this.refreshEnd) this.refreshEnd = y;
|
||||
|
||||
Reference in New Issue
Block a user