<commit_before><!DOCTYPE html>
<html lang="en">
<head>

  <meta charset="utf-8">
  <title>Probe Request Collector's Kit</title>
  <link rel="stylesheet" type="text/css" href="css/styles.css">
  <link rel="stylesheet" href="css/leaflet.css" />
  <style>
    html,body{ padding:0; margin:0; overflow: hidden; }
    #map{ position: absolute; top:0; left:0;}
    #error {
      position: fixed; z-index: 2; top:0; left:0;
      width:100%; height:100%;
      background-color: rgba(0,0,0,0.8);
      display: none;

    }
    #error div{ 
      background: #e9eaee;
      border: 2px solid #ffffff;
      padding: 20px;
      width: 460px;
      margin: 20% auto;
      text-align: center;
      -webkit-border-radius: 5px;
      -moz-border-radius: 5px;
      border-radius: 5px;
    }
  </style>


</head>

<body>

  <div id="error"><div id="nfo"> no GPS data available for these networks</div></div>
  <div id="map" class="map"></div>

  <script src="js/jquery-1.11.2.min.js"></script>
  <script src="js/leaflet.js"></script>
  <script>

    // via http://stackoverflow.com/questions/901115/how-can-i-get-query-string-values-in-javascript
    function getParameterByName(name) {
        name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
        var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
            results = regex.exec(location.search);
        return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
    }
    
    // ------------------------------------------------------------------------------- get networks
    $.ajax({
      url: 'http://localhost:3000/api/networks?device='+getParameterByName('mac'),
      method: 'GET',
      success: onNetworksResponse,
      error: function(err){
        console.log(err);
      }
    });
    function onNetworksResponse(data){
      console.log( "networks", data );
      getGPS( data );
    }

    // ------------------------------------------------------------------------------- get GPS 
    function getGPS( networks ){
      var data = {
        ssid: networks,
        collection: "wigleChicago"
      }

      $.ajax({
        url: 'http://localhost:3000/api/wigle',
        method: 'GET',
        data: data,
        success: onGPSResponse,
        error: function(err){
          console.log(err);
        }
      });
      
      function onGPSResponse(data){
        if (!data.error) {
          var results = data.results;
          for (var i = 0; i < results.length; i++) {
            var network = results[i];
            gps_vectors.push({ssid:network.ssid, lat:network.geo.lat, lon:network.geo.lon});
          }
          // draw butterflies to map!!
          console.log("gps data", gps_vectors)
          addButterflies();
        } else {
          console.log(data);
          document.getElementById('error').style.display = "block";
        }
      } 
    }
    


    // maps -------------------------------------------------------------------------------
    document.getElementById('map').style.height = window.innerHeight+"px";
    document.getElementById('map').style.width = window.innerWidth+"px";

    var gps_vectors = []; // aray of objects of butterfly vectors
    var shapePts = []; // points for polygon
    var ssid_ranks = {};
    var total = 0;
    
    var LeafIcon = L.Icon.extend({
        options: {
            iconSize:     [50, 31],
            iconAnchor:   [25, 15],
            popupAnchor:  [0, 0]
        }
    });
    // a few different colors for when we can detect how common network is
    var red = new LeafIcon({iconUrl: 'images/solid.png'}),    
        blue = new LeafIcon({iconUrl: 'images/butterfly-blue.png'});

    function addButterflies() {
      for (var i = 0; i < gps_vectors.length-1; i++) { // rank them
        if(ssid_ranks[gps_vectors[i].ssid]==undefined){ ssid_ranks[gps_vectors[i].ssid] = 0; } 
        else { ssid_ranks[gps_vectors[i].ssid]++; }
      };
      for (var i = 0; i < gps_vectors.length-1; i++) { // make butterflies
        var x = gps_vectors[i].lat;
        var y = gps_vectors[i].lon;
        var ssid = gps_vectors[i].ssid;
        if(ssid_ranks[gps_vectors[i].ssid] > 10 && ssid_ranks[gps_vectors[i].ssid] < 110 ){
          L.marker([x, y], {icon: blue}).addTo(map).bindPopup(ssid); total++;
        } 
        else if(ssid_ranks[gps_vectors[i].ssid] <= 10) {
          shapePts.push([x,y]);
          L.marker([x, y], {icon: red}).addTo(map).bindPopup(ssid); total++;
        }
      };
      for (var i = 0; i < shapePts.length; i++) {
        var one = shapePts[i];
        var two = (shapePts[i+1]) ? shapePts[i+1] : shapePts[0];
        L.polygon([one,two],{color:'red',fillColor:'#f03',fillOpacity:0}).addTo(map);
        var ran = shapePts[Math.floor(Math.random()*shapePts.length)];
        L.polygon([one,ran],{color:'red',fillColor:'#f03',fillOpacity:0}).addTo(map);

      };
      if(total==0){
        document.getElementById('nfo').innerHTML = "GPS data may not be accurate";
        document.getElementById('error').style.display = "block";
      }
    }

    var map = L.map('map').setView([41.879528,-87.625088], 13); // chicago 
    L.tileLayer('http://localhost:3000/data/maps/tiles/chicago/{z}/{x}/{y}.png', {
        maxZoom: 17
    }).addTo(map);


  </script>

</body>
</html><commit_msg>updates to map<commit_after><!DOCTYPE html>
<html lang="en">
<head>

  <meta charset="utf-8">
  <title>Probe Request Collector's Kit</title>
  <link rel="stylesheet" type="text/css" href="css/styles.css">
  <link rel="stylesheet" href="css/leaflet.css" />
  <style>
    html,body{ padding:0; margin:0; overflow: hidden; }
    #map{ position: absolute; top:0; left:0;}
    #error {
      position: fixed; z-index: 2; top:0; left:0;
      width:100%; height:100%;
      background-color: rgba(0,0,0,0.8);
      display: none;

    }
    #error div{ 
      background: #e9eaee;
      border: 2px solid #ffffff;
      padding: 20px;
      width: 460px;
      margin: 20% auto;
      text-align: center;
      -webkit-border-radius: 5px;
      -moz-border-radius: 5px;
      border-radius: 5px;
    }

    i { font-style: normal; font-size:10px; }
  </style>


</head>

<body>

  <div id="error"><div id="nfo"> no GPS data available for these networks</div></div>
  <div id="map" class="map"></div>

  <script src="js/jquery-1.11.2.min.js"></script>
  <script src="js/leaflet.js"></script>
  <script src='//api.tiles.mapbox.com/mapbox.js/plugins/turf/v1.4.0/turf.min.js'></script>

  <script>

    // via http://stackoverflow.com/questions/901115/how-can-i-get-query-string-values-in-javascript
    function getParameterByName(name) {
        name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
        var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
            results = regex.exec(location.search);
        return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
    }
    
    // ------------------------------------------------------------------------------- get networks
    $.ajax({
      url: 'http://localhost:3000/api/networks?device='+getParameterByName('mac'),
      method: 'GET',
      success: onNetworksResponse,
      error: function(err){
        console.log(err);
      }
    });
    function onNetworksResponse(data){
      console.log( "networks", data );
      getGPS( data );
    }

    // ------------------------------------------------------------------------------- get GPS 
    function getGPS( networks ){
      var data = {
        ssid: networks,
        collection: "wigleChicago"
      }

      $.ajax({
        url: 'http://localhost:3000/api/wigle',
        method: 'GET',
        data: data,
        success: onGPSResponse,
        error: function(err){
          console.log(err);
        }
      });
      
      function onGPSResponse(data){
        if (!data.error) {
          console.log(data)
          var results = data.results;
          for (var i = 0; i < results.length; i++) {
            var network = results[i];
            gps_vectors.push({ssid:network.ssid, lat:network.geo.lat, lon:network.geo.lon, date:network.lastupdt});
          }
          // draw butterflies to map!!
          console.log("gps data", gps_vectors)
          addButterflies();
        } else {
          console.log(data);
          document.getElementById('error').style.display = "block";
        }
      } 
    }
    


    // maps -------------------------------------------------------------------------------
    document.getElementById('map').style.height = window.innerHeight+"px";
    document.getElementById('map').style.width = window.innerWidth+"px";

    var gps_vectors = []; // aray of objects of butterfly vectors
    var shapePts = []; // points for polygon
    var ssid_ranks = {};
    var total = 0;
    
    var LeafIcon = L.Icon.extend({
        options: {
            iconSize:     [50, 31],
            iconAnchor:   [25, 15],
            popupAnchor:  [0, 0]
        }
    });
    // a few different colors for when we can detect how common network is
    var red = new LeafIcon({iconUrl: 'images/solid.png'}),    
        blue = new LeafIcon({iconUrl: 'images/butterfly-blue.png'});

    function parseDate( int ){
      var str = int.toString();
      var YY = str.charAt(0) + str.charAt(1) + str.charAt(2) + str.charAt(3);
      var MM = str.charAt(4) + str.charAt(5);
      var DD = str.charAt(6) + str.charAt(7);
      var hh = str.charAt(8) + str.charAt(9);
      var mm = str.charAt(10) + str.charAt(11);
      return MM+"/"+DD+"/"+YY+" "+hh+":"+mm;
    }

    function addButterflies() {
      for (var i = 0; i < gps_vectors.length; i++) { // rank them
        if(ssid_ranks[gps_vectors[i].ssid]==undefined){ ssid_ranks[gps_vectors[i].ssid] = 0; } 
        else { ssid_ranks[gps_vectors[i].ssid]++; }
      };
      for (var i = 0; i < gps_vectors.length; i++) { // make butterflies
        var x = gps_vectors[i].lat;
        var y = gps_vectors[i].lon;
        var ssid = gps_vectors[i].ssid;
        var date = parseDate( gps_vectors[i].date );
        if(ssid_ranks[gps_vectors[i].ssid] > 10 && ssid_ranks[gps_vectors[i].ssid] < 110 ){
          L.marker([x, y], {icon: blue}).addTo(map).bindPopup(ssid+"<br><i>"+date+"</i>*").on("mouseover",function(e){this.openPopup()}); total++;
        } 
        else if(ssid_ranks[gps_vectors[i].ssid] <= 10) {
          shapePts.push([x,y]); total++;
          L.marker([x, y], {icon: red}).addTo(map).bindPopup(ssid+"<br><i>"+date+"</i>*").on("mouseover",function(e){this.openPopup()}); 
          // var point1 = 
          // var p1 = turf.point([x,y]);
          // console.log(p1)
        }
      };
      for (var i = 0; i < shapePts.length; i++) {
        var one = shapePts[i];
        var two = (shapePts[i+1]) ? shapePts[i+1] : shapePts[0];
        L.polygon([one,two],{color:'red',fillColor:'#f03',fillOpacity:0}).addTo(map);
        var ran = shapePts[Math.floor(Math.random()*shapePts.length)];
        L.polygon([one,ran],{color:'red',fillColor:'#f03',fillOpacity:0}).addTo(map);

      };
      if(gps_vectors.length >=0 && total==0){
        document.getElementById('nfo').innerHTML = "GPS data may not be accurate";
        document.getElementById('error').style.display = "block";
      }


    }

    var map = L.map('map').setView([41.879528,-87.625088], 13); // chicago 
    L.tileLayer('http://localhost:3000/data/maps/tiles/chicago/{z}/{x}/{y}.png', {
        maxZoom: 18
    }).addTo(map);


  </script>

</body>
</html>
{'fraction_non_alphanumeric': 0.21517445401548768, 'fraction_numerical': 0.020795266684068562, 'mean_word_length': 2.069158878504673, 'pattern_counts': {'":': 1, '<': 75, '<?xml version=': 0, '>': 66, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '570032', 'n_tokens_mistral': 4037, 'n_tokens_neox': 3786, 'n_words': 712}