Skip to content

Instantly share code, notes, and snippets.

@atcasanova

atcasanova/gist:4fa735bab514e6d54e0f

Created June 4, 2014 18:08
Show Gist options
  • Save atcasanova/4fa735bab514e6d54e0f to your computer and use it in GitHub Desktop.
Save atcasanova/4fa735bab514e6d54e0f to your computer and use it in GitHub Desktop.
Download ZIP
Raw
gistfile1.html
<!DOCTYPE html>
<html dir="ltr" lang="pt-BR">
<head>
<meta charset="utf-8">
<title>Redefinição Automática de Senha</title>
<meta name="viewport" content="initial-scale = 1.0, maximum-scale = 1.0, user-scalable = no, width = device-width">
<!--[if lt IE 9]><script src="https://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
<link rel="stylesheet" href="style.css" media="screen">
<!--[if lte IE 7]><link rel="stylesheet" href="../style.ie7.css" media="screen" /><![endif]-->
<link rel="stylesheet" href="style.responsive.css" media="all">
<link rel="stylesheet" href="jquery-ui-1.10.3/themes/custom-theme/jquery-ui.css" />
<script src="script.js"></script>
<script src="script.responsive.js"></script>
<script src="jquery-ui-1.10.3/jquery-1.9.1.js"></script>
<script src="jquery-ui-1.10.3/ui/jquery-ui-1.10.3.custom.js"></script>
<style>
.content .postcontent-0 .layout-item-0 { color: #595959; }
.content .postcontent-0 .layout-item-1 { border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-width:1px;border-right-width:1px;border-bottom-width:1px;border-left-width:1px;border-top-color:#BFBFBF;border-right-color:#BFBFBF;border-bottom-color:#BFBFBF;border-left-color:#BFBFBF; color: #3B3B3B; background: #D4D4D4; padding-right: 10px;padding-left: 10px; }
.content .postcontent-0 .layout-item-2 { border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-width:1px;border-right-width:1px;border-bottom-width:1px;border-left-width:1px;border-top-color:#BFBFBF;border-right-color:#BFBFBF;border-bottom-color:#BFBFBF;border-left-color:#BFBFBF; color: #595959; padding-right: 10px;padding-left: 10px; }
.ie7 .post .layout-cell {border:none !important; padding:0 !important; }
.ie6 .post .layout-cell {border:none !important; padding:0 !important; }
</style>
</head>
<script >
$(function(){
$("form.form_ajax").on('submit',function(event){
event.preventDefault();
console.log('submit');
var
$this = $(this),
$dialog = null,
titulo = $this.data('title')
;
console.log(titulo);
$dialog = $('#dialog');
$dialog.dialog({
autoOpen: false,
title: titulo,
modal: false,
width: '700',
height: '500',
close: function( event, ui ) {
//$dialogCadastrar.empty();
},
open: function( event, ui ) {
console.log('open');
},
buttons: {
'Fechar': function(){
$(this).dialog('close');
}//,
//'Enviar': function(){
// console.log('enviar');
//}
}
});
$('#carregando').show();
$.ajax({
url: $this.attr('action'),
dataType: 'html',
type: 'POST',
data: $this.serialize(),
//processData:false,
success: function(data) {
$dialog.html(data).dialog('open');
$('#carregando').hide();
$('input[type=submit]').prop('disabled', true).prop('value', 'Enviado!');
},
error: function () {
}
});
});
});
</script>
<script type="text/javascript">
function mascara(o,f){
v_obj=o
v_fun=f
setTimeout("execmascara()",1)
}
function execmascara(){
v_obj.value=v_fun(v_obj.value)
}
function id( el ){
return document.getElementById( el );
}
function mcpf(v){
v=v.replace(/\D/g,"") //Remove tudo o que não é dígito
v=v.replace(/(\d{3})(\d)/,"$1.$2") //Coloca um ponto entre o terceiro e o quarto dígitos
v=v.replace(/(\d{3})(\d)/,"$1.$2") //Coloca um ponto entre o terceiro e o quarto dígitos de novo (para o segundo bloco de números)
v=v.replace(/(\d{3})(\d{1,2})$/,"$1-$2") //Coloca um hífen entre o terceiro e o quarto dígitos
return v
}
window.onload = function(){
id('cpf').onkeypress = function(){
mascara( this, mcpf );
}
}
</script>
<body>
<div id="main">
<div id="header-bg">
<header class="header">
<div id="carregando" title="Carregando" style="display:none;margin:30px 0px 0px 190px;">
<img src="images/carregando.gif" alt="Carregando..." hspace="10px"/>
</div>
<div id="dialog" style="display:none">
</div>
<div class="shapes"></div>
<h1 class="headline" data-left="4.21%"><a href="#">DNIT</a></h1>
<h2 class="slogan" data-left="6.05%">Redefinição Automática de Senha</h2>
</header>
</div>
<div class="sheet clearfix">
<div class="layout-wrapper">
<div class="content-layout">
<div class="content-layout-row">
<div class="layout-cell content">
<article class="post article">
<div class="postcontent postcontent-0 clearfix">
<div class="content-layout layout-item-0">
<div class="content-layout-row">
<div class="layout-cell layout-item-3" style="width: 33%;" >
</div>
<div class="layout-cell layout-item-1" style="width: 34%" >
<p></p><p></p><p></p><h1>Resetar Senha</h1>
<form class="form_ajax" action="usureset.php" method="post" enctype="multipart/form-data" data-title="E-mail">
<table>
<tbody>
<tr>
<td style="text-align: right; "><b>Login:</b></td>
<td>
<input type="text" name="login" id="login" size="28" onblur="javascript:this.value=this.value.toLowerCase();" autocomplete="off">
</td>
</tr>
<tr>
<td style="text-align: right; "><b>CPF:</b></td>
<td>
<input type="text" name="cpf" id="cpf" size="28" maxlength="14" autocomplete="off">
</td>
</tr>
<tr>
<td style="text-align: right; "><b>E-mail:</b></td>
<td>
<input type="text" name="email" id="email" size="28" onblur="javascript:this.value=this.value.toLowerCase();" autocomplete="off">
</td>
</tr>
<tr>
<td style="text-align: right; "></td>
<td></td>
</tr>
<tr>
<td style="text-align: right; "></td>
<td></td>
</tr>
</tbody>
</table>
<input class="button" type="submit" value="Resetar"><input class="button" type="reset" value="Limpar">
</form>
<ul>
<li>
<a href="#"><span style="color: rgb(18, 18, 18); "></span></a><a href="#" >Usuário utilizado para logar no computador.</a>
</li>
<li>
<a href="#"><span style="color: rgb(18, 18, 18); "></span></a><a href="#" >CPF do usuário.</a>
</li>
<li>
<a href="#"><span style="color: rgb(18, 18, 18); "></span></a><a href="#" >E-mail do DNIT referente ao usuário.</a>
</li>
</ul><p></p><p></p><p></p>
</div>
<div class="layout-cell layout-item-3" style="width: 33%;" >
</div>
</div>
</div>
</div>
</article>
</div>
</div>
</div>
</div>
</div>
<footer class="footer">
<div class="footer-inner">
<div class="content-layout">
<div class="content-layout-row">
<div class="layout-cell layout-item-0" style="width: 20%">
</div>
<div class="layout-cell layout-item-1" style="width: 20%">
<h3>Versão 1.0</h3>
<br>
<ul>
<li>
<br>
</li>
</ul>
</div>
<div class="layout-cell layout-item-1" style="width: 25%">
<a href="http://www.serpro.gov.br" target="_blank"><img alt="Serpro, Serviço Federal de Processamento de Dados" src="images/logoserpro.png" style="margin-top: -08px;"/></a>
</div>
<div class="layout-cell layout-item-2" style="width: 35%">
<p style="text-align: right;">
<br>
</p>
</div>
</div>
</div>
<div class="content-layout">
<div class="content-layout-row">
<div class="layout-cell" style="width: 100%">
<p style="text-align: center;">
<p style="text-align: center;"><span style="text-align: right;">Serviço Federal de Processamento de Dados<br />Presente na vida de todo cidadão.</span><br></p>
<br>
</p>
</div>
</div>
</div>
</div>
</footer>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment