From aa1133ece80779e94685dc6017426e8f33fee034 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lo=C3=AFs=20Poujade?= <lois.poujade@tetras-libre.fr>
Date: Thu, 5 May 2022 09:15:26 +0200
Subject: [PATCH] Fix mosaic label filters
---
capsule-prototype/css/common.css | 4 ++
capsule-prototype/css/mosaic.css | 1 +
capsule-prototype/index.html | 55 -----------------------
capsule-prototype/js/MosaicPanelWidget.js | 13 +++---
capsule-prototype/js/PopupPanelWidget.js | 12 +++--
capsule-prototype/js/online-script.js | 27 -----------
6 files changed, 21 insertions(+), 91 deletions(-)
diff --git a/capsule-prototype/css/common.css b/capsule-prototype/css/common.css
index f4cb370..959c244 100644
--- a/capsule-prototype/css/common.css
+++ b/capsule-prototype/css/common.css
@@ -23,3 +23,7 @@
content: "\2713 ";
color: black;
}
+
+input.warning, *.warning {
+ border: 2px solid red;
+}
diff --git a/capsule-prototype/css/mosaic.css b/capsule-prototype/css/mosaic.css
index a54def1..7d0809f 100644
--- a/capsule-prototype/css/mosaic.css
+++ b/capsule-prototype/css/mosaic.css
@@ -30,6 +30,7 @@
}
.mosaic_filter_item, .mosaic_label_filter {
+ min-width: min-content;
width: var(--filter-width);
height: var(--filter-height);
margin: var(--base-spacing);
diff --git a/capsule-prototype/index.html b/capsule-prototype/index.html
index 1f72e94..74e3481 100644
--- a/capsule-prototype/index.html
+++ b/capsule-prototype/index.html
@@ -135,61 +135,6 @@
<div class="editmode" id="popupEditSupprimer">Delete file</div>
</td>
<td id="popupRight">
- <div id="closePopupEdit">✕</div>
-
- <div class="popupRightItem" id="popupNom"></div>
- <input class="popupInput" id="popupNomInput" type="text" value=""/>
-
- <div class="popupRightItem" id="popupAuthor" title="Author"></div>
- <input class="popupInput" id="popupAuthorInput" type="text"></input>
-
- <div class="popupRightItem" id="popupTC">
- <div class="popupTCdisplay" id="popupTCin"></div>
- <div class="popupTCdisplay" id="popupTCout"></div>
- </div>
- <div class="popupInput" id="popupTCedit">
- <span class="popupTClabel">start</span>
- <input class="popupTCeditfield" id="popupTCinMin" maxlength="2" type="text" value=""/> : <input class="popupTCeditfield" id="popupTCinSec" maxlength="2" type="text" value=""/>
- <div class="nowTCbtn" id="nowTCin">now</div>
- <br/>
- <span class="popupTClabel">end</span>
- <input class="popupTCeditfield" id="popupTCoutMin" maxlength="2" type="text" value=""/> : <input class="popupTCeditfield" id="popupTCoutSec" maxlength="2" type="text" value=""/>
- <div class="nowTCbtn" id="nowTCout">now</div> / <div class="nowTCbtn" id="eovTCout">end of video</div>
- </div>
-
- <div class="popupRightItem" id="popupLegende" title="Comment"></div>
- <textarea class="popupInput" id="popupLegendeInput" type="text"></textarea>
-
- <div class="popupRightItem" id="popupLink" title="Link"></div>
- <textarea class="popupInput" id="popupLinkInput" type="text"></textarea>
-
- <div class='popupNewTitles'>+ Playback rate</div>
- <form id='popupSpeedInput' class='flex-row playback_form popupInput popupInputNoHide'>
- <input type='radio' id='annotation_playback_speed_025' value='0.25' name='playback_rate' />
- <label class='left_menu_item' for='annotation_playback_speed_025'>0.25</label>
- <input type='radio' id='annotation_playback_speed_05' value='0.5' name='playback_rate' />
- <label class='left_menu_item' for='annotation_playback_speed_05'>0.5</label>
- <input type='radio' id='annotation_playback_speed_075' value='0.75' name='playback_rate' />
- <label class='left_menu_item' for='annotation_playback_speed_075'>0.75</label>
- <input type='radio' id='annotation_playback_speed_1' value='1' name='playback_rate' />
- <label class='left_menu_item' for='annotation_playback_speed_1'>normal</label>
- <input type='radio' id='annotation_playback_speed_125' value='1.25' name='playback_rate' />
- <label class='left_menu_item' for='annotation_playback_speed_125'>1.25</label>
- <input type='radio' id='annotation_playback_speed_15' value='1.5' name='playback_rate' />
- <label class='left_menu_item' for='annotation_playback_speed_15'>1.5</label>
- <input type='radio' id='annotation_playback_speed_175' value='1.75' name='playback_rate' />
- <label class='left_menu_item' for='annotation_playback_speed_175'>1.75</label>
- <input type='radio' id='annotation_playback_speed_2' value='2' name='playback_rate' />
- <label class='left_menu_item' for='annotation_playback_speed_2'>2</label>
- </form>
-
- <div class='popupNewTitles'>+ Tags</div>
- <input type='text' id='new_annotation_label' placeholder='Add a new tag' class='editmode' />
- <div id='popupLabelsInput' class='flex-col popupInput popupInputNoHide'>
- <!-- templates -->
- <input class='annotation_labels_template' type='checkbox' id='' value='' style='display: none;' />
- <label class='annotation_labels_template' for='' style='display: none;'></label>
- </div>
</td>
</tr>
</table>
diff --git a/capsule-prototype/js/MosaicPanelWidget.js b/capsule-prototype/js/MosaicPanelWidget.js
index 753827c..de9d947 100644
--- a/capsule-prototype/js/MosaicPanelWidget.js
+++ b/capsule-prototype/js/MosaicPanelWidget.js
@@ -49,6 +49,7 @@
let path = localOptions.getPreviewPath(tagOrDoc);
let name = tagOrDoc.getMetadata("Rekall->Name");
let url = getUrl(tagOrDoc, path);
+ let labels = tagOrDoc.getMetadata('Rekall->Labels') || '';
let div = $('<div/>').addClass('mosaic_item mosaic_button').on('click', function () {
tagOrDoc.openPopupEdit();
@@ -62,7 +63,7 @@
div.append(divImageContainer);
div.append($('<span/>').addClass('caption').text(name));
div.attr('data-rekall-labels', '');
- div.attr('data-rekall-labels', tagOrDoc.getMetadata('Rekall->Labels'));
+ div.attr('data-rekall-labels', labels.toLowerCase());
return div;
}
@@ -124,9 +125,9 @@
}
labels.forEach(l => {
- let button = $('<div/>').html($('<h2>' + l + '</h2>'));
+ let button = $('<div/>').html(l);
button.my_state = undefined;
- button.addClass('mosaic_filter_item mosaic_button');
+ button.addClass('mosaic_filter_item mosaic_button mosaic_label_filter');
button.click(ev => {
if (typeof (ev.target.my_state) === 'undefined') ev.target.my_state = true;
else ev.target.my_state = !ev.target.my_state;
@@ -135,7 +136,7 @@
let labels = new Set();
$('.mosaic_label_filter').toArray().forEach(f => {
if (f.my_state == true)
- labels.add(f.innerHTML);
+ labels.add(f.innerText.toLowerCase());
});
if (!labels.size) {
$('.mosaic_label_filter').toArray().forEach(f => {
@@ -145,7 +146,7 @@
}
console.debug('filters: ', labels);
$('.mosaic_item').toArray().forEach(t => {
- if (!labels.size || Array.from(labels).map(l => t.dataset.rekallLabels.indexOf(l) != -1).includes(true))
+ if (!labels.size || Array.from(labels).map(l => t.dataset.rekallLabels.indexOf(l.toLowerCase()) != -1).includes(true))
$(t).show();
else
$(t).hide();
@@ -187,4 +188,4 @@
app.rekall.Rekall('mosaicWidget', MosaicPanelWidget());
}
-)(window.app = window.app || {})
\ No newline at end of file
+)(window.app = window.app || {})
diff --git a/capsule-prototype/js/PopupPanelWidget.js b/capsule-prototype/js/PopupPanelWidget.js
index dd85103..2c720cb 100644
--- a/capsule-prototype/js/PopupPanelWidget.js
+++ b/capsule-prototype/js/PopupPanelWidget.js
@@ -702,7 +702,7 @@ AnnotationTagPanelEdition.prototype.appendInputEditorDiv = function (parentDiv)
parentDiv.append(this.tagPanelLabel);
if(that.canEdit){
- this.tagCreationDiv = $('<input type="text" id="new_annotation_label" placeholder="Add a new tag">');
+ this.tagCreationDiv = $('<input type="text" id="new_annotation_label" placeholder="Add a new tag" pattern="[a-zA-Zéàè0-9 ]+" title="Only alphanum characters" />');
this.tagCreationDiv.keypress(function (event) {
that.openEdition.call(that);
let keycode = (event.keyCode ? event.keyCode : event.which);
@@ -710,13 +710,19 @@ AnnotationTagPanelEdition.prototype.appendInputEditorDiv = function (parentDiv)
return;
}
+ if ($('#new_annotation_label')[0].validity.patternMismatch) {
+ that.tagCreationDiv.css('border', '2px solid red');
+ return;
+ }
+
+ that.tagCreationDiv.css('border', 'initial');
let labelToAdd = $(this).val();
let labels = getLabelArray(that.tag);
if (labels.indexOf(labelToAdd) === -1) {
that.tag.document.project.labels.push(labelToAdd);
appendTagInputWithLabel(that, labelToAdd);
}
- that.readonlyDiv.children('input[value=' + labelToAdd + ']').attr('checked', 'checked');
+ that.readonlyDiv.children("input[value='" + labelToAdd + '\']').attr('checked', 'checked');
$(this).val('');
that.closeEdition.call(that);
});
@@ -988,4 +994,4 @@ PopupPanelWidget.prototype.close = function() {
if(this.videoWasPlayingOnContentCreation) {
window.app.rekall.Rekall().timeline.play();
}
-}
\ No newline at end of file
+}
diff --git a/capsule-prototype/js/online-script.js b/capsule-prototype/js/online-script.js
index c1c5941..d2ac82c 100644
--- a/capsule-prototype/js/online-script.js
+++ b/capsule-prototype/js/online-script.js
@@ -138,33 +138,6 @@ window.onload = function() {
function setEditionControls() {
- $('#new_annotation_label').keypress(function (event) {
- var keycode = (event.keyCode ? event.keyCode : event.which);
- if (keycode != 13) {
- return;
- }
- var label = $('#new_annotation_label').val();
- var input = $('input.annotation_labels_template').first().clone();
- var html_label = $('label.annotation_labels_template').first().clone();
- var id = 'annotation_label_' + Math.floor((Math.random() * 1000));
-
- input.attr('name', 'annotation_labels');
- input.attr('checked', 'true');
- input.attr('id', id);
- input.attr('value', label);
-
- html_label.attr('for', id);
- html_label.html(label);
-
- html_label.show();
- html_label.addClass('annotation_labels').removeClass('annotation_labels_template');
- input.addClass('annotation_labels').removeClass('annotation_labels_template');
-
- $('#popupLabelsInput').append(input);
- $('#popupLabelsInput').append(html_label);
- $('#new_annotation_label').val('');
- })
-
//Drag&drop files
$(document).on({
dragenter: function (event) {
--
GitLab