This commit is contained in:
parent
a819dd702c
commit
ffb5fdada4
@ -8,6 +8,5 @@ FROM caddy:2.6.4
|
||||
|
||||
COPY img /usr/share/caddy/img
|
||||
COPY css /usr/share/caddy/css
|
||||
COPY js /usr/share/caddy/js
|
||||
COPY stores.json robots.txt /usr/share/caddy/
|
||||
COPY --from=builder /src/index.html /usr/share/caddy/index.html
|
||||
|
||||
@ -62,6 +62,9 @@ ol {
|
||||
.clearfix {
|
||||
clear: both;
|
||||
}
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#map {
|
||||
height: 500px;
|
||||
|
||||
93
index.html
93
index.html
@ -26,8 +26,6 @@
|
||||
/>
|
||||
<link rel="icon" type="image/png" href="/img/favicon.png" />
|
||||
<link rel="apple-touch-icon" href="/img/social.jpg" />
|
||||
<script type="text/javascript" src="/js/jquery.3.6.0.js"></script>
|
||||
<script type="text/javascript" src="/js/jquery.scrollTo.2.1.3.js"></script>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<script src="https://api.mapbox.com/mapbox-gl-js/v2.7.0/mapbox-gl.js"></script>
|
||||
<link
|
||||
@ -42,7 +40,7 @@
|
||||
media="screen"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
href="/css/site.css?1678229090807?1678229616129?1678229646573?1678229670306?1678229728212?1678229754175?1678229784956"
|
||||
href="/css/site.css?1678229090807?1678229616129?1678229646573?1678229670306?1678229728212?1678229754175?1678229784956?1678233805437"
|
||||
/>
|
||||
<meta
|
||||
property="title"
|
||||
@ -81,7 +79,11 @@
|
||||
<h1>NYC Bookstores</h1>
|
||||
<div>
|
||||
<ul class="nav">
|
||||
<li><h2>The Many Independent Bookstores of New York City</h2></li>
|
||||
<li>
|
||||
<h2 id="subhed">
|
||||
The Many Independent Bookstores of New York City
|
||||
</h2>
|
||||
</li>
|
||||
<li><a id="viewInfo">intro</a></li>
|
||||
<li>
|
||||
<a
|
||||
@ -699,21 +701,50 @@
|
||||
${description ? `<p class="description">${description}</p>` : ""}`;
|
||||
}
|
||||
|
||||
function hideElementById(id) {
|
||||
const element = document.getElementById(id);
|
||||
if (element !== undefined) {
|
||||
element.classList.add("hidden");
|
||||
}
|
||||
}
|
||||
|
||||
function showElementById(id) {
|
||||
const element = document.getElementById(id);
|
||||
if (element !== undefined) {
|
||||
element.classList.remove("hidden");
|
||||
}
|
||||
}
|
||||
|
||||
function setContent(id, html) {
|
||||
const element = document.getElementById(id);
|
||||
if (element !== undefined) {
|
||||
element.innerHTML = html;
|
||||
}
|
||||
}
|
||||
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
$.getJSON("./stores.json", function (data) {
|
||||
data.sort(function (a, b) {
|
||||
var aname = a.name.toLowerCase();
|
||||
var bname = b.name.toLowerCase();
|
||||
return aname === bname ? 0 : +(aname > bname) || -1;
|
||||
fetch("./stores.json")
|
||||
.then((resp) => {
|
||||
return resp.json();
|
||||
})
|
||||
.then((data) => {
|
||||
data.sort(function (a, b) {
|
||||
var aname = a.name.toLowerCase();
|
||||
var bname = b.name.toLowerCase();
|
||||
return aname === bname ? 0 : +(aname > bname) || -1;
|
||||
});
|
||||
data.forEach((value, key) => {
|
||||
value.rowNumber = key;
|
||||
value.slug = slugify(value.name);
|
||||
});
|
||||
setContent("storeCount", data.length);
|
||||
window.data = data;
|
||||
loadMap(data);
|
||||
})
|
||||
.catch((err) => {
|
||||
// we'll live with the static cache!
|
||||
console.log(err);
|
||||
});
|
||||
$.each(data, function (key, value) {
|
||||
value.rowNumber = key;
|
||||
value.slug = slugify(value.name);
|
||||
});
|
||||
$("#storeCount").html(data.length);
|
||||
window.data = data;
|
||||
loadMap(data);
|
||||
});
|
||||
});
|
||||
|
||||
window.addEventListener(
|
||||
@ -750,7 +781,7 @@
|
||||
|
||||
function getStoreBySlug(slug) {
|
||||
var ret = false;
|
||||
$.each(window.data, function (key, value) {
|
||||
window.data.forEach((value, key) => {
|
||||
if (value.slug === slug) {
|
||||
ret = value;
|
||||
return false;
|
||||
@ -783,18 +814,18 @@
|
||||
|
||||
popup.setLngLat([store.long, store.lat]).setHTML(store.name).addTo(map);
|
||||
|
||||
$("#info").hide();
|
||||
$("#selected").html(SelectedStoreTemplate(store));
|
||||
$("#selected").show();
|
||||
hideElementById("info");
|
||||
setContent("selected", SelectedStoreTemplate(store));
|
||||
showElementById("selected");
|
||||
if (pushState) {
|
||||
updateHash(store.slug);
|
||||
}
|
||||
}
|
||||
|
||||
function showInfo(pushState = true) {
|
||||
$("#selected").hide();
|
||||
hideElementById("selected");
|
||||
popup.remove();
|
||||
$("#info").show();
|
||||
showElementById("info");
|
||||
if (pushState) {
|
||||
updateHash("info");
|
||||
}
|
||||
@ -804,7 +835,7 @@
|
||||
var geolocate = new mapboxgl.GeolocateControl();
|
||||
|
||||
var points = [];
|
||||
$.each(data, function (key, value) {
|
||||
data.forEach((value, key) => {
|
||||
points.push({
|
||||
type: "Feature",
|
||||
geometry: {
|
||||
@ -874,13 +905,17 @@
|
||||
.addTo(map);
|
||||
});
|
||||
|
||||
$("#Stores").html(TableViewTemplate(data));
|
||||
$("#Stores tbody tr").on("click", function () {
|
||||
updateSelectedStore(data[$(this)[0].id], true);
|
||||
$(window).scrollTo($("#selected"), 250, { offset: { top: -15 } });
|
||||
setContent("Stores", TableViewTemplate(data));
|
||||
document.querySelectorAll("#Stores tbody tr").forEach((element) => {
|
||||
element.addEventListener("click", () => {
|
||||
updateSelectedStore(data[element.id], true);
|
||||
document
|
||||
.getElementById("subhed")
|
||||
.scrollIntoView({ behavior: "smooth" });
|
||||
});
|
||||
});
|
||||
|
||||
$("#viewInfo").on("click", showInfo);
|
||||
document.getElementById("viewInfo").addEventListener("click", showInfo);
|
||||
}
|
||||
</script>
|
||||
<script>
|
||||
|
||||
File diff suppressed because one or more lines are too long
@ -1,7 +0,0 @@
|
||||
/**
|
||||
* Copyright (c) 2007 Ariel Flesler - aflesler ○ gmail • com | https://github.com/flesler
|
||||
* Licensed under MIT
|
||||
* @author Ariel Flesler
|
||||
* @version 2.1.3
|
||||
*/
|
||||
;(function(factory){'use strict';if(typeof define==='function'&&define.amd){define(['jquery'],factory)}else if(typeof module!=='undefined'&&module.exports){module.exports=factory(require('jquery'))}else{factory(jQuery)}})(function($){'use strict';var $scrollTo=$.scrollTo=function(target,duration,settings){return $(window).scrollTo(target,duration,settings)};$scrollTo.defaults={axis:'xy',duration:0,limit:true};function isWin(elem){return!elem.nodeName||$.inArray(elem.nodeName.toLowerCase(),['iframe','#document','html','body'])!==-1}function isFunction(obj){return typeof obj==='function'}$.fn.scrollTo=function(target,duration,settings){if(typeof duration==='object'){settings=duration;duration=0}if(typeof settings==='function'){settings={onAfter:settings}}if(target==='max'){target=9e9}settings=$.extend({},$scrollTo.defaults,settings);duration=duration||settings.duration;var queue=settings.queue&&settings.axis.length>1;if(queue){duration/=2}settings.offset=both(settings.offset);settings.over=both(settings.over);return this.each(function(){if(target===null){return}var win=isWin(this),elem=win?this.contentWindow||window:this,$elem=$(elem),targ=target,attr={},toff;switch(typeof targ){case 'number':case 'string':if(/^([+-]=?)?\d+(\.\d+)?(px|%)?$/.test(targ)){targ=both(targ);break}targ=win?$(targ):$(targ,elem);case 'object':if(targ.length===0){return}if(targ.is||targ.style){toff=(targ=$(targ)).offset()}}var offset=isFunction(settings.offset)&&settings.offset(elem,targ)||settings.offset;$.each(settings.axis.split(''),function(i,axis){var Pos=axis==='x'?'Left':'Top',pos=Pos.toLowerCase(),key='scroll'+Pos,prev=$elem[key](),max=$scrollTo.max(elem,axis);if(toff){attr[key]=toff[pos]+(win?0:prev-$elem.offset()[pos]);if(settings.margin){attr[key]-=parseInt(targ.css('margin'+Pos),10)||0;attr[key]-=parseInt(targ.css('border'+Pos+'Width'),10)||0}attr[key]+=offset[pos]||0;if(settings.over[pos]){attr[key]+=targ[axis==='x'?'width':'height']()*settings.over[pos]}}else{var val=targ[pos];attr[key]=val.slice&&val.slice(-1)==='%'?parseFloat(val)/100*max:val}if(settings.limit&&/^\d+$/.test(attr[key])){attr[key]=attr[key]<=0?0:Math.min(attr[key],max)}if(!i&&settings.axis.length>1){if(prev===attr[key]){attr={}}else if(queue){animate(settings.onAfterFirst);attr={}}}});animate(settings.onAfter);function animate(callback){var opts=$.extend({},settings,{queue:true,duration:duration,complete:callback&&function(){callback.call(elem,targ,settings)}});$elem.animate(attr,opts)}})};$scrollTo.max=function(elem,axis){var Dim=axis==='x'?'Width':'Height',scroll='scroll'+Dim;if(!isWin(elem)){return elem[scroll]-$(elem)[Dim.toLowerCase()]()}var size='client'+Dim,doc=elem.ownerDocument||elem.document,html=doc.documentElement,body=doc.body;return Math.max(html[scroll],body[scroll])-Math.min(html[size],body[size])};function both(val){return isFunction(val)||$.isPlainObject(val)?val:{top:val,left:val}}$.Tween.propHooks.scrollLeft=$.Tween.propHooks.scrollTop={get:function(t){return $(t.elem)[t.prop]()},set:function(t){var curr=this.get(t);if(t.options.interrupt&&t._last&&t._last!==curr){return $(t.elem).stop()}var next=Math.round(t.now);if(curr!==next){$(t.elem)[t.prop](next);t._last=this.get(t)}}};return $scrollTo});
|
||||
Loading…
Reference in New Issue
Block a user