Skip to content

Commit 616f097

Browse files
bisakbisak
committed
Updates and fixes. Implemented login and register.
1 parent f5adb7e commit 616f097

File tree

13 files changed

+630
-1005
lines changed

13 files changed

+630
-1005
lines changed

‎.idea/htdocs.iml‎

Lines changed: 7 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎.idea/jsLibraryMappings.xml‎

Lines changed: 2 additions & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎.idea/workspace.xml‎

Lines changed: 315 additions & 198 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎index.html‎

Lines changed: 26 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -17,16 +17,21 @@
1717
<link href='https://api.mapbox.com/mapbox.js/plugins/leaflet-fullscreen/v1.0.1/leaflet.fullscreen.css'
1818
rel='stylesheet'/>
1919
<link href="styles/style.css" rel="stylesheet">
20-
<link href="styles/map-style.css" rel="stylesheet">
20+
<link href="styles/map.css" rel="stylesheet">
21+
<link rel="stylesheet" href="//cdn.jsdelivr.net/alertifyjs/1.8.0/css/alertify.min.css"/>
22+
<link rel="stylesheet" href="styles/signin.css">
2123

24+
<script src="https://www.gstatic.com/firebasejs/3.2.1/firebase.js"></script>
2225
<script src="https://code.jquery.com/jquery-3.1.0.min.js"
2326
integrity="sha256-cCueBR6CsyA4/9szpPfrX3s49M9vUU5BgtiJj06wt/s=" crossorigin="anonymous"></script>
2427
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
2528
<script src="https://npmcdn.com/leaflet@1.0.0-rc.2/dist/leaflet.js"></script>
2629
<script src="https://domoritz.github.io/leaflet-locatecontrol/dist/L.Control.Locate.min.js"
2730
charset="utf-8"></script>
2831
<script src='https://api.mapbox.com/mapbox.js/plugins/leaflet-fullscreen/v1.0.1/Leaflet.fullscreen.min.js'></script>
29-
<script src="../scripts/libs/exif.js"></script>
32+
<script src="/scripts/libs/exif.js"></script>
33+
<script src="//cdn.jsdelivr.net/alertifyjs/1.8.0/alertify.min.js"></script>
34+
<script src="//blueimp.github.io/Gallery/js/jquery.blueimp-gallery.min.js"></script>
3035

3136
</head>
3237

@@ -42,22 +47,36 @@
4247
<span class="icon-bar"></span>
4348
<span class="icon-bar"></span>
4449
</button>
45-
<a class="navbar-brand" href="#">DroneMapper</a>
50+
<a class="navbar-brand" href="/">DroneMapper</a>
4651
</div>
4752
<div id="navbar" class="collapse navbar-collapse">
4853
<ul class="nav navbar-nav">
49-
<li class="active"><a href="#">Home</a></li>
50-
<li><a href="uploader/uploader.html">Upload</a></li>
51-
54+
<li class="active"><a href="/">Home</a></li>
55+
<li><a href="uploader.html">Upload</a></li>
56+
<li><a href="signin.html" id="signInLinkButton" style="display: none;">Sign in</a></li>
57+
<li><a href="#" id="signOutButton" style="display: none;">Sign out</a></li>
5258
</ul>
5359
</div><!--/.nav-collapse -->
5460
</div>
5561
</nav>
5662

63+
5764
<div class="container" id="mapContainer">
65+
<h3 style="margin-top: 20px">DroneMapper</h3>
5866
<div id="map"></div>
59-
6067
</div><!-- /.container -->
68+
69+
<div id="blueimp-gallery" class="blueimp-gallery blueimp-gallery-controls" data-filter=":even">
70+
<div class="slides"></div>
71+
<h3 class="title"></h3>
72+
<a class="prev">‹</a>
73+
<a class="next">›</a>
74+
<a class="close">×</a>
75+
<a class="play-pause"></a>
76+
<ol class="indicator"></ol>
77+
</div>
78+
6179
<script src="scripts/app.js"></script>
80+
<script src="/scripts/map.js"></script>
6281
</body>
6382
</html>

‎scripts/app.js‎

Lines changed: 26 additions & 87 deletions
Original file line numberDiff line numberDiff line change
@@ -1,90 +1,29 @@
1-
/*JavaScript*/
2-
3-
let streets = L.tileLayer('https://api.mapbox.com/styles/v1/mapbox/streets-v9/tiles/256/{z}/{x}/{y}?access_token=pk.eyJ1IjoiYmlza2F6eiIsImEiOiJjaXJkOTFkb3owMDdxaTltZ21vemsxcGViIn0.70mwo4YYnbxY_BJoEsGYxw', {attribution: '&copy; <a href="https://www.mapbox.com">Mapbox</a> Streets'}),
4-
outdoors = L.tileLayer('https://api.mapbox.com/styles/v1/mapbox/outdoors-v9/tiles/256/{z}/{x}/{y}?access_token=pk.eyJ1IjoiYmlza2F6eiIsImEiOiJjaXJkOTFkb3owMDdxaTltZ21vemsxcGViIn0.70mwo4YYnbxY_BJoEsGYxw', {attribution: '&copy; <a href="https://www.mapbox.com">Mapbox</a> Outdoors'}),
5-
dark = L.tileLayer('https://api.mapbox.com/styles/v1/mapbox/dark-v9/tiles/256/{z}/{x}/{y}?access_token=pk.eyJ1IjoiYmlza2F6eiIsImEiOiJjaXJkOTFkb3owMDdxaTltZ21vemsxcGViIn0.70mwo4YYnbxY_BJoEsGYxw', {attribution: '&copy; <a href="https://www.mapbox.com">Mapbox</a> Dark'}),
6-
light = L.tileLayer('https://api.mapbox.com/styles/v1/mapbox/light-v9/tiles/256/{z}/{x}/{y}?access_token=pk.eyJ1IjoiYmlza2F6eiIsImEiOiJjaXJkOTFkb3owMDdxaTltZ21vemsxcGViIn0.70mwo4YYnbxY_BJoEsGYxw', {attribution: '&copy; <a href="https://www.mapbox.com">Mapbox</a> Light'}),
7-
satelite = L.tileLayer('https://api.mapbox.com/styles/v1/mapbox/satellite-v9/tiles/256/{z}/{x}/{y}?access_token=pk.eyJ1IjoiYmlza2F6eiIsImEiOiJjaXJkOTFkb3owMDdxaTltZ21vemsxcGViIn0.70mwo4YYnbxY_BJoEsGYxw', {attribution: '&copy; <a href="https://www.mapbox.com">Mapbox</a> Satelite'}),
8-
sateliteStreets = L.tileLayer('https://api.mapbox.com/styles/v1/mapbox/satellite-streets-v9/tiles/256/{z}/{x}/{y}?access_token=pk.eyJ1IjoiYmlza2F6eiIsImEiOiJjaXJkOTFkb3owMDdxaTltZ21vemsxcGViIn0.70mwo4YYnbxY_BJoEsGYxw', {attribution: '&copy; <a href="https://www.mapbox.com">Mapbox</a> Satelite Streets'}),
9-
OpenStreetMap = L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {attribution: '&copy; <a href="http://openstreetmap.org">OpenStreetMap</a> OpenStreetMap'});
10-
11-
let map = L.map('map', {
12-
center: [0, 0],
13-
zoom: 8,
14-
layers: outdoors,
15-
fullscreenControl: true,
16-
});
17-
18-
19-
let lc = L.control.locate({
20-
strings: {
21-
title: "Locate",
22-
},
23-
keepCurrentZoomLevel: true
24-
}).addTo(map);
25-
lc.start();
26-
27-
map.zoomControl.setPosition('bottomright');
28-
29-
let baseMaps = {
30-
"Outdoors": outdoors,
31-
"Streets": streets,
32-
"Dark": dark,
33-
"Light": light,
34-
"Satelite": satelite,
35-
"Satelite Streets": sateliteStreets,
36-
"OpenStreetMap": OpenStreetMap
1+
/**
2+
* Created by Biser Atanasov on 10-Aug-16.
3+
*/
4+
var config = {
5+
apiKey: "AIzaSyCkH7eapxWelLQqYWZel8H2vlaaQ7wGkVU",
6+
authDomain: "dronemapper-83b1a.firebaseapp.com",
7+
databaseURL: "https://dronemapper-83b1a.firebaseio.com",
8+
storageBucket: "dronemapper-83b1a.appspot.com",
379
};
38-
39-
L.control.layers(baseMaps).addTo(map);
40-
41-
42-
$.get("/getimages.php", function (data) {
43-
let result = JSON.parse(data);
44-
loadImages(result);
10+
firebase.initializeApp(config);
11+
12+
firebase.auth().onAuthStateChanged(function (user) {
13+
if (user) {
14+
let url = window.location.href;
15+
if (url.includes("/signin.html")) {
16+
window.location.href = "/";
17+
}
18+
$("#signInLinkButton").hide();
19+
$("#signOutButton").show();
20+
} else {
21+
$("#signOutButton").hide();
22+
$("#signInLinkButton").show();
23+
}
4524
});
4625

47-
48-
function loadImages(images) {
49-
let imgArray = [];
50-
let imgObjectArray = [];
51-
52-
images.forEach((src, index) => {
53-
let img = new Image();
54-
img.src = src;
55-
imgArray.push(img);
56-
});
57-
58-
imgArray.forEach((img) => {
59-
img.onload = function () {
60-
EXIF.getData(img, function () {
61-
let imageLat = EXIF.getTag(this, 'GPSLatitude');
62-
let imageLong = EXIF.getTag(this, 'GPSLongitude');
63-
let imageAlt = EXIF.getTag(this, 'GPSAltitude');
64-
let imageName = this.src.split("/").reverse()[0];
65-
66-
let realImageLat = imageLat[0].numerator + imageLat[1].numerator /
67-
(60 * imageLat[1].denominator) + imageLat[2].numerator / (3600 * imageLat[2].denominator);
68-
let realImageLong = imageLong[0].numerator + imageLong[1].numerator /
69-
(60 * imageLong[1].denominator) + imageLong[2].numerator / (3600 * imageLong[2].denominator);
70-
let realImageAlt = imageAlt.numerator / imageAlt.denominator;
71-
72-
let imgObject = {};
73-
imgObject.realImageLat = realImageLat;
74-
imgObject.realImageLong = realImageLong;
75-
imgObject.realImageAlt = realImageAlt;
76-
imgObject.imageName = imageName;
77-
imgObjectArray.push(imgObject);
78-
console.log(imgObject);
79-
console.log(imgObjectArray);
80-
let imageDisplayString = '<img src="' + this.src + '" alt="Cool Photo" height="281" width="500">';
81-
L.marker([realImageLat, realImageLong])
82-
.addTo(map)
83-
.bindPopup(imageDisplayString, {
84-
maxWidth: 1920,
85-
autoPanPadding: L.point(50, 50)
86-
})();
87-
});
88-
};
89-
});
90-
}
26+
$('#signOutButton').click(function () {
27+
firebase.auth().signOut();
28+
alertify.success("Logged Out")
29+
});

‎scripts/map.js‎

Lines changed: 82 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,82 @@
1+
/*JavaScript*/
2+
let streets = L.tileLayer('https://api.mapbox.com/styles/v1/mapbox/streets-v9/tiles/256/{z}/{x}/{y}?access_token=pk.eyJ1IjoiYmlza2F6eiIsImEiOiJjaXJkOTFkb3owMDdxaTltZ21vemsxcGViIn0.70mwo4YYnbxY_BJoEsGYxw', {attribution: '&copy; <a href="https://www.mapbox.com">Mapbox</a> Streets'}),
3+
outdoors = L.tileLayer('https://api.mapbox.com/styles/v1/mapbox/outdoors-v9/tiles/256/{z}/{x}/{y}?access_token=pk.eyJ1IjoiYmlza2F6eiIsImEiOiJjaXJkOTFkb3owMDdxaTltZ21vemsxcGViIn0.70mwo4YYnbxY_BJoEsGYxw', {attribution: '&copy; <a href="https://www.mapbox.com">Mapbox</a> Outdoors'}),
4+
dark = L.tileLayer('https://api.mapbox.com/styles/v1/mapbox/dark-v9/tiles/256/{z}/{x}/{y}?access_token=pk.eyJ1IjoiYmlza2F6eiIsImEiOiJjaXJkOTFkb3owMDdxaTltZ21vemsxcGViIn0.70mwo4YYnbxY_BJoEsGYxw', {attribution: '&copy; <a href="https://www.mapbox.com">Mapbox</a> Dark'}),
5+
light = L.tileLayer('https://api.mapbox.com/styles/v1/mapbox/light-v9/tiles/256/{z}/{x}/{y}?access_token=pk.eyJ1IjoiYmlza2F6eiIsImEiOiJjaXJkOTFkb3owMDdxaTltZ21vemsxcGViIn0.70mwo4YYnbxY_BJoEsGYxw', {attribution: '&copy; <a href="https://www.mapbox.com">Mapbox</a> Light'}),
6+
satelite = L.tileLayer('https://api.mapbox.com/styles/v1/mapbox/satellite-v9/tiles/256/{z}/{x}/{y}?access_token=pk.eyJ1IjoiYmlza2F6eiIsImEiOiJjaXJkOTFkb3owMDdxaTltZ21vemsxcGViIn0.70mwo4YYnbxY_BJoEsGYxw', {attribution: '&copy; <a href="https://www.mapbox.com">Mapbox</a> Satelite'}),
7+
sateliteStreets = L.tileLayer('https://api.mapbox.com/styles/v1/mapbox/satellite-streets-v9/tiles/256/{z}/{x}/{y}?access_token=pk.eyJ1IjoiYmlza2F6eiIsImEiOiJjaXJkOTFkb3owMDdxaTltZ21vemsxcGViIn0.70mwo4YYnbxY_BJoEsGYxw', {attribution: '&copy; <a href="https://www.mapbox.com">Mapbox</a> Satelite Streets'}),
8+
оpenStreetMap = L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {attribution: '&copy; <a href="http://openstreetmap.org">оpenStreetMap</a> оpenStreetMap'});
9+
10+
let map = L.map('map', {
11+
center: [42.7339, 25.4858],
12+
zoom: 7,
13+
layers: outdoors,
14+
fullscreenControl: true,
15+
});
16+
17+
18+
let lc = L.control.locate({
19+
strings: {
20+
title: "Locate",
21+
},
22+
keepCurrentZoomLevel: true
23+
}).addTo(map);
24+
25+
26+
map.zoomControl.setPosition('bottomright');
27+
28+
let baseMaps = {
29+
"Outdoors": outdoors,
30+
"Streets": streets,
31+
"Dark": dark,
32+
"Light": light,
33+
"Satelite": satelite,
34+
"Satelite Streets": sateliteStreets,
35+
"OpenStreetMap": оpenStreetMap
36+
};
37+
38+
L.control.layers(baseMaps).addTo(map);
39+
40+
41+
$.get("/getimages.php", function (data) {
42+
let result = JSON.parse(data);
43+
loadImages(result);
44+
});
45+
46+
47+
function loadImages(images) {
48+
let imgArray = [];
49+
50+
images.forEach((src, index) => {
51+
let img = new Image();
52+
img.src = src;
53+
imgArray.push(img);
54+
});
55+
56+
imgArray.forEach((img) => {
57+
img.onload = function () {
58+
EXIF.getData(img, function () {
59+
let imageLat = EXIF.getTag(this, 'GPSLatitude');
60+
let imageLong = EXIF.getTag(this, 'GPSLongitude');
61+
let imageAlt = EXIF.getTag(this, 'GPSAltitude');
62+
let imageName = this.src.split("/").reverse()[0];
63+
64+
let realImageLat = imageLat[0].numerator + imageLat[1].numerator /
65+
(60 * imageLat[1].denominator) + imageLat[2].numerator / (3600 * imageLat[2].denominator);
66+
let realImageLong = imageLong[0].numerator + imageLong[1].numerator /
67+
(60 * imageLong[1].denominator) + imageLong[2].numerator / (3600 * imageLong[2].denominator);
68+
let realImageAlt = imageAlt.numerator / imageAlt.denominator;
69+
70+
let imageDisplayString = '<h4>' + imageName + '&nbsp;&nbsp;&nbsp;Altitude: ' + imageAlt + 'm.' + '</h4>' + '<img src="' + this.src + '" alt="Cool Photo" style="border-radius: 5px;" height="360" width="640">';
71+
72+
L.marker([realImageLat, realImageLong])
73+
.bindPopup(imageDisplayString, {
74+
maxWidth: 1920,
75+
autoPanPadding: L.point(50, 50)
76+
})
77+
.addTo(map)
78+
});
79+
};
80+
});
81+
}
82+

‎scripts/signIn.js‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
/**
2+
* Created by Biser Atanasov on 11-Aug-16.
3+
*/
4+
5+
6+
$('#signInButton').click(function () {
7+
let email = ($("#inputEmail").val());
8+
let password = ($("#inputPassword").val());
9+
console.log(email);
10+
console.log(password);
11+
firebase.auth().signInWithEmailAndPassword(email, password).catch(function (error) {
12+
alertify.error(error.message);
13+
});
14+
});
15+
16+
$('#signUpButton').click(function () {
17+
let email = ($("#inputEmail").val());
18+
let password = ($("#inputPassword").val());
19+
console.log(email);
20+
console.log(password);
21+
firebase.auth().createUserWithEmailAndPassword(email, password).catch(function (error) {
22+
alertify.error(error.message);
23+
});
24+
});

‎signin.html‎

Lines changed: 73 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<meta name="viewport" content="width=device-width, initial-scale=1">
7+
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
8+
<meta name="description" content="">
9+
<meta name="author" content="">
10+
<link rel="icon" href="/images/favicon.png">
11+
12+
<title>DroneMapper Sign in</title>
13+
14+
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
15+
<link href="/styles/signin.css" rel="stylesheet">
16+
<link rel="stylesheet" href="//cdn.jsdelivr.net/alertifyjs/1.8.0/css/alertify.min.css"/>
17+
18+
<script src="https://code.jquery.com/jquery-3.1.0.min.js"
19+
integrity="sha256-cCueBR6CsyA4/9szpPfrX3s49M9vUU5BgtiJj06wt/s=" crossorigin="anonymous"></script>
20+
<script src="https://www.gstatic.com/firebasejs/3.2.1/firebase.js"></script>
21+
<script src="//cdn.jsdelivr.net/alertifyjs/1.8.0/alertify.min.js"></script>
22+
23+
</head>
24+
25+
<body>
26+
27+
<nav class="navbar navbar-default navbar-fixed-top">
28+
<div class="container">
29+
<div class="navbar-header">
30+
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar"
31+
aria-expanded="false" aria-controls="navbar">
32+
<span class="sr-only">Toggle navigation</span>
33+
<span class="icon-bar"></span>
34+
<span class="icon-bar"></span>
35+
<span class="icon-bar"></span>
36+
</button>
37+
<a class="navbar-brand" href="/">DroneMapper</a>
38+
</div>
39+
<div id="navbar" class="collapse navbar-collapse">
40+
<ul class="nav navbar-nav">
41+
<li><a href="/">Home</a></li>
42+
<li><a href="uploader.html">Upload</a></li>
43+
<li class="active"><a href="signin.html" id="signInLinkButton" style="display: none;">Sign in</a></li>
44+
<li><a href="#" id="signOutButton" style="display: none;">Sign out</a></li>
45+
</ul>
46+
</div><!--/.nav-collapse -->
47+
</div>
48+
</nav>
49+
50+
<div class="container">
51+
<form class="form-signin">
52+
<h2 class="form-signin-heading">Sign in</h2>
53+
<label for="inputEmail" class="sr-only">Email address</label>
54+
<input type="email" id="inputEmail" class="form-control" placeholder="Email address" required autofocus>
55+
<label for="inputPassword" class="sr-only">Password</label>
56+
<input type="password" id="inputPassword" class="form-control" placeholder="Password" required>
57+
<div class="checkbox">
58+
<label>
59+
<input type="checkbox" value="remember-me"> Remember me
60+
</label>
61+
</div>
62+
<button class="btn btn-primary" onclick="return false" id="signInButton">Sign in</button>
63+
<button class="btn btn-default" onclick="return false" id="signUpButton">Sign up</button>
64+
</form>
65+
66+
</div>
67+
68+
<script src="/scripts/app.js"></script>
69+
<script src="/scripts/signIn.js"></script>
70+
71+
72+
</body>
73+
</html>

0 commit comments

Comments
 (0)