A

From c4371f61a68dcc25c42fa9fc78c624d75b9964dc Mon Sep 17 00:00:00 2001 From: sotech117 Date: Thu, 18 Jan 2024 13:26:24 -0500 Subject: add files via upload --- a.html | 14 ++++++++++++++ b.html | 14 ++++++++++++++ download-utils.js | 50 ++++++++++++++++++++++++++++++++++++++++++++++++++ index.html | 52 ++++++++++++++++++++++++++++++++++++++++++++++++++++ record.js | 43 +++++++++++++++++++++++++++++++++++++++++++ 5 files changed, 173 insertions(+) create mode 100644 a.html create mode 100644 b.html create mode 100644 download-utils.js create mode 100644 index.html create mode 100644 record.js diff --git a/a.html b/a.html new file mode 100644 index 0000000..0f8196a --- /dev/null +++ b/a.html @@ -0,0 +1,14 @@ + + + + + + A + + + + +A + + + diff --git a/b.html b/b.html new file mode 100644 index 0000000..4898c65 --- /dev/null +++ b/b.html @@ -0,0 +1,14 @@ + + + + + + B + + + + +B + + + diff --git a/download-utils.js b/download-utils.js new file mode 100644 index 0000000..0156bdc --- /dev/null +++ b/download-utils.js @@ -0,0 +1,50 @@ +// citation: https://www.geeksforgeeks.org/how-to-create-and-download-csv-file-in-javascript/ + +// performs a downloadUtils of a csv file, given a string buffer in the format of csv text +const download = data => { + // creating a Blob for having a csv file format + // and passing the data with type + const blob = new Blob([data], {type: 'text/csv'}); + + // Creating an object for downloading url + const url = window.URL.createObjectURL(blob); + + // Creating an anchor(a) tag of HTML + const a = document.createElement('a'); + + // Passing the blob downloading url + a.setAttribute('href', url); + + // Setting the anchor tag attribute for downloading + // and passing the downloadUtils file name + const date = new Date(); + // stamp in format of `YYYY-MM-DDTHHmmss` + const stamp = `${date.getFullYear()}-${date.getMonth()+1}-${date.getDate()}T${date.getHours()}${date.getMinutes()}${date.getSeconds()}`; + const fileName = `cs1300-ab-testing-data-${stamp}.csv`; + a.setAttribute('download', fileName); + + // Performing a downloadUtils with click + a.click() +} + +// given the data as an array of objects, generates the text of it's corresponding csv +const buildcsv = data => { + // Empty array for storing the values + let csvRows = []; + + console.log("buildcsv", data); + data.forEach(d => { + // if the array is empty, append the headers (which are the keys) + if (csvRows.length === 0) { + const headers = Object.keys(d); + csvRows.push(headers.join(',')); + } + + // append the data + const values = Object.values(d).join(','); + csvRows.push(values) + + }) + // Returning the array joining with new line + return csvRows.join('\n'); +} diff --git a/index.html b/index.html new file mode 100644 index 0000000..2e1ffc6 --- /dev/null +++ b/index.html @@ -0,0 +1,52 @@ + + + + + cs1300 AB Testing + + + + + +

+ cs1300 AB Testing Start Screen +

+ Task: On the next page, do XYZ... +

+ +
+
+ + + diff --git a/record.js b/record.js new file mode 100644 index 0000000..a97ebbd --- /dev/null +++ b/record.js @@ -0,0 +1,43 @@ +// generate a random UID for this user, on page load. +const UID = Math.round(Math.random() * 1000000); +// takes in an event object and updates local storage to contain that event +const recordAction = event => { + let data = localStorage.getItem("cs1300-ab-testing-data"); + data = JSON.parse(data); + // check if parsing is correct + if (!Array.isArray(data)) { + console.error("DATA is not an array") + return; + } + + // get version form the meta tag on the html file + const version = document.querySelector("meta[name='version']").getAttribute("content"); + const uid = UID; + const timestamp = Date.now().toString(); + const action = event.type; + let target = event.target.tagName; + let targetId = event.target.id; + if (target == null) { + target = 'N/A' + } + if (targetId) { + target += `#${targetId}` + } + data.push({uid, version, action, target, timestamp}); + + localStorage.setItem("cs1300-ab-testing-data", JSON.stringify(data)); +} +// to be called on the click that determined when the task is completed to clean up event listeners +const done = event => { + // record this event + recordAction(event); + + // TODO: remove event listeners + window.removeEventListener('load', recordAction); + window.removeEventListener('click', recordAction); + + location.href = 'index.html'; +} + +window.addEventListener('load', recordAction); +window.addEventListener('click', recordAction); -- cgit v1.2.3-70-g09d2