dieter/test_dev
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add other public pages

Browse Source
This commit is contained in:
Dieter Blocher
2025-01-29 14:26:45 +00:00
parent 5146f356b6
commit bffd60bb94
13 changed files with 216 additions and 317 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
nodemon.json
View File

@@ -1,5 +1,5 @@
{ {
"watch": ["src", "src/public", "config"], "watch": ["src", "src/public", "src/views", "config"],
"ext": "js,json,html", "ext": "js,json,html,ejs",
"exec": "node ./src/server.js" "exec": "node ./src/server.js"
} }

13
src/public/4acd7872dbae41e89c548130f6dca980.html Normal file
View File

@@ -0,0 +1,13 @@
<html>
<head>
<title>Hacking Game...</title>
<link rel="stylesheet" href="/stylesheets/style.css">
</head>
<body>
<h3>Placeholder...</h3>
</body>
</html>

17
src/public/access/false/safebox.html Normal file
View File

@@ -0,0 +1,17 @@
<!DOCTYPE html>
<html>
<head>
<title>Hacking Game...</title>
<link rel="stylesheet" href="/stylesheets/style.css">
</head>
<body>
<img class="background-image" src="/pictures/background05.png">
<h3>
<span style="color: red">U</span>nlock the secu<span style="color: red">r</span>ed safe quick<span
style="color: red">l</span>y...
</h3>
</body>
</html>

18
src/public/access/true/safebox.html Normal file
View File

@@ -0,0 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<title>Hacking Game...</title>
<link rel="stylesheet" href="/stylesheets/style.css">
</head>
<body>
<img class="background-image" src="/pictures/background06.png">
<h3>Congratulations, you got the certificate!!!</h3>
<h4>
Find the hidden link to<a class="hidden_link" href="/4acd7872dbae41e89c548130f6dca980.html" target="_self"> </a>
continue...
</h4>
</body>
</html>

44
src/public/enter_school.html
View File

@@ -6,47 +6,9 @@
</head> </head>
<body> <body>
<center><img class="background-image" src="./pictures/background01.png" usemap="#no"> <img class="background-image" src="./pictures/background01.png" usemap="#no">
<h3>Enter the door...</h3><map name="no"><area shape="rect" coords="501,158,634,380" alt="Test" <h3>Enter the door...</h3><map name="no"><area shape="rect" coords="501,158,634,380" alt="Test"
href="./userpass.html"></map> href="./userpass.html"></map>
</center>
<style>
.tb_button {
padding: 1px;
cursor: pointer;
border-right: 1px solid #8b8b8b;
border-left: 1px solid #FFF;
border-bottom: 1px solid #fff;
}
.tb_button.hover {
border: 2px outset #def;
background-color: #f8f8f8 !important;
}
.ws_toolbar {
z-index: 100000
}
.ws_toolbar .ws_tb_btn {
cursor: pointer;
border: 1px solid #555;
padding: 3px
}
.tb_highlight {
background-color: yellow
}
.tb_hide {
visibility: hidden
}
.ws_toolbar img {
padding: 2px;
margin: 0px
}
</style>
</body> </body>
</html> </html>

14
src/public/index2.html
View File

@@ -1,14 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Index.html</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1>Hiidfdcvdfsdgfthjhkjhhhhk</h1>
<img src="./images/free.png">
</body>
</html>

56
src/public/math_abi.html
View File

@@ -6,16 +6,13 @@
</head> </head>
<body> <body>
<center> <form id="math-form">
<form id="math-form"> <div class="math-div"><img class="math-image" src="./pictures/background04.png"><input class="math-mask"
<div class="math-div"><img class="math-image" src="./pictures/background04.png"><input class="math-mask" type="text" id="nullstelle" name="nullstelle"><button id="abgeben-button" type="submit">Abgeben</button>
type="text" id="nullstelle" name="nullstelle"><button id="abgeben-button" <div class="hidden" id="wrong-solution">f</div>
type="submit">Abgeben</button> </div>
<div class="hidden" id="wrong-solution">f</div> <h3>Solve the task...</h3>
</div> </form>
<h3>Solve the task...</h3>
</form>
</center>
<script>checkInput = function (nullstelle) { <script>checkInput = function (nullstelle) {
nullstelle = btoa(nullstelle); nullstelle = btoa(nullstelle);
if (nullstelle == "MA==") { if (nullstelle == "MA==") {
@@ -31,7 +28,7 @@
if (checkInput(nullstelle)) { if (checkInput(nullstelle)) {
document.getElementById("wrong-solution").classList.add("hidden"); document.getElementById("wrong-solution").classList.add("hidden");
document.getElementById("wrong-solution").classList.remove("visible"); document.getElementById("wrong-solution").classList.remove("visible");
window.location.href = "/access/false/safebox"; window.location.href = "/access/false/safebox.html";
} }
else { else {
document.getElementById("nullstelle").focus(); document.getElementById("nullstelle").focus();
@@ -39,43 +36,6 @@
document.getElementById("wrong-solution").classList.add("visible"); document.getElementById("wrong-solution").classList.add("visible");
} }
});</script> });</script>
<style>
.tb_button {
padding: 1px;
cursor: pointer;
border-right: 1px solid #8b8b8b;
border-left: 1px solid #FFF;
border-bottom: 1px solid #fff;
}
.tb_button.hover {
border: 2px outset #def;
background-color: #f8f8f8 !important;
}
.ws_toolbar {
z-index: 100000
}
.ws_toolbar .ws_tb_btn {
cursor: pointer;
border: 1px solid #555;
padding: 3px
}
.tb_highlight {
background-color: yellow
}
.tb_hide {
visibility: hidden
}
.ws_toolbar img {
padding: 2px;
margin: 0px
}
</style><span id="okta-plugin-message-channel-available" style="display: none;"></span>
</body> </body>
</html> </html>

BIN
src/public/pictures/background05.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 102 KiB

BIN
src/public/pictures/background06.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 62 KiB

39
src/public/start.html
View File

@@ -6,7 +6,6 @@
</head> </head>
<body> <body>
<center>
<div class="userdata-div"><img class="background-image" src="./pictures/background00.png"> <div class="userdata-div"><img class="background-image" src="./pictures/background00.png">
<div class="typewriter" id="typewriter"><span class="type" style="--n:620">Your goal in this small hacker game is <div class="typewriter" id="typewriter"><span class="type" style="--n:620">Your goal in this small hacker game is
to enroll in university. You start as a student and all you have to do is pass your final math exam. To make to enroll in university. You start as a student and all you have to do is pass your final math exam. To make
@@ -18,44 +17,6 @@
</div><a href="/enter_school.html"> </div><a href="/enter_school.html">
<h3>Start your task and good luck...</h3> <h3>Start your task and good luck...</h3>
</a> </a>
</center>
<style>
.tb_button {
padding: 1px;
cursor: pointer;
border-right: 1px solid #8b8b8b;
border-left: 1px solid #FFF;
border-bottom: 1px solid #fff;
}
.tb_button.hover {
border: 2px outset #def;
background-color: #f8f8f8 !important;
}
.ws_toolbar {
z-index: 100000
}
.ws_toolbar .ws_tb_btn {
cursor: pointer;
border: 1px solid #555;
padding: 3px
}
.tb_highlight {
background-color: yellow
}
.tb_hide {
visibility: hidden
}
.ws_toolbar img {
padding: 2px;
margin: 0px
}
</style>
</body> </body>
</html> </html>

253
src/public/stylesheets/style.css
View File

@@ -1,30 +1,24 @@
.h3 .h3 {
{
color: white; color: white;
} }
h3:link h3:link {
{
color: white; color: white;
} }
h3:visited h3:visited {
{
color: white; color: white;
} }
h3:hover h3:hover {
{
color: white; color: white;
} }
h3:active h3:active {
{
color: white; color: white;
} }
h3:link h3:link {
{
color: white; color: white;
} }
@@ -39,21 +33,21 @@ a {
color: white; color: white;
} }
.login-div{ .login-div {
position:relative; position: relative;
display:inline-block; display: inline-block;
width:960px; width: 960px;
} }
#login-hint{ #login-hint {
position: absolute; position: absolute;
left: 220px; left: 220px;
top: 353px; top: 353px;
visibility: hidden; visibility: hidden;
} }
#login-hint-map{ #login-hint-map {
z-index: 1000; z-index: 1000;
position: absolute; position: absolute;
top: 370px; top: 370px;
@@ -62,243 +56,258 @@ a {
height: 80px; height: 80px;
} }
.login-image-div:hover{ .login-image-div:hover {
float: left; float: left;
width: 240px; width: 240px;
height: 90px; height: 90px;
background: url("/pictures/userpass/background03_5x2.png") background: url("/pictures/userpass/background03_5x2.png")
} }
.login-mask{ .login-mask {
border:none; border: none;
margin: 0; margin: 0;
padding-inline: 5px; padding-inline: 5px;
background: #212121; background: #212121;
color: #36cb09; color: #36cb09;
width:311px; width: 311px;
height: 27px; height: 27px;
} }
#login-button{ #login-button {
vertical-align: middle; vertical-align: middle;
text-align: center; text-align: center;
border: 0; border: 0;
padding-inline: 2px; padding-inline: 2px;
background: #36cb09; background: #36cb09;
color: #212121; color: #212121;
width:75px; width: 75px;
height: 33px; height: 33px;
font-weight: bold; font-weight: bold;
position: absolute; position: absolute;
left: 566px; left: 566px;
top: 301px; top: 301px;
} }
.login-mask:focus{ .login-mask:focus {
border:none; border: none;
outline: none; outline: none;
} }
.visible{ .visible {
visibility: visible; visibility: visible;
} }
.hidden{ .hidden {
visibility: hidden; visibility: hidden;
} }
#user{ #user {
position: absolute; left: 320px; top: 154px; position: absolute;
left: 320px;
top: 154px;
} }
#password{ #password {
position: absolute; left: 319px; top: 246px; position: absolute;
left: 319px;
top: 246px;
} }
#credentials-error { #credentials-error {
position: absolute; left: 315px; top: 300px; position: absolute;
left: 315px;
top: 300px;
color: #36cb09; color: #36cb09;
} }
.math-div{ .math-div {
position:relative; position: relative;
display:inline-block; display: inline-block;
width:960px; width: 960px;
} }
.math-mask{
border:none; .math-mask {
border: none;
margin: 0; margin: 0;
padding-inline: 5px; padding-inline: 5px;
background: #FFFFFF; background: #FFFFFF;
color: black; color: black;
width:144px; width: 144px;
height: 22px; height: 22px;
} }
.math-mask:focus{ .math-mask:focus {
border:none; border: none;
outline: none; outline: none;
} }
#abgeben-button{ #abgeben-button {
vertical-align: middle; vertical-align: middle;
text-align: center; text-align: center;
padding-inline: 2px; padding-inline: 2px;
background: white; background: white;
color: #212121; color: #212121;
width:75px; width: 75px;
height: 33px; height: 33px;
font-weight: bold; font-weight: bold;
position: absolute; position: absolute;
left: 529px; left: 529px;
top: 405px; top: 405px;
} }
#wrong-solution{ #wrong-solution {
position: absolute; position: absolute;
left: 613px; left: 613px;
top: 343px; top: 343px;
color: red; color: red;
font-size: xx-large; font-size: xx-large;
} }
#nullstelle{ #nullstelle {
position: absolute; left: 446px; top: 346px; position: absolute;
left: 446px;
top: 346px;
} }
.hidden_content .hidden_content {
{
color: black; color: black;
} }
.hidden_link:link .hidden_link:link {
{
color: black; color: black;
} }
.hidden_link:visited .hidden_link:visited {
{
color: black; color: black;
} }
.hidden_link:hover .hidden_link:hover {
{
color: black; color: black;
} }
.hidden_link:active .hidden_link:active {
{
color: black; color: black;
} }
.hidden_link:link .hidden_link:link {
{
color: black; color: black;
} }
.userdata-div{ .userdata-div {
position:relative; position: relative;
display:inline-block; display: inline-block;
width:960px; width: 960px;
} }
.userdata-mask .userdata-mask {
{
margin: 0; margin: 0;
padding-inline: 5px; padding-inline: 5px;
background: #FFFFFF; background: #FFFFFF;
color: black; color: black;
width:300px; width: 300px;
height: 22px; height: 22px;
} }
.userdata-submit-mask .userdata-submit-mask {
{
margin: 0; margin: 0;
padding-inline: 5px; padding-inline: 5px;
background: lightgrey; background: lightgrey;
color: black; color: black;
width:150px; width: 150px;
height: 24px; height: 24px;
} }
.userdata-lable-mask .userdata-lable-mask {
{
color: black; color: black;
font-size: small; font-size: small;
} }
#firstname_label #firstname_label {
{ position: absolute;
position: absolute; left: 300px; top: 170px; left: 300px;
top: 170px;
} }
#firstname #firstname {
{ position: absolute;
position: absolute; left: 300px; top: 200px; left: 300px;
top: 200px;
} }
#familyname_label #familyname_label {
{ position: absolute;
position: absolute; left: 300px; top: 230px; left: 300px;
top: 230px;
} }
#familyname #familyname {
{ position: absolute;
position: absolute; left: 300px; top: 260px; left: 300px;
top: 260px;
} }
#email_label #email_label {
{ position: absolute;
position: absolute; left: 300px; top: 290px; left: 300px;
top: 290px;
} }
#email #email {
{ position: absolute;
position: absolute; left: 300px; top: 320px; left: 300px;
top: 320px;
} }
#phonenumber_label #phonenumber_label {
{ position: absolute;
position: absolute; left: 300px; top: 350px; left: 300px;
top: 350px;
} }
#phonenumber #phonenumber {
{ position: absolute;
position: absolute; left: 300px; top: 380px; left: 300px;
top: 380px;
} }
#submit_data #submit_data {
{ position: absolute;
position: absolute; left: 300px; top: 440px; left: 300px;
top: 440px;
} }
#typewriter #typewriter {
{ position: absolute;
position: absolute; left: 275px; top: 50px; left: 275px;
width:410px; top: 50px;
width: 410px;
text-align: left; text-align: left;
} }
.type { .type {
font-size: 17px; font-size: 17px;
color:#0000; color: #0000;
background: background:
linear-gradient(-90deg,black 5px,#0000 0) 10px 0, linear-gradient(-90deg, black 5px, #0000 0) 10px 0,
linear-gradient(black 0 0) 0 0; linear-gradient(black 0 0) 0 0;
background-size:calc(var(--n)*1ch) 200%; background-size: calc(var(--n)*1ch) 200%;
-webkit-background-clip:padding-box,text; -webkit-background-clip: padding-box, text;
background-clip:padding-box,text; background-clip: padding-box, text;
background-repeat:no-repeat; background-repeat: no-repeat;
animation: animation:
b .2s infinite steps(1), b .2s infinite steps(1),
t calc(var(--n)*.03s) steps(var(--n)) forwards; t calc(var(--n)*.03s) steps(var(--n)) forwards;
} }
@keyframes t{ @keyframes t {
from {background-size:0 200%} from {
} background-size: 0 200%
@keyframes b{ }
50% {background-position:0 -100%,0 0}
} }
@keyframes b {
50% {
background-position: 0 -100%, 0 0
}
}

60
src/public/userpass.html
View File

@@ -6,19 +6,16 @@
</head> </head>
<body><audio src="/sounds/background-electro.mp3" autoplay="" loop=""></audio> <body><audio src="/sounds/background-electro.mp3" autoplay="" loop=""></audio>
<center> <form id="login-form">
<form id="login-form"> <div class="login-div"><img src="./pictures/background02.png"><img id="login-hint"
<div class="login-div"><img src="./pictures/background02.png"><img id="login-hint" src="./pictures/background03-cropped.png" style="visibility: hidden;">
src="./pictures/background03-cropped.png" style="visibility: hidden;"> <div id="login-hint-map"></div><input class="login-mask" type="text" name="user" id="user"
<div id="login-hint-map"></div><input class="login-mask" type="text" name="user" id="user" placeholder="Enter Username here..."><input class="login-mask" type="password" name="password"
placeholder="Enter Username here..."><input class="login-mask" type="password" name="password" id="password" placeholder="Enter Password here..."><button id="login-button" type="submit">Ok!</button>
id="password" placeholder="Enter Password here..."><button id="login-button" <div class="visible" id="credentials-error">Wrong credentials!</div>
type="submit">Ok!</button> </div>
<div class="visible" id="credentials-error">Wrong credentials!</div> <h3>Enter your credentials...</h3>
</div> </form>
<h3>Enter your credentials...</h3>
</form>
</center>
<script>checkCredentials = function (username, password) { <script>checkCredentials = function (username, password) {
username = btoa(username); username = btoa(username);
password = btoa(password); password = btoa(password);
@@ -54,43 +51,6 @@
document.getElementById("login-hint-map").addEventListener("mouseout", function (event) { document.getElementById("login-hint-map").addEventListener("mouseout", function (event) {
document.getElementById("login-hint").style.visibility = "hidden"; document.getElementById("login-hint").style.visibility = "hidden";
});</script><span id="okta-plugin-message-channel-available" style="display: none;"></span> });</script><span id="okta-plugin-message-channel-available" style="display: none;"></span>
<style>
.tb_button {
padding: 1px;
cursor: pointer;
border-right: 1px solid #8b8b8b;
border-left: 1px solid #FFF;
border-bottom: 1px solid #fff;
}
.tb_button.hover {
border: 2px outset #def;
background-color: #f8f8f8 !important;
}
.ws_toolbar {
z-index: 100000
}
.ws_toolbar .ws_tb_btn {
cursor: pointer;
border: 1px solid #555;
padding: 3px
}
.tb_highlight {
background-color: yellow
}
.tb_hide {
visibility: hidden
}
.ws_toolbar img {
padding: 2px;
margin: 0px
}
</style>
</body> </body>
</html> </html>

15
src/views/index.ejs
View File

@@ -1 +1,14 @@
<h1>Hi...</h1> <!DOCTYPE html>
<html>
<head>
<title>Home Page</title>
<link rel="stylesheet" href="/stylesheets/style.css">
</head>
<body>
<h1>Hi...</h1>
<a href="/start.html">Go to Start!!</a>
</body>
</html>