Skip to content

Instantly share code, notes, and snippets.

@virla01

virla01/user.ptl

Last active September 24, 2015 14:24
Show Gist options
  • Save virla01/ba71a72b4cdf20e72294 to your computer and use it in GitHub Desktop.
Save virla01/ba71a72b4cdf20e72294 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
user.ptl
<!DOCTYPE html>
<html lang="es">
{include 'html/header.tpl'}
<body class="theme-default main-menu-animated">
<script>var init = [];</script><script>var init = [];</script>
<!-- Demo script --> <script src="templates/js/demo.js"></script> <!-- / Demo script -->
<div id="main-wrapper">
{include 'html/nav.tpl'}
{include 'html/menu.tpl'}
<div id="content-wrapper">
<div class="col-sm-12">
<div class="panel-body-button">
<button type="button" class="btn btn-success" id="send_request_save"><i class="fa fa-edit"></i>&nbsp;&nbsp;Guardar</button>&nbsp;&nbsp;
<a href="index.php?app=usuarios&view=list-user" class="btn"><i class="fa fa-times-circle rojo"></i>&nbsp;&nbsp;Cancelar</a> &nbsp;&nbsp;&nbsp;
</div>
</div>
<!-- FORMULARIO REGISTRO -->
<div class="col-sm-9">
<div id="_AJAX_"></div>
<div class="panel form-horizontal">
<div class="panel-heading">
<span class="panel-title">Nueva cuenta de usuario</span>
</div>
<div class="panel-body">
<div class="form-group">
<label class="col-sm-2 control-label">Nombre</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="nom" placeholder="Nombre usuario">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">Apellido</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="ape" placeholder="Nombre usuario" required="">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">Nombre usuario</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="user" placeholder="Nombre usuario" required="">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">Email</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="email" placeholder="email" required="">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">Contraseña</label>
<div class="col-sm-10">
<input type="password" class="form-control" id="pass" placeholder="Contraseña" required="">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">Grupo usuario</label>
<div class="col-sm-10">
<select class="form-control form-group-margin" id="grup" required="">
<option value="1">Especial</option>
<option value="2">Editor</option>
<option value="3">Autor</option>
<option value="4">Editor responsable</option>
<option value="5">Administrador</option>
<option value="6">super Usuario</option>
</select>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">Avatar usuario</label>
<div class="col-sm-10">
<!-- Javascript -->
<script>
init.push(function () {
$("#dropzonejs-example").dropzone({
url: "templates/images/avatars",
paramName: "file", // The name that will be used to transfer the file
maxFilesize: 2, // MB
addRemoveLinks : true,
dictResponseError: "No se puede cargar el archivo!",
autoProcessQueue: false,
thumbnailWidth: 138,
thumbnailHeight: 120,
previewTemplate: '<div class="dz-preview dz-file-preview"><div class="dz-details"><div class="dz-filename"><span data-dz-name></span></div><div class="dz-size">Tamaño del archivo: <span data-dz-size></span></div><div class="dz-thumbnail-wrapper"><div class="dz-thumbnail"><img data-dz-thumbnail><span class="dz-nopreview">No preview</span><div class="dz-success-mark"><i class="fa fa-check-circle-o"></i></div><div class="dz-error-mark"><i class="fa fa-times-circle-o"></i></div><div class="dz-error-message"><span data-dz-errormessage></span></div></div></div></div><div class="progress progress-striped active"><div class="progress-bar progress-bar-success" data-dz-uploadprogress></div></div></div>',
resize: function(file) {
var info = { srcX: 0, srcY: 0, srcWidth: file.width, srcHeight: file.height },
srcRatio = file.width / file.height;
if (file.height > this.options.thumbnailHeight || file.width > this.options.thumbnailWidth) {
info.trgHeight = this.options.thumbnailHeight;
info.trgWidth = info.trgHeight * srcRatio;
if (info.trgWidth > this.options.thumbnailWidth) {
info.trgWidth = this.options.thumbnailWidth;
info.trgHeight = info.trgWidth / srcRatio;
}
} else {
info.trgHeight = file.height;
info.trgWidth = file.width;
}
return info;
}
});
});
</script>
<!-- / Javascript -->
<div id="dropzonejs-example" class="dropzone-box">
<div class="dz-default dz-message">
<i class="fa fa-cloud-upload"></i>
Soltar archivos aquí<br><span class="dz-text-small">o haga clic para elegir manualmente</span>
</div>
<form action="templates/images/avatars">
<div class="fallback">
<input name="file" type="file" multiple="" id="avatar" required=""/>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-sm-3">
<div class="panel panel-info">
<div class="panel-heading">
<span class="panel-title">Panel - Informativo</span>
<div class="panel-heading-controls">
<div class="panel-heading-icon"><i class="fa fa-inbox"></i></div>
</div>
</div>
<div class="panel-body">
Rellene todos los campos, es importante!.
</div>
</div>
</div>
<!-- FINAL FORMULARIO REGISTRO -->
</div>
<div id="main-menu-bg"></div>
</div>
<script>
window.onload = function(){
document.getElementById('send_request_save').onclick = function(){
var connect, user, pass, email, nom, ape, grup, avatar, form, result;
user = document.getElementById('user').value;
pass = document.getElementById('pass').value;
email = document.getElementById('email').value;
nom = document.getElementById('nom').value;
ape = document.getElementById('ape').value;
grup = document.getElementById('grup').value;
avatar = document.getElementById('avatar').value;
if(user != '' && pass != '' && email != '' && nom != '' && ape != '' && grup != ''){
form = 'user=' + user + '&pass=' + pass + '&email=' + email + '&nom=' + nom + '&ape=' + ape + '&grup=' + grup + '&avatar=' + avatar;
connect = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');
connect.onreadystatechange = function(){
if(connect.readyState == 4 && connect.status == 200){
console.log(connect.responseText);
if(parseInt(connect.responseText) == 1){
result = '<div class="alert alert-success alert-dark">';
result += '<button type="button" class="close" data-dismiss="alert">×</button>';
result += '<strong>Guardado</strong>';
result += '</div>';
location.href = '?app=usuarios&view=list-user';
document.getElementById('_AJAX_').innerHTML = result;
}else if(parseInt(connect.responseText) == 2){
result = '<div class="alert alert-danger alert-dark">';
result += '<button type="button" class="close" data-dismiss="alert">×</button>';
result += '<strong>Ohps!</strong> El usuario ya existe.';
result += '</div>';
document.getElementById('_AJAX_').innerHTML = result;
}else{
result = '<div class="alert alert-danger alert-dark">';
result += '<button type="button" class="close" data-dismiss="alert">×</button>';
result += '<strong>Ohps!</strong> El email ya existe.';
result += '</div>';
document.getElementById('_AJAX_').innerHTML = result;
}
}else if(connect.readyState != 4){
result = '<div class="alert alert-dark">';
result += '<button type="button" class="close" data-dismiss="alert">×</button>';
result += 'Procesando...';
result += '</div>';
document.getElementById('_AJAX_').innerHTML = result;
}
}
connect.open('POST','?app=usuarios&view=user', true);
connect.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
connect.send(form);
}else{
result = '<div class="alert alert-danger alert-dark">';
result += '<button type="button" class="close" data-dismiss="alert">×</button>';
result += '<strong>Ohps!</strong> Todos los campos deben estar llenos.';
result += '</div>';
document.getElementById('_AJAX_').innerHTML = result;
}
}
}
</script>
{include 'html/footer.tpl'}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment