Fix tag edition / tag view creation for notes

capsule-prototype/js/PopupPanelWidget.js

@@ -661,25 +661,38 @@ TagPanelInputEditor.prototype.appendInputEditorDiv = function (parentDiv) {
         return labels;
     }
 
-    function appendTagInputWithLabel(panel, currentLabel) {
+    function appendTagInputWithLabel(panel, currentLabel, panelContainsLabel) {
         let input = panel.annotationInputTemplate.clone();
         let id = 'annotation_label_' + panel.tag.document.project.labels.indexOf(currentLabel);
         input
             .attr('id', id)
             .attr('value', currentLabel)
             .addClass('annotation_labels')
+            .prop("checked", panelContainsLabel)
+            .hide();
+
+        if(panel.canEdit){
+            input
             .change(function (event) {
                 event.stopPropagation();
                 that.closeEdition.call(that);
                 that.openEdition.call(that);
             })
-            .hide();
+        } else {
+            input
+                .change(function (event) {
+                    event.stopPropagation();
+                })
+                .attr('disabled', 'disabled');
+        }
 
         let html_label = panel.annotationLabelTemplate.clone();
         html_label
             .attr('for', id)
             .html(currentLabel)
-            .addClass('annotation_labels');
+            .addClass('annotation_labels')
+            .css('color', panel.tag.color)
+            .css('border', '1px solid ' +panel.tag.color);
 
         panel.readonlyDiv.append(input);
         panel.readonlyDiv.append(html_label);
@@ -688,6 +701,7 @@ TagPanelInputEditor.prototype.appendInputEditorDiv = function (parentDiv) {
     this.tagPanelLabel = $('<div class="popupNewTitles">+ Tags</div>');
     parentDiv.append(this.tagPanelLabel);
 
+    if(that.canEdit){
         this.tagCreationDiv = $('<input type="text" id="new_annotation_label" placeholder="Add a new tag">');
         this.tagCreationDiv.keypress(function (event) {
             that.openEdition.call(that);
@@ -707,6 +721,7 @@ TagPanelInputEditor.prototype.appendInputEditorDiv = function (parentDiv) {
             that.closeEdition.call(that);
         });
         parentDiv.append(this.tagCreationDiv);
+    }
 
     this.readonlyDiv = $('<div>');
     this.readonlyDiv
@@ -714,8 +729,12 @@ TagPanelInputEditor.prototype.appendInputEditorDiv = function (parentDiv) {
         .attr('id', 'popupLabelsInput');
 
     let _labels = getLabelArray(this.tag);
+    let tagLabels = that.tag.getMetadata('Rekall->Labels');
+    tagLabels = tagLabels && tagLabels.trim().length ? tagLabels.slice(';') :  [];
     for (let currentLabel of _labels) {
-        appendTagInputWithLabel(this, currentLabel);
+        if (!this.canEdit && !tagLabels.includes(currentLabel))
+            continue;
+        appendTagInputWithLabel(this, currentLabel, tagLabels.includes(currentLabel));
     }
     parentDiv.append(this.readonlyDiv);
 }
@@ -868,6 +887,7 @@ PopupPanelWidget.prototype.createPopupContent = function (tag) {
 
         if (this.getMetadata("Rekall->Type")?.length
             && this.getMetadata("Rekall->Type").split('/')[0] === 'image') {
+            if (popupPanelWidget.canEdit()) {
                 let editAnnotationPic = $('<div>');
                 editAnnotationPic
                     .attr('id', 'editAnnotationPic')
@@ -877,6 +897,7 @@ PopupPanelWidget.prototype.createPopupContent = function (tag) {
                     window.app.rekall.Rekall('pubSub').publish('image.annotation.edit.open', that);
                 });
                 imageBoxDiv.append(editAnnotationPic);
+            }
 
             let displayOriginalImage = $('<div>');
             displayOriginalImage