Changeset 0500480 in prototipo_portal_2018


Ignore:
Timestamp:
Oct 25, 2017, 2:00:40 PM (7 years ago)
Author:
José Sulbarán <jsulbaran@…>
Branches:
master
Children:
445bdb4
Parents:
307a8cc
Message:

Se modificaron las bottones y las funcionalidades de draggable

Location:
prototipo
Files:
2 added
4 edited

Legend:

Unmodified
Added
Removed

  • prototipo/index.html

    r307a8cc r0500480  
    106106            <li><a href="#" id="btn-1" class="list-group-item list-group-item-success" data-toggle="collapse" data-target="#firma_visible" >Firmar <span class="glyphicon glyphicon-chevron-down"></span></a>     
    107107                <ul class="nav collapse" id="firma_visible" role="menu" aria-labelledby="btn-1">
    108                   <div class="col-sm-12" id="firma_visible">
    109                     <li><a href="#" id="btn-1" class="list-group-item list-group-item-info" data-toggle="collapse" data-target="#pdf" >Formato PDF <span class="glyphicon glyphicon-chevron-down"></span></a>
    110 
     108                  <div class="col-md-12 col-width " id="firma_visible">
     109                    <li><a href="#" id="btn-2" class="list-group-item list-group-item-info" data-toggle="collapse" data-target="#pdf" >Formato PDF <span class="glyphicon glyphicon-chevron-down"></span></a>
    111110                    </li>
    112111                        <ul class="nav collapse" id="pdf" role="menu" aria-labelledby="btn-1">
    113                           <div class="col-sm-12" id="pdf">
    114                             <li><a href="#" id="btn-1" class="list-group-item list-group-item-link" data-toggle="collapse" data-target="#Formato_Visible" >Firma Visible <span class="glyphicon glyphicon-chevron-down"></span></a>
     112                          <div class="col-sm-12 col-width" id="pdf">
     113                            <li><a href="#" id="firm_v" class="list-group-item list-group-item-link" data-toggle="collapse" data-target="#Formato_Visible" >Firma Visible <span class="glyphicon glyphicon-chevron-down"></span></a>
    115114                            </li>
    116                               <ul class="nav collapse" id="Formato_Visible" role="menu" aria-labelledby="btn-1">
    117                                   <div class="col-sm-4" id="Formato_Visible">
     115                             <ul class="nav collapse" id="Formato_Visible" role="menu" aria-labelledby="btn-1">
     116                                  <div class="btn-group" id="Formato_Visible">
    118117                                     <button type="button" id="upload-button2" class="btn btn-success btn-sm">
    119                                         <span class="glyphicon glyphicon-open"></span>Cargar
     118                                        <span class="glyphicon glyphicon-folder-open"></span> Cargar
    120119                                     </button>
    121                                       <input type="file" id="file-to-upload2" accept="application/pdf" />
    122                                       <div class="text imagen" id="texto"></div>
     120                                     <button type="button" id="firmar-documento"  class="btn btn-info btn-sm buttons-plantilla">
     121                                        <span class="glyphicon glyphicon-ok"></span> Firmar
     122                                     </button>
     123                                     <input type="file" id="file-to-upload2" accept="application/pdf" />
    123124                                  </div>
     125                                  <div class="text imagen" id="texto"></div>
    124126                              </ul>                           
    125                             <li><a href="#" id="btn-1" class="list-group-item list-group-item-link" data-toggle="collapse" data-target="#Formato_Normal">Firma No visible <span class="glyphicon glyphicon-chevron-down"></span></a>
    126                               <ul class="nav collapse" id="Formato_Normal" role="menu" aria-labelledby="btn-1">
    127                                   <div class="col-sm-4" id="Formato_Normal">
    128                                      <button type="button" id="upload-Normal" class="btn btn-success btn-sm">
    129                                         <span class="glyphicon glyphicon-open"></span>Cargar
    130                                      </button>
    131                                       <input type="file" id="file-to-normal" accept="application/pdf" />
    132 
    133                                   </div>
    134                               </ul>                           
    135                             </li>                   
     127                              <li><a href="#" id="firm_no_v" class="list-group-item list-group-item-link" data-toggle="collapse" data-target="#Formato_Normal">Firma No visible <span class="glyphicon glyphicon-chevron-down"></span></a>
     128                                <ul class="nav collapse" id="Formato_Normal" role="menu" aria-labelledby="btn-1">
     129                                    <div class="btn-group" id="Formato_Normal">
     130                                       <button type="button" id="upload-Normal" class="btn btn-success btn-sm">
     131                                          <span class="glyphicon glyphicon-folder-open"></span> Cargar
     132                                       </button>
     133                                       <button type="button" id="firmar-doc-noVisible"  class="btn btn-info btn-sm buttons-plantilla">
     134                                          <span class="glyphicon glyphicon-ok"></span> Firmar
     135                                       </button>
     136                                        <input type="file" id="file-to-normal" accept="application/pdf" />
     137                                    </div>
     138                                </ul>                           
     139                              </li>                   
    136140                          </div>
    137141                        </ul>
    … …  
    164168      </div>
    165169
     170       <!--
    166171        <h3>Parámetros</h3>
    167172
    … …  
    195200            </div>
    196201        </div>
    197 
     202        -->
    198203      </div><!-- End Right Column -->
    199204
    … …  
    202207      <div class="col-sm-8">
    203208     
    204         <div class="well">
     209        <div class="well cuerpo" >
    205210          <div id="pdf-main-container"><center>Firma Visible</center>
    206211            <div id="pdf-loader2">Cargando documento ...</div>
    207212            <div id="pdf-contents2">
    208               <div id="pdf-meta">
     213              <div id="pdf-meta2">
    209214                <div id="pdf-buttons2">
    210215                  <button type="button" id="pdf-prev2" class="btn btn-default btn-sm">
    … …  
    287292  <script src="static/js/docsDraggable.js"></script>
    288293  <script src="static/js/docFirmaNormal.js"></script>
     294  <script src="static/js/menu.js"></script>
     295  <script src="static/js/functions/DraggableSortable.js"></script>
     296
     297
     298 
    289299</body>
    290300</html>

  • prototipo/static/css/style.css

    ra9c1355 r0500480  
     1/* Class */
     2.buttons-plantilla {
     3  width: 150px;
     4  display: block;
     5  margin: 20px auto;
     6  margin-left: 5px;
     7  border-radius: 20px; 
     8}
     9
     10.text {
     11  border-radius: 0px;
     12  color: rgba(255, 255, 255, .5);
     13  display: inline-block;
     14  font: bold 40px/100px Arial;
     15  height: 80px;
     16  width: 130px;
     17  border: 1px solid #eee;
     18  z-index: 2;
     19  margin-bottom: 4px;
     20  display: none;
     21 
     22}
     23
     24.cuerpo {
     25  background-color: rgba(40, 144, 127, 0.13);
     26}
     27
     28.imagen {
     29  background-size: cover;
     30  background-image: url('../img/backgroung-header.png') ;
     31  height: 40px;
     32  width: 100px;
     33 }
     34
     35.col-width {
     36  width: 104%;
     37}
     38
     39
     40/* id */
    141#upload-button, #upload-button2, #upload-Normal {
    242  width: 150px;
    … …  
    646  border-radius: 20px; 
    747}
     48
     49#firmar-documento, #firmar-doc-noVisible {
     50  margin-left: 5px;
     51  border-radius: 20px;
     52  display: none;
     53}
     54
    855
    956#file-to-upload, #file-to-upload2, #file-to-normal{
    … …  
    2673}
    2774
    28 #pdf-contents, #pdf-contents2 {
     75#pdf-contents, #pdf-contents2, #pdf-contents3 {
    2976  display: none;
    3077}
    3178
    32 #pdf-meta #pdf-meta3 {
     79#pdf-meta, #pdf-meta3 {
    3380  overflow: hidden;
    3481  margin: 0 0 20px 0;
    … …  
    5198}
    5299
    53 #pdf-canvas, #pdf-canvas2 #pdf-canvas3 {
     100#pdf-canvas, #pdf-canvas2, #pdf-canvas3 {
    54101  border: 1px solid rgba(0,0,0,0.2);
    55102  box-sizing: border-box;
    … …  
    97144}
    98145
    99 .text {
    100   border-radius: 0px;
    101   color: rgba(255, 255, 255, .5);
    102   display: inline-block;
    103   font: bold 40px/100px Arial;
    104   height: 80px;
    105   width: 130px;
    106   border: 1px solid #eee;
    107   z-index: 2;
    108  
    109 }
    110 
    111 
    112 .imagen {
    113   background-size: cover;
    114   background-image: url('../img/backgroung-header.png') ;
    115   height: 40px;
    116   width: 100px;
    117  }
    118 
    119146
    120147#pdf-prev2, #pdf-prev3 {
    … …  
    148175
    149176
    150 
    151177/*.menu_lateral {
    152178    position: fixed;

  • prototipo/static/js/docFirmaNormal.js

    re3349ca r0500480  
    77  __CANVAS_CTX = __CANVAS.getContext('2d'),
    88  __idd = "",
    9   __NUMBER = 0;
     9  __NUMBER = 0,
     10  __CLICKK = 0;
    1011
    1112 $("#pdf-canvas3").hide();
    … …  
    116117
    117118  $("#file-to-normal").trigger('click');
     119
    118120});
    119121
    … …  
    127129    }
    128130
     131    showPDF3(URL.createObjectURL($("#file-to-normal").get(0).files[0]));
    129132
    130 
    131   showPDF3(URL.createObjectURL($("#file-to-normal").get(0).files[0]));
    132 
     133    if (__CLICKK == 0){
     134        $('#firmar-doc-noVisible').show();
     135        __CLICKK += 1;
     136    }
    133137});

  • prototipo/static/js/docsDraggable.js

    ra9c1355 r0500480  
    88  __CANVAS_CTX = __CANVAS.getContext('2d'),
    99  __id = "",
    10   __NUMBER = 0;
     10  __NUMBER = 0,
     11  __CLICK = 0;
    1112
    1213 $("#pdf-canvas2").hide();
    … …  
    8788
    8889      $("#container1").attr("style", "background-image: url('"+__id+"');background-size: cover; background-repeat: no-repeat;  height:"+viewdimen.height+"px; width:"+viewdimen.width+"px");     
    89       $("#container1").attr("style", "background-image: url('"+__id+"');background-size: cover; background-repeat: no-repeat;  height:"+(viewdimen.height)+"px; width:"+(viewdimen.width)+"px");
    90      
     90
    9191
    9292    });
    … …  
    118118    }
    119119
    120 
    121120  // Send the object url of the pdf
    122121  showPDF2(URL.createObjectURL($("#file-to-upload2").get(0).files[0]));
     122
     123  if (__CLICK == 0){
     124      $('#firmar-documento').attr("disabled","disabled").show();
     125      $('#texto').show();
     126      __CLICK += 1;
     127  }
    123128
    124129});
    … …  
    141146
    142147
    143 var transferred = false;
    144 $('.text').draggable({
    145     connectToSortable: $('#container1'),
    146     helper: 'clone',
    147     start: function(event, ui)
    148     {
    149         $(this).hide();
    150     },
    151     stop: function(event, ui)
    152     {
    153 
    154         if(!transferred) {
    155             $(this).show();
    156         }
    157         else{
    158        
    159             $(this).remove();
    160             transferred = false;
    161         }
    162     }
    163 });
    164 
    165 
    166 function InicializarObjectoPositicion(){
    167   var container = document.getElementById('container1'),
    168     element = document.getElementsByClassName('text')[0];
    169  
    170   // options
    171   var options = {
    172     limit: container,
    173     setCursor: true
    174   };
    175 
    176   // initialize drag
    177   new Draggable(element, options);
    178 
    179 }
    180 
    181 
    182 function NuevoObjectoInicial(){
    183 
    184   var num = 0;
    185   $( ".text" ).draggable({
    186     containment: '#container1',
    187     scroll: false,
    188     stop: function(event, ui)
    189       {
    190        
    191         num+= 1;
    192         if (num == 1){
    193           $("#firma_visible #Formato_Visible .text").hide();
    194           $('#dataX').val(0);
    195           $('#dataY').val(0);
    196         }else{
    197           $('#dataX').val(ui.position['left']);
    198           $('#dataY').val(ui.position['top']);
    199         }
    200        
    201       },
    202    
    203   });
    204 }
    205 
    206 $('#container1').sortable({
    207     receive: function(event, ui)
    208     {
    209        
    210         transferred = true;
    211         InicializarObjectoPositicion()
    212         NuevoObjectoInicial();
    213 
    214        
    215     }
    216 });
Note: See TracChangeset for help on using the changeset viewer.