diff --git a/index.html b/index.html index 6d6347c..1e1aa00 100644 --- a/index.html +++ b/index.html @@ -1,19 +1,18 @@ Hack Spots - + - - - - + + +
@@ -104,39 +103,121 @@ + - + \ No newline at end of file diff --git a/js/site.js b/js/site.js index f03791f..e69de29 100644 --- a/js/site.js +++ b/js/site.js @@ -1,81 +0,0 @@ - -// this is so super messy right now, sorry! - - $('.spotRow').live("click", function(event) { - $('.spotRow').removeClass("selectedRow") - console.log("clicked!") - // get the row number from the table's class and select it - var rowNumber = $(this).closest("tr").attr("id") - $('#' + rowNumber).addClass("selectedRow") - // filter out that rownumber from the data - var dataElement = Sheetsee.getMatches(gData, rowNumber, "rowNumber") - // use icanhas to make spot detail div - var selectedSpot = ich.selectedSpot({ rows: dataElement }) - // swap out latest spot for selected spot with its new content - $('#latestSpot').css("display", "none") - $('#selectedSpot').html(selectedSpot).css("display", "inline") - // grab the lat/long associated with that rownumber to - // redraw the map - var selectedCoords = [dataElement[0].lat, dataElement[0].long] - // change the marker color for this element in the geoJSON - matchGeoJSONbyRowNumber(rowNumber, geoJSON, gData, "#FF4646") - // add the new marker layer, popups and reset view to zoon in more - var markerLayer = Sheetsee.addMarkerLayer(geoJSON, map, 13) - addPopups(map, markerLayer) - map.setView(selectedCoords, 13) - }) - - // the most recently added spot should show by default - // and have a matching red marker - function highlightLastMarker(geoJSON, highlightColor) { - geoJSON[0].properties["marker-color"] = highlightColor - return geoJSON - } - - function addPopups(map, markerLayer) { - markerLayer.on('click', function(e) { - // e.layer.feature["marker-color"] = "#ff00ff" - // map.marker(geoJSON, map, 11).addTo(map) - $('.spotRow').removeClass("selectedRow") - var rowNumber = e.layer.feature.opts.rowNumber.toString() - $('#' + rowNumber).addClass("selectedRow") - matchGeoJSONbyRowNumber(rowNumber, geoJSON, gData, "#FF4646") - console.log(geoJSON) - var markerLayer = Sheetsee.addMarkerLayer(geoJSON, map, 11) - addPopups(map, markerLayer) - var dataElement = Sheetsee.getMatches(gData, rowNumber, "rowNumber") - console.log("rowNumber", rowNumber, "dataElement", dataElement) - var selectedSpot = ich.selectedSpot({ - rows: dataElement - }) - $('#latestSpot').css("display", "none") - $('#selectedSpot').html(selectedSpot).css("display", "inline") - var feature = e.layer.feature - var popupContent = '

' + feature.opts.name + '

' - e.layer.bindPopup(popupContent,{closeButton: false,}) - }) - } - - $('.resetMap').click(function() { - $('.spotRow').removeClass("selectedRow") - Sheetsee.addMarkerLayer(geoJSON, map, 11) - $('#latestSpot').css("display", "inline") - $('#selectedSpot').css("display", "none") - }) - - function matchGeoJSONbyRowNumber(rowNumber, geoJSON, gdata, highlightColor) { - geoJSON.forEach(function (d) { - if (d.properties["marker-color"] === highlightColor) { - var origColor = gData[0].hexcolor - d.properties["marker-color"] = origColor - } - - for (var key in d.opts) { - var value = d.opts[key].toString().toLowerCase() - if (key === 'rowNumber' && value.match(rowNumber.toString().toLowerCase())) { - d.properties["marker-color"] = highlightColor - return geoJSON - } - } - }) - }