1
0
Fork 0

Adapt all templates to new templating system

master
Anonymous Contributor 2023-09-05 01:15:40 +02:00
parent 1cc4746c6a
commit 6b96f8281c
23 changed files with 413 additions and 727 deletions

View File

@ -6,14 +6,14 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>OpenSim - Kontrollzentrum - %%USERNAME%% - %%EchoTitle%%</title> <title>OpenSim - Kontrollzentrum - <?= $v['username'] ?> - <?= $v['title'] ?></title>
<link href="./style/4Creative.ico" rel="icon"> <link href="./style/4Creative.ico" rel="icon">
<link href="./style/4Creative.ico" rel="apple-touch-icon"> <link href="./style/4Creative.ico" rel="apple-touch-icon">
<link href="./style/default/css/autocomplete.css" rel="stylesheet" type="text/css"> <link href="./style/default/css/autocomplete.css" rel="stylesheet" type="text/css">
<link href="./style/default/vendor/fontawesome-free/css/all.min.css" rel="stylesheet" type="text/css"> <link href="./style/default/vendor/fontawesome-free/css/all.min.css" rel="stylesheet" type="text/css">
<link href="./style/default/vendor/datatables/dataTables.bootstrap4.css" rel="stylesheet"> <link href="./style/default/vendor/datatables/dataTables.bootstrap4.css" rel="stylesheet">
<link href="./style/default/css/sb-admin.css" rel="stylesheet"> %%echoHeader%% <link href="./style/default/css/sb-admin.css" rel="stylesheet"> <?= isset($v['custom-css']) ? $v['custom-css'] : '' ?>
</head> </head>
<body id="page-top"> <body id="page-top">
@ -26,7 +26,7 @@
<ul class="navbar-nav ml-auto ml-md-0"> <ul class="navbar-nav ml-auto ml-md-0">
<li class="nav-item dropdown no-arrow"> <li class="nav-item dropdown no-arrow">
<a class="nav-link dropdown-toggle" href="#" id="userDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">%%USERNAME%% <i class="fas fa-user-circle fa-fw"></i></a> <a class="nav-link dropdown-toggle" href="#" id="userDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><?= $v['username'] ?> <i class="fas fa-user-circle fa-fw"></i></a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="userDropdown"> <div class="dropdown-menu dropdown-menu-right" aria-labelledby="userDropdown">
<a class="dropdown-item" href="?page=profile">Profil</a> <a class="dropdown-item" href="?page=profile">Profil</a>
<div class="dropdown-divider"></div> <div class="dropdown-divider"></div>
@ -41,7 +41,7 @@
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="index.php"> <a class="nav-link" href="index.php">
<i class="fas fa-fw fa-tachometer-alt"></i> <i class="fas fa-fw fa-tachometer-alt"></i>
<span>Übersicht</span> <span>Dashboard</span>
</a> </a>
</li> </li>
@ -69,7 +69,6 @@
<span>Deine Regionen</span></a> <span>Deine Regionen</span></a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="index.php?page=groups"> <a class="nav-link" href="index.php?page=groups">
<i class="fas fa-users"></i> <i class="fas fa-users"></i>
@ -81,7 +80,7 @@
<i class="fas fa-street-view"></i> <i class="fas fa-street-view"></i>
<span>Deine Freunde</span></a> <span>Deine Freunde</span></a>
</li> </li>
<?php if ($v['admin']): ?>
<div class="nav-link" style="padding: 1.75rem 1rem 0.75rem; font-size: 0.75rem; font-weight: bold; text-transform: uppercase; color: rgba(255, 255, 255, 0.25)"> <div class="nav-link" style="padding: 1.75rem 1rem 0.75rem; font-size: 0.75rem; font-weight: bold; text-transform: uppercase; color: rgba(255, 255, 255, 0.25)">
Administration Administration
</div> </div>
@ -103,7 +102,7 @@
<i class="fas fa-globe-europe"></i> <i class="fas fa-globe-europe"></i>
<span>Regionen verwalten</span></a> <span>Regionen verwalten</span></a>
</li> </li>
<?php endif ?>
</ul> </ul>
<div id="content-wrapper"> <div id="content-wrapper">
<div class="container-fluid"> <div class="container-fluid">
@ -111,12 +110,12 @@
<li class="breadcrumb-item"> <li class="breadcrumb-item">
<a href="index.php">Gridverwaltung</a> <a href="index.php">Gridverwaltung</a>
</li> </li>
<li class="breadcrumb-item active">%%EchoTitle%%</li> <li class="breadcrumb-item active"><?= $v['title'] ?></li>
</ol> </ol>
<hr><br> <hr><br>
%%EchoInhalt%% <?php if (strlen($v['child-template']) != 0) { require $v['child-template']; } else { echo $v['child-content']; } ?>
</div> </div>
</div> </div>
</div> </div>

View File

@ -3,7 +3,7 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Fehler - MCP</title> <title><?= $v['title'] ?></title>
<link rel="stylesheet" type="text/css" href="./style/login/vendor/bootstrap/css/bootstrap.min.css"> <link rel="stylesheet" type="text/css" href="./style/login/vendor/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/fonts/font-awesome-4.7.0/css/font-awesome.min.css"> <link rel="stylesheet" type="text/css" href="./style/login/fonts/font-awesome-4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/fonts/Linearicons-Free-v1.0.0/icon-font.min.css"> <link rel="stylesheet" type="text/css" href="./style/login/fonts/Linearicons-Free-v1.0.0/icon-font.min.css">
@ -22,19 +22,7 @@
<div class="limiter"> <div class="limiter">
<div class="container-login100"> <div class="container-login100">
<div class="wrap-login100 p-t-50 p-b-90"> <div class="wrap-login100 p-t-50 p-b-90">
<div class="login100-form flex-sb flex-w"> <?php if (strlen($v['child-template']) != 0) { require $v['child-template']; } else { echo $v['child-content']; } ?>
<span class="login100-form-title p-b-51">
Fehler
</span>
<div class="flex-sb-m w-full p-t-3 p-b-24" style="color: red;">
%%MESSAGE%%
</div>
<div class="container-login100-form-btn m-t-17">
<a class="login100-form-btn" href="index.php?page=login">Zurück zum Login</a>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>

View File

@ -1,4 +1,3 @@
<div class="row"> <div class="row">
<div class="col-xl-3 col-sm-6 mb-3"> <div class="col-xl-3 col-sm-6 mb-3">
<div class="card text-white bg-primary o-hidden h-100"> <div class="card text-white bg-primary o-hidden h-100">
@ -6,7 +5,7 @@
<div class="card-body-icon"> <div class="card-body-icon">
<i class="fas fa-fw fa-door-closed"></i> <i class="fas fa-fw fa-door-closed"></i>
</div> </div>
<div class="mr-5">%%GLOBAL-USER-COUNT%%</div> <div class="mr-5"><?= $v['global-user-count'] ?></div>
</div> </div>
<span class="card-footer text-white clearfix small z-1 float-left">Benutzer / Online</span> <span class="card-footer text-white clearfix small z-1 float-left">Benutzer / Online</span>
</div> </div>
@ -25,7 +24,7 @@
<div class="card-body-icon"> <div class="card-body-icon">
<i class="fas fa-fw fa-thermometer-half"></i> <i class="fas fa-fw fa-thermometer-half"></i>
</div> </div>
<div class="mr-5">%%GLOBAL-REGION-COUNT%%</div> <div class="mr-5"><?= $v['global-region-count'] ?></div>
</div> </div>
<span class="card-footer text-white clearfix small z-1 float-left">Regionen</span> <span class="card-footer text-white clearfix small z-1 float-left">Regionen</span>
</div> </div>

View File

@ -1,135 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>OpenSim - Kontrollzentrum - %%USERNAME%% - %%EchoTitle%%</title>
<link href="./style/4Creative.ico" rel="icon">
<link href="./style/4Creative.ico" rel="apple-touch-icon">
<link href="./style/default/css/autocomplete.css" rel="stylesheet" type="text/css">
<link href="./style/default/vendor/fontawesome-free/css/all.min.css" rel="stylesheet" type="text/css">
<link href="./style/default/vendor/datatables/dataTables.bootstrap4.css" rel="stylesheet">
<link href="./style/default/css/sb-admin.css" rel="stylesheet"> %%echoHeader%%
</head>
<body id="page-top">
<nav class="navbar navbar-expand navbar-dark bg-dark static-top">
<button class="btn btn-link btn-sm text-white order-1 order-sm-0" id="sidebarToggle" href="#">
<i class="fas fa-bars"></i>
</button>
<div class="d-none d-md-inline-block form-inline ml-auto mr-0 mr-md-3 my-2 my-md-0"></div>
<ul class="navbar-nav ml-auto ml-md-0">
<li class="nav-item dropdown no-arrow">
<a class="nav-link dropdown-toggle" href="#" id="userDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">%%USERNAME%% <i class="fas fa-user-circle fa-fw"></i></a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="userDropdown">
<a class="dropdown-item" href="?page=profile">Profil</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#" data-toggle="modal" data-target="#logoutModal">Logout</a>
</div>
</li>
</ul>
</nav>
<div id="wrapper">
<ul class="sidebar navbar-nav">
<li class="nav-item">
<a class="nav-link" href="index.php">
<i class="fas fa-fw fa-tachometer-alt"></i>
<span>Dashboard</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="index.php?page=profile">
<i class="far fa-address-card"></i>
<span>Profil</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="index.php?page=identities">
<i class="fas fa-fingerprint"></i>
<span>Identität</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="index.php?page=user-online-state">
<i class="fas fa-link"></i>
<span>Online Anzeige</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="index.php?page=regions">
<i class="fas fa-globe-europe"></i>
<span>Deine Regionen</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="index.php?page=groups">
<i class="fas fa-users"></i>
<span>Deine Gruppen</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="index.php?page=friends">
<i class="fas fa-users"></i>
<span>Deine Freunde</span></a>
</li>
</ul>
<div id="content-wrapper">
<div class="container-fluid">
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="index.php">Gridverwaltung</a>
</li>
<li class="breadcrumb-item active">%%EchoTitle%%</li>
</ol>
<hr><br>
%%EchoInhalt%%
</div>
</div>
</div>
<div class="modal fade" id="logoutModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Bist du sicher?</h5>
<button class="close" type="button" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">Wähle 'Logout' wenn du dich wirklich abmelden möchtest.</div>
<div class="modal-footer">
<button class="btn btn-secondary" type="button" data-dismiss="modal">Abbrechen</button>
<a class="btn btn-primary" href="index.php?logout=1">Logout</a>
</div>
</div>
</div>
</div>
<script src="./style/default/vendor/jquery/jquery.min.js"></script>
<script src="./style/default/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="./style/default/vendor/jquery-easing/jquery.easing.min.js"></script>
<script src="./style/default/vendor/chart.js/Chart.min.js"></script>
<script src="./style/default/vendor/datatables/jquery.dataTables.js"></script>
<script src="./style/default/vendor/datatables/dataTables.bootstrap4.js"></script>
<script src="./style/default/js/sb-admin.min.js"></script>
<script src="./style/default/js/demo/datatables-demo.js"></script>
<script src="./style/default/js/demo/chart-area-demo.js"></script>
</body>
</html>

View File

@ -1 +0,0 @@
%%REGION-LIST%%

13
templates/error.php Normal file
View File

@ -0,0 +1,13 @@
<div class="login100-form flex-sb flex-w">
<span class="login100-form-title p-b-51">
Fehler
</span>
<div class="flex-sb-m w-full p-t-3 p-b-24" style="color: red;">
<?= $v['error-message'] ?>
</div>
<div class="container-login100-form-btn m-t-17">
<a class="login100-form-btn" href="index.php?page=login">Zurück zum Login</a>
</div>
</div>

View File

@ -1,65 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Passwort vergessen</title>
<link rel="stylesheet" type="text/css" href="./style/login/vendor/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/fonts/font-awesome-4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/fonts/Linearicons-Free-v1.0.0/icon-font.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/vendor/animate/animate.css">
<link rel="stylesheet" type="text/css" href="./style/login/vendor/css-hamburgers/hamburgers.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/vendor/animsition/css/animsition.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/vendor/select2/select2.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/vendor/daterangepicker/daterangepicker.css">
<link rel="stylesheet" type="text/css" href="./style/login/css/util.css">
<link rel="stylesheet" type="text/css" href="./style/login/css/main.css">
<link href="./style/4Creative.ico" rel="icon">
<link href="./style/4Creative.ico" rel="apple-touch-icon">
</head>
<body>
<div class="limiter">
<div class="container-login100">
<div class="wrap-login100 p-t-50 p-b-90">
<form class="login100-form validate-form flex-sb flex-w" action="index.php?page=forgot" method="post">
<span class="login100-form-title p-b-51">
Passwort vergessen
</span>
<div class="flex-sb-m w-full p-t-3 p-b-24" style="color: %%MESSAGECOLOR%%;">
%%MESSAGE%%
</div>
<div class="wrap-input100 validate-input m-b-16" data-validate="Bitte gebe deinen Benutzernamen an.">
<input class="input100" type="text" name="username" placeholder="Benutzername">
<span class="focus-input100"></span>
</div>
<div class="wrap-input100 validate-input m-b-16" data-validate="Bitte gebe deine E-Mail-Adresse ein.">
<input class="input100" type="email" name="email" placeholder="E-Mail">
<span class="focus-input100"></span>
</div>
<div class="container-login100-form-btn m-t-17">
%%CSRF%%
<button class="login100-form-btn" name="forgot-request">
Absenden
</button>
</div>
</form>
</div>
</div>
</div>
<script src="./style/login/vendor/jquery/jquery-3.2.1.min.js"></script>
<script src="./style/login/vendor/animsition/js/animsition.min.js"></script>
<script src="./style/login/vendor/bootstrap/js/popper.js"></script>
<script src="./style/login/vendor/bootstrap/js/bootstrap.min.js"></script>
<script src="./style/login/vendor/select2/select2.min.js"></script>
<script src="./style/login/vendor/daterangepicker/moment.min.js"></script>
<script src="./style/login/vendor/daterangepicker/daterangepicker.js"></script>
<script src="./style/login/vendor/countdowntime/countdowntime.js"></script>
<script src="./style/login/js/main.js"></script>
</body>
</html>

26
templates/forgot.php Normal file
View File

@ -0,0 +1,26 @@
<form class="login100-form validate-form flex-sb flex-w" action="index.php?page=forgot" method="post">
<span class="login100-form-title p-b-51">
Passwort vergessen
</span>
<div class="flex-sb-m w-full p-t-3 p-b-24" style="color: <?= $v['message-color'] ?>;">
<?= $v['message'] ?>
</div>
<div class="wrap-input100 validate-input m-b-16" data-validate="Bitte gebe deinen Benutzernamen an.">
<input class="input100" type="text" name="username" placeholder="Benutzername">
<span class="focus-input100"></span>
</div>
<div class="wrap-input100 validate-input m-b-16" data-validate="Bitte gebe deine E-Mail-Adresse ein.">
<input class="input100" type="email" name="email" placeholder="E-Mail">
<span class="focus-input100"></span>
</div>
<div class="container-login100-form-btn m-t-17">
<?= $v['csrf'] ?>
<button class="login100-form-btn" name="forgot-request">
Absenden
</button>
</div>
</form>

View File

@ -5,14 +5,12 @@
Nach der Änderung musst du dich neu anmelden.<br> Nach der Änderung musst du dich neu anmelden.<br>
</div> </div>
<br>%%MESSAGE%%<br> <br><?= $v['message'] ?><br>
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row">
<div class="col-md-6"> <div class="col-md-6">
%%IDENT-LIST%% <?= $v['ident-list'] ?>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<div style="width: 400px; margin: auto; left: 50%;"> <div style="width: 400px; margin: auto; left: 50%;">
@ -30,7 +28,7 @@
<div class="row" style="margin-top: 15px;"> <div class="row" style="margin-top: 15px;">
<div class="col"> <div class="col">
%%CSRF%% <?= $v['csrf'] ?>
<button type="submit" name="createIdent" class="btn btn-primary btn-lg">Erstelle Identität</button> <button type="submit" name="createIdent" class="btn btn-primary btn-lg">Erstelle Identität</button>
</div> </div>
</div> </div>

View File

@ -1,24 +0,0 @@
<div style="width: 400px; margin: auto; left: 50%;">
Hier kannst du einen Invite-Link erstellen.<br>
Jeder, der solch einen Link bekommt, kann sich im Grid registrieren.
Der Link ist einzigartig und funktioniert nur einmalig.<br>
Nach Aufrufen des Links muss ein Name, Passwort und Standardavatar ausgewählt werden.
</div>
<div style="width: 400px; margin: auto; left: 50%;">
<form action="index.php?page=invite" method="post">
<div class="row" style="margin-top: 15px;">
<div class="col">
<label for="linkOutput">Invite-Link:</label>
<input type="text" class="form-control" id="linkOutput" name="formLink" value="%%link%%">
</div>
</div>
<div class="row" style="margin-top: 15px;">
<div class="col">
%%CSRF%%
<button type="submit" name="generateLink" class="btn btn-primary btn-lg">Link Generieren</button>
</div>
</div>
</form>
</div>

View File

@ -1,77 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Login</title>
<link rel="stylesheet" type="text/css" href="./style/login/vendor/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/fonts/font-awesome-4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/fonts/Linearicons-Free-v1.0.0/icon-font.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/vendor/animate/animate.css">
<link rel="stylesheet" type="text/css" href="./style/login/vendor/css-hamburgers/hamburgers.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/vendor/animsition/css/animsition.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/vendor/select2/select2.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/vendor/daterangepicker/daterangepicker.css">
<link rel="stylesheet" type="text/css" href="./style/login/css/util.css">
<link rel="stylesheet" type="text/css" href="./style/login/css/main.css">
<link href="./style/4Creative.ico" rel="icon">
<link href="./style/4Creative.ico" rel="apple-touch-icon">
</head>
<body>
<div class="limiter">
<div class="container-login100">
<div class="wrap-login100 p-t-50 p-b-90">
<form class="login100-form validate-form flex-sb flex-w" action="index.php?page=login" method="post">
<span class="login100-form-title p-b-51">
Login
</span>
<div class="flex-sb-m w-full p-t-3 p-b-24" style="color: %%MESSAGECOLOR%%;">
%%LOGINMESSAGE%%
</div>
<div class="wrap-input100 validate-input m-b-16" data-validate="Bitte gebe dein Benutzernamen an.">
<input class="input100" type="text" name="username" value="%%LASTUSERNAME%%" placeholder="Benutzername">
<span class="focus-input100"></span>
</div>
<div class="wrap-input100 validate-input m-b-16" data-validate="Bitte gebe dein Passwort ein.">
<input class="input100" type="password" name="password" placeholder="Passwort">
<span class="focus-input100"></span>
</div>
<div class="flex-sb-m w-full p-t-3 p-b-24">
<div>
</div>
<div>
<a href="index.php?page=forgot" class="txt1">Passwort vergessen?</a>
</div>
</div>
<div class="container-login100-form-btn m-t-17">
%%CSRF%%
<button class="login100-form-btn" name="login">
Anmelden
</button>
</div>
</form>
</div>
</div>
</div>
<div id="dropDownSelect1"></div>
<script src="./style/login/vendor/jquery/jquery-3.2.1.min.js"></script>
<script src="./style/login/vendor/animsition/js/animsition.min.js"></script>
<script src="./style/login/vendor/bootstrap/js/popper.js"></script>
<script src="./style/login/vendor/bootstrap/js/bootstrap.min.js"></script>
<script src="./style/login/vendor/select2/select2.min.js"></script>
<script src="./style/login/vendor/daterangepicker/moment.min.js"></script>
<script src="./style/login/vendor/daterangepicker/daterangepicker.js"></script>
<script src="./style/login/vendor/countdowntime/countdowntime.js"></script>
<script src="./style/login/js/main.js"></script>
</body>
</html>

36
templates/login.php Normal file
View File

@ -0,0 +1,36 @@
<form class="login100-form validate-form flex-sb flex-w" action="index.php?page=login" method="post">
<span class="login100-form-title p-b-51">
Login
</span>
<div class="flex-sb-m w-full p-t-3 p-b-24" style="color: <?= $v['message-color'] ?>;">
<?= $v['message'] ?>
</div>
<div class="wrap-input100 validate-input m-b-16" data-validate="Bitte gebe dein Benutzernamen an.">
<input class="input100" type="text" name="username" value="<?= $v['last-username'] ?>" placeholder="Benutzername">
<span class="focus-input100"></span>
</div>
<div class="wrap-input100 validate-input m-b-16" data-validate="Bitte gebe dein Passwort ein.">
<input class="input100" type="password" name="password" placeholder="Passwort">
<span class="focus-input100"></span>
</div>
<div class="flex-sb-m w-full p-t-3 p-b-24">
<div>
</div>
<div>
<a href="index.php?page=forgot" class="txt1">Passwort vergessen?</a>
</div>
</div>
<div class="container-login100-form-btn m-t-17">
<?= $v['csrf'] ?>
<button class="login100-form-btn" name="login">
Anmelden
</button>
</div>
</form>

View File

@ -24,14 +24,14 @@
</style> </style>
</head> </head>
<body> <body>
<span class="preheader" style="display: none">%%PREHEADER%%</span> <span class="preheader" style="display: none"><?= $v['preheader'] ?></span>
<div class="container" style="background-color: #afafaf"> <div class="container" style="background-color: #afafaf">
<div class="header" style="background-color: #434343; height: 64px"> <div class="header" style="background-color: #434343; height: 64px">
<img style="vertical-align: middle; height: 100%" src="https://4creative.net/images/4Creative-Logo-neu.png" alt="Logo"> <img style="vertical-align: middle; height: 100%" src="https://4creative.net/images/4Creative-Logo-neu.png" alt="Logo">
<h2 style="vertical-align: middle; color: #fff; font-weight: bold; margin: 0 0 0 10px; display: inline">%%EchoTitle%%</h2> <h2 style="vertical-align: middle; color: #fff; font-weight: bold; margin: 0 0 0 10px; display: inline"><?= $v['title'] ?></h2>
</div> </div>
<div class="content" style="background-color: #fff; padding: 2px"> <div class="content" style="background-color: #fff; padding: 2px">
%%MESSAGE%% <?= $v['message'] ?>
</div> </div>
</div> </div>
</body> </body>

View File

@ -1 +0,0 @@
%%ONLINE-LIST%%

View File

@ -0,0 +1,10 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>Benutzer online</title>
<meta http-equiv="refresh" content="15">
</head>
<body style="background-image: url('./style/images/fabric-pattern.png')">
<?= $v['online-users'] ?>
</body>
</html>

View File

@ -1,4 +1,4 @@
<center>%%INFOMESSAGE%%</center> <center><?= $v['message'] ?></center>
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row">
@ -8,23 +8,23 @@
<div class="row"> <div class="row">
<div class="col"> <div class="col">
<label for="inputVorname">Vorname</label> <label for="inputVorname">Vorname</label>
<input type="text" class="form-control" id="inputVorname" name="formInputFeldVorname" placeholder="%%firstname%%"> <input type="text" class="form-control" id="inputVorname" name="formInputFeldVorname" placeholder="<?= $v['firstname'] ?>">
</div> </div>
<div class="col"> <div class="col">
<label for="inputNachname">Nachname</label> <label for="inputNachname">Nachname</label>
<input type="text" class="form-control" id="inputNachname" name="formInputFeldNachname" placeholder="%%lastname%%"> <input type="text" class="form-control" id="inputNachname" name="formInputFeldNachname" placeholder="<?= $v['lastname'] ?>">
</div> </div>
</div> </div>
<div class="row" style="margin-top: 15px;"> <div class="row" style="margin-top: 15px;">
<div class="col"> <div class="col">
<label for="inputVorname">E-Mail</label> <label for="inputVorname">E-Mail</label>
<input type="text" class="form-control" id="inputEmail" name="formInputFeldEMail" placeholder="%%email%%"> <input type="text" class="form-control" id="inputEmail" name="formInputFeldEMail" placeholder="<?= $v['email'] ?>">
</div> </div>
</div> </div>
<div class="form-group" style="margin-top: 15px;"> <div class="form-group" style="margin-top: 15px;">
<div class="form-check"> <div class="form-check">
<input class="form-check-input" name="formInputFeldOfflineIM" type="checkbox" id="gridCheck"%%offlineIMSTATE%%> <input class="form-check-input" name="formInputFeldOfflineIM" type="checkbox" id="gridCheck"<?= $v['offline-im-state'] ?>>
<label class="form-check-label" for="gridCheck"> Offline IM</label> <label class="form-check-label" for="gridCheck"> Offline IM</label>
</div> </div>
</div> </div>
@ -38,7 +38,7 @@
<div class="row" style="margin-top: 15px;"> <div class="row" style="margin-top: 15px;">
<div class="col"> <div class="col">
<label for="dropdownPartner">Partner</label> <label for="dropdownPartner">Partner</label>
<input type="text" class="form-control" name="formInputFeldPartnerName" id="inputpartner" placeholder="%%partner%%"> <input type="text" class="form-control" name="formInputFeldPartnerName" id="inputpartner" placeholder="<?= $v['partner'] ?>">
</div> </div>
</div> </div>
@ -50,7 +50,7 @@
<div class="row" style="margin-top: 15px;"> <div class="row" style="margin-top: 15px;">
<div class="col"> <div class="col">
%%CSRF%% <?= $v['csrf'] ?>
<button type="submit" name="saveProfileData" class="btn btn-primary btn-lg">Speichern</button> <button type="submit" name="saveProfileData" class="btn btn-primary btn-lg">Speichern</button>
</div> </div>
</div> </div>
@ -85,7 +85,7 @@
<div class="row" style="margin-top: 15px;"> <div class="row" style="margin-top: 15px;">
<div class="col"> <div class="col">
%%CSRF%% <?= $v['csrf'] ?>
<center><button type="submit" name="savePassword" class="btn btn-primary btn-lg">Speichern</button></center> <center><button type="submit" name="savePassword" class="btn btn-primary btn-lg">Speichern</button></center>
</div> </div>
</div> </div>
@ -98,15 +98,15 @@
</div> </div>
<p class="lead"><b>IAR Sicherung</b></p> <p class="lead"><b>IAR Sicherung</b></p>
<center>%%IARINFOMESSAGE%%</center> <center><?= $v['iar-message'] ?></center>
Hier kannst du eine IAR deines Inventars erstellen.<br> Hier kannst du eine IAR deines Inventars erstellen.<br>
Dies wird einige Zeit dauern. Du bekommst eine PM mit einem Downloadlink sobald deine IAR fertig erstellt wurde. Dies wird einige Zeit dauern. Du bekommst eine PM mit einem Downloadlink sobald deine IAR fertig erstellt wurde.
<form action="index.php?page=profile" method="post"> <form action="index.php?page=profile" method="post">
<div class="row" style="margin-top: 15px;"> <div class="row" style="margin-top: 15px;">
<div class="col"> <div class="col">
%%CSRF%% <?= $v['csrf'] ?>
<center><button type="submit" name="createIAR" class="btn btn-primary btn-lg" %%IARBUTTONSTATE%%>IAR erstellen</button></center> <center><button type="submit" name="createIAR" class="btn btn-primary btn-lg" <?= $v['iar-button-state'] ?>>IAR erstellen</button></center>
</div> </div>
</div> </div>
</form> </form>
@ -136,7 +136,7 @@
</div> </div>
<div class="row"> <div class="row">
<div class="col"> <div class="col">
%%CSRF%% <?= $v['csrf'] ?>
<center><button type="submit" name="deleteAccount" class="btn btn-danger btn-lg">Account löschen</button></center> <center><button type="submit" name="deleteAccount" class="btn btn-danger btn-lg">Account löschen</button></center>
</div> </div>
</div> </div>
@ -148,7 +148,7 @@
<script> <script>
var countries = [%%listAllResidentsAsJSArray%%]; var countries = [<?= $v['residents-js-array'] ?>];
function autocomplete(inp, arr) { function autocomplete(inp, arr) {
/*the autocomplete function takes two arguments, /*the autocomplete function takes two arguments,

View File

@ -1,88 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Registrieren</title>
<link rel="stylesheet" type="text/css" href="./style/login/vendor/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/fonts/font-awesome-4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/fonts/Linearicons-Free-v1.0.0/icon-font.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/vendor/animate/animate.css">
<link rel="stylesheet" type="text/css" href="./style/login/vendor/css-hamburgers/hamburgers.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/vendor/animsition/css/animsition.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/vendor/select2/select2.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/vendor/daterangepicker/daterangepicker.css">
<link rel="stylesheet" type="text/css" href="./style/login/css/util.css">
<link rel="stylesheet" type="text/css" href="./style/login/css/main.css">
<link href="./style/4Creative.ico" rel="icon">
<link href="./style/4Creative.ico" rel="apple-touch-icon">
</head>
<body>
<div class="limiter">
<div class="container-login100">
<div class="wrap-login100 p-t-50 p-b-90">
<form class="login100-form validate-form flex-sb flex-w" action="index.php?page=register" method="post">
<span class="login100-form-title p-b-51">
Registrieren
</span>
<div class="flex-sb-m w-full p-t-3 p-b-24" style="color: red;">
%%MESSAGE%%
</div>
<div class="wrap-input100 validate-input m-b-16" data-validate="Bitte gebe dein Benutzernamen an.">
<input class="input100" type="text" name="username" placeholder="Benutzername">
<span class="focus-input100"></span>
</div>
<div class="wrap-input100 validate-input m-b-16" data-validate="Bitte gebe dein Passwort ein.">
<input class="input100" type="password" name="password" placeholder="Passwort">
<span class="focus-input100"></span>
</div>
<div class="wrap-input100 validate-input m-b-16" data-validate="Bitte gebe deine E-Mail ein.">
<input class="input100" type="text" name="email" placeholder="E-Mail">
<span class="focus-input100"></span>
</div>
<div class="flex-sb-m w-full p-t-3 p-b-24"">
Wähle deinen Standardavatar aus:
</div>
<div class="wrap-input100 validate-input m-b-16" data-validate="Bitte wähle einen Standardavatar aus.">
<select class="input100" name="avatar">
<option value="Twinster Kid">♀ - Twinster Kid</option>
</select>
</div>
<div class="wrap-input100" data-validate="Bitte gebe deine E-Mail ein.">
<input type="checkbox" name="tos"> Ich habe die <a href="%%tosURL%%" target="_blank">Nutzungsbedingungen</a> gelesen.
<span class="focus-input100"></span>
</div>
<div class="container-login100-form-btn m-t-17">
%%CSRF%%
<input type="hidden" name="code" value="%%INVCODE%%">
<button class="login100-form-btn" name="doRegister">
Registrieren
</button>
</div>
</form>
</div>
</div>
</div>
<div id="dropDownSelect1"></div>
<script src="./style/login/vendor/jquery/jquery-3.2.1.min.js"></script>
<script src="./style/login/vendor/animsition/js/animsition.min.js"></script>
<script src="./style/login/vendor/bootstrap/js/popper.js"></script>
<script src="./style/login/vendor/bootstrap/js/bootstrap.min.js"></script>
<script src="./style/login/vendor/select2/select2.min.js"></script>
<script src="./style/login/vendor/daterangepicker/moment.min.js"></script>
<script src="./style/login/vendor/daterangepicker/daterangepicker.js"></script>
<script src="./style/login/vendor/countdowntime/countdowntime.js"></script>
<script src="./style/login/js/main.js"></script>
</body>
</html>

47
templates/register.php Normal file
View File

@ -0,0 +1,47 @@
<form class="login100-form validate-form flex-sb flex-w" action="index.php?page=register" method="post">
<span class="login100-form-title p-b-51">
Registrieren
</span>
<div class="flex-sb-m w-full p-t-3 p-b-24" style="color: red;">
<?= $v['message'] ?>
</div>
<div class="wrap-input100 validate-input m-b-16" data-validate="Bitte gebe dein Benutzernamen an.">
<input class="input100" type="text" name="username" placeholder="Benutzername">
<span class="focus-input100"></span>
</div>
<div class="wrap-input100 validate-input m-b-16" data-validate="Bitte gebe dein Passwort ein.">
<input class="input100" type="password" name="password" placeholder="Passwort">
<span class="focus-input100"></span>
</div>
<div class="wrap-input100 validate-input m-b-16" data-validate="Bitte gebe deine E-Mail ein.">
<input class="input100" type="text" name="email" placeholder="E-Mail">
<span class="focus-input100"></span>
</div>
<div class="flex-sb-m w-full p-t-3 p-b-24">
Wähle deinen Standardavatar aus:
</div>
<div class="wrap-input100 validate-input m-b-16" data-validate="Bitte wähle einen Standardavatar aus.">
<select class="input100" name="avatar">
<option value="Twinster Kid"> - Twinster Kid</option>
</select>
</div>
<div class="wrap-input100" data-validate="Bitte gebe deine E-Mail ein.">
<input type="checkbox" name="tos"> Ich habe die <a href="<?= $v['tos-url'] ?>" target="_blank">Nutzungsbedingungen</a> gelesen.
<span class="focus-input100"></span>
</div>
<div class="container-login100-form-btn m-t-17">
<?= $v['csrf'] ?>
<input type="hidden" name="code" value="<?= $v['invcode'] ?>">
<button class="login100-form-btn" name="doRegister">
Registrieren
</button>
</div>
</form>

View File

@ -1,66 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Neues Passwort festlegen</title>
<link rel="stylesheet" type="text/css" href="./style/login/vendor/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/fonts/font-awesome-4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/fonts/Linearicons-Free-v1.0.0/icon-font.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/vendor/animate/animate.css">
<link rel="stylesheet" type="text/css" href="./style/login/vendor/css-hamburgers/hamburgers.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/vendor/animsition/css/animsition.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/vendor/select2/select2.min.css">
<link rel="stylesheet" type="text/css" href="./style/login/vendor/daterangepicker/daterangepicker.css">
<link rel="stylesheet" type="text/css" href="./style/login/css/util.css">
<link rel="stylesheet" type="text/css" href="./style/login/css/main.css">
<link href="./style/4Creative.ico" rel="icon">
<link href="./style/4Creative.ico" rel="apple-touch-icon">
</head>
<body>
<div class="limiter">
<div class="container-login100">
<div class="wrap-login100 p-t-50 p-b-90">
<form class="login100-form validate-form flex-sb flex-w" action="index.php?page=reset-password&token=%%RESET_TOKEN%%" method="post">
<span class="login100-form-title p-b-51">
Neues Passwort festlegen
</span>
<div class="flex-sb-m w-full p-t-3 p-b-24" style="color: red;">
%%MESSAGE%%
</div>
<div class="wrap-input100 validate-input m-b-16" data-validate="Bitte gib dein neues Passwort ein">
<input class="input100" type="password" name="password" placeholder="Passwort">
<span class="focus-input100"></span>
</div>
<div class="wrap-input100 validate-input m-b-16" data-validate="Bitte gib das Passwort erneut ein">
<input class="input100" type="password" name="passwordRepeat" placeholder="Passwort wiederholen">
<span class="focus-input100"></span>
</div>
<div class="container-login100-form-btn m-t-17">
%%CSRF%%
<input type="hidden" name="resetToken" value="%%RESET_TOKEN%%">
<button class="login100-form-btn" name="reset-password">
Passwort ändern
</button>
</div>
</form>
</div>
</div>
</div>
<script src="./style/login/vendor/jquery/jquery-3.2.1.min.js"></script>
<script src="./style/login/vendor/animsition/js/animsition.min.js"></script>
<script src="./style/login/vendor/bootstrap/js/popper.js"></script>
<script src="./style/login/vendor/bootstrap/js/bootstrap.min.js"></script>
<script src="./style/login/vendor/select2/select2.min.js"></script>
<script src="./style/login/vendor/daterangepicker/moment.min.js"></script>
<script src="./style/login/vendor/daterangepicker/daterangepicker.js"></script>
<script src="./style/login/vendor/countdowntime/countdowntime.js"></script>
<script src="./style/login/js/main.js"></script>
</body>
</html>

View File

@ -0,0 +1,27 @@
<form class="login100-form validate-form flex-sb flex-w" action="index.php?page=reset-password&token=<?= $v['reset-token'] ?>" method="post">
<span class="login100-form-title p-b-51">
Neues Passwort festlegen
</span>
<div class="flex-sb-m w-full p-t-3 p-b-24" style="color: red;">
<?= $v['message'] ?>
</div>
<div class="wrap-input100 validate-input m-b-16" data-validate="Bitte gib dein neues Passwort ein">
<input class="input100" type="password" name="password" placeholder="Passwort">
<span class="focus-input100"></span>
</div>
<div class="wrap-input100 validate-input m-b-16" data-validate="Bitte gib das Passwort erneut ein">
<input class="input100" type="password" name="passwordRepeat" placeholder="Passwort wiederholen">
<span class="focus-input100"></span>
</div>
<div class="container-login100-form-btn m-t-17">
<?= $v['csrf'] ?>
<input type="hidden" name="resetToken" value="<?= $v['reset-token'] ?>">
<button class="login100-form-btn" name="reset-password">
Passwort ändern
</button>
</div>
</form>

View File

@ -1,8 +1,8 @@
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row">
<div class="col-md-6"> <div class="col-md-6">
%%MESSAGE%% <?= strlen($v['message']) == 0 ? '' : '<div class="alert alert-danger" role="alert">'.$v['message'].'</div>'?>
%%USER-LIST%% <?= $v['user-list'] ?>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<div style="width: 400px; margin: auto; left: 50%;"> <div style="width: 400px; margin: auto; left: 50%;">
@ -17,13 +17,13 @@
<div class="row" style="margin-top: 15px;"> <div class="row" style="margin-top: 15px;">
<div class="col"> <div class="col">
<label for="linkOutput">Invite-Link:</label> <label for="linkOutput">Invite-Link:</label>
<input type="text" class="form-control" id="linkOutput" name="formLink" value="%%link%%"> <input type="text" class="form-control" id="linkOutput" name="formLink" value="<?= $v['invite-link'] ?>">
</div> </div>
</div> </div>
<div class="row" style="margin-top: 15px;"> <div class="row" style="margin-top: 15px;">
<div class="col"> <div class="col">
%%CSRF%% <?= $v['csrf'] ?>
<button type="submit" name="generateLink" class="btn btn-primary btn-lg">Link Generieren</button> <button type="submit" name="generateLink" class="btn btn-primary btn-lg">Link Generieren</button>
</div> </div>
</div> </div>

View File

@ -1,202 +0,0 @@
<html>
<head>
<style>
body {
background-color: rgb(0, 0, 0);
width: 100%;
height: 100%;
overflow: hidden;
font-family: 'Arial';
font-size: 11px;
padding: 0;
margin: 0;
}
.InfoBox {
width: 300px;
height: auto;
background: rgba(0, 0, 0, 0.85);
color: rgb(220, 220, 220);
padding: 10px;
}
.InfoBox a {
color: rgb(220, 220, 220);
text-decoration: underline;
}
.InfoBox a:hover {
color: rgb(255, 255, 255);
text-decoration: underline;
}
.InfoBoxTitle {
width: 100%;
height: auto;
padding: 0;
padding-bottom: 5px;
margin-bottom: 5px;
border: 0px dashed rgb(128, 128, 128);
border-bottom-width: 1px;
color: rgb(220, 220, 220);
font-weight: bold;
font-size: 14px;
}
.GridLogo {
position: absolute;
top: 50px;
left: 50px;
border: 0;
}
.ScrollBar::-webkit-scrollbar {
width: 3px;
}
.ScrollBar::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}
.ScrollBar::-webkit-scrollbar-thumb {
background: rgba(38, 38, 38, 0.9);
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
}
</style>
</head>
<body>
<img src='' style='border: 0; display: block; opacity; 0; position: absolute;' id='Image1' />
<img src='' style='border: 0; display: block; opacity: 0; position: absolute;' id='Image2' />
<script type='text/javascript'>
var Images = %%JSONIMAGEARRAY%%;
var MakeAnimation = true;
var CurrentIndex = 2;
var CurrentImage = -1;
var ImageTimeout = 0;
var CurrentImageTranslation = -1;
var ImagePositions = [{'x': -50, 'y': -50, 'px': 1, 'py': 1},
{'x': -50, 'y': -50, 'px': 1, 'py': 1}];
document.getElementById('Image1').onload = function() {
if (MakeAnimation)
{
this.style.width = (window.innerWidth + 100) + 'px';
if (this.offsetHeight < window.innerHeight + 100)
{
this.style.width = null;
this.style.height = (window.innerHeight + 100) + 'px';
}
ImagePositions[0].x = -50;
ImagePositions[0].y = -50;
}
else
{
this.style.width = window.innerWidth + 'px';
if (this.offsetHeight < window.innerHeight)
{
this.style.width = null;
this.style.height = window.innerHeight + 'px';
}
ImagePositions[0].x = 0;
ImagePositions[0].y = 0;
}
CurrentImageTranslation = 0;
};
document.getElementById('Image2').onload = function() {
if (MakeAnimation)
{
this.style.width = (window.innerWidth + 100) + 'px';
if (this.offsetHeight < window.innerHeight + 100)
{
this.style.width = null;
this.style.height = (window.innerHeight + 100) + 'px';
}
ImagePositions[1].x = -50;
ImagePositions[1].y = -50;
}
else
{
this.style.width = window.innerWidth + 'px';
if (this.offsetHeight < window.innerHeight)
{
this.style.width = null;
this.style.height = window.innerHeight + 'px';
}
ImagePositions[0].x = 0;
ImagePositions[0].y = 0;
}
CurrentImageTranslation = 0;
};
window.setInterval(function() {
ImageTimeout = ImageTimeout - 1;
if (ImageTimeout <= 0)
{
ImageTimeout = 10;
CurrentImage = CurrentImage + 1;
if (CurrentImage >= Images.length)
{CurrentImage = 0;}
if (CurrentIndex == 1)
{CurrentIndex = 2;}
else
{CurrentIndex = 1;}
document.getElementById('Image' + CurrentIndex).style.width = null;
document.getElementById('Image' + CurrentIndex).style.height = null;
document.getElementById('Image' + CurrentIndex).src = Images[CurrentImage];
}
}, 1000);
window.setInterval(function() {
if (MakeAnimation)
{
for (var i = 0; i < 2; ++i)
{
ImagePositions[i].x = ImagePositions[i].x + ImagePositions[i].px;
ImagePositions[i].y = ImagePositions[i].y + ImagePositions[i].py;
var OffWidth = document.getElementById('Image' + (i + 1)).offsetWidth;
var OffHeight = document.getElementById('Image' + (i + 1)).offsetHeight;
if (ImagePositions[i].x >= 0 || ImagePositions[i].x + OffWidth <= window.innerWidth)
{ImagePositions[i].px = -ImagePositions[i].px;}
if (ImagePositions[i].y >= 0 || ImagePositions[i].y + OffHeight <= window.innerHeight)
{ImagePositions[i].py = -ImagePositions[i].py;}
document.getElementById('Image' + (i + 1)).style.left = ImagePositions[i].x + 'px';
document.getElementById('Image' + (i + 1)).style.top = ImagePositions[i].y + 'px';
}
}
if (CurrentImageTranslation > -1)
{
var DoReset = false;
CurrentImageTranslation = CurrentImageTranslation + 0.025;
if (CurrentImageTranslation >= 1.0)
{
CurrentImageTranslation = 1.0;
DoReset = true;
}
if (CurrentIndex == 1)
{
document.getElementById('Image1').style.opacity = CurrentImageTranslation;
document.getElementById('Image2').style.opacity = 1 - CurrentImageTranslation;
}
else
{
document.getElementById('Image2').style.opacity = CurrentImageTranslation;
document.getElementById('Image1').style.opacity = 1 - CurrentImageTranslation;
}
if (DoReset)
{CurrentImageTranslation = -1;}
}
}, 50);
</script>
<div class='InfoBox' style='position: absolute; right: 50px; top: 50px;'>
<div class='InfoBoxTitle'>%%GRIDNAME%%</div>
Willkommen<br />
Bitte melde dich an, um %%GRIDNAME%% zu betreten.<br />
<br />
%%SHOWNEWS%%
</div>
<div class='InfoBox' style='position: absolute; left: 50px; bottom: 50px;'>
<div class='InfoBoxTitle'>
Status: <span style='color: rgb(0, 255, 0);'>Online</span>
</div>
%%SHOWSTATS%%
</div>
</body>
</html>

View File

@ -0,0 +1,202 @@
<html>
<head>
<style>
body {
background-color: rgb(0, 0, 0);
width: 100%;
height: 100%;
overflow: hidden;
font-family: 'Arial';
font-size: 11px;
padding: 0;
margin: 0;
}
.InfoBox {
width: 300px;
height: auto;
background: rgba(0, 0, 0, 0.85);
color: rgb(220, 220, 220);
padding: 10px;
}
.InfoBox a {
color: rgb(220, 220, 220);
text-decoration: underline;
}
.InfoBox a:hover {
color: rgb(255, 255, 255);
text-decoration: underline;
}
.InfoBoxTitle {
width: 100%;
height: auto;
padding: 0;
padding-bottom: 5px;
margin-bottom: 5px;
border: 0px dashed rgb(128, 128, 128);
border-bottom-width: 1px;
color: rgb(220, 220, 220);
font-weight: bold;
font-size: 14px;
}
.GridLogo {
position: absolute;
top: 50px;
left: 50px;
border: 0;
}
.ScrollBar::-webkit-scrollbar {
width: 3px;
}
.ScrollBar::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}
.ScrollBar::-webkit-scrollbar-thumb {
background: rgba(38, 38, 38, 0.9);
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
}
</style>
</head>
<body>
<img src='' style='border: 0; display: block; opacity; 0; position: absolute;' id='Image1' />
<img src='' style='border: 0; display: block; opacity: 0; position: absolute;' id='Image2' />
<script type='text/javascript'>
var Images = <?= $v['json-image-array'] ?>;
var MakeAnimation = true;
var CurrentIndex = 2;
var CurrentImage = -1;
var ImageTimeout = 0;
var CurrentImageTranslation = -1;
var ImagePositions = [{'x': -50, 'y': -50, 'px': 1, 'py': 1},
{'x': -50, 'y': -50, 'px': 1, 'py': 1}];
document.getElementById('Image1').onload = function() {
if (MakeAnimation)
{
this.style.width = (window.innerWidth + 100) + 'px';
if (this.offsetHeight < window.innerHeight + 100)
{
this.style.width = null;
this.style.height = (window.innerHeight + 100) + 'px';
}
ImagePositions[0].x = -50;
ImagePositions[0].y = -50;
}
else
{
this.style.width = window.innerWidth + 'px';
if (this.offsetHeight < window.innerHeight)
{
this.style.width = null;
this.style.height = window.innerHeight + 'px';
}
ImagePositions[0].x = 0;
ImagePositions[0].y = 0;
}
CurrentImageTranslation = 0;
};
document.getElementById('Image2').onload = function() {
if (MakeAnimation)
{
this.style.width = (window.innerWidth + 100) + 'px';
if (this.offsetHeight < window.innerHeight + 100)
{
this.style.width = null;
this.style.height = (window.innerHeight + 100) + 'px';
}
ImagePositions[1].x = -50;
ImagePositions[1].y = -50;
}
else
{
this.style.width = window.innerWidth + 'px';
if (this.offsetHeight < window.innerHeight)
{
this.style.width = null;
this.style.height = window.innerHeight + 'px';
}
ImagePositions[0].x = 0;
ImagePositions[0].y = 0;
}
CurrentImageTranslation = 0;
};
window.setInterval(function() {
ImageTimeout = ImageTimeout - 1;
if (ImageTimeout <= 0)
{
ImageTimeout = 10;
CurrentImage = CurrentImage + 1;
if (CurrentImage >= Images.length)
{CurrentImage = 0;}
if (CurrentIndex == 1)
{CurrentIndex = 2;}
else
{CurrentIndex = 1;}
document.getElementById('Image' + CurrentIndex).style.width = null;
document.getElementById('Image' + CurrentIndex).style.height = null;
document.getElementById('Image' + CurrentIndex).src = Images[CurrentImage];
}
}, 1000);
window.setInterval(function() {
if (MakeAnimation)
{
for (var i = 0; i < 2; ++i)
{
ImagePositions[i].x = ImagePositions[i].x + ImagePositions[i].px;
ImagePositions[i].y = ImagePositions[i].y + ImagePositions[i].py;
var OffWidth = document.getElementById('Image' + (i + 1)).offsetWidth;
var OffHeight = document.getElementById('Image' + (i + 1)).offsetHeight;
if (ImagePositions[i].x >= 0 || ImagePositions[i].x + OffWidth <= window.innerWidth)
{ImagePositions[i].px = -ImagePositions[i].px;}
if (ImagePositions[i].y >= 0 || ImagePositions[i].y + OffHeight <= window.innerHeight)
{ImagePositions[i].py = -ImagePositions[i].py;}
document.getElementById('Image' + (i + 1)).style.left = ImagePositions[i].x + 'px';
document.getElementById('Image' + (i + 1)).style.top = ImagePositions[i].y + 'px';
}
}
if (CurrentImageTranslation > -1)
{
var DoReset = false;
CurrentImageTranslation = CurrentImageTranslation + 0.025;
if (CurrentImageTranslation >= 1.0)
{
CurrentImageTranslation = 1.0;
DoReset = true;
}
if (CurrentIndex == 1)
{
document.getElementById('Image1').style.opacity = CurrentImageTranslation;
document.getElementById('Image2').style.opacity = 1 - CurrentImageTranslation;
}
else
{
document.getElementById('Image2').style.opacity = CurrentImageTranslation;
document.getElementById('Image1').style.opacity = 1 - CurrentImageTranslation;
}
if (DoReset)
{CurrentImageTranslation = -1;}
}
}, 50);
</script>
<div class='InfoBox' style='position: absolute; right: 50px; top: 50px;'>
<div class='InfoBoxTitle'><?= $v['grid-name'] ?></div>
Willkommen<br />
Bitte melde dich an, um <?= $v['grid-name'] ?> zu betreten.<br />
<br />
<?= $v['news'] ?>
</div>
<div class='InfoBox' style='position: absolute; left: 50px; bottom: 50px;'>
<div class='InfoBoxTitle'>
Status: <span style='color: rgb(0, 255, 0);'>Online</span>
</div>
<?= $v['stats'] ?>
</div>
</body>
</html>