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
$config = require 'config.php';
$apiToken = $config['api_token'];
@ -71,7 +69,13 @@ $stmt->execute([
]);
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;
}
@ -80,10 +84,10 @@ if (isset($data['result']['elements']) && is_array($data['result']['elements']))
foreach ($data['result']['elements'] as $element) {
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;
}
}*/
if (isset($element['QuestionID']) && $element['QuestionID'] === "QID68") {
echo "Survey: {$surveyId}, QuestionID: {$element['QuestionID']} : Description: {$element['QuestionDescription']} : 0 ". PHP_EOL;
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") {
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);
foreach ($element['Choices'] as $index => $choice) {
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") {
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);
foreach ($element['Choices'] as $index => $choice) {
insertOption($surveyId, 3, $index, $choice['Display'], $pdo);

View File

@ -1,82 +1,35 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Triangle and Inverted Triangle Spider Graphs</title>
<script src="https://d3js.org/d3.v7.min.js"></script>
<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>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>QUALTRICS DATA ANALYSIS CONTROL PANEL</title>
</head>
<body onload="drawtriangles()">
<h1>Single Triangle</h1>
<svg id="svg1" width="600" height="600"></svg>
<h1>Pyramid</h1>
<svg id="svg2" width="1000" height="1000"></svg>
<script>
function drawtriangles() {
//doLittleWhiteTriangle('svg1');
//drawtriangle(<svg ID>,<text>,<colour>,[<val1>,<val2>,<val3>],RAGGED(<average>), { x: <x offset>, y: <y offset>},<number>;
//
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);
<body>
<h1>PROCESS</h1>
<ul>
<li>1. Get the survey identification number (SurveyID). This is a unique value associated with each survey and is of the
form SV_cwKjMqAqGxImjMG. All of them start with 'SV_' and there is then a random selection of characters.
</li>
<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
the survey, in which case repeating this process will import the additional completed surveys.
</li>
</ul>
<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>
</script>
<p>Data in the database is then manipulated to produce the graphics using a custom graphics
library using d3.js to produce the visualisations that you see in the reportTemplate.html file.
</p>
</body>
</html>
</html>