Merge branch 'dev' of gitlab.geoint.mx:mario.chirinos/GeoInt_SIDT into dev

administration/views.py

@@ -196,7 +196,6 @@ def wsPurchasesPM(request):
                 'storage':storage,
                 'in_process': pending.count(),
             })
-            print (table_data)
         return HttpResponse(json.dumps(table_data))
     else:
         raise Http404

catalog/templates/base_top.html

@@ -187,9 +187,10 @@
 {% block templates %}{% endblock %}
 <!-- T E M P L A T E S -->
 <!-- MODAL 1 -->
-{% block modal1 %}{% endblock %}
+{% block modals %}{% endblock %}
 <!-- MODAL 1 -->
 
+
 <!-- Bootstrap 3.3.7 -->
 <script src="{% static 'catalog/adminlte/bower_components/bootstrap/dist/js/bootstrap.min.js' %}"></script>
 <!-- AdminLTE App -->
@@ -199,6 +200,7 @@
 <!-- Chartsjs -->
 <script src="{% static 'catalog/js/Chart.min.js' %}" type="text/javascript"></script>
 
+{% block footer %}{% endblock %}
 {% block scripts %}{% endblock %}
 </body>
 </html>

catalog/views.py

@@ -616,7 +616,6 @@ def Pay(request):
 @csrf_exempt
 def IPN(request):
     PATH_USERS = config['PATHS']['PATH_USERS']
-    print()
     f = open(PATH_USERS+"myfile.txt", "w")
     x = request.POST.dict()
     f.write('variables')

reports/static/reports/css/Reports.css

@@ -54,7 +54,7 @@ input:checked + .slider:before {
     transform: translateX(26px);
 }
 
-/* Rounded sliders */ 
+/* Rounded sliders */
 .slider.round {
     border-radius: 34px;
 }

reports/static/reports/css/scldata.css

@@ -162,3 +162,58 @@ input[type=range]::-webkit-slider-thumb {
     border-radius: 100%;
     cursor: pointer;
 } */
+
+/* Reset Select */
+select {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  -ms-appearance: none;
+  appearance: none;
+  outline: 0;
+  box-shadow: none;
+  border: 0 !important;
+  background: #2c3e50;
+  background-image: none;
+}
+/* Custom Select */
+.select {
+  position: relative;
+  display: block;
+  width: 9em;
+  height: 3em;
+  line-height: 3;
+  background: #2c3e50;
+  overflow: hidden;
+  border-radius: .25em;
+}
+select {
+  width: 100%;
+  height: 100%;
+  margin: 0;
+  padding: 0 0 0 .5em;
+  color: #fff;
+  cursor: pointer;
+}
+select::-ms-expand {
+  display: none;
+}
+/* Arrow */
+.select::after {
+  content: '\25BC';
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  padding: 0 1em;
+  background: #34495e;
+  pointer-events: none;
+}
+/* Transition */
+.select:hover::after {
+  color: #f39c12;
+}
+.select::after {
+  -webkit-transition: .25s all ease;
+  -o-transition: .25s all ease;
+  transition: .25s all ease;
+}

reports/static/reports/js/Reports_scripts.js

@@ -65,7 +65,6 @@ $(function () {
                 responsive: true
             });
 
-
         });
 
 

reports/static/reports/js/minimap.js

@@ -114,3 +114,139 @@ function setOpacity(value) {
     }
   })
 }
+
+
+// *********** Irving ******************
+//  Funciones de comparacion
+
+//vigila cuando se cierra el menu de comparar y cuando se cierra desactiva la comparacion (si la clase de compare incluye menu-open está abierto)
+var compareMenu = document.getElementById('compare');
+var observer = new MutationObserver( function(mutations) {
+  mutations.forEach( function(mutation) {
+    if (mutation.attributeName == 'class') {
+      if(compareMenu.className.indexOf("open")===-1) {  //se cerró el menu de comparacion
+        exitCompare();
+      }
+    }
+  });
+});
+observer.observe(compareMenu, { attributes : true, attributeOldValue: true, attributeFilter : ['class'], subtree: true});
+
+//crea el control swipe, que sirve para comparar
+var ctrl = new ol.control.Swipe();
+
+//funcion que inicia la comparacion
+//recibe la lista de fechas y por default compara la primera y la ultima
+function compare(labels) {
+  var swipeControl = false;
+
+  map.getControls().forEach(function (control) {  //checa si ya se añadio el control de comparacion (swipe), si no lo tiene, lo agrega
+    if(control instanceof ol.control.Swipe){ //si ya tiene el control agregado
+      swipeControl =true;
+    }
+  });
+
+  if(swipeControl==true) {  //si ya tiene el comparador no hace nada, ya esta en modo comparacion
+    //map.removeControl(swipeControlObj);
+  } else {  //si no tiene el comparador lo agrega
+    //removeImageLayers();
+    map.addControl(ctrl);
+    ctrl.set('position', 0.5);
+    //console.log(map.controls)
+    var labelDateLeft = labels[0]                 //por default compara la primera y ultima fecha
+    var labelDateRight = labels[labels.length-1]
+
+    //pone las fechas por default en los selectores de fechas
+    document.getElementById("selectLeftCompare").value = labelDateLeft;
+    document.getElementById("selectRightCompare").value = labelDateRight;
+
+     //agrega las capas izquierda/derecha
+    selectLeft(labelDateLeft);
+    selectRight(labelDateRight);
+
+    //muestra los selectores de fechas y oculta la linea de tiempo
+    document.getElementById("selectLeft").style.display = "block";
+    document.getElementById("selectRight").style.display = "block";
+    document.getElementById("timeLine").style.display = "none";
+  }
+}
+
+//sale del modo comparacion
+function exitCompare() {
+  map.getControls().forEach(function (control) {  //checa si ya se añadio el control de comparacion (swipe)
+    if(control instanceof ol.control.Swipe){ //ya tiene el control agregado lo quita
+      map.removeControl(control);
+    }
+  });
+
+  //quita las capas de comparacion izquierda/derecha
+  var imageLayers = map.getLayers().getArray().slice();
+  imageLayers.forEach(layer => {
+    if(layer.get('name') === 'left' || layer.get('name') === 'right') {
+      map.removeLayer(layer)
+    }
+  })
+
+  //oculta los selectores de fechas y muestra la linea de tiempo
+  document.getElementById("selectLeft").style.display = "none";
+  document.getElementById("selectRight").style.display = "none";
+  document.getElementById("timeLine").style.display = "block";
+}
+
+
+//selecciona el lado izquierdo para comparar
+function selectLeft(date) {
+  var labelDateLeft = date;
+  var layer_type = 'TCI';
+  const left = new ol.layer.Tile({
+    name: 'left',
+    opacity: 1,
+    source: new ol.source.XYZ({
+      projection: 'EPSG:3857',
+      url: '/reports/tiles/'+purchase_id+'/'+zone+'/'+layer_type+'/'+labelDateLeft+'/{z}/{x}/{-y}.png',
+      tilePixelRatio: 2,
+      minZoom: 10,
+      maxZoom: 15
+    })
+  });
+  map.addLayer(left);
+  ctrl.addLayer(left);
+}
+
+//selecciona el lado derecho para comparar
+function selectRight(date){
+    var labelDateRight = date;
+    var layer_type = 'TCI';
+    const right = new ol.layer.Tile({
+      name: 'right',
+      opacity: 1,
+      source: new ol.source.XYZ({
+        projection: 'EPSG:3857',
+        url: '/reports/tiles/'+purchase_id+'/'+zone+'/'+layer_type+'/'+labelDateRight+'/{z}/{x}/{-y}.png',
+        tilePixelRatio: 2,
+        minZoom: 10,
+        maxZoom: 15
+      })
+    });
+    map.addLayer(right);
+    ctrl.addLayer(right, true);
+}
+
+//selecciona comparacion vertical u horizontal
+function setCompareDirection(direction){
+  ctrl.set('orientation',direction)
+
+  //mueve los selectores de fechas
+  if(direction === 'horizontal'){
+    document.getElementById("selectLeft").style.bottom = "70%";
+    document.getElementById("selectLeft").style.left = "15%";
+    document.getElementById("selectRight").style.left = "15%";
+  }
+  else{
+    document.getElementById("selectLeft").style.bottom = "50px";
+    document.getElementById("selectLeft").style.left = "30%";
+    document.getElementById("selectRight").style.left = "75%";
+  }
+}
+//  Fin funciones de comparacion
+//******************************

reports/templates/aside.html

@@ -35,6 +35,44 @@
                     <span class="label label-primary pull-right"></span>
                 </span>
             </a>
+            
+        <li class="treeview" id="compare">
+            <a href="#" onclick="compare(labels)">
+                <i class="fas fa-columns"></i>
+                <span>Compare</span>
+                <span class="pull-right-container">
+              <span class="label label-primary pull-right"></span>
+            </span>
+            </a>
+            <ul class="treeview-menu sidebar-form" id="compareOptions">
+                <li>
+                    <a class="treeview submenu" href="#" onclick="setCompareDirection('vertical')" id="compvertical">
+                        <i class="fas fa-arrows-alt-v"></i>
+                        <span>Vertical</span>
+                    </span>
+                    </a>
+                </li>
+                <li>
+                    <a class="treeview submenu" href="#" onclick="setCompareDirection('horizontal')" id="comphorizontal">
+                        <i class="fas fa-arrows-alt-h"></i>
+                        <span>Horizontal</span>
+                    </span>
+                    </a>
+                </li>
+            </ul>
+        </li>            
+ 
+<!-- 
+            <a class="treeview " href="#" onclick="compare(labels)">
+                <i class="fas fa-columns"></i></i>
+                <i class="fa fa-eye-slash hideChart" style="display:none"></i>
+                <span class="showChart">Compare</span>
+                <span class="hideChart" style="display:none">Not compare</span>
+                <span class="pull-right-container">
+                    <span class="label label-primary pull-right"></span>
+                </span>
+            </a>            
+ -->           
         </li>
         {% endif %}
         <li class="treeview">

reports/templates/sclData.html

@@ -5,12 +5,14 @@
     <link rel="stylesheet" href="{% static 'catalog/css/body.css' %}" type="text/css">
     <link rel="stylesheet" href="{% static 'reports/css/scldata.css' %}" type="text/css">
     <link rel="stylesheet" href="{% static 'reports/css/crossrange.css' %}" type="text/css">
+    <link rel="stylesheet" href="{% static 'reports/css/ol-ext.css' %}" type="text/css">
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
     <link rel="stylesheet" href="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/css/ol.css"
           type="text/css">
     <script src="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/build/ol.js"></script>
     <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css"/>
     <script type="text/javascript" src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
+    <script type="text/javascript" src="{% static 'reports/js/ol-ext.js' %}"></script>
 {% endblock %}
 {% block messages %}
     <a href="#" class="dropdown-toggle" data-toggle="dropdown">
@@ -117,7 +119,7 @@
 {% block content %}
     <!-- Content Wrapper. Contains page content -->
     <!-- Main content -->
-    <div class="container floating-panel" style="position:absolute; bottom: 40px; left: 12%; width: 500px; z-index: 1000">
+    <div id="timeLine" class="container floating-panel slidecontainer" style="position:absolute;  display:block; bottom: 40px; left: 12%; width: 500px; z-index: 1000">
         <div class="range-control" id="rangecontrol">
             <span id="tooltiptext">{{ labels|first|slice:"6:8" }}/{{ labels|first|slice:"4:6" }}/{{ labels|first|slice:"0:4" }}</span>
             <input class="cross-range" id="inputRange" type="range" min="0" max="{{ labels|length|add:'-1' }}" step="1" value="0" data-thumbwidth="20" style="background: transparent;">
@@ -131,6 +133,26 @@
 
         </div>
     </div>
+    
+    <div id="selectLeft" class="container floating-panel" style="position:absolute; display:none; bottom: 50px; left: 30%; width: 300px; z-index: 1000">
+        <div class="select">
+                <select onchange="selectLeft(this.value)" id="selectLeftCompare">
+                 {% for label in labels %}
+                       <option value="{{label}}" >{{ label|slice:"6:8" }}/{{ label|slice:"4:6" }}/{{label|slice:"0:4" }}</option>
+                 {% endfor %}
+                </select>
+        </div>
+    </div>    
+    
+    <div id="selectRight" class="container floating-panel" style="position:absolute; display:none; bottom: 50px; left: 75%; width: 300px; z-index: 1000">
+        <div class="select">
+                <select onchange="selectRight(this.value)" id="selectRightCompare">
+                 {% for label in labels %}
+                       <option value="{{label}}" >{{ label|slice:"6:8" }}/{{ label|slice:"4:6" }}/{{label|slice:"0:4" }}</option>
+                 {% endfor %}
+                </select>
+        </div>
+    </div>     
 
     <div id="reportPage" class="wrapper" style="background-color: #ecf0f5">
         <div id="minimap" class="minimap"></div>