I set up Mirador 3 to use a basic Webpack output (main.js), with a couple of plugins including the Annotations plugin v0.4.0.
The index.js for the Webpack output does not include a config. it simply exports Mirador, the plugins and a LocalStorageAdapter method.
This allows me to set up a separate file which relies on the Webpack output (ES5), sets up a config and initialises Mirador with its plugins. In this way, I don't have to re-compile and re-transpile the code every time I make changes, something I need to do quite a lot.
I could not export LocalStorageAdapter directly because that would give me TypeError: Invalid attempt to spread non-iterable instance. In order to be iterable, non-array objects must have a [Symbol.iterator]() method. Instead I exported/imported a method with LocalStorageAdapter for use with the config:
function adapter( canvasId ) {
return new LocalStorageAdapter(`localStorage://?canvasId=${canvasId}`);
}
or a variant with a check on the input:
var adapter = function( canvasId ) {
console.log('canvasId: ' + canvasId );
var newAdapter = new LocalStorageAdapter( 'localStorage://?canvasId=' + canvasId );
return newAdapter;
}
(which also works using arrow notation)
The problem
By and large, the setup seems to be working quite well: I can create annotations, edit the descriptions, download annotations to my computer, and refresh the page with annotations still intact. But every time I create a new annotation, there is an error in the console that worries me and makes me question if my setup is sound:
TypeError: e.annotationJson.resources is undefined
The variant with the log tells me that canvasid is retrieved correctly, although what's fetched at other times is just 'poke' (an API check I guess).
The other thing I noticed is that the window on the left shows a collection of all annotations from any canvas and does not change when changing canvases.
Cf. Netlify app
FWIW, It's probably unrelated but to compare behaviours, I had a look at the Netlify app (https://mirador-annotations.netlify.app/), which uses a different version of the Annotations plugin. The browser reveals the following error:
TypeError: c is undefined
paperThing AnnotationDrawing.js:71
render AnnotationDrawing.js:146
React 8
unstable_runWithPriority scheduler.production.min.js:18
React 5
My use case
TypeError: Invalid attempt to spread non-iterable instance. In order to be iterable, non-array objects must have a [Symbol.iterator]() method.Instead I exported/imported a method with LocalStorageAdapter for use with the config:or a variant with a check on the input:
(which also works using arrow notation)
The problem
By and large, the setup seems to be working quite well: I can create annotations, edit the descriptions, download annotations to my computer, and refresh the page with annotations still intact. But every time I create a new annotation, there is an error in the console that worries me and makes me question if my setup is sound:
The variant with the log tells me that canvasid is retrieved correctly, although what's fetched at other times is just 'poke' (an API check I guess).
The other thing I noticed is that the window on the left shows a collection of all annotations from any canvas and does not change when changing canvases.
Cf. Netlify app
FWIW, It's probably unrelated but to compare behaviours, I had a look at the Netlify app (https://mirador-annotations.netlify.app/), which uses a different version of the Annotations plugin. The browser reveals the following error: