├── .editorconfig ├── .gitignore ├── .jshintrc ├── .travis.yml ├── CONTRIBUTING.md ├── Gruntfile.js ├── LICENSE ├── README.md ├── bower.json ├── css └── gmapify.css ├── dist ├── jquery.gmapify.js └── jquery.gmapify.min.js ├── npm-debug.log ├── package.json └── src └── jquery.gmapify.js /.editorconfig: -------------------------------------------------------------------------------- 1 | # This file is for unifying the coding style for different editors and IDEs 2 | # editorconfig.org 3 | 4 | root = true 5 | 6 | [*] 7 | indent_style = tab 8 | end_of_line = lf 9 | charset = utf-8 10 | trim_trailing_whitespace = true 11 | insert_final_newline = true 12 | 13 | [package.json] 14 | ; The indent size used in the `package.json` file cannot be changed 15 | ; https://github.com/npm/npm/pull/3180#issuecomment-16336516 16 | indent_size = 2 17 | indent_style = space 18 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules -------------------------------------------------------------------------------- /.jshintrc: -------------------------------------------------------------------------------- 1 | { 2 | "boss": true, 3 | "curly": true, 4 | "eqeqeq": true, 5 | "eqnull": true, 6 | "expr": true, 7 | "immed": true, 8 | "noarg": true, 9 | "onevar": true, 10 | "quotmark": "double", 11 | "unused": true, 12 | "node": true, 13 | "quotmark": false, 14 | "unused": false, 15 | "loopfunc": true, 16 | "immed": false 17 | } 18 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | language: node_js 2 | node_js: 3 | - 0.10 4 | -------------------------------------------------------------------------------- /CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | # Contributing 2 | 3 | Before sending a pull request remember to follow [jQuery Core Style Guide](http://contribute.jquery.org/style-guide/js/). 4 | 5 | 1. Fork it! 6 | 2. Create your feature branch: `git checkout -b my-new-feature` 7 | 3. Make your changes on the `src` folder, never on the `dist` folder. 8 | 4. Commit your changes: `git commit -m 'Add some feature'` 9 | 5. Push to the branch: `git push origin my-new-feature` 10 | 6. Submit a pull request :D 11 | 12 | #### Have you created a plugin from our boilerplate? 13 | 14 | [Let us know!](https://github.com/jquery-boilerplate/boilerplate/wiki/Sites) It’s interesting to see what features others have come up with. 15 | -------------------------------------------------------------------------------- /Gruntfile.js: -------------------------------------------------------------------------------- 1 | module.exports = function(grunt) { 2 | 3 | grunt.initConfig({ 4 | 5 | // Import package manifest 6 | pkg: grunt.file.readJSON("package.json"), 7 | 8 | // Banner definitions 9 | meta: { 10 | banner: "/*\n" + 11 | " * <%= pkg.title || pkg.name %> - v<%= pkg.version %>\n" + 12 | " * <%= pkg.description %>\n" + 13 | " * <%= pkg.homepage %>\n" + 14 | " *\n" + 15 | " * Made by <%= pkg.author.name %>\n" + 16 | " * Under <%= pkg.license %> License\n" + 17 | " */\n" 18 | }, 19 | 20 | // Concat definitions 21 | concat: { 22 | options: { 23 | banner: "<%= meta.banner %>" 24 | }, 25 | dist: { 26 | src: ["src/jquery.gmapify.js"], 27 | dest: "dist/jquery.gmapify.js" 28 | } 29 | }, 30 | 31 | // Lint definitions 32 | jshint: { 33 | files: ["src/jquery.gmapify.js"], 34 | options: { 35 | jshintrc: ".jshintrc" 36 | } 37 | }, 38 | 39 | // Minify definitions 40 | uglify: { 41 | my_target: { 42 | src: ["dist/jquery.gmapify.js"], 43 | dest: "dist/jquery.gmapify.min.js" 44 | }, 45 | options: { 46 | banner: "<%= meta.banner %>" 47 | } 48 | }, 49 | 50 | copy: { 51 | main: { 52 | files: [ 53 | {expand: true, cwd: 'css/', src: ['**'], dest: '../gh-pages/css/'}, 54 | {expand: true, cwd: 'src/', src: ['**'], dest: '../gh-pages/js/'}, 55 | ], 56 | }, 57 | }, 58 | 59 | // watch for changes to source 60 | // Better than calling grunt a million times 61 | // (call 'grunt watch') 62 | watch: { 63 | options: { 64 | spawn: false, 65 | }, 66 | files: ['src/*', 'css/*'], 67 | tasks: ['default'] 68 | } 69 | 70 | }); 71 | 72 | grunt.loadNpmTasks("grunt-contrib-concat"); 73 | grunt.loadNpmTasks("grunt-contrib-jshint"); 74 | grunt.loadNpmTasks("grunt-contrib-uglify"); 75 | grunt.loadNpmTasks("grunt-contrib-watch"); 76 | grunt.loadNpmTasks('grunt-contrib-copy'); 77 | 78 | grunt.registerTask("build", ["concat", "uglify", "copy"]); 79 | grunt.registerTask("default", ["jshint", "build"]); 80 | grunt.registerTask("travis", ["default"]); 81 | 82 | }; 83 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2015 Saddam Azad 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | 23 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Schema-GMapify 2 | ##### A jQuery plugin for Google Map integration using Schema.org markup 3 | 4 | (Organisation, Localbusiness, PostalAddress and GeoCoordinates) 5 | 6 | #[Documentation](http://azadcreative.github.io/schema-gmapify/) 7 | 8 | #[Demo](http://azadcreative.github.io/schema-gmapify/demo.html) -------------------------------------------------------------------------------- /bower.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "jquery-gmapify", 3 | "version": "0.1", 4 | "homepage": "http://www.saddamazad.com", 5 | "authors": [ 6 | "Saddam Azad " 7 | ], 8 | "description": "Google Maps integration using Schema.org Place/Organisation/PostalAddress markup.", 9 | "main": "src/jquery.gmapify.js", 10 | "keywords": [ 11 | "jquery", 12 | "gmaps" 13 | ], 14 | "ignore": [ 15 | "node_modules", 16 | "vendor" 17 | ], 18 | "license": "MIT" 19 | } -------------------------------------------------------------------------------- /css/gmapify.css: -------------------------------------------------------------------------------- 1 | /* 2 | * Gmapify.css 3 | */ 4 | 5 | html, body { 6 | width: 100%; 7 | height: 100%; 8 | margin: 0; 9 | padding: 0; 10 | } 11 | 12 | #map { 13 | background: transparent; 14 | position: relative; 15 | overflow: hidden; 16 | } 17 | 18 | #map-meta { 19 | min-height: 1px; 20 | padding: 0 !important; 21 | position: relative; 22 | margin-bottom: 20px; 23 | } 24 | 25 | #map-meta ul { 26 | margin-top: 20px; 27 | list-style: outside none none; 28 | margin-bottom: 0; 29 | padding-left: 0; 30 | } 31 | 32 | #map-meta ul li { 33 | float: none; 34 | display: block; 35 | position: relative; 36 | } 37 | 38 | #map-meta .nav-pills > li > a.active, 39 | #map-meta .nav-pills > li > a.active:hover, 40 | #map-meta .nav-pills > li > a.active:focus { 41 | background: white !important; 42 | box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.15); 43 | color: #333333; 44 | outline: medium none; 45 | } 46 | 47 | #map-meta .nav-pills > li > a:hover { 48 | background: #ebecec; 49 | } 50 | #map-meta .nav-pills > li > a:hover, 51 | #map-meta .nav-pills > li > a:focus, 52 | #map-meta .nav-pills > li > a:active { 53 | text-decoration: none; 54 | } 55 | 56 | 57 | #map-meta .nav-pills > li > a { 58 | border-radius: 0; 59 | padding: 12px 15px; 60 | display: block; 61 | } 62 | 63 | #map-meta li a.active time { 64 | background: #b91231 none repeat scroll 0 0; 65 | } 66 | #map-meta time { 67 | background: #fc6e51 none repeat scroll 0 0; 68 | color: #fff; 69 | display: inline-block; 70 | font-size: 12px; 71 | line-height: 1; 72 | margin: 3px 0 0; 73 | padding: 5px 5px 3px; 74 | text-transform: uppercase; 75 | } 76 | 77 | #map-meta span { 78 | display: block; 79 | } 80 | 81 | #map-meta a[itemprop="url"], 82 | #map-meta div[itemprop="name"], 83 | #map-meta div[itemprop="description"], 84 | #map-meta img[itemprop="logo"], 85 | #map-meta span[itemprop="addressLocality"], 86 | #map-meta span[itemprop="addressRegion"], 87 | #map-meta span[itemprop="addressCountry"], 88 | #map-meta span[itemprop="description"], 89 | #map-meta span[itemprop="postalCode"] { 90 | display: none; 91 | } 92 | 93 | #map-canvas { 94 | display: block; 95 | margin: 0; 96 | padding: 0; 97 | height: 500px; 98 | } 99 | 100 | #map-canvas img { 101 | max-width: none !important; 102 | background: none !important; 103 | } 104 | .info_content { 105 | min-width: 150px; 106 | max-width: 300px; 107 | min-height: 60px; 108 | } 109 | .info_content h3 { 110 | margin: 5px 0 0 0; 111 | font-size: 13px; 112 | font-weight: bold; 113 | } 114 | .info_content h4 { 115 | margin: 5px 0; 116 | font-size: 11px; 117 | } 118 | .info_content p { 119 | margin: 15px 0 5px 0; 120 | font-size: 12px; 121 | } -------------------------------------------------------------------------------- /dist/jquery.gmapify.js: -------------------------------------------------------------------------------- 1 | /* 2 | * jquery-gmapify - v 3 | * Integrate Google Maps with multiple markers with Schema.Org data provided in markup. 4 | * http://www.saddamazad.com 5 | * 6 | * Made by Saddam Azad 7 | * Under MIT License 8 | */ 9 | ;(function ( $, window, document, undefined ) { 10 | "use strict"; 11 | 12 | $.gmapify = function(element, options) { 13 | 14 | var defaults = { 15 | canvas: "", 16 | datasource: "", 17 | dataitems: "li", 18 | zoom: 14, 19 | scrollwheel: false 20 | }; 21 | 22 | var plugin = this; 23 | plugin.settings = {}; 24 | plugin.data = {}; 25 | 26 | // to reference to the actual DOM element, use: element 27 | // to reference to the jQuery version of DOM element, use: $element 28 | var $element = $(element); 29 | 30 | plugin.init = function() { 31 | plugin.settings = $.extend({}, defaults, options); 32 | 33 | // Get the place markup, and define the places and infoWindowContent 34 | var metalist = $(this.settings.datasource).find(this.settings.dataitems); 35 | var places = []; 36 | var infoWindowContent = []; 37 | 38 | $(metalist).each(function() { 39 | var place_name = $(this).find("a span.name").html(); 40 | var place_latitude = $(this).find('.location span[property="latitude"]').attr('content'); 41 | var place_longitude = $(this).find('.location span[property="longitude"]').attr('content'); 42 | 43 | var place_streetAddress = $(this).find('a span[itemprop="streetAddress"]').html(); 44 | var place_description = $(this).find('a span[itemprop="description"]').html(); 45 | if (typeof place_description === "undefined") { place_description = ""; } 46 | 47 | infoWindowContent.push(['
' + 48 | "

" + place_name + "

" + 49 | "

" + place_streetAddress + "

" + 50 | "

" + place_description + "

" + 51 | "
"]); 52 | 53 | places.push([place_name, place_latitude, place_longitude]); 54 | }); 55 | 56 | // Define the bounds of the map 57 | var bounds = new google.maps.LatLngBounds(); 58 | for (var i = 0; i < places.length; i++) { 59 | bounds.extend( new google.maps.LatLng(places[i][1], places[i][2]) ); 60 | 61 | } 62 | 63 | // Create the map 64 | var mapOptions = { 65 | // center: new google.maps.LatLng(bounds.getCenter().G, bounds.getCenter().K), 66 | center: bounds.getCenter(), 67 | zoom: plugin.settings.zoom, 68 | scrollwheel: plugin.settings.scrollwheel, 69 | mapTypeId: google.maps.MapTypeId.ROADMAP 70 | }; 71 | 72 | var map = new google.maps.Map($(plugin.settings.canvas)[0], mapOptions); 73 | map.setTilt(45); 74 | map.fitBounds(bounds); 75 | 76 | // Display multiple places on a map 77 | var infoWindow = new google.maps.InfoWindow(), marker, clickity; 78 | 79 | google.maps.event.addListener(map, "click", function() { 80 | infoWindow.close(); 81 | }); 82 | 83 | 84 | // Loop through our array of markers & place each one on the map 85 | // Define the markers using google.maps.Marker 86 | for (i = 0; i < places.length; i++) { 87 | // $.each(places, function(i) { 88 | var place = places[i]; 89 | var content = infoWindowContent[i][0]; 90 | var latitude = parseFloat(place[1]); 91 | var longitude = parseFloat(place[2]); 92 | var latlong = new google.maps.LatLng(latitude, longitude); 93 | 94 | // Creates a marker 95 | marker = new google.maps.Marker({ 96 | position: latlong, 97 | map: map, 98 | content: content 99 | }); 100 | 101 | // Assigns a click function to each marker 102 | marker.addListener("click", function() { 103 | infoWindow.setContent(this.content); 104 | infoWindow.open(map, this); 105 | // map.setCenter(this.getPosition()); 106 | }); 107 | 108 | } 109 | 110 | 111 | // When the places in the sidebar are clicked, highlight marker. 112 | $(metalist).find("a").on("click", function() { 113 | $(metalist).each(function() { 114 | $(this).find("a").removeClass("active"); 115 | }); 116 | $(this).addClass("active"); 117 | 118 | i = $(this).parent().index(); 119 | var place = places[i]; 120 | var content = infoWindowContent[i][0]; 121 | var latitude = parseFloat(place[1]); 122 | var longitude = parseFloat(place[2]); 123 | var latlong = new google.maps.LatLng(latitude, longitude); 124 | 125 | marker = new google.maps.Marker({ 126 | map: map, 127 | content: content, 128 | position: latlong 129 | }); 130 | 131 | google.maps.event.addListener(marker, "click", function() { 132 | infoWindow.setContent(this.content); 133 | infoWindow.open(map, this); 134 | // map.setCenter(marker.getPosition()); 135 | }); 136 | 137 | google.maps.event.trigger(marker, "click"); 138 | }); 139 | 140 | 141 | 142 | google.maps.event.addListenerOnce(map, "idle", function(){ 143 | i = 0; 144 | var place = places[i]; 145 | var content = infoWindowContent[i][0]; 146 | var latitude = parseFloat(place[1]); 147 | var longitude = parseFloat(place[2]); 148 | var latlong = new google.maps.LatLng(latitude, longitude); 149 | 150 | marker = new google.maps.Marker({ 151 | map: map, 152 | content: content, 153 | position: latlong 154 | }); 155 | 156 | google.maps.event.addListener(marker, "click", function() { 157 | infoWindow.setContent(content); 158 | infoWindow.open(map, this); 159 | }); 160 | 161 | google.maps.event.trigger(marker, "click"); 162 | }); 163 | 164 | /** 165 | // Center the map when the window is resized 166 | var center = map.getCenter(); 167 | google.maps.event.addDomListener(window, 'resize', function() { 168 | map.setCenter(center); 169 | }); 170 | /**/ 171 | 172 | // Override our map zoom level once our fitBounds function runs (Make sure it only runs once) 173 | var boundsListener = google.maps.event.addListener((map), "bounds_changed", function(event) { 174 | this.setZoom(plugin.settings.zoom); 175 | google.maps.event.removeListener(boundsListener); 176 | }); 177 | /**/ 178 | 179 | }; // end plugin.init 180 | 181 | // initialize 182 | if ( $(options.canvas).length > 0 ) { 183 | plugin.init(); 184 | } 185 | }; 186 | 187 | // A really lightweight plugin wrapper around the constructor, 188 | // preventing against multiple instantiations 189 | $.fn.gmapify = function(options) { 190 | return this.each(function() { 191 | if (undefined === $(this).data('gmapify')) { 192 | var plugin = new $.gmapify(this, options); 193 | $(this).data('gmapify', plugin); 194 | } 195 | }); 196 | }; 197 | 198 | })(jQuery); -------------------------------------------------------------------------------- /dist/jquery.gmapify.min.js: -------------------------------------------------------------------------------- 1 | /* 2 | * jquery-gmapify - v 3 | * Integrate Google Maps with multiple markers with Schema.Org data provided in markup. 4 | * http://www.saddamazad.com 5 | * 6 | * Made by Saddam Azad 7 | * Under MIT License 8 | */ 9 | !function(a,b,c,d){"use strict";a.gmapify=function(b,c){var d={canvas:"",datasource:"",dataitems:"li",zoom:14,scrollwheel:!1},e=this;e.settings={},e.data={};a(b);e.init=function(){e.settings=a.extend({},d,c);var b=a(this.settings.datasource).find(this.settings.dataitems),f=[],g=[];a(b).each(function(){var b=a(this).find("a span.name").html(),c=a(this).find('.location span[property="latitude"]').attr("content"),d=a(this).find('.location span[property="longitude"]').attr("content"),e=a(this).find('a span[itemprop="streetAddress"]').html(),h=a(this).find('a span[itemprop="description"]').html();"undefined"==typeof h&&(h=""),g.push(['

'+b+"

"+e+"

"+h+"

"]),f.push([b,c,d])});for(var h=new google.maps.LatLngBounds,i=0;i0&&e.init()},a.fn.gmapify=function(b){return this.each(function(){if(d===a(this).data("gmapify")){var c=new a.gmapify(this,b);a(this).data("gmapify",c)}})}}(jQuery); -------------------------------------------------------------------------------- /npm-debug.log: -------------------------------------------------------------------------------- 1 | 0 info it worked if it ends with ok 2 | 1 verbose cli [ 'node', '/usr/local/bin/npm', 'install' ] 3 | 2 info using npm@1.4.28 4 | 3 info using node@v0.10.35 5 | 4 error install Couldn't read dependencies 6 | 5 error Error: Invalid version: "0.1" 7 | 5 error at Object.module.exports.fixVersionField (/usr/local/lib/node_modules/npm/node_modules/read-package-json/node_modules/normalize-package-data/lib/fixer.js:183:13) 8 | 5 error at /usr/local/lib/node_modules/npm/node_modules/read-package-json/node_modules/normalize-package-data/lib/normalize.js:30:38 9 | 5 error at Array.forEach (native) 10 | 5 error at normalize (/usr/local/lib/node_modules/npm/node_modules/read-package-json/node_modules/normalize-package-data/lib/normalize.js:29:15) 11 | 5 error at final (/usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:342:33) 12 | 5 error at then (/usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:126:33) 13 | 5 error at /usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:266:40 14 | 5 error at evalmachine.:272:14 15 | 5 error at /usr/local/lib/node_modules/npm/node_modules/graceful-fs/graceful-fs.js:102:5 16 | 5 error at Object.oncomplete (evalmachine.:108:15) 17 | 6 error If you need help, you may report this *entire* log, 18 | 6 error including the npm and node versions, at: 19 | 6 error 20 | 7 error System Darwin 14.5.0 21 | 8 error command "node" "/usr/local/bin/npm" "install" 22 | 9 error cwd /Users/saddamazad/Copy/htdocs/dev.roninvolleyball.com/wp-content/themes/ronin2015/js/custom/gmapify 23 | 10 error node -v v0.10.35 24 | 11 error npm -v 1.4.28 25 | 12 verbose exit [ 1, true ] 26 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "jquery-gmapify", 3 | "version": "", 4 | "description": "Integrate Google Maps with multiple markers with Schema.Org data provided in markup.", 5 | "keywords": [ 6 | "gmaps", 7 | "jquery" 8 | ], 9 | "repository": { 10 | "type": "git", 11 | "url": "" 12 | }, 13 | "bugs": { 14 | "url": "" 15 | }, 16 | "author": { 17 | "name": "Saddam Azad", 18 | "email": "saddam.azad@me.com", 19 | "url": "https://github.com/azadcreative" 20 | }, 21 | "homepage": "http://www.saddamazad.com", 22 | "contributors": [], 23 | "license": "MIT", 24 | "devDependencies": { 25 | "grunt": "~0.4.5", 26 | "grunt-cli": "~0.1.13", 27 | "grunt-contrib-concat": "^0.5.1", 28 | "grunt-contrib-jshint": "^0.11.0", 29 | "grunt-contrib-uglify": "^0.8.0", 30 | "grunt-contrib-watch": "^0.6.1", 31 | "grunt-contrib-copy": "0.8.2" 32 | }, 33 | "scripts": { 34 | "test": "grunt travis --verbose" 35 | } 36 | } -------------------------------------------------------------------------------- /src/jquery.gmapify.js: -------------------------------------------------------------------------------- 1 | ;(function ( $, window, document, undefined ) { 2 | "use strict"; 3 | 4 | $.gmapify = function(element, options) { 5 | 6 | var defaults = { 7 | canvas: "", 8 | datasource: "", 9 | dataitems: "li", 10 | zoom: 14, 11 | scrollwheel: false 12 | }; 13 | 14 | var plugin = this; 15 | plugin.settings = {}; 16 | plugin.data = {}; 17 | 18 | // to reference to the actual DOM element, use: element 19 | // to reference to the jQuery version of DOM element, use: $element 20 | var $element = $(element); 21 | 22 | plugin.init = function() { 23 | plugin.settings = $.extend({}, defaults, options); 24 | 25 | // Get the place markup, and define the places and infoWindowContent 26 | var metalist = $(this.settings.datasource).find(this.settings.dataitems); 27 | var places = []; 28 | var infoWindowContent = []; 29 | 30 | $(metalist).each(function() { 31 | var place_name = $(this).find("a span.name").html(); 32 | var place_latitude = $(this).find('.location span[property="latitude"]').attr('content'); 33 | var place_longitude = $(this).find('.location span[property="longitude"]').attr('content'); 34 | 35 | var place_streetAddress = $(this).find('a span[itemprop="streetAddress"]').html(); 36 | var place_description = $(this).find('a span[itemprop="description"]').html(); 37 | if (typeof place_description === "undefined") { place_description = ""; } 38 | 39 | infoWindowContent.push(['
' + 40 | "

" + place_name + "

" + 41 | "

" + place_streetAddress + "

" + 42 | "

" + place_description + "

" + 43 | "
"]); 44 | 45 | places.push([place_name, place_latitude, place_longitude]); 46 | }); 47 | 48 | // Define the bounds of the map 49 | var bounds = new google.maps.LatLngBounds(); 50 | for (var i = 0; i < places.length; i++) { 51 | bounds.extend( new google.maps.LatLng(places[i][1], places[i][2]) ); 52 | 53 | } 54 | 55 | // Create the map 56 | var mapOptions = { 57 | // center: new google.maps.LatLng(bounds.getCenter().G, bounds.getCenter().K), 58 | center: bounds.getCenter(), 59 | zoom: plugin.settings.zoom, 60 | scrollwheel: plugin.settings.scrollwheel, 61 | mapTypeId: google.maps.MapTypeId.ROADMAP 62 | }; 63 | 64 | var map = new google.maps.Map($(plugin.settings.canvas)[0], mapOptions); 65 | map.setTilt(45); 66 | map.fitBounds(bounds); 67 | 68 | // Display multiple places on a map 69 | var infoWindow = new google.maps.InfoWindow(), marker, clickity; 70 | 71 | google.maps.event.addListener(map, "click", function() { 72 | infoWindow.close(); 73 | }); 74 | 75 | 76 | // Loop through our array of markers & place each one on the map 77 | // Define the markers using google.maps.Marker 78 | for (i = 0; i < places.length; i++) { 79 | // $.each(places, function(i) { 80 | var place = places[i]; 81 | var content = infoWindowContent[i][0]; 82 | var latitude = parseFloat(place[1]); 83 | var longitude = parseFloat(place[2]); 84 | var latlong = new google.maps.LatLng(latitude, longitude); 85 | 86 | // Creates a marker 87 | marker = new google.maps.Marker({ 88 | position: latlong, 89 | map: map, 90 | content: content 91 | }); 92 | 93 | // Assigns a click function to each marker 94 | marker.addListener("click", function() { 95 | infoWindow.setContent(this.content); 96 | infoWindow.open(map, this); 97 | // map.setCenter(this.getPosition()); 98 | }); 99 | 100 | } 101 | 102 | 103 | // When the places in the sidebar are clicked, highlight marker. 104 | $(metalist).find("a").on("click", function() { 105 | $(metalist).each(function() { 106 | $(this).find("a").removeClass("active"); 107 | }); 108 | $(this).addClass("active"); 109 | 110 | i = $(this).parent().index(); 111 | var place = places[i]; 112 | var content = infoWindowContent[i][0]; 113 | var latitude = parseFloat(place[1]); 114 | var longitude = parseFloat(place[2]); 115 | var latlong = new google.maps.LatLng(latitude, longitude); 116 | 117 | marker = new google.maps.Marker({ 118 | map: map, 119 | content: content, 120 | position: latlong 121 | }); 122 | 123 | google.maps.event.addListener(marker, "click", function() { 124 | infoWindow.setContent(this.content); 125 | infoWindow.open(map, this); 126 | // map.setCenter(marker.getPosition()); 127 | }); 128 | 129 | google.maps.event.trigger(marker, "click"); 130 | }); 131 | 132 | 133 | 134 | google.maps.event.addListenerOnce(map, "idle", function(){ 135 | i = 0; 136 | var place = places[i]; 137 | var content = infoWindowContent[i][0]; 138 | var latitude = parseFloat(place[1]); 139 | var longitude = parseFloat(place[2]); 140 | var latlong = new google.maps.LatLng(latitude, longitude); 141 | 142 | marker = new google.maps.Marker({ 143 | map: map, 144 | content: content, 145 | position: latlong 146 | }); 147 | 148 | google.maps.event.addListener(marker, "click", function() { 149 | infoWindow.setContent(content); 150 | infoWindow.open(map, this); 151 | }); 152 | 153 | google.maps.event.trigger(marker, "click"); 154 | }); 155 | 156 | /** 157 | // Center the map when the window is resized 158 | var center = map.getCenter(); 159 | google.maps.event.addDomListener(window, 'resize', function() { 160 | map.setCenter(center); 161 | }); 162 | /**/ 163 | 164 | // Override our map zoom level once our fitBounds function runs (Make sure it only runs once) 165 | var boundsListener = google.maps.event.addListener((map), "bounds_changed", function(event) { 166 | this.setZoom(plugin.settings.zoom); 167 | google.maps.event.removeListener(boundsListener); 168 | }); 169 | /**/ 170 | 171 | }; // end plugin.init 172 | 173 | // initialize 174 | if ( $(options.canvas).length > 0 ) { 175 | plugin.init(); 176 | } 177 | }; 178 | 179 | // A really lightweight plugin wrapper around the constructor, 180 | // preventing against multiple instantiations 181 | $.fn.gmapify = function(options) { 182 | return this.each(function() { 183 | if (undefined === $(this).data('gmapify')) { 184 | var plugin = new $.gmapify(this, options); 185 | $(this).data('gmapify', plugin); 186 | } 187 | }); 188 | }; 189 | 190 | })(jQuery); --------------------------------------------------------------------------------