123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139 |
- <!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.0">
- <link rel="stylesheet" href="style.css"
- <title></title>
- <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous">
- </head>
- <body>
- <nav class="navbar navbar-expand-lg bg-info">
- <div class="container-fluid">
- <a href="#" class="navbar-brand">
- <h1>Frontend Modeler</h1>
- </a>
- <img src="cdp_logo_sm.png" class="rounded float-end" alt="Responsive image">
- </div>
- </nav>
- <div class="container-sm">
- <br>
- <form class="row g-3">
- <div class="col-md-6">
- <label for="userlogin" class="form-label">User</label>
- <input type="text" class="form-control" id="userlogin">
- </div>
- <div class="col-sm-6">
- <label for="inputPassword0" class="form-label">Password</label>
- <input type="password" class="form-control" id="pwlogin">
- </div>
- <div class="col-12">
- <button type="button" id="login" class="btn btn-primary" >Login</button>
- </div>
- <br>
- <div class="w-25 col-12">
- <div id="liveAlertPlaceholder0"></div></div>
- </form>
- </div>
- <br>
- <div class="container-sm">
- <form class="row g-3">
- <div class="col-md-6">
- <label for="userregister" class="form-label">User</label>
- <input type="text" class="form-control" id="userregister">
- </div>
- <div class="col-sm-6">
- <label for="inputPassword1" class="form-label">Password</label>
- <input type="password" class="form-control" id="pwregister">
- </div>
- <div class="col-12">
- <button type="button" id="register" class="btn btn-primary" >Register</button>
- </div>
- <br>
- <div class="w-25 col-12">
- <div id="liveAlertPlaceholder1"></div></div>
- </form>
- </div>
- <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-u1OknCvxWvY5kfmNBILK2hRnQC3Pr17a+RTT6rIHI7NnikvbZlHgTPOOmMi466C8" crossorigin="anonymous"></script>
- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.1/jquery.min.js"></script>
- <link rel="stylesheet" href="./jstree/jstree/dist/themes/default/style.min.css" />
- <script src="./js/events_login.js"></script>
- <script>
- document.getElementById("login").addEventListener("click", redirectFunction);
- function redirectFunction(){
- var username = $('#userlogin').val();
- var pwtxt = $('#pwlogin').val();
- $.ajax({
- url: 'http://127.0.0.1:3001/login',
- type: 'GET',
- data: {user:username , pw: pwtxt},
- error: function() {
- console.log("Error");
- },
- success: function(data) {
- console.log(data[0].login);
- if(data[0].login == "OK"){
- var b = username;
- url = "index.html?name=" + encodeURIComponent(b);"index.html?name=" + encodeURIComponent(b);
- window.location.href = url;
- }else{
- const alertPlaceholder = document.getElementById("liveAlertPlaceholder0")
- const wrapper = document.createElement('div')
- wrapper.innerHTML = [
- "<div class='alert alert-danger alert-dismissible fade show' role='alert'>",
- "Error - Login not possible.",
- "<button type='button' class='btn-close' data-bs-dismiss='alert' aria-label='Close'></button>",
- "</div>"
- ].join("")
- alertPlaceholder.append(wrapper)
- }
- },
- type: 'GET'
- });
- }
- </script>
- <script>
- document.getElementById("register").addEventListener("click", redirectFunction);
- function redirectFunction(){
- var username = $('#userregister').val();
- var pwtxt = $('#pwregister').val();
- $.ajax({
- url: 'http://127.0.0.1:3001/register',
- type: 'GET',
- data: {user:username , pw: pwtxt},
- error: function() {
- console.log("Error");
- },
- success: function(data) {
- console.log(data[0].register);
- const alertPlaceholder = document.getElementById("liveAlertPlaceholder1")
- if(data[0].register == "OK"){
- const wrapper = document.createElement('div')
- wrapper.innerHTML = [
- "<div class='alert alert-success alert-dismissible' role='alert'>",
- "Registration successful - please login.",
- "<button type='button' class='btn-close' data-bs-dismiss='alert' aria-label='Close'></button>",
- "</div>"
- ].join("")
- alertPlaceholder.append(wrapper)
- }else{
- const wrapper = document.createElement('div')
- wrapper.innerHTML = [
- "<div class='alert alert-danger alert-dismissible fade show' role='alert'>",
- "Error - registration not successful.",
- "<button type='button' class='btn-close' data-bs-dismiss='alert' aria-label='Close'></button>",
- "</div>"
- ].join("")
- alertPlaceholder.append(wrapper)
- }
- },
- type: 'GET'
- });
- }
- </script>
- </body>
- </html>
|