Update assets/js/calibration.js
Browse files- assets/js/calibration.js +87 -87
    	
        assets/js/calibration.js
    CHANGED
    
    | @@ -1,87 +1,87 @@ | |
| 1 | 
            -
            $(document).ready(function(){
         | 
| 2 | 
            -
                $('#calibration-intro').on('click', 'span', function(e) {
         | 
| 3 | 
            -
                    e.preventDefault();
         | 
| 4 | 
            -
                    if (!$(this).hasClass('selected')) {
         | 
| 5 | 
            -
                        $('#calibration-intro-label > span').removeClass('selected');
         | 
| 6 | 
            -
                        $(this).addClass('selected');
         | 
| 7 | 
            -
                        let cur_img = $(this).text();
         | 
| 8 | 
            -
                        var diagram = document.getElementById("calibration-intro-img");
         | 
| 9 | 
            -
                        diagram.src = "images/metrics/intro-"+cur_img+".png";
         | 
| 10 | 
            -
                    }
         | 
| 11 | 
            -
                });
         | 
| 12 | 
            -
                $('# | 
| 13 | 
            -
                    e.preventDefault();
         | 
| 14 | 
            -
                    if (!$(this).hasClass('selected')) {
         | 
| 15 | 
            -
                        $('.formula').hide(200);
         | 
| 16 | 
            -
                        $('.formula-list > a').removeClass('selected');
         | 
| 17 | 
            -
                        $(this).addClass('selected');
         | 
| 18 | 
            -
                        var target = $(this).attr('href');
         | 
| 19 | 
            -
                        $(target).show(200);
         | 
| 20 | 
            -
                    }
         | 
| 21 | 
            -
                });
         | 
| 22 | 
            -
             | 
| 23 | 
            -
                var diagram = document.getElementById("reliability-diagram"), cifar100_ece_data;
         | 
| 24 | 
            -
                $.getJSON("images/cifar100/cifar100_ece_value.json", function(data) {cifar100_ece_data = data;});
         | 
| 25 | 
            -
                $('input[type=radio][name=models]').change(function() {diagram.src = updateFigurePath();});
         | 
| 26 | 
            -
                $('input[type=radio][name=datasets]').change(function() {diagram.src = updateFigurePath();});
         | 
| 27 | 
            -
                $('input[type=radio][name=calibration_tool]').change(function() {
         | 
| 28 | 
            -
                    if(this.value !== 'ts') $("#ts-slider").slider('disable');
         | 
| 29 | 
            -
                    else $("#ts-slider").slider('enable');
         | 
| 30 | 
            -
                    diagram.src = updateFigurePath();
         | 
| 31 | 
            -
                });
         | 
| 32 | 
            -
             | 
| 33 | 
            -
                var bin_handle = $("#bin-num");
         | 
| 34 | 
            -
                $( "#bin-slider" ).slider({
         | 
| 35 | 
            -
                    step: 1,
         | 
| 36 | 
            -
                    min: 4,
         | 
| 37 | 
            -
                    max: 40,
         | 
| 38 | 
            -
                    value: 15,
         | 
| 39 | 
            -
                    create: function() {bin_handle.text($(this).slider("value"));},
         | 
| 40 | 
            -
                    slide: function(event, ui) {bin_handle.text(ui.value);diagram.src = updateFigurePath(ui.value);},
         | 
| 41 | 
            -
                });
         | 
| 42 | 
            -
             | 
| 43 | 
            -
                var ts_handle = $("#temp-scale");
         | 
| 44 | 
            -
                $("#ts-slider").slider({
         | 
| 45 | 
            -
                    step: 0.2,
         | 
| 46 | 
            -
                    min: 1.0,
         | 
| 47 | 
            -
                    max: 1.8,
         | 
| 48 | 
            -
                    value: 1.0,
         | 
| 49 | 
            -
                    disabled: true,
         | 
| 50 | 
            -
                    create: function() {ts_handle.text($(this).slider("value"));},
         | 
| 51 | 
            -
                    slide: function( event, ui ) {ts_handle.text(ui.value);diagram.src = updateFigurePath($('#bin-slider').slider("option", "value"),ui.value);},
         | 
| 52 | 
            -
                });
         | 
| 53 | 
            -
             | 
| 54 | 
            -
                function updateFigurePath(bin_num=$('#bin-slider').slider("option", "value"),temp=$('#ts-slider').slider("option", "value")) {
         | 
| 55 | 
            -
                    var cur_dataset = $("input[type='radio'][name='datasets']:checked").val(),
         | 
| 56 | 
            -
                        cur_model = $("input[type='radio'][name='models']:checked").val(),
         | 
| 57 | 
            -
                        cur_tool = $("input[type='radio'][name='calibration_tool']:checked").val(),
         | 
| 58 | 
            -
                        actualOnly = document.getElementById("ActualOnly").checked ? "_actual" : "";
         | 
| 59 | 
            -
                    var bin_num_text = (bin_num < 10) ? "0" + bin_num.toString() : bin_num.toString();
         | 
| 60 | 
            -
                    var ece_board = document.getElementById("ece-value");
         | 
| 61 | 
            -
                    if (cur_tool === "ts")
         | 
| 62 | 
            -
                    {
         | 
| 63 | 
            -
                        var ts_text = "_t" + (temp*100).toString();
         | 
| 64 | 
            -
                        if (ts_text === "_t100") {
         | 
| 65 | 
            -
                            ece_board.innerText = parseFloat(cifar100_ece_data[cur_model]["none"][bin_num]).toFixed(5);
         | 
| 66 | 
            -
                            return "images/" + cur_dataset + "/" + cur_model + "/none/" + "bin" + bin_num_text + actualOnly + ".png";
         | 
| 67 | 
            -
                        }
         | 
| 68 | 
            -
                        else
         | 
| 69 | 
            -
                        {
         | 
| 70 | 
            -
                            ece_board.innerText = parseFloat(cifar100_ece_data[cur_model][cur_tool][temp.toString()][bin_num]).toFixed(5);
         | 
| 71 | 
            -
                            return "images/"+cur_dataset+"/"+cur_model+"/"+cur_tool+"/"+"bin"+bin_num_text+ts_text+actualOnly+".png";
         | 
| 72 | 
            -
                        }
         | 
| 73 | 
            -
                    }
         | 
| 74 | 
            -
                    else
         | 
| 75 | 
            -
                    {
         | 
| 76 | 
            -
                        ece_board.innerText = parseFloat(cifar100_ece_data[cur_model][cur_tool][bin_num]).toFixed(5);
         | 
| 77 | 
            -
                        return "images/"+cur_dataset+"/"+cur_model+"/"+cur_tool+"/"+"bin"+bin_num_text+actualOnly+".png";
         | 
| 78 | 
            -
                    }
         | 
| 79 | 
            -
                }
         | 
| 80 | 
            -
            });
         | 
| 81 | 
            -
             | 
| 82 | 
            -
            function figureOption() {
         | 
| 83 | 
            -
                var checkBox = document.getElementById("ActualOnly");
         | 
| 84 | 
            -
                var diagram = document.getElementById("reliability-diagram");
         | 
| 85 | 
            -
                if (checkBox.checked) diagram.src = diagram.src.replace(".png", "_actual.png");
         | 
| 86 | 
            -
                else diagram.src = diagram.src.replace("_actual.png", ".png");
         | 
| 87 | 
            -
            }
         | 
|  | |
| 1 | 
            +
            $(document).ready(function(){
         | 
| 2 | 
            +
                $('#calibration-intro').on('click', 'span', function(e) {
         | 
| 3 | 
            +
                    e.preventDefault();
         | 
| 4 | 
            +
                    if (!$(this).hasClass('selected')) {
         | 
| 5 | 
            +
                        $('#calibration-intro-label > span').removeClass('selected');
         | 
| 6 | 
            +
                        $(this).addClass('selected');
         | 
| 7 | 
            +
                        let cur_img = $(this).text();
         | 
| 8 | 
            +
                        var diagram = document.getElementById("calibration-intro-img");
         | 
| 9 | 
            +
                        diagram.src = "images/metrics/intro-"+cur_img+".png";
         | 
| 10 | 
            +
                    }
         | 
| 11 | 
            +
                });
         | 
| 12 | 
            +
                $('#refusal-loss-formula-list').on('click', 'a', function(e) {
         | 
| 13 | 
            +
                    e.preventDefault();
         | 
| 14 | 
            +
                    if (!$(this).hasClass('selected')) {
         | 
| 15 | 
            +
                        $('.formula').hide(200);
         | 
| 16 | 
            +
                        $('.formula-list > a').removeClass('selected');
         | 
| 17 | 
            +
                        $(this).addClass('selected');
         | 
| 18 | 
            +
                        var target = $(this).attr('href');
         | 
| 19 | 
            +
                        $(target).show(200);
         | 
| 20 | 
            +
                    }
         | 
| 21 | 
            +
                });
         | 
| 22 | 
            +
             | 
| 23 | 
            +
                var diagram = document.getElementById("reliability-diagram"), cifar100_ece_data;
         | 
| 24 | 
            +
                $.getJSON("images/cifar100/cifar100_ece_value.json", function(data) {cifar100_ece_data = data;});
         | 
| 25 | 
            +
                $('input[type=radio][name=models]').change(function() {diagram.src = updateFigurePath();});
         | 
| 26 | 
            +
                $('input[type=radio][name=datasets]').change(function() {diagram.src = updateFigurePath();});
         | 
| 27 | 
            +
                $('input[type=radio][name=calibration_tool]').change(function() {
         | 
| 28 | 
            +
                    if(this.value !== 'ts') $("#ts-slider").slider('disable');
         | 
| 29 | 
            +
                    else $("#ts-slider").slider('enable');
         | 
| 30 | 
            +
                    diagram.src = updateFigurePath();
         | 
| 31 | 
            +
                });
         | 
| 32 | 
            +
             | 
| 33 | 
            +
                var bin_handle = $("#bin-num");
         | 
| 34 | 
            +
                $( "#bin-slider" ).slider({
         | 
| 35 | 
            +
                    step: 1,
         | 
| 36 | 
            +
                    min: 4,
         | 
| 37 | 
            +
                    max: 40,
         | 
| 38 | 
            +
                    value: 15,
         | 
| 39 | 
            +
                    create: function() {bin_handle.text($(this).slider("value"));},
         | 
| 40 | 
            +
                    slide: function(event, ui) {bin_handle.text(ui.value);diagram.src = updateFigurePath(ui.value);},
         | 
| 41 | 
            +
                });
         | 
| 42 | 
            +
             | 
| 43 | 
            +
                var ts_handle = $("#temp-scale");
         | 
| 44 | 
            +
                $("#ts-slider").slider({
         | 
| 45 | 
            +
                    step: 0.2,
         | 
| 46 | 
            +
                    min: 1.0,
         | 
| 47 | 
            +
                    max: 1.8,
         | 
| 48 | 
            +
                    value: 1.0,
         | 
| 49 | 
            +
                    disabled: true,
         | 
| 50 | 
            +
                    create: function() {ts_handle.text($(this).slider("value"));},
         | 
| 51 | 
            +
                    slide: function( event, ui ) {ts_handle.text(ui.value);diagram.src = updateFigurePath($('#bin-slider').slider("option", "value"),ui.value);},
         | 
| 52 | 
            +
                });
         | 
| 53 | 
            +
             | 
| 54 | 
            +
                function updateFigurePath(bin_num=$('#bin-slider').slider("option", "value"),temp=$('#ts-slider').slider("option", "value")) {
         | 
| 55 | 
            +
                    var cur_dataset = $("input[type='radio'][name='datasets']:checked").val(),
         | 
| 56 | 
            +
                        cur_model = $("input[type='radio'][name='models']:checked").val(),
         | 
| 57 | 
            +
                        cur_tool = $("input[type='radio'][name='calibration_tool']:checked").val(),
         | 
| 58 | 
            +
                        actualOnly = document.getElementById("ActualOnly").checked ? "_actual" : "";
         | 
| 59 | 
            +
                    var bin_num_text = (bin_num < 10) ? "0" + bin_num.toString() : bin_num.toString();
         | 
| 60 | 
            +
                    var ece_board = document.getElementById("ece-value");
         | 
| 61 | 
            +
                    if (cur_tool === "ts")
         | 
| 62 | 
            +
                    {
         | 
| 63 | 
            +
                        var ts_text = "_t" + (temp*100).toString();
         | 
| 64 | 
            +
                        if (ts_text === "_t100") {
         | 
| 65 | 
            +
                            ece_board.innerText = parseFloat(cifar100_ece_data[cur_model]["none"][bin_num]).toFixed(5);
         | 
| 66 | 
            +
                            return "images/" + cur_dataset + "/" + cur_model + "/none/" + "bin" + bin_num_text + actualOnly + ".png";
         | 
| 67 | 
            +
                        }
         | 
| 68 | 
            +
                        else
         | 
| 69 | 
            +
                        {
         | 
| 70 | 
            +
                            ece_board.innerText = parseFloat(cifar100_ece_data[cur_model][cur_tool][temp.toString()][bin_num]).toFixed(5);
         | 
| 71 | 
            +
                            return "images/"+cur_dataset+"/"+cur_model+"/"+cur_tool+"/"+"bin"+bin_num_text+ts_text+actualOnly+".png";
         | 
| 72 | 
            +
                        }
         | 
| 73 | 
            +
                    }
         | 
| 74 | 
            +
                    else
         | 
| 75 | 
            +
                    {
         | 
| 76 | 
            +
                        ece_board.innerText = parseFloat(cifar100_ece_data[cur_model][cur_tool][bin_num]).toFixed(5);
         | 
| 77 | 
            +
                        return "images/"+cur_dataset+"/"+cur_model+"/"+cur_tool+"/"+"bin"+bin_num_text+actualOnly+".png";
         | 
| 78 | 
            +
                    }
         | 
| 79 | 
            +
                }
         | 
| 80 | 
            +
            });
         | 
| 81 | 
            +
             | 
| 82 | 
            +
            function figureOption() {
         | 
| 83 | 
            +
                var checkBox = document.getElementById("ActualOnly");
         | 
| 84 | 
            +
                var diagram = document.getElementById("reliability-diagram");
         | 
| 85 | 
            +
                if (checkBox.checked) diagram.src = diagram.src.replace(".png", "_actual.png");
         | 
| 86 | 
            +
                else diagram.src = diagram.src.replace("_actual.png", ".png");
         | 
| 87 | 
            +
            }
         | 
