express: time and session ID
Signed-off-by: Vincent Batts <vbatts@hashbangbash.com>
This commit is contained in:
parent
c811d35fa5
commit
44167de812
6 changed files with 1196 additions and 165 deletions
|
@ -4,5 +4,8 @@
|
|||
- https://github.com/TA3/web-user-behaviour
|
||||
- https://www.merriam-webster.com/dictionary/critter
|
||||
|
||||
|| y/n | time to decide | indecision ||
|
||||
| | |
|
||||
|| critter name | y/n | time to decide | indecision | session_id ||
|
||||
| | | | |
|
||||
|
||||
|
||||
|
||||
|
|
|
@ -11,6 +11,10 @@
|
|||
<button id="isNotCritterButton">Is <b>not</b> Critter</button>
|
||||
|
||||
<script>
|
||||
// Initialize session variables
|
||||
let sessionStartTime;
|
||||
let lastButtonClickTime;
|
||||
|
||||
// Function to generate a random session ID
|
||||
function generateSessionId() {
|
||||
return Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15);
|
||||
|
@ -38,6 +42,21 @@
|
|||
return sessionId;
|
||||
}
|
||||
|
||||
|
||||
// Function to set session start time
|
||||
function setSessionStartTime() {
|
||||
sessionStartTime = new Date();
|
||||
}
|
||||
|
||||
// Function to calculate and display time difference
|
||||
function displayTimeDifference() {
|
||||
if (sessionStartTime && lastButtonClickTime) {
|
||||
const timeDifference = lastButtonClickTime - sessionStartTime;
|
||||
console.log(`Time since session start: ${timeDifference} milliseconds`);
|
||||
// You can display the time difference on the page as needed
|
||||
}
|
||||
}
|
||||
|
||||
// Add click event listeners to the buttons
|
||||
document.getElementById('isCritterButton').addEventListener('click', () => {
|
||||
recordButtonClick('is critter', getSessionId());
|
||||
|
@ -50,21 +69,29 @@
|
|||
// Function to record button clicks on the server
|
||||
async function recordButtonClick(buttonName, sessionId) {
|
||||
try {
|
||||
await fetch('/recordButtonClick', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify({ buttonName, sessionId }),
|
||||
});
|
||||
const currentTime = new Date();
|
||||
if (lastButtonClickTime) {
|
||||
const timeDifference = currentTime - lastButtonClickTime;
|
||||
// Include the time difference in the POST request data
|
||||
await fetch('/recordButtonClick', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify({ buttonName, sessionId, timeDifference }),
|
||||
});
|
||||
}
|
||||
lastButtonClickTime = currentTime; // Record the timestamp of the button click
|
||||
displayTimeDifference(); // Calculate and display time difference
|
||||
getRandomAnimal(); // Load another random animal
|
||||
} catch (error) {
|
||||
console.error('Error recording button click:', error);
|
||||
}
|
||||
}
|
||||
|
||||
// Initial random animal load
|
||||
// Initial random animal load and session start time
|
||||
getRandomAnimal();
|
||||
setSessionStartTime();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
1165
express/package-lock.json
generated
1165
express/package-lock.json
generated
File diff suppressed because it is too large
Load diff
|
@ -16,6 +16,6 @@
|
|||
"dependencies": {
|
||||
"body-parser": "^1.20.2",
|
||||
"express": "^4.18.2",
|
||||
"ioredis": "^5.3.2"
|
||||
"sqlite3": "^5.1.6"
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,71 +1,82 @@
|
|||
const express = require('express');
|
||||
const fs = require('fs');
|
||||
const bodyParser = require('body-parser');
|
||||
const Redis = require('ioredis');
|
||||
const sqlite3 = require('sqlite3').verbose();
|
||||
const app = express();
|
||||
const port = 3000;
|
||||
|
||||
// Create a Redis Client
|
||||
const redis = new Redis();
|
||||
// Create an SQLite database and initialize tables
|
||||
const db = new sqlite3.Database('mydb.db', (err) => {
|
||||
if (err) {
|
||||
console.error('Error opening SQLite database:', err.message);
|
||||
} else {
|
||||
console.log('Connected to SQLite database');
|
||||
db.run(`
|
||||
CREATE TABLE IF NOT EXISTS button_clicks (
|
||||
id INTEGER PRIMARY KEY AUTOINCREMENT,
|
||||
session_id TEXT,
|
||||
button_name TEXT,
|
||||
timestamp DATETIME DEFAULT CURRENT_TIMESTAMP,
|
||||
time_difference INTEGER -- Add this column for time difference
|
||||
)
|
||||
|
||||
`);
|
||||
}
|
||||
});
|
||||
|
||||
app.use(bodyParser.json());
|
||||
|
||||
var animals;
|
||||
// check and load animals into redis
|
||||
fs.readFile("./animals.json", function (err, data) {
|
||||
if (err) {
|
||||
throw err;
|
||||
}
|
||||
var jsondata = JSON.parse(data);
|
||||
animals = jsondata.animals;
|
||||
//await redis.set('animals', jsondata.animals, 'EX', 3000);
|
||||
});
|
||||
|
||||
|
||||
// Serve the HTML file
|
||||
app.get('/', (req, res) => {
|
||||
res.sendFile(__dirname + '/index.html');
|
||||
});
|
||||
|
||||
// Route to get a random animal name
|
||||
app.get('/getRandomAnimal', (req, res) => {
|
||||
const randomAnimal = animals[Math.floor(Math.random() * animals.length)];
|
||||
res.json({ animalName: randomAnimal });
|
||||
});
|
||||
|
||||
// Route to record button clicks
|
||||
app.post('/recordButtonClick', (req, res) => {
|
||||
try {
|
||||
const { buttonName, sessionId } = req.body;
|
||||
|
||||
// Use a Redis hash to store button clicks associated with session IDs
|
||||
await redis.hincrby('buttonClicks', `${sessionId}:${buttonName}`, 1);
|
||||
|
||||
res.sendStatus(200);
|
||||
|
||||
if (buttonClicks.hasOwnProperty(buttonName)) {
|
||||
buttonClicks[buttonName]++;
|
||||
res.sendStatus(200);
|
||||
} else {
|
||||
res.status(400).json({ error: 'Invalid button name' });
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error recording button click:', error);
|
||||
res.status(500).json({ error: 'Internal server error' });
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
// Route to show the current results
|
||||
app.get('/results', async (req, res) => {
|
||||
app.get('/getRandomAnimal', async (req, res) => {
|
||||
try {
|
||||
// Get the current random animal from Redis
|
||||
const randomAnimal = await redis.get('randomAnimal');
|
||||
const animals = ['Dog', 'Cat', 'Elephant', 'Lion', 'Giraffe'];
|
||||
const randomIndex = Math.floor(Math.random() * animals.length);
|
||||
const randomAnimal = animals[randomIndex];
|
||||
res.json({ animalName: randomAnimal });
|
||||
} catch (error) {
|
||||
console.error('Error fetching random animal:', error);
|
||||
res.status(500).json({ error: 'Internal server error' });
|
||||
}
|
||||
});
|
||||
|
||||
// Get the button click counts from the Redis hash
|
||||
const buttonClicks = await redis.hgetall('buttonClicks');
|
||||
// Route to record button clicks along with session IDs in SQLite
|
||||
app.post('/recordButtonClick', (req, res) => {
|
||||
try {
|
||||
const { buttonName, sessionId } = req.body;
|
||||
|
||||
res.json({ randomAnimal, buttonClicks });
|
||||
db.run('INSERT INTO button_clicks (session_id, button_name) VALUES (?, ?)', [sessionId, buttonName], (err) => {
|
||||
if (err) {
|
||||
console.error('Error recording button click:', err.message);
|
||||
res.status(500).json({ error: 'Internal server error' });
|
||||
} else {
|
||||
res.sendStatus(200);
|
||||
}
|
||||
});
|
||||
} catch (error) {
|
||||
console.error('Error recording button click:', error);
|
||||
res.status(500).json({ error: 'Internal server error' });
|
||||
}
|
||||
});
|
||||
|
||||
// Route to show the current results from SQLite
|
||||
app.get('/results', (req, res) => {
|
||||
try {
|
||||
db.all('SELECT button_name, COUNT(*) as count FROM button_clicks GROUP BY button_name', (err, rows) => {
|
||||
if (err) {
|
||||
console.error('Error fetching results:', err.message);
|
||||
res.status(500).json({ error: 'Internal server error' });
|
||||
} else {
|
||||
const results = {};
|
||||
rows.forEach((row) => {
|
||||
results[row.button_name] = row.count;
|
||||
});
|
||||
res.json(results);
|
||||
}
|
||||
});
|
||||
} catch (error) {
|
||||
console.error('Error fetching results:', error);
|
||||
res.status(500).json({ error: 'Internal server error' });
|
||||
|
|
31
index.html
31
index.html
|
@ -1,31 +0,0 @@
|
|||
<html>
|
||||
<head>
|
||||
<script src="https://cdn.jsdelivr.net/gh/TA3/web-user-behaviour/userBehaviour.min.js"></script>
|
||||
<script src="https://unpkg.com/htmx.org@1.9.5" integrity="sha384-xcuj3WpfgjlKF+FXhSQFQ0ZNr39ln+hwjN3npfM9VBnUskLolQAcN80McRIVOPuO" crossorigin="anonymous"></script>
|
||||
|
||||
<script>
|
||||
userBehaviour.config( {
|
||||
userInfo: true,
|
||||
clicks: true,
|
||||
mouseMovement: true,
|
||||
mouseMovementInterval: 1,
|
||||
mouseScroll: true,
|
||||
timeCount: true,
|
||||
clearAfterProcess: true,
|
||||
processTime: 15,
|
||||
processData: function(results){
|
||||
console.log(results);
|
||||
},
|
||||
});
|
||||
userBehaviour.start();
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
booger snatch
|
||||
|
||||
<button hx-post="/clicked" hx-trigger="click" hx-target="#parent-div" hx-swap="outerHTML" >is critter</button>
|
||||
<button hx-post="/clicked" hx-trigger="click" hx-target="#parent-div" hx-swap="outerHTML" >is not critter</button>
|
||||
|
||||
</body>
|
||||
</html>
|
Loading…
Reference in a new issue