source: aportesmurachi/tahel/Murachi-pre/pruebaFinal2.html

Last change on this file was 12e6ddf, checked in by Antonio Araujo <aaraujo@…>, 7 years ago

Agregados los directorio de aportes de Tahel al control de versiones.
  • Property mode set to 100644
File size: 60.7 KB
Line 
1<!DOCTYPE html>
2<!-- release v4.1.8, copyright 2014 - 2015 Kartik Visweswaran -->
3<html lang="es">
4    <head> <!--Inicio del head  -->
5        <meta charset="UTF-8"/>
6        <link rel="stylesheet" href="css/jquery.Jcrop.css" type="text/css" />
7
8        <script type="text/javascript" src="js/jquery.min.js"></script>
9        <script type="text/javascript" src="js/hwcrypto-legacy.js"></script>
10        <script type="text/javascript" src="js/hwcrypto.js"></script>
11        <script type="text/javascript" src="js/hex2base.js"></script>
12        <script type="text/javascript" src="js/forge.min.js"></script>
13        <script type="text/javascript" src="js/ajaxSetup.js"></script>
14        <script src="js/jquery.Jcrop.js"></script>
15       
16       
17        <script type="text/javascript" charset="utf-8">
18            var urlActiva = "https://"+window.location.hostname;
19            var jcrop_api;
20            $(document).ready(function() {
21                $.ajaxSetup({
22                    error:function(x,e){
23                        if(x.status==0){
24                            alert('Está fuera de línea!!\n Por favor chequee su conexión.');
25                        }else if(x.status==404){
26                            alert('La URL solicitada no fue encontrada.');
27                        }else if(x.status==500){
28                            alert('Error interno de servidor.');
29                        }else if(e=='parsererror'){
30                            alert('Error.\nSolicitud de interpretación de cadena JSON inválida.');
31                        }else if(e=='timeout'){
32                            alert('Tiempo de espera alcanzado.');
33                        }else {
34                            alert('Error desconocido.\n'+x.responseText);
35                        }
36                    }
37                });
38                $("#botonEnvia").click(enviaFormulario);
39                $("#botonCertificadoTarjeta").click(obtieneCertificado);
40                $("#botonPK12").click(cargaP12);
41                $("#botonImagen").click(cargaImagen);
42                $("#botonEstadisticas").click(verificaEstadisticas);
43                $("#botonSubeVerifica").click(cargaVerifica);
44                //$("#botonVerifica").click(ejecutaVerificacion);
45                $('#tablaImagen').css("display","none");
46                $("input[name=tipoPos]").click(cambioTipoPos)
47                descargarArchivo =  downQuery;
48            });
49            function showCoords(c){
50                var alto = parseInt($('#imagenPrevia').attr("height").replace("px",""));
51                $("#llx").val(c.x);
52                $("#lly").val(((alto-c.y)-c.h));
53                $("#urx").val(c.w);
54                $("#ury").val(c.h);
55            };
56
57            var descargarArchivo;
58            function ejecutaDescarga(){
59                var opciones = new Object();
60                opciones.onCompletado = solicitudCompletada;
61                opciones.onSend = antesEnvioSolicitud;
62                opciones.onExito = exitoSolicitud;
63                opciones.onProgreso = muestraProgreso;
64                opciones.tipoResultado="binary";
65                opciones.id="1";
66                descargarArchivo.dArchivo($(this).attr("linkDescarga"),opciones);
67            }
68           
69            function muestraProgreso(evt,xhr){
70                $("#progresoDescarga").html(evt.lengthComputable+"<br>");
71                if (evt.lengthComputable) {
72                    var percentComplete = evt.loaded / evt.total;
73                    percentComplete *= 100;
74                    $("#progresoDescarga").html(percentComplete.toFixed(2).replace(".",",")+" % Descargado");
75                }else{
76                    $("#progresoDescarga").html("Progreso solo<br>");
77                }
78            }
79            function errorSolicitud(xhr, ajaxOptions, errorArrojado) {
80                $("#progresoDescarga").append("Error");
81                $("#progresoDescarga").append("<br>");
82                $("#progresoDescarga").append(xhr.responseText);
83                $("#progresoDescarga").append("<br>");
84                $("#progresoDescarga").append(errorArrojado);
85                $("#progresoDescarga").append("<br>");
86
87            }
88            function antesEnvioSolicitud(evt,opciones) {
89                console.log("antesEnvioSolicitud")
90                console.log(opciones.id);
91                $("#progresoDescarga").html("Iniciando descarga");
92                //$("#progresoDescarga").html("antesEnvioSolicitud")
93            }
94            function solicitudCompletada(evt,state) {
95                console.log("solicitudCompletada");
96                console.log(evt.opciones.id)
97                $("#progresoDescarga").html("");
98                //$("#progresoDescarga").html("solicitudCompletada");
99            }
100            function exitoSolicitud(data, status, xhr) { 
101                if(data){
102                    //$("#progresoDescarga"+"B").append("Objetivo: " + xhr.opciones.url + "<br>");
103                    var nombreArchivo = descargarArchivo.obtieneNombre(xhr);
104                    //$("#progresoDescarga"+"B").append("Archivo: " + nombreArchivo + "<br>");
105                    var downloadUrl = URL.createObjectURL(data);
106                    if(xhr.opciones.id=="1"){
107                        $("#progresoDescarga").html("100% Descarga completada");
108                        var a = document.createElement("a");
109                        a.href = downloadUrl;
110                        a.download = nombreArchivo;
111                        document.body.appendChild(a);
112                        a.click();
113                    }/*else{
114                        var a = document.createElement("img");
115                        a.src = downloadUrl;
116                        document.body.appendChild(a);
117                    }*/
118                }
119                $("#progresoDescarga"+"B").append("exitoSolicitud 2<br>");
120            }
121           
122            var certificadoActivo;
123            var almacenDigitalActivo=false;
124            function obtieneCertificado(){
125                window.hwcrypto.getCertificate({lang: "en"}).then(function(response) {
126                    var cert = response;
127                    certificadoActivo = cert;
128                    console.log("Using certificate:\n" + hexToPem(response.hex));
129                    console.log("Using certificate(HEX):\n" + response.hex);
130                    if(totalArchivos.length>0){
131                        $("button[name^='botonFirma-'").attr("disabled",false);
132                    }
133                });
134            }
135           
136            var fileIdActivo;
137            function enviaFormulario(){
138                for(var n =0;n<$("#file-sign")[0].files.length;n++){
139                    var formData = new FormData();
140                    formData.append("upload", $("#file-sign")[0].files[n]);
141                    //alert(urlActiva+"/Murachi/0.4/archivos/");
142                    $.ajax({           
143                        url: urlActiva+"/Murachi/0.4/archivos/",
144                        type: "post",
145                        dataType: "json",
146                        data: formData,
147                        xhr: function() {
148                                var myXhr = $.ajaxSettings.xhr();
149                                if(myXhr.upload){
150                                    myXhr.upload.addEventListener('progress',progressUpload, false);
151                                }
152                                return myXhr;
153                        },
154                        cache: false,
155                        contentType: false,
156                        processData: false,
157                        headers: {"Authorization":"Basic YWRtaW46YWRtaW4="},
158                        success: function(response) {
159                            $("#respuesta").html("");
160                            for(var key in response) {
161                                $("#respuesta").html($("#respuesta").html()+"<br>"+response[key])
162                                console.log(key);
163                            }
164                            $("input[name=tipoPos]").attr("checked",false);
165                            incluyeArchivo(response);
166                            console.log(response)
167                            if(jcrop_api != null){
168                                jcrop_api.destroy();
169                            }
170                            $('#tablaImagen').css("display","none");
171                        },                                                             
172                            error: function(jqXHR, textStatus, errorThrown){
173                                console.log('error: ' + textStatus);
174                                //var responseText = jQuery.parseJSON(jqXHR.responseText);
175                                console.log('ajax error function: ' + jqXHR.responseText);
176                                $("#respuesta").html("error function: " + jqXHR.responseText);
177                            }
178                    })
179                }
180            }
181            function progressUpload(e){
182                if(e.lengthComputable){
183                    var max = e.total;
184                    var current = e.loaded;
185
186                    var Percentage = (current * 100)/max;
187                    console.log(Percentage);
188
189
190                    if(Percentage >= 100)
191                    {
192                       // process completed
193                        $("#progresoCarga").html("100 % (Carga completada)");
194                    }else{
195                        $("#progresoCarga").html((Percentage.toFixed(2).replace(".",","))+" %");
196                       
197                    }
198                } 
199            }
200           
201            function buscaPos(cod){
202                var obj = new Array();
203                var alto = parseInt($('#imagenPrevia').attr("height").replace("px",""));
204                var ancho = parseInt($('#imagenPrevia').attr("width").replace("px",""));
205                var anchoFirma = parseInt($('#urx').val());
206                var altoFirma = parseInt($('#ury').val());
207                obj["alto"] = altoFirma;
208                obj["ancho"] = anchoFirma;
209                if(cod==1){
210                    obj["x"] = 0;
211                    obj["y"] = (alto-altoFirma);
212                }else if(cod==2){
213                    obj["y"] = (alto-altoFirma);
214                    obj["x"] = ((ancho/2)-(anchoFirma/2));
215                }else if(cod==3){
216                    obj["y"] = (alto-altoFirma);
217                    obj["x"] = ((ancho)-anchoFirma);
218                }else if(cod==4){
219                    obj["x"] = 0;
220                    obj["y"] = ((alto/2)-(altoFirma/2));
221                }else if(cod==5){
222                    obj["y"] = ((alto/2)-(altoFirma/2));
223                    obj["x"] = ((ancho/2)-(anchoFirma/2));
224                }else if(cod==6){
225                    obj["y"] = ((alto/2)-(altoFirma/2));
226                    obj["x"] = (ancho-anchoFirma);
227                }else if(cod==7){
228                    obj["x"] = 0;
229                    obj["y"] = 0;
230                }else if(cod==8){
231                    obj["y"] = 0;
232                    obj["x"] = ((ancho/2)-(anchoFirma/2));
233                }else if(cod==9){
234                    obj["y"] = 0;
235                    obj["x"] = (ancho-anchoFirma);
236                }
237               
238                return obj;
239            }
240           
241            function cambioTipoPos(){
242                if(jcrop_api != null){
243                    jcrop_api.destroy();
244                }
245                if($(this).val()!=3){
246                    $('#tablaImagen').css("display","none");
247                    dimensionesActuales=null;
248                }else{
249                    var objArchivo = $("input[name=idArchivo]:checked");
250                    dimensionesActuales = new Array();
251                    dimensionesActuales["alto"] = objArchivo.attr("alto");
252                    dimensionesActuales["ancho"] = objArchivo.attr("ancho");
253                    dimensionesActuales["paginas"] = objArchivo.attr("paginas");
254                   
255                    $('#tablaImagen').css("display","block");
256                    $('#tablaImagen').attr("width",dimensionesActuales["ancho"]+"px");
257                    $('#tablaImagen').attr("style","border:1px solid #000000");
258                    $('#imagenPrevia').attr("width",dimensionesActuales["ancho"]+"px");
259                    $('#imagenPrevia').attr("height",dimensionesActuales["alto"]+"px");
260                    $('#imagenPrevia').Jcrop({
261                        onChange: showCoords,
262                        onSelect: showCoords,
263                        bgColor:     'black',
264                        bgOpacity:   .4
265                        },function(){
266                        jcrop_api = this;
267                      })
268                }
269            }
270            var dimensionesActuales;
271            function cambiaArchivo(){
272                if(jcrop_api != null){
273                    jcrop_api.destroy();
274                }
275                $('#tablaImagen').css("display","none");
276               
277            }
278            var hashtype = "SHA-256";
279            var lang = "eng";
280           
281            function procesaIndividual(){
282                    var cert = certificadoActivo;
283                    /*
284                    var fileId = fileIdActivo;
285                    var fileId = "7778827d-1e20-4e78-a49e-79f7862ec44d";
286                    */
287                    //console.log("Using certificate:\n" + hexToPem(response.hex));
288                    var continua = true;
289                    var mensajeContinua = "";
290                    var archivoEstimado = $(this).attr("id").replace("botonFirma-","");
291                    if($("input[name=fimaTarjeta]:checked").val()== undefined){
292                        if($("input[name=idArchivo]:checked").val()== archivoEstimado){
293                            if(!cert && !almacenDigitalActivo){
294                                alert("Debe seleccionar el certificado para firmar");
295                            //console.log("cert: "+ cert.hex);
296                            }else{
297                                var firmaVisible = false;
298                                if($("input[name=firmaVisible]:checked").val()==1){
299                                    firmaVisible = true;
300                                }
301                                if($("input[name=idArchivo]:checked").val()==undefined){
302                                    alert("Debe seleccionar primero un archivo");
303                                }else{
304                                   
305                                    if($("input[name=tipoPos]:checked").val()==undefined || $("input[name=tipoPos]:checked").val()==1){
306                                        var alto = parseInt($('#imagenPrevia').attr("height").replace("px",""));
307                                        var ancho = parseInt($('#imagenPrevia').attr("width").replace("px",""));
308                                       
309                                        $("#llx").val(0);
310                                        $("#lly").val(50);
311                                        $("#urx").val(100);
312                                        $("#ury").val(50);
313                                       
314                                    }else if($("input[name=tipoPos]:checked").val()==2){
315                                        if($("input[name=tipoPos]:checked").val()==undefined){
316                                            continua = false;
317                                            mensajeContinua = "Debe seleccionar la posición de la firma";
318                                        }else{
319                                            var pos = buscaPos($("input[name=posFijo]:checked").val());
320                                            $("#llx").val(pos["x"]);
321                                            $("#lly").val(pos["y"]);
322                                            $("#urx").val(pos["ancho"]);
323                                            $("#ury").val(pos["alto"]);
324                                        }
325                                    }else if($("input[name=tipoPos]:checked").val()==3){
326                                        var api = jcrop_api;
327                                        //alert(api.tellSelect().x+"|"+api.tellSelect().y+"|"+($('#imagenPrevia').attr("width"))+"|"+($('#imagenPrevia').attr("height")-api.tellSelect().y)+"|"+api.tellSelect().w+"|"+api.tellSelect().h)
328                                        var alto = parseInt($('#imagenPrevia').attr("height").replace("px",""));
329                                        $("#llx").val(api.tellSelect().x);
330                                        $("#lly").val(((alto-api.tellSelect().y)-api.tellSelect().h));
331                                        $("#urx").val(api.tellSelect().w);
332                                        $("#ury").val(api.tellSelect().h);
333                                    }
334                                    if(!cert){
335                                        var certificado = "";
336                                    }else{
337                                        certificado = cert.hex;
338                                    }
339                                    var muestraImagen = false;
340                                    if($("input[name=muestraImagen]:checked").val()==1){
341                                        muestraImagen = true;
342                                    }
343                                    var muestraImagenSola = false;
344                                    if($("input[name=muestraImagenSola]:checked").val()==1){
345                                        muestraImagenSola = true;
346                                    }
347                                    var ancho = 100;
348                                    if(!isNaN(parseInt($("#urx").val()))){
349                                        ancho = parseInt($("#urx").val());
350                                    }
351                                    var alto = 100;
352                                    if(!isNaN(parseInt($("#ury").val()))){
353                                        alto = parseInt($("#ury").val());
354                                    }
355                                    var posX = 100;
356                                    if(!isNaN(parseInt($("#llx").val()))){
357                                        posX = parseInt($("#llx").val());
358                                    }
359                                    var posY = 100;
360                                    if(!isNaN(parseInt($("#lly").val()))){
361                                        posY = parseInt($("#lly").val());
362                                    }
363                                    var urlFirma = urlActiva+"/Murachi/0.4/archivos/pdfs";
364                                    var firmaPK12 = false;
365                                    var clavePCKS12 ="";
366                                    var imagenAdjunta = "";
367                                    var tsa = false;
368                                    if($("input[name=tsa]:checked").val()==1){
369                                        tsa = true;   
370                                    }
371                                    if(imagenId!=null){
372                                        imagenAdjunta = imagenId;
373                                    }
374                                    if($("input[name=firmaTarjeta]:checked").val()==2){
375                                        if($("#clavePCKS12").val()!=""){
376                                            urlFirma = urlActiva+"/Murachi/0.4/archivos/pdfsPk";
377                                            firmaPK12 = true;
378                                            clavePCKS12 = $("#clavePCKS12").val();
379                                        }else{
380                                            continua = false;
381                                            mensajeContinua = "Debe ingresar la clave del almacén digital para poder continuar"
382                                        }
383                                    }
384                                    if(continua){
385                                        //alert(urlFirma)
386                                        var fileId = $("input[name=idArchivo]:checked").val();
387                                        var parameters = JSON.stringify({
388                                            "fileId":fileId,
389                                            "certificate":certificado,
390                                            "reason":$("#razon").val(),
391                                            "location":$("#lugar").val(),
392                                            "contact":$("#contacto").val(),
393                                            "rotacion":$("#rotacion").val(),
394                                            "pagina":$("#pagina").val(),
395                                            "pk12":firmaPK12,
396                                            "clavePCKS12":clavePCKS12,
397                                            "almacenPCKS12":almacenId,
398                                            "signatureVisible":firmaVisible,
399                                            "lly":posY,
400                                            "llx":posX,
401                                            "ury":posY+alto,
402                                            "urx":posX+ancho,
403                                            "muestraImagen":muestraImagen,
404                                            "muestraImagenSola":muestraImagenSola,
405                                            "imagen":imagenAdjunta,
406                                            "tsa":tsa
407                                            });
408
409                                        // ahora llamar al ajax de obtener la resena del pdf
410                                        if($("input[name=firmaTarjeta]:checked").val()==1){
411                                            //alert(1)
412                                            $.ajax({
413                                                url:urlFirma,
414                                                type: "post",
415                                                dataType: "json",
416                                                data: parameters,
417                                                contentType: "application/json",
418                                                headers: {"Authorization":"Basic YWRtaW46YWRtaW4="},
419                                                success: function(data, textStatus, jqXHR){
420                                                    for(var key in data) {
421                                                        $("#respuesta").html($("#respuesta").html()+"<br>"+data[key])
422                                                        console.log(key);
423                                                    }
424                                                    console.log(data)
425                                                    hashActual = data['hash']; 
426                                                    sesionActual = data['sessionId'];
427                                                     window.hwcrypto.sign(certificadoActivo, {type: hashtype, hex: hashActual}, {lang: lang}).then(function(signature) {
428                                                        var firmaActual = signature;
429                                                        console.log(hexToPem(signature.hex));
430                                                        console.log(signature.hex);
431                                                        var fileIdAct = $("input[name=idArchivo]:checked").val();
432
433                                                        $.ajax({
434                                                            type: 'POST',
435                                                            contentType: 'application/json',
436                                                            //url:"https://192.168.12.125:8443/Murachi/0.1/archivos/pdfs/resenas",
437                                                            url:urlActiva+"/Murachi/0.4/archivos/pdfs/resenas",
438                                                            dataType: 'json',
439                                                            data: JSON.stringify({"signature":firmaActual.hex,fileId:fileIdAct,tsa:tsa}),
440                                                            headers: {"Authorization":"Basic YWRtaW46YWRtaW4="},
441                                                            success: function(data, textStatus, jqXHR){
442                                                                for(var key in data) {
443                                                                    $("#respuesta").html($("#respuesta").html()+"<br>"+data[key])
444                                                                    console.log(key);
445                                                                    var linkToDownload = "<a href=\""+urlActiva+"/Murachi/0.4/archivos/descargas/" + data['signedFileId'] +"\">descargar archivo firmado</a>";
446                                                                    $("#respuesta").html($("#respuesta").html()+"<br>"+linkToDownload);
447                                                                    idFileDescargaActual = data['signedFileId'];
448                                                                }
449                                                                console.log(data);
450                                                                $("#botonDescarga-"+archivoEstimado).attr("linkDescarga",urlActiva+"/Murachi/0.4/archivos/descargas/" + data['signedFileId']);
451                                                                $("#botonDescarga-"+archivoEstimado).attr("disabled",false);
452                                                            }, function(err) {
453                                                                var error;
454                                                                if(err == "Error: user_cancel") {
455                                                                    console.log("getCertificate() failed: El usuario cancelo la operación"    );
456                                                                    error = "El usuario cancelo la operación"; 
457                                                                 }     
458                                                                 else if(err == "Error: no_certificates") {
459                                                                     console.log("getCertificate() failed: No hay certificado disponible")    ;
460                                                                     error = "No hay certificado disponible";
461                                                                 }
462                                                                 else if(err == "Error: no_implementation") {
463                                                                     console.log("getCertificate() failed: No hay soporte para el manejo del certificado");
464                                                                     error = "No hay soporte para el manejo del certificado";
465                                                                }
466                                                                $("#respuesta").html("getCertificate() failed: " + error);
467                                                           }
468                                                        });
469                                                    })
470
471
472
473                                                }, function(err) {
474                                                    var error;
475                                                    if(err == "Error: user_cancel") {
476                                                        console.log("getCertificate() failed: El usuario cancelo la operación"    );
477                                                        error = "El usuario cancelo la operación"; 
478                                                     }     
479                                                     else if(err == "Error: no_certificates") {
480                                                         console.log("getCertificate() failed: No hay certificado disponible")    ;
481                                                         error = "No hay certificado disponible";
482                                                     }
483                                                     else if(err == "Error: no_implementation") {
484                                                         console.log("getCertificate() failed: No hay soporte para el manejo del certificado");
485                                                         error = "No hay soporte para el manejo del certificado";
486                                                    }
487                                                    $("#respuesta").html("getCertificate() failed: " + error);
488                                               }
489                                            });
490                                       
491                                        }else{
492                                            //alert(2)
493                                            $.ajax({
494                                                url: urlFirma,
495                                                type: "post",
496                                                dataType: "json",
497                                                data: parameters,
498                                                contentType: "application/json",
499                                                headers: {"Authorization":"Basic YWRtaW46YWRtaW4="},
500                                                success: function(data, textStatus, jqXHR){
501                                                    for(var key in data) {
502                                                        $("#respuesta").html($("#respuesta").html()+"<br>"+data[key])
503                                                        console.log(key);
504                                                    }
505                                                    console.log(data)
506                                                    $("#botonFirma-"+archivoEstimado).attr("disabled",true);
507                                                    if(!almacenDigitalActivo){
508
509                                                    }else{
510                                                        var linkDescarga = "<a href=\""+urlActiva+"/Murachi/0.4/archivos/descargas/" + data['fileId'] +"\">descargar archivo firmado</a>";
511                                                        $("#respuesta").html($("#respuesta").html()+"<br>"+linkDescarga);
512                                                        idFileDescargaActual = data['fileId'];
513                                                        $("#botonDescarga-"+archivoEstimado).attr("linkDescarga",urlActiva+"/Murachi/0.4/archivos/descargas/" + data['fileId']);
514                                                        $("#botonDescarga-"+archivoEstimado).attr("disabled",false);
515                                                    }
516
517
518                                                }, function(err) {
519                                                    var error;
520                                                    if(err == "Error: user_cancel") {
521                                                        console.log("getCertificate() failed: El usuario cancelo la operación"    );
522                                                        error = "El usuario cancelo la operación"; 
523                                                     }     
524                                                     else if(err == "Error: no_certificates") {
525                                                         console.log("getCertificate() failed: No hay certificado disponible")    ;
526                                                         error = "No hay certificado disponible";
527                                                     }
528                                                     else if(err == "Error: no_implementation") {
529                                                         console.log("getCertificate() failed: No hay soporte para el manejo del certificado");
530                                                         error = "No hay soporte para el manejo del certificado";
531                                                    }
532                                                    $("#respuesta").html("getCertificate() failed: " + error);
533                                               }
534                                            });
535                                        }
536                                    }else{
537                                        alert(mensajeContinua);
538                                    }
539                                }
540                            }
541                        }else{
542                            alert("Debe seleccionar este archivo para poder firmarlo")
543                        }
544                    }else{
545                        alert("Debe seleccionar un método de firma")
546                    }
547            }
548            function reemplazaCadena(busca,cambia,texto){
549                while(texto.indexOf(busca)>-1){
550                    texto = texto.replace(busca,cambia);
551                }
552                return texto;
553            }
554            var totalArchivos = new Array();
555            function incluyeArchivo(response){
556                var idArchivo = response["fileId"];
557                totalArchivos.push(idArchivo);
558                var archivoNuevo = '<tr id="archivo-'+idArchivo+'">'+$("#archivoPrototipo").html()+'</tr>';
559                archivoNuevo = reemplazaCadena('/-idArchivo-/',idArchivo,archivoNuevo);
560                archivoNuevo = reemplazaCadena('/-ancho-/',response["ancho"],archivoNuevo);
561                archivoNuevo = reemplazaCadena('/-alto-/',response["alto"],archivoNuevo);
562                archivoNuevo = reemplazaCadena('/-paginas-/',response["paginas"],archivoNuevo);
563                archivoNuevo = reemplazaCadena('/-valorArchivo-/',idArchivo,archivoNuevo);
564                archivoNuevo = reemplazaCadena('/-valorRadioArchivo-/',idArchivo,archivoNuevo);
565                //archivoNuevo = reemplazaCadena('"montoUnitarioArticulo-"','"montoUnitarioArticulo-'+indice+'"',archivoNuevo);
566                //archivoNuevo = reemplazaCadena('"montoTotalArticulo-"','"montoTotalArticulo-'+indice+'"',archivoNuevo);
567                //archivoNuevo = reemplazaCadena('"cantidadArticulo-n-oferta"','"cantidadArticulo-'+indice+'-oferta"',archivoNuevo);
568                //archivoNuevo = reemplazaCadena('"montoUnitarioArticulo-n-oferta"','"montoUnitarioArticulo-'+indice+'-oferta"',archivoNuevo);
569                //archivoNuevo = reemplazaCadena('"montoTotalArticulo-n-oferta"','"montoTotalArticulo-'+indice+'-oferta"',archivoNuevo);
570                //archivoNuevo = reemplazaCadena('"botonEliminaArticulo-"','"botonEliminaArticulo-'+indice+'"',archivoNuevo);
571                //archivoNuevo = reemplazaCadena('"marcaArticulo-"','"marcaArticulo-'+indice+'"',archivoNuevo);
572                //archivoNuevo = reemplazaCadena('"exoneraArticulo-"','"exoneraArticulo-'+indice+'"',archivoNuevo);
573
574                //$("#tablaArticulos").append(archivoNuevo);
575                $(archivoNuevo).insertBefore("#totalArchivos");
576                $("input[name=idArchivo]").unbind('click');
577                $("input[name=idArchivo]").click(cambiaArchivo);
578                $("#botonFirma-"+idArchivo).click(procesaIndividual);
579                $("#botonDescarga-"+idArchivo).click(ejecutaDescarga);
580                var activo = false;
581                if(!certificadoActivo && !almacenDigitalActivo){
582                    activo = true;
583                }
584                $("#botonFirma-"+idArchivo).attr("disabled",activo);
585                $("#botonDescarga-"+idArchivo).attr("disabled",true);
586                $("#sinArchivos").css("display","none");
587                $("#archivo-"+idArchivo).css("display","block");
588                $("#cantArchivos").html(totalArchivos.length+" Archivos por firma")
589            }
590            var almacenId = "";
591            function cargaP12(){
592                if($("#p12")[0].files.length>0){
593                    var formData = new FormData();
594                    formData.append("upload", $("#p12")[0].files[0]);
595                    $.ajax({           
596                        url: urlActiva+"/Murachi/0.4/archivos/p12",
597                        type: "post",
598                        dataType: "json",
599                        data: formData,
600                        xhr: function() {
601                                var myXhr = $.ajaxSettings.xhr();
602                                if(myXhr.upload){
603                                    myXhr.upload.addEventListener('progress',progressUpload, false);
604                                }
605                                return myXhr;
606                        },
607                        cache: false,
608                        contentType: false,
609                        processData: false,
610                        headers: {"Authorization":"Basic YWRtaW46YWRtaW4="},
611                        success: function(response) {
612                            $("#respuesta").html("");
613                            for(var key in response) {
614                                $("#respuesta").html($("#respuesta").html()+"<br>"+response[key])
615                                console.log(key);
616                            }
617                            almacenDigitalActivo = true;
618                            almacenId = response["fileId"];
619                            $("#mensajeP12").html("Archivo almacen digital PCKS12 cargado")
620                            if(totalArchivos.length>0){
621                                $("button[name^='botonFirma-'").attr("disabled",false);
622                            }
623                            console.log(response)
624
625                        },                                                             
626                            error: function(jqXHR, textStatus, errorThrown){
627                                console.log('error: ' + textStatus);
628                                //var responseText = jQuery.parseJSON(jqXHR.responseText);
629                                console.log('ajax error function: ' + jqXHR.responseText);
630                                $("#respuesta").html("error function: " + jqXHR.responseText);
631                            }
632                    })
633                }else{
634                    alert("Debe seleccionar un almacén digital de firma primero")
635                }
636            }
637            var imagenActiva = false;
638            var imagenId = "";
639            function cargaImagen(){
640                if($("#imagen")[0].files.length>0){
641                    var formData = new FormData();
642                    formData.append("upload", $("#imagen")[0].files[0]);
643                    $.ajax({           
644                        url: urlActiva+"/Murachi/0.4/archivos/imagenAdjunta",
645                        type: "post",
646                        dataType: "json",
647                        data: formData,
648                        xhr: function() {
649                                var myXhr = $.ajaxSettings.xhr();
650                                if(myXhr.upload){
651                                    myXhr.upload.addEventListener('progress',progressUpload, false);
652                                }
653                                return myXhr;
654                        },
655                        cache: false,
656                        contentType: false,
657                        processData: false,
658                        headers: {"Authorization":"Basic YWRtaW46YWRtaW4="},
659                        success: function(response) {
660                            $("#respuesta").html("");
661                            for(var key in response) {
662                                $("#respuesta").html($("#respuesta").html()+"<br>"+response[key])
663                                console.log(key);
664                            }
665                            imagenActiva = true;
666                            imagenId = response["fileId"];
667                            $("#mensajeImagen").html("Archivo imagen cargado")
668                            console.log(response)
669
670                        },                                                             
671                            error: function(jqXHR, textStatus, errorThrown){
672                                console.log('error: ' + textStatus);
673                                //var responseText = jQuery.parseJSON(jqXHR.responseText);
674                                console.log('ajax error function: ' + jqXHR.responseText);
675                                $("#respuesta").html("error function: " + jqXHR.responseText);
676                            }
677                    })
678                }else{
679                    alert("Debe seleccionar un archivo digital primero")
680                }
681            }
682           
683            function cargaVerifica(){
684                if($("#archivoVerifica")[0].files.length>0){
685                    var formData = new FormData();
686                    formData.append("upload", $("#archivoVerifica")[0].files[0]);
687                    $.ajax({           
688                        url: urlActiva+"/Murachi/0.4/archivos/firmados",
689                        type: "post",
690                        dataType: "json",
691                        data: formData,
692                        xhr: function() {
693                                var myXhr = $.ajaxSettings.xhr();
694                                if(myXhr.upload){
695                                    myXhr.upload.addEventListener('progress',progressVerifica, false);
696                                }
697                                return myXhr;
698                        },
699                        cache: false,
700                        contentType: false,
701                        processData: false,
702                        headers: {"Authorization":"Basic YWRtaW46YWRtaW4="},
703                        success: function(response) {
704                            $("#mensajeVerifica").html("Archivo subido correctamente");
705                            for(var key in response) {
706                                //$("#mensajeVerifica").html($("#mensajeVerifica").html()+"<br>"+response[key])
707                                console.log(key);
708                            }
709                            console.log(response)
710                            $("#mensajeVerifica").html($("#mensajeVerifica").html()+"<br>Cantidad de firmas en el documento: "+response["numberOfSignatures"]);
711                            if(response["numberOfSignatures"]>0){
712                                $("#mensajeVerifica").html($("#mensajeVerifica").html()+"<br>Firmantes del documento: ");
713                               
714                                for(var n=0;n<response["signatures"].length;n++){
715                                    var datosFirmante = new Array();
716                                    datosFirmante.push("Nombre firmante: "+response["signatures"][n]["nameOfTheSigner"]);
717                                    datosFirmante.push("Fecha de la firma: "+response["signatures"][n]["signedOn"]);
718                                    var validez = "No";
719                                    if(response["signatures"][n]["signerCertificateStillValid"]){
720                                        validez = "Si";
721                                    }
722                                    datosFirmante.push("Certificado válido: "+validez);
723                                    //datosFirmante.push("Fecha límite de la validez del certificado: "+response["signatures"][n]["signerCertificateValidTo"]);
724                                    //datosFirmante.push("Nombre: "+response["signatures"][n][""]);
725                                    $("#mensajeVerifica").html($("#mensajeVerifica").html()+"<blockquote>"+datosFirmante.join("<br>")+"</blockquote>");
726                                }
727                            }
728
729                        },                                                             
730                            error: function(jqXHR, textStatus, errorThrown){
731                                console.log('error: ' + textStatus);
732                                //var responseText = jQuery.parseJSON(jqXHR.responseText);
733                                console.log('ajax error function: ' + jqXHR.responseText);
734                                $("#respuesta").html("error function: " + jqXHR.responseText);
735                                archivoVerificarId = null;
736                            }
737                    })
738                }else{
739                    alert("Debe seleccionar un archivo para verificar primero")
740                }
741            }
742           
743           
744            function progressVerifica(e){
745                if(e.lengthComputable){
746                    var max = e.total;
747                    var current = e.loaded;
748
749                    var Percentage = (current * 100)/max;
750                    console.log(Percentage);
751
752
753                    if(Percentage >= 100)
754                    {
755                       // process completed
756                        $("#progresoVerifica").html("100 % (Carga completada)");
757                    }else{
758                        $("#progresoVerifica").html((Percentage.toFixed(2).replace(".",","))+" %");
759                       
760                    }
761                } 
762            }
763
764            function verificaEstadisticas(){
765                $.ajax({           
766                        url: urlActiva+"/Murachi/0.4/archivos/estadisticas",
767                        type: "get",
768                        dataType: "json",
769                        xhr: function() {
770                                var myXhr = $.ajaxSettings.xhr();
771                                if(myXhr.upload){
772                                    myXhr.upload.addEventListener('progress',progressUpload, false);
773                                }
774                                return myXhr;
775                        },
776                        cache: false,
777                        contentType: false,
778                        processData: false,
779                        headers: {"Authorization":"Basic YWRtaW46YWRtaW4="},
780                        success: function(response) {
781                            $("#respuesta").html("");
782                            for(var key in response) {
783                                $("#respuesta").html($("#respuesta").html()+"<br>"+response[key])
784                                console.log(key);
785                            }
786                            console.log(response)
787
788                        },                                                             
789                            error: function(jqXHR, textStatus, errorThrown){
790                                console.log('error: ' + textStatus);
791                                //var responseText = jQuery.parseJSON(jqXHR.responseText);
792                                console.log('ajax error function: ' + jqXHR.responseText);
793                                $("#respuesta").html("error function: " + jqXHR.responseText);
794                            }
795                    })
796            }
797        </script>
798
799        </head> 
800
801
802    <body>
803        <table width="1200" border="0" cellspacing="2" cellpadding="5" id="tablaArticulos" align="center">
804            <tr>
805                <td colspan="4" style="text-align:center;">SELECCIONE UN ARCHIVO PARA COLOCARLO</td>
806            </tr>
807            <tr>
808                <td colspan="4" style="text-align:left;"><input id="file-sign" type="file" data-min-file-count="1" name="upload" multiple ></td>
809            </tr>
810            <tr>
811                <td colspan="4" style="text-align:left;"><button type="button" class="button" name="botonEnvia" id="botonEnvia">Cargar archivos</button></td>
812            </tr>
813            <tr>
814                <td colspan="4" style="text-align:left;" id="progresoCarga">&nbsp;</td>
815            </tr>
816            <tr>
817                <td colspan="4" style="text-align:left;" id="progresoDescarga">&nbsp;</td>
818            </tr>
819           
820            <tr>
821                <td colspan="4" style="text-align:center;">ARCHIVOS INCLUIDOS PARA LA FIRMA</td>
822            </tr>
823            <td colspan="4" id="sinArchivos" align="center" valign="middle" height="40">
824                <strong>No se han ingresado items aún</strong>
825            </td>
826            <tr id="archivoPrototipo" style="display:none;">
827                <td style="text-align:left;" width="20"><input type="hidden" value="/-valorArchivo-/" id="/-idArchivo-/" name="/-idArchivo-/"/><input type="radio" id="idArchivo" name="idArchivo" value="/-valorRadioArchivo-/" ancho="/-ancho-/" alto="/-alto-/" paginas="/-paginas-/"/></td>
828                <td style="text-align:left;" width="480">/-valorArchivo-/</td>
829                <td style="text-align:left;" width="150"><button type="button" class="button" name="botonFirma-/-idArchivo-/" id="botonFirma-/-idArchivo-/" disabled>Firma Archivo</button></td>
830                <td style="text-align:left;" width="180"><button type="button" class="button" name="botonDescarga-/-idArchivo-/" id="botonDescarga-/-idArchivo-/" disabled>Descarga Archivo</button></td>
831            </tr>
832            <tr id="totalArchivos">
833                <td colspan="4" style="text-align:center;"  id="cantArchivos">&nbsp;</td>
834            </tr>
835            <tr>
836                <td colspan="4" style="text-align:center;">
837                                    <table width="1200" border="0" cellspacing="2" cellpadding="5"  align="center">
838                        <tr>
839                <td style="text-align:left;">Razon: <input type="text" value="" id="razon" name="razon"/></td>
840                <td style="text-align:left;">Lugar: <input type="text" value="" id="lugar" name="lugar"/></td>
841                <td style="text-align:left;">Contacto: <input type="text" value="" id="contacto" name="contacto"/></td>
842                                        </tr>
843                    </table>
844                </td>
845            </tr>
846           
847            <tr>
848                <td style="text-align:left;" width="20" colspan="4">
849                    <input type="radio" id="firmaTarjeta" name="firmaTarjeta" value="1"/>Se firmará con tarjeta Smartcard
850                </td>
851            </tr>
852            <tr>
853                <td colspan="4" style="text-align:center;">
854                    FIRMA CON TARJETA
855                </td>
856            </tr>
857           
858            <tr>
859                <td colspan="4" style="text-align:center;">
860                    <button type="button" class="button" name="botonCertificadoTarjeta" id="botonCertificadoTarjeta">Obtiene Certificado desde Tarjeta</button>
861                </td>
862            </tr>
863            <tr>
864                <td colspan="4" style="text-align:center;">
865                    FIRMA CON CERTIFICADO DIGITAL (.P12)
866                </td>
867            </tr>
868            <tr>
869                <td style="text-align:left;" width="20" colspan="4">
870                    <input type="radio" id="firmaTarjeta" name="firmaTarjeta" value="2" checked/>Se firmará con almacén digital
871                </td>
872            </tr>
873            <tr>
874                <td colspan="4" style="text-align:left;">
875                    <input id="p12" type="file" data-min-file-count="1" name="p12">
876                </td>
877            </tr>
878            <tr>
879                <td colspan="4" style="text-align:center;" id="mensajeP12">
880                    &nbsp;
881                </td>
882            </tr>
883            <tr>
884                <td style="text-align:left;" colspan="2" width="500">
885                    CLAVE DEL ALMACEN: <input type="password" value="" id="clavePCKS12" name="clavePCKS12"/>
886                </td>
887                <td style="text-align:left;" width="150">&nbsp;</td>
888                <td style="text-align:left;" width="150">&nbsp;</td>
889                <td style="text-align:left;" width="150">&nbsp;</td>
890            </tr>
891           
892            <tr>
893                <td colspan="4" style="text-align:center;">
894                    <button type="button" class="button" name="botonPK12" id="botonPK12">Carga PKCS 12</button>
895                </td>
896            </tr>
897           
898            <tr>
899                <td colspan="4" style="text-align:center;">
900                    &nbsp;
901                </td>
902            </tr>
903            <tr>
904                <td colspan="4" style="text-align:center;">
905                    CARACTERÍSTICAS A MOSTRAR
906                </td>
907            </tr>
908            <tr>
909                <td colspan="4" style="text-align:center;">
910               
911                                    <table width="900" border="0" cellspacing="2" cellpadding="5"  align="center">
912                <tr>
913                    <td style="text-align:left;" colspan="2">COLOCAR SERVICIO DE ESTAMPADO DE TIEMPO</td>
914                </tr>
915                <tr>
916                    <td style="text-align:left;" width="450"><input type="radio" id="tsa" name="tsa" value="1" checked/>Si</td>
917                    <td style="text-align:left;" width="450"><input type="radio" id="tsa" name="tsa" value="0"/>No</td>
918                </tr>
919                </table>
920                </td>
921            </tr>           
922            <tr>
923                <td style="text-align:left;" width="20" colspan="4">
924                    <input type="radio" id="firmaVisible" name="firmaVisible" value="1" checked/>Firma Visible
925                </td>
926            </tr>
927            <tr>
928                <td colspan="4" style="text-align:center;">
929               
930                <table width="1000" border="0" cellspacing="2" cellpadding="5"  align="center">
931                    <tr>
932                        <td style="text-align:left;" width="200">Pos X<br><input type="text" value="0" id="llx" name="llx"/></td>
933                        <td style="text-align:left;" width="200">Pos Y<br><input type="text" value="0" id="lly" name="lly"/></td>
934                        <td style="text-align:left;" width="200">Ancho<br><input type="text" value="100" id="urx" name="urx"/></td>
935                        <td style="text-align:left;" width="200">Alto<br><input type="text" value="50" id="ury" name="ury"/></td>
936                        <td style="text-align:left;" width="200">Rotación<br><input type="text" value="0" id="rotacion" name="rotacion"/></td>
937                    </tr>
938
939                    <tr>
940                        <td style="text-align:left;" colspan="5">Página<br><input type="text" value="1" id="pagina" name="pagina"/></td>
941                    </tr>
942                </table>
943                </td>
944            </tr>
945            <tr>
946                <td style="text-align:left;" width="20" colspan="4">
947                    <input type="radio" id="firmaVisible" name="firmaVisible" value="2"/>Firma no Visible
948                </td>
949            </tr>
950           
951           
952            <tr>
953                <td colspan="4" style="text-align:center;">
954                    IMÁGEN ADJUNTA AL MENSAJE
955                </td>
956            </tr>
957           
958            <tr>
959                <td colspan="4" style="text-align:left;"><input id="imagen" name="imagen" type="file" data-min-file-count="1" name="min"></td>
960            </tr>
961            <tr>
962                <td colspan="4" style="text-align:center;" id="mensajeImagen">
963                    &nbsp;
964                </td>
965            </tr>
966            <tr>
967                <td colspan="4" style="text-align:center;">
968                    <button type="button" class="button" name="botonImagen" id="botonImagen">Carga Imágen</button>
969                </td>
970            </tr>
971           
972            <tr>
973                <td style="text-align:left;" width="20" colspan="4">
974                    <input type="radio" id="muestraImagen" name="muestraImagen" value="1"/>Muestra Imágen
975                </td>
976            </tr>
977            <tr>
978                <td style="text-align:left;" width="20" colspan="4">
979                    <input type="radio" id="muestraImagen" name="muestraImagen" value="2" checked/>No muestra imágen
980                </td>
981            </tr>
982           
983            <tr>
984                <td style="text-align:left;" width="20" colspan="4">
985                    <input type="radio" id="muestraImagenSola" name="muestraImagenSola" value="1"/>Muestra imagen sola
986                </td>
987            </tr>
988            <tr>
989                <td style="text-align:left;" width="20" colspan="4">
990                    <input type="radio" id="muestraImagenSola" name="muestraImagenSola" value="2" checked/>No muestra imagen sola
991                </td>
992            </tr>
993           <tr>
994                <td colspan="4" style="text-align:center;">
995                    POSICIONAMIENTO
996                </td>
997            </tr>
998            <tr>
999                <td style="text-align:left;" width="20" colspan="4">
1000                    <input type="radio" id="tipoPos" name="tipoPos" value="1" checked/>Por defecto
1001                </td>
1002            </tr>
1003            <tr>
1004                <td style="text-align:left;" width="20" colspan="4">
1005                    <input type="radio" id="tipoPos" name="tipoPos" value="2"/>Predeterminado
1006                </td>
1007            </tr>
1008           
1009            <tr>
1010                <td colspan="4" style="text-align:center;">
1011                   <table width="120" border="0" cellspacing="2" cellpadding="5" align="center">
1012                     <tr>
1013                        <td style="text-align:center;" width="40">
1014                            <input type="radio" id="posFijo" name="posFijo" value="1"/>
1015                        </td>
1016                         <td style="text-align:center;" width="40">
1017                            <input type="radio" id="posFijo" name="posFijo" value="2"/>
1018                        </td>
1019                         <td style="text-align:center;" width="40">
1020                            <input type="radio" id="posFijo" name="posFijo" value="3"/>
1021                        </td>
1022                    </tr> 
1023                    <tr>
1024                        <td style="text-align:center;" width="40">
1025                            <input type="radio" id="posFijo" name="posFijo" value="4"/>
1026                        </td>
1027                         <td style="text-align:center;" width="40">
1028                            <input type="radio" id="posFijo" name="posFijo" value="5"/>
1029                        </td>
1030                         <td style="text-align:center;" width="40">
1031                            <input type="radio" id="posFijo" name="posFijo" value="6"/>
1032                        </td>
1033                    </tr>
1034                    <tr>
1035                        <td style="text-align:center;" width="40">
1036                            <input type="radio" id="posFijo" name="posFijo" value="7"/>
1037                        </td>
1038                         <td style="text-align:center;" width="40">
1039                            <input type="radio" id="posFijo" name="posFijo" value="8"/>
1040                        </td>
1041                         <td style="text-align:center;" width="40">
1042                            <input type="radio" id="posFijo" name="posFijo" value="9"/>
1043                        </td>
1044                    </tr>
1045                    </table>
1046                </td>
1047            </tr>
1048                        <tr>
1049                <td style="text-align:left;" width="20" colspan="4">
1050                    <input type="radio" id="tipoPos" name="tipoPos" value="3"/>Personalizado
1051                </td>
1052            </tr>
1053            <tr>
1054                <td colspan="4" style="text-align:center;">
1055                    <table width="1200" border="0" cellspacing="2" cellpadding="5" id="tablaImagen" align="center">
1056                        <tr>
1057                            <td>
1058                                <img src="img/pixelBlanco.jpg" width="0" height="0" style="border:0px solid #000000;" id="imagenPrevia"/>
1059                            </td>
1060                        </tr>
1061                    </table>
1062                </td>
1063            </tr>
1064           
1065            <tr>
1066                <td colspan="4" style="text-align:center;">
1067                    &nbsp;
1068                </td>
1069            </tr>
1070            <tr>
1071                <td colspan="4" style="text-align:center;">
1072                    &nbsp;
1073                </td>
1074            </tr>
1075            <tr>
1076                <td colspan="4" style="text-align:center;">
1077                    VERIFICACIÓN DE FIRMAS
1078                </td>
1079            </tr>
1080           
1081            <tr>
1082                <td colspan="4" style="text-align:left;"><input id="archivoVerifica" name="archivoVerifica" type="file" data-min-file-count="1" name="min"></td>
1083            </tr>
1084            <tr>
1085                <td colspan="4" style="text-align:center;" id="progresoVerifica">
1086                    &nbsp;
1087                </td>
1088            </tr>
1089            <tr>
1090                <td colspan="4" style="text-align:center;" id="mensajeVerifica">
1091                    &nbsp;
1092                </td>
1093            </tr>
1094            <tr>
1095                <td colspan="4" style="text-align:center;">
1096                    <button type="button" class="button" name="botonSubeVerifica" id="botonSubeVerifica">Carga Archivo a Verificar</button>
1097                </td>
1098            </tr>
1099            <tr>
1100                <td colspan="4" style="text-align:center;">
1101                    &nbsp;
1102                </td>
1103            </tr>
1104            <tr>
1105                <td colspan="4" style="text-align:center;">
1106                    <button type="button" class="button" name="botonVerifica" id="botonVerifica">Verifica Archivo</button>
1107                </td>
1108            </tr>
1109            <tr>
1110                <td colspan="4" style="text-align:center;" id="mensajeVerificacion">
1111                    &nbsp;
1112                </td>
1113            </tr>
1114            <tr>
1115                <td colspan="4" style="text-align:center;">
1116                    <button type="button" class="button" name="botonEstadisticas" id="botonEstadisticas">Obtiene estadisticas</button>
1117                </td>
1118            </tr>
1119           
1120        </table>
1121       
1122        </body>
1123</html>
Note: See TracBrowser for help on using the repository browser.