Cambio de los formularios de entrada y registro (en paralelo) (sin terminar)

git-svn-id: https://192.168.0.254/svn/Proyectos.Incam_PROFIND_Aterrizaje/trunk@3 db07b8d6-80f3-1c4e-84de-227a4fed3af2
This commit is contained in:
David Arranz 2012-09-18 14:01:29 +00:00
parent da914d191e
commit 6c909a5fe7
2 changed files with 171 additions and 88 deletions

View File

@ -211,6 +211,14 @@ p {
border-top: 1px dashed #ccc;
display: inline-block;
}
.divider-vertical {
width: 100%;
margin: 0 10px;
border-left: 1px dashed #ccc;
display: inline-block;
height: 100%;
}
.spacer-30px {
width: 100%;
height: 30px;
@ -327,6 +335,25 @@ p {
line-height: 2.2em;
margin-bottom: 10px;
}
/*boxed features - style 1 and style2*/
.feature-box1, .feature-box2 {
background: #f4f4f4; /* for non-css3 browsers */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f4f4f4'); /* for IE */
background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f4f4f4)); /* for webkit browsers */
background: -moz-linear-gradient(top, #ffffff, #f4f4f4); /* for firefox 3.6+ */
background: -o-linear-gradient(top, #ffffff, #f4f4f4);
border: 1px solid #efefef;
padding: 20px;
float: left;
}
.feature-box1 img {
float: right;
}
.feature-box2 img {
margin: 40px 20px 40px 0px;
float: left;
}
.feature-list li {
margin-bottom: 15px;
@ -341,6 +368,45 @@ p {
float: left;
}
.form-box {
border: 1px solid #ddd;
background: #f4f4f4;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f4f4f4');
background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f4f4f4));
background: -moz-linear-gradient(top, #ffffff, #f4f4f4);
background: -o-linear-gradient(top, #ffffff, #f4f4f4);
position: relative;
}
.form-box h4 {
width: auto;
padding: 20px;
margin-top: 0;
font-family: Arial,Helvetica,sans-serif;
font-size: 20px;
font-weight: normal;
color: #fff;
}
.form-box form {
min-height: 280px;
}
.form-box .form-actions {
background: #f6f6f6; /* for non-css3 browsers */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f6f6f6'); /* for IE */
background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f6f6f6)); /* for webkit browsers */
background: -moz-linear-gradient(top, #ffffff, #f6f6f6); /* for firefox 3.6+ */
background: -o-linear-gradient(top, #ffffff, #f6f6f6);
border-top: 1px solid #e4e4e4;
margin-bottom: 0;
margin-top: 0;
position: absolute;
bottom: 0;
left: 0;
right: 0;
}
/*----------------------------------------*/
.pricing {
border: 1px solid #e4e4e4;
@ -414,6 +480,10 @@ label, input, button, select, textarea {
select {
border-radius: 3px;
}
.controls label {
line-height: 1.3em;
}
label {
font-family: "Droid Sans",Arial,Helvetica,Geneva,sans-serif;
color: #222222;

View File

@ -9,6 +9,7 @@
<link rel="shortcut icon" href="favicon.ico">
<link href='http://fonts.googleapis.com/css?family=Droid+Sans:400,400italic,700' rel='stylesheet' type='text/css'>
<link rel="stylesheet" media="screen" href="css/bootstrap.min.css"/>
<link rel="stylesheet" media="screen" href="css/style.css"/>
<script src="js/jquery-1.8.1.min.js" type="text/javascript"></script>
</head>
@ -45,67 +46,57 @@
<div class="container">
<div class="row">
<div class="span12">
<div class="nav pagination-centered">
<a href="#entrar" data-toggle="tab" id="btn-entrar" class="btn btn-primary btn-big"><i class="icon-white icon-user"></i> Entrar (socios)</a>
<a href="#registro" data-toggle="tab" id="btn-registros" class="btn btn-success btn-big"><i class="icon-white icon-edit"></i> ¿Quiere crear una cuenta?</a>
</div>
<div class="tabbable">
<div class="tab-content">
<div id="entrar" class="tab-pane hide well">
<h4>Entrada para socios</h4>
<form class="form-horizontal" id="entrarForm" method='post' action=''>
<div class="span6">
<div id="entrar" class="form-box">
<h4 class="btn-primary"><i class="icon-white icon-user"></i> Entrada para socios</h4>
<form class="form-horizontal" id="entrarForm" method='post' action='/usuarios/index.php?r=site/login'>
<fieldset>
<div class="control-group">
<label class="control-label" for="entrarEmail">Email:</label>
<label class="control-label" for="FormularioLogin_email">Email:</label>
<div class="controls">
<input type="text" class="input-xlarge" id="entrarEmail" name="entrarEmail" placeholder="">
<input type="text" class="input-large" id="FormularioLogin_email" name="FormularioLogin_email" placeholder="">
</div>
</div>
<div class="control-group">
<label class="control-label" for="entrarPassword">Crear password:</label>
<label class="control-label" for="FormularioLogin_password">Crear password:</label>
<div class="controls">
<input type="password" class="input-xlarge" id="entrarPassword" name="entrarPassword" placeholder="">
<input type="password" class="input-large" id="FormularioLogin_password" name="FormularioLogin_password" placeholder="">
</div>
</div>
<div class="control-group">
<div class="controls">
<p>Olvidé mi password: <a href="">Solicitar</a></p>
<button title="Entrar a mi cuenta" class="btn btn-primary" type="submit">Entrar</button>
</div>
</div>
<div class="form-actions">
<button title="Entrar a mi cuenta" class="btn btn-primary btn-large" type="submit">Entrar</button>
</div>
</fieldset>
</form>
<div id="resultado"></div>
</div>
<div id="registro" class="tab-pane hide well">
<h4>Crear una cuenta</h4>
</div>
<div class="span6">
<div id="registro" class="form-box">
<h4 class="btn-success"><i class="icon-white icon-edit"></i> ¿Quiere crear una cuenta? (gratis)</h4>
<form class="form-horizontal" id="registroForm" method='post' action=''>
<fieldset>
<div class="control-group">
<label class="control-label" for="registroEmail">Email:</label>
<div class="controls">
<input type="text" class="input-xlarge" id="registroEmail" name="registroEmail" placeholder="">
<input type="text" class="input-large" id="registroEmail" name="registroEmail" placeholder="">
</div>
</div>
<div class="control-group">
<label class="control-label" for="registroPassword">Crear password:</label>
<div class="controls">
<input type="password" class="input-xlarge" id="registroPassword" name="registroPassword" placeholder="">
<input type="password" class="input-large" id="registroPassword" name="registroPassword" placeholder="">
</div>
</div>
<div class="control-group">
<label class="control-label" for="registroConfirmPassword">Confirmar password:</label>
<div class="controls">
<input type="password" class="input-xlarge" id="registroConfirmPassword" name="registroConfirmPassword" placeholder="">
</div>
</div>
<div class="control-group">
<label for="registroTipoCuenta" class="control-label">Tipo de cuenta</label>
<div class="controls">
<select id="registroTipoCuenta" name="registroTipoCuenta" class="input-xlarge">
<option value="personal">Cuenta personal</option>
<option value="grupo">Cuenta de grupo</option>
</select>
<input type="password" class="input-large" id="registroConfirmPassword" name="registroConfirmPassword" placeholder="">
</div>
</div>
<div class="control-group">
@ -115,10 +106,8 @@
</label>
</div>
</div>
<div class="control-group">
<div class="controls">
<button title="Crear mi cuenta" class="btn btn-success" type="submit">Pulsa aquí</button>
</div>
<div class="form-actions">
<button title="Crear mi cuenta" class="btn btn-success btn-large" type="submit">Pulsa aquí</button>
</div>
</fieldset>
</form>
@ -126,12 +115,10 @@
</div>
</div>
</div>
</div>
</div>
<div class="container clearfix">
<div class="row pagination-centered">
<div class="divider-10px"></div>
<div class="divider"></div>
<div class="span12">
<h3>PROFIND tiene aplicación en las siguientes situaciones</h3>
</div>
@ -195,22 +182,49 @@
<script type="text/javascript">
$(document).ready(function(){
var enviar_login = function() {
var $form = $("#entrarForm");
$.ajax({
url: $form.attr('action'),
dataType: 'json',
type: 'POST',
data : $form.serialize()+'&ajax=login-form',
success: function(data, textStatus, XMLHttpRequest) {
console.log("data => " + data);
console.log(textStatus);
console.log(XMLHttpRequest);
if (data != null && typeof data == 'object') {
$('#resultado').val('');
$.each(data, function(key, value){
$('#resultado').append(key + ' => ' + value);
});
}
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
$('#resultado').append('Error de comunicación con el servidor');
}
});
return false;
};
$("#entrarForm").validate({
rules:{
entrarEmail:{
FormularioLogin_email:{
required:true,
email: true
},
entrarPassword:{
FormularioLogin_password:{
required:true
}
},
messages:{
entrarEmail:{
FormularioLogin_email:{
required:"Introduzca su e-mail",
email:"Indique un e-mail válido"
},
entrarPassword:{
FormularioLogin_password:{
required:"Indique su contraseña",
}
},
@ -221,11 +235,10 @@
},
unhighlight: function(element, errorClass, validClass) {
$(element).parents('.control-group').removeClass('error');
$(element).parents('.control-group').addClass('success');
}
},
submitHandler: enviar_login
});
$("#registroForm").validate({
rules:{
registroEmail:{