<commit_before>var AnnotationPropertyPanel = SideBarPanel.extend({
    tagName: "div",
    keyAnnotationProperty: null,
    annotationPropertyLayers : [],
    /**
     * ExplorerTabs constructor
     * @param options
     */
    initialize: function (options) {
        this.browseImageView = options.browseImageView;
        this.callback = options.callback;
        //this.layer = options.layer;
    },
    /**
     * Grab the layout and call ask for render
     */
    render: function () {
        var self = this;
        require([
            "text!application/templates/explorer/AnnotationPropertyPanel.tpl.html"
        ], function (tpl) {
            self.doLayout(tpl);
        });
        return this;
    },

    initSelect: function (id) {
        var select = $(this.el).find("#selectLayersAnnotationProperty-"+id);
        select.empty();

        var first = _.template("<option id='nokey' value='<%= id %>'><%= value %></option>", { id : "selectedEmpty", value : "No Key Selected"});
        select.append(first);

        $.get("/api/annotation/property/key.json?idImage=" + id + "&user=true", function(data) {
            _.each (data.collection, function (item){
                var option = _.template("<option value='<%= id %>' class='<%= clazz %>'><%= value %></option>", { id : item.key, value : item.key, clazz : item.userId});
                select.append(option);
            });

            sortSelect();
        });

        var sortSelect = function sortArray(){
            var list= new Array();
            var el= document.getElementById('selectLayersAnnotationProperty-'+id); //:to do use class or find another way

            for(var i=0;i<el.options.length-1;i++){
                list[i]=[el.options[i+1].text, $(el.options[i+1]).attr('class')];
            }
            list=list.sort();

            for(var i=0;i<el.options.length-1;i++){
                el.options[i+1].id=list[i][0];
                el.options[i+1].value=list[i][0];
                el.options[i+1].text=list[i][0];
                $(el.options[i+1]).attr('class', list[i][1]);
            }
        }
    },

    /**
     * Render the html into the DOM element associated to the view
     * @param tpl
     */
    doLayout: function (tpl) {
        var self = this;
        var idImage = this.model.get('id');
        var el = $('#annotationPropertyPanel'+idImage);
        el.html(_.template(tpl, {id: idImage}));
        var elContent = el.find(".annotationPropertyContent");
        var sourceEvent = el.find(".toggle-content");
        this.initToggle(el, elContent, sourceEvent, "annotationPropertyContent");

        self.initSelect(idImage);

        $("#selectLayersAnnotationProperty-"+idImage).on("change", function() {
            self.updateAnnotationProperyLayers();
        });

        el.find(".refreshProperties").click(function(elem) {
           self.initSelect(idImage);
        })
    },

    updateAnnotationProperyLayers : function() {
        var self = this;
        var idImage = this.model.get('id');
        _.each(self.annotationPropertyLayers, function (annotationPropertyLayer) {<commit_msg>bug fix JIRA CYTO-37<commit_after>var AnnotationPropertyPanel = SideBarPanel.extend({
    tagName: "div",
    keyAnnotationProperty: null,
    annotationPropertyLayers : [],
    /**
     * ExplorerTabs constructor
     * @param options
     */
    initialize: function (options) {
        this.browseImageView = options.browseImageView;
        this.callback = options.callback;
        //this.layer = options.layer;
    },
    /**
     * Grab the layout and call ask for render
     */
    render: function () {
        var self = this;
        require([
            "text!application/templates/explorer/AnnotationPropertyPanel.tpl.html"
        ], function (tpl) {
            self.doLayout(tpl);
        });
        return this;
    },

    initSelect: function (id) {
        var self = this;
        var select = $(this.el).find("#selectLayersAnnotationProperty-"+id);
        select.empty();

        var first = _.template("<option id='nokey' value='<%= id %>'><%= value %></option>", { id : "selectedEmpty", value : "No Key Selected"});
        select.append(first);

        $.get("/api/annotation/property/key.json?idImage=" + id + "&user=true", function(data) {
            _.each (data.collection, function (item){
                var option = _.template("<option value='<%= id %>' class='<%= clazz %>'><%= value %></option>", { id : item.key, value : item.key, clazz : item.userId});
                select.append(option);
            });

            sortSelect();
            filterSelect();
        });

        var sortSelect = function sortArray(){
            var list= new Array();
            var el= document.getElementById('selectLayersAnnotationProperty-'+id); //:to do use class or find another way

            for(var i=0;i<el.options.length-1;i++){
                list[i]=[el.options[i+1].text, $(el.options[i+1]).attr('class')];
            }
            list=list.sort();

            for(var i=0;i<el.options.length-1;i++){
                el.options[i+1].id=list[i][0];
                el.options[i+1].value=list[i][0];
                el.options[i+1].text=list[i][0];
                $(el.options[i+1]).attr('class', list[i][1]);
            }
        }
        var filterSelect = function (){

            $("#selectLayersAnnotationProperty-"+id+" option").hide();
            $("#selectLayersAnnotationProperty-"+id+" #nokey").show();

            _.each(self.browseImageView.layers, function (layer) {

                if (layer.vectorsLayer.visibility) {
                    $("#selectLayersAnnotationProperty-"+id+" ."+layer.userID).show();
                }

            });

            $("#selectLayersAnnotationProperty-"+idImage).val('selectedEmpty');
        }
    },

    /**
     * Render the html into the DOM element associated to the view
     * @param tpl
     */
    doLayout: function (tpl) {
        var self = this;
        var idImage = this.model.get('id');
        var el = $('#annotationPropertyPanel'+idImage);
        el.html(_.template(tpl, {id: idImage}));
        var elContent = el.find(".annotationPropertyContent");
        var sourceEvent = el.find(".toggle-content");
        this.initToggle(el, elContent, sourceEvent, "annotationPropertyContent");

        self.initSelect(idImage);

        $("#selectLayersAnnotationProperty-"+idImage).on("change", function() {
            self.updateAnnotationProperyLayers();
        });

        el.find(".refreshProperties").click(function(elem) {
           self.initSelect(idImage);
        })
    },

    updateAnnotationProperyLayers : function() {
        var self = this;
        var idImage = this.model.get('id');
        _.each(self.annotationPropertyLayers, function (annotationPropertyLayer) {
{'fraction_non_alphanumeric': 0.15805604203152365, 'fraction_numerical': 0.0043782837127845885, 'mean_word_length': 2.217370892018779, 'pattern_counts': {'":': 0, '<': 25, '<?xml version=': 0, '>': 21, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3401224', 'n_tokens_mistral': 1990, 'n_tokens_neox': 1913, 'n_words': 370}