wangchunlin
/
cvat
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Selectors for annotation formats (#636)

Browse Source 
* Selectors for annotation format

* Handle default value

* Dinamic accepts for upload

* Removed extra code
main
Boris Sekachev 7 years ago committed by Nikita Manovich
parent f797d3ac53
commit 6cac464f46
3 changed files with 93 additions and 93 deletions
Show Stats Download Patch File Download Diff File

81
cvat/apps/dashboard/static/dashboard/js/dashboard.js
Unescape Escape View File

@ -77,22 +77,21 @@ class TaskView {
_upload(uploadAnnotationButton, format) { _upload(uploadAnnotationButton, format) {
const button = $(uploadAnnotationButton); const button = $(uploadAnnotationButton);
$('<input type="file" accept="text/xml">').on('change', async (onChangeEvent) => { $(`<input type="file" accept=".${format.format}">`)
const file = onChangeEvent.target.files[0]; .on('change', async (onChangeEvent) => {
$(onChangeEvent.target).remove(); const file = onChangeEvent.target.files[0];
if (file) { $(onChangeEvent.target).remove();
button.text('Uploading..'); if (file) {
button.prop('disabled', true); button.prop('disabled', true);
try { try {
await this._task.annotations.upload(file, format); await this._task.annotations.upload(file, format);
} catch (error) { } catch (error) {
showMessage(error.message); showMessage(error.message);
} finally { } finally {
button.prop('disabled', false); button.prop('disabled', false);
button.text('Upload Annotation'); }
} }
} }).click();
}).click();
} }
async _dump(button, format) { async _dump(button, format) {
@ -131,47 +130,45 @@ class TaskView {
); );
const buttonsContainer = $('<div class="dashboardButtonsUI"> </div>').appendTo(this._UI); const buttonsContainer = $('<div class="dashboardButtonsUI"> </div>').appendTo(this._UI);
const downloadButton = $('<select class="regular dashboardButtonUI"'
+ 'style="text-align-last: center;"> Dump Annotation </select>');
$('<option selected disabled> Dump Annotation </option>').appendTo(downloadButton);
const downloadButton = $('<button class="regular dashboardButtonUI"> Dump Annotation </button>'); const uploadButton = $('<select class="regular dashboardButtonUI"'
const dropdownDownloadMenu = $('<ul class="dropdown-content hidden"></ul>'); + 'style="text-align-last: center;"> Upload Annotation </select>');
$('<option selected disabled> Upload Annotation </option>').appendTo(uploadButton);
const uploadButton = $('<button class="regular dashboardButtonUI"> Upload Annotation </button>'); const dumpers = {};
const dropdownUploadMenu = $('<ul class="dropdown-content hidden"></ul>'); const loaders = {};
for (const format of this._annotationFormats) { for (const format of this._annotationFormats) {
for (const dumper of format.dumpers) { for (const dumper of format.dumpers) {
const listItem = $(`<li>${dumper.name}</li>`).on('click', () => { dumpers[dumper.name] = dumper;
dropdownDownloadMenu.addClass('hidden'); const item = $(`<option>${dumper.name}</li>`);
this._dump(downloadButton[0], dumper);
});
if (isDefaultFormat(dumper.name, this._task.mode)) { if (isDefaultFormat(dumper.name, this._task.mode)) {
listItem.addClass('bold'); item.addClass('bold');
} }
dropdownDownloadMenu.append(listItem); item.appendTo(downloadButton);
} }
for (const loader of format.loaders) { for (const loader of format.loaders) {
dropdownUploadMenu.append($(`<li>${loader.name}</li>`).on('click', () => { loaders[loader.name] = loader;
dropdownUploadMenu.addClass('hidden'); $(`<option>${loader.name}</li>`).appendTo(uploadButton);
userConfirm('The current annotation will be lost. Are you sure?', () => {
this._upload(uploadButton, loader);
});
}));
} }
} }
$('<div class="dropdown"></div>').append( downloadButton.on('change', (e) => {
downloadButton.on('click', () => { this._dump(e.target, dumpers[e.target.value]);
dropdownDownloadMenu.toggleClass('hidden'); downloadButton.prop('value', 'Dump Annotation');
}), });
).append(dropdownDownloadMenu).appendTo(buttonsContainer);
$('<div class="dropdown"></div>').append( uploadButton.on('change', (e) => {
uploadButton.on('click', () => { this._upload(e.target, loaders[e.target.value]);
dropdownUploadMenu.toggleClass('hidden'); uploadButton.prop('value', 'Upload Annotation');
}), });
).append(dropdownUploadMenu).appendTo(buttonsContainer);
downloadButton.appendTo(buttonsContainer);
uploadButton.appendTo(buttonsContainer);
$('<button class="regular dashboardButtonUI"> Update Task </button>').on('click', () => { $('<button class="regular dashboardButtonUI"> Update Task </button>').on('click', () => {
this._update(); this._update();

89
cvat/apps/engine/static/engine/js/annotationUI.js
Unescape Escape View File

@ -67,16 +67,16 @@ function blurAllElements() {
function uploadAnnotation(jobId, shapeCollectionModel, historyModel, annotationSaverModel, function uploadAnnotation(jobId, shapeCollectionModel, historyModel, annotationSaverModel,
uploadAnnotationButton, format) { uploadAnnotationButton, format) {
$('#annotationFileSelector').attr('accept', `.${format.format}`);
$('#annotationFileSelector').one('change', async (changedFileEvent) => { $('#annotationFileSelector').one('change', async (changedFileEvent) => {
const file = changedFileEvent.target.files['0']; const file = changedFileEvent.target.files['0'];
changedFileEvent.target.value = ''; changedFileEvent.target.value = '';
if (!file) return; if (!file) return;
uploadAnnotationButton.text('Uploading..');
uploadAnnotationButton.prop('disabled', true); uploadAnnotationButton.prop('disabled', true);
const annotationData = new FormData(); const annotationData = new FormData();
annotationData.append('annotation_file', file); annotationData.append('annotation_file', file);
try { try {
await uploadJobAnnotationRequest(jobId, annotationData, format); await uploadJobAnnotationRequest(jobId, annotationData, format.display_name);
historyModel.empty(); historyModel.empty();
shapeCollectionModel.empty(); shapeCollectionModel.empty();
const data = await $.get(`/api/v1/jobs/${jobId}/annotations`); const data = await $.get(`/api/v1/jobs/${jobId}/annotations`);
@ -87,7 +87,6 @@ function uploadAnnotation(jobId, shapeCollectionModel, historyModel, annotationS
showMessage(error.message); showMessage(error.message);
} finally { } finally {
uploadAnnotationButton.prop('disabled', false); uploadAnnotationButton.prop('disabled', false);
uploadAnnotationButton.text('Upload Annotation');
} }
}).click(); }).click();
} }
@ -388,56 +387,59 @@ function setupMenu(job, task, shapeCollectionModel,
$('#settingsButton').attr('title', ` $('#settingsButton').attr('title', `
${shortkeys.open_settings.view_value} - ${shortkeys.open_settings.description}`); ${shortkeys.open_settings.view_value} - ${shortkeys.open_settings.description}`);
const downloadButton = $('#downloadAnnotationButton');
const uploadButton = $('#uploadAnnotationButton');
const loaders = {};
for (const format of annotationFormats) { for (const format of annotationFormats) {
for (const dumpSpec of format.dumpers) { for (const dumper of format.dumpers) {
const listItem = $(`<li>${dumpSpec.display_name}</li>`).on('click', async () => { const item = $(`<option>${dumper.display_name}</li>`);
$('#downloadAnnotationButton')[0].disabled = true;
$('#downloadDropdownMenu').addClass('hidden'); if (!isDefaultFormat(dumper.display_name, window.cvat.job.mode)) {
try { item.addClass('regular');
await dumpAnnotationRequest(task.id, task.name, dumpSpec.display_name);
} catch (error) {
showMessage(error.message);
} finally {
$('#downloadAnnotationButton')[0].disabled = false;
}
});
if (isDefaultFormat(dumpSpec.display_name, task.mode)) {
listItem.addClass('bold');
} }
$('#downloadDropdownMenu').append(listItem);
item.appendTo(downloadButton);
} }
for (const loader of format.loaders) { for (const loader of format.loaders) {
$(`<li>${loader.display_name}</li>`).on('click', async () => { loaders[loader.display_name] = loader;
$('#uploadAnnotationButton')[0].disabled = true; $(`<option class="regular">${loader.display_name}</li>`).appendTo(uploadButton);
$('#uploadDropdownMenu').addClass('hidden');
try {
userConfirm('Current annotation will be removed from the client. Continue?',
async () => {
await uploadAnnotation(
job.id,
shapeCollectionModel,
historyModel,
annotationSaverModel,
$('#uploadAnnotationButton'),
loader.display_name,
);
});
} catch (error) {
showMessage(error.message);
} finally {
$('#uploadAnnotationButton')[0].disabled = false;
}
}).appendTo('#uploadDropdownMenu');
} }
} }
$('#downloadAnnotationButton').on('click', () => { downloadButton.on('change', async (e) => {
$('#downloadDropdownMenu').toggleClass('hidden'); const dumper = e.target.value;
downloadButton.prop('value', 'Dump Annotation');
try {
downloadButton.prop('disabled', true);
await dumpAnnotationRequest(task.id, task.name, dumper);
} catch (error) {
showMessage(error.message);
} finally {
downloadButton.prop('disabled', false);
}
}); });
$('#uploadAnnotationButton').on('click', () => { uploadButton.on('change', (e) => {
$('#uploadDropdownMenu').toggleClass('hidden'); const loader = loaders[e.target.value];
uploadButton.prop('value', 'Upload Annotation');
userConfirm('Current annotation will be removed from the client. Continue?',
async () => {
try {
await uploadAnnotation(
job.id,
shapeCollectionModel,
historyModel,
annotationSaverModel,
$('#uploadAnnotationButton'),
loader,
);
} catch (error) {
showMessage(error.message);
}
});
}); });
$('#removeAnnotationButton').on('click', () => { $('#removeAnnotationButton').on('click', () => {
@ -496,6 +498,7 @@ function buildAnnotationUI(jobData, taskData, imageMetaData, annotationData, ann
z_order: taskData.z_order, z_order: taskData.z_order,
id: jobData.id, id: jobData.id,
task_id: taskData.id, task_id: taskData.id,
mode: taskData.mode,
images: imageMetaData, images: imageMetaData,
}, },
search: { search: {

16
cvat/apps/engine/templates/engine/annotation.html
Unescape Escape View File

@ -330,14 +330,14 @@
<div id="annotationMenu" class="hidden regular"> <div id="annotationMenu" class="hidden regular">
<center style="float:left; width: 28%; height: 100%;" id="engineMenuButtons"> <center style="float:left; width: 28%; height: 100%;" id="engineMenuButtons">
<div class="dropdown"> <select id="downloadAnnotationButton" class="menuButton semiBold h2" style="text-align-last: center;">
<button id="downloadAnnotationButton" class="menuButton semiBold h2"> Dump Annotation </button> <option selected disabled> Dump Annotation </option>
<ul id="downloadDropdownMenu" class="dropdown-content hidden"></ul> </select>
</div>
<div class="dropdown"> <select id="uploadAnnotationButton" class="menuButton semiBold h2" style="text-align-last: center;">
<button id="uploadAnnotationButton" class="menuButton semiBold h2"> Upload Annotation </button> <option selected disabled> Upload Annotation </option>
<ul id="uploadDropdownMenu" class="dropdown-content hidden"></ul> </select>
</div>
<button id="removeAnnotationButton" class="menuButton semiBold h2"> Remove Annotation </button> <button id="removeAnnotationButton" class="menuButton semiBold h2"> Remove Annotation </button>
<button id="settingsButton" class="menuButton semiBold h2"> Settings </button> <button id="settingsButton" class="menuButton semiBold h2"> Settings </button>
<button id="fullScreenButton" class="menuButton semiBold h2"> Fullscreen Player </button> <button id="fullScreenButton" class="menuButton semiBold h2"> Fullscreen Player </button>

Write Preview
Loading…
Cancel
Save