diff options
| -rw-r--r-- | index.html | 56 |
1 files changed, 46 insertions, 10 deletions
@@ -22,17 +22,32 @@ </style> <link href="/javascript/twitter-bootstrap/css/bootstrap-responsive.css" rel="stylesheet"> <script src="/javascript/jquery/jquery.min.js"></script> + <script src="/javascript/twitter-bootstrap/js/bootstrap.min.js"></script> + <script src="/javascript/twitter-bootstrap/js/bootstrap-alert.min.js"></script> <script type="text/javascript"> + var username; + var token; + var logged_in = false; + + function authSuccess(data) { if (data.status == 'OK') { - alert("username: " + data.username + "\ntoken: " + data.token ); + logged_in = true; + username = data.username; + token = data.token; + $('#loginbox').hide('slide'); } else { - alert("login error: " + data.errorstring); + alertbox.error("Fehler beim Login", data.errorstring); + logged_in = false; } } function authError(req, status, error) { - alert(status + ": '" + error + "'") + message = req.status + ': ' + error; + if(req.status == 401) { + message = "Benutzer und/oder Passwort sind falsch!"; + } + alertbox.error("Fehler beim Login", message); } function auth() @@ -46,22 +61,43 @@ success: authSuccess }); } + + alertbox = function() {} + alertbox.warning = function (heading, message) { + $('#alertbox').html('<div class="alert"><a class="close" data-dismiss="alert" href="#">×</a><h4 class="alert-heading">' + heading + '</h4>' + message + '</div>'); + } + alertbox.error = function (heading, message) { + $('#alertbox').html('<div class="alert alert-error"><a class="close" data-dismiss="alert" href="#">×</a><h4 class="alert-heading">' + heading + '</h4>' + message + '</div>'); + } + alertbox.info = function (heading, message) { + $('#alertbox').html('<div class="alert alert-info"><a class="close" data-dismiss="alert" href="#">×</a><h4 class="alert-heading">' + heading + '</h4>' + message + '</div>'); + } </script> </head> <body> <div class="container"> - <form id="loginform" class="form-signin" role="form"> - <img src="/img/helsinki.png" /> - <h1 class="form-signin-heading">Radio Helsinki - Import</h1> - <input id="username" type="text" class="form-control" placeholder="Benutzername" required autofocus> - <input id="password" type="password" class="form-control" placeholder="Passwort" required> - <button class="btn btn-primary btn-large" type="submit"><i class="icon-user icon-white"></i> Einloggen</button> - </form> + + <div id="loginbox"> + <form id="loginform" class="form-signin" role="form"> + <img src="/img/helsinki.png" /> + <h1 class="form-signin-heading">Radio Helsinki - Import</h1> + <div id="alertbox"></div> + <input id="username" type="text" class="form-control" placeholder="Benutzername" required autofocus> + <input id="password" type="password" class="form-control" placeholder="Passwort" required> + <button class="btn btn-primary btn-large" type="submit"><i class="icon-user icon-white"></i> Einloggen</button> + </form> + </div> + + + </div> <script type="text/javascript"> $("#loginform").submit(function(event) { auth(); event.preventDefault(); }); + if(logged_in == true) { + $("#loginbox").hide(); + } </script> </body> |