Skip to content

Annotation resize tbi #52

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
joshua-dean merged 13 commits into from
Mar 14, 2022
Merged

Annotation resize tbi #52

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
13 commits
Select commit Hold shift + click to select a range
2e91b4c
Added annotation resize item
CarterSolberg Feb 17, 2022
f3474e5
added redraw
CarterSolberg Feb 17, 2022
c8c2d76
updated switch in resize annotations
CarterSolberg Feb 17, 2022
2d0f180
Auto CLRF test.
joshua-dean Feb 17, 2022
e25c534
Fixed for loops for annotation resizing.
joshua-dean Feb 17, 2022
b1eebca
Fixed case statement fallthrough.
joshua-dean Feb 17, 2022
7006ee6
added css for annotation resize
CarterSolberg Feb 23, 2022
760d5bd
Fixed div referencing in blob.js
joshua-dean Feb 23, 2022
6e1fe24
Added CSS
CarterSolberg Feb 23, 2022
d3e7ddb
added missing " in annotation-resize tb-header, and added test p to a…
CarterSolberg Feb 23, 2022
48a9b8c
Added css for annotation-resize
CarterSolberg Feb 27, 2022
55cc6ee
Added gitattributes file.
joshua-dean Mar 14, 2022
7cf1e0e
Fix line endings.
joshua-dean Mar 14, 2022
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
1 change: 1 addition & 0 deletions .gitattributes
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
* text=auto eol=lf
121 changes: 118 additions & 3 deletions dist/ulabel.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11894,7 +11894,7 @@ var __extends = (this && this.__extends) || (function () {
};
})();
Object.defineProperty(exports, "__esModule", ({ value: true }));
exports.ClassCounterToolboxItem = exports.AnnotationIDToolboxItem = exports.LinestyleToolboxItem = exports.ZoomPanToolboxItem = exports.ModeSelectionToolboxItem = exports.ToolboxItem = exports.ToolboxTab = exports.Toolbox = void 0;
exports.AnnotationResizeItem = exports.ClassCounterToolboxItem = exports.AnnotationIDToolboxItem = exports.LinestyleToolboxItem = exports.ZoomPanToolboxItem = exports.ModeSelectionToolboxItem = exports.ToolboxItem = exports.ToolboxTab = exports.Toolbox = void 0;
var toolboxDividerDiv = "<div class=toolbox-divider></div>";
/**
* Manager for toolbox. Contains ToolboxTab items.
Expand Down Expand Up @@ -12093,6 +12093,68 @@ var ClassCounterToolboxItem = /** @class */ (function (_super) {
return ClassCounterToolboxItem;
}(ToolboxItem));
exports.ClassCounterToolboxItem = ClassCounterToolboxItem;
/**
* Toolbox item for resizing all annotations
*/
var AnnotationResizeItem = /** @class */ (function (_super) {
__extends(AnnotationResizeItem, _super);
function AnnotationResizeItem(ulabel) {
var _this = _super.call(this) || this;
_this.inner_HTML = "<p class=\"tb-header\">Annotation Count</p>";
$(document).on("click", "a.butt-ann", function (e) {
var button = $(e.currentTarget);
var current_subtask_key = ulabel.state["current_subtask"];
var current_subtask = ulabel.subtasks[current_subtask_key];
var annotation_size = button.attr("id").slice(-1);
_this.update_annotation_size(current_subtask, annotation_size);
ulabel.redraw_all_annotations(null, null, false);
});
return _this;
}
//recieives a string of 's','m', 'l', '-', or '+' depending on which button was pressed
AnnotationResizeItem.prototype.update_annotation_size = function (subtask, size) {
var small_size = 5;
var medium_size = 9;
var large_size = 13;
var increment_size = 2;
if (subtask == null)
return;
switch (size) {
case 's':
for (var annotation_id in subtask.annotations.access) {
subtask.annotations.access[annotation_id].line_size = small_size;
}
break;
case 'm':
for (var annotation_id in subtask.annotations.access) {
subtask.annotations.access[annotation_id].line_size = medium_size;
}
break;
case 'l':
for (var annotation_id in subtask.annotations.access) {
subtask.annotations.access[annotation_id].line_size = large_size;
}
break;
case '-':
for (var annotation_id in subtask.annotations.access) {
subtask.annotations.access[annotation_id].line_size -= increment_size;
}
break;
case '+':
for (var annotation_id in subtask.annotations.access) {
subtask.annotations.access[annotation_id].line_size += increment_size;
}
break;
default:
return;
}
};
AnnotationResizeItem.prototype.get_html = function () {
return "\n <div class=\"annotation-resize\">\n <p class=\"tb-header\">Change Annotation Size</p>\n <div class=\"annotation-resize-button-holder\">\n <span class=\"annotation-inc\">\n <a href=\"#\" class=\"butt-ann\" id=\"annotation-resize--\">-</a>\n </span>\n <span class=\"annotation-size\">\n <a href=\"#\" class=\"butt-ann\" id=\"annotation-resize-s\">Small</a>\n <a href=\"#\" class=\"butt-ann\" id=\"annotation-resize-m\">Medium</a>\n <a href=\"#\" class=\"butt-ann\" id=\"annotation-resize-l\">Large</a>\n </span>\n <span class=\"annotation-inc\">\n <a href=\"#\" class=\"butt-ann\" id=\"annotation-resize-+\">+</a>\n </span>\n </div>\n </div>\n ";
};
return AnnotationResizeItem;
}(ToolboxItem));
exports.AnnotationResizeItem = AnnotationResizeItem;
// export class WholeImageClassifierToolboxTab extends ToolboxItem {
// constructor() {
// super(
Expand Down Expand Up @@ -13914,6 +13976,58 @@ div#${prntid}.ulabel-night span.spokes {
/* border: 1px solid black; */
}

/* === Annotation Resize === */


div#${prntid} div.annotation-resize {
padding: 10px 30px;
}

div#${prntid} div.annotation-resize p.tb-header {
margin: 0;
margin-bottom: 5px;
}

div#${prntid} div.annotation-resize {
display: block;
}

div#${prntid} div.annotation-resize-button-holder {
vertical-align: middle;
margin: 0 auto;
}

div#${prntid} div.annotation-resize a.butt-ann {
display: inline-block;
margin: auto;
color: white;
background-color: lightgray;
border: 1px solid rgb(168, 168, 168);
border-radius: 11px;
text-decoration: none;
text-align: center;
line-height: 20px;
transition: all 0.2s;
}

div#${prntid} div.annotation-resize span.annotation-size a.butt-ann {
font-size: 0.9em;
text-shadow: 0 0.04em 0.04em rgba(0,0,0,0.45);
padding: 10px 5px;
margin: 0 2px;
}

div#${prntid} div.annotation-resize span.annotation-inc a.butt-ann {
width: 20px;
height: 20px;
}

div#${prntid} div.annotation-resize a:hover {
border: 1px solid black;
box-shadow: 1px 1px 4px rgba(204, 204, 204, 0.9);
background-color:rgba(100, 148, 237, 0.486);
}

div#${prntid} div.zpcont {
height: 90px;
position: relative;
Expand Down Expand Up @@ -14643,10 +14757,11 @@ class ULabel {
);
const annotation_id_tbi = new src_toolbox.AnnotationIDToolboxItem(instructions);
const class_counter_tbi = new src_toolbox.ClassCounterToolboxItem();
const annotaion_resize_tbi = new src_toolbox.AnnotationResizeItem(ul);

const toolbox = new src_toolbox.Toolbox(
[],
[mode_select_tbi, zoom_pan_tbi, linestyle_tbi, annotation_id_tbi, class_counter_tbi],
[mode_select_tbi, zoom_pan_tbi, linestyle_tbi, annotaion_resize_tbi, annotation_id_tbi, class_counter_tbi],
);


Expand Down Expand Up @@ -14691,7 +14806,7 @@ class ULabel {
if (jquery_default()("#" + ul.config["toolbox_id"] + " .toolbox_inner_cls").height() > jquery_default()("#" + ul.config["container_id"]).height()) {
jquery_default()("#" + ul.config["toolbox_id"]).css("overflow-y", "scroll");
}

ul.toolbox = toolbox;

}
Expand Down
1 change: 1 addition & 0 deletions index.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -83,5 +83,6 @@ export class ULabel {
public get_annotations(subtask: ULabelSubtask): ULabelAnnotation[];
public set_annotations(annotations: ULabelAnnotation[], subtask: ULabelSubtask);
public set_saved(saved: boolean);
public redraw_all_annotations(subtask: any, offset:any, spatial_only: any);

}
52 changes: 52 additions & 0 deletions src/blobs.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1719,6 +1719,58 @@ div#${prntid}.ulabel-night span.spokes {
/* border: 1px solid black; */
}

/* === Annotation Resize === */


div#${prntid} div.annotation-resize {
padding: 10px 30px;
}

div#${prntid} div.annotation-resize p.tb-header {
margin: 0;
margin-bottom: 5px;
}

div#${prntid} div.annotation-resize {
display: block;
}

div#${prntid} div.annotation-resize-button-holder {
vertical-align: middle;
margin: 0 auto;
}

div#${prntid} div.annotation-resize a.butt-ann {
display: inline-block;
margin: auto;
color: white;
background-color: lightgray;
border: 1px solid rgb(168, 168, 168);
border-radius: 11px;
text-decoration: none;
text-align: center;
line-height: 20px;
transition: all 0.2s;
}

div#${prntid} div.annotation-resize span.annotation-size a.butt-ann {
font-size: 0.9em;
text-shadow: 0 0.04em 0.04em rgba(0,0,0,0.45);
padding: 10px 5px;
margin: 0 2px;
}

div#${prntid} div.annotation-resize span.annotation-inc a.butt-ann {
width: 20px;
height: 20px;
}

div#${prntid} div.annotation-resize a:hover {
border: 1px solid black;
box-shadow: 1px 1px 4px rgba(204, 204, 204, 0.9);
background-color:rgba(100, 148, 237, 0.486);
}

div#${prntid} div.zpcont {
height: 90px;
position: relative;
Expand Down
7 changes: 4 additions & 3 deletions src/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ Sentera Inc.
*/
import { ULabelAnnotation } from './annotation';
import { Toolbox, ClassCounterToolboxItem, ModeSelectionToolboxItem, ZoomPanToolboxItem, LinestyleToolboxItem } from './toolbox';
import { AnnotationIDToolboxItem } from './toolbox';
import { AnnotationIDToolboxItem, AnnotationResizeItem } from './toolbox';
import { ULabelSubtask } from './subtask';
import { GeometricUtils } from './geometric_utils';
import $ from 'jquery';
Expand Down Expand Up @@ -263,10 +263,11 @@ export class ULabel {
);
const annotation_id_tbi = new AnnotationIDToolboxItem(instructions);
const class_counter_tbi = new ClassCounterToolboxItem();
const annotaion_resize_tbi = new AnnotationResizeItem(ul);

const toolbox = new Toolbox(
[],
[mode_select_tbi, zoom_pan_tbi, linestyle_tbi, annotation_id_tbi, class_counter_tbi],
[mode_select_tbi, zoom_pan_tbi, linestyle_tbi, annotaion_resize_tbi, annotation_id_tbi, class_counter_tbi],
);


Expand Down Expand Up @@ -311,7 +312,7 @@ export class ULabel {
if ($("#" + ul.config["toolbox_id"] + " .toolbox_inner_cls").height() > $("#" + ul.config["container_id"]).height()) {
$("#" + ul.config["toolbox_id"]).css("overflow-y", "scroll");
}

ul.toolbox = toolbox;

}
Expand Down
2 changes: 1 addition & 1 deletion src/subtask.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ export class ULabelSubtask {
public task_meta: any,
public annotation_meta: any,
public read_only?: boolean,
public inactivate_opacity: number = 0.4
public inactivate_opacity: number = 0.4
) {
this.actions = {
"stream": [],
Expand Down
64 changes: 63 additions & 1 deletion src/toolbox.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ var __extends = (this && this.__extends) || (function () {
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
exports.ClassCounterToolboxItem = exports.AnnotationIDToolboxItem = exports.LinestyleToolboxItem = exports.ZoomPanToolboxItem = exports.ModeSelectionToolboxItem = exports.ToolboxItem = exports.ToolboxTab = exports.Toolbox = void 0;
exports.AnnotationResizeItem = exports.ClassCounterToolboxItem = exports.AnnotationIDToolboxItem = exports.LinestyleToolboxItem = exports.ZoomPanToolboxItem = exports.ModeSelectionToolboxItem = exports.ToolboxItem = exports.ToolboxTab = exports.Toolbox = void 0;
var toolboxDividerDiv = "<div class=toolbox-divider></div>";
/**
* Manager for toolbox. Contains ToolboxTab items.
Expand Down Expand Up @@ -214,6 +214,68 @@ var ClassCounterToolboxItem = /** @class */ (function (_super) {
return ClassCounterToolboxItem;
}(ToolboxItem));
exports.ClassCounterToolboxItem = ClassCounterToolboxItem;
/**
* Toolbox item for resizing all annotations
*/
var AnnotationResizeItem = /** @class */ (function (_super) {
__extends(AnnotationResizeItem, _super);
function AnnotationResizeItem(ulabel) {
var _this = _super.call(this) || this;
_this.inner_HTML = "<p class=\"tb-header\">Annotation Count</p>";
$(document).on("click", "a.butt-ann", function (e) {
var button = $(e.currentTarget);
var current_subtask_key = ulabel.state["current_subtask"];
var current_subtask = ulabel.subtasks[current_subtask_key];
var annotation_size = button.attr("id").slice(-1);
_this.update_annotation_size(current_subtask, annotation_size);
ulabel.redraw_all_annotations(null, null, false);
});
return _this;
}
//recieives a string of 's','m', 'l', '-', or '+' depending on which button was pressed
AnnotationResizeItem.prototype.update_annotation_size = function (subtask, size) {
var small_size = 5;
var medium_size = 9;
var large_size = 13;
var increment_size = 2;
if (subtask == null)
return;
switch (size) {
case 's':
for (var annotation_id in subtask.annotations.access) {
subtask.annotations.access[annotation_id].line_size = small_size;
}
break;
case 'm':
for (var annotation_id in subtask.annotations.access) {
subtask.annotations.access[annotation_id].line_size = medium_size;
}
break;
case 'l':
for (var annotation_id in subtask.annotations.access) {
subtask.annotations.access[annotation_id].line_size = large_size;
}
break;
case '-':
for (var annotation_id in subtask.annotations.access) {
subtask.annotations.access[annotation_id].line_size -= increment_size;
}
break;
case '+':
for (var annotation_id in subtask.annotations.access) {
subtask.annotations.access[annotation_id].line_size += increment_size;
}
break;
default:
return;
}
};
AnnotationResizeItem.prototype.get_html = function () {
return "\n <div class=\"annotation-resize\">\n <p class=\"tb-header\">Change Annotation Size</p>\n <div class=\"annotation-resize-button-holder\">\n <span class=\"annotation-inc\">\n <a href=\"#\" class=\"butt-ann\" id=\"annotation-resize--\">-</a>\n </span>\n <span class=\"annotation-size\">\n <a href=\"#\" class=\"butt-ann\" id=\"annotation-resize-s\">Small</a>\n <a href=\"#\" class=\"butt-ann\" id=\"annotation-resize-m\">Medium</a>\n <a href=\"#\" class=\"butt-ann\" id=\"annotation-resize-l\">Large</a>\n </span>\n <span class=\"annotation-inc\">\n <a href=\"#\" class=\"butt-ann\" id=\"annotation-resize-+\">+</a>\n </span>\n </div>\n </div>\n ";
};
return AnnotationResizeItem;
}(ToolboxItem));
exports.AnnotationResizeItem = AnnotationResizeItem;
// export class WholeImageClassifierToolboxTab extends ToolboxItem {
// constructor() {
// super(
Expand Down
Loading