From 26204b4b9673d7968d84562a6c0ce2bad41d3b48 Mon Sep 17 00:00:00 2001 From: udmsoft Date: Wed, 26 Sep 2018 10:45:14 -0400 Subject: [PATCH] Did the cool memes! Almost done --- .../nutcounter/server/client/index.html | 79 ++++++++++++++----- .../nutcounter/server/client/progress.js | 33 ++++++++ .../nutcounter/server/client/reporter.html | 66 ++++++++++++++++ JavaScript/nutcounter/server/index.js | 11 +-- 4 files changed, 162 insertions(+), 27 deletions(-) create mode 100644 JavaScript/nutcounter/server/client/progress.js diff --git a/JavaScript/nutcounter/server/client/index.html b/JavaScript/nutcounter/server/client/index.html index 9129c60..29a2665 100644 --- a/JavaScript/nutcounter/server/client/index.html +++ b/JavaScript/nutcounter/server/client/index.html @@ -1,24 +1,63 @@ - - - - "Progress" Viewer - - - - -
- - + + + + "Progress" Viewer + + + + + + +

*********

+
+ +
+ + + + \ No newline at end of file diff --git a/JavaScript/nutcounter/server/client/progress.js b/JavaScript/nutcounter/server/client/progress.js new file mode 100644 index 0000000..de628ed --- /dev/null +++ b/JavaScript/nutcounter/server/client/progress.js @@ -0,0 +1,33 @@ +//When life gives you CSS, roll your own canvas-based solution +//Written by @UDXS + +class ProgressBar { + //step = percent to change per step + constructor(context, margin, step) { + this.canvas = context.canvas; + this.ctx = context; + this.margin = margin; + this.prog = 0; + this.target = 0; + this.stepAmt = step; + } + get progress() { + return this.target; + } + set progress(target) { + this.target = target; + if(target > 1) target = 1; + if(target < 1) target = 0; + } + draw() { + let radius = Math.min(this.canvas.width,this.canvas.height)/2; + let start = Math.PI/-2; + this.ctx.arc(this.canvas.width / 2, this.canvas.height / 2, radius - this.margin, start, 2 * Math.PI * this.prog + start); + } + step() { + if (Math.abs(this.target - this.prog) > this.stepAmt) + this.prog += this.target > this.prog ? this.stepAmt : this.stepAmt * -1; + else + this.prog = this.target; + } +} \ No newline at end of file diff --git a/JavaScript/nutcounter/server/client/reporter.html b/JavaScript/nutcounter/server/client/reporter.html index e69de29..88ca269 100644 --- a/JavaScript/nutcounter/server/client/reporter.html +++ b/JavaScript/nutcounter/server/client/reporter.html @@ -0,0 +1,66 @@ + + + + + + "Progress" Reporter + + + + + + + +

********* Progress Reporter

+
+ +
+ +
+ + + + + \ No newline at end of file diff --git a/JavaScript/nutcounter/server/index.js b/JavaScript/nutcounter/server/index.js index 7b8f3af..1ef9f8f 100644 --- a/JavaScript/nutcounter/server/index.js +++ b/JavaScript/nutcounter/server/index.js @@ -9,7 +9,6 @@ app.use(bodyParser.urlencoded({ })); let progress = 0; -console.log(process.argv); if (process.argv.length >= 3) { app.listen(parseInt(process.argv[2])); } else { @@ -17,18 +16,16 @@ if (process.argv.length >= 3) { } app.use(express.static(__dirname + '/client')); -app.get('/', (req, res, next) => { - res.status(200).sendFile('index.html'); -}); -app.get('/progress', (req, res, next) => { +app.get('/api/progress', (req, res, next) => { res.status(200).end(JSON.stringify({ progress: progress })); }); -app.post('/progress', (req, res, next) => { - progress = req.body.progress; +//Wow this is broken. Child prodigy workaround deployed. +app.post('/api/progress', (req, res, next) => { + progress = JSON.parse(Object.keys(req.body)[0]).progress; res.status(200).end(JSON.stringify({ status: 'completed' }));