Added index.html with user instructions

This commit is contained in:
Peter Edmond 2025-05-31 18:01:54 +01:00
parent cd32d67b95
commit 83008da9bf
2 changed files with 40 additions and 81 deletions

View File

@ -14,8 +14,6 @@ function insertOption($surveyId, $question, $option, $text, $pdo) {
} }
// Load config // Load config
$config = require 'config.php'; $config = require 'config.php';
$apiToken = $config['api_token']; $apiToken = $config['api_token'];
@ -71,7 +69,13 @@ $stmt->execute([
]); ]);
if ($stmt->fetch()) { if ($stmt->fetch()) {
echo "Site already exists. Skipping insert.\n"; echo "Custom user qualifiers already exported for this particular survey ({$surveyId}) .<br>".PHP_EOL;
echo "This process only ever needs to be carried out once for each survey.<br>".PHP_EOL;
echo "Skipping data export.<br>".PHP_EOL;
echo "<br><br>";
echo "You now need to <a href=''>go and export the answer data</a> before you can <a href='./reportTemplate.html'>get the survey reports</a>";
return; return;
} }
@ -80,10 +84,10 @@ if (isset($data['result']['elements']) && is_array($data['result']['elements']))
foreach ($data['result']['elements'] as $element) { foreach ($data['result']['elements'] as $element) {
if (isset($element['QuestionID'])) { if (isset($element['QuestionID'])) {
if (isset($element['QuestionID']) && $element['QuestionID'] === "QID70") { /* if (isset($element['QuestionID']) && $element['QuestionID'] === "QID70") {
//echo json_encode($element, JSON_PRETTY_PRINT) . PHP_EOL; //echo json_encode($element, JSON_PRETTY_PRINT) . PHP_EOL;
} }*/
if (isset($element['QuestionID']) && $element['QuestionID'] === "QID68") { if (isset($element['QuestionID']) && $element['QuestionID'] === "QID68") {
echo "Survey: {$surveyId}, QuestionID: {$element['QuestionID']} : Description: {$element['QuestionDescription']} : 0 ". PHP_EOL; echo "Survey: {$surveyId}, QuestionID: {$element['QuestionID']} : Description: {$element['QuestionDescription']} : 0 ". PHP_EOL;
insertOption($surveyId, 1, 0, $element['QuestionDescription'], $pdo); insertOption($surveyId, 1, 0, $element['QuestionDescription'], $pdo);
@ -93,7 +97,8 @@ if (isset($data['result']['elements']) && is_array($data['result']['elements']))
} }
} }
if (isset($element['QuestionID']) && $element['QuestionID'] === "QID69") { if (isset($element['QuestionID']) && $element['QuestionID'] === "QID69") {
echo "Survey: {$surveyId}, QuestionID: {$element['QuestionID']} : Description: {$element['QuestionDescription']} : 0 ". PHP_EOL; echo "Survey: {$surveyId}, QuestionID: {$element['QuestionID']} : ";
echo "Description: {$element['QuestionDescription']} : 0 ". PHP_EOL;
insertOption($surveyId, 2, 0, $element['QuestionDescription'], $pdo); insertOption($surveyId, 2, 0, $element['QuestionDescription'], $pdo);
foreach ($element['Choices'] as $index => $choice) { foreach ($element['Choices'] as $index => $choice) {
insertOption($surveyId, 2, $index, $choice['Display'], $pdo); insertOption($surveyId, 2, $index, $choice['Display'], $pdo);
@ -101,7 +106,8 @@ if (isset($data['result']['elements']) && is_array($data['result']['elements']))
} }
} }
if (isset($element['QuestionID']) && $element['QuestionID'] === "QID70") { if (isset($element['QuestionID']) && $element['QuestionID'] === "QID70") {
echo "Survey: {$surveyId}, QuestionID: {$element['QuestionID']} : Description: {$element['QuestionDescription']} : 0 ". PHP_EOL; echo "Survey: {$surveyId}, QuestionID: {$element['QuestionID']} : ";
echo "Description: {$element['QuestionDescription']} : 0 ". PHP_EOL;
insertOption($surveyId, 3, 0, $element['QuestionDescription'], $pdo); insertOption($surveyId, 3, 0, $element['QuestionDescription'], $pdo);
foreach ($element['Choices'] as $index => $choice) { foreach ($element['Choices'] as $index => $choice) {
insertOption($surveyId, 3, $index, $choice['Display'], $pdo); insertOption($surveyId, 3, $index, $choice['Display'], $pdo);

View File

@ -1,82 +1,35 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8">
<title>Triangle and Inverted Triangle Spider Graphs</title> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://d3js.org/d3.v7.min.js"></script> <title>QUALTRICS DATA ANALYSIS CONTROL PANEL</title>
<script src="./drawtriangle.js"></script>
<script src="./drawtriangleinverted.js"></script>
<style>
body {
font-family: sans-serif;
margin: 0;
padding: 0;
background-color: white;
}
svg {
background: white;
display: block;
margin: auto;
}
.axis line {
stroke: black;
stroke-width: 1.5px;
}
line.tick {
stroke: black;
stroke-width: 1;
}
polygon.grid {
fill: none;
stroke: rgba(200, 200, 200, 0.5); /* light grey with 50% opacity */
stroke-dasharray: 2,2;
}
.area {
fill: rgba(70, 130, 180, 0.3); /* steelblue with transparency */
stroke: rgba(70, 130, 180, 0.6);
stroke-width: 2;
}
.label {
font-size: 12px;
font-weight: bold;
text-anchor: middle;
}
</style>
</head> </head>
<body onload="drawtriangles()"> <body>
<h1>Single Triangle</h1> <h1>PROCESS</h1>
<svg id="svg1" width="600" height="600"></svg> <ul>
<h1>Pyramid</h1> <li>1. Get the survey identification number (SurveyID). This is a unique value associated with each survey and is of the
<svg id="svg2" width="1000" height="1000"></svg> form SV_cwKjMqAqGxImjMG. All of them start with 'SV_' and there is then a random selection of characters.
</li>
<script> <li>2. Import the 'customised' qualifier questions into the database. This only has to be done once.</li>
<li>3. Import the survey answers into the database. This only has to be done once, unless additional people complete
function drawtriangles() { the survey, in which case repeating this process will import the additional completed surveys.
//doLittleWhiteTriangle('svg1'); </li>
//drawtriangle(<svg ID>,<text>,<colour>,[<val1>,<val2>,<val3>],RAGGED(<average>), { x: <x offset>, y: <y offset>},<number>; </ul>
//
drawtriangle('#svg1','Roles','#008845',[0.9,0.9,0.9],0.1, { x: 0, y: 100 },1.3);
//Can also be used to draw a 4 triangle pyramid:
//doBigWhiteTriangle('svg_pyramid');
drawtriangle('#svg2','Roles','#008845',[0.1,0.3,0.8],'', { x: 0, y: 350 },0.5);
drawtriangle('#svg2','Actions','#b2c8c4',[0.1,0.3,0.8],'',{ x: 370, y: 350 },0.4);
drawtriangle('#svg2','Approach','#ed4c0c',[0.1,0.3,0.8],'',{ x: 185, y: 30 },0.3);
drawtriangleinverted('#svg2','Results','#74469c',[0.1,0.3,0.8],'',{ x: 185, y: 243},0.2);
<h1>TECHIE STUFF</h1>
<p>This web application exports data from the QUALTRICS survey:
"eoQ Framework - How to achieve great EO Template - 15 May 2025 Quality Assurance v2"
surveyId (SV_cwKjMqAqGxImjMG) or a clone of this survey.</p>
} <p>This data is then saved into a local database in order to speed up display and avoid
costs associated with repeatedly accessing the QUALTRICS API. This requires 2 steps
before the data can be used as outlined in the process above.
</p>
<p>Data in the database is then manipulated to produce the graphics using a custom graphics
</script> library using d3.js to produce the visualisations that you see in the reportTemplate.html file.
</p>
</body> </body>
</html> </html>