Clean up old assets
This commit is contained in:
parent
8cfded9232
commit
bcabf94741
SSH key fingerprint:
SHA256:CTuSlns5U7qlD9jqHvtnVmfYV3Zwl2Z7WnJ4/dqOaL8
45 changed files with 24 additions and 1127 deletions
6
resources/css-2023/app.css
vendored
6
resources/css-2023/app.css
vendored
|
|
@ -1,6 +0,0 @@
|
|||
@import "variables.css";
|
||||
@import "fonts.css";
|
||||
@import "layout.css";
|
||||
@import "colours.css";
|
||||
@import "code.css";
|
||||
@import "content.css";
|
||||
3
resources/css-2023/posse.css
vendored
3
resources/css-2023/posse.css
vendored
|
|
@ -1,3 +0,0 @@
|
|||
.p-bridgy-twitter-content {
|
||||
display: none;
|
||||
}
|
||||
22
resources/css-2023/variables.css
vendored
22
resources/css-2023/variables.css
vendored
|
|
@ -1,22 +0,0 @@
|
|||
:root {
|
||||
/* Font Family */
|
||||
--font-family-headings: "Archer SSm A", "Archer SSm B", serif;
|
||||
--font-family-body: "Verlag A", "Verlag B", sans-serif;
|
||||
--font-family-monospace: "Operator Mono SSm A", "Operator Mono SSm B", monospace;
|
||||
|
||||
/* Font Size */
|
||||
--font-size-sm: 0.75rem; /* 12px */
|
||||
--font-size-base: 1rem; /* 16px, base */
|
||||
--font-size-md: 1.25rem; /* 20px */
|
||||
--font-size-lg: 1.5rem; /* 24px */
|
||||
--font-size-xl: 1.75rem; /* 28px */
|
||||
--font-size-xxl: 2rem; /* 32px */
|
||||
--font-size-xxxl: 2.25rem; /* 36px */
|
||||
|
||||
/* Colours */
|
||||
--color-primary: oklch(36.8% 0.1 125.505);
|
||||
--color-secondary: oklch(96.3% 0.1 125.505);
|
||||
--color-link: oklch(48.09% 0.146 241.41);
|
||||
--color-link-visited: oklch(70.44% 0.21 304.41);
|
||||
--color-primary-shadow: oklch(19.56% 0.054 125.505 / 40%);
|
||||
}
|
||||
10
resources/css/app.css
vendored
10
resources/css/app.css
vendored
|
|
@ -1,6 +1,6 @@
|
|||
@import "variables.css";
|
||||
@import "base.css";
|
||||
@import "layout/main.css";
|
||||
@import "link-style.css";
|
||||
@import "posse.css";
|
||||
@import "user-profiles.css";
|
||||
@import "fonts.css";
|
||||
@import "layout.css";
|
||||
@import "colours.css";
|
||||
@import "code.css";
|
||||
@import "content.css";
|
||||
|
|
|
|||
36
resources/css/base.css
vendored
36
resources/css/base.css
vendored
|
|
@ -1,36 +0,0 @@
|
|||
body {
|
||||
font-family: var(--font-stack-body);
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 2rem;
|
||||
background-color: var(--color-background);
|
||||
color: var(--color-paragraph);
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-family: var(--font-stack-headings);
|
||||
font-style: normal;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
pre,
|
||||
code {
|
||||
font-family: var(--font-stack-monospace);
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--color-highlight);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.h-feed > .note,
|
||||
.h-feed > .h-entry {
|
||||
margin-top: 4rem;
|
||||
}
|
||||
125
resources/css/layout/main.css
vendored
125
resources/css/layout/main.css
vendored
|
|
@ -1,125 +0,0 @@
|
|||
body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 699px) {
|
||||
main {
|
||||
margin-left: 5px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 700px) {
|
||||
main {
|
||||
max-width: 700px;
|
||||
}
|
||||
|
||||
main > .note,
|
||||
main > .h-entry {
|
||||
padding: 0 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
main {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
main img {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
main .h-entry:first-child > .bookmark-link {
|
||||
padding-top: 2rem;
|
||||
}
|
||||
|
||||
.note {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.note-metadata {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.note .client {
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.note .syndication-links svg {
|
||||
height: 1em;
|
||||
width: 1em;
|
||||
}
|
||||
|
||||
.note > .e-content > .naked-link .u-photo {
|
||||
margin: 2rem 0;
|
||||
}
|
||||
|
||||
article header > h1 {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.post-info {
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
.pagination {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
justify-content: space-evenly;
|
||||
max-width: 90vw;
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.personal-bio {
|
||||
padding: 0 2rem;
|
||||
}
|
||||
|
||||
footer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-top: 1.5rem;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 699px) {
|
||||
input {
|
||||
max-width: 95vw;
|
||||
}
|
||||
}
|
||||
|
||||
.iwc-logo {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 699px) {
|
||||
footer {
|
||||
margin-left: 5px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
#top-header {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
#top-header h1 {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
nav {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
nav a {
|
||||
margin: 0 0.5rem;
|
||||
}
|
||||
7
resources/css/link-style.css
vendored
7
resources/css/link-style.css
vendored
|
|
@ -1,7 +0,0 @@
|
|||
.post-info a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.syndication-links .u-syndication {
|
||||
text-decoration: none;
|
||||
}
|
||||
1
resources/css/posse.css
vendored
1
resources/css/posse.css
vendored
|
|
@ -1,4 +1,3 @@
|
|||
.p-bridgy-facebook-content,
|
||||
.p-bridgy-twitter-content {
|
||||
display: none;
|
||||
}
|
||||
|
|
|
|||
3
resources/css/user-profiles.css
vendored
3
resources/css/user-profiles.css
vendored
|
|
@ -1,3 +0,0 @@
|
|||
.hovercard {
|
||||
display: none;
|
||||
}
|
||||
34
resources/css/variables.css
vendored
34
resources/css/variables.css
vendored
|
|
@ -1,20 +1,22 @@
|
|||
:root {
|
||||
/* fonts */
|
||||
--font-stack-body: "Whitney SSm A", "Whitney SSm B", sans-serif;
|
||||
--font-stack-headings: "Quarto A", "Quarto B", serif;
|
||||
--font-stack-monospace: "Operator Mono SSm A", "Operator Mono SSm B", monospace;
|
||||
/* Font Family */
|
||||
--font-family-headings: "Archer SSm A", "Archer SSm B", serif;
|
||||
--font-family-body: "Verlag A", "Verlag B", sans-serif;
|
||||
--font-family-monospace: "Operator Mono SSm A", "Operator Mono SSm B", monospace;
|
||||
|
||||
/* colours */
|
||||
--color-background: #004643;
|
||||
--color-headline: #fffffe;
|
||||
--color-paragraph: #abd1c6;
|
||||
--color-button: #f9bc60;
|
||||
--color-button-text: #001e1d;
|
||||
/* Font Size */
|
||||
--font-size-sm: 0.75rem; /* 12px */
|
||||
--font-size-base: 1rem; /* 16px, base */
|
||||
--font-size-md: 1.25rem; /* 20px */
|
||||
--font-size-lg: 1.5rem; /* 24px */
|
||||
--font-size-xl: 1.75rem; /* 28px */
|
||||
--font-size-xxl: 2rem; /* 32px */
|
||||
--font-size-xxxl: 2.25rem; /* 36px */
|
||||
|
||||
/* colours - illustrations */
|
||||
--color-stroke: #001e1d;
|
||||
--color-main: #e8e4e6;
|
||||
--color-highlight: #f9bc60;
|
||||
--color-secondary: #abd1c6;
|
||||
--color-tertiary: #e16162;
|
||||
/* Colours */
|
||||
--color-primary: oklch(36.8% 0.1 125.505);
|
||||
--color-secondary: oklch(96.3% 0.1 125.505);
|
||||
--color-link: oklch(48.09% 0.146 241.41);
|
||||
--color-link-visited: oklch(70.44% 0.21 304.41);
|
||||
--color-primary-shadow: oklch(19.56% 0.054 125.505 / 40%);
|
||||
}
|
||||
|
|
|
|||
29
resources/es6-orig/colours.js
vendored
29
resources/es6-orig/colours.js
vendored
|
|
@ -1,29 +0,0 @@
|
|||
//colours.js
|
||||
|
||||
let link = document.querySelector('#colourScheme');
|
||||
|
||||
let css = link.getAttribute('href').split('/').pop();
|
||||
|
||||
// update selected item in colour scheme list
|
||||
document.querySelector('#colourSchemeSelect [value="' + css + '"]').selected = true;
|
||||
|
||||
// fix form
|
||||
let form = document.getElementById('colourSchemeForm');
|
||||
let btn = form.querySelector('button');
|
||||
btn.addEventListener('click', function (event) {
|
||||
event.preventDefault();
|
||||
let newCss = document.getElementById('colourSchemeSelect').value;
|
||||
let css = link.getAttribute('href');
|
||||
let parts = css.split('/');
|
||||
parts.pop();
|
||||
parts.push(newCss);
|
||||
link.setAttribute('href', parts.join('/'));
|
||||
let formData = new FormData(form);
|
||||
fetch('/update-colour-scheme', {
|
||||
method: 'POST',
|
||||
credentials: 'same-origin',
|
||||
body: formData
|
||||
}).catch(function (error) {
|
||||
console.warn(error);
|
||||
});
|
||||
});
|
||||
7
resources/es6-orig/edit-place-icon.js
vendored
7
resources/es6-orig/edit-place-icon.js
vendored
|
|
@ -1,7 +0,0 @@
|
|||
//edit-place-icon.js
|
||||
|
||||
export default function getIcon() {
|
||||
let iconOption = document.querySelector('#icon');
|
||||
|
||||
return iconOption.value;
|
||||
}
|
||||
31
resources/es6-orig/links.js
vendored
31
resources/es6-orig/links.js
vendored
|
|
@ -1,31 +0,0 @@
|
|||
//links.js
|
||||
|
||||
let youtubeRegex = /watch\?v=([A-Za-z0-9\-_]+)\b/;
|
||||
let spotifyRegex = /https:\/\/play\.spotify\.com\/(.*)\b/;
|
||||
|
||||
let notes = document.querySelectorAll('.e-content');
|
||||
|
||||
for (let note of notes) {
|
||||
let ytid = note.textContent.match(youtubeRegex);
|
||||
if (ytid) {
|
||||
let ytcontainer = document.createElement('div');
|
||||
ytcontainer.classList.add('container');
|
||||
let ytiframe = document.createElement('iframe');
|
||||
ytiframe.classList.add('youtube');
|
||||
ytiframe.setAttribute('src', 'https://www.youtube.com/embed/' + ytid[1]);
|
||||
ytiframe.setAttribute('frameborder', 0);
|
||||
ytiframe.setAttribute('allowfullscreen', 'true');
|
||||
ytcontainer.appendChild(ytiframe);
|
||||
note.appendChild(ytcontainer);
|
||||
}
|
||||
let spotifyid = note.textContent.match(spotifyRegex);
|
||||
if (spotifyid) {
|
||||
let sid = spotifyid[1].replace('/', ':');
|
||||
let siframe = document.createElement('iframe');
|
||||
siframe.classList.add('spotify');
|
||||
siframe.setAttribute('src', 'https://embed.spotify.com/?uri=spotify:' + sid);
|
||||
siframe.setAttribute('frameborder', 0);
|
||||
siframe.setAttribute('allowtransparency', 'true');
|
||||
note.appendChild(siframe);
|
||||
}
|
||||
}
|
||||
192
resources/es6-orig/mapbox-utils.js
vendored
192
resources/es6-orig/mapbox-utils.js
vendored
|
|
@ -1,192 +0,0 @@
|
|||
//mapbox-utils.js
|
||||
import parseLocation from './parse-location';
|
||||
import selectPlaceInForm from './select-place';
|
||||
|
||||
/*
|
||||
* For specific lines on this file I have disabled the `no-undef`
|
||||
* rule in ESLint. This is for the mapboxgl object which is defined
|
||||
* in the mapbox-gl.js file that we pull in from their CDN before
|
||||
* this script gets run.
|
||||
*/
|
||||
|
||||
// eslint-disable-next-line no-undef
|
||||
mapboxgl.accessToken = 'pk.eyJ1Ijoiam9ubnliYXJuZXMiLCJhIjoiY2l2cDhjYW04MDAwcjJ0cG1uZnhqcm82ayJ9.qA2zeVA-nsoMh9IFrd5KQw';
|
||||
|
||||
// Define some functions to be used in the default function.
|
||||
const titlecase = (string) => {
|
||||
return string.split('-').map(([first,...rest]) => first.toUpperCase() + rest.join('').toLowerCase()).join(' ');
|
||||
};
|
||||
|
||||
// Get the ID for the map, i.e. get the u-url of the containing note.
|
||||
const getId = (map) => {
|
||||
let href = map._container.parentNode.querySelector('.u-url').getAttribute('href');
|
||||
return href.substr(href.lastIndexOf('/') + 1);
|
||||
};
|
||||
|
||||
const addMapTypeOption = (map, menu, option, checked = false) => {
|
||||
let div = document.createElement('div');
|
||||
let input = document.createElement('input');
|
||||
let id = option + getId(map);
|
||||
input.setAttribute('id', id);
|
||||
input.setAttribute('type', 'radio');
|
||||
input.setAttribute('name', 'map' + getId(map));
|
||||
input.setAttribute('value', option);
|
||||
if (checked == true) {
|
||||
input.setAttribute('checked', 'checked');
|
||||
}
|
||||
input.addEventListener('click', function () {
|
||||
let source = map.getSource('points');
|
||||
map.setStyle('mapbox://styles/mapbox/' + option + '-v9');
|
||||
map.on('style.load', function () {
|
||||
map.addLayer({
|
||||
'id': 'points',
|
||||
'type': 'symbol',
|
||||
'source': {
|
||||
'type': 'geojson',
|
||||
'data': source._data
|
||||
},
|
||||
'layout': {
|
||||
'icon-image': '{icon}-15',
|
||||
'text-field': '{title}',
|
||||
'text-offset': [0, 1]
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
let label = document.createElement('label');
|
||||
label.setAttribute('for', option + getId(map));
|
||||
label.appendChild(document.createTextNode(titlecase(option)));
|
||||
div.appendChild(input);
|
||||
div.appendChild(label);
|
||||
menu.appendChild(div);
|
||||
};
|
||||
|
||||
const makeMapMenu = (map) => {
|
||||
let mapMenu = document.createElement('fieldset');
|
||||
let legend = document.createElement('legend');
|
||||
let title = document.createTextNode('Map Style');
|
||||
legend.appendChild(title);
|
||||
mapMenu.appendChild(legend);
|
||||
mapMenu.classList.add('map-menu');
|
||||
addMapTypeOption(map, mapMenu, 'streets', true);
|
||||
addMapTypeOption(map, mapMenu, 'satellite-streets');
|
||||
return mapMenu;
|
||||
};
|
||||
|
||||
// The main function.
|
||||
export default function addMap(div, position = null, places = null) {
|
||||
let data;
|
||||
let dataLatitude = div.dataset.latitude;
|
||||
let dataLongitude = div.dataset.longitude;
|
||||
let dataName = div.dataset.name;
|
||||
let dataMarker = div.dataset.marker;
|
||||
if (dataMarker == '') {
|
||||
dataMarker = 'circle';
|
||||
}
|
||||
if (dataName == null) {
|
||||
data = {
|
||||
'type': 'FeatureCollection',
|
||||
'features': [{
|
||||
'type': 'Feature',
|
||||
'geometry': {
|
||||
'type': 'Point',
|
||||
'coordinates': [dataLongitude, dataLatitude]
|
||||
},
|
||||
'properties': {
|
||||
'title': 'Current Location',
|
||||
'icon': 'circle-stroked',
|
||||
'uri': 'current-location'
|
||||
}
|
||||
}]
|
||||
};
|
||||
} else {
|
||||
data = {
|
||||
'type': 'FeatureCollection',
|
||||
'features': [{
|
||||
'type': 'Feature',
|
||||
'geometry': {
|
||||
'type': 'Point',
|
||||
'coordinates': [dataLongitude, dataLatitude]
|
||||
},
|
||||
'properties': {
|
||||
'title': dataName,
|
||||
'icon': dataMarker,
|
||||
}
|
||||
}]
|
||||
};
|
||||
}
|
||||
if (places != null) {
|
||||
for (let place of places) {
|
||||
let placeLongitude = parseLocation(place.location).longitude;
|
||||
let placeLatitude = parseLocation(place.location).latitude;
|
||||
data.features.push({
|
||||
'type': 'Feature',
|
||||
'geometry': {
|
||||
'type': 'Point',
|
||||
'coordinates': [placeLongitude, placeLatitude]
|
||||
},
|
||||
'properties': {
|
||||
'title': place.name,
|
||||
'icon': 'circle',
|
||||
'uri': place.slug
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
if (position != null) {
|
||||
dataLongitude = position.coords.longitude;
|
||||
dataLatitude = position.coords.latitude;
|
||||
}
|
||||
// eslint-disable-next-line no-undef
|
||||
let map = new mapboxgl.Map({
|
||||
container: div,
|
||||
style: 'mapbox://styles/mapbox/streets-v9',
|
||||
center: [dataLongitude, dataLatitude],
|
||||
zoom: 15
|
||||
});
|
||||
if (position == null) {
|
||||
map.scrollZoom.disable();
|
||||
}
|
||||
// eslint-disable-next-line no-undef
|
||||
map.addControl(new mapboxgl.NavigationControl());
|
||||
div.appendChild(makeMapMenu(map));
|
||||
map.on('load', function () {
|
||||
map.addLayer({
|
||||
'id': 'points',
|
||||
'type': 'symbol',
|
||||
'source': {
|
||||
'type': 'geojson',
|
||||
'data': data
|
||||
},
|
||||
'layout': {
|
||||
'icon-image': '{icon}-15',
|
||||
'text-field': '{title}',
|
||||
'text-offset': [0, 1]
|
||||
}
|
||||
});
|
||||
});
|
||||
if (position != null) {
|
||||
map.on('click', function (e) {
|
||||
let features = map.queryRenderedFeatures(e.point, {
|
||||
layer: ['points']
|
||||
});
|
||||
// if there are features within the given radius of the click event,
|
||||
// fly to the location of the click event
|
||||
if (features.length) {
|
||||
// Get coordinates from the symbol and center the map on those coordinates
|
||||
map.flyTo({center: features[0].geometry.coordinates});
|
||||
selectPlaceInForm(features[0].properties.uri);
|
||||
}
|
||||
});
|
||||
}
|
||||
if (data.features && data.features.length > 1) {
|
||||
// eslint-disable-next-line no-undef
|
||||
let bounds = new mapboxgl.LngLatBounds();
|
||||
for (let feature of data.features) {
|
||||
bounds.extend(feature.geometry.coordinates);
|
||||
}
|
||||
map.fitBounds(bounds, { padding: 65});
|
||||
}
|
||||
|
||||
return map;
|
||||
}
|
||||
8
resources/es6-orig/maps.js
vendored
8
resources/es6-orig/maps.js
vendored
|
|
@ -1,8 +0,0 @@
|
|||
//maps.js
|
||||
import addMap from './mapbox-utils';
|
||||
|
||||
let mapDivs = document.querySelectorAll('.map');
|
||||
|
||||
for (let div of mapDivs) {
|
||||
addMap(div);
|
||||
}
|
||||
10
resources/es6-orig/parse-location.js
vendored
10
resources/es6-orig/parse-location.js
vendored
|
|
@ -1,10 +0,0 @@
|
|||
//parse-location.js
|
||||
|
||||
//text = `POINT(lon lat)`
|
||||
export default function parseLocation(text) {
|
||||
let coords = /POINT\((.*)\)/.exec(text);
|
||||
let parsedLongitude = coords[1].split(' ')[0];
|
||||
let parsedLatitude = coords[1].split(' ')[1];
|
||||
|
||||
return {'latitude': parsedLatitude, 'longitude': parsedLongitude};
|
||||
}
|
||||
12
resources/es6-orig/piwik.js
vendored
12
resources/es6-orig/piwik.js
vendored
|
|
@ -1,12 +0,0 @@
|
|||
/* global process */
|
||||
|
||||
// Piwik in its own js file to allow usage with a CSP policy
|
||||
var idSite = process.env.PIWIK_ID;
|
||||
var piwikTrackingApiUrl = process.env.PIWIK_URL;
|
||||
|
||||
var _paq = _paq || [];
|
||||
// tracker methods like "setCustomDimension" should be called before "trackPageView"
|
||||
_paq.push(['setTrackerUrl', piwikTrackingApiUrl]);
|
||||
_paq.push(['setSiteId', idSite]);
|
||||
_paq.push(['trackPageView']);
|
||||
_paq.push(['enableLinkTracking']);
|
||||
83
resources/es6-orig/places.js
vendored
83
resources/es6-orig/places.js
vendored
|
|
@ -1,83 +0,0 @@
|
|||
//places.js
|
||||
|
||||
import addMap from './mapbox-utils';
|
||||
import getIcon from './edit-place-icon';
|
||||
|
||||
let div = document.querySelector('.map');
|
||||
let map = addMap(div);
|
||||
let isDragging;
|
||||
let isCursorOverPoint;
|
||||
let canvas = map.getCanvasContainer();
|
||||
|
||||
let selectElem = document.querySelector('select[name="icon"]');
|
||||
selectElem.addEventListener('click', function () {
|
||||
let newIcon = getIcon();
|
||||
let source = map.getSource('points');
|
||||
if (source._data.features[0].properties.icon != newIcon) {
|
||||
source._data.features[0].properties.icon = newIcon;
|
||||
map.getSource('points').setData(source._data);
|
||||
}
|
||||
});
|
||||
|
||||
function updateFormCoords(coords) {
|
||||
let latInput = document.querySelector('#latitude');
|
||||
let lonInput = document.querySelector('#longitude');
|
||||
latInput.value = coords.lat.toPrecision(6);
|
||||
lonInput.value = coords.lng.toPrecision(6);
|
||||
}
|
||||
|
||||
function mouseDown() {
|
||||
if (!isCursorOverPoint) return;
|
||||
|
||||
isDragging = true;
|
||||
|
||||
// Set a cursor indicator
|
||||
canvas.style.cursor = 'grab';
|
||||
|
||||
// Mouse events
|
||||
map.on('mousemove', onMove);
|
||||
map.once('mouseup', onUp);
|
||||
}
|
||||
|
||||
function onMove(e) {
|
||||
if (!isDragging) return;
|
||||
let coords = e.lngLat;
|
||||
let source = map.getSource('points');
|
||||
|
||||
// Set a UI indicator for dragging.
|
||||
canvas.style.cursor = 'grabbing';
|
||||
|
||||
// Update the Point feature in `geojson` coordinates
|
||||
// and call setData to the source layer `point` on it.
|
||||
source._data.features[0].geometry.coordinates = [coords.lng, coords.lat];
|
||||
map.getSource('points').setData(source._data);
|
||||
}
|
||||
|
||||
function onUp(e) {
|
||||
if (!isDragging) return;
|
||||
let coords = e.lngLat;
|
||||
|
||||
// Print the coordinates of where the point had
|
||||
// finished being dragged to on the map.
|
||||
updateFormCoords(coords);
|
||||
canvas.style.cursor = '';
|
||||
isDragging = false;
|
||||
|
||||
// Unbind mouse events
|
||||
map.off('mousemove', onMove);
|
||||
}
|
||||
|
||||
// When the cursor enters a feature in the point layer, prepare for dragging.
|
||||
map.on('mouseenter', 'points', function() {
|
||||
canvas.style.cursor = 'move';
|
||||
isCursorOverPoint = true;
|
||||
map.dragPan.disable();
|
||||
});
|
||||
|
||||
map.on('mouseleave', 'points', function() {
|
||||
canvas.style.cursor = '';
|
||||
isCursorOverPoint = false;
|
||||
map.dragPan.enable();
|
||||
});
|
||||
|
||||
map.on('mousedown', mouseDown);
|
||||
11
resources/es6-orig/select-place.js
vendored
11
resources/es6-orig/select-place.js
vendored
|
|
@ -1,11 +0,0 @@
|
|||
//select-place.js
|
||||
|
||||
export default function selectPlaceInForm(uri) {
|
||||
if (document.querySelector('select')) {
|
||||
if (uri == 'current-location') {
|
||||
document.querySelector('select [id="option-coords"]').selected = true;
|
||||
} else {
|
||||
document.querySelector('select [value="' + uri + '"]').selected = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
68
resources/es6-orig/submit-place.js
vendored
68
resources/es6-orig/submit-place.js
vendored
|
|
@ -1,68 +0,0 @@
|
|||
//submit-place.js
|
||||
|
||||
export default function submitNewPlace(map) {
|
||||
//create the form data to send
|
||||
let formData = new FormData();
|
||||
formData.append('place-name', document.querySelector('#place-name').value);
|
||||
formData.append('place-description', document.querySelector('#place-description').value);
|
||||
formData.append('place-latitude', document.querySelector('#place-latitude').value);
|
||||
formData.append('place-longitude', document.querySelector('#place-longitude').value);
|
||||
//post the new place
|
||||
fetch('/micropub/places', {
|
||||
//send cookies with the request
|
||||
credentials: 'same-origin',
|
||||
method: 'post',
|
||||
body: formData
|
||||
}).then(function (response) {
|
||||
return response.json();
|
||||
}).then(function (placeJson) {
|
||||
if (placeJson.error === true) {
|
||||
throw new Error(placeJson.error_description);
|
||||
}
|
||||
//remove un-needed form elements
|
||||
let form = document.querySelector('fieldset');
|
||||
//iterate through labels and remove parent div elements
|
||||
let labels = document.querySelectorAll('.place-label');
|
||||
for (let label of labels) {
|
||||
form.removeChild(label.parentNode);
|
||||
}
|
||||
form.removeChild(document.querySelector('#place-submit'));
|
||||
let newPlaceButton = document.querySelector('#create-new-place');
|
||||
//in order to remove a DOM Node, you need to run removeChild on the parent Node
|
||||
newPlaceButton.parentNode.removeChild(newPlaceButton);
|
||||
//remove current location from map
|
||||
let source = map.getSource('points');
|
||||
let newFeatures = source._data.features.filter(function (item) {
|
||||
return item.properties.title != 'Current Location';
|
||||
});
|
||||
//add new place to map
|
||||
newFeatures.push({
|
||||
'type': 'Feature',
|
||||
'geometry': {
|
||||
'type': 'Point',
|
||||
'coordinates': [placeJson.longitude, placeJson.latitude]
|
||||
},
|
||||
'properties': {
|
||||
'title': placeJson.name,
|
||||
'icon': 'circle',
|
||||
'uri': placeJson.uri
|
||||
}
|
||||
});
|
||||
let newSource = {
|
||||
'type': 'FeatureCollection',
|
||||
'features': newFeatures
|
||||
};
|
||||
map.getSource('points').setData(newSource);
|
||||
//add new place to select menu
|
||||
let selectElement = document.querySelector('select');
|
||||
let newlyCreatedPlaceOption = document.createElement('option');
|
||||
newlyCreatedPlaceOption.setAttribute('value', placeJson.uri);
|
||||
newlyCreatedPlaceOption.appendChild(document.createTextNode(placeJson.name));
|
||||
newlyCreatedPlaceOption.dataset.latitude = placeJson.latitude;
|
||||
newlyCreatedPlaceOption.dataset.longitude = placeJson.longitude;
|
||||
selectElement.appendChild(newlyCreatedPlaceOption);
|
||||
document.querySelector('select [value="' + placeJson.uri + '"]').selected = true;
|
||||
}).catch(function (placeError) {
|
||||
console.error(placeError);
|
||||
});
|
||||
}
|
||||
2
resources/js/app.js
vendored
2
resources/js/app.js
vendored
|
|
@ -1 +1 @@
|
|||
import '../css-2023/app.css';
|
||||
import '../css/app.css';
|
||||
|
|
|
|||
5
resources/sass-orig/_articles.scss
vendored
5
resources/sass-orig/_articles.scss
vendored
|
|
@ -1,5 +0,0 @@
|
|||
//articles.scss
|
||||
|
||||
article.h-entry {
|
||||
width: $mainWidth;
|
||||
}
|
||||
22
resources/sass-orig/_base.scss
vendored
22
resources/sass-orig/_base.scss
vendored
|
|
@ -1,22 +0,0 @@
|
|||
// _base.scss
|
||||
|
||||
// Fonts
|
||||
html {
|
||||
font-family: montserrat, sans-serif;
|
||||
font-weight: 300;
|
||||
font-style: normal;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-family: bebas-neue, sans-serif;
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
code {
|
||||
font-family: "Operator Mono", monospace;
|
||||
}
|
||||
|
||||
// Variables
|
||||
$mainWidth: 40rem;
|
||||
11
resources/sass-orig/_bio.scss
vendored
11
resources/sass-orig/_bio.scss
vendored
|
|
@ -1,11 +0,0 @@
|
|||
// bio.scss
|
||||
|
||||
.personal-bio {
|
||||
width: $mainWidth;
|
||||
}
|
||||
|
||||
@media screen and (max-width: $mainWidth) {
|
||||
.personal-bio {
|
||||
width: 95vw;
|
||||
}
|
||||
}
|
||||
49
resources/sass-orig/_emoji.scss
vendored
49
resources/sass-orig/_emoji.scss
vendored
|
|
@ -1,49 +0,0 @@
|
|||
//emoji.scss
|
||||
|
||||
//thanks to http://adrianroselli.com/2016/12/accessible-emoji-tweaked.html
|
||||
|
||||
span[role=img][aria-label] {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
span[role=img][aria-label]:focus::after,
|
||||
span[role=img][aria-label]:hover::after {
|
||||
position: absolute;
|
||||
display: block;
|
||||
z-index: 1;
|
||||
bottom: 1.5em;
|
||||
left: 0;
|
||||
padding: 0.5em 0.75em;
|
||||
border: 0.05em solid rgba(255, 255, 255, 1);
|
||||
border-radius: 0.2em;
|
||||
box-shadow: 0.15em 0.15em 0.5em rgba(0, 0, 0, 1);
|
||||
content: attr(aria-label);
|
||||
background-color: rgba(0, 0, 0, 0.85);
|
||||
color: rgba(255, 255, 255, 1);
|
||||
font-size: 80%;
|
||||
animation: TOOLTIP 0.1s ease-out 1;
|
||||
}
|
||||
|
||||
@keyframes TOOLTIP {
|
||||
from {
|
||||
bottom: 0.5em;
|
||||
background-color: rgba(0, 0, 0, 0);
|
||||
border: 0.05em solid rgba(255, 255, 255, 0);
|
||||
color: rgba(255, 255, 255, 0);
|
||||
box-shadow: 0 0 0 rgba(0, 0, 0, 1);
|
||||
}
|
||||
|
||||
to {
|
||||
bottom: 1.5em;
|
||||
background-color: rgba(0, 0, 0, 0.85);
|
||||
border: 0.05em solid rgba(255, 255, 255, 1);
|
||||
color: rgba(255, 255, 255, 1);
|
||||
box-shadow: 0.15em 0.15em 0.5em rgba(0, 0, 0, 1);
|
||||
}
|
||||
}
|
||||
|
||||
@media print {
|
||||
span[role=img][aria-label]::after {
|
||||
content: " (" attr(aria-label) ") ";
|
||||
}
|
||||
}
|
||||
38
resources/sass-orig/_footer.scss
vendored
38
resources/sass-orig/_footer.scss
vendored
|
|
@ -1,38 +0,0 @@
|
|||
// footer.scss
|
||||
|
||||
footer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
background-color: var(--white);
|
||||
color: var(--black);
|
||||
|
||||
a {
|
||||
color: var(--blue);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
form:first-child {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
p {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: $mainWidth) {
|
||||
footer {
|
||||
img {
|
||||
width: 95%;
|
||||
}
|
||||
|
||||
form {
|
||||
width: 95vw;
|
||||
}
|
||||
|
||||
select {
|
||||
width: 90vw;
|
||||
}
|
||||
}
|
||||
}
|
||||
21
resources/sass-orig/_main.scss
vendored
21
resources/sass-orig/_main.scss
vendored
|
|
@ -1,21 +0,0 @@
|
|||
// main.scss
|
||||
|
||||
main {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
background-color: var(--white);
|
||||
color: var(--black);
|
||||
|
||||
a {
|
||||
color: var(--blue);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.h-entry {
|
||||
margin: 3rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
@import "pagination";
|
||||
@import "bio";
|
||||
5
resources/sass-orig/_mapbox.scss
vendored
5
resources/sass-orig/_mapbox.scss
vendored
|
|
@ -1,5 +0,0 @@
|
|||
//mapbox.scss
|
||||
|
||||
.map {
|
||||
height: 200px;
|
||||
}
|
||||
17
resources/sass-orig/_notes.scss
vendored
17
resources/sass-orig/_notes.scss
vendored
|
|
@ -1,17 +0,0 @@
|
|||
// notes.scss
|
||||
|
||||
.h-entry .note {
|
||||
width: $mainWidth;
|
||||
}
|
||||
|
||||
@media screen and (max-width: $mainWidth) {
|
||||
.h-entry .note {
|
||||
width: 95vw;
|
||||
|
||||
.e-content {
|
||||
img {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
16
resources/sass-orig/_pagination.scss
vendored
16
resources/sass-orig/_pagination.scss
vendored
|
|
@ -1,16 +0,0 @@
|
|||
// pagination.scss
|
||||
|
||||
.pagination {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
list-style-type: none;
|
||||
width: $mainWidth;
|
||||
}
|
||||
|
||||
@media screen and (max-width: $mainWidth) {
|
||||
.pagination {
|
||||
width: 95vw;
|
||||
}
|
||||
}
|
||||
25
resources/sass-orig/_site-header.scss
vendored
25
resources/sass-orig/_site-header.scss
vendored
|
|
@ -1,25 +0,0 @@
|
|||
// site-header.scss
|
||||
|
||||
#topheader {
|
||||
display: flex;
|
||||
width: 100vw;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
background-color: var(--black);
|
||||
|
||||
a {
|
||||
color: var(--white);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin-top: 0;
|
||||
padding-top: 1rem;
|
||||
font-size: 3rem;
|
||||
}
|
||||
|
||||
nav {
|
||||
padding-bottom: 1rem;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
}
|
||||
16
resources/sass-orig/_syndication.scss
vendored
16
resources/sass-orig/_syndication.scss
vendored
|
|
@ -1,16 +0,0 @@
|
|||
//syndication.scss
|
||||
|
||||
.note-metadata {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
|
||||
.social-links {
|
||||
flex-direction: row;
|
||||
|
||||
svg {
|
||||
height: 1em;
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
18
resources/sass-orig/app.scss
vendored
18
resources/sass-orig/app.scss
vendored
|
|
@ -1,18 +0,0 @@
|
|||
// app.scss
|
||||
|
||||
// General styles
|
||||
@import "base";
|
||||
@import "site-header";
|
||||
@import "main";
|
||||
@import "articles";
|
||||
@import "notes";
|
||||
@import "footer";
|
||||
|
||||
// Mapbox styles
|
||||
@import "mapbox";
|
||||
|
||||
// The syndication links at the end of notes
|
||||
@import "syndication";
|
||||
|
||||
// Accessible emoji
|
||||
@import "emoji";
|
||||
36
resources/sass/_base.scss
vendored
36
resources/sass/_base.scss
vendored
|
|
@ -1,36 +0,0 @@
|
|||
body {
|
||||
font-family: var(--font-stack-body);
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 2rem;
|
||||
background-color: var(--color-background);
|
||||
color: var(--color-paragraph);
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-family: var(--font-stack-headings);
|
||||
font-style: normal;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
pre,
|
||||
code {
|
||||
font-family: var(--font-stack-monospace);
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--color-highlight);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.h-feed > .note,
|
||||
.h-feed > .h-entry {
|
||||
margin-top: 4rem;
|
||||
}
|
||||
132
resources/sass/_layout-main.scss
vendored
132
resources/sass/_layout-main.scss
vendored
|
|
@ -1,132 +0,0 @@
|
|||
body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
main {
|
||||
@media screen and (max-width: 699px) {
|
||||
margin-left: 5px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin: auto;
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 700px) {
|
||||
max-width: 700px;
|
||||
|
||||
> .note,
|
||||
> .h-entry {
|
||||
padding: 0 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.h-entry:first-child {
|
||||
> .bookmark-link {
|
||||
padding-top: 2rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.note {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.note-metadata {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
|
||||
.client {
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.syndication-links {
|
||||
svg {
|
||||
height: 1em;
|
||||
width: 1em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
> .e-content {
|
||||
> .naked-link {
|
||||
.u-photo {
|
||||
margin: 2rem 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
article {
|
||||
header {
|
||||
> h1 {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.post-info {
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.pagination {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-evenly;
|
||||
max-width: 90vw;
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.personal-bio {
|
||||
padding: 0 2rem;
|
||||
}
|
||||
|
||||
footer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-top: 1.5rem;
|
||||
|
||||
input {
|
||||
@media screen and (max-width: 699px) {
|
||||
max-width: 95vw;
|
||||
}
|
||||
}
|
||||
|
||||
.iwc-logo {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 699px) {
|
||||
margin-left: 5px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
#top-header {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
|
||||
h1 {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
nav {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
|
||||
a {
|
||||
margin: 0 0.5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
11
resources/sass/_link-styles.scss
vendored
11
resources/sass/_link-styles.scss
vendored
|
|
@ -1,11 +0,0 @@
|
|||
.post-info {
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
.syndication-links {
|
||||
.u-syndication {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
4
resources/sass/_posse.scss
vendored
4
resources/sass/_posse.scss
vendored
|
|
@ -1,4 +0,0 @@
|
|||
.p-bridgy-facebook-content,
|
||||
.p-bridgy-twitter-content {
|
||||
display: none;
|
||||
}
|
||||
20
resources/sass/_variables.scss
vendored
20
resources/sass/_variables.scss
vendored
|
|
@ -1,20 +0,0 @@
|
|||
:root {
|
||||
/* fonts */
|
||||
--font-stack-body: "Whitney SSm A", "Whitney SSm B", sans-serif;
|
||||
--font-stack-headings: "Quarto A", "Quarto B", serif;
|
||||
--font-stack-monospace: "Operator Mono SSm A", "Operator Mono SSm B", monospace;
|
||||
|
||||
/* colours */
|
||||
--color-background: #004643;
|
||||
--color-headline: #fffffe;
|
||||
--color-paragraph: #abd1c6;
|
||||
--color-button: #f9bc60;
|
||||
--color-button-text: #001e1d;
|
||||
|
||||
/* colours - illustrations */
|
||||
--color-stroke: #001e1d;
|
||||
--color-main: #e8e4e6;
|
||||
--color-highlight: #f9bc60;
|
||||
--color-secondary: #abd1c6;
|
||||
--color-tertiary: #e16162;
|
||||
}
|
||||
5
resources/sass/app.scss
vendored
5
resources/sass/app.scss
vendored
|
|
@ -1,5 +0,0 @@
|
|||
@import "variables";
|
||||
@import "base";
|
||||
@import "layout-main";
|
||||
@import "link-styles";
|
||||
@import "posse";
|
||||
Loading…
Add table
Reference in a new issue