Skip to content
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
62 changes: 62 additions & 0 deletions src/cookies.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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.
Expand Down Expand Up @@ -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;
}
}
77 changes: 30 additions & 47 deletions src/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -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,
};
}

Expand Down Expand Up @@ -570,48 +572,29 @@ 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...
// Would be nice to consolidate this with global state also
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) {
Expand Down
46 changes: 8 additions & 38 deletions src/toolbox.ts
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ import {
get_local_storage_item,
set_local_storage_item,
} from "./utilities";
import { AnnotationSizeCookie } from "./cookies";

// For ResizeToolboxItem
enum ValidResizeValues {
Expand Down Expand Up @@ -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) {
Expand Down Expand Up @@ -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);
}
}

Expand All @@ -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 `
<div class="annotation-resize">
Expand Down Expand Up @@ -2057,13 +2027,13 @@ export class FilterPointDistanceFromRow extends ToolboxItem {
// Check if localStorage has a value for showing the overlay
const show_overlay = get_local_storage_item("filterDistanceShowOverlay");
// Guard against null values
this.show_overlay = show_overlay !== null ? show_overlay : this.show_overlay;
this.show_overlay = show_overlay ?? this.show_overlay;
this.overlay.update_display_overlay(this.show_overlay);

// Check if localStorage has a value for filtering during polyline move
const filter_during_polyline_move = get_local_storage_item("filterDistanceFilterDuringPolylineMove");
// Guard against null values
this.filter_during_polyline_move = filter_during_polyline_move !== null ? filter_during_polyline_move : this.filter_during_polyline_move;
this.filter_during_polyline_move = filter_during_polyline_move ?? this.filter_during_polyline_move;

this.add_styles();

Expand Down Expand Up @@ -2519,7 +2489,7 @@ export class SubmitButtons extends ToolboxItem {
const submit_buttons_by_row: ULabelSubmitButton[][] = [];
// First, get all the unique row numbers.
// If a button doesn't have a row number, it will be placed in row 0.
const row_numbers: Set<number> = new Set(this.submit_buttons.map((button) => button.row_number ? button.row_number : 0));
const row_numbers: Set<number> = new Set(this.submit_buttons.map((button) => button.row_number ?? 0));
// Sort the row numbers
const sorted_row_numbers: number[] = Array.from(row_numbers).sort((a, b) => a - b);
// Group the buttons by row number in ascending order
Expand Down
Loading