diff --git a/src/cookies.ts b/src/cookies.ts index 7cfe6170..4ad13658 100644 --- a/src/cookies.ts +++ b/src/cookies.ts @@ -2,6 +2,8 @@ * ULabel cookie utilities. */ +import { ULabelSubtask } from "./subtask"; + export abstract class NightModeCookie { /** * The name of the cookie that stores the night mode preference. @@ -43,3 +45,63 @@ export abstract class NightModeCookie { ].join(";"); } } + +/** + * Cookie utilities for tracking annotation display size. + */ +export abstract class AnnotationSizeCookie { + /** + * Produce the name of the cookie for a given subtask. + * Swaps spaces for underscores and lowercases the name. + * + * @param subtask ULabelSubtask to generate the cookie name for. + */ + private static cookie_name(subtask: ULabelSubtask): string { + const subtask_name = subtask.display_name.replaceLowerConcat(" ", "_"); + return `${subtask_name}_size`; + } + + /** + * Set the annotation size cookie for a given subtask. + * + * @param cookie_value Cookie value to set. + * @param subtask Subtask to set the cookie for. + */ + public static set_size_cookie( + cookie_value: number, + subtask: ULabelSubtask, + ) { + const cookie_name = AnnotationSizeCookie.cookie_name(subtask); + const d = new Date(); + d.setTime(d.getTime() + (10000 * 24 * 60 * 60 * 1000)); + + document.cookie = `${cookie_name}=${cookie_value};expires=${d.toUTCString()};path=/`; + } + + /** + * Retrieve the annotation size cookie for a given subtask, if it exists. + * Resolves NaN to null. + * + * @param subtask Subtask to read the cookie for. + * @returns The cookie value if it exists, otherwise null. + */ + public static read_size_cookie(subtask: ULabelSubtask): number | null { + const cookie_name = AnnotationSizeCookie.cookie_name(subtask); + console.log(cookie_name); + const cookie_array = document.cookie.split(";"); + + for (let cookie of cookie_array) { + // Trim whitespace at the beginning + cookie = cookie.trim(); + if (cookie.startsWith(cookie_name)) { + let cookie_value = parseInt(cookie.split("=")[1]); + if (cookie_value === undefined || isNaN(cookie_value)) { + cookie_value = null; + } + return cookie_value; + } + }; + + return null; + } +} diff --git a/src/index.js b/src/index.js index a6294ec1..936d24a6 100644 --- a/src/index.js +++ b/src/index.js @@ -481,18 +481,20 @@ export class ULabel { `); return { - container_id: arguments[0], // Required - image_data: arguments[1], // Required - username: arguments[2], // Required - submit_buttons: arguments[3], // Required - subtasks: arguments[4], // Required - task_meta: arguments[5] ?? null, // Use default if optional argument is undefined - annotation_meta: arguments[6] ?? null, // Use default if optional argument is undefined - px_per_px: arguments[7] ?? 1, // Use default if optional argument is undefined - initial_crop: arguments[8] ?? null, // Use default if optional argument is undefined - initial_line_size: arguments[9] ?? null, // Use default if optional argument is undefined - config_data: arguments[10] ?? null, // Use default if optional argument is undefined - toolbox_order: arguments[11] ?? null, // Use default if optional argument is undefined + // Required arguments + container_id: arguments[0], + image_data: arguments[1], + username: arguments[2], + submit_buttons: arguments[3], + subtasks: arguments[4], + // Optional arguments + task_meta: arguments[5] ?? null, + annotation_meta: arguments[6] ?? null, + px_per_px: arguments[7] ?? 1, + initial_crop: arguments[8] ?? null, + initial_line_size: arguments[9] ?? null, + config_data: arguments[10] ?? null, + toolbox_order: arguments[11] ?? null, }; } @@ -570,6 +572,15 @@ export class ULabel { this.color_info = {}; ULabel.initialize_subtasks(this); + // Build entry for `this.drag_state` + const build_drag_state_entry = () => { + return { + mouse_start: null, // Screen coordinates where the current mouse drag started + offset_start: null, // Scroll values where the current mouse drag started + zoom_val_start: null, // zoom_val when the dragging interaction started + }; + }; + // Create object for dragging interaction state // TODO(v1) // There can only be one drag, yes? Maybe pare this down... @@ -577,41 +588,13 @@ export class ULabel { this.drag_state = { active_key: null, release_button: null, - annotation: { - mouse_start: null, // Screen coordinates where the current mouse drag started - offset_start: null, // Scroll values where the current mouse drag started - zoom_val_start: null, // zoom_val when the dragging interaction started - }, - brush: { - mouse_start: null, // Screen coordinates where the current mouse drag started - offset_start: null, // Scroll values where the current mouse drag started - zoom_val_start: null, // zoom_val when the dragging interaction started - }, - edit: { - mouse_start: null, // Screen coordinates where the current mouse drag started - offset_start: null, // Scroll values where the current mouse drag started - zoom_val_start: null, // zoom_val when the dragging interaction started - }, - pan: { - mouse_start: null, // Screen coordinates where the current mouse drag started - offset_start: null, // Scroll values where the current mouse drag started - zoom_val_start: null, // zoom_val when the dragging interaction started - }, - zoom: { - mouse_start: null, // Screen coordinates where the current mouse drag started - offset_start: null, // Scroll values where the current mouse drag started - zoom_val_start: null, // zoom_val when the dragging interaction started - }, - move: { - mouse_start: null, // Screen coordinates where the current mouse drag started - offset_start: null, // Scroll values where the current mouse drag started - zoom_val_start: null, // zoom_val when the dragging interaction started - }, - right: { - mouse_start: null, // Screen coordinates where the current mouse drag started - offset_start: null, // Scroll values where the current mouse drag started - zoom_val_start: null, // zoom_val when the dragging interaction started - }, + annotation: build_drag_state_entry(), + brush: build_drag_state_entry(), + edit: build_drag_state_entry(), + pan: build_drag_state_entry(), + zoom: build_drag_state_entry(), + move: build_drag_state_entry(), + right: build_drag_state_entry(), }; for (const st in this.subtasks) { diff --git a/src/toolbox.ts b/src/toolbox.ts index 2c55e63e..f741b00c 100644 --- a/src/toolbox.ts +++ b/src/toolbox.ts @@ -24,6 +24,7 @@ import { get_local_storage_item, set_local_storage_item, } from "./utilities"; +import { AnnotationSizeCookie } from "./cookies"; // For ResizeToolboxItem enum ValidResizeValues { @@ -1171,8 +1172,8 @@ export class AnnotationResizeItem extends ToolboxItem { // that the annotation was saved as. for (const subtask in ulabel.subtasks) { const cached_size_property = ulabel.subtasks[subtask].display_name.replaceLowerConcat(" ", "-", "-cached-size"); - const size_cookie = this.read_size_cookie(ulabel.subtasks[subtask]); - if ((size_cookie != null) && size_cookie != "NaN") { + const size_cookie = AnnotationSizeCookie.read_size_cookie(ulabel.subtasks[subtask]); + if (size_cookie != null) { this.update_annotation_size(ulabel, ulabel.subtasks[subtask], Number(size_cookie)); this[cached_size_property] = Number(size_cookie); } else if (ulabel.config.default_annotation_size != undefined) { @@ -1420,7 +1421,8 @@ export class AnnotationResizeItem extends ToolboxItem { } if (subtask.annotations.ordering.length > 0) { - this.set_size_cookie(subtask.annotations.access[subtask.annotations.ordering[0]].line_size, subtask); + const cst_line_size = subtask.annotations.access[subtask.annotations.ordering[0]].line_size; + AnnotationSizeCookie.set_size_cookie(cst_line_size, subtask); } } @@ -1431,38 +1433,6 @@ export class AnnotationResizeItem extends ToolboxItem { } } - private set_size_cookie(cookie_value, subtask) { - const d = new Date(); - d.setTime(d.getTime() + (10000 * 24 * 60 * 60 * 1000)); - - const subtask_name = subtask.display_name.replaceLowerConcat(" ", "_"); - - document.cookie = subtask_name + "_size=" + cookie_value + ";" + d.toUTCString() + ";path=/"; - } - - private read_size_cookie(subtask) { - const subtask_name = subtask.display_name.replaceLowerConcat(" ", "_"); - - const cookie_name = subtask_name + "_size="; - - const cookie_array = document.cookie.split(";"); - - for (let i = 0; i < cookie_array.length; i++) { - let current_cookie = cookie_array[i]; - - // while there's whitespace at the front of the cookie, loop through and remove it - while (current_cookie.charAt(0) == " ") { - current_cookie = current_cookie.substring(1); - } - - if (current_cookie.indexOf(cookie_name) == 0) { - return current_cookie.substring(cookie_name.length, current_cookie.length); - } - } - - return null; - } - public get_html() { return `