Skip to content
Snippets Groups Projects
Verified Commit 5ee0bd2a authored by Loïs Poujade's avatar Loïs Poujade
Browse files

WIP images in annotations

parent 3504b2d4
Branches 5-old-images-in-annotations
No related tags found
No related merge requests found
......@@ -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', () => {
......
......@@ -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,
......
......@@ -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",
......
......@@ -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">
......
......@@ -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',
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment