diff options
Diffstat (limited to 'client')
| -rw-r--r-- | client/index.js | 6 | ||||
| -rw-r--r-- | client/map/index.js | 51 | ||||
| -rw-r--r-- | client/splash/index.js | 14 | ||||
| -rw-r--r-- | client/tables.js | 2 | ||||
| -rw-r--r-- | client/util/index.js | 4 |
5 files changed, 56 insertions, 21 deletions
diff --git a/client/index.js b/client/index.js index c9335f14..37906f30 100644 --- a/client/index.js +++ b/client/index.js @@ -110,9 +110,9 @@ function runApplets() { function main() { const paras = document.querySelectorAll('section p') - if (paras.length) { - paras[0].classList.add('first_paragraph') - } + // if (paras.length) { + // paras[0].classList.add('first_paragraph') + // } toArray(document.querySelectorAll('header .links a')).forEach(tag => { if (window.location.href.match(tag.href)) { tag.classList.add('active') diff --git a/client/map/index.js b/client/map/index.js index 2a6686be..56a5abed 100644 --- a/client/map/index.js +++ b/client/map/index.js @@ -2,25 +2,25 @@ import L from 'leaflet' import './leaflet.bezier' const arcStyles = { - 'edu': { + edu: { color: 'rgb(245, 246, 150)', fillColor: 'rgb(245, 246, 150)', opacity: 0.5, weight: '1', }, - 'company': { + company: { color: 'rgb(50, 100, 246)', fillColor: 'rgb(50, 100, 246)', opacity: 1.0, weight: '2', }, - 'gov': { + gov: { color: 'rgb(245, 150, 100)', fillColor: 'rgb(245, 150, 150)', opacity: 1.0, weight: '2', }, - 'mil': { + mil: { color: 'rgb(245, 0, 0)', fillColor: 'rgb(245, 0, 0)', opacity: 1.0, @@ -78,17 +78,44 @@ export default function append(el, payload) { source = [address.lat, address.lng].map(n => parseFloat(n)) } - citations.sort((a,b) => sortOrder.indexOf(a) - sortOrder.indexOf(b)) - .forEach(citation => { - const address = citation.addresses[0] - const latlng = [address.lat, address.lng].map(n => parseFloat(n)) - if (Number.isNaN(latlng[0]) || Number.isNaN(latlng[1])) return - addMarker(map, latlng, citation.title, address.name) - addArc(map, source, latlng, arcStyles[address.type]) - }) + // ....i dont think the sort order does anything?? + citations.sort((a, b) => sortOrder.indexOf(a) - sortOrder.indexOf(b)) + .forEach(citation => { + const citationAddress = citation.addresses[0] + const latlng = [citationAddress.lat, citationAddress.lng].map(n => parseFloat(n)) + if (Number.isNaN(latlng[0]) || Number.isNaN(latlng[1])) return + addMarker(map, latlng, citation.title, citationAddress.name) + addArc(map, source, latlng, arcStyles[citationAddress.type]) + }) console.log(paper) const rootMarker = addMarker(map, source, paper.title, paper.address) rootMarker.openPopup() + + // a transparent div to cover the map, so normal scroll events will not be eaten by leaflet + const mapCover = document.createElement("div") + mapCover.classList.add("map_cover") + mapCover.innerHTML = "<div class='cover_message'>Click here to explore the map</div>" + mapCover.querySelector('div').addEventListener('click', () => { + map.scrollWheelZoom.enable() + el.removeChild(mapCover) + }) + function stopPropagation(e) { + e.stopPropagation() + } + mapCover.addEventListener('mousewheel', stopPropagation, true) + mapCover.addEventListener('DOMMouseScroll', stopPropagation, true) + + map.scrollWheelZoom.disable() + map.on('focus', () => { + map.scrollWheelZoom.enable() + el.removeChild(mapCover) + }) + map.on('blur', () => { + map.scrollWheelZoom.disable() + // el.appendChild(mapCover) + }) + + el.appendChild(mapCover) } diff --git a/client/splash/index.js b/client/splash/index.js index e247b7f5..a21110f0 100644 --- a/client/splash/index.js +++ b/client/splash/index.js @@ -31,12 +31,14 @@ function build() { function bind() { document.querySelector('.slogan').addEventListener('click', modal.close) - toArray(document.querySelectorAll('.aboutLink')).forEach(el => { - el.addEventListener('click', modal.toggle) - }) - document.querySelector('.about .inner').addEventListener('click', e => e.stopPropagation()) - document.querySelector('.about').addEventListener('click', modal.close) - document.querySelector('.close').addEventListener('click', modal.close) + if (document.querySelector('.about')) { + toArray(document.querySelectorAll('.aboutLink')).forEach(el => { + el.addEventListener('click', modal.toggle) + }) + document.querySelector('.about .inner').addEventListener('click', e => e.stopPropagation()) + document.querySelector('.about').addEventListener('click', modal.close) + document.querySelector('.close').addEventListener('click', modal.close) + } } function animate() { diff --git a/client/tables.js b/client/tables.js index 70ab5971..3fadb797 100644 --- a/client/tables.js +++ b/client/tables.js @@ -65,11 +65,13 @@ export default function append(el, payload) { .then(r => r.text()) .then(text => { try { + console.log(text) const data = csv.toJSON(text, { headers: { included: true } }) // console.log(data) table.setData(data) el.classList.add('loaded') } catch (e) { + console.error("error making json:", payload.url) console.error(e) // console.log(text) diff --git a/client/util/index.js b/client/util/index.js index d0db0d98..0792e24e 100644 --- a/client/util/index.js +++ b/client/util/index.js @@ -5,12 +5,16 @@ export const isiPad = !!(navigator.userAgent.match(/iPad/i)) export const isAndroid = !!(navigator.userAgent.match(/Android/i)) export const isMobile = isiPhone || isiPad || isAndroid export const isDesktop = !isMobile +export const isFirefox = typeof InstallTrigger !== 'undefined' export const toArray = a => Array.prototype.slice.apply(a) export const choice = a => a[Math.floor(Math.random() * a.length)] const htmlClassList = document.body.parentNode.classList htmlClassList.add(isDesktop ? 'desktop' : 'mobile') +if (isFirefox) { + htmlClassList.add('firefox') +} /* Default image dimensions */ |