Commit c0715612 authored by Cecilia Vela Gurovic's avatar Cecilia Vela Gurovic
Browse files

Bug 1778451: Show legend in charts 

Use correct variable in template when creating the legend for charts.

In Chart.js legendTemplate uses var 'datasets'
or 'segments' depending on the type of charts
  type Doughnut/PolarArea/Pie use segments
  type Line/Radar/Bar use datasets

We have to check which one is defined in the Chart object before
modifying the legend template

Also delayed the updating of page by .5 secs so not to clash with
chart jsons stuff

behatnotneeded

Change-Id: Id3ef35a5037ac2c30d342279e0af7052584f7d16
(cherry picked from commit d09994c2)
parent 2d643dec

htdocs/admin/users/statistics.php

+0 −7
Original line number Diff line number Diff line
@@ -232,13 +232,6 @@ jQuery(function ($) { 


    $('#messages .alert-success').delay(1000).hide("slow");

    update_table_headers(null);



    if ($('.statinfoblock').length > 0) {

        var maxHeight = Math.max.apply(null, $(".statinfoblock").map(function () {

            return $(this).height();

        }).get());

        $('.statinfoblock').css('height', maxHeight + 'px');

    }

});



JS;

htdocs/js/mahara.js

+17 −2
Original line number Diff line number Diff line
@@ -870,6 +870,7 @@ jQuery(document).ready(function($) { 
 */

var chartobject;

var canvascontext;

var trueMaxHeight = 0;

function fetch_graph_data(opts) {



    if (typeof opts.extradata != 'undefined') {
@@ -913,14 +914,28 @@ function fetch_graph_data(opts) { 
            }

            chartobject = new Chart(canvascontext)[json.data.graph](JSON.parse(json.data.datastr),JSON.parse(json.data.configstr));

            legendtype = (typeof chartobject.options.datasetStroke !== 'undefined' && chartobject.options.datasetStroke == true) ? 'stroke' : 'fill';

            if (typeof chartobject.segments != 'undefined') {

                chartobject.options.legendTemplate = "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<segments.length; i++) {%><li><span style=\"background-color:<%=segments[i]." + legendtype + "Color%>\"></span><%if (segments[i].label)  {%><%=segments[i].label%><%}%></li><%}%></ul>";

            }

            else {

                chartobject.options.legendTemplate = "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<datasets.length; i++) {%><li><span style=\"background-color:<%=datasets[i]." + legendtype + "Color%>\"></span><%if (datasets[i].label)  {%><%=datasets[i].label%><%}%></li><%}%></ul>";



            }

            var legendHolder = document.createElement('div');

            legendHolder.innerHTML = chartobject.generateLegend();

            document.getElementById(opts.id + 'legend').appendChild(legendHolder.firstChild);

            if (json.data.title) {

                jQuery('#' + opts.id + 'title').text(json.data.title);

            }

            if ($('.statinfoblock').length > 0) {

                function delayResize() {

                    var maxHeight = Math.max.apply(null, $(".statinfoblock").map(function () {

                        return $(this).height();

                    }).get());

                    trueMaxHeight = Math.max(trueMaxHeight, maxHeight);

                    $('.statinfoblock').css('height', trueMaxHeight + 'px');

                }

                var timeoutID = window.setTimeout(delayResize, 500);

            }

        }

    });

}