diff --git a/imagetagger/imagetagger/annotations/static/annotations/js/annotations.js b/imagetagger/imagetagger/annotations/static/annotations/js/annotations.js index 0d1739d4..2662adbe 100644 --- a/imagetagger/imagetagger/annotations/static/annotations/js/annotations.js +++ b/imagetagger/imagetagger/annotations/static/annotations/js/annotations.js @@ -2,9 +2,6 @@ globals = { image: {}, imageScaleWidth: 1, imageScaleHeight: 1, - restoreSelection: undefined, - restoreSelectionVectorType: 1, - restoreSelectionNodeCount: 0, moveSelectionStepSize: 2, drawAnnotations: true, mouseUpX: undefined, @@ -173,12 +170,6 @@ function calculateImageScale() { throw new Error('annotation is invalid'); } - if (markForRestore === true) { - globals.restoreSelection = vector; - globals.restoreSelectionVectorType = vector_type; - globals.restoreSelectionNodeCount = node_count; - } - let annotation = { annotation_type_id: annotationTypeId, image_id: gImageId, @@ -551,8 +542,7 @@ function calculateImageScale() { link.data('imageid', image.id); link.click(async function(event) { event.preventDefault(); // do not let the browser follow the link - globals.restoreSelection = undefined; - await changeImage($(this).data('imageid'), false); + await changeImage($(this).data('imageid')); }); result.append(link); @@ -793,9 +783,9 @@ function calculateImageScale() { * Load the annotation view for another image. * * @param imageId - * @param fromHistory + * @param restoreAnnotation an annotation to restore */ - async function loadAnnotateView(imageId, fromHistory) { + async function loadAnnotateView(imageId, restoreAnnotation) { // load first image if current image is not within image set if (!gImageList.includes(imageId)) { console.log('Loading first image because ' + imageId + ' is not contained in the selection'); @@ -834,9 +824,16 @@ function calculateImageScale() { $('#delete-image-form').attr('action', DELETE_IMAGE_URL.replace('%s', imageId)); tool.clear(); - if (globals.restoreSelection !== undefined && $('#keep_selection').prop('checked')) { - tool.restoreSelection(); - if (globals.restoreSelection === null) { + if ($('#keep_selection').prop('checked') && restoreAnnotation) { + let annotation_type = $('#annotation_type_id').children('[value=' + restoreAnnotation.annotation_type_id + ']').data(); + let vector_type = annotation_type.vectorType; + let node_count = annotation_type.nodeCount; + tool.restoreSelection({ + vector_type: vector_type, + node_count: node_count, + vector: restoreAnnotation.vector, + }); + if (restoreAnnotation.vector === null) { // not in image $('#not_in_image').prop('checked', true); $('#coordinate_table').hide(); @@ -846,12 +843,6 @@ function calculateImageScale() { resetSelection(); } - if (fromHistory !== true) { - history.pushState({ - imageId: imageId - }, document.title, '/annotations/' + imageId + '/'); - } - try { // load existing annotations for this image await loadAnnotations(imageId); @@ -1107,17 +1098,13 @@ function calculateImageScale() { /** * Change the image that is currently shown, i.e. update the image list, the displayed image and the annotation view * @param imageId the id of the image to change to - * @param keepSelection whether the current selection should be kept on the next image + * @param annotation the annotation to restore at the next image if the option is selected. undefined for no restoring */ - async function changeImage(imageId, keepSelection) { - if (!keepSelection) { - // unset restoreSelection to avoid restoring a selection that we do not want to keep - globals.restoreSelection = undefined; - } + async function changeImage(imageId, annotation) { let imageList = await getImageList(); await displayImageList(imageList); scrollImageList(imageId); - await loadAnnotateView(imageId); + await loadAnnotateView(imageId, annotation); } @@ -1181,7 +1168,6 @@ function calculateImageScale() { event.preventDefault(); try { let annotation = getValidAnnotation(); - globals.restoreSelection = undefined; tool.clear(); resetSelection(); await createAnnotation(annotation); @@ -1199,27 +1185,25 @@ function calculateImageScale() { let annotation = getValidAnnotation(true); await createAnnotation(annotation); let imageId = await loadAdjacentImage(-1); - let keepSelection = $('#keep_selection').prop('checked'); - await changeImage(imageId, keepSelection); + await changeImage(imageId, annotation); } catch (e) { console.log(e); } }); $('#back_button').click(async function (event) { let imageId = await loadAdjacentImage(-1); - await changeImage(imageId, false); + await changeImage(imageId); }); $('#skip_button').click(async function (event) { let imageId = await loadAdjacentImage(1); - await changeImage(imageId, false) + await changeImage(imageId); }); $('#next_button').click(async function (event) { try { let annotation = getValidAnnotation(true); await createAnnotation(annotation); let imageId = await loadAdjacentImage(1); - let keepSelection = $('#keep_selection').prop('checked') - await changeImage(imageId, keepSelection); + await changeImage(imageId, annotation); } catch (e) { console.log(e); } @@ -1229,8 +1213,7 @@ function calculateImageScale() { }); $('.annotate_image_link').click(async function(event) { event.preventDefault(); // do not let the browser load the link - globals.restoreSelection = undefined; - await changeImage($(this).data('imageid'), false); + await changeImage($(this).data('imageid')); }); // annotation buttons @@ -1252,7 +1235,10 @@ function calculateImageScale() { $(window).on('resize', handleResize); window.onpopstate = async function(event) { if (event.state !== undefined && event.state !== null && event.state.imageId !== undefined) { - await loadAnnotateView(event.state.imageId, true); + await loadAnnotateView(event.state.imageId); + history.pushState({ + imageId: event.state.imageId, + }, document.title, '/annotations/' + event.state.imageId + '/'); } }; diff --git a/imagetagger/imagetagger/annotations/static/annotations/js/boundingboxes.js b/imagetagger/imagetagger/annotations/static/annotations/js/boundingboxes.js index ee1f0743..7cfb20b8 100644 --- a/imagetagger/imagetagger/annotations/static/annotations/js/boundingboxes.js +++ b/imagetagger/imagetagger/annotations/static/annotations/js/boundingboxes.js @@ -148,17 +148,17 @@ class BoundingBoxes { /** * Restore the selection. + * @param selection the selection to restore, object containing the vector */ - restoreSelection() { - if (globals.restoreSelection !== undefined) { - if (globals.restoreSelection === null) { - } else { - $('#x1Field').val(globals.restoreSelection.x1); - $('#x2Field').val(globals.restoreSelection.x2); - $('#y1Field').val(globals.restoreSelection.y1); - $('#y2Field').val(globals.restoreSelection.y2); - this.reloadSelection(0, globals.restoreSelection); - } + restoreSelection(selection) { + let vector = selection.vector; + if (vector === null) { + } else { + $('#x1Field').val(vector.x1); + $('#x2Field').val(vector.x2); + $('#y1Field').val(vector.y1); + $('#y2Field').val(vector.y2); + this.reloadSelection(0, vector); } } diff --git a/imagetagger/imagetagger/annotations/static/annotations/js/canvas.js b/imagetagger/imagetagger/annotations/static/annotations/js/canvas.js index d3e29ace..3327a9cc 100644 --- a/imagetagger/imagetagger/annotations/static/annotations/js/canvas.js +++ b/imagetagger/imagetagger/annotations/static/annotations/js/canvas.js @@ -570,35 +570,42 @@ class Canvas { /** * Restore the selection. + * @param selection the selection to restore, object containing vector, vector_type and node_count */ - restoreSelection() { - if (globals.restoreSelection !== undefined) { - if (globals.restoreSelection === null) { - } else if (globals.restoreSelectionVectorType === 4) { - // this is not implemented for multilines, so just do nothing - this.old = undefined; - } else { - let vector = {}; - for (let key in globals.restoreSelection) { - if (key[0] === "y") { - vector[key] = globals.restoreSelection[key] / globals.imageScaleHeight; - } else { - vector[key] = globals.restoreSelection[key] / globals.imageScaleWidth; - } + restoreSelection(selection) { + let vector = selection.vector; + let vectorType = selection.vector_type; + let nodeCount = selection.node_count; + if (vector === null) { + } else if (vectorType === 4) { + // this is not implemented for multilines, so just do nothing + this.old = undefined; + } else { + let scaledVector = {}; + for (let key in vector) { + if (key[0] === "y") { + scaledVector[key] = vector[key] / globals.imageScaleHeight; + } else { + scaledVector[key] = vector[key] / globals.imageScaleWidth; } - this.updateAnnotationFields(globals.restoreSelection); - switch(globals.restoreSelectionVectorType) { - case 2: this.drawPoint(vector, 0, true); break; - case 3: this.drawLine(vector, 0, true); break; - case 5: if (globals.restoreSelectionNodeCount === 0) { - this.drawArbitraryPolygon(vector, 0, true, true); + } + this.updateAnnotationFields(vector); + switch (vectorType) { + case 2: + this.drawPoint(scaledVector, 0, true); + break; + case 3: + this.drawLine(scaledVector, 0, true); + break; + case 5: + if (nodeCount === 0) { + this.drawArbitraryPolygon(scaledVector, 0, true, true); } else { - this.drawPolygon(vector, 0, true, globals.restoreSelectionNodeCount, true); + this.drawPolygon(scaledVector, 0, true, nodeCount, true); } - } - this.reloadSelection(0); - this.old = undefined; } + this.reloadSelection(0); + this.old = undefined; } }