💾 Archived View for jb55.com › ward.asia.wiki.org › image-assets captured on 2022-01-08 at 14:04:14. Gemini links have been rewritten to link to archived content

View Raw

More Information

⬅️ Previous capture (2021-12-04)

-=-=-=-=-=-=-

Image Assets

We url-encode images dropped on the factory plugin. This captures the sharing dynamics expected of the federation but it doesn't match with current asset practices.

✔ We've written scripts that replace huge images in pages with much smaller copies. gist

gist

✔ We've modified Factory to resize and compress large images before posting. See Factory Image Artifacts

Factory Image Artifacts

We think all of the logic described here could be realized with a single enhanced image plugin running in the client and on the node server.

Pixel manipulations work on canvas objects. Most browsers can convert these back to jpg. webpage

webpage

See Journal Duplication

Journal Duplication

See Pluto, Image of the Year

Pluto, Image of the Year

See Assets in IPFS

Assets in IPFS

<h3> Sizes

We can expect to handle images at varying scale. A good strategy would be to keep highly compressed thumbnails in the page, url encoded. Other sizes could be served as needed from the originating server.

Thumbnail. Small enough to url encode. Resample to 200px or less.

Snapshot. Small enough to transform interactively. Resample to 600-800px.

Original File. Save as dropped without resampling.

<h3> Interaction

A drop should save the thumbnail immediately, compressing the dropped picture if necessary. Asset enabled servers could then open a background websocket to upload the higher resolutions.

Double clicking a thumbnail should open the snapshot which might have been preloaded. The snapshot viewer can offer access to higher resolutions as well as single click navigation around pages of images.

Caption edits should not duplicate the url-encoded thumbnail. There should be no need to drop images to scratch pages.

<h3> Transformation

Image edits should accumulate transformations from the original image(s) while saving the resulting image in the thumbnail and possibly elsewhere.

Support crop, rotate and possibly tilt.

Support hi, lo and mid gamma and possibly shadow/highlight enhancement.

Support y/r croma and possibly color temperature.

Transform snapshot for thumbnail, full screen for snapshot, etc. Approximate slow transformations at lower resolution then compute higher resolutions in the background.

CanmanJS works in browser or node. website

website

Pixastic appears full featured and popular. website

website

<h3> Interoperation

Is there some way to capture a picture from a camera-phone directly into wiki?

Can we dig the geocodes out of images and show them on a map? See About Map Plugin

About Map Plugin

Can we handle other media similar ways? Audio annotations of images? Videos?

Can we recognize drops from web page images? How about Flickr where we can get higher resolution?

Can we drop a directory of images and recognize it as such? How about making pages for each day from the timestamps? And rename the pages when we get to it?

<h3> References

How to resize and crop images using JavaScript and the HTML5 Canvas element using controls, commonly seen in photo editing applications. webpage

webpage

OpenSeadragon. An open-source, web-based viewer for high-resolution zoomable images, implemented in pure JavaScript, for desktop and mobile. site

site

Resize images in browser without pixelation and reasonably fast. Autoselect the best of available technologies: webworkers, webassembly, createImageBitmap, pure JS. github

github

See Pitchers in Wiki, Soviet Control Panels, Computational Photography

Pitchers in Wiki

Soviet Control Panels

Computational Photography