, then adds map
-var mapDivs = document.querySelectorAll('.map');
-mapboxgl.accessToken = 'pk.eyJ1Ijoiam9ubnliYXJuZXMiLCJhIjoiY2l2cDhjYW04MDAwcjJ0cG1uZnhqcm82ayJ9.qA2zeVA-nsoMh9IFrd5KQw';
-for (var i = 0; i < mapDivs.length; i++) {
- var mapDiv = mapDivs[i];
- var latitude = mapDiv.dataset.latitude;
- var longitude = mapDiv.dataset.longitude;
- var el = document.createElement('div');
- el.classList.add('marker');
- var mapMenu = document.createElement('div');
- mapMenu.classList.add('map-menu');
- var streetsInput = document.createElement('input');
- streetsInput.setAttribute('id', 'streets');
- streetsInput.setAttribute('type', 'radio');
- streetsInput.setAttribute('name', 'toggle');
- streetsInput.setAttribute('value', 'streets');
- streetsInput.setAttribute('checked', 'checked');
- streetsInput.addEventListener('click', function () {
- map.setStyle('mapbox://styles/mapbox/streets-v9');
- });
- var streetsLabel = document.createElement('label');
- streetsLabel.setAttribute('for', 'streets');
- streetsLabel.appendChild(document.createTextNode('Streets'));
- var satelliteInput = document.createElement('input');
- satelliteInput.setAttribute('id', 'satellite');
- satelliteInput.setAttribute('type', 'radio');
- satelliteInput.setAttribute('name', 'toggle');
- satelliteInput.setAttribute('value', 'streets');
- satelliteInput.addEventListener('click', function () {
- map.setStyle('mapbox://styles/mapbox/satellite-v9');
- });
- var satelliteLabel = document.createElement('label');
- satelliteLabel.setAttribute('for', 'satellite');
- satelliteLabel.appendChild(document.createTextNode('Satellite'));
- mapMenu.appendChild(streetsInput);
- mapMenu.appendChild(streetsLabel);
- mapMenu.appendChild(satelliteInput);
- mapMenu.appendChild(satelliteLabel);
- var map = new mapboxgl.Map({
- container: mapDiv,
- style: 'mapbox://styles/mapbox/streets-v9',
- center: [longitude, latitude],
- zoom: 15,
- scrollZoom: false
- });
- map.addControl(new mapboxgl.NavigationControl());
- new mapboxgl.Marker(el, {offset: [-10, -20]}).setLngLat([longitude, latitude]).addTo(map);
- mapDiv.appendChild(mapMenu);
-}
diff --git a/resources/assets/js/newnote.js b/resources/assets/js/newnote.js
deleted file mode 100644
index 384f3721..00000000
--- a/resources/assets/js/newnote.js
+++ /dev/null
@@ -1,314 +0,0 @@
-/* global mapboxgl, alertify */
-if ('geolocation' in navigator) {
- var button = document.querySelector('#locate');
- if (button.addEventListener) {
- //if we have javascript, event listeners and geolocation, make the locate
- //button clickable and add event
- button.disabled = false;
- button.addEventListener('click', getLocation);
- }
-}
-
-function getLocation() {
- navigator.geolocation.getCurrentPosition(function (position) {
- //the locate button has been clicked so add the places/map
- addPlacesMap(position.coords.latitude, position.coords.longitude, position.coords.accuracy);
- });
-}
-
-function addPlacesMap(latitude, longitude, uncertainty) {
- //get the nearby places
- fetch('/places/near/' + latitude + '/' + longitude + '?u=' + uncertainty, {
- credentials: 'same-origin',
- method: 'get'
- }).then(function (response) {
- return response.json();
- }).then(function (j) {
- if (j.error === true) {
- alertify.reset();
- alertify.error(j.error_description);
- }
- if (j.places.length > 0) {
- var i;
- var places = [];
- for (i = 0; i < j.places.length; ++i) {
- var latlng = parseLocation(j.places[i].location);
- var name = j.places[i].name;
- var uri = j.places[i].uri;
- places.push([name, uri, latlng[0], latlng[1]]);
- }
- //add a map with the nearby places
- addMap(latitude, longitude, places);
- } else {
- //add a map with just current location
- addMap(latitude, longitude);
- }
- }).catch(function (err) {
- console.error(err);
- });
-}
-
-function addMap(latitude, longitude, places) {
- //make places null if not supplied
- if (arguments.length == 2) {
- places = null;
- }
- // the form has a fieldset element that we are actually targetting
- var form = document.querySelector('.note-ui');
- var mapDiv = document.createElement('div');
- mapDiv.classList.add('map');
- //add the map div
- form.appendChild(mapDiv);
- //set up the mapbox gl map
- mapboxgl.accessToken = 'pk.eyJ1Ijoiam9ubnliYXJuZXMiLCJhIjoiY2l2cDhjYW04MDAwcjJ0cG1uZnhqcm82ayJ9.qA2zeVA-nsoMh9IFrd5KQw';
- var map = new mapboxgl.Map({
- container: mapDiv,
- style: 'mapbox://styles/mapbox/streets-v9',
- center: [longitude, latitude],
- zoom: 15
- });
- map.addControl(new mapboxgl.NavigationControl());
- //create the current location marker
- var el = document.createElement('div');
- el.classList.add('marker');
- //create the map style menu
- var mapMenu = document.createElement('div');
- mapMenu.classList.add('map-menu');
- var streetsInput = document.createElement('input');
- streetsInput.setAttribute('id', 'streets');
- streetsInput.setAttribute('type', 'radio');
- streetsInput.setAttribute('name', 'toggle');
- streetsInput.setAttribute('value', 'streets');
- streetsInput.setAttribute('checked', 'checked');
- streetsInput.addEventListener('click', function () {
- map.setStyle('mapbox://styles/mapbox/streets-v9');
- });
- var streetsLabel = document.createElement('label');
- streetsLabel.setAttribute('for', 'streets');
- streetsLabel.appendChild(document.createTextNode('Streets'));
- var satelliteInput = document.createElement('input');
- satelliteInput.setAttribute('id', 'satellite');
- satelliteInput.setAttribute('type', 'radio');
- satelliteInput.setAttribute('name', 'toggle');
- satelliteInput.setAttribute('value', 'streets');
- satelliteInput.addEventListener('click', function () {
- map.setStyle('mapbox://styles/mapbox/satellite-v9');
- });
- var satelliteLabel = document.createElement('label');
- satelliteLabel.setAttribute('for', 'satellite');
- satelliteLabel.appendChild(document.createTextNode('Satellite'));
- mapMenu.appendChild(streetsInput);
- mapMenu.appendChild(streetsLabel);
- mapMenu.appendChild(satelliteInput);
- mapMenu.appendChild(satelliteLabel);
- //add the map menu
- mapDiv.appendChild(mapMenu);
- //add a marker for the current location
- new mapboxgl.Marker(el, {offset: [-10, -20]}).setLngLat([longitude, latitude]).addTo(map);
- //create containing div for flexbox
- var containingDiv = document.createElement('div');
- //create the