").append(popupTemplatePolygon); if (!settings.richtextEditor) { s.find("textarea").removeClass("richtext-fix") } break; case google.maps.drawing.OverlayType.RECTANGLE: r = t.Overlay.getBounds().getCenter(); s = $("
").append(popupTemplateRectangle); if (!settings.richtextEditor) { s.find("textarea").removeClass("richtext-fix") } break } if (s != null && settings.editMode) { e.infoWindow.setContent(s.html()) } else { e.infoWindow.setContent($("
").append($("
", { "class": "popup-message" }).html(t.Message)).html()) } google.maps.event.addListener(e.infoWindow, "domready", function () { $(e.container).find(".popup-content textarea").val(e.activeLocation.Message); $(e.container).find('.popup-content input[name="locationLat"]').val(r.lat()); $(e.container).find('.popup-content input[name="locationLng"]').val(r.lng()); $(e.container).find('.popup-content input[name="centerLat"]').val(r.lat()); $(e.container).find('.popup-content input[name="centerLng"]').val(r.lng()); $(e.container).find('.popup-content input[name="borderWidth"]').val(t.BorderWeight); $(e.container).find('.popup-content input[name="radius"]').val(t.Radius); var n = $(e.container).find('.popup-content select[name="icon"]'); if (n.length > 0 && settings.markerPinFiles.length > 0) { for (i = 0; i < settings.markerPinFiles.length; i++) { n.append($("
", { value: settings.markerPinsPath + settings.markerPinFiles[i], text: settings.markerPinFiles[i] })) } n.find("option").each(function () { if ($(this).text() == t.Icon) { $(this).prop("selected", true) } }) } else { n.parent().parent().remove() } var s = $(e.container).find('.popup-content select[name="hover-icon"]'); if (s.length > 0 && settings.markerPinFiles.length > 0) { for (i = 0; i < settings.markerPinFiles.length; i++) { s.append($(" ", { value: settings.markerPinsPath + settings.markerPinFiles[i], text: settings.markerPinFiles[i] })) } s.find("option").each(function () { if ($(this).text() == t.HoverIcon) { $(this).prop("selected", true) } }) } else { s.parent().parent().remove() } var o = $(e.container).find('.popup-content input[name="strokeColor"]'); var u = $(e.container).find('.popup-content input[name="fillColor"]'); var a = $(e.container).find('.popup-content input[name="strokeColorPicker"]'); var f = $(e.container).find('.popup-content input[name="fillColorPicker"]'); o.val(e.activeLocation.BorderColor); a.val(e.activeLocation.BorderColor); a.height(o.outerHeight()); a.width(o.outerHeight()); u.val(e.activeLocation.FillColor); f.val(e.activeLocation.FillColor); f.height(u.outerHeight()); f.width(u.outerHeight()); if (isIE()) { o.simpleColorPicker(); u.simpleColorPicker() } else { f.change(function () { u.val($(this).val()) }); u.change(function () { f.val($(this).val()) }); a.change(function () { o.val($(this).val()) }); o.change(function () { a.val($(this).val()) }) } if (settings.richtextEditor) { intTinyMce() } initPopupButtons(e) }); if (r != null && n != google.maps.drawing.OverlayType.MARKER) { e.infoWindow.setPosition(r); e.infoWindow.open(e) } else { e.infoWindow.open(e, t.Overlay) } if (settings.locationClick != null && typeof settings.locationClick == "function") { settings.locationClick(e, t) } }) } function updateLocationObject(e, t, n, r) { var s = []; if ($(".popup-content").length > 0) { if (typeof tinymce != "undefined") { tinyMCE.triggerSave() } t.Message = $(e.container).find(".popup-content textarea").val(); t.BorderColor = $('.popup-content input[name="strokeColor"]').val(); t.FillColor = $('.popup-content input[name="fillColor"]').val(); t.BorderWeight = $('.popup-content input[name="borderWidth"]').val(); if (n != google.maps.drawing.OverlayType.MARKER) { t.Overlay.setOptions({ strokeColor: t.BorderColor, strokeWeight: t.BorderWeight }); if (n != google.maps.drawing.OverlayType.POLYLINE) { t.Overlay.setOptions({ fillColor: t.FillColor }) } } } switch (n) { case google.maps.drawing.OverlayType.MARKER: t.Coordinates.length = 0; t.Coordinates.push(new Coordinate(t.Overlay.getPosition().lat(), t.Overlay.getPosition().lng())); if ($('select[name="icon"]').length > 0) { var o = $('select[name="icon"] :selected').text(); if (o == "default") { t.Icon = null; t.Overlay.setIcon(null) } else { t.Icon = o; t.Overlay.setIcon(settings.markerPinsPath + t.Icon) } var u = $('select[name="hover-icon"] :selected').text(); if (o == "none") { t.HoverIcon = null } else { t.HoverIcon = u } t.Coordinates[0].Latitude = parseFloat($('.popup-content input[name="locationLat"]').val()); t.Coordinates[0].Longitude = parseFloat($('.popup-content input[name="locationLng"]').val()); t.Overlay.setPosition(new google.maps.LatLng(t.Coordinates[0].Latitude, t.Coordinates[0].Longitude)) } break; case google.maps.drawing.OverlayType.CIRCLE: if ($('.popup-content input[name="radius"]').length > 0) { t.Radius = parseFloat($('.popup-content input[name="radius"]').val()); google.maps.event.clearListeners(t.Overlay, "radius_changed"); t.Overlay.setRadius(t.Radius); google.maps.event.addListener(t.Overlay, "radius_changed", function (r, i) { updateLocationObject(e, t, n, true) }) } else { t.Radius = t.Overlay.getRadius() } if ($('.popup-content input[name="centerLat"]').length > 0 && $('.popup-content input[name="centerLng"]').length > 0) { google.maps.event.clearListeners(t.Overlay, "center_changed"); t.Overlay.setCenter(new google.maps.LatLng(parseFloat($('.popup-content input[name="centerLat"]').val()), parseFloat($('.popup-content input[name="centerLng"]').val()))); google.maps.event.addListener(t.Overlay, "center_changed", function (r, i) { updateLocationObject(e, t, n, true) }); t.Coordinates.length = 0; t.Coordinates.push(new Coordinate(t.Overlay.getCenter().lat(), t.Overlay.getCenter().lng())) } else { t.Coordinates.length = 0; t.Coordinates.push(new Coordinate(t.Overlay.getCenter().lat(), t.Overlay.getCenter().lng())) } break; case google.maps.drawing.OverlayType.POLYLINE: for (i = 0; i < t.Overlay.getPath().length; i++) { s.push(new Coordinate(t.Overlay.getPath().getAt(i).lat(), t.Overlay.getPath().getAt(i).lng())) } t.Coordinates = s; break; case google.maps.drawing.OverlayType.POLYGON: for (i = 0; i < t.Overlay.getPath().length; i++) { s.push(new Coordinate(t.Overlay.getPath().getAt(i).lat(), t.Overlay.getPath().getAt(i).lng())) } t.Coordinates = s; break; case google.maps.drawing.OverlayType.RECTANGLE: s.push(new Coordinate(t.Overlay.getBounds().getNorthEast().lat(), t.Overlay.getBounds().getNorthEast().lng())); s.push(new Coordinate(t.Overlay.getBounds().getSouthWest().lat(), t.Overlay.getBounds().getSouthWest().lng())); t.Coordinates = s; break } if (e.activeLocation != null && r) { if (e.infoWindow != null) { e.infoWindow.close() } } saveToJson(e) } function initPopupButtons(e) { var t = $(e.container).find(".btn-popup-delete"); t.off("click"); t.click(function () { if (confirm("Delete this location?")) { e.activeLocation.Overlay.setMap(null); e.locations.splice(e.locations.indexOf(e.activeLocation), 1); e.activeLocation = null; saveToJson(e); e.infoWindow.close(); if (settings.locationDelete != null && typeof settings.locationDelete == "function") { settings.locationDelete(e, location) } } }); var n = $(e.container).find(".btn-popup-cancel"); n.off("click"); n.click(function () { if ($('.popup-content [name="changed"]').val() === "true") { if (confirm("Cancel changes?")) { e.infoWindow.close() } } else { e.infoWindow.close() } }); var r = $(e.container).find(".btn-popup-save"); r.off("click"); r.click(function () { handleMapCloseClick(e, e.activeLocation.LocationType); e.infoWindow.close() }); $('.popup-content input[type="text"],.popup-content input[type="number"],.popup-content input[type="color"],.popup-content select,.popup-content textarea').change(function () { $('.popup-content input[name="changed"]').val(true) }) } function isIE() { var e = window.navigator.userAgent; var t = e.indexOf("MSIE "); if (t > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./)) { return true } else { return false } } function intTinyMce() { if (typeof tinymce == "undefined") { $.getScript(tinyMceUrl, function () { tinymce.init({ selector: ".popup-content textarea", plugins: ["code image link media table textcolor"], resize: false, toolbar: "bold italic | forecolor | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link | code", menubar: false, statusbar: false }) }) } else { tinymce.init({ selector: ".popup-content textarea", plugins: ["code image link media table textcolor"], resize: false, toolbar: "bold italic | forecolor | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link | code", menubar: false, statusbar: false }) } } function getMapLocationsBounds(e) { if (e.locations != null && e.locations.length > 0) { var t = new google.maps.LatLngBounds; for (i = 0; i < e.locations.length; i++) { for (j = 0; j < e.locations[i].Coordinates.length; j++) { t.extend(new google.maps.LatLng(e.locations[i].Coordinates[j].Latitude, e.locations[i].Coordinates[j].Longitude)) } } return t } return null } function getPolyLineCenter(e) { var t = parseInt(e.getPath().getLength() / 2); return new google.maps.LatLng(e.getPath().getAt(t).lat(), e.getPath().getAt(t).lng()) } function getPolygonCenter(e) { var t = new google.maps.LatLngBounds; for (i = 0; i < e.getPath().getLength() ; i++) { t.extend(new google.maps.LatLng(e.getPath().getAt(i).lat(), e.getPath().getAt(i).lng())) } return t.getCenter() } function createUUID() { var e = []; var t = "0123456789abcdef"; for (var n = 0; n < 36; n++) { e[n] = t.substr(Math.floor(Math.random() * 16), 1) } e[14] = "4"; e[19] = t.substr(e[19] & 3 | 8, 1); e[8] = e[13] = e[18] = e[23] = ""; var r = e.join(""); return r } function htmlEncode(e) { return $("
").text(e).html() } function htmlDecode(e) { return $("
").html(e).text() } function Location(e, t, n) { this.Coordinates = e; this.LocationType = t; this.Icon = null; this.Message = n; this.Overlay = null; this.Radius = 0; this.BorderColor = settings.drawingBorderColor; this.BorderWeight = settings.drawingBorderWidth; this.FillColor = settings.drawingFillColor; this.Tag = null } function Coordinate(e, t) { this.Latitude = e; this.Longitude = t } var defaults = { editMode: true, editTemplatesPath: "../src/html/", markerPinsPath: "../src/img/pin/", markerPinFiles: ["flag-azure.png", "flag-green.png", "needle-pink.png", "niddle-green.png", "pin-azure.png", "pin-green.png", "pin-pink.png"], drawingBorderColor: "#ff0000", drawingBorderWidth: 2, drawingFillColor: "#ffff00", zoom: 13, center: { latitude: 25.0417, longitude: 55.2194 }, width: 800, height: 400, language: "en", singleLocation: false, searchBox: true, richtextEditor: true, drawingTools: ["marker", "polyline", "polygon", "circle", "rectangle"], zoomControl: true, panControl: true, scaleControl: true, streetViewControl: true, scrollWheel: false, style: null, stylesPath: "../src/styles.json", locations: [], dataChange: null, locationClick: null, locationNew: null, locationDelete: null, locationMove: null }; var settings = $.extend({}, defaults, options); var tinyMceUrl = "//tinymce.cachefly.net/4.0/tinymce.min.js"; var mapApiUrl = "//maps.googleapis.com/maps/api/js?sensor=false&callback=mapApiLoaded&libraries=drawing,places"; if (settings.language != "") { mapApiUrl += "&language=" + settings.language } var popupTemplateCircle = null; var popupTemplateRectangle = null; var popupTemplateMarker = null; var popupTemplatePolyline = null; var popupTemplatePolygon = null; var selector = $(this); if ((typeof google !== "undefined" && google !== null ? google.maps : void 0) == null) { $.getScript(mapApiUrl); window.mapApiLoaded = function () { selector.each(function (e) { var t = selector.get(e); if (settings.width == defaults.width) { if ($(t).width() <= 0) { $(t).width(defaults.width) } } else { $(t).width(settings.width) } if (settings.height == defaults.height) { if ($(t).height() <= 0) { $(t).height(defaults.height) } } else { $(t).height(settings.height) } initializeGoogleMapEditor(t) }) } } else { selector.each(function (e) { var t = selector.get(e); initializeGoogleMapEditor(t) }) } }; $.fn.simpleColorPicker = function (e) { var t = { colorsPerLine: 8, colors: ["#000000", "#444444", "#666666", "#999999", "#cccccc", "#eeeeee", "#f3f3f3", "#ffffff", "#ff0000", "#ff9900", "#ffff00", "#00ff00", "#00ffff", "#0000ff", "#9900ff", "#ff00ff", "#f4cccc", "#fce5cd", "#fff2cc", "#d9ead3", "#d0e0e3", "#cfe2f3", "#d9d2e9", "#ead1dc", "#ea9999", "#f9cb9c", "#ffe599", "#b6d7a8", "#a2c4c9", "#9fc5e8", "#b4a7d6", "#d5a6bd", "#e06666", "#f6b26b", "#ffd966", "#93c47d", "#76a5af", "#6fa8dc", "#8e7cc3", "#c27ba0", "#cc0000", "#e69138", "#f1c232", "#6aa84f", "#45818e", "#3d85c6", "#674ea7", "#a64d79", "#990000", "#b45f06", "#bf9000", "#38761d", "#134f5c", "#0b5394", "#351c75", "#741b47", "#660000", "#783f04", "#7f6000", "#274e13", "#0c343d", "#073763", "#20124d", "#4C1130"], showEffect: "", hideEffect: "", onChangeColor: false }; var n = $.extend(t, e); return this.each(function () { function l(e) { if (n.hideEffect == "fade") e.fadeOut(); else if (n.hideEffect == "slide") e.slideUp(); else e.hide() } function c(e) { if (n.showEffect == "fade") e.fadeIn(); else if (n.showEffect == "slide") e.slideDown(); else e.show() } var e = $(this); var r = ""; var i = e.attr("id").replace(/-/g, "") + "_"; for (var s = 0; s < n.colors.length; s++) { var o = n.colors[s]; var u = ""; if (s % n.colorsPerLine == 0) u = "clear: both; "; if (s > 0 && u && $.browser && $.browser.msie && $.browser.version <= 7) { u = ""; r += ' ' } r += ' ' } var a = $(''); $("body").append(a); a.hide(); a.find("li.color-box").click(function () { if (e.is("input")) { e.val(n.colors[this.id.substr(this.id.indexOf("-") + 1)]); e.blur() } if ($.isFunction(t.onChangeColor)) { t.onChangeColor.call(e, n.colors[this.id.substr(this.id.indexOf("-") + 1)]) } l(a) }); $(document).on("click", "body", function () { l(a) }); a.click(function (e) { e.stopPropagation() }); var f = function (t) { var n = e.offset(); var r = n.left + e.outerWidth() - t.outerWidth(); if (r < n.left) r = n.left; t.css({ left: r, top: n.top + e.outerHeight() }); c(t) }; e.click(function (t) { t.stopPropagation(); if (!e.is("input")) { f(a) } }); e.focus(function () { $(".color-picker").each(function (e) { l($(this)) }); f(a) }) }) }