alazyreader/nyc-bookstores
1
0
Fork 0
Code Issues 1 Pull Requests Releases Wiki Activity

update tabletop

Browse Source
This commit is contained in:
Jessica Lord 2014-06-28 15:26:30 -07:00
parent ceff5429ff
commit a78b4f9213
2 changed files with 39 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
index.html
View File

@ -1,10 +1,10 @@
<html> <html>
<head> <head>
<title>Hack Spots</title> <title>Hack Spots</title>
<script type="text/javascript" src="js/ICanHaz.js"></script> <script type="text/javascript" src="js/ICanHaz.js"></script>
<script type="text/javascript" src='http://api.tiles.mapbox.com/mapbox.js/v1.4.0/mapbox.js'></script> <script type="text/javascript" src='http://api.tiles.mapbox.com/mapbox.js/v1.4.0/mapbox.js'></script>
<script type="text/javascript" src='js/jquery.js '></script> <script type="text/javascript" src='js/jquery.js '></script>
<script type="text/javascript" src='js/tabletop.js'></script> <script type="text/javascript" src='js/tabletop1.3.4.js'></script>
<script type="text/javascript" src='js/sheetsee.js'></script> <script type="text/javascript" src='js/sheetsee.js'></script>
<script type="text/javascript" src='js/leaflet.markercluster.js'></script> <script type="text/javascript" src='js/leaflet.markercluster.js'></script>
<link rel="shortcut icon" href="https://raw.github.com/jlord/hack-spots/master/favico.png"/> <link rel="shortcut icon" href="https://raw.github.com/jlord/hack-spots/master/favico.png"/>
@ -12,9 +12,9 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"/> <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link href='http://api.tiles.mapbox.com/mapbox.js/v1.4.0/mapbox.css' rel='stylesheet' /> <link href='http://api.tiles.mapbox.com/mapbox.js/v1.4.0/mapbox.css' rel='stylesheet' />
<link rel='stylesheet' type='text/css' href='http://fonts.googleapis.com/css?family=Lato:300,400,700,300italic'> <link rel='stylesheet' type='text/css' href='http://fonts.googleapis.com/css?family=Lato:300,400,700,300italic'>
<link rel='stylesheet' type='text/css' href='http://fonts.googleapis.com/css?family=Amatic+SC:400,700'> <link rel='stylesheet' type='text/css' href='http://fonts.googleapis.com/css?family=Amatic+SC:400,700'>
<link media="screen" rel="stylesheet" type="text/css" href="css/style.css"> <link media="screen" rel="stylesheet" type="text/css" href="css/style.css">
<link media="screen" rel="stylesheet" type="text/css" href="css/site.css"> <link media="screen" rel="stylesheet" type="text/css" href="css/site.css">
<link rel="stylesheet" href="css/MarkerCluster.css" /> <link rel="stylesheet" href="css/MarkerCluster.css" />
<link rel="stylesheet" href="css/MarkerCluster.Default.css" /> <link rel="stylesheet" href="css/MarkerCluster.Default.css" />
</head> </head>
@ -46,7 +46,7 @@
<div id="info" class="container"> <div id="info" class="container">
<h3>Contribute!</h3> <h3>Contribute!</h3>
<div id="theNumberofSpots"></div> <div id="theNumberofSpots"></div>
<p>This website is hooked up to <a href="https://docs.google.com/spreadsheet/ccc?key=0Ao5u1U6KYND7dFVkcnJRNUtHWUNKamxoRGg4ZzNiT3c#gid=0" target="_blank">this Google Spreadsheet</a>, which I've shared, so click and add your favorite hack spots to the bottom of the list! For the map you'll need to <strong>get the lat and long</strong> of the spot, you can get that <a href="http://www.latlong.net/" target="_blank">here</a>. The locating of these places is helpful, so please try to fill out all the columns.</p> <p>This website is hooked up to <a href="https://docs.google.com/spreadsheet/ccc?key=0Ao5u1U6KYND7dFVkcnJRNUtHWUNKamxoRGg4ZzNiT3c#gid=0" target="_blank">this Google Spreadsheet</a>, which I've shared, so click and add your favorite hack spots to the bottom of the list! For the map you'll need to <strong>get the lat and long</strong> of the spot, you can get that <a href="http://www.latlong.net/" target="_blank">here</a>. The locating of these places is helpful, so please try to fill out all the columns.</p>
<h3>Info</h3> <h3>Info</h3>
<p>When I'm visiting a new city I'd like to know which coffee shops have the best vibes, great coffee and are good for hunkering down and having a good hack. Yelp will tell you where the Starbucks is and Foursquare will tell you where your friend's have <em>been</em> - but did they like it and was it a grab in go place or a hack place? Plus, what about the people I don't follow on Foursquare or who can't check-in when in other countries?</p> <p>When I'm visiting a new city I'd like to know which coffee shops have the best vibes, great coffee and are good for hunkering down and having a good hack. Yelp will tell you where the Starbucks is and Foursquare will tell you where your friend's have <em>been</em> - but did they like it and was it a grab in go place or a hack place? Plus, what about the people I don't follow on Foursquare or who can't check-in when in other countries?</p>
@ -124,13 +124,13 @@
var gData var gData
// var URL = "10z-2P8l88hLF35EodIjigs5cyCD7BtmfZS631JMtIUU" // test new spreadsheets // var URL = "10z-2P8l88hLF35EodIjigs5cyCD7BtmfZS631JMtIUU" // test new spreadsheets
var URL = "0Ao5u1U6KYND7dFVkcnJRNUtHWUNKamxoRGg4ZzNiT3c" var URL = "0Ao5u1U6KYND7dFVkcnJRNUtHWUNKamxoRGg4ZzNiT3c"
Tabletop.init( { key: URL, callback: showInfo, simpleSheet: true } ) Tabletop.init( { key: URL, callback: showInfo, simpleSheet: true } )
}) })
// so long, so messy // so long, so messy
function showInfo(data) { function showInfo(gData) {
gData = data gData
// make the table, and the search bar // make the table, and the search bar
Sheetsee.makeTable(gData, "#hackSpotsTable") Sheetsee.makeTable(gData, "#hackSpotsTable")
Sheetsee.initiateTableFilter(gData, "#tableFilter", "#hackSpotsTable") Sheetsee.initiateTableFilter(gData, "#tableFilter", "#hackSpotsTable")
@ -162,7 +162,7 @@
var startWithLatestRow = data.reverse() var startWithLatestRow = data.reverse()
startWithLatestRow.forEach(function(row){ startWithLatestRow.forEach(function(row){
if (!row.lat || !row.long || !row.name || !row.address || !row.city || !row.state ) return if (!row.lat || !row.long || !row.name || !row.address || !row.city || !row.state ) return
else latestCompleteSpot.push(row) else latestCompleteSpot.push(row)
}) })
return latestCompleteSpot[0] return latestCompleteSpot[0]
} }
@ -187,6 +187,7 @@
var geoJSONnoHL = Sheetsee.createGeoJSON(gData, optionsJSON) var geoJSONnoHL = Sheetsee.createGeoJSON(gData, optionsJSON)
// change the color of the most recently added spot's marker // change the color of the most recently added spot's marker
var geoJSON = highlightLastMarker(geoJSONnoHL, "#FF4646") var geoJSON = highlightLastMarker(geoJSONnoHL, "#FF4646")
// create map, tilelayer (map background), markers and popups // create map, tilelayer (map background), markers and popups
var map = Sheetsee.loadMap("map") var map = Sheetsee.loadMap("map")
Sheetsee.addTileLayer(map, 'examples.map-20v6611k') Sheetsee.addTileLayer(map, 'examples.map-20v6611k')
@ -201,7 +202,7 @@
marker.bindPopup(popupContent, {closeButton: false,}) marker.bindPopup(popupContent, {closeButton: false,})
}) })
markerLayer.on('click', function(e) { markerLayer.on('click', function(e) {
// clear any selected rows // clear any selected rows
$('.spotRow').removeClass("selectedRow") $('.spotRow').removeClass("selectedRow")
// get row number of selected marker // get row number of selected marker
var rowNumber = e.layer.feature.opts.rowNumber.toString() var rowNumber = e.layer.feature.opts.rowNumber.toString()
@ -217,7 +218,7 @@
// take those details and re-write the selected spot section // take those details and re-write the selected spot section
var selectedSpot = ich.selectedSpot({ var selectedSpot = ich.selectedSpot({
rows: dataElement rows: dataElement
}) })
$('#latestSpot').css("display", "none") $('#latestSpot').css("display", "none")
$('#selectedSpot').html(selectedSpot).css("display", "inline") $('#selectedSpot').html(selectedSpot).css("display", "inline")
}) })

50
js/tabletop.js → js/tabletop1.3.4.js
View File

@ -22,7 +22,7 @@
} catch (e) { } } catch (e) { }
// Create a simple indexOf function for support // Create a simple indexOf function for support
// of older browsers. Uses native indexOf if // of older browsers. Uses native indexOf if
// available. Code similar to underscores. // available. Code similar to underscores.
// By making a separate function, instead of adding // By making a separate function, instead of adding
// to the prototype, we will not break bad for loops // to the prototype, we will not break bad for loops
@ -30,12 +30,12 @@
var indexOfProto = Array.prototype.indexOf; var indexOfProto = Array.prototype.indexOf;
var ttIndexOf = function(array, item) { var ttIndexOf = function(array, item) {
var i = 0, l = array.length; var i = 0, l = array.length;
if (indexOfProto && array.indexOf === indexOfProto) return array.indexOf(item); if (indexOfProto && array.indexOf === indexOfProto) return array.indexOf(item);
for (; i < l; i++) if (array[i] === item) return i; for (; i < l; i++) if (array[i] === item) return i;
return -1; return -1;
}; };
/* /*
Initialize with Tabletop.init( { key: '0AjAPaAU9MeLFdHUxTlJiVVRYNGRJQnRmSnQwTlpoUXc' } ) Initialize with Tabletop.init( { key: '0AjAPaAU9MeLFdHUxTlJiVVRYNGRJQnRmSnQwTlpoUXc' } )
OR! OR!
@ -49,7 +49,7 @@
if(!this || !(this instanceof Tabletop)) { if(!this || !(this instanceof Tabletop)) {
return new Tabletop(options); return new Tabletop(options);
} }
if(typeof(options) === 'string') { if(typeof(options) === 'string') {
options = { key : options }; options = { key : options };
} }
@ -69,7 +69,7 @@
this.singleton = !!options.singleton; this.singleton = !!options.singleton;
this.simple_url = !!options.simple_url; this.simple_url = !!options.simple_url;
this.callbackContext = options.callbackContext; this.callbackContext = options.callbackContext;
if(typeof(options.proxy) !== 'undefined') { if(typeof(options.proxy) !== 'undefined') {
// Remove trailing slash, it will break the app // Remove trailing slash, it will break the app
this.endpoint = options.proxy.replace(/\/$/,''); this.endpoint = options.proxy.replace(/\/$/,'');
@ -79,16 +79,16 @@
// fetching straight from Google // fetching straight from Google
supportsCORS = false supportsCORS = false
} }
this.parameterize = options.parameterize || false; this.parameterize = options.parameterize || false;
if(this.singleton) { if(this.singleton) {
if(typeof(Tabletop.singleton) !== 'undefined') { if(typeof(Tabletop.singleton) !== 'undefined') {
this.log("WARNING! Tabletop singleton already defined"); this.log("WARNING! Tabletop singleton already defined");
} }
Tabletop.singleton = this; Tabletop.singleton = this;
} }
/* Be friendly about what you accept */ /* Be friendly about what you accept */
if(/key=/.test(this.key)) { if(/key=/.test(this.key)) {
this.log("You passed an old Google Docs url as the key! Attempting to parse."); this.log("You passed an old Google Docs url as the key! Attempting to parse.");
@ -117,7 +117,7 @@
} else { } else {
this.base_json_path += 'json-in-script'; this.base_json_path += 'json-in-script';
} }
if(!this.wait) { if(!this.wait) {
this.fetch(); this.fetch();
} }
@ -143,10 +143,10 @@
} }
this.requestData(this.base_json_path, this.loadSheets); this.requestData(this.base_json_path, this.loadSheets);
}, },
/* /*
This will call the environment appropriate request method. This will call the environment appropriate request method.
In browser it will use JSON-P, in node it will use request() In browser it will use JSON-P, in node it will use request()
*/ */
requestData: function(path, callback) { requestData: function(path, callback) {
@ -182,7 +182,7 @@
}; };
xhr.send(); xhr.send();
}, },
/* /*
Insert the URL into the page as a script tag. Once it's loaded the spreadsheet data Insert the URL into the page as a script tag. Once it's loaded the spreadsheet data
it triggers the callback. This helps you avoid cross-domain errors it triggers the callback. This helps you avoid cross-domain errors
@ -193,7 +193,7 @@
injectScript: function(path, callback) { injectScript: function(path, callback) {
var script = document.createElement('script'); var script = document.createElement('script');
var callbackName; var callbackName;
if(this.singleton) { if(this.singleton) {
if(callback === this.loadSheets) { if(callback === this.loadSheets) {
callbackName = 'Tabletop.singleton.loadSheets'; callbackName = 'Tabletop.singleton.loadSheets';
@ -213,9 +213,9 @@
}; };
callbackName = 'Tabletop.callbacks.' + callbackName; callbackName = 'Tabletop.callbacks.' + callbackName;
} }
var url = path + "&callback=" + callbackName; var url = path + "&callback=" + callbackName;
if(this.simple_url) { if(this.simple_url) {
// We've gone down a rabbit hole of passing injectScript the path, so let's // We've gone down a rabbit hole of passing injectScript the path, so let's
// just pull the sheet_id out of the path like the least efficient worker bees // just pull the sheet_id out of the path like the least efficient worker bees
@ -227,15 +227,15 @@
} else { } else {
script.src = this.endpoint + url; script.src = this.endpoint + url;
} }
if (this.parameterize) { if (this.parameterize) {
script.src = this.parameterize + encodeURIComponent(script.src); script.src = this.parameterize + encodeURIComponent(script.src);
} }
document.getElementsByTagName('script')[0].parentNode.appendChild(script); document.getElementsByTagName('script')[0].parentNode.appendChild(script);
}, },
/* /*
This will only run if tabletop is being run in node.js This will only run if tabletop is being run in node.js
*/ */
serverSideFetch: function(path, callback) { serverSideFetch: function(path, callback) {
@ -248,7 +248,7 @@
}); });
}, },
/* /*
Is this a sheet you want to pull? Is this a sheet you want to pull?
If { wanted: ["Sheet1"] } has been specified, only Sheet1 is imported If { wanted: ["Sheet1"] } has been specified, only Sheet1 is imported
Pulls all sheets if none are specified Pulls all sheets if none are specified
@ -260,7 +260,7 @@
return (ttIndexOf(this.wanted, sheetName) !== -1); return (ttIndexOf(this.wanted, sheetName) !== -1);
} }
}, },
/* /*
What gets send to the callback What gets send to the callback
if simpleSheet === true, then don't return an array of Tabletop.this.models, if simpleSheet === true, then don't return an array of Tabletop.this.models,
@ -290,7 +290,7 @@
this.wanted.push(sheet); this.wanted.push(sheet);
} }
}, },
/* /*
Load all worksheets of the spreadsheet, turning each into a Tabletop Model. Load all worksheets of the spreadsheet, turning each into a Tabletop Model.
Need to use injectScript because the worksheet view that you're working from Need to use injectScript because the worksheet view that you're working from
@ -309,7 +309,7 @@
// Only pull in desired sheets to reduce loading // Only pull in desired sheets to reduce loading
if( this.isWanted(data.feed.entry[i].content.$t) ) { if( this.isWanted(data.feed.entry[i].content.$t) ) {
var linkIdx = data.feed.entry[i].link.length-1; var linkIdx = data.feed.entry[i].link.length-1;
var sheet_id = data.feed.entry[i].link[linkIdx].href.substr( data.feed.entry[i].link[linkIdx].href.length - 3, 3); var sheet_id = data.feed.entry[i].link[linkIdx].href.split('/').pop();
var json_path = "/feeds/list/" + this.key + "/" + sheet_id + "/public/values?alt=" var json_path = "/feeds/list/" + this.key + "/" + sheet_id + "/public/values?alt="
if (inNodeJS || supportsCORS) { if (inNodeJS || supportsCORS) {
json_path += 'json'; json_path += 'json';
@ -359,7 +359,7 @@
Used as a callback for the list-based JSON Used as a callback for the list-based JSON
*/ */
loadSheet: function(data) { loadSheet: function(data) {
var model = new Tabletop.Model( { data: data, var model = new Tabletop.Model( { data: data,
parseNumbers: this.parseNumbers, parseNumbers: this.parseNumbers,
postProcess: this.postProcess, postProcess: this.postProcess,
tabletop: this } ); tabletop: this } );
@ -411,7 +411,7 @@
this.elements = []; this.elements = [];
return; return;
} }
for(var key in options.data.feed.entry[0]){ for(var key in options.data.feed.entry[0]){
if(/^gsx/.test(key)) if(/^gsx/.test(key))
this.column_names.push( key.replace("gsx$","") ); this.column_names.push( key.replace("gsx$","") );