This is for an idea for a static-served MapKnitter Lite.

Sketches of how this could look: https://docs.google.com/presentation/d/1kFXK0f3h2IsA2lml9L2s_REXm5p1ZGAVqfKUb9H_8Eo/edit?usp=sharing

N.B: To use MapKnitter Lite successfully, users must first upload their images to the Internet Archive and get a unique identifier or URL (for their image collection)

Guide to uploading images on Internet Archive: https://help.archive.org/help/uploading-a-basic-guide/

How to make a map:

• Prompt users to input image collection URL from Internet Archive #1011
• Have a sidebar for displaying the images in a collection #1018
• Fetch and display all the collection's images in the sidebar #1013
• allow clicking a sidebar image in MK Lite to add them onto a map for placement #1023
• add a geocoding search box to the page so upon creating a map users can navigate to a specific place (could be in a popup modal? could use this plugin, like in https://publiclab.org/map) (Added search location feature to archive.html #1286)
• When opening a map, detect a key like "texas-barnraising" from a longer URL like https://archive.org/details/texas-barnraising detect key from longer URL #1175
• Add a “drag image onto page to add” feature to the Leaflet.DistortableImage demo so people can import multiple images into maps in the demo at https://publiclab.github.io/Leaflet.DistortableImage/examples/export.html (even without saving any images) drag n drop feature #1293
  • Add a notice like "You're editing a map with local images. You'll need to save images at Archive.org if you'd like to save your work online, or to export the map." if people use the drag-images approach instead of archive.org
  • create prompt for download image scale, following this example code

Smaller issues

• add a loading spinner on the "Place" buttons so people know it's still loading the image after you press it; check presence of image.width to confirm it's finished loading (i think this is the right shortcut to check image load completion?) Added spining icon for place on map button #1169
• load image thumbnails in sidebar instead of full images (we should be able to tell from the Archive's collection response which are thumbnails) so we don't overload with a huge image collection load image in sidebar as thumbnail  #1319

Ways to save the map:

• maps would still be exportable using our cloud exporter
• saving the positions in localStorage
• allowing download of the positions as a JSON file Download json file of saved positions  #1237
• maybe generating a SVG of the map using the positions and client-side webgl-distort?
• accepting a JSON file by URL or upload to load a map
• detecting a JSON file that's dragged onto the map, and loading the images and centering them in the viewport
• you could share the map by sharing a URL like: https://lite.mapknitter.org/#https://example.com/my-map.json if you're able to save the JSON file online. We could offer that on PL.org.

Bonus/stretch:

• Maybe if you uploaded the JSON to archive.org then IA would offer a viewer button which would open Leaflet.DistortableImage in view-only mode?
• Maybe they'd provide a button to "open these in MapKnitter Lite" esp. if we made a case for the OpenStreetMap workflow?
• Add GPS/EXIF metadata detection for rough auto-placement using lat/lon, compass, elevation #1024

Code to fetch a gallery (CORS is now enabled for IA images):

$ $.get('https://archive.org/metadata/texas-barnraising/',function(response) { console.log(response) })
{readyState: 1, getResponseHeader: ƒ, getAllResponseHeaders: ƒ, setRequestHeader: ƒ, overrideMimeType: ƒ, …}
=> VM8221:1 {created: 1657632500, d1: 'ia600904.us.archive.org', d2: 'ia800904.us.archive.org', dir: '/27/items/texas-barnraising', files: Array(25), …}

$ i = new Image; i.src = "https://archive.org/download/texas-barnraising/IMG_0764.JPG";
=> 'https://archive.org/download/texas-barnraising/IMG_0764.JPG'
// will be at https://ia801507.us.archive.org/34/items/texas-barnraising/IMG_0764.JPG

$ i.width
=> 2592

This idea was explored in our GSoC ideas list here: https://publiclab.org/wiki/gsoc-ideas#MapKnitter+Local with the extra ideas:

• Add a “drag image onto page to add” feature to the Leaflet.DistortableImage demo so people can import multiple images into maps in the demo at https://publiclab.github.io/Leaflet.DistortableImage/examples/export.html (this wouldn't work for persistent maps, unlike the Internet Archive idea
• Allow current map state to be exported to a downloadable “distortableGeoJSON.json” format (see https://github.com/publiclab/image-sequencer-app#usage for current JSON format and https://gis.stackexchange.com/q/298808 / https://geojson.org/ for official GeoJSON standard) Add local saving of maps, via localStorage (may be limited by filesize?) so you don’t lose your work when you refresh the page (using “distortableGeoJSON.json”)
• Allow map initialization from a “distortableGeoJSON.json” format which auto-places the images
• Could it detect missing images from the distortableGeoJSON.json file and prompt the user to drag them onto the page? This would take some UI work.
• The hard part: local full-res map exporting: 3 possible approaches:
• switch to Ruby exporter in exporting demo: upstream Node-based cloud export service offline in export demo; switch to Ruby-based service for now #751 (maybe easiest, although it means you’d have to find how to send the local images to the remote exporter)
• rework the JS exporter for local use: https://github.com/publiclab/image-sequencer-app (challenging to rework server-side multi-threaded Node code): Availability for client-side usage? (speculative use) image-sequencer-app#16
• or use the existing webgl-distort individual image export (https://github.com/publiclab/Leaflet.DistortableImage/#full-resolution-download) and stack them into one giant image using https://github.com/nodeca/pica (hard but relatively straightforward)

Later projects/stretch goals

Something to bear in mind if you all make a lot of progress and are looking for things: #474 this issue gets at the relatively complicated external map exporter service, and it's not very well documented. If we could document it better that might go hand in hand with the local full-res map exporting mentioned above. -- @jywarren