Game-Jaming/Frontend/Html/FirstTimeSetup.html

128 lines
5.0 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<!-- Default page settings -->
<title>Opsætning</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="../Images/SetupFav.png" />
<!-- Default page settings end -->
<!-- CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.2/css/all.min.css" integrity="sha512-HK5fgLBL+xu6dm/Ii3z4xhlSUyZgTT9tuc/hSrtw6uzJOvgRr2a9jyxxT1ely+B+xFAmJKVSTbpM/CuL7qxO8w==" crossorigin="anonymous" />
<link rel="stylesheet" href="../Styles/FirstTimeSetup.css" />
<link rel="stylesheet" href="../Styles/minibar.min.css" />
<link rel="stylesheet" href="../Styles/Index.css" />
<!-- CSS end -->
<!-- Header scripts -->
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
<script src="https://kit.fontawesome.com/57b6c8b971.js" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.6.0/dist/umd/popper.min.js" integrity="sha384-KsvD1yqQ1/1+IA7gi3P0tyJcT3vR+NdBTt13hSJ2lnve8agRGXTTyNaBYmCR/Nwi" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.min.js" integrity="sha384-nsg8ua9HAw1y0W1btsyWgBklPnCUAFLuTMS2G72MMONqmOymq585AcH49TLBQObG" crossorigin="anonymous"></script>
<!-- Header scripts end -->
</head>
<body>
<div class="HeaderPanel">
<h6 class="HeaderTitle">
Første Gangs Opsætning
</h6>
</div>
<form id="regForm" method="POST">
<input type="hidden" name="dbType" id="DBType" />
<div class="tab">
<h1>
Type database:
</h1>
<p>
<select id="dbSelect" class="form-select" aria-label="Default select example">
<option value="mysql">MySQL</option>
<option value="sqlite">SQLite</option>
</select>
</p>
</div>
<div class="tab">
<h1>
Database ip:
</h1>
<p>
<input name="dbServername" class="form-control" placeholder="F.eks. 127.0.0.1">
</p>
</div>
<div class="tab">
<h1>
Database:
</h1>
<p>
<input name="dbName" class="form-control">
</p>
</div>
<div class="tab">
<h1>
Database bruger:
</h1>
<p>
<input name="dbUsername" class="form-control" placeholder="Brugernavn">
</p>
<p>
<input id="Password" type="password" class="form-control" placeholder="Password">
</p>
<p>
<input id="ConfirmPassword" type="password" name="dbPassword" class="form-control" placeholder="Gentag password">
</p>
</div>
<div class="tab">
<h1>
Opret admin bruger:
</h1>
<p>
<input name="AdminUsername" class="form-control" placeholder="Brugernavn">
</p>
<p>
<input id="adminPassword" type="password" class="form-control" placeholder="Password">
</p>
<p>
<input id="adminConfirmPassword" type="password" name="AdminPassword" class="form-control" placeholder="Gentag password">
</p>
</div>
<div style="overflow:auto;">
<div>
<a type="button" style="float:left;" id="prevBtn" onclick="nextPrev(-1)">
<i class="fas fa-arrow-left"></i>
</a>
<a type="button" style="float:right;" id="nextBtn" onclick="nextPrev(1)">
<i class="fas fa-arrow-right"></i>
</a>
<input id="submitBtn" type="submit" style="float:right;" name="dbSetup" value="Opret Siden" onclick="nextPrev(1)">
</div>
</div>
<!-- Circles which indicates the steps of the form: -->
<div style="text-align:center;margin-top:40px;">
<i class="fas fa-circle step"></i>
<i class="fas fa-circle step"></i>
<i class="fas fa-circle step"></i>
<i class="fas fa-circle step"></i>
<i class="fas fa-circle step"></i>
</div>
</form>
<!-- Body scripts -->
<script src="../Javascript/SetupForm.js"></script>
<script src="../Javascript/minibar.min.js"></script>
<!-- Body scripts end -->
</body>
</html>