Sam Matthews mapsam

So for this random project (another one) I'm working on geocodeing a spreadsheet of addresses and adding them to a map. I'm building with the constructor.prototype stuff that you showed me with Guss and am wondering how far I can extend the prototype for more organization. Say for instance I'd like to split my functions into categories such as "spreadsheet" and "map" where I could essentially do all spreadsheet functions by calling:

this.spreadsheet.get OR this.spreadsheet.query OR this.spreadsheet.print_to_dom

and similarly could use my mapping functions like:

this.map.init_tiles OR this.map.add_points

basically keeping everything scoped within the same set of parent functions instead of all at the same parent constructor level.

Showing the functionality of toggling layers in Leaflet while preserving their reference for later usage (i.e. turning the layer back on). This is useful when working with many layers in leaflet and turning opacity to 0 won't cut it because it can have negative effects when hover and click events require properly layered DOM elements.

Important takeaways:

It's important to scope your data to access it globally, or at least within your appropriate scope.
Turn off a layer by referencing its variable using the removeLayer() method.
Turn on a layer by referencing its variable using the addLayer() method.

	<!doctype html>
	<html lang="en">

	<head>
	<meta charset="utf-8">
	<script src="http://code.jquery.com/jquery-1.11.2.min.js"></script>
	<style>
	body {
	background: MediumAquaMarine;
	}

	<!doctype html>
	<html lang="en">

	<head>
	<meta charset="utf-8">
	<script src="http://code.jquery.com/jquery-1.11.2.min.js"></script>
	<style>
	body {
	background: salmon;
	}

	<!doctype html>
	<html lang="en">

	<head>
	<meta charset="utf-8">
	<!--
	here we are including the jQuery library specifically to use
	the `$.ajax()` function for making a call to the Census API
	-->
	<script src="http://code.jquery.com/jquery-1.11.2.min.js"></script>

	.typeahead,
	.tt-query,
	.tt-hint {
	width: 396px;
	height: 30px;
	padding: 8px 12px;
	font-size: 24px;
	line-height: 30px;
	border: 2px solid #ccc;
	-webkit-border-radius: 8px;

	/* Gallery styles available to add to your style.css */
	.gallery {}
	a.gallery-image {}
	a.gallery-image img {}

	jQuery(document).ready(function($) {
	$('.post').on('click', function(){
	getPostInfo($(this).attr('data-postid'));
	});
	});

	function getPostInfo(id) {
	jQuery.ajax({
	url: ajaxurl,
	dataType: 'json',

	function addCommas(n) {
	var str = n.toString(),
	len = str.length,
	num = str.slice(0, len%3);

	for(i=0;i<Math.floor(len/3);i++) {
	num = num + ',' + str.substr(len%3+(3*i), 3);
	}

	if(num.slice(0,1)===',') {