Skip to content

Commit 1abcb99

Browse files
DaneEverittDaneEveritt
committed
Fix more of the console, add back support for arrow key command history
1 parent 63d0890 commit 1abcb99

File tree

4 files changed

+95
-72
lines changed

4 files changed

+95
-72
lines changed

‎public/themes/pterodactyl/css/terminal.css‎

Lines changed: 9 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -28,72 +28,26 @@
2828
padding: 1px 0;
2929
}
3030

31-
@keyframes cursorblink {
32-
0% {
33-
background: transparent;
34-
}
35-
100% {
36-
background: rgba(170, 170, 170, 0.9);
37-
}
38-
}
39-
40-
@-webkit-keyframes cursorblink {
41-
0% {
42-
background: transparent;
43-
}
44-
100% {
45-
background: rgba(170, 170, 170, 0.9);
46-
}
47-
}
48-
4931
#terminal_input {
5032
width: 100%;
5133
background: rgb(26, 26, 26);
5234
border-radius: 0 0 5px 5px;
53-
padding: 5px 10px;
35+
padding: 0 0 0 10px !important;
5436
}
5537

56-
.terminal_input--input {
57-
height: 0;
58-
width: 0;
59-
position: absolute;
60-
top: -20px;
61-
}
62-
63-
.terminal_input--text, .terminal_input--prompt {
64-
line-height: 14px;
65-
width: 100%;
66-
vertical-align: middle;
67-
font-size: 12px;
38+
.terminal_input--input, .terminal_input--prompt {
6839
font-family: 'Source Code Pro', monospace;
6940
margin-bottom: 0;
70-
background: transparent;
41+
border: 0 !important;
42+
background: transparent !important;
7143
color: rgb(223, 223, 223);
44+
font-size: 12px;
45+
padding: 1px 0 4px !important;
7246
}
73-
74-
.terminal_input--text:before, .terminal_input--text:after {
75-
content: "";
76-
display: inline-block;
77-
width: 7px;
78-
height: 14px;
79-
margin: 0 0 -12px -6px;
80-
vertical-align: middle;
81-
}
82-
83-
.terminal_input--text:after {
84-
position: relative;
85-
bottom: 8px;
86-
left: 8px;
87-
background: #ff00;
88-
animation: cursorblink 0.6s linear infinite alternate;
89-
-webkit-animation: cursorblink 0.6s linear infinite alternate;
90-
}
91-
9247
.terminal_input--input {
93-
color: transparent;
94-
background-color: transparent;
95-
border: 0;
96-
outline: none;
48+
margin-left: 6px;
49+
line-height: 1;
50+
outline: none !important;
9751
}
9852

9953
.terminal-notify {

‎public/themes/pterodactyl/js/frontend/console.js‎

Lines changed: 76 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -21,32 +21,98 @@ var CONSOLE_PUSH_COUNT = Pterodactyl.config.console_count || 50;
2121
var CONSOLE_PUSH_FREQ = Pterodactyl.config.console_freq || 200;
2222
var CONSOLE_OUTPUT_LIMIT = Pterodactyl.config.console_limit || 2000;
2323

24+
var KEYCODE_UP_ARROW = 38;
25+
var KEYCODE_DOWN_ARROW = 40;
26+
2427
var AnsiUp = new AnsiUp;
2528
AnsiUp.use_classes = true;
2629

2730
var $terminal = $('#terminal');
28-
var $ghostInput = $('.terminal_input--input');
29-
var $visibleInput = $('.terminal_input--text');
31+
var $terminalInput = $('.terminal_input--input');
3032
var $scrollNotify = $('#terminalNotify');
3133

3234
$(document).ready(function () {
33-
$ghostInput.focus();
34-
$('.terminal_input--text, #terminal_input, #terminal, #terminalNotify').on('click', function () {
35-
$ghostInput.focus();
36-
});
35+
var storage = window.localStorage;
36+
var activeHx = [];
37+
var currentHxIndex = 0;
38+
var currentKeyCount = 0;
39+
40+
var storedConsoleHistory = storage.getItem('console_hx_' + Pterodactyl.server.uuid);
41+
try {
42+
activeHx = JSON.parse(storedConsoleHistory) || [];
43+
currentKeyCount = activeHx.length - 1;
44+
} catch (ex) {
45+
//
46+
}
3747

38-
$ghostInput.on('input', function () {
39-
$visibleInput.html($(this).val());
48+
$terminalInput.focus();
49+
$('.terminal_input--prompt, #terminal_input, #terminal, #terminalNotify').on('click', function () {
50+
$terminalInput.focus();
4051
});
4152

42-
$ghostInput.on('keyup', function (e) {
53+
$terminalInput.on('keyup', function (e) {
54+
if (e.which === KEYCODE_DOWN_ARROW || e.which === KEYCODE_UP_ARROW) {
55+
var value = consoleHistory(e.which);
56+
57+
if (value !== false) {
58+
$terminalInput.val(value);
59+
}
60+
}
61+
62+
if (e.which === 27) {
63+
$(this).val('');
64+
}
65+
4366
if (e.which === 13) {
67+
saveToHistory($(this).val());
4468
Socket.emit((ConsoleServerStatus !== 0) ? 'send command' : 'set status', $(this).val());
4569

4670
$(this).val('');
47-
$visibleInput.html('');
4871
}
4972
});
73+
74+
function consoleHistory(key) {
75+
// Get previous
76+
if (key === KEYCODE_UP_ARROW) {
77+
// currentHxIndex++;
78+
var index = activeHx.length - (currentHxIndex + 1);
79+
80+
if (typeof activeHx[index - 1] === 'undefined') {
81+
return activeHx[index];
82+
}
83+
84+
currentHxIndex++;
85+
return activeHx[index];
86+
}
87+
88+
// Get more recent
89+
if (key === KEYCODE_DOWN_ARROW) {
90+
var index = activeHx.length - currentHxIndex;
91+
92+
if (typeof activeHx[index + 1] === 'undefined') {
93+
return activeHx[index];
94+
}
95+
96+
currentHxIndex--;
97+
return activeHx[index];
98+
}
99+
}
100+
101+
function saveToHistory(command) {
102+
if (command.length === 0) {
103+
return;
104+
}
105+
106+
if (activeHx.length >= 50) {
107+
activeHx.pop();
108+
}
109+
110+
currentHxIndex = 0;
111+
currentKeyCount++;
112+
activeHx[currentKeyCount] = command;
113+
114+
storage.setItem('console_hx_' + Pterodactyl.server.uuid, JSON.stringify(activeHx));
115+
}
50116
});
51117

52118
$terminal.on('scroll', function () {
@@ -137,7 +203,6 @@ function pushToTerminal(string) {
137203
});
138204
})();
139205

140-
141206
function updateServerPowerControls (data) {
142207
// Server is On or Starting
143208
if(data == 1 || data == 2) {

‎resources/themes/pterodactyl/server/console.blade.php‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -28,9 +28,11 @@
2828
</head>
2929
<body id="terminal-body">
3030
<div id="terminal" style="width:100%;max-height: none !important;"></div>
31-
<div id="terminal_input">
32-
<span class="terminal_input--prompt">{{ $server->username }}:~$</span> <span class="terminal_input--text"></span>
33-
<input type="text" class="terminal_input--input" />
31+
<div id="terminal_input" class="form-group no-margin">
32+
<div class="input-group">
33+
<div class="input-group-addon terminal_input--prompt">{{ $server->username }}:~$</div>
34+
<input type="text" class="form-control terminal_input--input">
35+
</div>
3436
</div>
3537
<div id="terminalNotify" class="terminal-notify hidden">
3638
<i class="fa fa-bell"></i>

‎resources/themes/pterodactyl/server/index.blade.php‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -42,9 +42,11 @@
4242
<div class="box">
4343
<div class="box-body position-relative">
4444
<div id="terminal" style="width:100%;"></div>
45-
<div id="terminal_input">
46-
<span class="terminal_input--prompt">{{ $server->username }}:~$</span> <span class="terminal_input--text"></span>
47-
<input type="text" class="terminal_input--input" />
45+
<div id="terminal_input" class="form-group no-margin">
46+
<div class="input-group">
47+
<div class="input-group-addon terminal_input--prompt">{{ $server->username }}:~$</div>
48+
<input type="text" class="form-control terminal_input--input">
49+
</div>
4850
</div>
4951
<div id="terminalNotify" class="terminal-notify hidden">
5052
<i class="fa fa-bell"></i>

0 commit comments

Comments
 (0)