diff --git a/__tests__/WebAnnotation.test.js b/__tests__/WebAnnotation.test.js
index 890a29e565979354f9df9e734a5928d73a4f3de1..ee08252a386eac1bf4d26c2fb1f9b8462b0ad3c9 100644
--- a/__tests__/WebAnnotation.test.js
+++ b/__tests__/WebAnnotation.test.js
@@ -19,7 +19,7 @@ describe('WebAnnotation', () => {
let subject = createSubject();
describe('constructor', () => {
it('sets instance accessors', () => {
- ['body', 'canvasId', 'id', 'svg', 'xywh'].forEach((prop) => {
+ ['canvasId', 'id', 'svg'].forEach((prop) => {
expect(subject[prop]).toBe(prop);
});
expect(subject.fragsel).toStrictEqual({ t: '5,10', xywh: 'xywh' });
@@ -130,6 +130,20 @@ describe('WebAnnotation', () => {
value: 'tags',
});
});
+ it('with image and text', () => {
+ subject = createSubject({ body: {value: 'hello'}, image: {url: 'http://example.photo/pic.jpg' }, tags: null });
+ expect(subject.createBody()).toEqual([
+ {
+ type: 'TextualBody',
+ value: 'hello',
+ },
+ {
+ type: 'Image',
+ format: 'image/jpg',
+ id: 'http://example.photo/pic.jpg',
+ },
+ ]);
+ });
});
describe('toJson', () => {
it('generates a WebAnnotation', () => {
diff --git a/package-lock.json b/package-lock.json
index 98281b2d8afd5f48f85609fa7817943be736ea17..8eeaafc622102e476b6dcc7a189e7cbb100b0ebc 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -42,7 +42,7 @@
"jest-canvas-mock": "^2.2.0",
"jest-junit": "^15.0.0",
"jest-localstorage-mock": "^2.4.2",
- "mirador": "git+https://gitlab.tetras-libre.fr/iiif/mirador-video-annotation#annotation-on-video",
+ "mirador": "git+https://gitlab.tetras-libre.fr/iiif/mirador-video-annotation#15-api-for-annotations-on-video",
"nwb": "^0.24.7",
"prop-types": "^15.7.2",
"react": "^16.8",
@@ -54,7 +54,7 @@
"@material-ui/icons": "^4.9.1",
"@material-ui/lab": "^4.0.0-alpha.52",
"lodash": "^4.17.11",
- "mirador": "git+https://gitlab.tetras-libre.fr/iiif/mirador-video-annotation#annotation-on-video",
+ "mirador": "git+https://gitlab.tetras-libre.fr/iiif/mirador-video-annotation#15-api-for-annotations-on-video",
"prop-types": "^15.7.2",
"react": "^16.8",
"react-dom": "^16.8",
@@ -5878,6 +5878,16 @@
"node": ">=0.10.0"
}
},
+ "node_modules/bindings": {
+ "version": "1.5.0",
+ "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.5.0.tgz",
+ "integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==",
+ "dev": true,
+ "optional": true,
+ "dependencies": {
+ "file-uri-to-path": "1.0.0"
+ }
+ },
"node_modules/blob": {
"version": "0.0.5",
"dev": true,
@@ -6500,6 +6510,25 @@
"node": ">=0.10.0"
}
},
+ "node_modules/chokidar/node_modules/fsevents": {
+ "version": "1.2.13",
+ "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.13.tgz",
+ "integrity": "sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==",
+ "deprecated": "fsevents 1 will break on node v14+ and could be using insecure binaries. Upgrade to fsevents 2.",
+ "dev": true,
+ "hasInstallScript": true,
+ "optional": true,
+ "os": [
+ "darwin"
+ ],
+ "dependencies": {
+ "bindings": "^1.5.0",
+ "nan": "^2.12.1"
+ },
+ "engines": {
+ "node": ">= 4.0"
+ }
+ },
"node_modules/chokidar/node_modules/glob-parent": {
"version": "3.1.0",
"dev": true,
@@ -10265,6 +10294,13 @@
"webpack": "^4.0.0"
}
},
+ "node_modules/file-uri-to-path": {
+ "version": "1.0.0",
+ "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
+ "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==",
+ "dev": true,
+ "optional": true
+ },
"node_modules/filesize": {
"version": "6.1.0",
"dev": true,
@@ -10698,6 +10734,20 @@
"dev": true,
"license": "MIT"
},
+ "node_modules/fsevents": {
+ "version": "2.3.2",
+ "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
+ "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
+ "dev": true,
+ "hasInstallScript": true,
+ "optional": true,
+ "os": [
+ "darwin"
+ ],
+ "engines": {
+ "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
+ }
+ },
"node_modules/function-bind": {
"version": "1.1.1",
"dev": true,
@@ -15514,7 +15564,7 @@
},
"node_modules/mirador": {
"version": "3.3.0",
- "resolved": "git+https://gitlab.tetras-libre.fr/iiif/mirador-video-annotation#8d142157eeb008edd0761859b6ad8abfa564c2a6",
+ "resolved": "git+https://gitlab.tetras-libre.fr/iiif/mirador-video-annotation#e366a53790bc263cae34541dbd64e748ae9ab8b2",
"dev": true,
"license": "Apache-2.0",
"dependencies": {
@@ -15782,6 +15832,21 @@
"node": ">=6"
}
},
+ "node_modules/mocha/node_modules/fsevents": {
+ "version": "2.1.3",
+ "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.1.3.tgz",
+ "integrity": "sha512-Auw9a4AxqWpa9GUfj370BMPzzyncfBABW8Mab7BGWBYDj4Isgq+cDKtx0i6u9jcX9pQDnswsaaOTgTmA5pEjuQ==",
+ "deprecated": "\"Please update to latest v2.3 or v2.2\"",
+ "dev": true,
+ "hasInstallScript": true,
+ "optional": true,
+ "os": [
+ "darwin"
+ ],
+ "engines": {
+ "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
+ }
+ },
"node_modules/mocha/node_modules/glob": {
"version": "7.1.3",
"dev": true,
@@ -28341,6 +28406,16 @@
"version": "1.13.1",
"dev": true
},
+ "bindings": {
+ "version": "1.5.0",
+ "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.5.0.tgz",
+ "integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==",
+ "dev": true,
+ "optional": true,
+ "requires": {
+ "file-uri-to-path": "1.0.0"
+ }
+ },
"blob": {
"version": "0.0.5",
"dev": true
@@ -28805,6 +28880,17 @@
"to-regex-range": "^2.1.0"
}
},
+ "fsevents": {
+ "version": "1.2.13",
+ "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.13.tgz",
+ "integrity": "sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==",
+ "dev": true,
+ "optional": true,
+ "requires": {
+ "bindings": "^1.5.0",
+ "nan": "^2.12.1"
+ }
+ },
"glob-parent": {
"version": "3.1.0",
"dev": true,
@@ -31465,6 +31551,13 @@
"schema-utils": "^2.5.0"
}
},
+ "file-uri-to-path": {
+ "version": "1.0.0",
+ "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
+ "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==",
+ "dev": true,
+ "optional": true
+ },
"filesize": {
"version": "6.1.0",
"dev": true
@@ -31779,6 +31872,13 @@
"version": "1.2.0",
"dev": true
},
+ "fsevents": {
+ "version": "2.3.2",
+ "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
+ "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
+ "dev": true,
+ "optional": true
+ },
"function-bind": {
"version": "1.1.1",
"dev": true
@@ -34987,9 +35087,9 @@
}
},
"mirador": {
- "version": "git+https://gitlab.tetras-libre.fr/iiif/mirador-video-annotation#8d142157eeb008edd0761859b6ad8abfa564c2a6",
+ "version": "git+https://gitlab.tetras-libre.fr/iiif/mirador-video-annotation#e366a53790bc263cae34541dbd64e748ae9ab8b2",
"dev": true,
- "from": "mirador@git+https://gitlab.tetras-libre.fr/iiif/mirador-video-annotation#annotation-on-video",
+ "from": "mirador@git+https://gitlab.tetras-libre.fr/iiif/mirador-video-annotation#15-api-for-annotations-on-video",
"requires": {
"@material-ui/core": "^4.12.3",
"@material-ui/icons": "^4.9.1",
@@ -35188,6 +35288,13 @@
"locate-path": "^3.0.0"
}
},
+ "fsevents": {
+ "version": "2.1.3",
+ "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.1.3.tgz",
+ "integrity": "sha512-Auw9a4AxqWpa9GUfj370BMPzzyncfBABW8Mab7BGWBYDj4Isgq+cDKtx0i6u9jcX9pQDnswsaaOTgTmA5pEjuQ==",
+ "dev": true,
+ "optional": true
+ },
"glob": {
"version": "7.1.3",
"dev": true,
diff --git a/package.json b/package.json
index b7429b5b0d23178515ff4d4670a47640e560e5f9..62defb31e7f7e2f06e7f2c72f615ee2fba4419ce 100644
--- a/package.json
+++ b/package.json
@@ -37,7 +37,7 @@
"@material-ui/icons": "^4.9.1",
"@material-ui/lab": "^4.0.0-alpha.52",
"lodash": "^4.17.11",
- "mirador": "git+https://gitlab.tetras-libre.fr/iiif/mirador-video-annotation#annotation-on-video",
+ "mirador": "git+https://gitlab.tetras-libre.fr/iiif/mirador-video-annotation#15-api-for-annotations-on-video",
"prop-types": "^15.7.2",
"react": "^16.8",
"react-dom": "^16.8",
@@ -66,7 +66,7 @@
"jest-canvas-mock": "^2.2.0",
"jest-junit": "^15.0.0",
"jest-localstorage-mock": "^2.4.2",
- "mirador": "git+https://gitlab.tetras-libre.fr/iiif/mirador-video-annotation#annotation-on-video",
+ "mirador": "git+https://gitlab.tetras-libre.fr/iiif/mirador-video-annotation#15-api-for-annotations-on-video",
"nwb": "^0.24.7",
"prop-types": "^15.7.2",
"react": "^16.8",
diff --git a/src/AnnotationCreation.js b/src/AnnotationCreation.js
index 94e01fe2c95e2ec39a0022a1a10a64d61d54662c..52042c62999a8e394004d4396526eea47bfcc22f 100644
--- a/src/AnnotationCreation.js
+++ b/src/AnnotationCreation.js
@@ -88,7 +88,6 @@ class AnnotationCreation extends Component {
const annoState = {};
annoState.image = false;
- console.log('edition/creation annotation: ', props.annotation);
if (props.annotation) {
//
@@ -101,15 +100,15 @@ class AnnotationCreation extends Component {
} else if (body.type === 'TextualBody') {
annoState.textBody = body.value;
} else if (body.type === 'Image') {
- annoState.textBody = body.value;
- annoState.image = body.image;
+ // annoState.textBody = body.value; // why text body here ???
+ annoState.image = body;
}
});
} else if (props.annotation.body.type === 'TextualBody') {
annoState.textBody = props.annotation.body.value;
} else if (props.annotation.body.type === 'Image') {
- annoState.textBody = props.annotation.body.value;
- annoState.image = props.annotation.body.image;
+ // annoState.textBody = props.annotation.body.value; // why text body here ???
+ annoState.image = props.annotation.body;
}
//
// drawing position
@@ -254,6 +253,7 @@ class AnnotationCreation extends Component {
}
this.setState({
+ image: { id: imgUrl.value },
imgHeight: {
...imgHeight,
lastSubmittedValue: heightValidity === 1 ? imgHeight.value : imgHeight.lastSubmittedValue,
@@ -517,6 +517,7 @@ class AnnotationCreation extends Component {
});
this.setState({
+ image: false,
svg: null,
tend: 0,
textBody: '',
@@ -562,7 +563,7 @@ class AnnotationCreation extends Component {
activeTool, colorPopoverOpen, currentColorType, fillColor, openAddImgDialog, popoverAnchorEl,
strokeColor, popoverLineWeightAnchorEl, lineWeightPopoverOpen, strokeWidth, closedMode,
textBody, imgUrl, imgWidth, imgHeight, imgConstrain, svg, tstart, tend,
- textEditorStateBustingKey,
+ textEditorStateBustingKey, image,
} = this.state;
const mediaIsVideo = typeof VideosReferences.get(windowId) !== 'undefined';
@@ -713,7 +714,7 @@ class AnnotationCreation extends Component {
<Grid item xs={12}>
<Typography variant="overline">
- <ToggleButton value="true" title="Go to start time" size="small" onClick={this.seekToTend} className={classes.timecontrolsbutton}>
+ <ToggleButton value="true" title="Go to end time" size="small" onClick={this.seekToTend} className={classes.timecontrolsbutton}>
<LastPage />
</ToggleButton>
End
@@ -735,7 +736,8 @@ class AnnotationCreation extends Component {
</Grid>
<Grid item xs={12} style={{ marginBottom: 10 }}>
<ToggleButton value="image-icon" aria-label="insert an image" onClick={() => this.handleImgDialogChange(true)}>
- <InsertPhotoIcon />
+ { image === false && <InsertPhotoIcon /> }
+ { image !== false && <img src={image.id} width="100" height="auto" alt="no trad" /> }
</ToggleButton>
</Grid>
<Dialog open={openAddImgDialog} fullWidth onClose={() => this.handleImgDialogChange(false)} aria-labelledby="form-dialog-title">
diff --git a/src/WebAnnotation.js b/src/WebAnnotation.js
index 1166506a663d03fc4956d3056220e6600e69fd21..84371660aba5e694e40c52b988b0d05b69e01e96 100644
--- a/src/WebAnnotation.js
+++ b/src/WebAnnotation.js
@@ -39,6 +39,7 @@ export default class WebAnnotation {
if (this.image) {
const imgBody = {
+ // TODO format detection
format: 'image/jpg',
id: this.image.url,
type: 'Image',