luca0N
/
Stairway-js
Archived
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Move results to session HTML page

This commit is contained in:
luca0N! 2021-05-30 02:42:35 -03:00
parent 49bed7259e
commit 1d14d4b6eb
Signed by: luca0N
GPG Key ID: 2E7B4655CF16D7D6
3 changed files with 53 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
res/js/main.js
View File

@ -25,6 +25,8 @@
* by luca0N! <https://www.luca0n.com>
*/
let quizEl;
// Attach setUpStrings() to onReady() in order to execute the main code as soon as possible. This overwrites onReady().
onReady = setUpStrings;
@ -50,7 +52,7 @@ function setUpStrings(){
quizAuthor.style['display'] = 'unset';
let contents = quiz.contents;
let elQuiz = document.getElementById('quiz'); // quiz div element.
quizEl = document.getElementById('quiz'); // quiz div element.
for (let x = 0; x < contents.length; x++){
//console.log(contents[x].title);
@ -100,15 +102,17 @@ function setUpStrings(){
} else console.warn('Warning: unknown type "' + contents[x].type + '" for question #' + (x + 1));
elQuiz.appendChild(itemDiv);
quizEl.appendChild(itemDiv);
}
// Add the finish button.
let finish = document.createElement('button');
finish.innerText = 'Finish!';
finish.onclick = function(){
document.location = 'final.html';
// Hide quiz and then show the results.
quizEl.style['display'] = 'none';
document.getElementById('results').style['display'] = 'unset';
}
elQuiz.appendChild(finish);
quizEl.appendChild(finish);
warning.style['display'] = 'none';
});
}

4
res/privacy-rating.css
View File

@ -25,6 +25,10 @@ body {
margin-right: 15%;
}
#results {
display: none;
}
.warning {
color: white;
background-color: orange;

42
session.html
View File

@ -29,7 +29,7 @@
<script lang="javascript" type="text/javascript" src="res/js/defs.js"></script>
<script lang="javascript" type="text/javascript" src="res/js/io.js"></script>
<script lang="javascript" src="res/js/main.js"></script>
<script lang="javascript" type="text/javascript" src="res/js/main.js"></script>
<script lang="javascript" type="text/javascript" src="res/js/js.js"></script>
</head>
@ -38,12 +38,46 @@
<p class="warning" id="javascript-warning">It looks like your browser is configured to block JavaScript. We're sorry, but this page requires JavaScript in order to function.</p>
<p class="warning" id="warning">Loading quiz...</p>
<h2 id="quiz-title">Quiz Title</h2>
<p id="quiz-author">Published by Author</p>
<h2 id="quiz-title">Unknown quiz</h2>
<p id="quiz-author">Unknown author</p>
<div id="results">
<center><p>And your privacy grade is:</p>
<!--<span class="badge grade-s">Grade S</span><br/>
<span class="badge grade-a">Grade A</span><br/>
<span class="badge grade-b">Grade B</span><br/>
<span class="badge grade-c">Grade C</span><br/>
<span class="badge grade-d">Grade D</span><br/>-->
<span class="badge grade-e">Grade E</span><br/>
<!--<span class="badge grade-f">Grade F</span><br/>-->
<div id="quiz">
</center><br/>
<p>Oh no, looks like you got a bad grade! Unfortunately, many popular services do not respect your privacy, and you're likely using some of them.</p>
<p>But you can increase your privacy grade. Do not be discouraged from performing good privacy practices because you can increase it drastically with little to no effort.</p>
<h2>Your Privacy Report</h2>
<i>The good, bad and ugly</i>
<div class="section-report">
<p class="report"><span title="This is a good report" class="report-class report-good">Good</span> This is a good report</p>
<p>This is the report description.</p>
</div>
<div class="section-report">
<p class="report"><span title="This report requires attention" class="report-class report-warning">Warning</span> This is a warning report</p>
<p>This is the report description.</p>
<p>Advisory: this is the report advisory.</p>
</div>
<div class="section-report">
<p class="report"><span title="This is a bad report" class="report-class report-bad">Bad</span> This is a bad report</p>
<p>This is the report description.</p>
<p>Advisory: this is the report advisory.</p>
</div>
<div class="section-report">
<p class="report"><span title="This is a very bad report" class="report-class report-critical">Critical</span> This is a critical report</p>
<p>This is the report description.</p>
<p>Advisory: this is the report advisory.</p>
</div>
</div>
<div id="quiz"></div>
<!--<p>The challenge has begun! In order to find out your privacy grade, you must answer the questions in this form based on your technology use. You may skip questions if you deem necessary.</p>
<p>Please wait - loading questions...</p>
<div class="section-question">