aboutsummaryrefslogtreecommitdiffstats
path: root/fg21sim/webui
diff options
context:
space:
mode:
Diffstat (limited to 'fg21sim/webui')
-rw-r--r--fg21sim/webui/static/js/console.js100
-rw-r--r--fg21sim/webui/static/js/websocket.js26
-rw-r--r--fg21sim/webui/templates/console.html5
3 files changed, 128 insertions, 3 deletions
diff --git a/fg21sim/webui/static/js/console.js b/fg21sim/webui/static/js/console.js
new file mode 100644
index 0000000..6d5783a
--- /dev/null
+++ b/fg21sim/webui/static/js/console.js
@@ -0,0 +1,100 @@
+/**
+ * Copyright (c) 2016 Weitian LI <liweitianux@live.com>
+ * MIT license
+ *
+ * Web UI of "fg21sim"
+ * Console operations using the WebSocket communications
+ */
+
+"use strict";
+
+
+/**
+ * Update the task status "#task-status" on the page.
+ *
+ * @param {Object} status - The status pushed from the server is an object
+ * containing the "running" and "finished" items.
+ */
+var updateTaskStatus = function (status) {
+ var running = status.running;
+ var finished = status.finished;
+ var ts = null;
+ if (!running && !finished) {
+ ts = "Not started";
+ $("#task-status").removeClass("label-success label-warning label-danger")
+ .addClass("label-default");
+ $("#task-status .icon").removeClass("fa-check-circle fa-question-circle")
+ .removeClass("fa-spin fa-spinner")
+ .addClass("fa-coffee");
+ }
+ else if (!running && finished) {
+ ts = "Finished";
+ $("#task-status").removeClass("label-default label-warning label-danger")
+ .addClass("label-success");
+ $("#task-status .icon").removeClass("fa-coffee fa-question-circle")
+ .removeClass("fa-spin fa-spinner")
+ .addClass("fa-check-circle");
+ }
+ else if (running && !finished) {
+ ts = "Running";
+ $("#task-status").removeClass("label-default label-success label-danger")
+ .addClass("label-warning");
+ $("#task-status .icon").removeClass("fa-coffee fa-check-circle")
+ .removeClass("fa-question-circle")
+ .addClass("fa-spin fa-spinner");
+ }
+ else {
+ // Unknown status: ERROR ??
+ ts = "ERROR?";
+ $("#task-status").removeClass("label-default label-success label-warning")
+ .addClass("label-danger");
+ $("#task-status .icon").removeClass("fa-coffee fa-check-circle")
+ .removeClass("fa-spin fa-spinner")
+ .addClass("fa-question-circle");
+ }
+ console.log("Task status:", ts);
+ $("#task-status .text").text(ts);
+};
+
+
+/**
+ * Get the task status from the server
+ *
+ * @param {Object} ws - The opened WebSocket object through which to send
+ * the request.
+ */
+var getServerTaskStatus = function (ws) {
+ var msg = {type: "console", action: "get_status"};
+ ws.send(JSON.stringify(msg));
+};
+
+
+/**
+ * Request to start the task on the server.
+ */
+var startServerTask = function (ws, time) {
+ time = typeof time !== "undefined" ? time : 5;
+ var msg = {type: "console", action: "start", time: time};
+ ws.send(JSON.stringify(msg));
+};
+
+
+/**
+ * Handle the received message of type "console"
+ */
+var handleMsgConsole = function (msg) {
+ if (msg.action === "log") {
+ // TODO: show the logging messages
+ }
+ else if (msg.action === "push") {
+ // Update the task status
+ updateTaskStatus(msg.status);
+ }
+ else if (msg.success) {
+ setFormConfigs(msg.data, msg.errors);
+ }
+ else {
+ console.error("WebSocket 'console' request failed:", msg.error);
+ // TODO: add error code support and handle each specific error ...
+ }
+};
diff --git a/fg21sim/webui/static/js/websocket.js b/fg21sim/webui/static/js/websocket.js
index 0c566c6..8f726b8 100644
--- a/fg21sim/webui/static/js/websocket.js
+++ b/fg21sim/webui/static/js/websocket.js
@@ -135,8 +135,7 @@ var connectWebSocket = function (url) {
handleMsgConfigs(msg);
}
else if (msg.type === "console") {
- console.error("NotImplementedError");
- // handleMsgConsole(msg);
+ handleMsgConsole(msg);
}
else if (msg.type === "results") {
console.error("NotImplementedError");
@@ -173,6 +172,18 @@ $(document).ready(function () {
connectWebSocket(ws_url);
});
+ /**********************************************************************
+ * Configuration form
+ */
+
+ // Re-check/validate the whole form configurations
+ $("#conf-recheck").on("click", function () {
+ // TODO:
+ // * collect all current form configurations
+ // * sync to the server and validate
+ // * update the form errors
+ });
+
// Reset the configurations to the defaults
$("#reset-defaults").on("click", function () {
// TODO:
@@ -212,6 +223,17 @@ $(document).ready(function () {
setServerConfigs(g_ws, {[name]: value});
});
+ /**********************************************************************
+ * Console operations
+ */
+
+ // Start the task on the server
+ $("#task-start").on("click", function () {
+ updateTaskStatus({running: true, finished: false});
+ startServerTask(g_ws);
+ getServerTaskStatus(g_ws);
+ });
+
} else {
// WebSocket NOT supported
console.error("Oops, WebSocket is NOT supported!");
diff --git a/fg21sim/webui/templates/console.html b/fg21sim/webui/templates/console.html
index 5236a6e..e7853c9 100644
--- a/fg21sim/webui/templates/console.html
+++ b/fg21sim/webui/templates/console.html
@@ -11,7 +11,10 @@
<p class="status"><strong>
<span class="fa fa-dashboard" aria-hidden="true"></span>
Simulation status:
- <span id="task-status" class="label label-default">N/A</span>
+ <span id="task-status" class="label label-default">
+ <span class="icon fa fa-coffee" aria-hidden="true"></span>
+ <span class="text">Not started</span>
+ </span>
</strong></p>
<p class="button-group">