Skip to content

Commit 5142dce

Browse files
schrejschrej
committed
reorganize code of console module
1 parent 96f5d15 commit 5142dce

File tree

1 file changed

+152
-137
lines changed

1 file changed

+152
-137
lines changed

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

Lines changed: 152 additions & 137 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,12 @@ const Console = (function () {
2525
var terminalQueue;
2626
var terminal;
2727

28+
var cpuChart;
29+
var cpuData;
30+
var memoryChart;
31+
var memoryData;
32+
var timeLabels;
33+
2834
function initConsole() {
2935
termianlQueue = [];
3036
terminal = $('#terminal').terminal(function (command, term) {
@@ -41,13 +47,134 @@ const Console = (function () {
4147
return false;
4248
}
4349
});
50+
}
51+
52+
function initGraphs() {
53+
var ctc = $('#chart_cpu');
54+
var timeLabels = [];
55+
var cpuData = [];
56+
var CPUChart = new Chart(ctc, {
57+
type: 'line',
58+
data: {
59+
labels: timeLabels,
60+
datasets: [
61+
{
62+
label: "Percent Use",
63+
fill: false,
64+
lineTension: 0.03,
65+
backgroundColor: "#00A1CB",
66+
borderColor: "#00A1CB",
67+
borderCapStyle: 'butt',
68+
borderDash: [],
69+
borderDashOffset: 0.0,
70+
borderJoinStyle: 'miter',
71+
pointBorderColor: "rgba(75,192,192,1)",
72+
pointBackgroundColor: "#fff",
73+
pointBorderWidth: 1,
74+
pointHoverRadius: 5,
75+
pointHoverBackgroundColor: "rgba(75,192,192,1)",
76+
pointHoverBorderColor: "rgba(220,220,220,1)",
77+
pointHoverBorderWidth: 2,
78+
pointRadius: 1,
79+
pointHitRadius: 10,
80+
data: cpuData,
81+
spanGaps: false,
82+
}
83+
]
84+
},
85+
options: {
86+
title: {
87+
display: true,
88+
text: 'CPU Usage (as Percent Total)'
89+
},
90+
legend: {
91+
display: false,
92+
},
93+
animation: {
94+
duration: 1,
95+
}
96+
}
97+
});
98+
99+
var ctm = $('#chart_memory');
100+
var memoryData = [];
101+
var MemoryChart = new Chart(ctm, {
102+
type: 'line',
103+
data: {
104+
labels: timeLabels,
105+
datasets: [
106+
{
107+
label: "Memory Use",
108+
fill: false,
109+
lineTension: 0.03,
110+
backgroundColor: "#01A4A4",
111+
borderColor: "#01A4A4",
112+
borderCapStyle: 'butt',
113+
borderDash: [],
114+
borderDashOffset: 0.0,
115+
borderJoinStyle: 'miter',
116+
pointBorderColor: "rgba(75,192,192,1)",
117+
pointBackgroundColor: "#fff",
118+
pointBorderWidth: 1,
119+
pointHoverRadius: 5,
120+
pointHoverBackgroundColor: "rgba(75,192,192,1)",
121+
pointHoverBorderColor: "rgba(220,220,220,1)",
122+
pointHoverBorderWidth: 2,
123+
pointRadius: 1,
124+
pointHitRadius: 10,
125+
data: memoryData,
126+
spanGaps: false,
127+
}
128+
]
129+
},
130+
options: {
131+
title: {
132+
display: true,
133+
text: 'Memory Usage (in Megabytes)'
134+
},
135+
legend: {
136+
display: false,
137+
},
138+
animation: {
139+
duration: 1,
140+
}
141+
}
142+
});
143+
}
44144

145+
function addSocketListeners() {
146+
// Update Listings on Initial Status
45147
Socket.on('initial status', function (data) {
148+
updateServerPowerControls(data.status);
149+
46150
terminal.clear();
47151
if (data.status === 1 || data.status === 2) {
48152
Socket.emit('send server log');
49153
}
50154
});
155+
156+
// Update Listings on Status
157+
Socket.on('status', function (data) {
158+
updateServerPowerControls(data.status);
159+
});
160+
161+
Socket.on('proc', function (proc) {
162+
if (cpuData.length > 10) {
163+
cpuData.shift();
164+
memoryData.shift();
165+
timeLabels.shift();
166+
}
167+
168+
var cpuUse = (Pterodactyl.server.cpu > 0) ? parseFloat(((proc.data.cpu.total / Pterodactyl.server.cpu) * 100).toFixed(3).toString()) : proc.data.cpu.total;
169+
cpuData.push(cpuUse);
170+
memoryData.push(parseInt(proc.data.memory.total / (1024 * 1024)));
171+
172+
var m = new Date();
173+
timeLabels.push($.format.date(new Date(), 'HH:mm:ss'));
174+
175+
CPUChart.update();
176+
MemoryChart.update();
177+
});
51178
}
52179

53180
function pushOutputQueue() {
@@ -65,150 +192,38 @@ const Console = (function () {
65192
window.setTimeout(pushOutputQueue, CONSOLE_PUSH_FREQ);
66193
}
67194

195+
function updateServerPowerControls (data) {
196+
// Server is On or Starting
197+
if(data == 1 || data == 2) {
198+
$('[data-attr="power"][data-action="start"]').addClass('disabled');
199+
$('[data-attr="power"][data-action="stop"], [data-attr="power"][data-action="restart"]').removeClass('disabled');
200+
} else {
201+
if (data == 0) {
202+
$('[data-attr="power"][data-action="start"]').removeClass('disabled');
203+
}
204+
$('[data-attr="power"][data-action="stop"], [data-attr="power"][data-action="restart"]').addClass('disabled');
205+
}
206+
207+
if(data !== 0) {
208+
$('[data-attr="power"][data-action="kill"]').removeClass('disabled');
209+
} else {
210+
$('[data-attr="power"][data-action="kill"]').addClass('disabled');
211+
}
212+
}
213+
68214
return {
69215
init: function () {
216+
217+
initConsole();
218+
pushOutputQueue();
219+
initGraphs();
220+
addSocketListeners();
221+
70222
$('[data-attr="power"]').click(function (event) {
71223
if (! $(this).hasClass('disabled')) {
72224
Socket.emit('set status', $(this).data('action'));
73225
}
74226
});
75-
76-
var ctc = $('#chart_cpu');
77-
var timeLabels = [];
78-
var cpuData = [];
79-
var CPUChart = new Chart(ctc, {
80-
type: 'line',
81-
data: {
82-
labels: timeLabels,
83-
datasets: [
84-
{
85-
label: "Percent Use",
86-
fill: false,
87-
lineTension: 0.03,
88-
backgroundColor: "#00A1CB",
89-
borderColor: "#00A1CB",
90-
borderCapStyle: 'butt',
91-
borderDash: [],
92-
borderDashOffset: 0.0,
93-
borderJoinStyle: 'miter',
94-
pointBorderColor: "rgba(75,192,192,1)",
95-
pointBackgroundColor: "#fff",
96-
pointBorderWidth: 1,
97-
pointHoverRadius: 5,
98-
pointHoverBackgroundColor: "rgba(75,192,192,1)",
99-
pointHoverBorderColor: "rgba(220,220,220,1)",
100-
pointHoverBorderWidth: 2,
101-
pointRadius: 1,
102-
pointHitRadius: 10,
103-
data: cpuData,
104-
spanGaps: false,
105-
}
106-
]
107-
},
108-
options: {
109-
title: {
110-
display: true,
111-
text: 'CPU Usage (as Percent Total)'
112-
},
113-
legend: {
114-
display: false,
115-
},
116-
animation: {
117-
duration: 1,
118-
}
119-
}
120-
});
121-
122-
var ctm = $('#chart_memory');
123-
var memoryData = [];
124-
var MemoryChart = new Chart(ctm, {
125-
type: 'line',
126-
data: {
127-
labels: timeLabels,
128-
datasets: [
129-
{
130-
label: "Memory Use",
131-
fill: false,
132-
lineTension: 0.03,
133-
backgroundColor: "#01A4A4",
134-
borderColor: "#01A4A4",
135-
borderCapStyle: 'butt',
136-
borderDash: [],
137-
borderDashOffset: 0.0,
138-
borderJoinStyle: 'miter',
139-
pointBorderColor: "rgba(75,192,192,1)",
140-
pointBackgroundColor: "#fff",
141-
pointBorderWidth: 1,
142-
pointHoverRadius: 5,
143-
pointHoverBackgroundColor: "rgba(75,192,192,1)",
144-
pointHoverBorderColor: "rgba(220,220,220,1)",
145-
pointHoverBorderWidth: 2,
146-
pointRadius: 1,
147-
pointHitRadius: 10,
148-
data: memoryData,
149-
spanGaps: false,
150-
}
151-
]
152-
},
153-
options: {
154-
title: {
155-
display: true,
156-
text: 'Memory Usage (in Megabytes)'
157-
},
158-
legend: {
159-
display: false,
160-
},
161-
animation: {
162-
duration: 1,
163-
}
164-
}
165-
});
166-
Socket.on('proc', function (proc) {
167-
if (cpuData.length > 10) {
168-
cpuData.shift();
169-
memoryData.shift();
170-
timeLabels.shift();
171-
}
172-
173-
var cpuUse = (Pterodactyl.server.cpu > 0) ? parseFloat(((proc.data.cpu.total / Pterodactyl.server.cpu) * 100).toFixed(3).toString()) : proc.data.cpu.total;
174-
cpuData.push(cpuUse);
175-
memoryData.push(parseInt(proc.data.memory.total / (1024 * 1024)));
176-
177-
var m = new Date();
178-
timeLabels.push($.format.date(new Date(), 'HH:mm:ss'));
179-
180-
CPUChart.update();
181-
MemoryChart.update();
182-
});
183-
184-
// Update Listings on Initial Status
185-
Socket.on('initial status', function (data) {
186-
updateServerPowerControls(data.status);
187-
});
188-
189-
// Update Listings on Status
190-
Socket.on('status', function (data) {
191-
updateServerPowerControls(data.status);
192-
});
193-
194-
function updateServerPowerControls (data) {
195-
// Server is On or Starting
196-
if(data == 1 || data == 2) {
197-
$('[data-attr="power"][data-action="start"]').addClass('disabled');
198-
$('[data-attr="power"][data-action="stop"], [data-attr="power"][data-action="restart"]').removeClass('disabled');
199-
} else {
200-
if (data == 0) {
201-
$('[data-attr="power"][data-action="start"]').removeClass('disabled');
202-
}
203-
$('[data-attr="power"][data-action="stop"], [data-attr="power"][data-action="restart"]').addClass('disabled');
204-
}
205-
206-
if(data !== 0) {
207-
$('[data-attr="power"][data-action="kill"]').removeClass('disabled');
208-
} else {
209-
$('[data-attr="power"][data-action="kill"]').addClass('disabled');
210-
}
211-
}
212227
},
213228

214229
getTerminal: function() {

0 commit comments

Comments
 (0)