Skip to content

Commit

Permalink
prepare for redirects being turned off
Browse files Browse the repository at this point in the history
  • Loading branch information
@JoeGermuska
JoeGermuska committed Aug 21, 2023
1 parent 95a8182 commit fe6d80d
Show file tree
Hide file tree
Showing 7 changed files with 344 additions and 50 deletions.
2 changes: 2 additions & 0 deletions .gitignore
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
dist/*
.pgdata/

.devcontainer

huey.*

.srl
Expand Down
1 change: 1 addition & 0 deletions .nvmrc
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
v16.20.0
6 changes: 3 additions & 3 deletions DEVELOPMENT.md
View file
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
# Developing StoryMapJS - the javascript
# Developing StoryMapJS - the javascript library

When you make changes to the code, you should execute the build command. To
test your changes, run a simple local web server in the project root and
navigate, e.g. to http://localhost:8000/src/template/index.html.
navigate, e.g. to http://localhost:8000/src/template/arya.html.

Install the dependencies and build the javascript:

Expand All @@ -11,7 +11,7 @@ Install the dependencies and build the javascript:
$ npx webpack -c webpack.dev.js
```

# StoryMap editor development
# StoryMap editor development - the python server

## Questions not yet completely addressed with the new localstack based setup:

Expand Down
42 changes: 22 additions & 20 deletions src/js/map/leaflet/Map.Leaflet.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -170,19 +170,21 @@ export default class Leaflet extends Map {
================================================== */
_createTileLayer(map_type, options) {
var _tilelayer = null,
_map_type_arr = map_type.split(':'),
_options = {},
options = {},
_attribution_knightlab = "<a href='http://leafletjs.com' title='A JS library for interactive maps'>Leaflet</a> | "

if (options) {
_options = options; // WARNING this is just a reference not a copy. If the idea was to protect options it isn't doing that.
if (map_type == 'stamen:trees-cabs-crime') {
console.log("stamen:trees-cabs-crime layer no longer available. Using OSM instead")
map_type = 'osm'
}

let _map_type_arr = map_type.split(':')

// Set Tiles
switch(_map_type_arr[0]) {
switch (_map_type_arr[0]) {
case 'mapbox':
var mapbox_url;
_options.attribution = _attribution_knightlab + "<div class='mapbox-maplogo'></div><a href='https://www.mapbox.com/about/maps/' target='_blank'>© Mapbox © OpenStreetMap</a>";
options.attribution = _attribution_knightlab + "<div class='mapbox-maplogo'></div><a href='https://www.mapbox.com/about/maps/' target='_blank'>© Mapbox © OpenStreetMap</a>";
if (_map_type_arr.length > 2) {
// new form mapbox URL:
// mapbox://styles/nuknightlab/cjl6w8oio0agu2sltd04tp1kx
Expand All @@ -194,36 +196,36 @@ export default class Leaflet extends Map {
var mapbox_name = _map_type_arr[1];
mapbox_url = "https://api.tiles.mapbox.com/v4/" + mapbox_name + "/{z}/{x}/{y}.png?access_token=" + this.options.map_access_token;
}
_tilelayer = new L.TileLayer(mapbox_url, _options);
_tilelayer = new L.TileLayer(mapbox_url, options);
break;
case 'stamen':
_tilelayer = new StamenTileLayer(_map_type_arr[1] || 'toner-lite', _options);
_tilelayer = new StamenTileLayer(_map_type_arr[1] || 'toner-lite', options);
this._map.getContainer().style.backgroundColor = "#FFFFFF";
break;
case 'zoomify':
_options.width = this.options.zoomify.width;
_options.height = this.options.zoomify.height;
_options.tolerance = this.options.zoomify.tolerance || 0.9;
_options.attribution = _attribution_knightlab + this.options.zoomify.attribution;
options.width = this.options.zoomify.width;
options.height = this.options.zoomify.height;
options.tolerance = this.options.zoomify.tolerance || 0.9;
options.attribution = _attribution_knightlab + this.options.zoomify.attribution;

_tilelayer = new ZoomifyTileLayer(this.options.zoomify.path, _options);
_tilelayer = new ZoomifyTileLayer(this.options.zoomify.path, options);
//this._image_layer = new L.imageOverlay(this.options.zoomify.path + "TileGroup0/0-0-0.jpg", _tilelayer.getZoomifyBounds(this._map));
break;
case 'osm':
_options.subdomains = 'ab';
_options.attribution = _attribution_knightlab + "© <a target='_blank' href='http://www.openstreetmap.org'>OpenStreetMap</a> and contributors, under an <a target='_blank' href='http://www.openstreetmap.org/copyright'>open license</a>";
_tilelayer = new L.TileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', _options);
options.subdomains = 'ab';
options.attribution = _attribution_knightlab + "© <a target='_blank' href='http://www.openstreetmap.org'>OpenStreetMap</a> and contributors, under an <a target='_blank' href='http://www.openstreetmap.org/copyright'>open license</a>";
_tilelayer = new L.TileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', options);
break;

case 'http':
case 'https':
_options.subdomains = this.options.map_subdomains;
_options.attribution = _attribution_knightlab + this.options.attribution;
_tilelayer = new L.TileLayer(this.options.map_type, _options);
options.subdomains = this.options.map_subdomains;
options.attribution = _attribution_knightlab + this.options.attribution;
_tilelayer = new L.TileLayer(this.options.map_type, options);
break;

default:
_tilelayer = new StamenTileLayer('toner', _options);
_tilelayer = new StamenTileLayer('toner', options);
break;
}

Expand Down
52 changes: 28 additions & 24 deletions src/js/map/tile/TileLayer.Stamen.js
View file
Original file line number Diff line number Diff line change
@@ -1,25 +1,25 @@
/* TyleLayer.Stamen
Makes Stamen Map tiles available
http://maps.stamen.com/
Stamen tiles will no longer be free (2023)
see http://maps.stamen.com/stadia-partnership/
================================================== */
import { LeafletModule } from "leaflet";
import { mergeData } from "../../core/Util"


/* tile.stamen.js v1.2.3
================================================== */

let SUBDOMAINS = "a b c d".split(" ");
function MAKE_PROVIDER(layer, type, minZoom, maxZoom) {
return {
"url": ["//stamen-tiles-{S}.a.ssl.fastly.net/", layer, "/{Z}/{X}/{Y}.", type].join(""),
"url": ["https://tiles.stadiamaps.com/tiles/", layer, "/{Z}/{X}/{Y}.", type].join(""),
"type": type,
"subdomains": SUBDOMAINS.slice(),
"subdomains": '',
"minZoom": minZoom,
"maxZoom": maxZoom,
"attribution": [
"<a href='http://leafletjs.com' title='A JS library for interactive maps'>Leaflet</a> | ",
'Map tiles by <a href="http://stamen.com">Stamen Design</a>, ',
'Map tiles by <a href="http://stamen.com">Stamen Design</a>, served by ',
'<a href="https://stadiamaps.com/">Stadia</a> ',
'under <a href="http://creativecommons.org/licenses/by/3.0">CC BY 3.0</a>. ',
'Data by <a href="http://openstreetmap.org">OpenStreetMap</a>, ',
'under <a href="http://creativecommons.org/licenses/by-sa/3.0">CC BY SA</a>.'
Expand All @@ -28,25 +28,23 @@ function MAKE_PROVIDER(layer, type, minZoom, maxZoom) {
}

let PROVIDERS = {
"toner": MAKE_PROVIDER("toner", "png", 0, 20),
"terrain": MAKE_PROVIDER("terrain", "jpg", 4, 18),
"watercolor": MAKE_PROVIDER("watercolor", "jpg", 0, 16),
"trees-cabs-crime": {
"url": "http://{S}.tiles.mapbox.com/v3/stamen.trees-cabs-crime/{Z}/{X}/{Y}.png",
"type": "png",
"subdomains": "a b c d".split(" "),
"minZoom": 11,
"maxZoom": 18,
"extent": [
{"lat": 37.853, "lon": -122.577},
{"lat": 37.684, "lon": -122.313}
],
"toner": MAKE_PROVIDER("stamen_toner", "png", 0, 20),
"terrain": MAKE_PROVIDER("stamen_terrain", "jpg", 4, 18),
"watercolor": MAKE_PROVIDER("stamen_watercolor", "jpg", 0, 16),
"ch_watercolor": {
"url": "https://watercolormaps.collection.cooperhewitt.org/tile/watercolor//{Z}/{X}/{Y}.png",
"type": 'png',
"subdomains": '',
"minZoom": 0,
"maxZoom": 16,
"attribution": [
'Design by Shawn Allen at <a href="http://stamen.com">Stamen</a>.',
'Data courtesy of <a href="http://fuf.net">FuF</a>,',
'<a href="http://www.yellowcabsf.com">Yellow Cab</a>',
'&amp; <a href="http://sf-police.org">SFPD</a>.'
].join(" ")
"<a href='http://leafletjs.com' title='A JS library for interactive maps'>Leaflet</a> | ",
'Map tiles by <a href="http://stamen.com">Stamen Design</a>, served by ',
'<a href="https://watercolormaps.collection.cooperhewitt.org/">Cooper Hewitt, Smithsonian Design Museum</a> ',
'under <a href="http://creativecommons.org/licenses/by/3.0">CC BY 3.0</a>. ',
'Data by <a href="http://openstreetmap.org">OpenStreetMap</a>, ',
'under <a href="http://creativecommons.org/licenses/by-sa/3.0">CC BY SA</a>.'
].join("")
}
};

Expand Down Expand Up @@ -83,6 +81,12 @@ function setupFlavors(base, flavors, type) {
if it doesn't exist.
================================================== */
function getProvider(name) {

if (name == "trees-cabs-crime") {
console.log("trees-cabs-crime is not available. Using toner instead")
name = 'toner'
}

if (name in PROVIDERS) {
return PROVIDERS[name];
} else {
Expand Down
7 changes: 4 additions & 3 deletions src/template/football.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,15 +44,16 @@ <h1>StoryMap Development</h1>
storymap = new KLStoryMap.StoryMap('storymap-embed', data, options, {title: onStoryMapTitle});
}

(function() {
document.addEventListener("DOMContentLoaded", () => {
console.log("Initializing storymap")
var data = {};
var options = {};
var storymapTitle = 'Test';
let url = 'https://uploads.knightlab.com/storymapjs/fe78caa5c21790f56f0bb53cba313ab9/the-most-expensive-transfers-in-football-history/published.json';
let url = './football.json';
fetch(url)
.then(response => response.json())
.then(data => buildStoryMap(data));
})();
})
</script>

</body>
Expand Down
Loading

0 comments on commit fe6d80d

Please sign in to comment.