$(document).ready(function () {
/*
* Mapping Variable Declarations
*/
var map;
var ft_to_m = 3.28084;
var yd_to_m = 1.09361;
// Location position
var originalLat = $("#locationLat").val();
var originalLng = $("#locationLng").val();
var originalPosition = new google.maps.LatLng(originalLat, originalLng);
// Default Options
var defaultOptions = {
zoom: 18,
minZoom: 15,
panControl: false,
streetViewControl: false,
mapTypeControl: false,
rotateControl: true,
mapTypeId: google.maps.MapTypeId.SATELLITE,
rotateControlOptions: {
position: google.maps.ControlPosition.LEFT_CENTER
},
zoomControlOptions: {
position: google.maps.ControlPosition.LEFT_CENTER
},
tilt: 0,
gestureHandling: 'greedy',
fullscreenControl: false
};
//Markers
var markers = {};
var markerCounter = 0;
var markerZindex = 500;
var currentMarker;
var goBackPosition;
var triggeredMarker;
//polygons
var polygons = {};
var polygonCounter = 0;
var polygonZindex = 100;
var currentPolygon;
var newPolygonMarkers = [];
var newPolygon;
var newPolyOptions = {
strokeColor: '#F00',
strokeOpacity: 1.0,
strokeWeight: 1
};
var lines = {};
var lineCounter = 0;
var newLine;
var currentLine;
var newLineOptions = {
strokeColor: '#F00',
strokeOpacity: 1.0,
strokeWeight: 1
};
//other stuff
var jsonData = {};
var infoWindow = new google.maps.InfoWindow({
content: 'Content Undefined',
maxWidth: '600',
zIndex: 300
});
var drawingMode = 0;
var markerIcon = {
url: "",
size: new google.maps.Size(32, 32),
origin: new google.maps.Point(0, 0),
anchor: new google.maps.Point(16, 16),
scaledSize: new google.maps.Size(24, 24)
};
var positionIcon = {
url: "http://prositeaudit.com/manmap.png",
size: new google.maps.Size(32, 32),
origin: new google.maps.Point(0, 0),
anchor: new google.maps.Point(16, 16),
scaledSize: new google.maps.Size(24, 24)
};
var markerIcon_small = {
url: "",
size: new google.maps.Size(32, 32),
origin: new google.maps.Point(0, 0),
anchor: new google.maps.Point(8, 8),
scaledSize: new google.maps.Size(16, 16)
};
var type;
var score;
var imagePath = '/uploads/reviews/' + companyId + '/' + assessmentId + '/';
var helperPolygon;
var showTutorial = 1;
var firstMarker = 0;
var firstPolygonMarker;
var newPolygonCornerCounter = 0;
var newZoneTypeId = $("#defaultZoneTypeId").val();
var mouseHandler = null; // an handler to move infowindow --> by preeti
var reportlastPosition = null;
var newLineTypeId;
var firstLineMarker;
var firstLine;
var newLineCornerCounter = 0;
// flag for new or existing marker when using mobile interface
var newMarker = true;
// flag for new or existing zone when using mobile interface
var newZone = true;
// flag for new or existing line when using mobile interface
var newLineFlag = true;
// Flag for first load
var firstLoad = true;
/* Change the default to be the first zone type */
for (var a in zoneTypes) break;
newZoneTypeId = a;
function isMobile() {
if ($("#mobileDetector").is(':visible')) {
return true;
}
return false;
}
function isTabletOrSmaller() {
if($("#tabletDetector").is(":visible")) {
return true;
}
return false;
}
/*
* General Mapping functions
* */
$(".markerOptions").hide();
/****************************
* Marker Functions & Stuff *
****************************/
function addMarker(markerInfo, reportMarker, noUpdate) {
markerCounter++;
var icon = markerInfo.icon;
originalIcon = icon['url'];
icon['url'] = '/icon/' + addMarkerNumber(markerInfo.markerTypeId, markerCounter);
var id = null;
if (typeof(markerInfo.id) != 'undefined') {
id = markerInfo.id;
}
var showIssue = true;
if (reportFilter) {
var markerTypeId = markerInfo.markerTypeId;
if (filteredIssues.indexOf(markerTypeId) < 0) {
showIssue = false;
}
}
smallIcon = markerIcon_small;
smallIcon['url'] = icon['url'];
var markerOptions = {
map: showIssue ? map : null,
draggable: true,
crossOnDrag: false,
animation: null,
raiseOnDrag: false,
markerID: markerCounter,
title: 'Issue #' + markerCounter,
position: markerInfo.position,
icon: icon,
id: id,
markerType: markerInfo.markerType,
markerTypeId: markerInfo.markerTypeId,
markerDescription: markerInfo.description,
severity: markerInfo.severity,
image1: (markerInfo.image1) ? markerInfo.image1 : '',
image2: (markerInfo.image2) ? markerInfo.image2 : '',
zIndex: (markerZindex + markerCounter),
originalIcon: originalIcon,
saved: markerInfo.saved
};
markers[markerCounter] = new google.maps.Marker(markerOptions);
if (!reportMarker) {
google.maps.event.addListener(markers[markerCounter], 'click', function () {
loadMarkerWindow(this.markerID, this);
});
google.maps.event.addListener(markers[markerCounter], 'dragend', function () {
this.saved = false;
if (this.poppedUp !== true) {
// Load the info window
var windowOpen = ($("#mapInfoWindow" + this.markerID).length); // get the infowindow if already clicked
if (windowOpen) {
}
else {
var marker = this;
var markerID = this.markerID;
setTimeout(function () {
loadMarkerWindow(markerID, marker); // open infowindow on 1st time dragend.
}, 200);
}
this.poppedUp = true;
}
else {
this.saved = false;
syncMapData();
}
});
//
if (typeof noUpdate == 'undefined') {
updateIssuesTable();
}
}
else {
google.maps.event.addListener(markers[markerCounter], 'dragstart', function () {
reportlastPosition = this.getPosition();
});
google.maps.event.addListener(markers[markerCounter], 'dragend', function () {
this.setPosition(reportlastPosition);
});
google.maps.event.addListener(markers[markerCounter], 'click', function () {
loadReportMarkerWindow(this.markerID);
});
}
}
function updateMarkerCounter() {
var counter = 0;
for (i in markers) {
counter++;
markers[i].markerCounter = counter;
// If we've delete an earlier one, we need to shift the position in the array
if (markers[i].markerCounter !== markers[i].markerID) {
markers[counter] = markers[i];
markers[counter].markerID = counter;
delete markers[i];
} else {
var icon = markers[i].getIcon();
icon['url'] = addMarkerNumber(markers[i].originalIcon, counter);
var smallIcon = markerIcon_small;
smallIcon['url'] = icon['url'];
markers[i].setIcon(icon);
markers[i].setTitle('Issue #' + counter);
}
}
markerCounter = counter;
}
function issueCount() {
var numMarkers = Object.keys(markers).length;
var numZones = Object.keys(polygons).length;
var numLines = Object.keys(lines).length;
return numMarkers + numZones + numLines;
}
/*Remove Marker*/
function removeMarker(removeMarkerId) {
var marker = markers[removeMarkerId];
if (markers[removeMarkerId].id != null) {
$.ajax({
url: '/audit/deleteIssue/' + markers[removeMarkerId].id,
method: 'get'
})
.done(function (response) {
marker.setMap(null);
$("#marker-" + marker.markerID).fadeOut(300, function () {
$(this).remove();
});
$("#marker-card-" + marker.markerID).fadeOut(300, function () {
$(this).remove();
});
delete markers[removeMarkerId];
updateMarkerCounter();
hideInfoWindowToolbar();
updateIssuesTable();
})
.error(function() {
bootbox.alert('There was an error deleting the issue');
});
}
else {
marker.setMap(null);
delete markers[removeMarkerId];
updateMarkerCounter();
hideInfoWindowToolbar();
updateIssuesTable();
}
}
function loadMobileZoneScreen(polygon) {
var zoneLetter = String.fromCharCode(64 + polygon.polygonID);
var zoneTypeId = polygon.typeId;
var zoneTypeName = zoneTypes[zoneTypeId];
var infoColor = zoneColors[zoneTypeId][0];
var infoTextColor = zoneColors[zoneTypeId][2];
$('div.mobileInfoCardInner').scrollTop(0); // Scroll DIV To Top
$("#mobileZoneInfo").find('.bg-info').css('background-color', infoColor);
$("#mobileZoneInfo").find('.bg-info').css('color', infoTextColor);
$("#mobileZoneId").text(zoneLetter);
$("#mobileZoneName").text(zoneTypeName);
$("#mobileZoneSelect").val(zoneTypeId);
$("#mobileZoneDescription").val(polygon.polygonDescription);
$("#mobileZoneAreaFt").text(commaSeparateNumber(polygon.area_ft));
$("#mobileZoneAreaYds").text(commaSeparateNumber(polygon.area_yd));
$("#saveZoneMobile").data('zone-id', polygon.polygonID);
$("#deleteZoneMobile").data('zone-id', polygon.polygonID);
$("#mobileZoneInfo").data('zone-id', polygon.polygonID);
$("#mobileZoneSelect").data('zone-id', polygon.polygonID);
$("#mobileZoneDescription").data('zone-id', polygon.polygonID);
$("#saveZoneMobile").data('zone-id', polygon.polygonID);
$("#saveZoneMobileNew").data('zone-id', polygon.polygonID);
var content = '';
var previewSrc1 = '/addImage.png';
var image1 = false;
var previewSrc2 = '/addImage.png';
var image2 = false;
var preview1 = $("#previewPolygon-" + polygon.polygonID + "-1").attr('src');
var preview2 = $("#previewPolygon-" + polygon.polygonID + "-2").attr('src');
if (preview1) {
previewSrc1 = preview1;
var image1 = true;
}
if (preview2) {
previewSrc2 = true;
var image2 = true;
}
if (image1) {
content = content +
'
' +
'';
infoWindow.setContent(content);
infoWindow.setOptions({pixelOffset: new google.maps.Size(0, 0)}); // THis gets adjusted by opening polygon windows
infoWindow.open(map, marker);
currentMarker = marker.markerID;
}
/*************************
* Polygon Stuff & Stuff *
*************************/
function refreshImages() {
$(".imageAttachment").each(function () {
var markerId = $(this).data('markerid');
var imageNum = $(this).data('image-num');
var marker = markers[markerId];
var imageWrapper = $(this).find('.imageWrapper');
var fileWrapper = $(this).find('.fileWrapper');
var theImage = $(this).find('.image');
var encodeImage = $(this).find('.encodeImage');
var remove = $(this).find('.remove');
var cancel = $(this).find('.cancel');
var fileName = $(this).find('.fileName');
var lightbox = $(this).find('.lightbox-image');
var parentRow = $(this).parents('tr');
// Cards for mobile
var cardImageAttachment = $("#marker-card-attachment-" + markerId + '-' + imageNum);
var cardImageWrapper = cardImageAttachment.find('.cardImageWrapper');
var cardFileWrapper = cardImageAttachment.find('.cardFileWrapper');
var cardImage = cardImageWrapper.find('.image');
var cardLightbox = cardImageWrapper.find('.lightbox-card-image');
if (marker) {
var selectedImage = null;
switch (imageNum) {
case 1:
selectedImage = marker.image1;
break;
case 2:
selectedImage = marker.image2;
break;
}
if (selectedImage) {
var imgSrc = null;
// If not base64
if (isBase64(selectedImage)) {
imgSrc = selectedImage;
}
else {
imgSrc = imagePath + selectedImage;
}
// Hide the uploads and show the image
fileWrapper.hide();
cardFileWrapper.hide();
imageWrapper.show();
cardImageWrapper.show();
theImage.attr('src', imgSrc);
cardImage.attr('src', imgSrc);
lightbox.attr('href', imgSrc);
cardLightbox.attr('href', imgSrc);
}
else {
fileWrapper.show();
cardFileWrapper.show();
imageWrapper.hide();
cardImageWrapper.hide();
}
}
else {
// Remove rows from the table of any non existent items
parentRow.remove();
$('#marker-card-' + markerId).remove();
}
var windowOpen = ($("#mapInfoWindow" + markerId).length);
if (windowOpen) {
infoWindow.close();
//hideInfoWindowToolbar();
setTimeout(function () {
new google.maps.event.trigger(markers[markerId], 'click');
}, 500)
}
});
if ($("#mobileMarkerInfo").is(':visible')) {
var marker = markers[$("#mobileMarkerInfo").data('marker-id')];
if (marker && (marker.markerID == triggeredMarker)) {
$(".imageLoading").show();
setTimeout(function () {
$(".imageLoading").hide();
if ($("#mobileMarkerInfo").hasClass('showMe')) {
loadMobileMarkerScreen(marker.markerID, newMarker);
}
}, 1500);
}
}
}
/*Build hidden inputs to be sent to server*/
function addHiddenInput(name, value, quote) {
quote = quote || '"';
$("#hiddenInputs").append('');
}
/*Save trigger*/
$("#saveReview, #sendReview").on('click', function () {
var sendValue = $(this).data('save');
var completeValue = $(this).data('complete');
// Hide the confirmation modals
$('#modalSaved').modal('hide');
$('#modalSubmitted').modal('hide');
// How the saving modal
$('#savingModal').modal('show');
prepareFormData(sendValue, completeValue);
$('#savingModal').modal('hide');
});
function updateIssuesTable(refresh) {
updateMarkerCounter();
var counter = 0;
var html;
$("#markerCards").html('');
$("#issues tbody").html('');
//add new markers to the table
for (i in markers) {
//add for new markers
counter++;
marker = markers[i];
var category = '';
if (combined) {
category = auditTypes[typeCategories[marker.markerTypeId]].name;
}
html =
'
';
infoWindow.setContent(content);
infoWindow.setPosition(line.center);
infoWindow.setOptions({pixelOffset: new google.maps.Size(-25, 0)}); // set the offset to get the clickable map --> by preeti
infoWindow.open(map);
}
function updateLinesTable(refresh) {
var counter = 0;
var html;
var category = '';
$("#issues-lines tbody").html('');
$("#lineCards").html('');
for (i in lines) {
counter++;
var lineLetter = String.fromCharCode(64 + counter);
// Update the label with the correct letter
var line = lines[i];
if (combined) {
category = auditTypes[lineCategories[line.typeId]].name + ' | ';
}
line.label.setContent('Line:' + String.fromCharCode(64 + counter) + '');
html =
'
';
}
var descriptionContent;
if (line.lineDescription) {
descriptionContent = line.lineDescription;
}
else {
descriptionContent = 'No description was given for this line';
}
content +=
'
' +
'
' +
'
' + descriptionContent + '
' +
'
' +
'
' +
'
' +
'
' +
'
';
infoWindow.setContent(content);
infoWindow.setPosition(line.center);
infoWindow.setOptions({pixelOffset: new google.maps.Size(-25, 0)}); // set the offset to get the clickable map --> by preeti
infoWindow.open(map);
}
function loadPolygonWindow(id, polygon) {
updatePolygonCounter();
currentPolygon = id;
var polygon = polygons[id];
if (isMobile()) {
loadMobileZoneScreen(polygon);
return;
}
var offsetDistance;
var mapZoom = map.getZoom();
var offsetLat;
var offsetLng;
var polygonLat = polygon.center.lat();
var polygonLng = polygon.center.lng();
goBackPosition = new google.maps.LatLng(polygonLat, polygonLng);
switch (mapZoom) {
case 20:
offsetDistance = 0.0002;
break;
case 19:
offsetDistance = 0.0004;
break;
case 18:
offsetDistance = 0.0007;
break;
case 17:
offsetDistance = 0.0015;
break;
case 16:
offsetDistance = 0.0028;
break;
}
switch (heading) {
case 90:
offsetLat = polygonLat;
offsetLng = polygonLng + offsetDistance;
break;
case 180:
offsetLat = polygonLat - offsetDistance;
offsetLng = polygonLng;
break;
case 270:
offsetLat = polygonLat;
offsetLng = polygonLng - offsetDistance;
break;
default:
offsetLat = polygonLat + offsetDistance;
offsetLng = polygonLng;
break;
}
var newCenter = new google.maps.LatLng(offsetLat, offsetLng);
map.setCenter(newCenter);
var previewSrc1 = '/addImage.png';
var image1 = false;
var previewSrc2 = '/addImage.png';
var image2 = false;
var preview1 = $("#previewPolygon-" + id + "-1").attr('src');
var preview2 = $("#previewPolygon-" + id + "-2").attr('src');
if (preview1) {
previewSrc1 = preview1;
var image1 = true;
}
if (preview2) {
previewSrc2 = true;
var image2 = true;
}
var content =
'
';
infoWindow.setContent(content);
infoWindow.setPosition(polygon.center);
infoWindow.setOptions({pixelOffset: new google.maps.Size(-25, 0)}); // set the offset to get the clickable map --> by preeti
infoWindow.open(map);
}
function removePolygon(removePolygonId) {
var polygon = polygons[removePolygonId];
if (polygon.id != null) {
$.get('/audit/deleteZone/' + polygon.id, function (response) {
if (response.success) {
polygon.setMap(null);
polygon.label.close();
delete polygons[removePolygonId];
infoWindow.close();
hideInfoWindowToolbar();
$("#polygon-" + polygon.polygonID).fadeOut(300, function () {
$(this).remove();
});
$("#polygon-card-" + polygon.polygonID).fadeOut(300, function () {
$(this).remove();
});
}
else {
bootbox.alert('There was an error deleting the zone');
}
});
}
else {
polygon.setMap(null);
polygon.label.close();
infoWindow.close();
hideInfoWindowToolbar();
delete polygons[removePolygonId];
}
updatePolygonIssuesTable();
}
function removeLine(removeLineId) {
var line = lines[removeLineId];
if (line.id != null) {
$.get('/audit/deleteLine/' + line.id, function (response) {
if (response.success) {
line.setMap(null);
line.label.close();
delete lines[removeLineId];
infoWindow.close();
$("#line-" + line.lineID).fadeOut(300, function () {
$(this).remove();
});
$("#line-card-" + line.lineID).fadeOut(300, function () {
$(this).remove();
});
}
else {
bootbox.alert('There was an error deleting the line');
}
});
}
else {
line.setMap(null);
line.label.close();
delete lines[removeLineId];
infoWindow.close();
hideInfoWindowToolbar();
}
updateLinesTable();
}
function updatePolygonIssuesTable(refresh) {
var counter = 0;
var html;
var category = '';
$("#issues-polygons tbody").html('');
$("#zoneCards").html('');
//add new markers to the table
for (i in polygons) {
//add for new markers
counter++;
polygon = polygons[i];
if (combined) {
category = auditTypes[zoneCategories[polygon.typeId]].name;
}
polygon.label.setContent('Zone: ' + String.fromCharCode(64 + counter) + '');
html =
'
';
}
var descriptionContent;
if (marker.markerDescription) {
descriptionContent = marker.markerDescription;
}
else {
descriptionContent = 'No description was given for this issue';
}
content = content +
'
' +
'
' +
'
' +
'
' +
'' +
'
' + descriptionContent + '
' +
'
' +
'
' +
'
';
content = content + '
' +
'';
infoWindow.setContent(content);
infoWindow.setOptions({pixelOffset: new google.maps.Size(0, 0)}); // THis gets adjusted by opening polygon windows
infoWindow.open(map, marker);
currentMarker = marker.markerID;
}
function loadMobileReportMarkerWindow(markerId) {
var marker = markers[markerId];
var markerTypeName = markerTypes[marker.markerType];
var severityId = marker.severity;
var infoColor = markerColors[marker.markerTypeId]['color'];
var infoTextColor = markerColors[marker.markerTypeId]['text_color'];
$("#mobileMarkerInfo").find('.bg-info').css('background-color', infoColor);
$("#mobileMarkerInfo").find('.bg-info').css('color', infoTextColor);
$("#mobileMarkerId").text(marker.markerID);
$("#mobileMarkerName").text(markerTypeName);
$("#reportMarkerType").text(severity_types[marker.severity]);
var content = '';
var previewSrc1 = '/addImage.png';
var image1 = false;
var previewSrc2 = '/addImage.png';
var image2 = false;
var preview1 = $("#preview-" + marker.markerID + "-1").attr('src');
var preview2 = $("#preview-" + marker.markerID + "-2").attr('src');
if (preview1) {
previewSrc1 = preview1;
var image1 = true;
}
if (preview2) {
previewSrc2 = true;
var image2 = true;
}
content = content + '
';
}
var descriptionContent;
if (polygon.polygonDescription) {
descriptionContent = polygon.polygonDescription;
}
else {
descriptionContent = 'No description was given for this zone';
}
content +=
'
' +
'
' +
'
' + descriptionContent + '
' +
'
' +
'
' +
'
' +
'
' +
'
';
infoWindow.setContent(content);
infoWindow.setPosition(polygon.center);
infoWindow.setOptions({pixelOffset: new google.maps.Size(-25, 0)}); // set the offset to get the clickable map --> by preeti
infoWindow.open(map);
}
function loadMobileReportZoneWindow(zoneId) {
polygon = polygons[zoneId];
var zoneLetter = String.fromCharCode(64 + polygon.polygonID);
var zoneTypeId = polygon.typeId;
var zoneTypeName = zoneTypes[zoneTypeId];
var infoColor = zoneColors[zoneTypeId][0];
var infoTextColor = zoneColors[zoneTypeId][2];
$("#mobileZoneInfo").find('.bg-info').css('background-color', infoColor);
$("#mobileZoneInfo").find('.bg-info').css('color', infoTextColor);
$("#mobileZoneId").text(zoneLetter);
$("#mobileZoneName").text(zoneTypeName);
$("#mobileZoneSelect").val(zoneTypeId);
$("#mobileZoneDescription").val(polygon.polygonDescription);
$("#mobileZoneAreaFt").text(commaSeparateNumber(polygon.area_ft));
$("#mobileZoneAreaYds").text(commaSeparateNumber(polygon.area_yd));
var content = '';
var previewSrc1 = '/addImage.png';
var image1 = false;
var previewSrc2 = '/addImage.png';
var image2 = false;
var preview1 = $("#previewPolygon-" + polygon.polygonID + "-1").attr('src');
var preview2 = $("#previewPolygon-" + polygon.polygonID + "-2").attr('src');
if (preview1) {
previewSrc1 = preview1;
var image1 = true;
}
if (preview2) {
previewSrc2 = true;
var image2 = true;
}
if (image1) {
content = content +
'
';
}
$("#mobileZoneImages").html(content);
var zoneDescription = 'No description was given for this zone';
if (polygon.polygonDescription) {
zoneDescription = polygon.polygonDescription;
}
$("#mobileZoneReportDescription").text(zoneDescription);
$("#mobileZoneImages").html(content);
$("#mobileZoneInfo").addClass('showMe');
}
function loadMobileReportLineWindow(lineId) {
var line = lines[lineId];
var lineLetter = String.fromCharCode(64 + line.lineID);
var lineTypeId = line.typeId;
var lineTypeName = lineTypes[lineTypeId];
var infoColor = lineColors[lineTypeId][0];
var infoTextColor = lineColors[lineTypeId][2];
$("#mobileLineInfo").find('.bg-info').css('background-color', infoColor);
$("#mobileLineInfo").find('.bg-info').css('color', infoTextColor);
$("#mobileLineId").text(lineLetter);
$("#mobileLineName").text(lineTypeName);
$("#mobileLineDescription").val(line.lineDescription);
$("#mobileLineLengthFt").text(commaSeparateNumber(line.length_ft));
$("#mobileLineLengthYds").text(commaSeparateNumber(line.length_yd));
var content = '';
var previewSrc1 = '/addImage.png';
var image1 = false;
var previewSrc2 = '/addImage.png';
var image2 = false;
var preview1 = $("#previewLine-" + line.lineID + "-1").attr('src');
var preview2 = $("#previewLine-" + line.lineID + "-2").attr('src');
if (preview1) {
previewSrc1 = preview1;
var image1 = true;
}
if (preview2) {
previewSrc2 = true;
var image2 = true;
}
if (image1) {
content = content +
'
';
}
$("#mobileLineImages").html(content);
var lineDescription = 'No description was given for this line';
if (line.lineDescription) {
lineDescription = line.lineDescription;
}
$("#mobileLineReportDescription").text(lineDescription);
$("#mobileLineImages").html(content);
$("#mobileLineInfo").addClass('showMe');
}
function isEven(x) {
return !( x & 1 );
}
$(".auditAddressTitle").textfill({
maxFontPixels: 17
});
function encodeReportImage() {
var auditKey = $("#auditKey").val();
var defer = $.Deferred();
$(".preReportImage").show();
$(".postReportImage").hide();
$("#modalReportImage").modal('show');
html2canvas([$("#map")[0]], {
logging: false,
useCORS: true,
onrendered: function (canvas) {
var extra_canvas = document.createElement("canvas");
extra_canvas.setAttribute('width', 600);
extra_canvas.setAttribute('height', 700);
var ctx = extra_canvas.getContext('2d');
ctx.drawImage(canvas, 0, 0, canvas.width, canvas.height, 0, 0, 600, 700);
var dataURL = extra_canvas.toDataURL();
// We have the base64 - now send it to server
$.ajax({
url: "/report/saveImage/" + auditKey,
method: 'POST',
data: {
encodedImage: dataURL
},
dataType: "json",
timeout: 20000
})
.done(function (data) {
if (data.success) {
$("#reportImageFeedback").text('Your report is being downloaded');
$(".preReportImage").hide();
$(".postReportImage").show();
var currentUrl = window.location.href.replace("#", '');
window.location.href = currentUrl + '/print';
}
else {
$("#reportImageFeedback").text('There was an error generating your report');
$(".preReportImage").hide();
$(".postReportImage").show();
}
defer.resolve();
})
.error(function () {
defer.resolve();
$("#reportImageFeedback").text = 'There was an error generating your report';
$(".preReportImage").hide();
$(".postReportImage").show();
});
}
});
return defer.promise();
}
function isBase64(text) {
return (text.indexOf('data:image') !== -1);
}
/**
* Functions specifically for the report page
*/
markers = {};
markerCounter = 0;
$("#map").html('');
defaultOptions.center = originalPosition;
map = new google.maps.Map(document.getElementById('map'), defaultOptions);
google.maps.event.addListenerOnce(map, 'idle', function () {
//populate if there are saved markers
for (i in prepopulatedMarkers) {
var markerInfo = {};
markerInfo.markerType = 'marker-' + prepopulatedMarkers[i].type_id;
markerInfo.markerTypeId = prepopulatedMarkers[i].type_id;
markerInfo.position = new google.maps.LatLng(prepopulatedMarkers[i].lat, prepopulatedMarkers[i].lng);
markerInfo.icon = markerIcon;
markerInfo.icon['url'] = '/icon/' + icons[markerInfo.markerType];
markerInfo.description = prepopulatedMarkers[i].description;
markerInfo.severity = prepopulatedMarkers[i].severity;
markerInfo.image1 = prepopulatedMarkers[i].image1;
markerInfo.image2 = prepopulatedMarkers[i].image2;
addMarker(markerInfo, true);
}
//populate zones
for (i in prepopulatedPolygons) {
var path = new google.maps.MVCArray;
for (j in prepopulatedPolygons[i].path) {
var latLngData = prepopulatedPolygons[i].path[j];
path.push(new google.maps.LatLng(latLngData[Object.keys(latLngData)[0]], latLngData[Object.keys(latLngData)[1]]));
}
prepopulatedPolygons[i].path = path;
addPolygon(prepopulatedPolygons[i], true);
}
// Lines
for (i in prepopulatedLines) {
var path = new google.maps.MVCArray;
for (j in prepopulatedLines[i].path) {
var latLngData = prepopulatedLines[i].path[j];
path.push(new google.maps.LatLng(latLngData[Object.keys(latLngData)[0]], latLngData[Object.keys(latLngData)[1]]));
}
prepopulatedLines[i].path = path;
addLine(prepopulatedLines[i], true);
}
fitMap();
});
$("#setBounds").on('click', function () {
fitMap();
return false;
});
/* Toggle show/hide of "view" Dropdown */
$(document).ready(function(){
$('.listToggleHeader').delegate('input,label', 'click', function(e){ e.stopImmediatePropagation(); }).click(function(event){
var toggle_header = $(this);
var toggle_target = toggle_header.data('target');
$(toggle_header).toggleClass('toggleHeaderShow');
$(toggle_target).toggleClass('toggleContentShow');
});
});
$(document).on('show.bs.collapse', ".mobileIssueCards .collapse", function() {
$(".mobileIssueCards .collapse").collapse('hide');
var panel = $(this).parent()[0];
});
$(".reportSection a").click(function() {
$(".reportSectionContent").collapse('hide');
$(this).collapse('show');
});
// Open up the window full-screen
$('.showMapFullScreen').click(function() {
$("#startPage").removeClass('showMe');
var center = map.getCenter();
$('#map-wrapper').addClass('mapFullScreen');
$('body').addClass('mapOpen'); // Hide scrollbars
setTimeout(function(){ // Wait one second for animation to finish
google.maps.event.trigger(map, 'resize'); // Update google maps
map.setCenter(center);
fitMap();
}, 1);
});
$('#closeMapFullScreen').click(function() {
$('#map-wrapper').removeClass('mapFullScreen');
$('body').removeClass('mapOpen'); // Show scrollbars
$('#instructionsMapFullScreen').removeClass('showMe');
window.scrollTo(0, 0);
});
/** Function to recenter the map based on items or initial location **/
$("#resetMap").click(function() {
var totalIssues = issueCount();
if (totalIssues) {
fitMap(true);
}
else {
map.setCenter(locationMarker.position);
}
$("#mapMenu").dropdown('toggle');
return false;
});
function showInfoWindowToolbar() {
// Do nothing, this is a review function that gets called in mapping.js so it's also needed here
// Not great, but it works.
}
function hideInfoWindowToolbar() {
// See above
}
$(document).on('click', ".lineLabel", function(e) {
var lineId = $(this).data('label-id');
new google.maps.event.trigger( lines[lineId], 'click', {} );
return false;
});
// Keep the dropdown open after click events on the view menu
$('#viewMenu .dropdown-menu').click(function(event){
event.stopPropagation();
});
// When view dropdown is to be shown, only show the checkboxes for the types that are on the map
$('#viewMenu').on('show.bs.dropdown', function () {
// Hide all
$(".issueCheckBox").parents('li').hide();
$(".zoneCheckBox").parents('li').hide();
$(".lineCheckBox").parents('li').hide();
var drawnTypes = getDrawnTypes();
$(".issueCheckBox").each(function() {
var typeId = parseInt($(this).val());
if (drawnTypes.issues.indexOf(typeId) !== -1) {
$(this).parents('li').show();
}
});
$(".zoneCheckBox").each(function() {
var typeId = parseInt($(this).val());
if (drawnTypes.zones.indexOf(typeId) !== -1) {
$(this).parents('li').show();
}
});
$(".lineCheckBox").each(function() {
var typeId = parseInt($(this).val());
if (drawnTypes.lines.indexOf(typeId) !== -1) {
$(this).parents('li').show();
}
});
});
// Keep the dropdown open after click events on the view menu
$('#viewMenu .dropdown-menu').click(function(event){
event.stopPropagation();
});
// When view dropdown is to be shown, only show the checkboxes for the types that are on the map
$('#viewMenu').on('show.bs.dropdown', function () {
// Hide all
$(".issueCheckBox").parents('li').hide();
$(".zoneCheckBox").parents('li').hide();
$(".lineCheckBox").parents('li').hide();
var drawnTypes = getDrawnTypes();
$(".issueCheckBox").each(function() {
var typeId = parseInt($(this).val());
if (drawnTypes.issues.indexOf(typeId) !== -1) {
$(this).parents('li').show();
}
});
$(".zoneCheckBox").each(function() {
var typeId = parseInt($(this).val());
if (drawnTypes.zones.indexOf(typeId) !== -1) {
$(this).parents('li').show();
}
});
$(".lineCheckBox").each(function() {
var typeId = parseInt($(this).val());
if (drawnTypes.lines.indexOf(typeId) !== -1) {
$(this).parents('li').show();
}
});
});
$('#viewMenu').on('shown.bs.dropdown', function(){
$("#viewMenuControls").show();
});
$('#viewMenu').on('hide.bs.dropdown', function(){
$("#viewMenuControls").hide();
});
// Close it
$("#closeViewMenu").click(function() {
$('#viewMenu .dropdown-toggle').dropdown('toggle');
return false;
});
$('#viewMenuAll').click(function() {
$("#viewMenu input").prop('checked', true);
return false;
});
$('#viewMenuNone').click(function() {
$("#viewMenu input").prop('checked', false);
return false;
});
// Handle 'all issues' being selected
$('#viewAllIssues' ).on( 'change', function( event ) {
// If checked, check all issues, otherwise uncheck all
var checked = false;
if ($(this).prop('checked')) {
var checked = true;
}
$('.issueCheckBox').each(function() {
$(this).prop('checked', checked);
});
return false;
});
// Handle individual issue checks
$('#viewMenu input.issueCheckBox' ).on('change', function(event) {
// If all are selected, check the all box above, otherwise uncheck it
if ($('.issueCheckBox:checked').length == $('.issueCheckBox').length) {
$("#viewAllIssues").prop('checked', true);
}
else {
$("#viewAllIssues").prop('checked', false);
}
return false;
});
// Handle 'all zones' being selected
$('#viewAllZones').on( 'change', function( event ) {
// If checked, check all issues, otherwise uncheck all
var checked = false;
if ($(this).prop('checked')) {
var checked = true;
}
$('.zoneCheckBox').each(function() {
$(this).prop('checked', checked);
});
return false;
});
// Handle individual issue checks
$('#viewMenu input.zoneCheckBox' ).on('change', function(event) {
// If all are selected, check the all box above, otherwise uncheck it
if ($('.zoneCheckBox:checked').length == $('.zoneCheckBox').length) {
$("#viewAllZones").prop('checked', true);
}
else {
$("#viewAllZones").prop('checked', false);
}
return false;
});
// Handle 'all lines' being selected
$('#viewAllLines').on( 'change', function( event ) {
// If checked, check all issues, otherwise uncheck all
var checked = false;
if ($(this).prop('checked')) {
var checked = true;
}
$('.lineCheckBox').each(function() {
$(this).prop('checked', checked);
});
return false;
});
// Handle individual line checks
$('#viewMenu input.lineCheckBox' ).on('change', function(event) {
// If all are selected, check the all box above, otherwise uncheck it
if ($('.lineCheckBox:checked').length == $('.lineCheckBox').length) {
$("#viewAllLines").prop('checked', true);
}
else {
$("#viewAllLines").prop('checked', false);
}
return false;
});
$("#applyViewChanges").click(function() {
drawSelectedObjects();
updateViewMessage();
$('#viewMenu .dropdown-toggle').dropdown('toggle');
});
$("#reportAddressTitle").textfill({});
function setVisibleIssues() {
visibleIssues.issues = [];
visibleIssues.zones = [];
visibleIssues.lines = [];
// Issues
$('.issueCheckBox').each(function() {
if ($(this).prop('checked')) {
visibleIssues.issues.push(parseInt($(this).val()));
}
});
// Zones
$('.zoneCheckBox').each(function() {
if ($(this).prop('checked')) {
visibleIssues.zones.push(parseInt($(this).val()));
}
});
// Lines
$('.lineCheckBox').each(function() {
if ($(this).prop('checked')) {
visibleIssues.lines.push(parseInt($(this).val()));
}
});
}
function drawSelectedObjects() {
setVisibleIssues();
var showIssues = [];
var showZones = [];
var showLines = [];
// Issues
if (visibleIssues.issues.length > 0) {
for (i in visibleIssues.issues) {
var issueTypeId = visibleIssues.issues[i];
for (i in markers) {
markers[i].setMap(null);
if (markers[i].markerTypeId == issueTypeId) {
showIssues.push(markers[i]);
}
}
for (i in showIssues) {
showIssues[i].setMap(map);
}
}
}
else {
for (i in markers) {
markers[i].setMap(null);
}
}
// Zones
if (visibleIssues.zones.length > 0) {
for (i in visibleIssues.zones) {
var zoneTypeId = visibleIssues.zones[i];
for (i in polygons) {
polygons[i].label.close();
polygons[i].setMap(null);
if (polygons[i].typeId == zoneTypeId) {
showZones.push(polygons[i]);
}
}
for (i in showZones) {
showZones[i].label.open(map);
showZones[i].setMap(map);
}
}
}
else {
for (i in polygons) {
polygons[i].label.close();
polygons[i].setMap(null);
}
}
// Lines
if (visibleIssues.lines.length > 0) {
for (i in visibleIssues.lines) {
var lineTypeId = visibleIssues.lines[i];
for (i in lines) {
lines[i].setMap(null);
lines[i].label.close();
if (lines[i].typeId == lineTypeId) {
showLines.push(lines[i]);
}
}
for (i in showLines) {
showLines[i].setMap(map);
showLines[i].label.open(map);
}
}
}
else {
for (i in lines) {
lines[i].setMap(null);
lines[i].label.close();
}
}
}
function getDrawnTypes() {
var types = {};
types.issues = [];
types.zones = [];
types.lines = [];
/* These loops could be optimized to only add unique values */
for (i in markers) {
var typeId = markers[i].markerTypeId;
types.issues.push(typeId);
}
for (i in polygons) {
var typeId = polygons[i].typeId;
types.zones.push(typeId);
}
for (i in lines) {
var typeId = lines[i].typeId;
types.lines.push(typeId);
}
return types;
}
function updateViewMessage() {
var visibleIssueChecks = $(".issueCheckBox:visible").length;
var checkedVisibleIssueChecks = $(".issueCheckBox:visible:checked").length;
var visibleZoneChecks = $(".zoneCheckBox:visible").length;
var checkedVisibleZoneChecks = $(".zoneCheckBox:visible:checked").length;
var visibleLineChecks = $(".lineCheckBox:visible").length;
var checkedVisibleLineChecks = $(".lineCheckBox:visible:checked").length;
var totalVisible = (visibleIssueChecks + visibleZoneChecks + visibleLineChecks);
var totalChecked = (checkedVisibleIssueChecks + checkedVisibleZoneChecks + checkedVisibleLineChecks);
if (totalChecked < totalVisible) {
$("#viewNotice").show();
}
else {
$("#viewNotice").hide();
}
}
$("#issues").DataTable({
paging: false,
info: false,
lengthChange: false,
searching: false,
"columns": [
null,
{'visible': combined },
null,
null,
{'sortable': false },
{'sortable': false }
]
});
$("#issues-polygons, #issues-lines").DataTable({
paging: false,
info: false,
lengthChange: false,
searching: false,
"columns": [
null,
{'visible': combined },
null,
null,
null,
{'sortable': false, 'width': '285px' },
{'sortable': false, 'width': '300px' }
]
});
});