Utilisateur:Alexisdepris/Mes scripts/HistoryGraph.js

mw.loader.using(, function () {
    $(document).ready(function () {
        if (mw.config.get('wgAction') === 'history') {
            $('#pagehistory').before('<div id="history-chart-container" style="width: 90%; height: 400px; margin-bottom: 20px;"><canvas id="historyChart"></canvas></div>');
            
            var api = new mw.Api();
            api.get({
                action: 'query',
                titles: mw.config.get('wgPageName'),
                prop: 'revisions',
                rvprop: 'timestamp',
                rvlimit: 'max',
                formatversion: 2
            }).done(function (data) {
                var revisions = data.query.pages.revisions;
                var dates = {};

                revisions.forEach(function (rev) {
                    var date = rev.timestamp.split('T');
                    if (!dates) {
                        dates = 0;
                    }
                    dates++;
                });

                var sortedDates = Object.keys(dates).sort();
                var dateLabels = sortedDates;
                var dateData = sortedDates.map(function (date) { return dates; });

                var ctx = document.getElementById('historyChart').getContext('2d');
                new Chart(ctx, {
                    type: 'line',
                    data: {
                        labels: dateLabels,
                        datasets: [{
                            label: 'Modifications par date',
                            data: dateData,
                            borderColor: 'rgba(75, 192, 192, 1)',
                            backgroundColor: 'rgba(75, 192, 192, 0.2)'
                        }]
                    },
                    options: {
                        scales: {
                            x: {
                                type: 'time',
                                time: {
                                    unit: 'day'
                                }
                            }
                        }
                    }
                });
            });
        }
    });
});