713 lines
28 KiB
JavaScript
713 lines
28 KiB
JavaScript
var properties = {
|
|
"data": [
|
|
{
|
|
"id": 1,
|
|
"title": "Beautiful single home",
|
|
"price": 2505.11,
|
|
"listing_for": "Sale",
|
|
'author': 'Jhon Doe',
|
|
'date': '5 days ago',
|
|
"is_featured": true,
|
|
"latitude": 51.541599,
|
|
"longitude": -0.112588,
|
|
"address": "123 Kathal St. Tampa City, ",
|
|
"area": 1000,
|
|
"room": 4,
|
|
"bathroom": 3,
|
|
"balcony": 3,
|
|
"lounge": 1,
|
|
"garage": 1,
|
|
"image": "img/properties/properties-1.png",
|
|
"type_icon": "img/building.png"
|
|
},
|
|
{
|
|
"id": 2,
|
|
"title": "Modern Family Home",
|
|
"price": 2505.11,
|
|
"listing_for": "Rent",
|
|
'author': 'Jhon Doe',
|
|
'date': '5 days ago',
|
|
"is_featured": false,
|
|
"latitude": 51.538395,
|
|
"longitude": -0.097418,
|
|
"address": "123 Kathal St. Tampa City, ",
|
|
"area": 2500,
|
|
"room": 4,
|
|
"bathroom": 3,
|
|
"balcony": 3,
|
|
"lounge": 1,
|
|
"garage": 1,
|
|
"image": "img/properties/properties-2.png",
|
|
"type_icon": "img/building.png"
|
|
},
|
|
{
|
|
"id": 3,
|
|
"title": "Sweet Family home",
|
|
"price": 2505.11,
|
|
"listing_for": "Rent",
|
|
'author': 'Jhon Doe',
|
|
'date': '5 days ago',
|
|
"is_featured": true,
|
|
"latitude": 51.539212,
|
|
"longitude": -0.118403,
|
|
"address": "123 Kathal St. Tampa City, ",
|
|
"area": 2123,
|
|
"room": 4,
|
|
"bathroom": 3,
|
|
"balcony": 3,
|
|
"lounge": 1,
|
|
"garage": 1,
|
|
"image": "img/properties/properties-3.png",
|
|
"type_icon": "img/building.png"
|
|
},
|
|
{
|
|
"id": 4,
|
|
"title": "Park avenue",
|
|
"price": 2505.11,
|
|
"listing_for": "Sale",
|
|
'author': 'Jhon Doe',
|
|
'date': '5 days ago',
|
|
"is_featured": true,
|
|
"latitude": 51.522340,
|
|
"longitude": -0.037894,
|
|
"address": "123 Kathal St. Tampa City, ",
|
|
"area": 2123,
|
|
"room": 4,
|
|
"bathroom": 3,
|
|
"balcony": 3,
|
|
"lounge": 1,
|
|
"garage": 1,
|
|
"image": "img/properties/properties-5.png",
|
|
"type_icon": "img/building.png"
|
|
},
|
|
{
|
|
"id": 5,
|
|
"title": "Masons Villas",
|
|
"price": 2505.11,
|
|
"listing_for": "Rent",
|
|
'author': 'Jhon Doe',
|
|
'date': '5 days ago',
|
|
"is_featured": false,
|
|
"latitude": 51.513965,
|
|
"longitude": -0.038837,
|
|
"address": "123 Kathal St. Tampa City, ",
|
|
"area": 2123,
|
|
"room": 4,
|
|
"bathroom": 3,
|
|
"balcony": 3,
|
|
"lounge": 1,
|
|
"garage": 1,
|
|
"image": "img/properties/properties-5.png",
|
|
"type_icon": "img/building.png"
|
|
},
|
|
{
|
|
"id": 6,
|
|
"title": "Big Head House",
|
|
"price": 2505.11,
|
|
"listing_for": "Sale",
|
|
'author': 'Jhon Doe',
|
|
'date': '5 days ago',
|
|
"is_featured": false,
|
|
"latitude": 51.503965,
|
|
"longitude": -0.058837,
|
|
"address": "123 Kathal St. Tampa City, ",
|
|
"area": 2123,
|
|
"room": 4,
|
|
"bathroom": 3,
|
|
"balcony": 3,
|
|
"lounge": 1,
|
|
"garage": 1,
|
|
"image": "img/properties/properties-6.png",
|
|
"type_icon": "img/building.png"
|
|
},
|
|
{
|
|
"id": 7,
|
|
"title": "155/A Valley Street 7",
|
|
"price": 2505.11,
|
|
"listing_for": "Rent",
|
|
'author': 'Jhon Doe',
|
|
'date': '5 days ago',
|
|
"is_featured": false,
|
|
"latitude": 51.555385,
|
|
"longitude": -0.128274,
|
|
"address": "123 Kathal St. Tampa City, ",
|
|
"area": 2123,
|
|
"room": 4,
|
|
"bathroom": 3,
|
|
"balcony": 3,
|
|
"lounge": 1,
|
|
"garage": 1,
|
|
"image": "img/properties/properties-5.png",
|
|
"type_icon": "img/building.png"
|
|
},
|
|
{
|
|
"id": 8,
|
|
"title": "4552 Lynn Avenue 1",
|
|
"price": 2505.11,
|
|
"listing_for": "Sale",
|
|
'author': 'Jhon Doe',
|
|
'date': '5 days ago',
|
|
"is_featured": false,
|
|
"latitude": 51.560935,
|
|
"longitude": -0.111365,
|
|
"address": "123 Kathal St. Tampa City, ",
|
|
"area": 2123,
|
|
"room": 4,
|
|
"bathroom": 3,
|
|
"balcony": 3,
|
|
"lounge": 1,
|
|
"garage": 1,
|
|
"image": "img/properties/properties-4.png",
|
|
"type_icon": "img/building.png"
|
|
},
|
|
{
|
|
"id": 9,
|
|
"title": "4552 Lynn Avenue 2",
|
|
"price": 2505.11,
|
|
"listing_for": "Sale",
|
|
'author': 'Jhon Doe',
|
|
'date': '5 days ago',
|
|
"is_featured": false,
|
|
"latitude": 51.543803,
|
|
"longitude": -0.036607,
|
|
"address": "123 Kathal St. Tampa City, ",
|
|
"area": 2123,
|
|
"room": 4,
|
|
"bathroom": 3,
|
|
"balcony": 3,
|
|
"lounge": 1,
|
|
"garage": 1,
|
|
"image": "img/properties/properties-3.png",
|
|
"type_icon": "img/building.png"
|
|
},
|
|
{
|
|
"id": 10,
|
|
"title": "4552 Lynn Avenue 3",
|
|
"price": 2505.11,
|
|
"listing_for": "Sale",
|
|
'author': 'Jhon Doe',
|
|
'date': '5 days ago',
|
|
"is_featured": false,
|
|
"latitude": 51.527306,
|
|
"longitude": -0.140977,
|
|
"address": "123 Kathal St. Tampa City, ",
|
|
"area": 2123,
|
|
"room": 4,
|
|
"bathroom": 3,
|
|
"balcony": 3,
|
|
"lounge": 1,
|
|
"garage": 1,
|
|
"image": "img/properties/properties-2.png",
|
|
"type_icon": "img/building.png"
|
|
},
|
|
{
|
|
"id": 11,
|
|
"title": "4552 Lynn Avenue 4",
|
|
"price": 2505.11,
|
|
"listing_for": "Sale",
|
|
'author': 'Jhon Doe',
|
|
'date': '5 days ago',
|
|
"is_featured": false,
|
|
"latitude": 51.558907,
|
|
"longitude": -0.041842,
|
|
"address": "123 Kathal St. Tampa City, ",
|
|
"area": 2123,
|
|
"room": 4,
|
|
"bathroom": 3,
|
|
"balcony": 3,
|
|
"lounge": 1,
|
|
"garage": 1,
|
|
"image": "img/properties/properties-1.png",
|
|
"type_icon": "img/building.png"
|
|
},
|
|
{
|
|
"id": 12,
|
|
"title": "Sweet Family home",
|
|
"price": 2505.11,
|
|
"listing_for": "Sale",
|
|
'author': 'Jhon Doe',
|
|
'date': '5 days ago',
|
|
"is_featured": true,
|
|
"latitude": 51.550644,
|
|
"longitude": -0.103493,
|
|
"address": "123 Kathal St. Tampa City, ",
|
|
"area": 2123,
|
|
"room": 4,
|
|
"bathroom": 3,
|
|
"balcony": 3,
|
|
"lounge": 1,
|
|
"garage": 1,
|
|
"image": "img/properties/properties-6.png",
|
|
"type_icon": "img/building.png"
|
|
},
|
|
{
|
|
"id": 13,
|
|
"title": "Sweet Family home",
|
|
"price": 2505.11,
|
|
"listing_for": "Sale",
|
|
'author': 'Jhon Doe',
|
|
'date': '5 days ago',
|
|
"is_featured": false,
|
|
"latitude": 51.532112,
|
|
"longitude": -0.051885,
|
|
"address": "123 Kathal St. Tampa City, ",
|
|
"area": 2123,
|
|
"room": 4,
|
|
"bathroom": 3,
|
|
"balcony": 3,
|
|
"lounge": 1,
|
|
"garage": 1,
|
|
"image": "img/properties/properties-5.png",
|
|
"type_icon": "img/building.png"
|
|
},
|
|
{
|
|
"id": 14,
|
|
"title": "4552 Lynn Avenue 7",
|
|
"price": 2505.11,
|
|
"listing_for": "Sale",
|
|
'author': 'Jhon Doe',
|
|
'date': '5 days ago',
|
|
"is_featured": true,
|
|
"latitude": 51.531311,
|
|
"longitude": -0.052314,
|
|
"address": "123 Kathal St. Tampa City, ",
|
|
"area": 2123,
|
|
"room": 4,
|
|
"bathroom": 3,
|
|
"balcony": 3,
|
|
"lounge": 1,
|
|
"garage": 1,
|
|
"image": "img/properties/properties-4.png",
|
|
"type_icon": "img/building.png"
|
|
},
|
|
{
|
|
"id": 15,
|
|
"title": "Park avenue",
|
|
"price": 2505.11,
|
|
"listing_for": "Sale",
|
|
'author': 'Jhon Doe',
|
|
'date': '5 days ago',
|
|
"is_featured": false,
|
|
"latitude": 51.530189,
|
|
"longitude": -0.078750,
|
|
"address": "123 Kathal St. Tampa City, ",
|
|
"area": 2123,
|
|
"room": 4,
|
|
"bathroom": 3,
|
|
"balcony": 3,
|
|
"lounge": 1,
|
|
"garage": 1,
|
|
"image": "img/properties/properties-3.png",
|
|
"type_icon": "img/building.png"
|
|
}
|
|
|
|
]
|
|
};
|
|
|
|
function drawInfoWindow(property) {
|
|
var image = 'img/logo.png';
|
|
if (property.image) {
|
|
image = property.image
|
|
}
|
|
|
|
var title = 'N/A';
|
|
if (property.title) {
|
|
title = property.title
|
|
}
|
|
|
|
var address = '';
|
|
if (property.address) {
|
|
address = property.address
|
|
}
|
|
|
|
var description = 'lorem ipsum dolor sit amet, cfeugiat congue qmper lorem ipsum dolor sit amet';
|
|
if (property.description) {
|
|
description = property.description
|
|
}
|
|
|
|
var area = 1000;
|
|
if (property.area) {
|
|
area = property.area
|
|
}
|
|
|
|
var Beds = 5;
|
|
if (property.bedroom) {
|
|
Beds = property.bedroom
|
|
}
|
|
|
|
var bathroom = 5;
|
|
if (property.bathroom) {
|
|
bathroom = property.bathroom
|
|
}
|
|
|
|
var garage = 1;
|
|
if (property.garage) {
|
|
garage = property.garage
|
|
}
|
|
|
|
var price = 253.33;
|
|
if (property.price) {
|
|
price = property.price
|
|
}
|
|
|
|
var ibContent = '';
|
|
ibContent =
|
|
"<div class='map-properties'>" +
|
|
"<div class='map-img'>" +
|
|
"<img src='" + image + "'/>" +
|
|
"</div>" +
|
|
"<div class='map-content'>" +
|
|
"<div class='map-content-top'><h4><a href='properties-details.html'>" + title + "</a></h4>" +
|
|
"<p class='address'> <i class='fa fa-map-marker'></i>" + address + "</p></div>" +
|
|
"<p class='description'>" + description + "</p>" +
|
|
"<div class='map-properties-fetures'> " +
|
|
"<span><i class='flaticon-square-layouting-with-black-square-in-east-area'></i> " + area + " sqft<sup>2</sup></span> " +
|
|
"<span><i class='flaticon-bed'></i> " + Beds + " Bed</span> " +
|
|
"<span><i class='flaticon-holidays'></i> " + bathroom + " Bath</span> " +
|
|
"<span><i class='flaticon-vehicle'></i> " + garage + " Garages</span> " +
|
|
"</div>" +
|
|
"<div class='map-properties-btns'><a href='properties-details.html' class='border-button-sm border-button-theme' style='margin-right:5px;'>$" + price + "</a><a href='properties-details.html' class='button-sm button-theme'>Details</a></div>" +
|
|
"</div>";
|
|
return ibContent;
|
|
}
|
|
|
|
function insertPropertyToArray(property, layout) {
|
|
var image = 'img/logo.png';
|
|
if (property.image) {
|
|
image = property.image
|
|
}
|
|
|
|
var title = 'N/A';
|
|
if (property.title) {
|
|
title = property.title
|
|
}
|
|
|
|
var listing_for = 'Sale';
|
|
if (property.listing_for) {
|
|
listing_for = property.listing_for
|
|
}
|
|
|
|
var address = '';
|
|
if (property.address) {
|
|
address = property.address
|
|
}
|
|
|
|
var description = 'lorem ipsum dolor sit amet, cfeugiat congue qmper lorem ipsum dolor sit amet';
|
|
if (property.description) {
|
|
description = property.description
|
|
}
|
|
|
|
var area = 1000;
|
|
if (property.area) {
|
|
area = property.area
|
|
}
|
|
|
|
var Beds = 5;
|
|
if (property.bedroom) {
|
|
Beds = property.bedroom
|
|
}
|
|
|
|
var bathroom = 5;
|
|
if (property.bathroom) {
|
|
bathroom = property.bathroom
|
|
}
|
|
|
|
var garage = 1;
|
|
if (property.garage) {
|
|
garage = property.garage
|
|
}
|
|
|
|
var balcony = 1;
|
|
if (property.balcony) {
|
|
balcony = property.balcony
|
|
}
|
|
|
|
var lounge = 1;
|
|
if (property.lounge) {
|
|
lounge = property.lounge
|
|
}
|
|
|
|
var price = 253.33;
|
|
if (property.price) {
|
|
price = property.price
|
|
}
|
|
|
|
var is_featured = '';
|
|
if (property.is_featured) {
|
|
is_featured = '<div class="property-tag button alt featured">Featured</div> ';
|
|
}
|
|
|
|
var date = '';
|
|
if (property.date) {
|
|
date = property.date;
|
|
}
|
|
|
|
var author = '';
|
|
if (property.author) {
|
|
author = property.author;
|
|
}
|
|
|
|
var element = '';
|
|
|
|
if(layout == 'grid_layout'){
|
|
element = '<div class="col-lg-6 col-md-6 col-sm-6 col-xs-12 property-hover" id="'+property.id+'"><div class="property">\n' +
|
|
' <!-- Property img -->\n' +
|
|
' <div class="property-img">\n' +
|
|
is_featured +
|
|
' <div class="property-tag button sale">For '+listing_for+'</div>\n' +
|
|
' <div class="property-price">$'+price+'</div>\n' +
|
|
' <img src="'+image+'" alt="fp" class="img-fluid">\n' +
|
|
' <div class="property-overlay">\n' +
|
|
' <a href="properties-details.html" class="overlay-link">\n' +
|
|
' <i class="fa fa-link"></i>\n' +
|
|
' </a>\n' +
|
|
' <a class="overlay-link property-video" title="Lexus GS F">\n' +
|
|
' <i class="fa fa-video-camera"></i>\n' +
|
|
' </a>\n' +
|
|
' <div class="property-magnify-gallery">\n' +
|
|
' <a href="'+image+'" class="overlay-link">\n' +
|
|
' <i class="fa fa-expand"></i>\n' +
|
|
' </a>\n' +
|
|
'\n' +
|
|
' <a href="img/properties/properties-2.png" class="hidden"></a>\n' +
|
|
' <a href="img/properties/properties-3.png" class="hidden"></a>\n' +
|
|
' </div>\n' +
|
|
' </div>\n' +
|
|
' </div>\n' +
|
|
' <!-- Property content -->\n' +
|
|
' <div class="property-content">\n' +
|
|
' <!-- info -->\n' +
|
|
' <div class="info">\n' +
|
|
' <!-- title -->\n' +
|
|
' <h1 class="title">\n' +
|
|
' <a href="properties-details.html">'+title+'</a>\n' +
|
|
' </h1>\n' +
|
|
' <!-- Property address -->\n' +
|
|
' <h3 class="property-address">\n' +
|
|
' <a href="properties-details.html">\n' +
|
|
' <i class="fa fa-map-marker"></i>'+address+',\n' +
|
|
' </a>\n' +
|
|
' </h3>\n' +
|
|
' <!-- Facilities List -->\n' +
|
|
' <ul class="facilities-list clearfix">\n' +
|
|
' <li>\n' +
|
|
' <i class="flaticon-square-layouting-with-black-square-in-east-area"></i>\n' +
|
|
' <span>'+area+' sq ft</span>\n' +
|
|
' </li>\n' +
|
|
' <li>\n' +
|
|
' <i class="flaticon-bed"></i>\n' +
|
|
' <span>'+Beds+' Beds</span>\n' +
|
|
' </li>\n' +
|
|
' <li>\n' +
|
|
' <i class="flaticon-monitor"></i>\n' +
|
|
' <span>TV </span>\n' +
|
|
' </li>\n' +
|
|
' <li>\n' +
|
|
' <i class="flaticon-holidays"></i>\n' +
|
|
' <span> '+bathroom+' Baths</span>\n' +
|
|
' </li>\n' +
|
|
' <li>\n' +
|
|
' <i class="flaticon-vehicle"></i>\n' +
|
|
' <span>'+garage+' Garage</span>\n' +
|
|
' </li>\n' +
|
|
' <li>\n' +
|
|
' <i class="flaticon-building"></i>\n' +
|
|
' <span> '+balcony+' Balcony</span>\n' +
|
|
' </li>\n' +
|
|
' </ul>\n' +
|
|
' </div>\n' +
|
|
' <!-- Property footer -->\n' +
|
|
' <div class="property-footer">\n' +
|
|
' <span class="left">\n' +
|
|
' <a href="#"><i class="fa fa-user"></i>'+author+'</a>\n' +
|
|
' </span>\n' +
|
|
' <span class="right">\n' +
|
|
' <i class="fa fa-calendar"></i>' + date +
|
|
' </span>\n' +
|
|
' </div>\n' +
|
|
' </div>\n' +
|
|
' </div>';
|
|
' </div>';
|
|
}
|
|
else{
|
|
element = '<div class="property row g-0 fp2 clearfix property-hover" id="'+property.id+'">\n' +
|
|
' <div class="col-lg-5 col-md-5 col-sm-12">\n' +
|
|
' <!-- Property img -->\n' +
|
|
' <div class="property-img">\n' +
|
|
is_featured +
|
|
' <div class="property-tag button sale">For '+listing_for+'</div>\n' +
|
|
' <div class="property-price">$'+price+'</div>\n' +
|
|
' <img src="img/properties/properties-list-1.png" alt="fp-list" class="img-responsive hp-1">\n' +
|
|
' <div class="property-overlay">\n' +
|
|
' <a href="properties-details.html" class="overlay-link">\n' +
|
|
' <i class="fa fa-link"></i>\n' +
|
|
' </a>\n' +
|
|
' <a class="overlay-link property-video" title="Lexus GS F">\n' +
|
|
' <i class="fa fa-video-camera"></i>\n' +
|
|
' </a>\n' +
|
|
' <div class="property-magnify-gallery">\n' +
|
|
' <a href="img/properties/properties-1.png" class="overlay-link">\n' +
|
|
' <i class="fa fa-expand"></i>\n' +
|
|
' </a>\n' +
|
|
' <a href="img/properties/properties-2.png" class="hidden"></a>\n' +
|
|
' <a href="img/properties/properties-3.png" class="hidden"></a>\n' +
|
|
' </div>\n' +
|
|
' </div>\n' +
|
|
' </div>\n' +
|
|
' </div>\n' +
|
|
' <div class="col-lg-7 col-md-7 col-sm-12 property-content">\n' +
|
|
' <div class="info">\n' +
|
|
' <!-- title -->\n' +
|
|
' <h1 class="title">\n' +
|
|
' <a href="properties-details.html">'+title+'</a>\n' +
|
|
' </h1>\n' +
|
|
' <!-- Property address -->\n' +
|
|
' <h3 class="property-address">\n' +
|
|
' <a href="properties-details.html">\n' +
|
|
' <i class="fa fa-map-marker"></i> '+address+',\n' +
|
|
' </a>\n' +
|
|
' </h3>\n' +
|
|
' <!-- Facilities List -->\n' +
|
|
' <ul class="facilities-list clearfix">\n' +
|
|
' <li>\n' +
|
|
' <i class="flaticon-square-layouting-with-black-square-in-east-area"></i>\n' +
|
|
' <span>'+area+' sq ft</span>\n' +
|
|
' </li>\n' +
|
|
' <li>\n' +
|
|
' <i class="flaticon-bed"></i>\n' +
|
|
' <span>'+Beds+' Beds</span>\n' +
|
|
' </li>\n' +
|
|
' <li>\n' +
|
|
' <i class="flaticon-monitor"></i>\n' +
|
|
' <span>TV </span>\n' +
|
|
' </li>\n' +
|
|
' <li>\n' +
|
|
' <i class="flaticon-holidays"></i>\n' +
|
|
' <span> '+bathroom+' Baths</span>\n' +
|
|
' </li>\n' +
|
|
' <li>\n' +
|
|
' <i class="flaticon-vehicle"></i>\n' +
|
|
' <span>'+garage+' Garage</span>\n' +
|
|
' </li>\n' +
|
|
' <li>\n' +
|
|
' <i class="flaticon-building"></i>\n' +
|
|
' <span> '+balcony+' Balcony</span>\n' +
|
|
' </li>\n' +
|
|
' </ul>\n' +
|
|
' <!-- Property footer -->\n' +
|
|
' </div>\n' +
|
|
' <div class="property-footer">\n' +
|
|
' <span class="left">\n' +
|
|
' <a href="#"><i class="fa fa-user"></i>'+author+'</a>\n' +
|
|
' </span>\n' +
|
|
' <span class="right">\n' +
|
|
' <i class="fa fa-calendar"></i>' + date +
|
|
' </span>\n' +
|
|
' </div>\n' +
|
|
' </div>\n' +
|
|
' </div>';
|
|
}
|
|
return element;
|
|
}
|
|
|
|
function animatedMarkers(map, propertiesMarkers, properties, layout) {
|
|
var bounds = map.getBounds();
|
|
var propertiesArray = [];
|
|
$.each(propertiesMarkers, function (key, value) {
|
|
if (bounds.contains(propertiesMarkers[key].getLatLng())) {
|
|
propertiesArray.push(insertPropertyToArray(properties.data[key], layout));
|
|
setTimeout(function () {
|
|
if (propertiesMarkers[key]._icon != null) {
|
|
propertiesMarkers[key]._icon.className = 'leaflet-marker-icon leaflet-zoom-animated leaflet-clickable bounce-animation marker-loaded';
|
|
}
|
|
}, key * 50);
|
|
}
|
|
else {
|
|
if (propertiesMarkers[key]._icon != null) {
|
|
propertiesMarkers[key]._icon.className = 'leaflet-marker-icon leaflet-zoom-animated leaflet-clickable';
|
|
}
|
|
}
|
|
});
|
|
$('.fetching-properties').html(propertiesArray);
|
|
}
|
|
|
|
function generateMap(latitude, longitude, mapProvider, layout) {
|
|
|
|
var map = L.map('map', {
|
|
center: [latitude, longitude],
|
|
zoom: 14,
|
|
scrollWheelZoom: false
|
|
});
|
|
|
|
L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
|
|
attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
|
|
}).addTo(map);
|
|
|
|
|
|
L.tileLayer.provider(mapProvider).addTo(map);
|
|
var markers = L.markerClusterGroup({
|
|
showCoverageOnHover: false,
|
|
zoomToBoundsOnClick: false
|
|
});
|
|
var propertiesMarkers = [];
|
|
|
|
$.each(properties.data, function (index, property) {
|
|
var icon = '<img src="img/logos/logo.png">';
|
|
if (property.type_icon) {
|
|
icon = '<img src="' + property.type_icon + '">';
|
|
}
|
|
var color = '';
|
|
var markerContent =
|
|
'<div class="map-marker ' + color + '">' +
|
|
'<div class="icon">' +
|
|
icon +
|
|
'</div>' +
|
|
'</div>';
|
|
|
|
var _icon = L.divIcon({
|
|
html: markerContent,
|
|
iconSize: [36, 46],
|
|
iconAnchor: [18, 32],
|
|
popupAnchor: [130, -28],
|
|
className: ''
|
|
});
|
|
|
|
var marker = L.marker(new L.LatLng(property.latitude, property.longitude), {
|
|
title: property.title,
|
|
icon: _icon
|
|
});
|
|
|
|
propertiesMarkers.push(marker);
|
|
marker.bindPopup(drawInfoWindow(property));
|
|
markers.addLayer(marker);
|
|
marker.on('popupopen', function () {
|
|
this._icon.className += ' marker-active';
|
|
});
|
|
marker.on('popupclose', function () {
|
|
this._icon.className = 'leaflet-marker-icon leaflet-zoom-animated leaflet-clickable marker-loaded';
|
|
});
|
|
});
|
|
|
|
map.addLayer(markers);
|
|
animatedMarkers(map, propertiesMarkers, properties, layout);
|
|
map.on('moveend', function () {
|
|
animatedMarkers(map, propertiesMarkers, properties, layout);
|
|
});
|
|
|
|
$('.fetching-properties .property-hover').hover(
|
|
function () {
|
|
propertiesMarkers[$(this).attr('id') - 1]._icon.className = 'leaflet-marker-icon leaflet-zoom-animated leaflet-clickable marker-loaded marker-active';
|
|
},
|
|
function () {
|
|
propertiesMarkers[$(this).attr('id') - 1]._icon.className = 'leaflet-marker-icon leaflet-zoom-animated leaflet-clickable marker-loaded';
|
|
}
|
|
);
|
|
|
|
|
|
|
|
$('.geolocation').on("click", function () {
|
|
map.locate({setView: true})
|
|
});
|
|
$('#map').removeClass('fade-map');
|
|
}
|