From 83aad8736401ca0ca86d1113694866faf8594ae6 Mon Sep 17 00:00:00 2001 From: ArloFilley Date: Wed, 5 Oct 2022 14:10:32 +0100 Subject: [PATCH] added the api class and methods to interact with the server --- website/api/api.js | 135 +++++++++++++++++++++++++++++++++++ website/index.html | 1 + website/index.js | 4 +- website/ui_elements/timer.js | 3 +- 4 files changed, 141 insertions(+), 2 deletions(-) create mode 100644 website/api/api.js diff --git a/website/api/api.js b/website/api/api.js new file mode 100644 index 0000000..b1c797e --- /dev/null +++ b/website/api/api.js @@ -0,0 +1,135 @@ +class API { + + constructor() { + this.url = "http://127.0.0.1:8000/api/"; + // this is the url of the server + // this may have to change later on + } + + /** + * This takes the validated data and makes a post + * request to the rocket server + * @param {String} testType + * @param {int} testLength + * @param {int} testTime + * @param {int} testSeed + * @param {int} quoteId + * @param {int} wpm + * @param {int} accuracy + * @param {int} userId + */ + postTest(testType, testLength, testTime, testSeed, quoteId, wpm, accuracy, userId) { + const data = { + 'test_type': testType, + 'test_length': testLength, + 'test_time': testTime, + 'test_seed': testSeed, + 'quote_id': quoteId, + 'wpm': wpm, + 'accuracy': accuracy, + 'user_id': userId + } + + const xhr = new XMLHttpRequest(); + xhr.open("POST", this.url+"post_test"); + xhr.send(JSON.stringify(data)); + } + + /** + * Validates all the parameters used for the postTest function which it then calls + */ + validateTest() { + const test = textbox.getLetters(); + const testType = "words"; + let testLength = test.length; + let testTime = timer.getTime(); + const testSeed = 0; + const quoteId = 0; + let wpm; + const accuracy = 0; + const userId = 0; + + // this is the wpm calculation factoring in the time of test + // it assumes that all words are 5 characters long because on average + // they are + wpm = Math.round((testLength / 5) * (60 / testTime)); + + // the following code is a series of if statements that checks the + // types of the variables is correct if not it errors it and returns + // out of the function + + if ( typeof testType !== "string" ) { + console.error(`testType is value ${typeof testType}\nshould be a string`); + return; + } + if ( typeof testLength !== "number") { + console.error(`testLength is value ${typeof testLength}\n should be a number`); + return; + } + if ( typeof testTime !== "number") { + console.error(`testTime is value ${typeof testTime}\n should be a number`); + return; + } + if ( typeof testSeed !== "number") { + console.error(`testSeed is value ${typeof testSeed}\n should be a number`); + return; + } + if ( typeof quoteId !== "number") { + console.error(`quoteId is value ${typeof quoteId}\n should be a number`); + return; + } + if ( typeof wpm !== "number") { + console.error(`wpm is value ${typeof wpm}\n should be a number`); + return; + } + if ( typeof accuracy !== "number") { + console.error(`accuracy is value ${typeof accuracy}\n should be a number`); + return; + } + if ( typeof userId !== "number") { + console.error(`userId is value ${typeof userId}\n should be a number`); + return; + } + + // after checking that all variables are of the correct type these if statements check + // that they are acceptable values or are in acceptable bounds depending on variable types + + if (testType !== "words") { + // currently words is the only acceptable type but + // this will change in later iterations + + console.error(`testType is invalid\nacceptable options ['words']`); + } + // upper bounds for these numbers are less of a concern because the server will automatically + // return an error if values are over the limit + if (testLength < 0) { + console.error(`testLength is too small, min value 0`) + } + if (testTime < 1) { + console.error(`testTime is too small, min value 1`) + } + if (testSeed < 0) { + console.error(`testSeed is too small, min value 0`) + } + if (quoteId < 0) { + console.error(`quoteId is too small, min value 0`) + } + if (wpm < 0) { + console.error(`wpm is too small, min value 0`) + } + // accuracy needs an upper bound check because users can't have more than 100% + // accuracy when completing their tests + if (accuracy < 0) { + console.error(`accuracy is too small, min value 0`) + } else if (accuracy > 100) { + console.error(`accuracy is too big, max value 100`) + } + if (userId < 0) { + console.error(`userId is too small, min value 0`) + } + + // there will be other tests here in later iterations but for now these tests should suffice + + this.postTest(testType, testLength, testTime, testSeed, quoteId, wpm, accuracy, userId); + } +} \ No newline at end of file diff --git a/website/index.html b/website/index.html index 60a71a8..b080f33 100644 --- a/website/index.html +++ b/website/index.html @@ -16,6 +16,7 @@ + diff --git a/website/index.js b/website/index.js index 9200206..84e0790 100644 --- a/website/index.js +++ b/website/index.js @@ -1,4 +1,5 @@ let canvas; +let api; let textbox, timer; function setup() { @@ -10,8 +11,9 @@ function setup() { frameRate(60); textbox = new Textbox(400, 200, 700); - timer = new Timer(0, 0, 100, 100, 0, true, '#000', true, '#000','#F3C969', 30, true); + timer = new Timer(0, 0, 100, 100, 0, true, '#000', true, '#000','#F3C969', 10, true); timer.start(); + api = new API(); } // this function is called once per frame and draws all other elements diff --git a/website/ui_elements/timer.js b/website/ui_elements/timer.js index 316d31f..fbd9c09 100644 --- a/website/ui_elements/timer.js +++ b/website/ui_elements/timer.js @@ -152,9 +152,10 @@ class Timer { * this function is called at the end of the timer */ end() { + this.visible = false; + api.validateTest(); this.timeElapsed = 0; this.time = 0; - this.visible = false; // Then this function will call all other functions necessary to complete the test // this will likely including changing the screen and interacting with the api }