/* HI! I'm Alberto, a fullstack developer. I love SoloLearn and I want develop some projects here, let's start with Rome by night!!! API: Google API's PLACES Google API's OPENPANORAMA (streetview) Google API's Fonts CDN: https://alberto.noviia.com/sololearn/romebynight <--- yep, I do it well LIB: jquery jquery-ui modernizr classie notificationFx FONTS: Domine Open Sans Satisfy Steps for v1: ok - create a key for the project on Google API's ok - create simple layout for panel ok - create a custom map design that remind the night ok - develop a script to show poi (points of interest) in Rome ok - develop a script that open the place in google StreetView ok - add a map icon to return in map mode ok - create a open/close function for places panel ok - create infowindow for each marker with title of place ok - add html content to infowindow with image ok - create list of point of interest(poi) in Rome like: colosseum, fori imperiali, cappella sistina... ok - create an icon for each poi and add as marker ok - add credits on footer (eeheheh create footer) ok - create intro of 5 seconds to explain project ok - avoid google apis OVER QUERY LIMIT with an interval that simulate click on a button to load more places ok - add a modal to inform about DAILY QUOTA LIMIT... users must know that I don't pay for this project :P ok - ask for restyling to a designer V1 is here!!!!!!!!!!!! enjoy I'm a Google Maps Master now eheheheheh, I avoided the OVER_QUERY_LIMIT, but I can't get over DAILY_QUOTA_LIMIT */ var rightPanelManualClosed = 0; //this is for UX, if an user click to close the panel, the app respect him and remove invasive auto opening of right panel eheheh enjoy :P var markersList = []; var lostAddr = []; var results = []; function initMap() { var romePOI =[ ['Colosseo', 'ChIJrZN2dLdhLxMR7yl1SoIp6sY'], ['Basilica di San Pietro in Vaticano', 'ChIJWZsUt2FgLxMRg1KHzXfwS3I'], ['Fontana di Trevi', 'ChIJ1UCDJ1NgLxMRtrsCzOHxdvY'], ['Foro Romano', 'ChIJ782pg7NhLxMR5n3swAdAkfo'], ['Pantheon', 'ChIJqUCGZ09gLxMRLM42IPpl0co'], ['Piazza Navona', 'ChIJPRydwYNgLxMRSjOCLlYkV6M'], ['Cappella Sistina', 'ChIJ268jxWVgLxMRIj61f4fIFqs'], ['Musei Vaticani', 'ChIJKcGbg2NgLxMRthZkUqDs4M8'], ['Castel Sant\'Angelo', 'ChIJ0aTnEYeKJRMRiUF95xwRbDY'], ['Campidoglio', 'ChIJOclom0xgLxMRURy9OLL7Hg4'], ['Piazza Venezia', 'ChIJJfPPGE1gLxMRBgH6_EY2DYM'], ['Piazza di Spagna', 'ChIJ4_TEG1VgLxMROFkd29jWdug'], ['Piazza del Popolo', 'ChIJ0TL65fhgLxMRaipZ80mHe8g'], ['Campo de\' Fiori', 'ChIJCb6e9EVgLxMRp63sZ62Mk8k'], ['Galleria Borghese', 'ChIJq-bXVgRhLxMRv3vgOXaktBs'], ['Vittoriano', 'ChIJ412AG01gLxMR4T-4pwdIFSE'], ['Circo Massimo', 'ChIJQQudjsthLxMRvrQD3R9S53k'], ['Basilica di Santa Maria Maggiore', 'ChIJcw-l36RhLxMRON-ZxpBbvM8'], ['Bocca della Verità', 'ChIJc_qXfTVgLxMRXyICcbR9K4Y'], ['Villa d\'Este', 'ChIJw-YlX3B4LxMRmeEzTuqQHr8'], ['Musei Capitolini', 'ChIJ8-wGeU9gLxMR--zJtnpGod4'], ['Basilica di San Giovanni in Laterano', 'ChIJc6vKf79hLxMR-JBUkZ--MAE'], ['Villa Adriana', 'ChIJcafxz1l4LxMR0D0uFxImBV0'], ['Terme di Caracalla', 'ChIJ-7QYFs9hLxMRyPodSppcsAs'], ['Gianicolo', 'ChIJ-Z2cHUBgLxMRz8Wfw_RW_Qw'], ['Pincio', 'ChIJlYZIKvlgLxMRbBeXpZTHG2U'], ['Palazzo del Quirinale', 'ChIJ5_TFQ6xhLxMRVPkqjbUNONM'], ['Trastevere', 'ChIJ921caWhgLxMRM_bfeCcgn6M'], ['Piazza San Pietro', 'ChIJIRbrOGZgLxMROSyE2uUHIHA'], ['Fontana dei Quattro Fiumi', 'ChIJMX9e-09gLxMRWwB71Wo8020'], ['Palatino', 'ChIJ8zdPo7VhLxMRwgAXwZzzm50'] ]; backgrounz = [ /* [{"featureType": "all","elementType": "labels.text.fill","stylers": [{"color": "#ffffff"}]},{"featureType": "all","elementType": "labels.text.stroke","stylers": [{"color": "#000000"},{"lightness": 13}]},{"featureType": "administrative","elementType": "geometry.fill","stylers": [{"color": "#000000"}]},{"featureType": "administrative","elementType": "geometry.stroke","stylers": [{"color": "#144b53"},{"lightness": 14},{"weight": 1.4}]},{"featureType": "administrative","elementType": "labels","stylers": [{"visibility": "on"}]},{"featureType": "landscape","elementType": "all","stylers": [{"color": "#08304b"}]},{"featureType": "poi","elementType": "geometry","stylers": [{"color": "#0c4152"},{"lightness": 5},{"visibility": "on"}]},{"featureType": "poi","elementType": "labels","stylers": [{"visibility": "off"}]},{"featureType": "poi","elementType": "labels.text","stylers": [{"visibility": "off"}]},{"featureType": "road","elementType": "labels","stylers": [{"visibility": "off"}]},{"featureType": "road.highway","elementType": "geometry.fill","stylers": [{"color": "#000000"}]},{"featureType": "road.highway","elementType": "geometry.stroke","stylers": [{"color": "#0b434f"},{"lightness": 25}]},{"featureType": "road.arterial","elementType": "geometry.fill","stylers": [{"color": "#000000"}]},{"featureType": "road.arterial","elementType": "geometry.stroke","stylers": [{"color": "#0b3d51"},{"lightness": 16}]},{"featureType": "road.local","elementType": "geometry","stylers": [{"color": "#000000"}]},{"featureType": "transit","elementType": "all","stylers": [{"color": "#146474"}]},{"featureType": "transit","elementType": "labels","stylers": [{"visibility": "off"}]},{"featureType": "water","elementType": "all","stylers": [{"color": "#021019"}]}] , [{"featureType":"all","elementType":"all","stylers":[{"visibility":"on"}]},{"featureType":"all","elementType":"labels","stylers":[{"visibility":"off"},{"saturation":"-100"}]},{"featureType":"all","elementType":"labels.text.fill","stylers":[{"saturation":36},{"color":"#000000"},{"lightness":40},{"visibility":"off"}]},{"featureType":"all","elementType":"labels.text.stroke","stylers":[{"visibility":"off"},{"color":"#000000"},{"lightness":16}]},{"featureType":"all","elementType":"labels.icon","stylers":[{"visibility":"off"}]},{"featureType":"administrative","elementType":"geometry.fill","stylers":[{"color":"#000000"},{"lightness":20}]},{"featureType":"administrative","elementType":"geometry.stroke","stylers":[{"color":"#000000"},{"lightness":17},{"weight":1.2}]},{"featureType":"landscape","elementType":"geometry","stylers":[{"color":"#000000"},{"lightness":20}]},{"featureType":"landscape","elementType":"geometry.fill","stylers":[{"color":"#4d6059"}]},{"featureType":"landscape","elementType":"geometry.stroke","stylers":[{"color":"#4d6059"}]},{"featureType":"landscape.natural","elementType":"geometry.fill","stylers":[{"color":"#4d6059"}]},{"featureType":"poi","elementType":"geometry","stylers":[{"lightness":21}]},{"featureType":"poi","elementType":"geometry.fill","stylers":[{"color":"#4d6059"}]},{"featureType":"poi","elementType":"geometry.stroke","stylers":[{"color":"#4d6059"}]},{"featureType":"road","elementType":"geometry","stylers":[{"visibility":"on"},{"color":"#7f8d89"}]},{"featureType":"road","elementType":"geometry.fill","stylers":[{"color":"#7f8d89"}]},{"featureType":"road.highway","elementType":"geometry.fill","stylers":[{"color":"#7f8d89"},{"lightness":17}]},{"featureType":"road.highway","elementType":"geometry.stroke","stylers":[{"color":"#7f8d89"},{"lightness":29},{"weight":0.2}]},{"featureType":"road.arterial","elementType":"geometry","stylers":[{"color":"#000000"},{"lightness":18}]},{"featureType":"road.arterial","elementType":"geometry.fill","stylers":[{"color":"#7f8d89"}]},{"featureType":"road.arterial","elementType":"geometry.stroke","stylers":[{"color":"#7f8d89"}]},{"featureType":"road.local","elementType":"geometry","stylers":[{"color":"#000000"},{"lightness":16}]},{"featureType":"road.local","elementType":"geometry.fill","stylers":[{"color":"#7f8d89"}]},{"featureType":"road.local","elementType":"geometry.stroke","stylers":[{"color":"#7f8d89"}]},{"featureType":"transit","elementType":"geometry","stylers":[{"color":"#000000"},{"lightness":19}]},{"featureType":"water","elementType":"all","stylers":[{"color":"#2b3638"},{"visibility":"on"}]},{"featureType":"water","elementType":"geometry","stylers":[{"color":"#2b3638"},{"lightness":17}]},{"featureType":"water","elementType":"geometry.fill","stylers":[{"color":"#24282b"}]},{"featureType":"water","elementType":"geometry.stroke","stylers":[{"color":"#24282b"}]},{"featureType":"water","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"water","elementType":"labels.text","stylers":[{"visibility":"off"}]},{"featureType":"water","elementType":"labels.text.fill","stylers":[{"visibility":"off"}]},{"featureType":"water","elementType":"labels.text.stroke","stylers":[{"visibility":"off"}]},{"featureType":"water","elementType":"labels.icon","stylers":[{"visibility":"off"}]}], [{"featureType":"all","elementType":"labels","stylers":[{"visibility":"on"}]},{"featureType":"all","elementType":"labels.text.fill","stylers":[{"saturation":36},{"color":"#000000"},{"lightness":40}]},{"featureType":"all","elementType":"labels.text.stroke","stylers":[{"visibility":"on"},{"color":"#000000"},{"lightness":16}]},{"featureType":"all","elementType":"labels.icon","stylers":[{"visibility":"off"}]},{"featureType":"administrative","elementType":"geometry.fill","stylers":[{"color":"#000000"},{"lightness":20}]},{"featureType":"administrative","elementType":"geometry.stroke","stylers":[{"color":"#000000"},{"lightness":17},{"weight":1.2}]},{"featureType":"administrative.country","elementType":"labels.text.fill","stylers":[{"color":"#e5c163"}]},{"featureType":"administrative.locality","elementType":"labels.text.fill","stylers":[{"color":"#c4c4c4"}]},{"featureType":"administrative.neighborhood","elementType":"labels.text.fill","stylers":[{"color":"#e5c163"}]},{"featureType":"landscape","elementType":"geometry","stylers":[{"color":"#000000"},{"lightness":20}]},{"featureType":"poi","elementType":"geometry","stylers":[{"color":"#000000"},{"lightness":21},{"visibility":"on"}]},{"featureType":"poi.business","elementType":"geometry","stylers":[{"visibility":"on"}]},{"featureType":"road.highway","elementType":"geometry.fill","stylers":[{"color":"#e5c163"},{"lightness":"0"}]},{"featureType":"road.highway","elementType":"geometry.stroke","stylers":[{"visibility":"off"}]},{"featureType":"road.highway","elementType":"labels.text.fill","stylers":[{"color":"#ffffff"}]},{"featureType":"road.highway","elementType":"labels.text.stroke","stylers":[{"color":"#e5c163"}]},{"featureType":"road.arterial","elementType":"geometry","stylers":[{"color":"#000000"},{"lightness":18}]},{"featureType":"road.arterial","elementType":"geometry.fill","stylers":[{"color":"#575757"}]},{"featureType":"road.arterial","elementType":"labels.text.fill","stylers":[{"color":"#ffffff"}]},{"featureType":"road.arterial","elementType":"labels.text.stroke","stylers":[{"color":"#2c2c2c"}]},{"featureType":"road.local","elementType":"geometry","stylers":[{"color":"#000000"},{"lightness":16}]},{"featureType":"road.local","elementType":"labels.text.fill","stylers":[{"color":"#999999"}]},{"featureType":"transit","elementType":"geometry","stylers":[{"color":"#000000"},{"lightness":19}]},{"featureType":"water","elementType":"geometry","stylers":[{"color":"#000000"},{"lightness":17}]}], [{"featureType":"all","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"administrative","elementType":"all","stylers":[{"visibility":"off"}]},{"featureType":"administrative","elementType":"geometry.fill","stylers":[{"color":"#000000"}]},{"featureType":"administrative.country","elementType":"all","stylers":[{"visibility":"off"},{"color":"#c63030"}]},{"featureType":"administrative.country","elementType":"geometry.fill","stylers":[{"saturation":"-54"},{"color":"#454141"}]},{"featureType":"administrative.province","elementType":"all","stylers":[{"visibility":"off"}]},{"featureType":"administrative.locality","elementType":"all","stylers":[{"visibility":"off"}]},{"featureType":"administrative.neighborhood","elementType":"all","stylers":[{"visibility":"off"}]},{"featureType":"landscape","elementType":"all","stylers":[{"visibility":"on"},{"color":"#383838"}]},{"featureType":"poi","elementType":"all","stylers":[{"visibility":"off"}]},{"featureType":"road","elementType":"all","stylers":[{"visibility":"off"}]},{"featureType":"transit","elementType":"all","stylers":[{"visibility":"off"}]},{"featureType":"water","elementType":"all","stylers":[{"visibility":"simplified"}]},{"featureType":"water","elementType":"geometry.fill","stylers":[{"visibility":"on"},{"color":"#000000"}]},{"featureType":"water","elementType":"labels","stylers":[{"visibility":"off"}]}], [{"featureType":"all","elementType":"labels","stylers":[{"visibility":"on"}]},{"featureType":"all","elementType":"labels.text.fill","stylers":[{"saturation":36},{"color":"#000000"},{"lightness":40}]},{"featureType":"all","elementType":"labels.text.stroke","stylers":[{"visibility":"on"},{"color":"#000000"},{"lightness":16}]},{"featureType":"all","elementType":"labels.icon","stylers":[{"visibility":"off"}]},{"featureType":"administrative","elementType":"geometry.fill","stylers":[{"color":"#000000"},{"lightness":20}]},{"featureType":"administrative","elementType":"geometry.stroke","stylers":[{"color":"#000000"},{"lightness":17},{"weight":1.2}]},{"featureType":"administrative.locality","elementType":"labels.text.fill","stylers":[{"color":"#c4c4c4"}]},{"featureType":"administrative.neighborhood","elementType":"labels.text.fill","stylers":[{"color":"#707070"}]},{"featureType":"landscape","elementType":"geometry","stylers":[{"color":"#000000"},{"lightness":20}]},{"featureType":"poi","elementType":"geometry","stylers":[{"color":"#000000"},{"lightness":21},{"visibility":"on"}]},{"featureType":"poi.business","elementType":"geometry","stylers":[{"visibility":"on"}]},{"featureType":"road.highway","elementType":"geometry.fill","stylers":[{"color":"#be2026"},{"lightness":"0"},{"visibility":"on"}]},{"featureType":"road.highway","elementType":"geometry.stroke","stylers":[{"visibility":"off"}]},{"featureType":"road.highway","elementType":"labels.text.fill","stylers":[{"visibility":"off"}]},{"featureType":"road.highway","elementType":"labels.text.stroke","stylers":[{"visibility":"off"},{"hue":"#ff000a"}]},{"featureType":"road.arterial","elementType":"geometry","stylers":[{"color":"#000000"},{"lightness":18}]},{"featureType":"road.arterial","elementType":"geometry.fill","stylers":[{"color":"#575757"}]},{"featureType":"road.arterial","elementType":"labels.text.fill","stylers":[{"color":"#ffffff"}]},{"featureType":"road.arterial","elementType":"labels.text.stroke","stylers":[{"color":"#2c2c2c"}]},{"featureType":"road.local","elementType":"geometry","stylers":[{"color":"#000000"},{"lightness":16}]},{"featureType":"road.local","elementType":"labels.text.fill","stylers":[{"color":"#999999"}]},{"featureType":"road.local","elementType":"labels.text.stroke","stylers":[{"saturation":"-52"}]},{"featureType":"transit","elementType":"geometry","stylers":[{"color":"#000000"},{"lightness":19}]},{"featureType":"water","elementType":"geometry","stylers":[{"color":"#000000"},{"lightness":17}]}], [{"featureType":"all","elementType":"labels.text.fill","stylers":[{"saturation":36},{"color":"#000000"},{"lightness":40}]},{"featureType":"all","elementType":"labels.text.stroke","stylers":[{"visibility":"on"},{"color":"#000000"},{"lightness":16}]},{"featureType":"all","elementType":"labels.icon","stylers":[{"visibility":"off"}]},{"featureType":"administrative","elementType":"geometry.fill","stylers":[{"lightness":20}]},{"featureType":"administrative","elementType":"geometry.stroke","stylers":[{"color":"#000000"},{"lightness":17},{"weight":1.2}]},{"featureType":"administrative.province","elementType":"labels.text.fill","stylers":[{"color":"#e3b141"}]},{"featureType":"administrative.locality","elementType":"labels.text.fill","stylers":[{"color":"#e0a64b"}]},{"featureType":"administrative.locality","elementType":"labels.text.stroke","stylers":[{"color":"#0e0d0a"}]},{"featureType":"administrative.neighborhood","elementType":"labels.text.fill","stylers":[{"color":"#d1b995"}]},{"featureType":"landscape","elementType":"geometry","stylers":[{"color":"#000000"},{"lightness":20}]},{"featureType":"poi","elementType":"geometry","stylers":[{"color":"#000000"},{"lightness":21}]},{"featureType":"road","elementType":"labels.text.stroke","stylers":[{"color":"#12120f"}]},{"featureType":"road.highway","elementType":"geometry.fill","stylers":[{"lightness":"-77"},{"gamma":"4.48"},{"saturation":"24"},{"weight":"0.65"}]},{"featureType":"road.highway","elementType":"geometry.stroke","stylers":[{"lightness":29},{"weight":0.2}]},{"featureType":"road.highway.controlled_access","elementType":"geometry.fill","stylers":[{"color":"#f6b044"}]},{"featureType":"road.arterial","elementType":"geometry","stylers":[{"color":"#4f4e49"},{"weight":"0.36"}]},{"featureType":"road.arterial","elementType":"labels.text.fill","stylers":[{"color":"#c4ac87"}]},{"featureType":"road.arterial","elementType":"labels.text.stroke","stylers":[{"color":"#262307"}]},{"featureType":"road.local","elementType":"geometry","stylers":[{"color":"#a4875a"},{"lightness":16},{"weight":"0.16"}]},{"featureType":"road.local","elementType":"labels.text.fill","stylers":[{"color":"#deb483"}]},{"featureType":"transit","elementType":"geometry","stylers":[{"color":"#000000"},{"lightness":19}]},{"featureType":"water","elementType":"geometry","stylers":[{"color":"#0f252e"},{"lightness":17}]},{"featureType":"water","elementType":"geometry.fill","stylers":[{"color":"#080808"},{"gamma":"3.14"},{"weight":"1.07"}]}], [{"featureType":"all","elementType":"all","stylers":[{"invert_lightness":true},{"saturation":20},{"lightness":50},{"gamma":0.4},{"hue":"#00ffee"}]},{"featureType":"all","elementType":"geometry","stylers":[{"visibility":"simplified"}]},{"featureType":"all","elementType":"labels","stylers":[{"visibility":"on"}]},{"featureType":"administrative","elementType":"all","stylers":[{"color":"#ffffff"},{"visibility":"simplified"}]},{"featureType":"administrative.land_parcel","elementType":"geometry.stroke","stylers":[{"visibility":"simplified"}]},{"featureType":"landscape","elementType":"all","stylers":[{"color":"#405769"}]},{"featureType":"water","elementType":"geometry.fill","stylers":[{"color":"#232f3a"}]}],*/ [{"featureType":"all","elementType":"labels.text.fill","stylers":[{"saturation":36},{"color":"#000000"},{"lightness":40}]},{"featureType":"all","elementType":"labels.text.stroke","stylers":[{"visibility":"on"},{"color":"#000000"},{"lightness":16}]},{"featureType":"all","elementType":"labels.icon","stylers":[{"visibility":"off"}]},{"featureType":"administrative","elementType":"geometry.fill","stylers":[{"color":"#000000"},{"lightness":20}]},{"featureType":"administrative","elementType":"geometry.stroke","stylers":[{"color":"#000000"},{"lightness":17},{"weight":1.2}]},{"featureType":"administrative.locality","elementType":"all","stylers":[{"visibility":"on"}]},{"featureType":"administrative.neighborhood","elementType":"all","stylers":[{"visibility":"on"}]},{"featureType":"administrative.land_parcel","elementType":"all","stylers":[{"visibility":"on"}]},{"featureType":"landscape","elementType":"all","stylers":[{"visibility":"simplified"},{"color":"#797979"}]},{"featureType":"landscape","elementType":"geometry","stylers":[{"color":"#000000"},{"lightness":20}]},{"featureType":"landscape","elementType":"geometry.fill","stylers":[{"color":"#151515"}]},{"featureType":"landscape.man_made","elementType":"all","stylers":[{"visibility":"on"}]},{"featureType":"landscape.man_made","elementType":"geometry.fill","stylers":[{"color":"#151515"}]},{"featureType":"landscape.natural.landcover","elementType":"all","stylers":[{"visibility":"on"}]},{"featureType":"landscape.natural.landcover","elementType":"geometry","stylers":[{"color":"#151515"}]},{"featureType":"landscape.natural.landcover","elementType":"geometry.fill","stylers":[{"color":"#151515"}]},{"featureType":"landscape.natural.terrain","elementType":"all","stylers":[{"visibility":"off"}]},{"featureType":"landscape.natural.terrain","elementType":"geometry","stylers":[{"color":"#151515"}]},{"featureType":"landscape.natural.terrain","elementType":"geometry.fill","stylers":[{"color":"#151515"}]},{"featureType":"poi","elementType":"geometry","stylers":[{"lightness":21},{"color":"#151515"}]},{"featureType":"poi","elementType":"geometry.fill","stylers":[{"color":"#151515"}]},{"featureType":"poi","elementType":"geometry.stroke","stylers":[{"color":"#151515"}]},{"featureType":"road.highway","elementType":"geometry.fill","stylers":[{"color":"#000000"},{"lightness":17}]},{"featureType":"road.highway","elementType":"geometry.stroke","stylers":[{"color":"#000000"},{"lightness":29},{"weight":0.2}]},{"featureType":"road.highway.controlled_access","elementType":"geometry","stylers":[{"visibility":"on"},{"color":"#be3e08"}]},{"featureType":"road.arterial","elementType":"geometry","stylers":[{"color":"#be3e08"},{"lightness":18},{"visibility":"on"}]},{"featureType":"road.arterial","elementType":"geometry.stroke","stylers":[{"color":"#000000"}]},{"featureType":"road.local","elementType":"all","stylers":[{"visibility":"off"},{"color":"#ff0000"}]},{"featureType":"road.local","elementType":"geometry","stylers":[{"color":"#be3e08"},{"lightness":16}]},{"featureType":"road.local","elementType":"geometry.fill","stylers":[{"visibility":"on"}]},{"featureType":"road.local","elementType":"geometry.stroke","stylers":[{"color":"#000000"}]},{"featureType":"transit","elementType":"geometry","stylers":[{"color":"#000000"},{"lightness":19}]},{"featureType":"water","elementType":"geometry","stylers":[{"color":"#000000"},{"lightness":17},{"visibility":"on"}]},{"featureType":"water","elementType":"geometry.fill","stylers":[ { "color": "#151515" } ] }] ]; var places = ''; var rome = {lat: 41.902783, lng: 12.496366}; var infowindow = new google.maps.InfoWindow(); map = new google.maps.Map(document.getElementById('map'), { center: rome, zoom: 13, styles: backgrounz[Math.floor(Math.random()*backgrounz.length) ] }); $('#mapIcon').fadeOut(1500); var intervalAutoClickMore = setInterval(function(){ $('#more').click(); //console.log('interval'); },1000); var timeout = 1; showMarkersPaginated(); function showMarkersPaginated(start = 0){ for(a = start; a < (start+5); a++){ if(romePOI[a] !== undefined){ var response = detailsPlaces(romePOI[a],timeout); } //console.log(a+' > '+romePOI.length); if(a> romePOI.length ) { clearInterval(intervalAutoClickMore); //console.log('stop'); } } //console.log(romePOI); } function detailsPlaces(p,timeout){ var request = {placeId: p[1]}; var service = new google.maps.places.PlacesService(map); service.getDetails(request, function (place, status,firstOnly) { if (status == google.maps.places.PlacesServiceStatus.OK) { createMarker(place); romePOI = romePOI.filter(function(item){ return item[1] != p[1] }); } else if (status == google.maps.places.PlacesServiceStatus.OVER_QUERY_LIMIT) { alertError(); } }); } function w(v){ $('#test').append(v+"
"); } // Create the places service. /*var service = new google.maps.places.PlacesService(map); var getNextPage = null;*/ $('#more').click(function() { //console.log('clicked'); var page = $(this).attr('data-page'); //console.log(page+'<----'); if (page === undefined){ page = 0; } //showMarkersPaginated(5*page); showMarkersPaginated(0); $(this).attr('data-page', parseInt(page)+1); }); // Perform a nearby search. /* service.nearbySearch( {location: rome, radius: 30000, type: ['museum']}, function(results, status, pagination) { if (status !== 'OK') return; createMarkers(results); moreButton.disabled = !pagination.hasNextPage; getNextPage = pagination.hasNextPage && function() { pagination.nextPage(); }; }); */ function createMarkers(places){ for (var i = 0, place; place = places[i]; i++) { createMarker(place); } } function createMarker(place) { var bounds = new google.maps.LatLngBounds(); var placesList = document.getElementById('places'); var urlIcon = convertMarker(place); var image = { url: urlIcon, size: new google.maps.Size(128, 171), origin: new google.maps.Point(0, 0), anchor: new google.maps.Point(0, 0), scaledSize: new google.maps.Size((place.name == 'Colosseo' ? 100 : 50), (place.name == 'Colosseo' ? 100 : 50)) }; var marker = new google.maps.Marker({ map: map, icon: image, title: place.name, animation: google.maps.Animation.BOUNCE, position: place.geometry.location }); markersList.push(marker); var li = document.createElement('li'); li.textContent = place.name; li.setAttribute('onclick','Javascript: openStreet(\''+addslashes(place.name)+'\',\''+place.geometry.location+'\')'); placesList.appendChild(li); bounds.extend(place.geometry.location); //map.fitBounds(bounds); //$('#mapIcon').fadeOut(1500); var infowindowHTML = "

"; infowindowHTML += "

"+place.name+"

"; if(typeof place.photos !== 'undefined'){ infowindowHTML += "

Visit"; infowindowHTML += "

"; google.maps.event.addListener(marker, 'click', function(){ infowindow.close(); // Close previously opened infowindow infowindow.setContent( infowindowHTML ); infowindow.open(map, marker); }); } } function convertMarker(place){ if (place.name == 'Colosseo'){ return 'https://alberto.noviia.com/sololearn/romebynight/img/pin_colosseo.png'; }else{ rand = Math.floor(Math.random() * 13); return 'https://alberto.noviia.com/sololearn/romebynight/img/pin_'+rand+'.png'; } //return 'https://cdn0.iconfinder.com/data/icons/small-n-flat/24/678111-map-marker-24.png'; } function openStreet(poiName,poiLocation){ //console.log(poi); poilLocation = poiLocation.replace(/["'()]/g,""); //poilLocation = poiLocation.replace(')',''); var aPoiLocation = poilLocation.split(", "); //console.log(aPoiLocation[0]+' '+aPoiLocation[1]); position = new google.maps.LatLng(aPoiLocation[0],aPoiLocation[1]); title = poiName; var panoramaOptions = { position: position, pov: { heading: 4, pitch: 10 } }; google.maps.event.clearInstanceListeners(window); google.maps.event.clearInstanceListeners(document); $('#streetview').fadeIn(500); var panorama = new google.maps.StreetViewPanorama(document.getElementById('streetview'), panoramaOptions); /*var placeMarker = new google.maps.Marker({ position: position, map: panorama, icon: 'http://chart.apis.google.com/chart?chst=d_map_pin_icon&chld=cafe|FFFF00', title: title });*/ map.setStreetView(panorama); $('#streetview').fadeIn(1500); $('#mapIcon').fadeIn(100); $('#mapIcon').effect( 'bounce', 500 ); } function addslashes (str) { return (str + '') .replace(/[\\"']/g, '\\$&') .replace(/\u0000/g, '\\0') } function streetViewClose(){ $('#streetview').slideUp(500); $('#mapIcon').slideUp(500); $('#streetview').html(''); setTimeout(function(){ hideShowPanel('show'); },1000); } var firstOnly = 0; function alertError(){ // simulate loading (for demo purposes only) if(firstOnly != 'stop') setTimeout( function() { // create the notification var notification = new NotificationFx({ message : '

It appened again...

DAILY QUOTA LIMIT

Come back tomorrow to enjoy Rome at It\'s best :)
Thank you for watching and watching and watching this project!

', layout : 'other', ttl : 5000, effect : 'thumbslider', type : 'notice', // notice, warning, error or success }); // show the notification notification.show(); }, 1200 ); // disable the button (for demo purposes only) this.disabled = true; firstOnly = 'stop'; } jQuery(function($) { /*setTimeout(function(){ hideShowPanel('hide'); },1000);*/ setTimeout(function(){ $('#intro').fadeOut(1000); setTimeout(function(){ initMap(); hideShowPanel('hide'); },1000); },3000); $('#right-panel').on('click',function(){ if($(this).css('right') == '-211px'){ hideShowPanel('show'); }else{ hideShowPanel('hide'); rightPanelManualClosed = 1; } }); }); function hideShowPanel(val){ if(val == 'show' && rightPanelManualClosed == 1) return; $('#right-panel').animate({ right:(val == 'hide' ? '-211px' : '0') },700); }

Rome by night v1