diff --git a/__tests__/WebAnnotation.test.js b/__tests__/WebAnnotation.test.js index 1b0cb50a457d90ddb42ef046ea78c83af7543d30..0e4baa8c3885e1ae568647cebf3f8bf72632f680 100644 --- a/__tests__/WebAnnotation.test.js +++ b/__tests__/WebAnnotation.test.js @@ -5,11 +5,10 @@ function createSubject(args = {}) { return new WebAnnotation({ body: 'body', canvasId: 'canvasId', + fragsel: { t: '5,10', xywh: 'xywh' }, id: 'id', svg: 'svg', tags: ['tags'], - timing: [1, 3], - xywh: 'xywh', ...args, }); } @@ -18,14 +17,14 @@ describe('WebAnnotation', () => { let subject = createSubject(); describe('constructor', () => { it('sets instance accessors', () => { - ['body', 'canvasId', 'id', 'svg', 'xywh'].forEach((prop) => { + ['body', 'canvasId', 'id', 'svg'].forEach((prop) => { expect(subject[prop]).toBe(prop); }); - expect(subject.timing).toStrictEqual([1, 3]); + expect(subject.fragsel).toStrictEqual({ t: '5,10', xywh: 'xywh' }); }); }); describe('target', () => { - it('with svg, xywh and timing', () => { + it('with svg and xywh', () => { expect(subject.target()).toEqual({ selector: [ { @@ -34,18 +33,14 @@ describe('WebAnnotation', () => { }, { type: 'FragmentSelector', - value: 'xywh=xywh', - }, - { - type: 'FragmentSelector', - value: 't=1,3', + value: 't=5,10&xywh=xywh', }, ], source: 'canvasId', }); }); it('with svg only', () => { - subject = createSubject({ timing: null, xywh: null }); + subject = createSubject({ fragsel: null }); expect(subject.target()).toEqual({ selector: { type: 'SvgSelector', @@ -54,8 +49,28 @@ describe('WebAnnotation', () => { source: 'canvasId', }); }); + it('with time interval only', () => { + subject = createSubject({ fragsel: { t: '5,10' }, svg: null }); + expect(subject.target()).toEqual({ + selector: { + type: 'FragmentSelector', + value: 't=5,10', + }, + source: 'canvasId', + }); + }); + it('with time interval only - xywh present but null', () => { + subject = createSubject({ fragsel: { t: '5,10', xywh: null }, svg: null }); + expect(subject.target()).toEqual({ + selector: { + type: 'FragmentSelector', + value: 't=5,10', + }, + source: 'canvasId', + }); + }); it('with xywh only', () => { - subject = createSubject({ svg: null, timing: null }); + subject = createSubject({ fragsel: { xywh: 'xywh' }, svg: null }); expect(subject.target()).toEqual({ selector: { type: 'FragmentSelector', @@ -64,18 +79,18 @@ describe('WebAnnotation', () => { source: 'canvasId', }); }); - it('with timing only', () => { - subject = createSubject({ svg: null, xywh: null }); + it('with xywh only - time interval present but null', () => { + subject = createSubject({ fragsel: { t: null, xywh: 'xywh' }, svg: null }); expect(subject.target()).toEqual({ selector: { type: 'FragmentSelector', - value: 't=1,3', + value: 'xywh=xywh', }, source: 'canvasId', }); }); - it('with no xywh, svg or timing', () => { - subject = createSubject({ svg: null, timing: null, xywh: null }); + it('with no xywh or svg', () => { + subject = createSubject({ fragsel: null, svg: null }); expect(subject.target()).toBe('canvasId'); }); }); diff --git a/src/AnnotationCreation.js b/src/AnnotationCreation.js index bfad765161bdde39582af52f6eb9f767cd41ebed..49a04ec29b9b024d8f7a8d0f39ff45c0c8e00d2a 100644 --- a/src/AnnotationCreation.js +++ b/src/AnnotationCreation.js @@ -242,18 +242,16 @@ class AnnotationCreation extends Component { const { annoBody, tags, xywh, svg, tstart, tend, textEditorStateBustingKey, } = this.state; - const timing = (tstart && tend) ? [tstart, tend] : null; canvases.forEach((canvas) => { const storageAdapter = config.annotation.adapter(canvas.id); const anno = new WebAnnotation({ body: !annoBody.length ? `${secondsToHMS(tstart)} -> ${secondsToHMS(tend)}` : annoBody, canvasId: canvas.id, + fragsel: { t: `${tstart},${tend}`, xywh }, id: (annotation && annotation.id) || `${uuid()}`, manifestId: canvas.options.resource.id, svg, tags, - timing, - xywh, }).toJson(); if (annotation) { storageAdapter.update(anno).then((annoPage) => { diff --git a/src/WebAnnotation.js b/src/WebAnnotation.js index d31c22be5af60de8e0ce8ce4582fced3e75d1a50..281055edee98da07573e80af4880cd842cfbe389 100644 --- a/src/WebAnnotation.js +++ b/src/WebAnnotation.js @@ -2,12 +2,11 @@ export default class WebAnnotation { /** */ constructor({ - canvasId, id, xywh, timing, body, tags, svg, manifestId, + canvasId, id, fragsel, body, tags, svg, manifestId, }) { this.id = id; this.canvasId = canvasId; - this.xywh = xywh; - this.timing = timing; + this.fragsel = fragsel; this.body = body; this.tags = tags; this.svg = svg; @@ -49,30 +48,24 @@ export default class WebAnnotation { /** */ target() { - if (!this.svg && !this.xywh && !this.timing) { + if (!this.svg && !this.fragsel) { return this.canvasId; } + const target = { source: this.source() }; const selectors = []; - const target = { - source: this.source(), - }; if (this.svg) { selectors.push({ type: 'SvgSelector', value: this.svg, }); } - if (this.xywh) { - selectors.push({ - type: 'FragmentSelector', - value: `xywh=${this.xywh}`, - }); - } - if (this.timing) { - const [start, end] = this.timing; + if (this.fragsel) { selectors.push({ type: 'FragmentSelector', - value: `t=${start},${end}`, + value: Object.entries(this.fragsel) + .filter((kv) => kv[1]) + .map((kv) => `${kv[0]}=${kv[1]}`) + .join('&'), }); } target.selector = selectors.length === 1 ? selectors[0] : selectors;