diff --git a/Server/public/res/css/main.css b/Server/public/res/css/main.css index 5c44612..a0aeba6 100644 --- a/Server/public/res/css/main.css +++ b/Server/public/res/css/main.css @@ -82,6 +82,7 @@ a { position: relative; margin-bottom: 30px; box-shadow: 0 0.46875rem 2.1875rem rgba(90, 97, 105, 0.1), 0 0.9375rem 1.40625rem rgba(90, 97, 105, 0.1), 0 0.25rem 0.53125rem rgba(90, 97, 105, 0.12), 0 0.125rem 0.1875rem rgba(90, 97, 105, 0.1); + min-height: 85%; } .info-card .card-statistic .card-icon-large .bi { diff --git a/Server/routes/index.js b/Server/routes/index.js index b79078f..87c0a60 100644 --- a/Server/routes/index.js +++ b/Server/routes/index.js @@ -1,12 +1,25 @@ var express = require('express'); var router = express.Router(); -const { getAllNodes, getNodeInfoFromId } = require("../utilities/mysqlHandler"); +const { getAllNodes, getNodeInfoFromId, getAllConnections } = require("../utilities/mysqlHandler"); +const { filterPresetsAvailable } = require("../utilities/utils"); /* GET home page. */ -router.get('/', (req, res) => { - //var sources = libCore.getSources(); - return res.render('index', {'page': 'index'}); +router.get('/', async (req, res) => { + var nodes = await new Promise((recordResolve, recordReject) => { + getAllNodes((nodeRows) => { + recordResolve(nodeRows); + }); + }); + var connections = await getAllConnections(); + var presets = await new Promise((recordResolve, recordReject) => { + getAllNodes((nodeRows) => { + recordResolve(filterPresetsAvailable(nodeRows)); + }); + }); + + //var sources = libCore.getSources(); + return res.render('index', { 'page': 'index', 'nodes': nodes, 'connections': connections, 'presets': presets }); }); /* GET node controller page. */ @@ -15,10 +28,10 @@ router.get('/controller', async (req, res) => { getAllNodes((nodeRows) => { recordResolve(nodeRows); }); - }); + }); //var sources = libCore.getSources(); - return res.render('controller', {'nodes' : nodes, 'page': 'controller'}); + return res.render('controller', { 'nodes': nodes, 'page': 'controller' }); }); /* GET individual node page. */ @@ -26,7 +39,7 @@ router.get('/node/:id', async (req, res) => { var node = await getNodeInfoFromId(req.params.id); //var sources = libCore.getSources(); - return res.render('node', {'node' : node, 'page': 'node'}); + return res.render('node', { 'node': node, 'page': 'node' }); }); module.exports = router; diff --git a/Server/views/index.ejs b/Server/views/index.ejs index 8e72b3f..4eb1c60 100644 --- a/Server/views/index.ejs +++ b/Server/views/index.ejs @@ -1,133 +1,64 @@ <%- include('partials/htmlHead.ejs', {'page': page}) %>
+
+ <%- include('partials/valueChip.ejs', { + 'title': 'Nodes in the Network', + 'bgColor': "orange-dark", + 'value': nodes.length, + 'progressPercent': false, + 'icon': 'server' + }) %> + + <%- include('partials/valueChip.ejs', { + 'title': 'Nodes Online', + 'bgColor': "green", + 'value': nodes.filter(node => node.online).length, + 'progressPercent': false, + 'icon': 'cpu-fill' + }) %> + + <%- include('partials/valueChip.ejs', { + 'title': 'Nodes with Discord Connections', + 'bgColor': "blue-dark", + 'value': connections.length, + 'progressPercent': false, + 'icon': 'gear-wide-connected' + }) %> + +
+ +
+

Current Connections

+
+ +
+
-
-
-
-
-
-
New Orders
-
-
-
-

- 3,243 -

-
-
- 12.5% -
-
-
-
-
-
-
-
+ <% for(const conn of connections) { %> + <%- include('partials/connectionCard.ejs', {'connection': conn}) %> + <%}%> +
-
-
-
-
-
-
New Orders
-
-
-
-

- 3,243 -

-
-
- 12.5% -
-
-
-
-
-
-
-
- -
-
-
- -
-
-
-
Phyllis Gatlin
- Full Stack Developer -
-
-
-

070 2860 5375 -

-

- PhyllisGatlin@spy.com

-

52 - Ilchester MYBSTER 9WX

-
-
-
-
- -
-
-
- -
-
-
-
Diana Owens
- UI/UX Designer -
-
-
-

087 6321 3235 -

-

- DianaOwens@spy.com

-

52 - Ilchester MYBSTER 9WX

-
-
- - -
-
-
-
+
+

Online Nodes

+
+
+
+ <% for(const node of nodes.filter(node => node.online)) { %> + <%- include('partials/nodeCard.ejs', {'node': node}) %> + <%}%> +
+
+

Offline Nodes

+
+
+
+ <% for(const node of nodes.filter(node => node.online == false)) { %> + <%- include('partials/nodeCard.ejs', {'node': node}) %> + <%}%>
<%- include('partials/bodyEnd.ejs') %> - <%- include('partials/htmlFooter.ejs') %> \ No newline at end of file diff --git a/Server/views/partials/connectioncard.ejs b/Server/views/partials/connectioncard.ejs new file mode 100644 index 0000000..d1a0711 --- /dev/null +++ b/Server/views/partials/connectioncard.ejs @@ -0,0 +1,29 @@ +
+
+ +
+
\ No newline at end of file diff --git a/Server/views/partials/valueChip.ejs b/Server/views/partials/valueChip.ejs new file mode 100644 index 0000000..12b11ea --- /dev/null +++ b/Server/views/partials/valueChip.ejs @@ -0,0 +1,32 @@ +
+
+
+
+
+
+ <%=title%> +
+
+
+
+

+ <%=value%> +

+
+ <% if (progressPercent) {%> +
+ + <%=progressPercent%>% + +
+ <%}%> +
+ <% if (progressPercent) {%> +
+
+
+ <%}%> +
+
+
\ No newline at end of file