<commit_before><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>BeeHive</title>
<link rel="stylesheet" href="./bootstrap.min.css" type="text/css" />
<link rel="stylesheet" href="./awesome-markers/leaflet.awesome-markers.css" type="text/css" />
<link href="http://netdna.bootstrapcdn.com/font-awesome/4.0.0/css/font-awesome.css" rel="stylesheet">
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css" />
<style type="text/css">
  #map {
		position:absolute;
		top:0;
		bottom:0;
		width:100%;
	}
	.logo{
		position: absolute;
		top: 20px;
		left:20px;
		width: 200px;
		padding-left: 20px;
		z-index: 9999;
		background: #FFCD30;
		border-radius: 10px;
	}
</style>
<script src="./jquery.min.js"></script>
<script src="./bootstrap.min.js"></script>
<script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script>
<script src="./awesome-markers/leaflet.awesome-markers.min.js"></script>
<script type="text/javascript">

function timeConverter(UNIX_timestamp){
 var a = new Date(UNIX_timestamp*1000);
 var months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
     var year = a.getFullYear();
     var month = months[a.getMonth()];
     var date = a.getDate();
     var hour = a.getHours();
     var min = a.getMinutes();
     var sec = a.getSeconds();
     var time = date+','+month+' '+year+' '+hour+':'+min+':'+sec ;
     return time;
 }

var map;

$( document ).ready(function() {
  // create a map in the "map" div, set the view to a given place and zoom
  var map = L.map('map',{ zoomControl: false }).setView([25.0192013,121.5407913], 16);
  // add zoom control to top right, since site logo is on topleft
  new L.Control.Zoom({ position: 'topright' }).addTo(map);

  // add an OpenStreetMap tile layer
  L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
      attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
  }).addTo(map);

  $('#myModal').modal('show');
  $('#load-data-button').click(function () {
      $.ajax("data.php")
        .done(function( data ) {
            // gender: 0 boy 1 girl
            var text_color = ['cornflowerblue','hotpink'];
            var icons = ['male', 'female'];
            var marker_color = ['blue','red'];
            data.forEach(function(data){
                var marker = new L.marker([data['latitude'],data['longtitude']], {icon: L.AwesomeMarkers.icon({icon: icons[data['gender']], prefix: 'fa', markerColor: marker_color[data['gender']]}) }).addTo(map)
                .bindPopup('<img src="http://filestoretw1.beetalkmobile.com:8081/file/' + data['avatar'] + '"><br>Name: <span style="color:' + text_color[data['gender']] + '">' + data['name'] + '</span><br>Birthday: ' + data['birthday'] + '<br>BeeTalk ID: ' + data['customized_id'] + '<br>Status: ' + data['signature'] + '<br><br>Last Update: ' + timeConverter(data['timestamp']));

                console.log(data);
              });
              $('#myModal').modal('hide');
        });
  });
});

</script>
</head>
<body>
<div class="logo">
<h3><span style="color: white"><span style="vertical-align: text-bottom">&#11042;</span> Bee</span>Hive <span style="color: white; vertical-align: text-bottom; font-size: 0.7em">alpha</span></h3>
</div>

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title">Welcome</h4>
      </div>
      <div class="modal-body">
        Welcome to BeeHive
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary" id="load-data-button">Load Data</button>
      </div>
    </div>
  </div>
</div>

	<div id="map"></div>

</body><commit_msg>update modal id and logo height<commit_after><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>BeeHive</title>
<link rel="stylesheet" href="./bootstrap.min.css" type="text/css" />
<link rel="stylesheet" href="./awesome-markers/leaflet.awesome-markers.css" type="text/css" />
<link href="http://netdna.bootstrapcdn.com/font-awesome/4.0.0/css/font-awesome.css" rel="stylesheet">
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css" />
<style type="text/css">
  #map {
		position:absolute;
		top:0;
		bottom:0;
		width:100%;
	}
	.logo{
		position: absolute;
		top: 20px;
		left:20px;
		width: 210px;
    height: 65px;
		padding-left: 20px;
		z-index: 9999;
		background: #FFCD30;
		border-radius: 10px;
	}
</style>
<script src="./jquery.min.js"></script>
<script src="./bootstrap.min.js"></script>
<script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script>
<script src="./awesome-markers/leaflet.awesome-markers.min.js"></script>
<script type="text/javascript">

function timeConverter(UNIX_timestamp){
 var a = new Date(UNIX_timestamp*1000);
 var months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
     var year = a.getFullYear();
     var month = months[a.getMonth()];
     var date = a.getDate();
     var hour = a.getHours();
     var min = a.getMinutes();
     var sec = a.getSeconds();
     var time = date+','+month+' '+year+' '+hour+':'+min+':'+sec ;
     return time;
 }

var map;

$( document ).ready(function() {
  // create a map in the "map" div, set the view to a given place and zoom
  var map = L.map('map',{ zoomControl: false }).setView([25.0192013,121.5407913], 16);
  // add zoom control to top right, since site logo is on topleft
  new L.Control.Zoom({ position: 'topright' }).addTo(map);

  // add an OpenStreetMap tile layer
  L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
      attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
  }).addTo(map);

  $('#welcome').modal('show');
  $('#load-data-button').click(function () {
      $.ajax("data.php")
        .done(function( data ) {
            // gender: 0 boy 1 girl
            var text_color = ['cornflowerblue','hotpink'];
            var icons = ['male', 'female'];
            var marker_color = ['blue','red'];
            data.forEach(function(data){
                var marker = new L.marker([data['latitude'],data['longtitude']], {icon: L.AwesomeMarkers.icon({icon: icons[data['gender']], prefix: 'fa', markerColor: marker_color[data['gender']]}) }).addTo(map)
                .bindPopup('<img src="http://filestoretw1.beetalkmobile.com:8081/file/' + data['avatar'] + '"><br>Name: <span style="color:' + text_color[data['gender']] + '">' + data['name'] + '</span><br>Birthday: ' + data['birthday'] + '<br>BeeTalk ID: ' + data['customized_id'] + '<br>Status: ' + data['signature'] + '<br><br>Last Update: ' + timeConverter(data['timestamp']));

                console.log(data);
              });
              $('#welcome').modal('hide');
        });
  });
});

</script>
</head>
<body>
<div class="logo">
<h3><span style="color: white"><span style="vertical-align: text-top">&#11042;</span> Bee</span>Hive <span style="color: white; vertical-align: text-bottom; font-size: 0.7em">alpha</span></h3>
</div>

<div class="modal fade" id="welcome" tabindex="-1" role="dialog" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title">Welcome</h4>
      </div>
      <div class="modal-body">
        Welcome to BeeHive
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-warning" id="load-data-button">Load Data</button>
      </div>
    </div>
  </div>
</div>

	<div id="map"></div>

</body>
{'fraction_non_alphanumeric': 0.21650643026595082, 'fraction_numerical': 0.01922836808590336, 'mean_word_length': 3.673278879813302, 'pattern_counts': {'":': 0, '<': 139, '<?xml version=': 0, '>': 139, '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': '6902472', 'n_tokens_mistral': 2932, 'n_tokens_neox': 2759, 'n_words': 534}