mirror of
https://github.com/jupyter/notebook.git
synced 2024-12-27 04:20:22 +08:00
Merge pull request #3189 from cancan101/patch-2
Upgrade xterm.js to 3.1.0
This commit is contained in:
Thomas Kluyver
GitHub
commit
4285574b96
@ -24,6 +24,8 @@
|
||||
"requirejs-plugins": "~1.0.3",
|
||||
"text-encoding": "~0.1",
|
||||
"underscore": "components/underscore#~1.8.3",
|
||||
"xterm.js": "sourcelair/xterm.js#~2.9.2"
|
||||
"xterm.js": "https://unpkg.com/xterm@~3.1.0/dist/xterm.js",
|
||||
"xterm.js-css": "https://unpkg.com/xterm@~3.1.0/dist/xterm.css",
|
||||
"xterm.js-fit": "https://unpkg.com/xterm@~3.1.0/dist/addons/fit/fit.js"
|
||||
}
|
||||
}
|
||||
|
||||
@ -29,13 +29,9 @@ requirejs([
|
||||
var common_config = new configmod.ConfigSection('common', common_options);
|
||||
common_config.load();
|
||||
|
||||
// This makes the 'logout' button in the top right work.
|
||||
var login_widget = new loginwidget.LoginWidget('span#login_widget', common_options);
|
||||
|
||||
// Test size: 25x80
|
||||
var termRowHeight = function(){ return 1.00 * $("#dummy-screen")[0].offsetHeight / 25;};
|
||||
// 1.02 here arrived at by trial and error to make the spacing look right
|
||||
var termColWidth = function() { return 1.02 * $("#dummy-screen-rows")[0].offsetWidth / 80;};
|
||||
|
||||
var base_url = utils.get_body_data('baseUrl').replace(/\/?$/, '/');
|
||||
var ws_path = utils.get_body_data('wsPath');
|
||||
var ws_url = utils.get_body_data('wsUrl');
|
||||
@ -45,31 +41,19 @@ requirejs([
|
||||
}
|
||||
ws_url = ws_url + base_url + ws_path;
|
||||
|
||||
var header = $("#header")[0];
|
||||
|
||||
function calculate_size() {
|
||||
var height = $(window).height() - header.offsetHeight;
|
||||
var width = $('#terminado-container').width();
|
||||
var rows = Math.min(1000, Math.max(20, Math.floor(height/termRowHeight())-1));
|
||||
var cols = Math.min(1000, Math.max(40, Math.floor(width/termColWidth())-1));
|
||||
console.log("resize to :", rows , 'rows by ', cols, 'columns');
|
||||
return {rows: rows, cols: cols};
|
||||
}
|
||||
|
||||
page.show_header();
|
||||
|
||||
var size = calculate_size();
|
||||
var terminal = terminado.make_terminal($("#terminado-container")[0], size, ws_url);
|
||||
var terminal = terminado.make_terminal($("#terminado-container")[0], ws_url);
|
||||
|
||||
page.show_site();
|
||||
|
||||
utils.load_extensions_from_config(config);
|
||||
utils.load_extensions_from_config(common_config);
|
||||
|
||||
window.onresize = function() {
|
||||
var geom = calculate_size();
|
||||
terminal.term.resize(geom.cols, geom.rows);
|
||||
terminal.socket.send(JSON.stringify(["set_size", geom.rows, geom.cols,
|
||||
window.onresize = function() {
|
||||
terminal.term.fit();
|
||||
// send the new size to the server so that it can trigger a resize in the running process.
|
||||
terminal.socket.send(JSON.stringify(["set_size", terminal.term.rows, terminal.term.cols,
|
||||
$(window).height(), $(window).width()]));
|
||||
};
|
||||
|
||||
|
||||
@ -1,14 +1,10 @@
|
||||
define (["xterm"], function(Terminal) {
|
||||
define (["xterm", "xtermjs-fit"], function(Terminal, fit) {
|
||||
"use strict";
|
||||
function make_terminal(element, size, ws_url) {
|
||||
function make_terminal(element, ws_url) {
|
||||
var ws = new WebSocket(ws_url);
|
||||
var term = new Terminal({
|
||||
cols: size.cols,
|
||||
rows: size.rows
|
||||
});
|
||||
Terminal.applyAddon(fit);
|
||||
var term = new Terminal();
|
||||
ws.onopen = function(event) {
|
||||
ws.send(JSON.stringify(["set_size", size.rows, size.cols,
|
||||
window.innerHeight, window.innerWidth]));
|
||||
term.on('data', function(data) {
|
||||
ws.send(JSON.stringify(['stdin', data]));
|
||||
});
|
||||
@ -18,7 +14,11 @@ define (["xterm"], function(Terminal) {
|
||||
});
|
||||
|
||||
term.open(element);
|
||||
|
||||
term.fit();
|
||||
// send the terminal size to the server.
|
||||
ws.send(JSON.stringify(["set_size", term.rows, term.cols,
|
||||
window.innerHeight, window.innerWidth]));
|
||||
|
||||
ws.onmessage = function(event) {
|
||||
var json_msg = JSON.parse(event.data);
|
||||
switch(json_msg[0]) {
|
||||
|
||||
@ -15,12 +15,9 @@
|
||||
padding: @code_padding;
|
||||
border-radius: @border-radius-base;
|
||||
.box-shadow(@global-shadow-dark);
|
||||
line-height: 1em;
|
||||
font-size: @notebook_font_size;
|
||||
|
||||
&, dummy-screen {
|
||||
line-height: 1em;
|
||||
font-size: @notebook_font_size;
|
||||
}
|
||||
|
||||
.xterm-rows {
|
||||
padding: 10px;
|
||||
}
|
||||
@ -31,7 +28,12 @@
|
||||
background: white;
|
||||
}
|
||||
|
||||
.terminado-container-container {
|
||||
padding-top: @page-header-padding;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#terminado-container {
|
||||
margin-top: @page-header-padding;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@ -42,7 +42,7 @@
|
||||
'jquery-ui': 'components/jquery-ui/ui/minified/jquery-ui.min',
|
||||
moment: 'components/moment/min/moment-with-locales',
|
||||
codemirror: 'components/codemirror',
|
||||
termjs: 'components/xterm.js/dist/xterm',
|
||||
termjs: 'components/xterm.js/xterm',
|
||||
typeahead: 'components/jquery-typeahead/dist/jquery.typeahead.min',
|
||||
},
|
||||
map: { // for backward compatibility
|
||||
|
||||
@ -15,7 +15,7 @@ data-ws-path="{{ws_path}}"
|
||||
{% block stylesheet %}
|
||||
{{super()}}
|
||||
<link rel="stylesheet" href="{{ static_url("terminal/css/override.css") }}" type="text/css" />
|
||||
<link rel="stylesheet" href="{{static_url("components/xterm.js/dist/xterm.css") }}" type="text/css" />
|
||||
<link rel="stylesheet" href="{{static_url("components/xterm.js-css/index.css") }}" type="text/css" />
|
||||
{% endblock %}
|
||||
|
||||
{% block headercontainer %}
|
||||
@ -23,44 +23,13 @@ data-ws-path="{{ws_path}}"
|
||||
{% endblock headercontainer %}
|
||||
|
||||
{% block site %}
|
||||
<div id="terminado-container" class="container"></div>
|
||||
<div class="terminado-container-container">
|
||||
<div id="terminado-container" class="container"></div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
{% block script %}
|
||||
|
||||
<!-- Hack: this needs to be outside the display:none block, so we can measure
|
||||
its size in JS in setting up the page. It is still invisible. Putting in
|
||||
the script block gets it outside the initially undisplayed region. -->
|
||||
<!-- test size: 25x80 -->
|
||||
<div style='position:absolute; left:-1000em'>
|
||||
<pre id="dummy-screen" style="border: solid 5px white;" class="terminal">0
|
||||
1
|
||||
2
|
||||
3
|
||||
4
|
||||
5
|
||||
6
|
||||
7
|
||||
8
|
||||
9
|
||||
0
|
||||
1
|
||||
2
|
||||
3
|
||||
4
|
||||
5
|
||||
6
|
||||
7
|
||||
8
|
||||
9
|
||||
0
|
||||
1
|
||||
2
|
||||
3
|
||||
<span id="dummy-screen-rows" style="">01234567890123456789012345678901234567890123456789012345678901234567890123456789</span>
|
||||
</pre>
|
||||
</div>
|
||||
|
||||
{{super()}}
|
||||
|
||||
<script src="{{ static_url("terminal/js/main.min.js") }}" type="text/javascript" charset="utf-8"></script>
|
||||
|
||||
@ -157,8 +157,9 @@ def find_package_data():
|
||||
pjoin(components, "underscore", "underscore-min.js"),
|
||||
pjoin(components, "moment", "moment.js"),
|
||||
pjoin(components, "moment", "min", "*.js"),
|
||||
pjoin(components, "xterm.js", "dist", "xterm.js"),
|
||||
pjoin(components, "xterm.js", "dist", "xterm.css"),
|
||||
pjoin(components, "xterm.js", "index.js"),
|
||||
pjoin(components, "xterm.js-css", "index.css"),
|
||||
pjoin(components, "xterm.js-fit", "index.js"),
|
||||
pjoin(components, "text-encoding", "lib", "encoding.js"),
|
||||
])
|
||||
|
||||
|
||||
@ -24,7 +24,8 @@ var rjs_config = {
|
||||
"jquery-ui": 'components/jquery-ui/ui/minified/jquery-ui.min',
|
||||
moment: 'components/moment/min/moment-with-locales',
|
||||
codemirror: 'components/codemirror',
|
||||
xterm: 'components/xterm.js/dist/xterm',
|
||||
xterm: 'components/xterm.js/index',
|
||||
'xtermjs-fit': 'components/xterm.js-fit/index',
|
||||
typeahead: 'components/jquery-typeahead/dist/jquery.typeahead',
|
||||
contents: 'empty:',
|
||||
custom: 'empty:',
|
||||
|
||||
Loading…
Reference in New Issue
Block a user