Compare commits
10 Commits
37caeab31a
...
1cce73db41
Author | SHA1 | Date |
---|---|---|
luca0N! | 1cce73db41 | |
luca0N! | d3b2da856e | |
luca0N! | 4379bbd6e5 | |
luca0N! | 0abc865113 | |
luca0N! | 4c5567a979 | |
luca0N! | d61a0fdce8 | |
luca0N! | 4cf98ca23d | |
luca0N! | e253939fb0 | |
luca0N! | fd377ba8c0 | |
luca0N! | ccb7e51ef8 |
47
index.html
47
index.html
|
@ -24,16 +24,47 @@
|
|||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8"/>
|
||||
<title>Privacy Rating</title>
|
||||
<title>Stairway Quiz</title>
|
||||
<link rel="stylesheet" type="text/css" href="res/Stairway-js.css"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<script>
|
||||
/*
|
||||
@licstart The following is the entire license notice for the
|
||||
JavaScript code in this page.
|
||||
|
||||
Copyright © 2021 luca0N!
|
||||
|
||||
The JavaScript code in this page is free software: you can
|
||||
redistribute it and/or modify it under the terms of the GNU
|
||||
General Public License (GNU GPL) as published by the Free Software
|
||||
Foundation, either version 3 of the License, or (at your option)
|
||||
any later version. The code is distributed WITHOUT ANY WARRANTY;
|
||||
without even the implied warranty of MERCHANTABILITY or FITNESS
|
||||
FOR A PARTICULAR PURPOSE. See the GNU GPL for more details.
|
||||
|
||||
As additional permission under GNU GPL version 3 section 7, you
|
||||
may distribute non-source (e.g., minimized or compacted) forms of
|
||||
that code without the copy of the GNU GPL normally required by
|
||||
section 4, provided you include this license notice and a URL
|
||||
through which recipients can access the Corresponding Source.
|
||||
|
||||
|
||||
@licend The above is the entire license notice
|
||||
for the JavaScript code in this page.
|
||||
*/
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Privacy Rating</h1><hr/>
|
||||
<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>Privacy Rating displays a form containing a few questions which are used to show a privacy grade based on your technology tasks, ranging from excellent (<span class="badge-small grade-s">Grade S</span>) to very bad (<span class="badge-small grade-f">Grade F</span>).</p>
|
||||
<p>Privacy Rating attemps to warn you about bad software, services and practices in order to protect your privacy online.</p>
|
||||
<p>This service does not track you, and your answers are not sent to our servers. If you don't want to trust this instance, you can self-host it yourself.</p>
|
||||
<p>Once you are ready to start, click on the button below.</p>
|
||||
<button onclick="document.location = 'session.html'">Start!</button>
|
||||
<div class="content">
|
||||
<h1>Stairway Quiz</h1><hr/>
|
||||
<!--<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>Stairway Quiz results range from excellent (<span class="badge-small grade-s">Grade S</span>) to very bad (<span class="badge-small grade-f">Grade F</span>).</p>
|
||||
<p>This service does not track you, and your answers are not sent to our servers. You can also self-host Stairway.js.</p>
|
||||
<p>Once you are ready to start, click on the button below.</p>
|
||||
<button onclick="document.location = 'session.html'">Start!</button>
|
||||
<hr/>
|
||||
<p>Stairway.js is <a href="https://labs.luca0n.com/projects/stairway-js" target="_blank">released</a> under the <a href="https://git.luca0n.com/Stairway-js.git/tree/LICENSE" target="_blank">GNU General Public License version 3 or later</a>, by <a href="https://www.luca0n.com" target="_blank">luca0N!</a></p>
|
||||
<p>luca0N! does not endorse all quizzes created for Stairway.js and may not own copyrights on the current quiz.</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -27,6 +27,16 @@ html {
|
|||
body {
|
||||
margin-left: 15%;
|
||||
margin-right: 15%;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
|
||||
background-color: #bfc0cd;
|
||||
}
|
||||
|
||||
.content {
|
||||
background-color: #fff;
|
||||
padding: 24px;
|
||||
box-shadow: 0 0 32px #0004;
|
||||
}
|
||||
|
||||
#results {
|
||||
|
@ -104,7 +114,14 @@ body {
|
|||
margin-top: 32px;
|
||||
margin-bottom: 32px;
|
||||
padding: 15px;
|
||||
border-style: dashed;
|
||||
background-color: #feffea;
|
||||
box-shadow: 0 0 12px #0004;
|
||||
|
||||
transition: box-shadow 0.1s;
|
||||
}
|
||||
|
||||
.section-question:hover {
|
||||
box-shadow: 0 0 18px #0008;
|
||||
}
|
||||
|
||||
#warning {
|
||||
|
@ -127,7 +144,24 @@ body {
|
|||
.section-report {
|
||||
margin-top: 12px;
|
||||
padding: 15px;
|
||||
border: solid;
|
||||
box-shadow: 0 0 12px #0004;
|
||||
}
|
||||
|
||||
.section-report-good {
|
||||
background-color: #aaffaa;
|
||||
}
|
||||
.section-report-warning {
|
||||
background-color: #ffa;
|
||||
}
|
||||
.section-report-bad {
|
||||
background-color: #ffd79f;
|
||||
}
|
||||
.section-report-critical {
|
||||
background-color: #fcc;
|
||||
}
|
||||
|
||||
.advisory {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.report-title {
|
||||
|
@ -146,6 +180,7 @@ body {
|
|||
background-color: yellow;
|
||||
}
|
||||
.report-bad {
|
||||
color: white;
|
||||
background-color: orange;
|
||||
}
|
||||
.report-critical {
|
||||
|
|
|
@ -41,7 +41,8 @@ function setUpStrings(){
|
|||
let warning = document.getElementById('warning');
|
||||
warning.style['display'] = 'unset';
|
||||
// Get JSON file which contains all of the challenges required.
|
||||
sendGetRequest('privacy-quiz.en.json', function(text){
|
||||
// FIXME: remove hardcoded quiz name.
|
||||
sendGetRequest('sample.en.json', function(text){
|
||||
quiz = JSON.parse(text);
|
||||
|
||||
// Set up UI elements based on quiz metadata.
|
||||
|
@ -160,7 +161,7 @@ function setUpStrings(){
|
|||
let report = quiz.reports[choices[x][y]];
|
||||
|
||||
let reportEl = document.createElement('div');
|
||||
reportEl.className = 'section-report';
|
||||
reportEl.className = 'section-report section-report-' + report.type;
|
||||
|
||||
let title = document.createElement('p');
|
||||
title.className = 'report-title';
|
||||
|
@ -194,12 +195,32 @@ function setUpStrings(){
|
|||
if (report.advisory != null && report.advisory != undefined){
|
||||
let p = document.createElement('p');
|
||||
p.innerText = report.advisory;
|
||||
p.className = 'advisory';
|
||||
reportEl.appendChild(p);
|
||||
}
|
||||
|
||||
reports.appendChild(reportEl);
|
||||
}
|
||||
|
||||
// Set the grade message (if it exists.
|
||||
let gme = document.getElementById('grade-message'); // Grade Message Element
|
||||
|
||||
// Check if this quiz contains custom grade messages.
|
||||
if (quiz.gradeMessages != undefined && quiz.gradeMessages != null){
|
||||
let gmt, gmto = quiz.gradeMessages['grade-' + grade];
|
||||
|
||||
// Check if there is a grade message for the current grade.
|
||||
if (gmto !== undefined && gmto !== null){
|
||||
gmt = gmto.split('\n');
|
||||
for (let i = 0; i < gmt.length; i++){
|
||||
let line = gmt[i];
|
||||
let p = document.createElement('p');
|
||||
p.innerText = line;
|
||||
gme.appendChild(p);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Hide quiz and then show the results.
|
||||
quizEl.style['display'] = 'none';
|
||||
document.getElementById('results').style['display'] = 'unset';
|
||||
|
|
|
@ -0,0 +1,98 @@
|
|||
{
|
||||
"title": "Sample Quiz",
|
||||
"originalTimestamp": 1622672119,
|
||||
"timestamp": -1,
|
||||
|
||||
"author": "luca0N!",
|
||||
"contributors": [
|
||||
"luca0N!"
|
||||
],
|
||||
"publisher": "luca0N!",
|
||||
|
||||
"license": "CC0",
|
||||
"version": "v0.0-dev",
|
||||
"revision": 1,
|
||||
"format": "qrstd-1.0",
|
||||
|
||||
"globalSettings": {
|
||||
"section.multiple.points.max": 10,
|
||||
"section.multiple.points.min": -10
|
||||
},
|
||||
|
||||
"threshold":{
|
||||
"s.min": 10,
|
||||
"a.min": 8,
|
||||
"b.min": 4,
|
||||
"c.min": 0,
|
||||
"d.min": -3,
|
||||
"e.min": -14,
|
||||
"f.min": -24
|
||||
},
|
||||
"gradeMessages":{
|
||||
"grade-s": "Congratulations! Your grade is Grade S.",
|
||||
"grade-a": "Congratulations! Your grade is Grade A.",
|
||||
"grade-b": "Congratulations! Your grade is Grade B.",
|
||||
"grade-c": "Your grade is Grade C.",
|
||||
"grade-d": "Your grade is Grade D.",
|
||||
"grade-e": "Your grade is Grade E.",
|
||||
"grade-f": "Your grade is Grade F."
|
||||
},
|
||||
|
||||
"contents":[
|
||||
{
|
||||
"title": "This is a question with checkboxes.",
|
||||
"type": "multiple",
|
||||
"choices": [
|
||||
"Choice 1 (Good)",
|
||||
"Choice 2 (Warning)",
|
||||
"Choice 3 (Bad)",
|
||||
"Choice 4 (Critical)"
|
||||
],
|
||||
"ids": [
|
||||
"choice-good", "choice-warning", "choice-bad", "choice-critical"
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "This is another question, but with radio buttons instead of checkboxes.",
|
||||
"type": "single",
|
||||
"choices": [
|
||||
"Choice 1 (Good)",
|
||||
"Choice 2 (Warning)",
|
||||
"Choice 3 (Bad)",
|
||||
"Choice 4 (Critical)"
|
||||
],
|
||||
"ids": [
|
||||
"choice-good", "choice-warning", "choice-bad", "choice-critical"
|
||||
]
|
||||
}
|
||||
],
|
||||
"reports":{
|
||||
"choice-good": {
|
||||
"title": "You have picked a good choice",
|
||||
"type": "good",
|
||||
"points": 5,
|
||||
"description": "This is the report description."
|
||||
},
|
||||
"choice-warning": {
|
||||
"title": "You have picked a choice associated with a warning report",
|
||||
"type": "warning",
|
||||
"points": 0,
|
||||
"description": "This is the report description.\nLine breaks will split paragraphs.",
|
||||
"advisory": "This is the report advisory. Advisories are optional and can be used with all report types. Advisories are recommended for all report types, except good reports."
|
||||
},
|
||||
"choice-bad": {
|
||||
"title": "You have picked a bad choice",
|
||||
"type": "bad",
|
||||
"points": -5,
|
||||
"description": "This is the report description.",
|
||||
"advisory": "This is the report advisory. Advisories are optional and can be used with all report types. Advisories are recommended for all report types, except good reports."
|
||||
},
|
||||
"choice-critical": {
|
||||
"title": "You have picked a very bad choice",
|
||||
"type": "critical",
|
||||
"points": -8,
|
||||
"description": "This is the report description.",
|
||||
"advisory": "This is the report advisory. Advisories are optional and can be used with all report types. Advisories are recommended for all report types, except good reports."
|
||||
}
|
||||
}
|
||||
}
|
83
session.html
83
session.html
|
@ -24,9 +24,11 @@
|
|||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8"/>
|
||||
<title>Privacy Rating</title>
|
||||
<title>Stairway Quiz</title>
|
||||
<link rel="stylesheet" type="text/css" href="res/Stairway-js.css"/>
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
|
||||
<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" type="text/javascript" src="res/js/main.js"></script>
|
||||
|
@ -34,63 +36,36 @@
|
|||
<script lang="javascript" type="text/javascript" src="res/js/js.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Privacy Rating</h1><hr/>
|
||||
<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>
|
||||
<div class="content">
|
||||
<h1>Stairway Quiz</h1><hr/>
|
||||
<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">Unknown quiz</h2>
|
||||
<p id="quiz-author">Unknown author</p>
|
||||
<div id="results">
|
||||
<center><p>Your privacy grade is:</p>
|
||||
<span id="badge-s" class="badge grade-s">Grade S</span>
|
||||
<span id="badge-a" class="badge grade-a">Grade A</span>
|
||||
<span id="badge-b" class="badge grade-b">Grade B</span>
|
||||
<span id="badge-c" class="badge grade-c">Grade C</span>
|
||||
<span id="badge-d" class="badge grade-d">Grade D</span>
|
||||
<span id="badge-e" class="badge grade-e">Grade E</span>
|
||||
<span id="badge-f" class="badge grade-f">Grade F</span>
|
||||
<h2 id="quiz-title">Unknown quiz</h2>
|
||||
<p id="quiz-author">Unknown author</p>
|
||||
<div id="results">
|
||||
<center><p>Your grade is:</p>
|
||||
<span id="badge-s" class="badge grade-s">Grade S</span>
|
||||
<span id="badge-a" class="badge grade-a">Grade A</span>
|
||||
<span id="badge-b" class="badge grade-b">Grade B</span>
|
||||
<span id="badge-c" class="badge grade-c">Grade C</span>
|
||||
<span id="badge-d" class="badge grade-d">Grade D</span>
|
||||
<span id="badge-e" class="badge grade-e">Grade E</span>
|
||||
<span id="badge-f" class="badge grade-f">Grade F</span>
|
||||
|
||||
</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 id="reports">
|
||||
</div>
|
||||
<!--<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>
|
||||
</center><br/>
|
||||
<div id="grade-message"></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>-->
|
||||
<h2>Your Report</h2>
|
||||
<i>The good, bad and ugly</i>
|
||||
<div id="reports">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div id="quiz"></div>
|
||||
<hr/>
|
||||
<p>Stairway.js is <a href="https://labs.luca0n.com/projects/stairway-js" target="_blank">released</a> under the <a href="https://git.luca0n.com/Stairway-js.git/tree/LICENSE" target="_blank">GNU General Public License version 3 or later</a>, by <a href="https://www.luca0n.com" target="_blank">luca0N!</a></p>
|
||||
<p>luca0N! does not endorse all quizzes created for Stairway.js and may not own copyrights on the current quiz.</p>
|
||||
</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">
|
||||
<p class="question">Q: What operating system is installed on your main computer?</p>
|
||||
<input type="radio">Windows</input>
|
||||
<input type="radio">macOS</input>
|
||||
<input type="radio">Linux</input>
|
||||
<input type="radio">BSD</input>
|
||||
<input type="radio">Windows</input>
|
||||
</div>-->
|
||||
<hr/>
|
||||
<p>Released under the GNU General Public License version 3 or later, by <a href="https://www.luca0n.com">luca0N!</a></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
Reference in New Issue