Skip to content

I
internship
Commit 06e1d4c2 authored by Alina Habibulina's avatar Alina Habibulina
Browse files
Options

+auth form v3

parent 809c0b06
Hide whitespace changes
Inline Side-by-side
Showing with 111 additions and 106 deletions
src/main/webapp/css/beau.css
View file @ 06e1d4c2
.submit {
background-color: #e7e7e7;
color: black;
border: none;
padding: 15px 32px;
text-align: center;
text-decoration: none;
border-radius: 5px;
display: inline-block;
font-size: 16px;
.login-form{
left: 50%;
transform: translate(-50%, 0);
width: 320px;
height: 230px;
background-color: white;
position: absolute;
border-color: #24282B;
border-style: none solid solid;
border-width: 1px;
top: 150px;
}
.login-form {
position: relative;
width: 200px;
height: 250px;
margin-left: auto;
margin-right: auto;
padding: 15px 25px 0 25px;
margin-top: 15px;
cursor: default;
background-color: #141517;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: 0px 1px 1px 0px rgba(255,255,255, .2), inset 0px 1px 1px 0px rgb(0,0,0);
-moz-box-shadow: 0px 1px 1px 0px rgba(255,255,255, .2), inset 0px 1px 1px 0px rgb(0,0,0);
box-shadow: 0px 1px 1px 0px rgba(255,255,255, .2), inset 0px 1px 1px 0px rgb(0,0,0);
.header{
background-color: #4C5256;
position: relative;
padding: 12px;
color: white;
font-family: arial, tahoma, sans-serif;
font-size: 13pt;
font-weight: bold;
cursor: pointer;
}
.login-form h3 {
line-height: 20px;
font-family: 'Myriad Pro', sans-serif;
font-size: 22px;
font-weight: normal;
color: #e4e4e4;
.error{
margin-top: 5px;
color: red;
font-family: arial, tahoma, sans-serif;
font-size: 15pt;
}
.login-form input[type=text],
.login-form input[type=password]{
line-height: 14px;
margin: 10px 0;
padding: 6px 15px;
border: 0;
outline: none;
font-family: Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
text-shadow: 0px 1px 1px rgba(255,255,255, .2);
-webkit-border-radius: 26px;
-moz-border-radius: 26px;
border-radius: 26px;
-webkit-transition: all .15s ease-in-out;
-moz-transition: all .15s ease-in-out;
transition: all .15s ease-in-out;
}
.login-form input[type=text],
.login-form input[type=password]{
color: #686868;
width: 170px;
-webkit-box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .6);
-moz-box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .6);
box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .6);
background: #989898;
background: -moz-linear-gradient(top, #ffffff 0%, #989898 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#989898));
background: -webkit-linear-gradient(top, #ffffff 0%,#989898 100%);
background: -o-linear-gradient(top, #ffffff 0%,#989898 100%);
background: -ms-linear-gradient(top, #ffffff 0%,#989898 100%);
background: linear-gradient(top, #ffffff 0%,#989898 100%);
.login{
position: static;
margin-top: 25px;
width: 250px;
display: inline-block;
height: 20px;
size: 50px;
}
.login-form input[type=text]:hover,
.login-form input[type=password]:hover {
-webkit-box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .6), 0px 0px 5px rgba(255,255,255, .5);
-moz-box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .6), 0px 0px 5px rgba(255,255,255, .5);
box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .6), 0px 0px 5px rgba(255,255,255, .5);
.password {
position: static;
margin-top: 15px;
width: 250px;
display: inline-block;
height: 20px;
}
.login-form input[type=text]:focus,
.login-form input[type=password]:focus {
background: #e1e1e1;
background: -moz-linear-gradient(top, #ffffff 0%, #e1e1e1 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e1e1e1));
background: -webkit-linear-gradient(top, #ffffff 0%,#e1e1e1 100%);
background: -o-linear-gradient(top, #ffffff 0%,#e1e1e1 100%);
background: -ms-linear-gradient(top, #ffffff 0%,#e1e1e1 100%);
background: linear-gradient(top, #ffffff 0%,#e1e1e1 100%);
.submit{
margin-top: 15px;
width: 100px;
position: relative;
height: 35px;
border-radius: 5px;
background-color: #49b785;
border-color: #49b785;
color: #ffffff;
}
\ No newline at end of file
src/main/webapp/index.html
View file @ 06e1d4c2
......@@ -18,16 +18,6 @@
<div id ="form_player_container" align ="center">
<div id ="form_player_div" ></div>
</div>
<div class ="login-form" align ="center">
<form id ="authorization">
<p><h3>Please, log in: </h3>
<div class ="infoInput">
<p><input type ="text" id ="login" name ="login" placeholder ="Username" size ="20" required></p>
<p><input type ="password" id ="password" name ="password" placeholder ="Password" size ="20" required></p>
</div>
<input type ="submit" id ="submit" class ="submit" align ="center" value ="Submit"></button>
</form>
</div>
<div id="authForm"></div>
</body>
</html>
\ No newline at end of file
src/main/webapp/js/Player.js
View file @ 06e1d4c2
......@@ -17,36 +17,83 @@ var portal = {
portal.player = AS.FORMS.createPlayer();
portal.player.showFormByCode(formCode);
portal.player.view.appendTo($('#form_player_div'));
},
showMessage : function(message) {
alert(message);
}
}
};
AS.SERVICES.unAuthorized = function()
{
portal.showMessage("Authorization Error!");
location.reload();
CreateAuthForm();
};
function CreateAuthForm(){
var forma = document.createElement("form");
forma.className = "login-form";
forma.setAttribute('id',"login-form");
forma.setAttribute('align',"center");
var authHeader = document.createTextNode('Введите логин и пароль');
var authErr = document.createTextNode('Неверный логин или пароль');
var Hdiv = document.createElement("div");
Hdiv.className = "header";
Hdiv.appendChild(authHeader);
var Ediv = document.createElement("div");
Ediv.className = "error";
Ediv.appendChild(authErr);
Ediv.setAttribute('id',"error");
var textInp = document.createElement("input");
textInp.className = "login";
textInp.setAttribute('type',"text");
textInp.setAttribute('name',"login");
textInp.setAttribute('id',"login");
textInp.setAttribute('placeholder',"Логин");
textInp.setAttribute('align',"center");
var pasInp = document.createElement("input");
pasInp.className = "password";
pasInp.setAttribute('type',"password");
pasInp.setAttribute('name',"password");
pasInp.setAttribute('id',"password");
pasInp.setAttribute('placeholder',"Пароль");
pasInp.setAttribute('align',"center");
var submitBtn = document.createElement("input");
submitBtn.className = "submit";
submitBtn.setAttribute('type',"submit");
submitBtn.setAttribute('value',"Войти");
submitBtn.setAttribute('id',"submit");
submitBtn.setAttribute('align',"center");
var addHandlers = function(){
forma.appendChild(Hdiv);
forma.appendChild(Ediv);
forma.appendChild(textInp);
forma.appendChild(pasInp);
forma.appendChild(submitBtn);
document.getElementById("authForm").appendChild(forma);
authFunc();
};
var authFunc = function(){
jQuery(".submit").on( "click", function(event){
AS.OPTIONS.login = $("input#login").val();
AS.OPTIONS.password = $("input#password").val();
var xhr = new XMLHttpRequest();
AS.FORMS.ApiUtils.simpleAsyncGet('rest/api', xhr);
if (xhr.status == "401") {
AS.SERVICES.unAuthorized();
} else {
$(".login-form").remove();
if (xhr.status != 200) {
$(".form_player_container").show();
portal.createPlayer("timesheet");
$(".login-form").remove();
} else {
CreateAuthForm();
}
});
}
};
$(document).ready(function(){
addHandlers();
});
\ No newline at end of file
CreateAuthForm();
$(".error").hide();
});
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment